.nightwatch-intro{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;box-sizing:border-box;margin:0;padding:0;border:0;background:#000;color:var(--paper,#eee);overflow:hidden;z-index:120}
.nightwatch-intro::backdrop{background:#000}
.intro-shot{position:absolute;inset:0;box-sizing:border-box;margin:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;padding:24px 5vw 88px;opacity:min(clamp(0,calc(var(--phase)*9),1),clamp(0,calc((1 - var(--phase))*9),1))}
.intro-shot[hidden]{display:none}
/* Fit the complete illustration in both axes. Move its tint with it so the
   tint cannot extend beyond the artwork during motion. */
.intro-art{position:relative;isolation:isolate;flex:none;width:min(960px,100%,calc((100dvh - 240px)*1.5));aspect-ratio:3/2;background:#000;transform:translateY(calc((1 - var(--phase))*4px))}
.intro-art img{width:100%;height:100%;display:block;object-fit:contain;filter:grayscale(1)}
.intro-art::after{content:'';position:absolute;inset:0;background:var(--paper,#fff);mix-blend-mode:multiply;pointer-events:none}
.intro-shot figcaption{position:relative;max-width:700px;text-align:center;font:clamp(22px,3.1vw,34px)/1.45 var(--font-reading,Redaction,Georgia);margin:0;text-wrap:balance}
.intro-controls{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));right:5vw;display:flex;gap:12px}
.intro-controls button{font:12px monospace;color:var(--paper,#eee);background:#080808;border:1px solid #555;padding:12px 16px;min-height:44px;cursor:pointer}
.intro-controls button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.nightwatch-intro[data-paused=true] .intro-shot{opacity:1}
@media(max-width:600px){.intro-shot{padding-inline:20px}.intro-shot figcaption{font-size:24px}.intro-controls{right:20px}}
@media(max-height:500px){.intro-shot{padding:12px 5vw 68px;gap:12px}.intro-art{width:min(760px,100%,calc((100dvh - 155px)*1.5))}.intro-shot figcaption{font-size:18px;line-height:1.3}.intro-controls{bottom:12px}}
@media(prefers-reduced-motion:reduce){.intro-shot{opacity:1}.intro-art{transform:none}}
