:root { color-scheme:dark;
  --brand-deep:#15171a; --brand-deep-2:#30333a; --brand-deep-3:#08090b;
  --brand-accent:#f7ce2d; --brand-accent-2:#fce48f; --brand-accent-dark:#8a6106;
  --brand-pop:#6904a7; --brand-pop-2:#a159d6; --brand-surface:#400552; --brand-surface-2:#5c067e;
  --brand-paper:#f5f0e6; --brand-muted:#aba59a;
  --brand-deep-rgb:21,23,26; --brand-deep-2-rgb:48,51,58; --brand-accent-rgb:247,206,45;
  --brand-pop-rgb:105,4,167; --brand-pop-2-rgb:161,89,214; --brand-surface-rgb:64,5,82; --brand-surface-2-rgb:92,6,126; --brand-paper-rgb:245,240,230;
  /* Compatibility aliases for older shell selectors; their fallback identity is Signature. */
  --blue:var(--brand-deep); --blue2:var(--brand-deep-2); --yellow:var(--brand-accent); --paper:var(--brand-paper); }
* { box-sizing: border-box; }
html, body, #store-shell, #store-frame-host { width:100%; height:100%; height:100dvh; margin:0; overflow:hidden; }
body { background:var(--brand-deep-3); color:var(--paper); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button, input { font:inherit; }
#store-frame-host { position:absolute; inset:0; }
.store-frame { position:absolute; inset:0; display:block; width:100%; height:100%; border:0; background:var(--brand-deep-3); touch-action:none; }
body.store-intro .store-frame { touch-action:pan-y; }
#x-cursor { position:fixed; left:50%; top:50%; width:15px; height:15px; margin:-7.5px 0 0 -7.5px; z-index:150;
  pointer-events:none; opacity:0; border-radius:50%; border:2px solid rgba(255,255,255,.92);
  background:rgba(255,255,255,.16); box-shadow:0 0 0 1px rgba(0,0,0,.5),0 1px 5px rgba(0,0,0,.55);
  transition:opacity .16s,transform .1s,border-color .1s,background .1s; }
body.store-locked:not(.store-inspecting) #x-cursor, #x-cursor.free-show { opacity:1; }
#x-cursor.over { border-color:var(--brand-accent); background:rgba(var(--brand-accent-rgb),.32); transform:scale(1.4);
  box-shadow:0 0 11px rgba(var(--brand-accent-rgb),.62),0 0 0 1px rgba(0,0,0,.4); }
.skip-link { position:fixed; top:10px; left:10px; z-index:500; padding:10px 14px; border-radius:5px; color:var(--brand-deep-3); background:var(--brand-accent); font-weight:800; transform:translateY(-160%); transition:transform .15s ease; }
.skip-link:focus { transform:none; }
.skip-link-browse { left:auto; right:10px; }
.no-script a { color:var(--brand-accent); }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
#store-loader { position:fixed; inset:0; z-index:90; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:11px; background:radial-gradient(circle at 50% 43%,var(--brand-deep-2) 0,var(--brand-deep) 35%,var(--brand-deep-3) 100%); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .35s ease,visibility 0s linear .35s; }
html[data-palette="signature"] #store-loader { background:radial-gradient(circle at 50% 43%,#55229e 0,#491d87 40%,#08090b 100%)!important; }
body.store-loading #store-loader { opacity:1; visibility:visible; pointer-events:auto; transition:none; }
.loader-mark,.loader-copy,.loader-track { transition:opacity .06s linear; }
#store-loader.revealing .loader-mark,#store-loader.revealing .loader-copy,#store-loader.revealing .loader-track { opacity:0; }
/* Same bar the shelf restock uses, so opening the store reads as the same act as restocking one. Every step is a
   real milestone posted by the room (see store-shell.js progress table) — nothing here creeps on a timer. */
.loader-track { position:relative; width:min(390px,calc(100vw - 64px)); height:8px; overflow:hidden; border:1px solid rgba(var(--brand-accent-rgb),.72); border-radius:999px; background:var(--brand-deep); box-shadow:inset 0 1px 3px rgba(0,0,0,.55); }
.loader-track i { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--brand-accent),var(--brand-accent-2)); box-shadow:0 0 12px rgba(var(--brand-accent-rgb),.72); transition:width .34s ease; }
/* The room is a same-origin iframe, so it shares this thread: while its module evaluates and the fixtures build,
   nothing here can repaint and the bar genuinely cannot move. A transform animation runs on the compositor, so
   this sheen keeps sweeping through that block and the store never reads as hung. */
.loader-track::after { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(90deg,transparent,rgba(var(--brand-paper-rgb),.3),transparent); transform:translateX(-100%); animation:loader-sheen 1.3s linear infinite; }
@keyframes loader-sheen { to { transform:translateX(100%); } }
#store-loader.revealing .loader-track::after { animation:none; }
@media (prefers-reduced-motion:reduce) { .loader-track i { transition:none; } .loader-track::after { animation:none; } }
.loader-mark { color:var(--brand-accent); font-size:clamp(24px,4vw,48px); line-height:1; font-weight:850; letter-spacing:-.02em; text-shadow:0 4px 0 var(--brand-deep-3); }
.loader-copy { max-width:calc(100vw - 32px); padding:0 8px; color:rgba(var(--brand-paper-rgb),.72); font-size:13px; letter-spacing:.08em; text-align:center; }
.share-hit { display:none; position:fixed; z-index:120; padding:0; margin:0; border:0; background:transparent; -webkit-tap-highlight-color:transparent; }
.share-toast { position:fixed; left:50%; bottom:max(28px,env(safe-area-inset-bottom)); z-index:180; max-width:calc(100vw - 32px); padding:10px 17px; border:1px solid rgba(var(--brand-paper-rgb),.15); border-radius:999px; background:rgba(var(--brand-deep-rgb),.9); color:var(--brand-paper); box-shadow:0 12px 40px rgba(0,0,0,.42); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:opacity .18s ease,transform .18s ease; }
.share-toast.show { opacity:1; transform:translate(-50%,0); }
.trailer-modal { position:fixed; inset:0; z-index:220; display:grid; place-items:center; padding:clamp(14px,4vw,48px); }
.trailer-modal[hidden] { display:none; }
.trailer-scrim { position:absolute; inset:0; background:rgba(var(--brand-deep-rgb),.88); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.trailer-card { position:relative; z-index:1; width:min(1080px,94vw,calc(177.78svh - 170.67px)); }
.trailer-frame { overflow:hidden; width:100%; aspect-ratio:16/9; border:1px solid rgba(var(--brand-accent-rgb),.5); border-radius:10px; background:#000; box-shadow:0 28px 100px #000; }
.trailer-frame iframe { width:100%; height:100%; border:0; }
.trailer-close { position:absolute; right:0; top:-48px; width:40px; height:40px; border:1px solid rgba(var(--brand-paper-rgb),.3); border-radius:50%; background:rgba(var(--brand-deep-rgb),.8); color:var(--brand-paper); font-size:27px; line-height:1; cursor:pointer; }
.trailer-close:focus-visible,.trailer-close:hover { outline:2px solid var(--brand-accent); outline-offset:2px; }
.no-script { position:fixed; inset:0; display:grid; place-items:center; margin:0; padding:24px; background:var(--brand-deep-3); text-align:center; }
@media (pointer:coarse) { #x-cursor { display:none; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.001ms!important; animation-duration:.001ms!important; animation-iteration-count:1!important; } }
