/* A deliberately quiet frame, kept inside native fullscreen with the artwork. */
:root{color-scheme:dark}
.scene-recommendations{position:fixed;z-index:24;top:calc(50% - 12px);left:50%;width:min(800px,calc(100vw - 48px));max-height:calc(100dvh - 220px);overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:18px;opacity:0;visibility:hidden;transform:translate(-50%,calc(-50% + 12px));transition:opacity .65s,transform .65s,visibility .65s;pointer-events:none;font-family:system-ui,sans-serif;padding:4px}
.scene-recommendations.show{opacity:1;visibility:visible;transform:translate(-50%,-50%);pointer-events:auto}
.recommendations-heading{grid-column:1/-1;margin:0 0 4px;text-align:center;color:#fff0d3;font:italic 32px/1.2 Georgia,serif;text-shadow:0 2px 14px #000}
.scene-recommendations a{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:30px;border:1px solid #d8b36a70;border-radius:14px;background:linear-gradient(145deg,#241d13f2,#100d09eb);backdrop-filter:blur(12px);color:#f8ebd1;text-decoration:none;box-shadow:0 8px 30px #0003}
.scene-recommendations a:hover{background:#302617f5;border-color:#f2cc83}.recommendation-label{font-size:9px;letter-spacing:.15em;color:#d8b36a}.scene-recommendations strong{font:28px/1.1 Georgia,serif;letter-spacing:-.02em}.recommendation-description{font-size:13px;line-height:1.7;color:#dccfb7}.recommendation-cta{display:flex;justify-content:space-between;align-items:center;gap:18px;align-self:stretch;margin-top:auto;padding:12px 15px;border-radius:5px;background:#edca84;color:#21180c;font-size:13px;font-weight:650}.recommendation-cta>span{font-size:20px}
#scene-recommendations.show~#end{background:none;padding:0;justify-content:flex-end;bottom:94px;top:auto;height:auto;pointer-events:none}#scene-recommendations.show~#end .end-credit,#scene-recommendations.show~#end h2,#scene-recommendations.show~#end .end-links{display:none}#scene-recommendations.show~#end button{pointer-events:auto;margin:0;background:#100d09dd}
@media(max-width:700px){.scene-recommendations{width:calc(100vw - 32px);grid-template-columns:1fr;gap:12px;max-height:calc(100dvh - 250px);top:calc(50% - 8px)}.recommendations-heading{font-size:25px}.scene-recommendations a{padding:20px;gap:12px}.scene-recommendations strong{font-size:25px}.recommendation-description{font-size:12px;line-height:1.6}.recommendation-cta{padding:10px 13px;font-size:12px}#scene-recommendations.show~#end{bottom:126px}}
.explore-hint{position:fixed;z-index:20;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:12px;align-items:flex-start;width:max-content;max-width:calc(100vw - 32px);padding:24px 30px;border:1px solid #d8b36a66;border-radius:16px;background:#100d09d9;backdrop-filter:blur(10px);box-shadow:0 12px 60px #0006;color:#f8ebd1;font:16px/1.5 system-ui,sans-serif;pointer-events:none;opacity:0}
.explore-hint.show{animation:explore-hint-fade 3.5s ease-out forwards}.explore-hint>span{display:flex;gap:18px;align-items:center}.explore-hint>span>span{color:#f2cc83;font-size:32px;min-width:60px;text-align:center}
@keyframes explore-hint-fade{0%,40%{opacity:1}100%{opacity:0}}
@media(max-width:700px){.explore-hint{gap:10px;padding:20px;font-size:13px}.explore-hint>span{gap:12px}.explore-hint>span>span{font-size:28px;min-width:48px}}
@media(pointer:coarse){.explore-hint .zoom-hint{display:none}}
@media(prefers-reduced-motion:reduce){.explore-hint.show{animation:none;opacity:1}}
.scene-nav{position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px max(22px,env(safe-area-inset-right)) 10px max(22px,env(safe-area-inset-left));background:linear-gradient(#0b0906ed,#0b090694);border-bottom:1px solid #d8b36a26;backdrop-filter:blur(12px);font-family:system-ui,sans-serif}
.scene-nav a{color:#efe3c8;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;font-size:12px;gap:8px}
.scene-nav a:hover,.end-links a:hover{color:#f6d38f}
.scene-nav .scene-brand{font:27px Georgia,serif;letter-spacing:-1px}.scene-brand span{font:10px system-ui,sans-serif;letter-spacing:.06em;color:#d8b36a;margin-left:10px}
.scene-nav nav{display:flex;gap:24px}.scene-nav a[data-scene-link=amplified]{color:#f2cc83}.scene-back{opacity:.65}
.scene-home{display:flex;align-items:center;gap:20px}.scene-nav a.scene-download{padding:0 17px;border:1px solid #f2cc83;border-radius:6px;background:#edca84;color:#21180c;font-size:12px;font-weight:700;box-shadow:0 3px 18px #0003}.scene-nav a.scene-download:hover{background:#ffe1a3;color:#21180c}.scene-download>span{font-size:21px;line-height:1}
@media(max-width:900px) and (min-width:701px){.scene-home{gap:12px}.scene-brand span{display:none}.scene-nav nav{gap:14px}}
@media(max-width:700px){.scene-home{justify-content:space-between;gap:10px}.scene-home .scene-brand span{display:none}.scene-nav a.scene-download{order:-1;min-height:44px;padding:0 13px;font-size:11px}.scene-nav:has(.scene-home){padding-top:8px}}
#title{padding:94px 24px 112px;overflow:auto;justify-content:safe center}
#title .kicker{font:10px/1.8 system-ui,sans-serif;letter-spacing:.2em;margin-bottom:16px}
#title h1{font-size:clamp(42px,7vw,90px)}#title .rule{margin:20px auto 16px}
.scene-explanation{max-width:510px;font:13px/1.7 system-ui,sans-serif;color:#d4c9b3;margin:20px auto 0}
#begin{font:11px/1.5 system-ui,sans-serif;letter-spacing:.15em;margin-top:25px;padding:17px 25px;border-radius:3px;background:#d8b36a;color:#17120b;border-color:#d8b36a;font-weight:650}
#begin:hover:not(:disabled){background:#f2ce85}#progress{margin-top:18px}#status{font:11px/1.5 system-ui,sans-serif;margin-top:8px}
.scene-notice{font:10px/1.8 system-ui,sans-serif;color:#b5aa93;margin-top:14px}#title .hint{display:none}
#bar{z-index:30;bottom:max(18px,env(safe-area-inset-bottom));width:min(920px,calc(100vw - 32px));border-radius:8px;padding:8px 12px;gap:12px;background:#100d09db;box-shadow:0 8px 32px #0003}
#bar button{font:11px system-ui,sans-serif;min-height:44px;white-space:nowrap;border:1px solid #d8b36a45;border-radius:4px;background:transparent;padding:0 12px;cursor:pointer}
#bar button:hover{border-color:#d8b36a}#bar button:disabled{opacity:.4;cursor:default}#bar #play{width:44px;padding:0}
#timeline{min-width:80px}#seek{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;touch-action:none}
#timeline:focus-within{outline:2px solid #f2cc83;outline-offset:5px;border-radius:2px}#timeline .act{font-size:10px;letter-spacing:.04em}#mode{font:9px system-ui,sans-serif;width:42px}
.scene-controls-hint{position:fixed;bottom:86px;left:0;right:0;text-align:center;z-index:5;pointer-events:none;font:10px/1.6 system-ui,sans-serif;color:#e4d3ad;text-shadow:0 1px 4px #000;transition:opacity .5s}
.nohud .scene-controls-hint,.idle .scene-controls-hint{opacity:0}#scene-message{position:fixed;z-index:35;left:20px;right:20px;bottom:98px;text-align:center;font:12px/1.5 system-ui,sans-serif;pointer-events:none}
#caption{bottom:145px}#error{z-index:25;padding-top:110px}#end{padding:100px 22px 120px}#end h2{font-size:clamp(36px,6vw,78px)}.end-credit{font:11px system-ui,sans-serif;letter-spacing:.12em;color:#d8b36a}.end-links{font:14px/2 system-ui,sans-serif;margin-top:30px}.end-links a{color:#d8b36a;text-underline-offset:4px}
a:focus-visible,button:focus-visible,canvas:focus-visible{outline:2px solid #f2cc83;outline-offset:4px}
@media(max-width:700px){.scene-nav{display:block;padding:6px 16px}.scene-nav .scene-brand{font-size:23px;min-height:30px}.scene-nav nav{gap:0;justify-content:space-between}.scene-nav a{font-size:10px;min-height:38px}.scene-brand span{font-size:9px}.scene-back{font-size:9px!important}#title{padding:114px 20px 138px}#title h1{font-size:49px}#title .kicker{font-size:8px;letter-spacing:.14em}#title .sub{font-size:18px}.scene-explanation{font-size:12px;max-width:350px;margin-top:13px}#title .rule{margin:15px auto}#begin{margin-top:18px}#bar{display:grid;grid-template-columns:44px 1fr auto;width:calc(100vw - 24px);gap:6px;padding:7px 10px;bottom:max(12px,env(safe-area-inset-bottom))}#timeline{grid-column:1/-1;grid-row:1;height:30px}#bar #play{grid-row:2}#bar #mute{justify-self:end}#bar #fullscreen{grid-row:2;grid-column:3}#mode{display:none}.scene-controls-hint{display:none}#caption{bottom:140px;left:24px;max-width:84vw}#caption .name{font-size:30px}#caption .line{font-size:16px}#scene-message{bottom:122px}}
@media(max-height:600px){#title{justify-content:flex-start;padding-top:100px}#title h1{font-size:40px}#title .sub{font-size:17px}#title .rule{margin:12px auto}.scene-notice{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}