/* Homepage preview cards: outer 16:9, resting color panel 21:9.
   Features share a restrained six-color palette. */
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) :is(.function-grid, .advanced-grid) .outpaint-preview-card {
  position: relative;
  display: block !important;
  container-type: inline-size;
  align-self: start;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  isolation: isolate;
  text-align: left;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card > * { position: absolute; pointer-events: none; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-color {
  inset: 0;
  background: var(--home-preview-color, #c9cdea);
  transform: scaleY(0.76190476);
  transform-origin: top;
  transition: transform 360ms cubic-bezier(.22, 1, .36, 1);
}
/* One white rounded panel contains each complete feature group. */
html:not([data-theme="dark"]) body :is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions).function-board {
  background: #fff !important;
  border-radius: 16px !important;
  padding: 20px !important;
  box-sizing: border-box;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-art {
  width: auto;
  max-width: none;
  height: var(--preview-art-height, 72.19%);
  left: auto;
  right: var(--preview-art-right, 3%);
  top: var(--preview-art-top, 2%);
  transform-origin: 100% 0;
  transform: none !important;
  transition: transform 360ms cubic-bezier(.22, 1, .36, 1) !important;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-icon {
  left: 8%; top: 60%; width: 11.2%; aspect-ratio: 1;
  display: grid; place-items: center;
  background: #fff; color: #686868; border-radius: 4px;
}
/* This one requested icon shadow must outrank the global four-ID shadow reset. */
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions):is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions):is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions):is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions):is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-icon {
  box-shadow: 0 3px 8px rgba(35, 39, 65, 0.18), 0 1px 2px rgba(35, 39, 65, 0.12) !important;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-icon svg { width: 66%; height: 66%; stroke-width: 1.6; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-title {
  left: 6%; bottom: 5.5%; color: #666;
  font-size: clamp(14px, 4.6cqw, 22px); font-weight: 650; line-height: 1.2;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-description {
  right: 6%; bottom: 6%; color: #707070;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: clip;
  font-size: clamp(10px, 3.2cqw, 14px); font-weight: 400; line-height: 1.4;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-description-track {
  display: inline-flex;
  align-items: center;
  width: max-content;
  gap: 24px;
  white-space: nowrap;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-description-copy {
  display: none;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-description.is-scrolling .outpaint-preview-description-copy {
  display: inline;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-description.is-scrolling .outpaint-preview-description-track {
  animation: home-preview-description-scroll var(--preview-scroll-duration, 7s) linear infinite;
  will-change: transform;
}
@keyframes home-preview-description-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 12px)); }
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-hover {
  top: 8%; left: 4.5%; display: grid; justify-items: start; gap: 3px;
  color: #252735; opacity: 0; transform: translateY(8px);
  transition: opacity 150ms ease, transform 280ms cubic-bezier(.22, 1, .36, 1);
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-hover strong {
  color: #666;
  font-size: clamp(14px, 4cqw, 17px); font-weight: 650; line-height: 1.2;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-hover > span {
  padding: 1px 8px; border-radius: 99px; background: #fff;
  font-size: clamp(10px, 3cqw, 13px); font-weight: 500; line-height: 1.3;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) :is(.outpaint-preview-icon, .outpaint-preview-title, .outpaint-preview-description) {
  transition: opacity 120ms ease, transform 250ms ease;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card:is(:hover, :focus-visible) .outpaint-preview-color { transform: scaleY(1); }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card:is(:hover, :focus-visible) .outpaint-preview-art { transform: translate(-2%, 6%) scale(1.16) !important; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card:is(:hover, :focus-visible) :is(.outpaint-preview-icon, .outpaint-preview-title, .outpaint-preview-description) {
  opacity: 0; transform: translateY(12px);
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card:is(:hover, :focus-visible) .outpaint-preview-hover { opacity: 1; transform: translateY(0); }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card:focus-visible { outline: 3px solid #6268d9; outline-offset: 3px; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .free-generate-preview-card { --home-preview-color: #e8d2bc; }
/* Size visible artwork by height, compensating for each original PNG's transparent margins.
   Visible default artwork leaves 2% of the outer card above and below the 21:9 panel. */
#ai-tools [data-feature="free-generate"] { --preview-art-height: 77.24%; --preview-art-top: .222%; --preview-art-right: 1.52%; }
#ai-tools [data-feature="outpaint"] { --preview-art-height: 105.516%; --preview-art-top: -17.432%; --preview-art-right: -.716%; }
#ai-tools [data-feature="local-edit"] { --preview-art-height: 76.115%; --preview-art-top: 1.019%; --preview-art-right: .004%; }
#ai-tools [data-feature="image-to-psd"] { --preview-art-height: 81.901%; --preview-art-top: -6.153%; --preview-art-right: .269%; }
#ai-tools [data-feature="watermark-remove"] { --preview-art-height: 84.39%; --preview-art-top: -4.061%; --preview-art-right: -5.218%; }
#ai-tools [data-feature="background-remove"] { --preview-art-height: 85.308%; --preview-art-top: -5.855%; --preview-art-right: .305%; }
#ai-tools [data-feature="view-change"] { --preview-art-height: 102.75%; --preview-art-top: -13.327%; --preview-art-right: 2.042%; }
#ai-tools [data-feature="hd-upscale"] { --preview-art-height: 74.594%; --preview-art-top: 1.107%; --preview-art-right: 2.073%; }
#ai-tools [data-feature="text-edit"] { --preview-art-height: 82.265%; --preview-art-top: -4.742%; --preview-art-right: -.068%; }
#ai-tools [data-feature="reverse-prompt"] { --preview-art-height: 89.701%; --preview-art-top: -5.103%; --preview-art-right: -1.414%; }
#ai-tools [data-feature="print-extract"] { --preview-art-height: 100.126%; --preview-art-top: -10.815%; --preview-art-right: -.371%; }
#ai-tools [data-feature="colors"] { --preview-art-height: 88.486%; --preview-art-top: -4.355%; --preview-art-right: -1.125%; }
/* Reserved feature colors; artwork is added individually without restoring old thumbnails. */
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="local-edit"] { --home-preview-color: #e4ccd5; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="image-to-psd"] { --home-preview-color: #cad7e5; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="watermark-remove"] { --home-preview-color: #c8ddd3; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="background-remove"] { --home-preview-color: #d8dec2; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="view-change"] { --home-preview-color: #e8d2bc; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="hd-upscale"] { --home-preview-color: #c9cdea; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="text-edit"] { --home-preview-color: #e4ccd5; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="reverse-prompt"] { --home-preview-color: #cad7e5; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="print-extract"] { --home-preview-color: #c8ddd3; }
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .pending-preview-card[data-feature="colors"] { --home-preview-color: #d8dec2; }
#video-tools [data-media-tool="video-generate"] { --home-preview-color: #e8d2bc; }
#video-tools [data-media-tool="video-remix"] { --home-preview-color: #c9cdea; }
#video-tools [data-media-tool="video-smart-create"] { --home-preview-color: #e4ccd5; }
#video-tools [data-media-tool="video-analysis"] { --home-preview-color: #cad7e5; }
#video-tools [data-media-tool="media-download"] { --home-preview-color: #c8ddd3; }
#audio-tools [data-media-tool="audio-processing"] { --home-preview-color: #d8dec2; }
#audio-tools [data-media-tool="speech-synthesis"] { --home-preview-color: #e8d2bc; }
/* Each media asset has different transparent padding. These values align the visible
   artwork to the same narrow top and bottom margins inside the preview area. */
#video-tools [data-media-tool="video-generate"] > .outpaint-preview-art {
  --preview-art-height: 91.16%;
  --preview-art-top: -6.55%;
  --preview-art-right: 0%;
}
#video-tools [data-media-tool="video-remix"] > .outpaint-preview-art {
  --preview-art-height: 96.38%;
  --preview-art-top: -10.33%;
  --preview-art-right: 0%;
}
#video-tools [data-media-tool="video-smart-create"] > .outpaint-preview-art {
  --preview-art-height: 119.88%;
  --preview-art-top: -21.66%;
  --preview-art-right: 0%;
}
#video-tools [data-media-tool="video-analysis"] > .outpaint-preview-art {
  --preview-art-height: 104.29%;
  --preview-art-top: -14.39%;
  --preview-art-right: 0%;
}
#video-tools [data-media-tool="media-download"] > .outpaint-preview-art {
  --preview-art-height: 81.30%;
  --preview-art-top: -2.05%;
  --preview-art-right: 0%;
}
#audio-tools [data-media-tool="audio-processing"] > .outpaint-preview-art {
  --preview-art-height: 103.40%;
  --preview-art-top: -13.55%;
  --preview-art-right: 0%;
}
#audio-tools [data-media-tool="speech-synthesis"] > .outpaint-preview-art {
  --preview-art-height: 92.04%;
  --preview-art-top: -5.91%;
  --preview-art-right: 0%;
}
@media (prefers-reduced-motion: reduce) {
  :is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card > * { transition: none !important; }
}
/* Industry source markup remains available to its shell, but is never presented. */
:is(#advanced-functions, #fashion-functions) .industry-preview-card > .industry-preview-source {
  display: none !important;
}
:is(#advanced-functions, #fashion-functions) .industry-preview-card {
  grid-column: auto !important;
  grid-row: auto !important;
}
:is(#advanced-functions, #fashion-functions) .industry-preview-card::before,
:is(#advanced-functions, #fashion-functions) .industry-preview-card::after { display: none !important; }
:is(#advanced-functions, #fashion-functions) .industry-preview-card .industry-preview-footer {
  left: 6%;
  right: 2.5%;
  bottom: 5.5%;
  display: flex;
  align-items: baseline;
  gap: clamp(8px, 3cqw, 14px);
  min-width: 0;
}
:is(#advanced-functions, #fashion-functions) .industry-preview-card .outpaint-preview-title {
  position: static;
  flex: 0 0 auto;
  max-width: none;
  white-space: nowrap;
}
:is(#advanced-functions, #fashion-functions) .industry-preview-card .outpaint-preview-description {
  position: static;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  max-width: none;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
:is(#advanced-functions, #fashion-functions) .industry-preview-card .outpaint-preview-description.is-scrolling {
  text-align: left;
}
:is(#ai-tools, #video-tools, #audio-tools, #advanced-functions, #fashion-functions) .outpaint-preview-card[hidden] { display: none !important; }