/* 2026-08-23 commerce, storage and theme refinements. Loaded last intentionally. */
.resolution-inline{display:flex;align-items:center;gap:6px;padding:5px 7px;border:1px solid var(--line);border-radius:10px;background:#0b0f10}.resolution-inline>span{color:#7f8b8f;font-size:10px;margin:0 3px}.resolution-inline button{min-width:52px;height:34px;padding:0 13px;border:1px solid transparent;border-radius:8px;background:transparent;color:#829094;font-size:10px;font-weight:700;transition:border-color .18s,background .18s,color .18s,transform .18s}.resolution-inline button:hover{color:#d9f9fb;background:rgba(105,225,232,.07)}.resolution-inline button.selected{color:#bdf7f9;border-color:rgba(105,225,232,.42);background:rgba(105,225,232,.12);box-shadow:inset 0 0 0 1px rgba(105,225,232,.05)}
.five-packages{grid-template-columns:repeat(5,minmax(0,1fr))!important}.custom-package label{display:block;color:#8a9598;font-size:9px;margin:16px 0 12px}.custom-package label>div{display:flex;align-items:center;gap:7px;margin-top:7px;padding:0 10px;height:39px;border:1px solid var(--line);border-radius:8px;background:#0b0e10}.custom-package label input{width:100%;border:0;outline:0;background:transparent;color:inherit;font:700 15px var(--font)}
.shared-storage-usage{margin:-14px 0 28px;padding:15px 17px;border:1px solid var(--line);border-radius:11px;background:#0a0e0f;box-shadow:0 12px 34px rgba(0,0,0,.12)}.shared-storage-usage>div{display:flex;justify-content:space-between;gap:20px;align-items:center}.shared-storage-usage span,.shared-storage-usage b{font-size:10px}.shared-storage-usage b{color:#d9e5e5}.shared-storage-usage small{display:block;margin-top:8px;color:#6e7b7e;font-size:9px}.storage-meter{display:block!important;height:5px;margin-top:11px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden}.storage-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#76e2e8,#55bcc3);box-shadow:0 0 12px rgba(100,221,229,.3)}
.asset-search-row{display:flex;justify-content:flex-end;margin:-12px 0 20px}.asset-search-row .search-box{width:min(320px,100%)}.asset-search-row .search-box input{width:100%}
.welcome-reward-button{height:34px;padding:0 13px;border:1px solid rgba(103,224,231,.28);border-radius:999px;background:rgba(103,224,231,.09);color:#aeeff2;font-size:10px;font-weight:700;white-space:nowrap;box-shadow:0 0 20px rgba(84,206,215,.06)}.welcome-reward-button:hover{background:rgba(103,224,231,.16);transform:translateY(-1px)}.welcome-reward-card{padding:2px 1px 4px}.welcome-reward-card>span{color:var(--accent);font-size:9px;letter-spacing:1.5px}.welcome-reward-card>strong{display:block;margin:12px 0 7px;font-size:44px;line-height:1;color:#eefafa}.welcome-reward-card>strong small{font-size:13px;color:#8c999c}.welcome-reward-card>p{color:#8c979a;line-height:1.75}.welcome-reward-card>div{margin-top:9px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.025);color:#aeb9bb;font-size:10px}.welcome-reward-card i{color:var(--accent);font-style:normal;margin-right:7px}

/* The light theme used to load before later dark component files. These final rules make every working surface readable. */
:root[data-theme="light"]{--bg:#f3f6f5;--surface:#fff;--surface-2:#f7f9f8;--surface-3:#eaf0ee;--line:rgba(25,45,42,.11);--line-strong:rgba(25,45,42,.19);--text:#17211f;--muted:#66726f;--soft:#929c99;--accent:#249da5;--accent-2:#55cbd1;--accent-bg:rgba(40,165,174,.09);--gold:#9a741e;--danger:#c64d45}
:root[data-theme="light"] body{background:radial-gradient(circle at 88% 9%,rgba(74,188,196,.09),transparent 31%),#f3f6f5;color:var(--text)}
:root[data-theme="light"] .topbar{background:rgba(250,252,251,.92);border-color:var(--line);color:var(--text)}
:root[data-theme="light"] .nav-link,:root[data-theme="light"] .brand,:root[data-theme="light"] .studio-head h1,:root[data-theme="light"] .library-head h1,:root[data-theme="light"] .credits-head h1{color:#17211f}
:root[data-theme="light"] .nav-link.active,:root[data-theme="light"] .nav-link:hover{color:#136f76}
:root[data-theme="light"] .credit-pill,:root[data-theme="light"] .ghost-icon,:root[data-theme="light"] .profile-button{background:#fff;color:#303c39;border-color:var(--line)}
:root[data-theme="light"] .creation-panel,:root[data-theme="light"] .preview-panel,:root[data-theme="light"] .panel-head,:root[data-theme="light"] .settings-block,:root[data-theme="light"] .model-row,:root[data-theme="light"] .generation-footer,:root[data-theme="light"] .preview-head,:root[data-theme="light"] .preview-canvas,:root[data-theme="light"] .director-insight,:root[data-theme="light"] .insight-head,:root[data-theme="light"] .credits-overview article,:root[data-theme="light"] .package-section,:root[data-theme="light"] .credit-package,:root[data-theme="light"] .credit-history,:root[data-theme="light"] .history-row,:root[data-theme="light"] .library-head,:root[data-theme="light"] .filter-bar,:root[data-theme="light"] .task-card,:root[data-theme="light"] .asset-summary article,:root[data-theme="light"] .asset-card,:root[data-theme="light"] .asset-add,:root[data-theme="light"] .shared-storage-usage,:root[data-theme="light"] .resolution-inline{background:#fff;color:#17211f;border-color:var(--line);box-shadow:0 10px 30px rgba(34,61,57,.055)}
:root[data-theme="light"] .prompt-shell,:root[data-theme="light"] .parameter-strip,:root[data-theme="light"] .parameter-pill,:root[data-theme="light"] .custom-package label>div,:root[data-theme="light"] .model-popover,:root[data-theme="light"] .parameter-popover{background:#f8faf9;color:#1c2926;border-color:var(--line)}
:root[data-theme="light"] .prompt-shell textarea,:root[data-theme="light"] .search-box input,:root[data-theme="light"] .custom-package label input{color:#1c2926}
:root[data-theme="light"] .prompt-shell textarea::placeholder,:root[data-theme="light"] .search-box input::placeholder{color:#89938f}
:root[data-theme="light"] .panel-head h2,:root[data-theme="light"] .block-label h2,:root[data-theme="light"] .preview-head h2,:root[data-theme="light"] .insight-head b,:root[data-theme="light"] .credit-package b,:root[data-theme="light"] .credits-section-title h2,:root[data-theme="light"] .history-row b,:root[data-theme="light"] .task-meta h3,:root[data-theme="light"] .asset-card h3{color:#182320}
:root[data-theme="light"] .panel-head p,:root[data-theme="light"] .block-label p,:root[data-theme="light"] .insight-head small,:root[data-theme="light"] .insight-body small,:root[data-theme="light"] .credit-package dt,:root[data-theme="light"] .credit-package dd,:root[data-theme="light"] .history-row span,:root[data-theme="light"] .task-meta p,:root[data-theme="light"] .asset-card p,:root[data-theme="light"] .shared-storage-usage small{color:#6d7975}

.promo-bar p{min-width:min(560px,58vw);text-align:center;transition:opacity .18s ease,transform .18s ease}.promo-bar p.changing{opacity:0;transform:translateY(-4px)}.promo-dots{display:flex;gap:4px;align-items:center}.promo-dots i{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.22;transition:.2s}.promo-dots i.active{width:12px;border-radius:4px;opacity:.85}.task-card{user-select:none}.project-code,.transaction-project-id{border:0;background:transparent;color:var(--accent);padding:0;font:600 11px/1.5 var(--font);letter-spacing:.25px;text-align:left;user-select:all;cursor:copy}.project-code:hover,.transaction-project-id:hover{text-decoration:underline;text-underline-offset:3px}.transaction-project-empty{color:var(--soft)}.history-row{grid-template-columns:minmax(90px,.7fr) minmax(220px,1.8fr) minmax(110px,.75fr) minmax(100px,.7fr) minmax(80px,.5fr)}

@media(max-width:720px){.promo-dots{display:none}.promo-bar p{min-width:0;text-align:left}.history-row{grid-template-columns:1fr 1.2fr auto}.history-row>:nth-child(4){display:none}.history-row>:nth-child(3){display:block}.project-code,.transaction-project-id{font-size:10px}}
:root[data-theme="light"] .preview-canvas{background:#f5f8f7}:root[data-theme="light"] .director-insight{background:#f7faf9}:root[data-theme="light"] .filter-bar button.selected{color:#16211e}:root[data-theme="light"] .filter-bar button span{background:#e7efed}:root[data-theme="light"] .search-box{background:#fff;border-color:var(--line)}
:root[data-theme="light"] .resolution-inline button{color:#65716e}:root[data-theme="light"] .resolution-inline button:hover{color:#177d84;background:rgba(40,165,174,.07)}:root[data-theme="light"] .resolution-inline button.selected{color:#126f76;border-color:rgba(34,151,159,.35);background:rgba(40,165,174,.1)}
:root[data-theme="light"] .storage-meter{background:#e6edeb}:root[data-theme="light"] .shared-storage-usage b{color:#26332f}:root[data-theme="light"] .welcome-reward-button{background:#e7f7f7;color:#126f76;border-color:#b9e7e8}
:root[data-theme="light"] .app-modal-card,:root[data-theme="light"] .auth-card,:root[data-theme="light"] .recharge-drawer{background:#fff;color:#17211f;border-color:var(--line)}
:root[data-theme="light"] .welcome-reward-card>strong{color:#17211f}:root[data-theme="light"] .welcome-reward-card>div{background:#f7faf9;color:#55625e}
/* Keep deliberately cinematic marketing art dark, but force its copy to remain legible. */
:root[data-theme="light"] .hero,:root[data-theme="light"] .home-entry-card{color:#f2f7f5}:root[data-theme="light"] .hero h1,:root[data-theme="light"] .hero h2,:root[data-theme="light"] .home-entry-card h2{color:#f2f7f5}:root[data-theme="light"] .hero p,:root[data-theme="light"] .home-entry-card p{color:#9eaaa6}
:root[data-theme="light"] .hero h1 em{background:linear-gradient(90deg,#f4faf8 4%,#a8eaed 62%,#5fcbd1);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}

@media(max-width:1180px){.five-packages{grid-template-columns:repeat(3,minmax(0,1fr))!important}.five-packages .credit-package:nth-child(n+4){grid-column:span 1}}
@media(max-width:760px){.five-packages{grid-template-columns:1fr!important}.welcome-reward-button{padding:0 9px;font-size:9px}.resolution-inline{width:100%;justify-content:flex-start}.resolution-inline button{flex:1}.asset-search-row{justify-content:stretch}}