:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#edf5ff;background:#08121e;--navy:#0c1a2ced;--line:#a3c4e32b;--muted:#92aac1;--cyan:#65e6ff;--blue:#2476ed;--gold:#f2c372}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,input,select{font:inherit}button,a{touch-action:manipulation}button{color:inherit;cursor:pointer;border:0;background:transparent}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}button:hover:not(:disabled){filter:brightness(1.15)}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.desktop-only{display:none}
.topbar{position:fixed;inset:20px 24px auto;z-index:10;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;gap:11px;align-items:center;text-shadow:none;font-size:13px;letter-spacing:.11em;font-weight:800}.brand-mark{width:34px;height:38px;display:grid;place-items:center;background:#142a40;clip-path:polygon(0 0,100% 0,100% 73%,72% 100%,0 100%);font-size:26px;font-style:italic;position:relative;box-shadow:none}.brand-mark span{font-size:13px;position:absolute;right:3px;bottom:2px}.topbar nav{display:flex;align-items:center;gap:3px;padding:4px;background:var(--navy);border:1px solid var(--line);box-shadow:none}.topbar nav button{height:32px;padding:0 13px;font-size:11px;color:#b7c9db}.topbar nav .active{color:var(--cyan);background:#2248665e}.topbar .sign-in{border-left:1px solid var(--line);margin-left:3px;color:#e3efff}.topbar #guide{font-size:16px;color:#bbd0e3}
.scene-wrap{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#07111d}.scene-wrap>img{width:100%;height:100%;object-fit:contain;transform-origin:center}.scene-wrap>canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab}.scene-wrap>canvas:active{cursor:grabbing}#loading{position:absolute;inset:0;background:#142a40;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;color:#aac2d8;font-size:12px;letter-spacing:.04em}.loading-mark{font-size:42px;color:var(--cyan)}
.round-heading{position:fixed;top:19px;left:50%;transform:translateX(-50%);z-index:7;text-align:center;pointer-events:none}.round-context{position:absolute;top:57px;left:50%;transform:translateX(-50%);width:230px;text-shadow:none;font-size:9px;letter-spacing:.14em;color:#d5e4f2}.round-context h1{display:none}.clock{position:relative;min-width:112px;height:47px;display:flex;align-items:center;justify-content:center;gap:9px;background:var(--navy);border:1px solid #7aaac658;box-shadow:none;clip-path:polygon(0 0,100% 0,100% 80%,92% 100%,0 100%);overflow:hidden}.clock-icon{font-size:21px;color:var(--cyan)}#timer{font-size:25px;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:.01em;color:#f2fbff}#timer.urgent{color:#ff9992}.clock:has(.urgent){border-color:#f38e7977}.clock progress{appearance:none;-webkit-appearance:none;position:absolute;bottom:0;left:0;width:100%;height:2px;border:0;background:#355067;color:var(--cyan)}progress::-webkit-progress-bar{background:#355067}progress::-webkit-progress-value{background:var(--cyan)}progress::-moz-progress-bar{background:var(--cyan)}.clock:has(.urgent) progress::-webkit-progress-value{background:#ff9992}.round-heading.finished #timer{font-size:13px;letter-spacing:.09em}.round-heading.finished .clock-icon{color:var(--gold)}
.scene-tools{position:fixed;left:24px;bottom:36px;z-index:5;display:flex;flex-direction:column;align-items:flex-start;gap:12px}.scene-label{font-size:10px;letter-spacing:.05em;color:#dfedfa;background:#081725bc;border-left:2px solid #79abc3;padding:5px 8px}.scene-controls{display:flex;align-items:center;background:var(--navy);border:1px solid var(--line);box-shadow:none}.scene-controls button{width:36px;height:34px;font-size:19px}.scene-controls #reset-view{border-left:1px solid var(--line);margin-left:6px;font-size:18px}.scene-controls span{font-size:10px;color:#abc2d6;min-width:33px;text-align:center}
.map-panel{position:fixed;right:24px;bottom:36px;z-index:6;width:250px;padding:10px;background:var(--navy);border:1px solid #a4c8e543;box-shadow:none}.map-heading{display:flex;align-items:center;gap:9px;height:22px;padding:0 2px 7px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:.13em;color:#a8c2d8}.north{margin-left:auto;font-size:9px;color:#92b1c9}#expand-map{font-size:20px;line-height:17px;padding:0 0 0 5px;color:#c4e5f5}.map-wrap{position:relative;width:100%;aspect-ratio:1;border:1px solid #8cbbd331;overflow:hidden;background:#152b3c}.map-wrap img,.map-wrap canvas{position:absolute;inset:0;width:100%;height:100%}.map-wrap canvas{cursor:crosshair}#pin-status{font-size:10px;color:#b2c8dc;margin:9px 2px;min-height:12px}.primary{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#142a40;border-top:1px solid #71afff;box-shadow:none;clip-path:polygon(0 0,100% 0,100% 76%,94% 100%,0 100%);padding:14px 18px;font-weight:700;font-size:13px;letter-spacing:.03em}.primary span{font-size:19px;font-weight:400;line-height:15px}.primary:disabled{background:#253e56;border-top-color:#48657e;opacity:1;color:#7590aa}.map-panel .primary{width:100%}.map-panel.map-expanded{width:min(420px,48vw)}.map-panel.map-expanded .map-wrap{width:min(398px,calc(100vh - 255px));max-width:100%;margin:auto}.map-panel:has(#result-note:not([hidden])) #pin-status{display:none}#result-note{display:flex;align-items:center;gap:6px;margin:10px 2px 2px;font-size:10px;color:#c7d9e8}.pin-key,.answer-key{display:inline-block;width:7px;height:7px;background:var(--cyan);border-radius:50%}.answer-key{background:var(--gold);margin-left:9px}.map-panel:has(#result-note:not([hidden])) #guess{display:none}
.panel{background:#0c1c30f5;border:1px solid var(--line);box-shadow:none}.result{position:fixed;z-index:7;bottom:36px;left:50%;transform:translateX(-50%);width:min(760px,calc(100% - 340px));margin-left:-130px;display:flex;align-items:center;gap:24px;padding:22px 24px;border-top:2px solid var(--cyan);clip-path:polygon(0 0,100% 0,100% 87%,98% 100%,0 100%)}.result .score-block{min-width:100px}.result #points{font-size:42px;font-weight:800;letter-spacing:-.035em;line-height:1.2}.points-unit{font-size:9px;color:#88a8c1;margin-left:7px;letter-spacing:.08em}.result-stat{display:flex;flex-direction:column;gap:7px;min-width:72px}.result-stat strong{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}.stat-note{font-size:9px;color:#91acc3}.result .primary{margin-left:auto;min-width:155px;white-space:nowrap}.common{color:#b4c2cf}.uncommon{color:#73dabc}.rare{color:#78adff}.legendary{color:#ce9aff}.mythic{color:var(--gold)}body:has(#result:not([hidden])) .scene-tools{bottom:190px}
footer{position:fixed;right:25px;bottom:12px;z-index:9;display:flex;align-items:center;gap:14px}footer button,footer a{font-size:9px;letter-spacing:.04em;color:#c1d2df;text-shadow:none}footer button:disabled{opacity:.65}.status{position:fixed;z-index:12;top:116px;left:50%;transform:translateX(-50%);max-width:470px;font-size:12px;line-height:1.5;color:#f7d7a1;background:#101e2fec;border:1px solid #ecc87f45;padding:11px 16px;text-align:center;box-shadow:none}.status:empty{display:none}.waiting{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:380px;padding:30px;z-index:8}.waiting h1{font-size:26px;margin:17px 0}.waiting p{color:var(--muted);font-size:13px;line-height:1.7}.waiting .primary{width:100%;margin-top:24px}
dialog{width:440px;max-width:calc(100vw - 40px);max-height:85vh;overflow:auto;background:#101f33;color:#ecf4fe;border:1px solid #6183a363;padding:25px;box-shadow:none}dialog::backdrop{background:#020915a8;backdrop-filter:blur(4px)}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.close{font-size:23px;line-height:20px;color:#a7bfd3;padding:0 2px}dialog h2{font-size:27px;letter-spacing:-.025em;margin:22px 0}dialog p{font-size:13px;line-height:1.7;color:#a9c0d6}.subtle{font-size:12px;color:#afc5da}.setting-note{font-size:10px;color:#87a3bc;margin:8px 0 23px}.toggle{display:flex;gap:4px;padding:4px;background:#071422;border:1px solid #50739155}.toggle button{flex:1;padding:13px 7px;font-size:12px;color:#94aec4}.toggle .selected{color:#d5f8ff;background:#1c3d59;box-shadow:none}.setting-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:18px 0}.setting-row label{font-size:13px}.setting-row label span{display:block;color:#859eb6;font-size:10px;margin-top:6px}.setting-row input{max-width:155px;accent-color:var(--cyan)}#modifiers{padding:0 0 20px}#modifiers label{font-size:12px;display:block;margin-bottom:8px}select{width:100%;padding:10px;background:#0b1728;color:#dae8f7;border:1px solid #42627f}.rank-status{display:flex;align-items:center;gap:12px;border:1px solid var(--line);padding:15px;margin-top:7px;color:#c7d7e5;font-size:13px}.rank-diamond{font-size:30px;color:#8aa3c0}.rank-status small{display:block;font-size:10px;margin-top:5px;color:#859fb8}.lock-label{margin-left:auto;font-size:8px;letter-spacing:.1em;color:#91a8bc}.steps{list-style:none;padding:0;margin:0 0 25px;display:flex;flex-direction:column;gap:22px}.steps li{display:flex;gap:17px}.steps li>span{font-size:11px;color:var(--cyan);padding-top:3px}.steps strong{font-size:14px}.steps p{font-size:12px;margin:6px 0 0}.profile{position:fixed;inset:100px max(60px,12vw) 60px;z-index:8;padding:32px;overflow:auto}.profile h1{font-size:32px;margin:30px 0 15px}.profile p{font-size:13px;line-height:1.7;color:var(--muted)}.text-button{font-size:11px;color:var(--cyan)}.secondary{padding:11px 16px;border:1px solid #426584;color:#c9dced;font-size:12px}.profile table{border-collapse:collapse;width:100%;margin:25px 0}.profile th,.profile td{text-align:left;padding:12px 8px;border-bottom:1px solid var(--line);font-size:11px}.profile th{color:#96b3cd;font-weight:500}
@media(max-width:1150px){.topbar nav{gap:0}.topbar nav button{padding:0 9px;font-size:10px}.brand{font-size:11px;gap:8px}.round-heading{left:45%}.map-panel{width:225px}.result{width:calc(100% - 300px);left:24px;margin-left:0;transform:none;gap:18px;padding:20px}.result .primary{min-width:135px;font-size:12px;padding:14px}.result .xp-block{display:none}.result #points{font-size:36px}.result-stat{min-width:65px}.result-stat strong{font-size:18px}.profile{inset:100px 40px 60px}.topbar #play-tab{display:none}}
@media(max-height:650px){.map-panel{width:215px;bottom:30px}.result{bottom:30px;padding:16px 20px}.scene-tools{bottom:30px}.map-panel.map-expanded .map-wrap{width:min(398px,calc(100vh - 215px))}}
@media(max-width:899px){.app-shell{display:none}.desktop-only{display:block;padding:15vh 10vw;color:#adc4d8;line-height:1.7}.desktop-only strong{font-size:30px;color:#edf5ff}.desktop-only p{max-width:350px}}
@media(prefers-reduced-motion:no-preference){button{transition:filter .12s,background .12s}dialog[open]{animation:appear .14s ease-out}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}}
/* Menu and post-guess map presentation. */
:root{font-family:Tahoma,'Segoe UI',Arial,sans-serif;--cyan:#89d8ed;--blue:#307db9}
#menu-backdrop{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(9px) brightness(.42);transform:scale(1.04);display:none}
.menu-open #menu-backdrop{display:block}.menu-open .waiting{border-top:3px solid #92dff1;background:#102537ed;width:410px;padding:36px}.waiting h1{letter-spacing:.045em;font-size:30px}.waiting .secondary{width:100%;margin-top:10px;text-align:left;background:#1b3649}.waiting .eyebrow{font-size:9px}.menu-open .topbar{opacity:.85}.mode-choice{display:flex;gap:8px;margin:22px 0 15px}.mode-choice button{flex:1;padding:12px;border:1px solid #578198}.mode-choice .selected{opacity:1;background:#254e66}.primary{background:#142a40;border:1px solid #75acc3;clip-path:none;box-shadow:none}.panel,dialog{border-color:#6d94a8}.map-wrap canvas{touch-action:none}
.result-open .map-panel{inset:0;width:100%;height:100%;padding:0;border:0;background:#0b1c29;display:flex;justify-content:center;align-items:center;z-index:6}
.result-open .map-panel .map-wrap{width:min(100vw,100vh);height:min(100vw,100vh);max-width:none;margin:auto;flex-shrink:0;border:0}
.result-open .map-heading{position:absolute;top:88px;left:28px;right:28px;z-index:1}.result-open #expand-map{display:none}.result-open #result-note{position:absolute;left:28px;bottom:28px;background:#102537dd;padding:12px}.result-open .scene-tools,.result-open .round-heading{display:none}
.result-open .result{left:50%;transform:translateX(-50%);bottom:38px;margin:0;width:min(780px,calc(100vw - 64px));z-index:8;clip-path:none;background:#0c1c30f5}.result-open .topbar{z-index:10}.result-open #result-note{bottom:180px}.result-open .result .primary{min-width:140px}
@media(prefers-reduced-motion:no-preference){.result-open .map-panel{animation:reveal-map .45s ease-out}@keyframes reveal-map{from{opacity:.1;transform:scale(.94)}to{opacity:1;transform:scale(1)}}}
.result-open .map-panel .map-wrap{width:min(calc(100vw - 100px),calc(100vh - 220px));height:min(calc(100vw - 100px),calc(100vh - 220px));margin:70px auto auto}.result-open .map-heading .eyebrow{font-size:0}.result-open .map-heading .eyebrow:after{content:'ROUND RESULT';font-size:9px}
/* Actual SSC bitmap-derived display font. Forms retain a readable text fallback. */
@font-face{font-family:'SSC Game Black';src:url('/assets/game-font.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{--cyan:#8ceda3;--blue:#42a764;--line:#8ba3b650;--navy:#1c2a36f5}
.game-logo{width:42px;height:42px;object-fit:contain}.brand,.waiting h1,.primary,.eyebrow,.round-context,#timer,.result #points,dialog .panel-heading{font-family:'SSC Game Black',Arial,sans-serif;font-weight:400;letter-spacing:0}.brand{font-size:13px}.topbar nav{border:1px solid #697d8c;box-shadow:none;background:#142a40}.topbar nav button,.leaderboard-link{font-size:12px;padding:8px 11px}.leaderboard-link{color:#b9d2df}.topbar nav .active{background:#325446;color:#c5f5cf}.menu-open .waiting{width:470px;padding:38px;border:1px solid #a1b3c0;background:#142a40;box-shadow:none;clip-path:polygon(0 0,94% 0,100% 6%,100% 100%,6% 100%,0 94%)}.waiting h1{font-size:31px;line-height:1.4;margin:20px 0 8px;color:#f2f7f7;text-shadow:none}.waiting .creator{color:#b6c9d4;font-size:12px;margin:0 0 28px}.waiting .eyebrow{font-size:11px;color:#8fddb2}.primary{font-size:15px;background:#142a40;border:1px solid #a4edb4;color:#f5fff7;text-shadow:none;box-shadow:none;clip-path:polygon(0 0,96% 0,100% 16%,100% 100%,4% 100%,0 84%)}.waiting .secondary,.secondary{background:#142a40;border:1px solid #8ba9bc;box-shadow:none;color:#e1edf2;padding:13px 16px;font-size:13px}.menu-link{display:block}.waiting .primary{margin-top:8px}.panel,dialog,.map-panel{border:1px solid #738c9d;box-shadow:none}.map-heading .eyebrow{font-size:11px}.clock{border:1px solid #8099a7;background:#142a40;min-width:124px;height:52px}.clock-icon{color:#8ceda3}.result{border-top-color:#87d19c}.eyebrow{font-size:10px}.toggle .selected{background:#142a40;color:#d5ffe1;box-shadow:none}dialog{background:#142a40}#handle-input{display:block;margin-top:10px;width:100%;padding:12px;background:#0c1c28;border:1px solid #799db0;color:#eef7ff;font-size:18px}#handle-form label{color:#a5c0d2;font-size:12px}#handle-form .primary{margin:20px 0 12px;width:100%}#handle-error{color:#ffb6aa}#profile-actions{display:flex;gap:12px;margin-top:20px}.setting-note{font-size:12px}.profile th,.profile td{font-size:12px}

/* Design correction: flat SSC palette, compact floating play controls. */
:root{--navy:#10243aee;--line:#36536c;--cyan:#8ceda3;--blue:#245579}
.topbar nav,.panel,dialog,.map-panel,.clock{background:#10243aee;border:1px solid #36536c;box-shadow:none}
.menu-open .waiting{width:440px;padding:32px;background:#142a40;border:1px solid #36536c;clip-path:polygon(0 0,96% 0,100% 4%,100% 100%,0 100%)}
.waiting h1{font-size:29px;text-shadow:none}.waiting .creator{margin-bottom:24px}
.primary{background:#245579;border:0;border-radius:0;box-shadow:none;text-shadow:none;clip-path:polygon(0 0,96% 0,100% 20%,100% 100%,4% 100%,0 80%)}
.primary:disabled{background:#20374b;color:#7f99af;border:0}
.waiting .secondary,.secondary{background:#1b364e;border:1px solid #36536c;box-shadow:none;clip-path:polygon(0 0,97% 0,100% 16%,100% 100%,0 100%)}
.topbar nav .active,.toggle .selected,.mode-choice .selected{background:#245579;color:#eef6ff;box-shadow:none}
.clock{min-width:102px;height:44px}.clock-icon{font-size:18px}#timer{font-size:23px}
.map-panel{padding:8px;width:250px}.map-panel .primary{padding:12px 14px}.scene-controls{background:#10243aee}.scene-label{border:0}
body:has(#round:not([hidden])):not(.result-open) .brand span,
body:has(#round:not([hidden])):not(.result-open) #profile-tab,
body:has(#round:not([hidden])):not(.result-open) .leaderboard-link,
body:has(#round:not([hidden])):not(.result-open) #guide,
body:has(#round:not([hidden])):not(.result-open) #sign-in,
body:has(#round:not([hidden])):not(.result-open) #privacy,
body:has(#round:not([hidden])):not(.result-open) .round-context{display:none}
@media(max-width:1150px){.topbar #play-tab{display:block}.round-heading{left:50%}}

/* Larger controls, while retaining the SSC typography and palette. */
dialog{width:560px;padding:28px}dialog .panel-heading{font-size:22px}dialog p,.setting-row label{font-size:16px}.toggle button,.mode-choice button{font-size:16px;min-height:48px}.topbar nav button,.leaderboard-link{font-size:14px;min-height:40px}.primary{font-size:19px;min-height:44px}.waiting .secondary{font-size:16px}.setting-row select{width:180px}
.map-panel{width:290px}.map-panel.map-expanded{width:min(650px,65vw)}.map-panel.map-expanded .map-wrap{width:min(100%,calc(100vh - 210px));margin:auto}.map-panel .primary{font-size:20px}#pin-status{font-size:13px}.map-monochrome{filter:grayscale(1) contrast(1.15)}
#progress-hud{position:fixed;top:112px;left:24px;display:flex;align-items:center;gap:12px;z-index:9;background:#10243ae6;padding:12px;border:1px solid #36536c;max-width:255px}#xp-ring{--progress:0deg;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:conic-gradient(#8ceda3 var(--progress),#36536c 0);flex-shrink:0}#level-value{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#142a40;font-family:'SSC Game Black';font-size:22px}#xp-left{font-size:13px}#streak{margin-top:7px;font-size:18px}#progress-note{display:block;font-size:10px;color:#b3c7d8;margin-top:6px}.menu-open #progress-hud{top:auto;bottom:40px}.result-open #progress-hud{top:110px}.map-wrap img{image-rendering:auto}
.scene-label{display:none}
.map-panel.map-expanded .map-wrap{width:min(100%,calc(100vh - 260px))}body:has(#community:not([hidden])) #progress-hud,body:has(#profile:not([hidden])) #progress-hud{display:none}

/* Full-screen result map; the viewport, rather than a tiny card, clips zoomed geography. */
.result-open .map-panel .map-wrap{width:min(100vw,110vh);height:min(100vw,110vh);margin:auto;overflow:visible;border:0}
.result-open .map-panel{overflow:hidden}
.result-open .map-wrap canvas{width:100%;height:100%}
.result-open .result{width:min(1100px,calc(100vw - 48px));gap:22px;bottom:30px;flex-wrap:wrap}
.result-open .result .xp-block{display:flex}
.result-open #result-note{bottom:auto;top:150px;left:auto;right:24px;z-index:2}
.rating-gain{color:#8ceda3}.rating-loss{color:#ffaaa6}#rating-change{font-size:18px;font-variant-numeric:tabular-nums}
#menu-panorama{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;filter:brightness(.4) blur(2px);display:none}
.menu-open #menu-panorama:not([hidden]){display:block}
#privacy-dialog h3{font-size:18px;margin-top:24px}#privacy-dialog p{font-size:15px;line-height:1.7}
@media(prefers-reduced-motion:no-preference){
.result-open .map-panel{animation:map-reveal .65s cubic-bezier(.22,1,.36,1)}
.result-open .result{animation:result-reveal .65s cubic-bezier(.22,1,.36,1)}
@keyframes map-reveal{from{opacity:0;filter:blur(8px);transform:scale(1.04)}to{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes result-reveal{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
}

/* Expanded minimap rules must not constrain the full-screen results viewport. */
body.result-open .map-panel,body.result-open .map-panel.map-expanded{inset:0;width:100vw;max-width:none;height:100dvh;padding:0;overflow:hidden;background:#0b1c29}
body.result-open .map-panel .map-wrap,body.result-open .map-panel.map-expanded .map-wrap{width:min(100vw,110dvh);height:min(100vw,110dvh);max-width:none;max-height:none;margin:auto;flex:none}
body #progress-hud,body.menu-open #progress-hud,body.result-open #progress-hud{top:100px;bottom:auto;left:24px;width:245px;max-width:245px}
#xp-left{font-variant-numeric:tabular-nums}#level-value{font-variant-numeric:tabular-nums}
.topbar nav .leaderboard-link{display:flex;align-items:center;align-self:stretch;line-height:1;padding:0 11px;font:14px Tahoma,Arial,sans-serif}
.waiting .ranked-play{display:grid;grid-template-columns:1fr 64px;gap:6px 12px;text-align:left;min-height:88px;background:#304369}
.waiting .ranked-play .play-label{font:19px 'SSC Game Black',Arial,sans-serif;line-height:1.2}
.waiting .ranked-play small{grid-column:1/-1;font:13px Tahoma,Arial,sans-serif;color:#d4e0ef}
#menu-rank-badge{font-size:0}.menu-open .waiting{max-height:calc(100dvh - 130px);overflow:auto}
#menu-panorama{display:none!important}
#menu-backdrop{filter:brightness(.38);transform:scale(1.15);object-fit:cover;will-change:transform}
@media(prefers-reduced-motion:no-preference){.menu-open #menu-backdrop{animation:menu-drift 70s ease-in-out infinite alternate}@keyframes menu-drift{from{transform:scale(1.15) translateX(-3%)}to{transform:scale(1.15) translateX(3%)}}}
@media(min-width:1800px){.result-open .result{bottom:40px;padding:28px 32px}.result-open .map-heading{top:90px}.result-open #result-note{top:110px}}

@media(max-width:1100px){body #progress-hud,body.menu-open #progress-hud,body.result-open #progress-hud{width:200px;max-width:200px;left:16px;padding:9px;gap:8px}#xp-left{font-size:11px}}

/* Results annotations use the whole viewport, independent of the square map image. */
#result-map-overlay{display:none;pointer-events:none}
body.result-open #result-map-overlay{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:1}
body.result-open .map-heading{display:none}
body.result-open #result-note{top:82px;right:24px;left:auto;bottom:auto;margin:0;padding:8px 12px;font:13px Tahoma,Arial,sans-serif}
.topbar nav .icon-button{display:grid;place-items:center;width:46px;padding:8px}
.icon-button svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body .result #points{font-family:Arial,sans-serif;font-weight:800;font-variant-numeric:proportional-nums;font-kerning:normal;letter-spacing:-.025em;font-size:44px}
.result-stat .eyebrow{font-size:12px;letter-spacing:.04em}
.result-stat strong{font-size:25px}.result-stat .stat-note{font-size:12px}
body .legendary{color:#f3c576}body .mythic{color:#ce9cff}
#rating-block{position:relative;padding-left:76px;min-width:210px}
#result-rank-badge{position:absolute;left:0;top:50%;transform:translateY(-50%);width:64px;height:32px}
#result-rank-name{font:12px Tahoma,Arial,sans-serif;color:#c5d9eb;max-width:160px}
#result-rank-badge.rank-15000{background:url('/assets/rank-15000-spectrum.png') center/contain no-repeat}
@media(min-width:1400px){body.result-open .result{width:min(1280px,calc(100vw - 64px));gap:28px}}

/* Numeric data uses ordinary proportional digits, not the game's display face. */
body #timer,body #level-value,body .result-stat strong,body #xp-left,body #streak-value,
body .stat-card strong,body .community-panel td,body .rank-tier small,body #menu-rank,
body #profile-summary,body #profile-stats{font-family:Arial,sans-serif;font-variant-numeric:proportional-nums;letter-spacing:normal;font-kerning:normal}
body .stat-card strong{font-weight:700}
.placement-dots{display:flex;gap:9px;grid-column:1/-1;margin-top:5px}
.placement-dots span{width:11px;height:11px;border-radius:50%;border:1px solid #a8c1d6;background:#142a40}
.placement-dots span.complete{background:#8ceda3;border-color:#8ceda3}
/* Transform-only drift: no blur/filter rasterization each frame. */
body #menu-backdrop{filter:none;opacity:.42;transform:translate3d(-6%,0,0) scale(1.2);backface-visibility:hidden;will-change:transform}
@media(prefers-reduced-motion:no-preference){body.menu-open #menu-backdrop{animation:menu-drift-fast 18s linear infinite alternate}}
@keyframes menu-drift-fast{from{transform:translate3d(-6%,0,0) scale(1.2)}to{transform:translate3d(6%,0,0) scale(1.2)}}
@media(prefers-reduced-motion:reduce){body #menu-backdrop{animation:none;transform:scale(1.2)}}

/* The still is a loading/WebGL fallback; all six capture directions drive the title. */
body #menu-backdrop{animation:none!important;transform:none;will-change:auto}
body #menu-backdrop.panorama-ready{visibility:hidden}
body.menu-open #menu-panorama:not([hidden]){display:block!important;filter:none;opacity:.42;z-index:0}
body:not(.menu-open) #menu-panorama,body #menu-panorama[hidden]{display:none!important}

/* Reserve the full 0-5,000 score footprint throughout reward animation. */
body .result .score-block{flex:0 0 178px;width:178px;min-width:178px}
body .result .score-block>div{white-space:nowrap}
body .result #points{display:inline-block;width:146px;text-align:left}


/* Mobile is an account and leaderboard companion; gameplay stays desktop-only. */
body.mobile-only{overflow:auto}body.mobile-only .app-shell{display:block;padding:12px}body.mobile-only .desktop-only,body.mobile-only #menu-panorama,body.mobile-only #progress-hud,body.mobile-only #lobby,body.mobile-only #round,body.mobile-only #play-tab,body.mobile-only #profile-tab,body.mobile-only #guide,body.mobile-only #settings,body.mobile-only #sound,body.mobile-only #owner-link,body.mobile-only #back-to-game,body.mobile-only #public-profile{display:none!important}
body.mobile-only .topbar{position:relative;inset:auto;height:auto;display:flex;flex-wrap:wrap;gap:18px;padding:12px 0}body.mobile-only .topbar nav{position:static;display:flex;margin:0;width:100%;justify-content:space-between}body.mobile-only .topbar nav a,body.mobile-only .topbar nav button{min-height:44px;padding:10px 16px}body.mobile-only .community-view{position:relative;inset:auto;margin:20px 0 60px;overflow:visible}body.mobile-only .community-panel{padding:16px}body.mobile-only .community-panel table{min-width:580px}body.mobile-only .profile{position:relative;inset:auto;margin:20px 0 60px;width:100%;max-width:none}body.mobile-only dialog{max-width:calc(100vw - 24px)}body.mobile-only .rank-tiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 8px}body.mobile-only details.community-panel{min-height:0}body.mobile-only .community-panel summary{min-height:44px;padding:10px 0}body.mobile-only .brand{pointer-events:none}body.mobile-only footer{position:relative;inset:auto}

#modifiers{border:0;border-top:1px solid #36536c;margin:18px 0;padding:12px 0;min-width:0}
#modifiers legend{font-size:17px;padding-right:12px}#modifier-lock{font-size:13px;color:#afc6d8}
.modifier-option{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;cursor:pointer}
.modifier-option strong{display:block;font-size:16px}.modifier-option b{color:#83efaa;font:inherit;margin-left:7px;white-space:nowrap}
.modifier-option small,#modifier-bonus{display:block;font-size:13px;line-height:1.5;color:#bdd1df}
.modifier-option input{appearance:none;flex:0 0 42px;width:42px;height:24px;border-radius:15px;border:1px solid #70899d;background:#354b60;position:relative;cursor:pointer}
.modifier-option input:before{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:#ecf5ff;border-radius:50%}
.modifier-option input:checked{background:#287354;border-color:#83efaa}.modifier-option input:checked:before{left:21px}
.modifier-option input:disabled{opacity:.4;cursor:not-allowed}.modifier-option input:focus-visible{outline:3px solid #87caff;outline-offset:3px}
#modifier-notice{position:fixed;right:24px;bottom:170px;width:min(340px,calc(100vw - 48px));padding:22px;background:#142a40;border:1px solid #83efaa;z-index:50;box-shadow:0 8px 30px #0006}
#modifier-notice[hidden]{display:none}#modifier-notice strong{display:block;font-size:17px;padding-right:15px;color:#83efaa}#modifier-notice p{font-size:15px;line-height:1.5;margin:12px 0}
#modifier-notice-dismiss{position:absolute;right:8px;top:6px;background:transparent;border:0;color:#c4d8e9;font-size:24px;padding:4px 8px}

#modifiers .modifier-option{display:flex;flex-direction:row;align-items:center;justify-content:space-between}#modifiers .modifier-option input{margin:0}.topbar nav a.icon-button{display:inline-flex;align-items:center;justify-content:center}.topbar nav a.icon-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}

/* Held map uses the existing square map projection at full viewport scale. */
#map-toggle{position:fixed;right:24px;bottom:40px;z-index:8;background:#142a40;font-size:18px;padding:16px 24px}

body.guess-map-open:not(.result-open) .map-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;padding:12px 24px;z-index:30;background:#0b1c29;gap:8px;border:0}
body.guess-map-open:not(.result-open) .map-panel .map-wrap{width:min(calc(100vw - 48px),calc(100dvh - 160px));height:min(calc(100vw - 48px),calc(100dvh - 160px));max-width:none;max-height:none;margin:0;flex:none}
body.guess-map-open .map-heading{width:100%;height:28px;padding:0;gap:20px}
#map-hint{font-size:14px;color:#b2c8dc;margin-left:auto}#close-map{font-size:28px;padding:0 12px}
body.guess-map-open #expand-map,body.guess-map-open .north{display:none}
body.guess-map-open #pin-status{margin:0;min-height:16px}
body.guess-map-open #guess{width:260px;padding:10px 18px;min-height:44px}
body.guess-map-open .round-heading{z-index:31}
body.guess-map-open .round-context{display:none}
body.result-open #map-toggle,body.result-open #map-hint,body.result-open #close-map{display:none}
.setting-row select#map-key,.setting-row select#submit-key{width:130px}

/* Wide map viewport; map projection remains square and can pan vertically. */
body.guess-map-open:not(.result-open) .map-panel{background:rgba(7,18,29,.62)}
body.guess-map-open:not(.result-open) .map-panel .map-wrap{width:calc(100vw - 96px);height:calc(100dvh - 150px);aspect-ratio:auto;overflow:hidden;background:#152b3c}
body.guess-map-open .map-heading{background:#10243ae6;padding:5px 12px;height:32px}
body.guess-map-open #pin-status{background:#10243ae6;padding:2px 12px;min-height:20px}
#map-key,#submit-key{min-width:130px;max-width:230px;overflow-wrap:anywhere}
#map-key[aria-pressed=true],#submit-key[aria-pressed=true]{border-color:#83efaa;color:#83efaa}

/* Optional large view; the regular minimap stays available at bottom right. */
#map-hint,#close-map{display:none}
#map-toggle{position:static;inset:auto;margin-left:auto;padding:2px 6px;font-size:11px;z-index:auto;border:1px solid #36536c;background:#142a40}
body.guess-map-open:not(.result-open) .map-panel{padding:80px 24px 20px;--large-map-width:min(calc(100vw - 96px),calc(115dvh - 253px))}
body.guess-map-open:not(.result-open) .map-panel .map-wrap{width:var(--large-map-width);height:calc(100dvh - 220px);aspect-ratio:auto}
body.guess-map-open .map-heading{width:var(--large-map-width);height:28px;background:transparent;padding:0}
body.guess-map-open #close-map{display:block;margin-left:auto}
body.guess-map-open #map-toggle{display:none}

/* Duplicate the fixed timer by the optional map; never move the top clock. */
#map-timer{position:absolute;right:0;bottom:100%;padding:5px 12px;background:#102536e8;color:#fff;font:700 24px Tahoma,Arial,sans-serif;font-variant-numeric:tabular-nums;border:1px solid #4d6c80;border-radius:6px 6px 0 0;pointer-events:none}
#map-timer.urgent{color:#ff927b}
.result-open #map-timer{display:none}
.guess-map-open #map-timer{display:none}
#result-photo{position:fixed;top:210px;left:24px;width:clamp(180px,22vw,340px);margin:0;padding:6px;background:#102536ed;border:1px solid #4d6c80;z-index:35;box-shadow:0 5px 24px #0006}
#result-photo[hidden]{display:none}
#result-photo img{display:block;width:100%;max-height:24vh;object-fit:contain}
#result-photo figcaption{font:12px Tahoma,Arial,sans-serif;color:#c4dbe9;padding:5px 3px 1px}

/* Home-only support link: no external widget or gameplay overlay. */
#kofi-support{position:fixed;left:max(18px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));z-index:30;display:inline-flex;align-items:center;gap:8px;padding:9px 13px;min-height:40px;box-sizing:border-box;border:1px solid #ffffff18;border-radius:20px;background:#323842;color:#fff;font-family:Arial,sans-serif;font-size:13px;font-weight:600;line-height:20px;text-decoration:none;box-shadow:0 2px 8px #0003}
#kofi-support svg{width:24px;height:21px;flex:none}
#kofi-support:hover{background:#3d4450;border-color:#ffffff40}
#kofi-support:focus-visible{outline:2px solid #83efaa;outline-offset:4px}
#kofi-support[hidden],body.mobile-only #kofi-support,body:has(dialog[open]) #kofi-support,body:not(.menu-open) #kofi-support{display:none}