/* Soft light fields, composited using transform/opacity; no per-frame JavaScript. */
.ambient-background{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:#080b10;contain:strict}
.ambient-layer{position:absolute;width:125vw;height:130vh;inset:-15vh auto auto -12vw;will-change:transform;transform-origin:50% 50%}
.ambient-teal{background:radial-gradient(ellipse at 24% 35%,#2464747d 0%,#1b4a6055 20%,transparent 53%);animation:ambient-tide 28s ease-in-out infinite alternate;animation-delay:-7s}
.ambient-violet{background:radial-gradient(ellipse at 72% 35%,#58486660 0%,#36395445 24%,transparent 56%);animation:ambient-drift 34s ease-in-out infinite alternate;animation-delay:-15s}
.ambient-warm{background:radial-gradient(ellipse at 50% 90%,#76553d40 0%,#684b442b 18%,transparent 49%);animation:ambient-glow 25s ease-in-out infinite alternate;animation-delay:-9s}
.ambient-vignette{position:absolute;inset:0;background:linear-gradient(180deg,#03070922,transparent 35%,#05070955),radial-gradient(ellipse at 50% 35%,transparent 20%,#05080b4d 100%)}
.ambient-background::after{content:"";position:absolute;inset:0;background-image:url('../assets/grain.svg');background-repeat:repeat;background-size:192px 192px;opacity:.12;mix-blend-mode:soft-light;pointer-events:none}
#app{position:relative;z-index:1}.platform{background:transparent}.platform-nav{background:#080c1080;backdrop-filter:blur(16px)}.studio-creation{background:transparent}.studio-gallery{background:#080c1055}.platform footer{background:#080c1055}.studio-composer{background:linear-gradient(125deg,#28333eab,#1a242bbd);backdrop-filter:blur(20px);box-shadow:inset 0 1px #ffffff10,0 16px 70px #0003;transition:border-color 220ms ease,box-shadow 220ms ease,background 220ms ease}.studio-composer:focus-within{border-color:#9ebec9;box-shadow:inset 0 1px #ffffff18,0 0 0 3px #91bfc40a,0 18px 80px #0004}.studio-heading h1{ text-shadow:0 8px 60px #b7d6da12}.gallery-empty{background:#12202b50;backdrop-filter:blur(8px)}
.btn,.composer-create,.account-button,.platform-nav nav a,.studio-shortcuts a,.engine-option,.aesthetic-option,.ratio-grid span,.studio-launch,.project-card,.gallery-item,.new-project-tile{transition:transform 180ms ease,background 180ms ease,border-color 180ms ease,box-shadow 180ms ease,color 180ms ease}
@media(hover:hover) and (pointer:fine){.btn:not(:disabled):hover,.composer-create:not(:disabled):hover,.account-button:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 5px 20px #0002}.engine-option:hover,.aesthetic-option:hover{transform:translateY(-2px);border-color:#7a929e}.project-card:hover,.gallery-item:hover,.new-project-tile:hover{transform:translateY(-3px);box-shadow:0 14px 35px #0003}.studio-launch:hover>span{transform:translateX(2px)}.studio-launch>span{transition:transform 180ms ease}}
.btn:not(:disabled):active,.composer-create:not(:disabled):active,.account-button:not(:disabled):active,.engine-option:active,.aesthetic-option:active{transform:scale(.98)}
.motion-toggle{color:#c8d9de;border-color:#5369747a}.motion-toggle[aria-pressed=true]{background:#ffffff12}.motion-toggle:disabled{opacity:.6}
/* Glass surfaces: saturated backdrop, restrained sheen, readable dark base. */
.studio-composer{position:relative;isolation:isolate;background:linear-gradient(125deg,#9ab9c21b,#16252f8c 42%,#53606d35);border:1px solid #bfdde64d;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);box-shadow:inset 0 1px 0 #effaff40,inset 1px 0 0 #e6f7ff12,inset 0 -1px 0 #ffffff0d,0 20px 70px #0004}
.studio-composer::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(125deg,#e1f8ff12,transparent 30%,transparent 72%,#ccbfe60b);pointer-events:none;z-index:-1}
.studio-composer::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 18px #daf2ff06;pointer-events:none}
.studio-composer:focus-within{box-shadow:inset 0 1px 0 #effaff50,inset 1px 0 0 #e6f7ff1a,0 0 0 3px #91bfc40c,0 20px 70px #0004}
.btn.composer-chip,.attach-control,.studio-tool-label,.platform .balance-pill,.account-button{background:linear-gradient(135deg,#ffffff13,#ffffff05);border-color:#c6e0eb2e;box-shadow:inset 0 1px #ffffff14,0 3px 12px #0001;backdrop-filter:blur(12px) saturate(130%)}
.composer-options{border-top-color:#dbf1ff18}.gallery-empty,.fashion-app-card,.cost-panel,.action-panel,.brief,.wizard-panel{background:linear-gradient(125deg,#293d485c,#14212b94);border-color:#bdd9e72e;backdrop-filter:blur(18px) saturate(125%);box-shadow:inset 0 1px #ffffff12,0 10px 40px #0002}
.platform-nav{background:linear-gradient(120deg,#19263080,#0c131a91);box-shadow:inset 0 -1px #ffffff08}
/* Discrete display/overlay transitions keep native focus trapping and Escape. */
dialog{background:linear-gradient(145deg,#52636e88,#18232dd9 50%,#2b303dc4);backdrop-filter:blur(28px) saturate(140%);-webkit-backdrop-filter:blur(28px) saturate(140%);border-color:#afcbd35c;box-shadow:0 30px 100px #0009,inset 0 1px #f1fcff38,inset 1px 0 #ffffff0d;opacity:0;transform:translateY(16px) scale(.965);transition:opacity 190ms ease,transform 240ms cubic-bezier(.2,.8,.2,1),display 240ms allow-discrete,overlay 240ms allow-discrete}
dialog[open]{opacity:1;transform:translateY(0) scale(1)}
dialog::backdrop{background-color:#02060a00;backdrop-filter:blur(0);transition:background-color 220ms ease,backdrop-filter 220ms ease,display 240ms allow-discrete,overlay 240ms allow-discrete}
dialog[open]::backdrop{background-color:#02060a9c;backdrop-filter:blur(10px)}
@starting-style{dialog[open]{opacity:0;transform:translateY(16px) scale(.965)}dialog[open]::backdrop{background-color:#02060a00;backdrop-filter:blur(0)}}
@keyframes ambient-tide{0%{transform:translate(-8%,-5%) rotate(-7deg) scale(1)}50%{transform:translate(6%,4%) rotate(3deg) scale(1.07)}100%{transform:translate(14%,-3%) rotate(10deg) scale(1.12)}}
@keyframes ambient-drift{0%{transform:translate(8%,-6%) rotate(6deg) scale(1.04)}50%{transform:translate(-7%,8%) rotate(-5deg) scale(1.12)}100%{transform:translate(-15%,-2%) rotate(-12deg) scale(1)}}
@keyframes ambient-glow{0%{transform:translate(-10%,10%) scale(1);opacity:.6}100%{transform:translate(15%,-10%) scale(1.16);opacity:1}}
.ambient-paused .ambient-layer,.page-hidden .ambient-layer{animation-play-state:paused}
@media(max-width:700px){.ambient-layer{width:160vw;left:-30vw}.studio-composer{backdrop-filter:blur(12px)}.platform-nav .top-actions{gap:8px}.motion-toggle{width:38px;height:38px}.platform-nav{backdrop-filter:blur(12px)}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.studio-composer,.gallery-empty,.fashion-app-card,.cost-panel,.action-panel,.brief,.wizard-panel{background:#1a2730}dialog{background:#1d2a33}.platform-nav{background:#101a22}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.ambient-layer{will-change:auto;transform:none!important}.btn:hover,.composer-create:hover,.account-button:hover,.project-card:hover,.gallery-item:hover,.new-project-tile:hover,.engine-option:hover,.aesthetic-option:hover,.btn:active,.composer-create:active,.account-button:active,.engine-option:active,.aesthetic-option:active{transform:none!important}}