/* Shared interface styling; game stimuli and timing remain owned by each task. */
html{background:#f7f9fa}
body.arcade-game{background:#f7f9fa;color:#172c40;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
.arcade-game .app{padding-top:24px;padding-bottom:20px}
.arcade-game .game-nav{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:50px;margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid #dce5e8}
.arcade-game .game-back{display:inline-flex;gap:10px;align-items:center;min-height:44px;font-size:13px;font-weight:650;color:#172c40;text-decoration:none;white-space:nowrap}
.arcade-game .game-back:hover{color:#08776e}
.arcade-game .brand-mark{display:block;width:29px;height:29px;flex-shrink:0}
.arcade-game .game-context{color:#52677a;font-size:11px;line-height:1.6;margin-left:auto;margin-right:8px;white-space:nowrap}
.arcade-game .help{width:auto;min-width:54px;min-height:44px;padding:9px 13px;border:1px solid #d2e1db;background:#fff;color:#08776e;border-radius:9px;font-size:13px;font-weight:650}
.arcade-game .help:hover{background:#e9f6f0;border-color:#99c5b5}
.arcade-game .app>.topbar{border-radius:14px;border-color:#dce5e8;background:#fff;box-shadow:0 5px 20px #19364a05}
.arcade-game :is(.topbar h1,.heading h1){font-family:inherit;font-weight:650;letter-spacing:-.8px;color:#172c40}
.arcade-game .topbar p,.arcade-game .heading p{color:#52677a}
.arcade-game .app>main{margin-top:20px}
.arcade-game .heading{padding-top:10px;margin-bottom:20px}
.arcade-game .primary{background:#08776e;border:1px solid #08776e;color:#fff;border-radius:10px;min-height:46px;font-weight:650;box-shadow:none}
.arcade-game .primary:hover:enabled{background:#055c55;border-color:#055c55}
.arcade-game .primary span{opacity:1}
.arcade-game .secondary{border-radius:10px;min-height:44px}
.arcade-game :is(button,a,summary,input,select):focus-visible{outline:3px solid #b55716;outline-offset:4px}
.arcade-game button:disabled{cursor:default}
.arcade-game .results{border:1px solid #dce5e8;background:white;box-shadow:0 6px 25px #19364a05;border-radius:18px}
.arcade-game .results h2,.arcade-game .results h3,.arcade-game dialog h2,.arcade-game .next-panel h2{font-family:inherit;font-weight:650;letter-spacing:-.7px;color:#172c40}
.arcade-game .results p{line-height:1.8}
.arcade-game .practice-note,.arcade-game .results-note{line-height:1.8}
.arcade-game dialog{border:1px solid #dce5e8;border-radius:18px;background:white;color:#172c40;max-height:calc(100dvh - 32px);overflow:auto;padding:32px;box-shadow:0 20px 80px #172c4033}
.arcade-game dialog::backdrop{background:#172c4075}
.arcade-game dialog p,.arcade-game dialog li{color:#52677a;line-height:1.8}
.arcade-game dialog :is(.close-help,.dialog-close){display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;top:6px;right:7px;border-radius:9px;background:#fff;color:#52677a}
.arcade-game .game-footer{border-top:1px solid #dce5e8;padding-top:23px;margin-top:35px;color:#52677a;font-size:12px;text-align:center;line-height:1.8}
.arcade-game .game-footer>p{margin:0 0 12px}
.arcade-game .game-footer>div{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 15px}
.arcade-game .game-footer a{color:#08776e;min-height:38px;display:inline-flex;align-items:center;text-underline-offset:4px;font-size:12px}
.arcade-game .game-footer small{display:block;margin-top:9px;font-size:10px;color:#52677a}
/* Firefly's night-time play area and results need their own light text. */
.arcade-game[data-task="13"] .play-panel{color:#eef0ff}
.arcade-game[data-task="13"] .results{background:linear-gradient(135deg,#231847,#0b0d25);color:#eef0ff;border-color:#4c4387}
.arcade-game[data-task="13"] .results :is(h2,h3){color:#eef0ff}
.arcade-game[data-task="13"] dialog .eyebrow{color:#08776e}
.arcade-game[data-task="13"] .stage-dots li:not(.current):not(.finished){color:#62509c;background:#f2edf8;border-color:#d9ceea}
.game-skip-link{position:fixed;top:-90px;left:15px;z-index:100;background:#172c40;color:white;border-radius:9px;padding:13px 20px;font-size:14px}
.game-skip-link:focus{top:10px}
@media(max-width:650px){.arcade-game .app{padding-top:14px}.arcade-game .game-nav{gap:10px;margin-bottom:16px;padding-bottom:12px}.arcade-game .game-context{display:none}.arcade-game .game-back{gap:7px;font-size:12px}.arcade-game .brand-mark{width:26px;height:26px}.arcade-game .help{min-width:48px;padding:9px 10px;font-size:12px}.arcade-game :is(.nav-actions,.nav-buttons){gap:8px}.arcade-game dialog{padding:29px 23px}.arcade-game dialog h2{font-size:25px;margin-top:20px}.arcade-game .game-footer{font-size:11px;margin-top:28px}.arcade-game .game-footer a{font-size:11px}.arcade-game .game-footer>div{gap:3px 11px}}
@media(prefers-reduced-motion:reduce){.arcade-game .primary,.arcade-game .secondary,.arcade-game dialog{transition:none}}