/* Optional opening film. It is a viewport layer, never a replacement page. */
.intro-replay-button{min-width:44px;min-height:44px;padding:10px 0;font:9px var(--mono);letter-spacing:.055em;white-space:nowrap;color:#c3c5ba}.intro-replay-button:hover{color:var(--signal)}.intro-replay-short{display:none}
body.intro-active{overflow:hidden}
.intro-overlay{position:fixed;inset:0;width:100vw;height:100svh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#050605;color:var(--white);overflow:hidden;opacity:0;transition:opacity 350ms ease;z-index:1000}.intro-overlay[open]{display:block}.intro-overlay.is-visible{opacity:1}.intro-overlay.is-closing{opacity:0}.intro-overlay::backdrop{background:#050605;backdrop-filter:none}.intro-film{position:absolute;inset:0;background:#050605;overflow:hidden}.intro-film::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0506059c 0,#05060500 24%,#05060500 62%,#050605c9 100%)}
.intro-film video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;object-position:center;background:#050605}
.intro-meta{position:absolute;z-index:2;top:max(22px,env(safe-area-inset-top));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));display:flex;justify-content:space-between;gap:20px;font:8px/1.5 var(--mono);letter-spacing:.12em;color:#bebfb5;pointer-events:none}.intro-meta span:last-child{color:#85897c;text-align:right}
.intro-final{position:absolute;z-index:2;left:24px;right:24px;bottom:23%;margin:0;text-align:center;font:900 clamp(25px,3.2vw,50px)/1 var(--display);letter-spacing:-.025em;color:var(--paper);opacity:0;transform:translateY(7px);transition:opacity 160ms ease,transform 160ms ease;pointer-events:none;text-shadow:0 2px 30px #000}.intro-final.is-visible{opacity:1;transform:none}
.intro-controls{position:absolute;z-index:3;left:max(24px,calc(env(safe-area-inset-left) + 12px));right:max(24px,calc(env(safe-area-inset-right) + 12px));bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px));display:flex;align-items:center;justify-content:space-between;gap:16px}.intro-controls button{min-width:44px;min-height:44px;border:1px solid #eeece35c;background:#080a08d9;color:var(--white);font:9px/1.3 var(--mono);letter-spacing:.07em;padding:12px 16px;backdrop-filter:blur(8px)}.intro-controls button:hover{border-color:var(--signal);color:var(--signal)}.intro-controls button:focus-visible{outline:2px solid var(--signal);outline-offset:4px}.intro-skip{display:flex;align-items:center;gap:28px}.intro-skip::after{content:"↗";color:var(--signal);font-size:15px}.intro-sound[aria-pressed=true]{border-color:var(--signal);color:var(--signal)}
@media(max-width:700px){.header .header-actions{gap:10px}.intro-replay-long{display:none}.intro-replay-short{display:inline}.intro-meta{top:max(18px,env(safe-area-inset-top));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));font-size:7px}.intro-controls{left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));gap:10px}.intro-controls button{padding:11px 12px;font-size:8px}.intro-skip{gap:12px}.intro-final{bottom:20%;font-size:clamp(24px,8vw,36px)}}
@media(max-width:370px){.intro-replay-button{font-size:8px}.header .header-actions{gap:7px}.intro-controls{align-items:stretch}.intro-skip{flex:1;justify-content:space-between}}
@media(prefers-reduced-motion:reduce){.intro-overlay,.intro-final{transition:none}}
