*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#130e09;color:#ead9bf;font:14px system-ui}button{font:inherit}main{width:100%;max-width:1800px;margin:auto}.stage{position:relative;width:100%;aspect-ratio:1672/941;overflow:hidden;isolation:isolate;background:#201810}.scene,.full-stage,.scene-layer,.hotspots,.labels{position:absolute;inset:0;width:100%;height:100%}.scene-layer{object-fit:fill;pointer-events:none}.prop{position:absolute;transform-origin:0 0;pointer-events:none}.prop>img,.prop>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.prop>[hidden],[hidden]{display:none!important}.scene{visibility:hidden}.scene.loaded{visibility:visible}.full-stage{pointer-events:none;mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}.labels{z-index:300;pointer-events:none}.plaque{position:absolute;transform:none;aspect-ratio:2168/725;background:transparent center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center;color:#30170d;font-family:KaiTi,STKaiti,"Noto Serif CJK SC",serif;font-weight:700;opacity:0;transition:opacity 200ms ease 0ms;pointer-events:none}.plaque.shown{opacity:1;transition:opacity 350ms ease 140ms}.plaque span{transform:translateY(-1px);white-space:nowrap}.hotspots{z-index:400}.hotspots a{outline:none}.hotspots polygon{fill:transparent;stroke:transparent;stroke-width:2;cursor:pointer}.hotspots a:focus-visible polygon{stroke:#ffe2a5;stroke-dasharray:5 3}.utility{min-height:38px;display:flex;gap:10px;align-items:center;padding:6px 12px;font-size:12px}.utility [role=status]{flex:1;color:#c6b597}.utility button,.qa button{border:1px solid #705230;background:#2b2117;color:#ead9bf;padding:5px 10px;border-radius:4px;cursor:pointer}.utility button:focus-visible,.qa button:focus-visible{outline:2px solid #ffe2a5;outline-offset:2px}.loading{position:absolute;inset:0;display:grid;place-items:center;color:#c6b597}.qa{padding:10px 14px;border-top:1px solid #705230;font-size:12px}.qa pre{white-space:pre-wrap;max-height:35vh;overflow:auto}.qa .buttons{display:flex;flex-wrap:wrap;gap:6px}.sample-figure{left:37.31576998301334%;top:6.562805526036129%;width:27.28421052631579%;height:48.479489904357074%;z-index:40}.sample-logo{z-index:50}@media(prefers-reduced-motion:reduce){.plaque,.plaque.shown{transition:none}}@media(max-width:650px){.utility{gap:6px;padding:6px;font-size:11px}}

#composition{z-index:1}#sample{z-index:0}

.review-note{font-size:12px;color:#c6b597;margin:0 12px 10px}

@media(pointer:coarse){.utility button{min-height:44px;min-width:64px}.hotspots a[data-id="account"] polygon{stroke-width:110px}}

/* Real download/decode gate, deliberately opaque while actors warm offscreen. */
.loading{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 38%,#39291c 0%,#19120d 68%);padding:24px;pointer-events:auto}.load-card{width:min(430px,100%);border:1px solid #7f5b35;outline:1px solid #42301e;outline-offset:7px;padding:42px 34px;text-align:center;background:#211810;color:#e6d2b3;box-shadow:0 22px 75px #0005}.load-logo{display:block;width:min(260px,100%);height:auto;margin:0 auto 26px}.load-rule{width:54px;height:1px;background:#a37948;margin:0 auto 27px}.load-card h1{font-family:KaiTi,STKaiti,serif;font-size:26px;line-height:1.4;font-weight:500;margin:0 0 13px}.load-card p{font-size:14px;line-height:1.7;color:#baa88f;margin:0 0 24px;min-height:48px;overflow-wrap:anywhere}.load-meter{display:flex;gap:12px;align-items:center}.load-meter progress{appearance:none;flex:1;width:0;height:5px;border:0;background:#4c3927;border-radius:0}.load-meter progress::-webkit-progress-bar{background:#4c3927}.load-meter progress::-webkit-progress-value{background:#caa46d}.load-meter progress::-moz-progress-bar{background:#caa46d}.load-meter span{font-size:14px;font-variant-numeric:tabular-nums;min-width:42px;text-align:right;color:#d4b281}.load-card button{background:#5d3924;color:#f0dabb;border:1px solid #a17745;padding:10px 24px;min-height:44px;font:inherit;margin-top:26px;cursor:pointer}.plaque.shown{opacity:1;transition:opacity 80ms ease 0ms}.plaque{transition:opacity 100ms ease 0ms}

/* Reserve a quiet lower-right control area rather than covering an art hotspot. */
.sound-toggle{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:900;min-height:44px;min-width:104px;padding:8px 14px;border:1px solid #936b42;border-radius:4px;background:#281c12;color:#e9d7b8;font:14px system-ui;cursor:pointer;box-shadow:0 3px 14px #0005}.sound-toggle[aria-pressed=true]{border-color:#d1a66b;background:#4d3220}.sound-toggle:focus-visible{outline:2px solid #e9c68c;outline-offset:3px}.logo-control{position:absolute;left:41.20813%;top:4.88842%;width:18.48086%;height:6.37620%;z-index:450;border:0;padding:0;background:transparent;cursor:pointer;touch-action:manipulation}.logo-control:focus-visible{outline:1px solid #e6c18b;outline-offset:5px}#logo-visual{transition:filter 130ms ease}#logo-visual.logo-hover{filter:brightness(1.17) contrast(1.02)}#logo-visual.logo-pressed{filter:brightness(.8) contrast(1.06)}@media(prefers-reduced-motion:reduce){#logo-visual{transition:none}}

.language-switch{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));z-index:900;min-height:44px;display:inline-flex;align-items:center;padding:8px 14px;border:1px solid #795a39;border-radius:4px;background:#281c12;color:#e9d7b8;font:14px system-ui;text-decoration:none}.language-switch:focus-visible{outline:2px solid #e9c68c;outline-offset:3px}html[lang=en] .plaque{font-family:Georgia,"Times New Roman",serif}

/* Viewport owns the page. Source art remains proportionate inside it. */
html,body{width:100%;height:100%;overflow:hidden}main{width:100vw;height:100dvh;max-width:none;margin:0}.stage{width:100%;height:100%;aspect-ratio:auto}.scene-plane{position:absolute;left:50%;top:50%;width:min(100vw,calc(100dvh * 1.776833156));height:min(100dvh,calc(100vw * .562799043));transform:translate(-50%,-50%);isolation:isolate}.viewport-backdrop{position:absolute;inset:-12px;background-position:center;background-size:cover;filter:blur(7px) brightness(.84);pointer-events:none}.loading{z-index:800}.utility{position:fixed;left:50%;bottom:10px;transform:translateX(-50%);z-index:600;min-height:0;padding:0;max-width:calc(100vw - 260px)}.utility #status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.utility button{pointer-events:auto}.qa{position:fixed;inset:5px 5px auto;z-index:950;max-height:30vh;overflow:auto;background:#130e09e8}.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}
.language-switch{width:clamp(110px,10vw,156px);height:auto;aspect-ratio:1.54;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;filter:drop-shadow(0 3px 3px #0008);transition:filter 120ms ease,transform 120ms ease;touch-action:manipulation}.travel-object{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.language-switch:hover,.language-switch:focus-visible{filter:brightness(1.12) drop-shadow(0 4px 4px #0009)}.language-switch:active{transform:translateY(2px) scale(.97)}
.sound-toggle{width:52px;height:52px;min-width:52px;min-height:52px;padding:10px;border-radius:50%;border:1px solid #a77d47;background:radial-gradient(circle at 35% 25%,#5c432b,#291a10 72%);box-shadow:inset 0 1px 2px #f2d39b4d,0 3px 7px #0008;color:#d8b578;display:grid;place-items:center;touch-action:manipulation}.sound-icon{width:30px;height:30px;overflow:visible}.speaker-body{fill:currentColor;stroke:#f7dba2;stroke-width:.65;stroke-linejoin:round}.sound-waves,.sound-slash{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.sound-toggle[data-sound-state=on] .sound-slash,.sound-toggle:not([data-sound-state=on]) .sound-waves{display:none}.sound-toggle[data-sound-state=on]{background:radial-gradient(circle at 35% 25%,#795a35,#3b2818 72%);color:#f1d399}.sound-toggle:active{transform:translateY(1px)}.sound-toggle[data-sound-state=pending]{opacity:.65}@media(prefers-reduced-motion:reduce){.language-switch{transition:none}}
.sound-toggle{width:44px;height:44px;min-width:44px;min-height:44px;padding:7px}.language-switch{width:110px}@media(min-aspect-ratio:3/2) and (max-aspect-ratio:2/1){.language-switch{left:55%;bottom:6px}}@media(min-aspect-ratio:2/1){.language-switch{width:76px;left:8px;bottom:10px}}

.stage.viewport-project .scene-plane{left:0;top:0;width:100%;height:100%;transform:none}.stage.viewport-project .viewport-backdrop{display:none}

.language-switch{left:calc(8px * var(--desk-scale,1));bottom:calc(10px * var(--desk-scale,1));width:calc(78px * var(--desk-scale,1));height:calc(50.64935px * var(--desk-scale,1));min-height:0}.sound-toggle{right:calc(14px * var(--desk-scale,1));bottom:calc(14px * var(--desk-scale,1));width:calc(45px * var(--desk-scale,1));height:calc(45px * var(--desk-scale,1));padding:calc(7px * var(--desk-scale,1));min-width:0;min-height:0;border-width:calc(1px * var(--desk-scale,1))}.sound-icon{width:calc(30px * var(--desk-scale,1));height:calc(30px * var(--desk-scale,1))}
/* Labels stay in-place in the DOM: both enter and leave visibly interpolate. */
.plaque,.plaque.shown{transition:opacity 300ms ease 0ms}
@media(prefers-reduced-motion:reduce){.plaque,.plaque.shown{transition:none}}
/* Small viewport-top glass notch; scene and actors retain their existing scale. */
#logo-visual.logo-program{filter:none!important;transition:none;pointer-events:none}
.logo-glass{position:absolute;left:41.35765550239234%;top:0;width:17.284688995215312%;height:9.303931987247609%;background:rgba(8,9,12,.62);border:calc(.85px * var(--desk-scale,1)) solid rgba(255,239,208,.18);border-top:0;border-radius:0 0 calc(13.6px * var(--desk-scale,1)) calc(13.6px * var(--desk-scale,1));backdrop-filter:blur(calc(6.8px * var(--desk-scale,1)));-webkit-backdrop-filter:blur(calc(6.8px * var(--desk-scale,1)));box-shadow:0 calc(4.25px * var(--desk-scale,1)) calc(14.45px * var(--desk-scale,1)) #0005,inset 0 -1px 0 #fff1}
.logo-program-canvas{position:absolute;left:42.67942583732058%;top:0;width:14.641148325358852%;height:9.249734325185974%;pointer-events:none}
/* Corner utilities float independently of the desk projection. */
.sound-toggle{left:auto;top:calc(14px * var(--desk-scale,1));right:calc(14px * var(--desk-scale,1));bottom:auto}
.language-switch{left:calc(8px * var(--desk-scale,1));right:auto;top:calc(10px * var(--desk-scale,1));bottom:auto}
/* Normal loading is only the original animated wordmark and true progress. */
.load-card{width:min(360px,100%);border:0;outline:0;padding:0;background:transparent;box-shadow:none}
.load-logo-host{position:relative;width:min(320px,100%);aspect-ratio:360/128;margin:0 auto 24px;overflow:hidden}
#loading-logo-source{position:absolute;max-width:none;width:464.444444%;height:735.15625%;left:-184.444444%;top:0}
.load-logo-host .logo-program{position:absolute;inset:0;width:100%;height:100%;filter:none;transition:none}
.load-logo-host .logo-glass{display:none}
.load-logo-host .logo-program-canvas{left:0;top:0;width:100%;height:100%}
.load-meter{width:min(320px,100%);margin:0 auto;gap:0}
.load-card p{min-height:0;margin:14px 0 0;font-size:13px}
.load-card button{margin-top:14px}
.loading{background:rgba(24,27,31,.66);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden}
.load-glass-background{position:absolute;inset:-28px;background-position:center;background-size:cover;opacity:.38;filter:blur(22px) saturate(.65);pointer-events:none}
.load-card{position:relative;z-index:1}
.load-meter progress{background:rgba(235,240,247,.18)}
.load-meter progress::-webkit-progress-bar{background:rgba(235,240,247,.18)}
.load-meter progress::-webkit-progress-value{background:rgba(234,241,247,.9)}
.load-meter progress::-moz-progress-bar{background:rgba(234,241,247,.9)}
.load-meter{gap:12px}.load-meter #load-percent{min-width:42px;color:rgba(238,243,248,.9);font-size:13px;font-variant-numeric:tabular-nums;text-align:right}
/* The gate reaches actual100percent before this purely visual crossfade. */
[data-reveal="loading"] .scene-plane,[data-reveal="loading"] .language-switch,[data-reveal="loading"] .sound-toggle{opacity:0}
[data-reveal="entering"] .scene-plane,[data-reveal="entering"] .language-switch,[data-reveal="entering"] .sound-toggle{opacity:1;transition:opacity 500ms ease}
[data-reveal="entering"] .loading{opacity:0;transition:opacity 500ms ease}
[data-reveal="ready"] .scene-plane,[data-reveal="ready"] .language-switch,[data-reveal="ready"] .sound-toggle{opacity:1}
@media(prefers-reduced-motion:reduce){[data-reveal="entering"] .scene-plane,[data-reveal="entering"] .language-switch,[data-reveal="entering"] .sound-toggle,[data-reveal="entering"] .loading{transition:none}}