:root{color-scheme:dark;--bg:#101622;--panel:#1a2537;--ink:#f1f5ff;--muted:#b7c8dc;--accent:#9af3cd;--edge:#465c77;font:16px/1.5 system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#23364d,var(--bg) 66%);color:var(--ink);min-height:100vh}
main{width:min(72rem,calc(100% - 2rem));margin:auto;padding:clamp(1rem,5vw,4rem) 0}.play{max-width:42rem}.kicker{color:var(--accent);font:700 .82rem ui-monospace,monospace;letter-spacing:.13em}h1{font-size:clamp(2rem,6vw,3.6rem);line-height:1.05;margin:.4em 0}h2{margin-top:0}header,.actions{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem}header{justify-content:space-between}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));gap:1rem;margin-top:1rem}.grid>section,#card,#notice{border:1px solid var(--edge);border-radius:1rem;padding:clamp(1rem,4vw,2rem);background:var(--panel)}
label{display:block;color:var(--muted);margin-bottom:.3rem}input,select,button{font:inherit;border:1px solid var(--edge);border-radius:.55rem;padding:.65rem .85rem;color:var(--ink);background:#101a2a;max-width:100%}input{width:100%;margin-bottom:.6rem}button{cursor:pointer;font-weight:700}button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}button:disabled{opacity:.55;cursor:default}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#card>button{display:block;margin:.55rem 0;width:100%;text-align:left}#card[data-stage="7"]{border-color:#e6c47d}#card[data-stage="10"],#card[data-stage="11"]{border-color:var(--accent)}#card[data-stage="11"] h1{color:var(--accent)}progress{width:100%;accent-color:var(--accent)}.muted,#connection,dt{color:var(--muted)}dd{margin:0 0 .65rem;font-weight:700}li{margin-bottom:.4rem;overflow-wrap:anywhere}#events{max-height:24rem;overflow:auto}
#notice{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);width:min(36rem,calc(100% - 2rem));box-shadow:0 0 2rem #0009}#notice.glitch{border:2px solid #ff849c;color:#ffb2c1;font-family:ui-monospace,monospace}

#board{margin:1rem 0;padding:1rem;border:1px solid var(--edge);border-radius:1rem;background:var(--panel)}
#board h2,.theory h2{font-size:1rem;margin:0 0 .55rem}
#sections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;list-style:none;padding:0;margin:0}
#sections li{margin:0;border:1px solid var(--edge);border-radius:.55rem;padding:.45rem .6rem}
#sections small{display:block;color:var(--muted)}
#sections [data-status="Open"]{border-color:var(--accent)}
#sections [data-status="Completed"] small{color:var(--accent)}
#sections [data-status="Locked"]{background:#101a2a;color:var(--muted)}
#evidence{margin-top:.75rem}#evidence summary{cursor:pointer}
.theory{padding:.8rem;background:#101a2a;border-radius:.55rem;margin:.8rem 0}
.theory ul{margin:.4rem 0;padding-left:1.3rem}
#card[data-stage="4"]{border-color:#e6c47d}
#card[data-stage="8"] h1{color:var(--accent)}
@media(max-width:34rem){#sections{grid-template-columns:repeat(2,minmax(0,1fr))}}
.trip-flyer{display:block;width:100%;height:auto;border-radius:.55rem;margin-top:1rem}


/* Operation Emma terminal */
body:has(.player){background:linear-gradient(#3a90d215 1px,transparent 1px),linear-gradient(90deg,#3a90d215 1px,transparent 1px),radial-gradient(ellipse at top,#102947,#050910 62%);background-size:28px 28px,28px 28px,auto;color:#e8f5ff}
.player{--panel:#0b1727;--edge:#31516f;--ink:#e8f5ff;--muted:#acc7df;--accent:#7be7ff;max-width:48rem}
.masthead{display:grid;gap:.35rem;padding:1.25rem 1.4rem;background:#091727;border:1px solid #4886b4;border-left:6px solid #7be7ff;border-radius:.7rem;box-shadow:0 0 24px #2d9be42e}
.masthead strong{font-size:clamp(1.8rem,7vw,4rem);line-height:1;letter-spacing:-.04em}
.masthead span,.player #board h2,.player #sections small{font:700 .76rem ui-monospace,monospace;letter-spacing:.12em;color:#91d8ff;text-transform:uppercase}
.player #board,.player #card{box-shadow:0 0 22px #2787c21c}
.player #sections{gap:1rem;background:linear-gradient(#345c7b,#345c7b) center/1px 100% no-repeat,linear-gradient(90deg,#345c7b,#345c7b) center/100% 1px no-repeat}
.player #sections li{position:relative;font-weight:700;background:#101d30;min-width:0;overflow-wrap:anywhere;padding-left:1.4rem}
.player #sections li::before{content:'';position:absolute;left:.5rem;top:.86rem;width:.45rem;height:.45rem;border-radius:50%;background:#70869e}
.player #sections [data-status="Open"]{border-color:#7be7ff;background:#13324a;box-shadow:0 0 14px #7be7ff40}
.player #sections [data-status="Open"]::before,.player #sections [data-status="Completed"]::before{background:#7be7ff;box-shadow:0 0 8px #7be7ff}
.player #sections [data-status="Completed"]{background:#10283a;border-color:#4d9fba}
.player #sections [data-status="Locked"] small{color:#a9bfd4}
.player #card>button{border-left:4px solid #5ea7df}
.player #card>button:hover:not(:disabled){background:#15354f;color:#d7f7ff}
.player #card[data-scene="destination"],.player #card[data-scene="final"]{border-color:#7be7ff;background:radial-gradient(ellipse at top right,#163d63,#0b1727 66%)}
.player #card[data-scene="final"] h1{color:#9bedff;text-shadow:0 0 18px #53bdff55}
.player #city-guess{display:block;margin-bottom:.65rem}
#answer-popup{position:fixed;top:1rem;right:1rem;z-index:2;max-width:calc(100% - 2rem);padding:.65rem 1.15rem;background:#12304c;color:#e5f8ff;border:1px solid #7be7ff;border-radius:.65rem;box-shadow:0 0 22px #53c9ff66;font-weight:800;pointer-events:none}
#answer-popup.pop{animation:signal-confirmed .32s ease-out both}
#answer-popup.signal-error{background:#241a35;color:#ffe4f3;border-color:#f19ad3;box-shadow:0 0 18px #d94dab55}
#answer-popup.signal-error.pop{animation:signal-glitch .22s ease-out both}
@keyframes signal-confirmed{from{opacity:.3;transform:scale(.95)}to{opacity:1;transform:none}}
@keyframes signal-glitch{from{transform:translateX(-4px);text-shadow:3px 0 #8edfff}50%{transform:translateX(3px);text-shadow:-2px 0 #f19ad3}to{transform:none;text-shadow:none}}
@media(prefers-reduced-motion:reduce){#answer-popup.pop,#answer-popup.signal-error.pop{animation:none}}
.player #card.signal-rejected{border-color:#f19ad3;box-shadow:0 0 22px #d94dab55}
.player #card input[type="checkbox"]{width:auto;margin:0 .65rem 0 0;accent-color:#7be7ff}.player #card label:has(input[type="checkbox"]){display:flex;align-items:center;min-height:2.75rem;padding:.55rem .75rem;margin:.5rem 0;background:#101d30;border:1px solid #31516f;border-radius:.55rem;cursor:pointer}.player #card label:has(input:checked){border-color:#7be7ff;color:#e8f5ff}

/* A temporary signal interruption keeps the quiz state in place. */
#answer-popup{top:50%;right:auto;left:50%;transform:translate(-50%,-50%);width:max-content;text-align:center}
#answer-popup.signal-error{inset:0;transform:none;width:auto;max-width:none;border:0;border-radius:0;padding:1rem;box-shadow:none;background:repeating-linear-gradient(0deg,#050910 0 3px,#10263d 3px 4px);color:#dffaff}
#answer-popup.signal-error:not([hidden]){display:grid;align-content:center;justify-items:center;gap:.65rem}
#answer-popup.signal-error strong{font:900 clamp(2rem,10vw,6rem)/1 ui-monospace,monospace;letter-spacing:.06em;text-shadow:3px 0 #48bbff,-2px 0 #3659a7}
#answer-popup.signal-error small{color:#9ddcff;font:700 clamp(.65rem,2.5vw,1rem) ui-monospace,monospace;letter-spacing:.15em}

#answer-popup.signal-error{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:75vw;min-height: min(75dvh,32rem);max-height:90dvh;overflow-x:hidden;overflow-y:auto;pointer-events:auto;border:1px solid #7be7ff;border-radius:.9rem;box-shadow:0 0 0 100vmax #050910b3,0 0 28px #53c9ff77;padding:clamp(.75rem,4vw,2rem)}
#answer-popup.signal-error strong{font-size:clamp(1.35rem,6vw,4rem)}
#answer-popup.signal-error p{margin:.35rem auto;max-width:38ch;color:#e8f5ff}
#answer-popup.signal-error button{background:#12304c;border-color:#7be7ff;color:#fff}

#answer-popup.signal-error{isolation:isolate}
#answer-popup.signal-error::before,#answer-popup.signal-error::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit}
#answer-popup.signal-error::before{background:repeating-linear-gradient(0deg,transparent 0 6px,#45b8ff29 7px 8px,transparent 9px 12px);animation:terminal-scan 1.25s linear infinite}
#answer-popup.signal-error::after{background:linear-gradient(90deg,transparent 2%,#1d79d655 17%,transparent 33%,#63caff45 64%,transparent 95%);animation:terminal-tear 1.7s steps(1,end) infinite}
@keyframes terminal-scan{from{background-position:0 0}to{background-position:0 24px}}
@keyframes terminal-tear{
  0%,84%,100%{clip-path:inset(22% 0 74%);transform:translateX(-6%)}
  14%{clip-path:inset(65% 0 30%);transform:translateX(8%)}
  29%{clip-path:inset(39% 0 57%);transform:translateX(-3%)}
  46%{clip-path:inset(8% 0 88%);transform:translateX(12%)}
  61%{clip-path:inset(79% 0 15%);transform:translateX(-10%)}
}
@media(prefers-reduced-motion:reduce){#answer-popup.signal-error::before,#answer-popup.signal-error::after{animation:none}#answer-popup.signal-error::after{display:none}}

.release{margin-top:1.2rem}.release #release-clock{font:700 clamp(1.4rem,7vw,3rem) ui-monospace,monospace;color:#7be7ff}.release a{color:#7be7ff}
#briefing{margin-top:1rem;padding:1rem 1.25rem;background:var(--panel);border:1px solid var(--edge);border-radius:.7rem}#traveller-check-in select{display:block;width:100%;margin-bottom:1rem}#traveller-callback{overflow-wrap:anywhere}
#visited-cities{margin:1rem 0;padding:.6rem;border:1px solid var(--edge);border-radius:.55rem}#visited-cities legend{padding:0 .35rem}#visited-cities small{color:var(--muted)}.city-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.25rem .5rem}.city-grid label{display:flex;align-items:center;gap:.5rem;min-height:2rem}.city-grid input{width:auto;margin:0;accent-color:#7be7ff}

.countdown-page{min-height:100dvh;display:grid;align-content:center;text-align:center}
.countdown-page .release{position:relative;isolation:isolate;overflow:hidden;background:repeating-linear-gradient(0deg,#050910 0 3px,#10263d 3px 4px);border-color:#7be7ff;box-shadow:0 0 28px #53c9ff45}
.countdown-page .release::before,.countdown-page .release::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none}
.countdown-page .release::before{background:repeating-linear-gradient(0deg,transparent 0 6px,#45b8ff29 7px 8px,transparent 9px 12px);animation:terminal-scan 1.25s linear infinite}
.countdown-page .release::after{background:linear-gradient(90deg,transparent 2%,#1d79d655 17%,transparent 33%,#63caff45 64%,transparent 95%);animation:terminal-tear 1.7s steps(1,end) infinite}
.countdown-page .release h1,.countdown-page #release-clock{animation:countdown-jitter 8s step-end infinite}
.countdown-page #release-clock{font-variant-numeric:tabular-nums;animation-delay:2s}
@keyframes countdown-jitter{
  0%,90%,97%,100%{transform:none;text-shadow:none}
  91%,95%{transform:translateX(-3px);text-shadow:3px 0 #52c7ff,-2px 0 #416bd4}
  93%{transform:translateX(3px);text-shadow:-3px 0 #52c7ff}
}
@media(prefers-reduced-motion:reduce){.countdown-page .release::before,.countdown-page .release::after,.countdown-page .release h1,.countdown-page #release-clock{animation:none}.countdown-page .release::after{display:none}}

.reveal-action{text-align:center}