/* Game instrumentation, not dashboard cards. Keep the existing display fonts. */
.survey-heading { display:none; }
#cancel-city-transition { min-height:48px; margin-top:24px; padding:10px 20px; border:1px solid #8eacb7; background:#142431; color:#cee8e8; font:12px 'IBM Plex Mono',monospace; cursor:pointer; }
#camera-motion-btn { display:none; }
body.mode-visualizer #camera-motion-btn { display:block; }
#results-panel { border:1px solid #73899e; border-top:2px solid #f691ab; border-radius:4px; background:#192235fa; box-shadow:0 -8px 26px #080d1959; padding:16px 20px; }
#results-panel::before,#results-panel::after { display:none; }
#results-panel .hero-score { color:#ffd099; -webkit-text-fill-color:#ffd099; background:none; text-shadow:none; }
#results-panel .efficiency-value { color:#9be9df; text-shadow:none; }
#results-panel .hero-label,#results-panel .efficiency-label { color:#a8bbcc; letter-spacing:.12em; }
#results-panel .btn-next { min-height:48px; color:#171729; background:#f596af; border:0; border-radius:3px; font-size:11px; letter-spacing:.08em; }
#results-panel .btn-next:hover { background:#ffb0c3; }
#results-panel .btn-next:active { transform:scale(.98); }
#results-panel .round-share-actions { border-top:1px solid #a0bec62c; padding-top:8px; gap:16px; }
#results-panel .round-share-actions button { min-height:44px; padding:4px 0; border:0; border-bottom:1px solid #709bad; border-radius:0; background:none; color:#bde8ef; font:500 11px var(--font-sans-premium); }
#results-panel #round-discoveries { border-top:1px solid #a0bec62c; padding-top:9px; }
#results-panel .round-discovery { border-radius:3px; background:#101a2c; }
#results-panel .comparison-bar { border-radius:0; height:3px; background:#91b1c31c; }
#results-panel .bar-fill { border-radius:0; box-shadow:none; }
@media(max-width:700px){
 #gameplay-hud { top:0; left:0; right:0; padding:calc(9px + env(safe-area-inset-top)) 16px 11px; min-height:78px; grid-template-rows:28px 24px; gap:0 10px; border:0; border-bottom:1px solid #72bbc14d; border-radius:0; background:linear-gradient(110deg,#141827fa,#152434f5); box-shadow:none; }
 #gameplay-hud .hud-location { align-self:center; }
 #gameplay-hud #current-location { font-family:var(--font-sans-premium); color:#f2e9e7; font-size:15px; letter-spacing:0; }
 #gameplay-hud .hud-stats { gap:17px; align-self:end; }
 #gameplay-hud #stat-distance { display:flex!important; }
 #gameplay-hud .hud-label { font:400 8px var(--font-mono,monospace); text-transform:uppercase; letter-spacing:.06em; color:#a0acbd; }
 #gameplay-hud .hud-value { font:600 14px var(--font-sans-premium); color:#f5c294; }
 #gameplay-hud .hud-dim { font:400 11px var(--font-sans-premium); color:#9caebf; }
 #gameplay-hud #mobile-options { width:44px; min-width:44px; height:44px; min-height:44px; padding:0; border:1px solid #78a5b65c; border-radius:4px; background:#19283b; color:#a7e4ed; font-family:var(--font-sans-premium); }
 #route-identity-legend { top:calc(88px + env(safe-area-inset-top)); left:16px; padding:3px 0; border:0; border-radius:0; background:#121c2bd9; box-shadow:none; }
 #results-panel { left:0; right:0; bottom:0; width:100%; padding:14px 16px calc(8px + env(safe-area-inset-bottom)); border:0; border-top:2px solid #f691ab; border-radius:0; background:#192235fa; box-shadow:0 -8px 30px #090d1959; }
 #results-panel.visible { max-height:44dvh; }
 #results-panel .results-content { display:grid; grid-template-columns:minmax(0,1fr) 112px; gap:12px 16px; align-items:center; }
 #results-panel .results-hero { grid-column:1; order:0; gap:18px; justify-content:flex-start; }
 #results-panel .hero-score { font-size:36px; line-height:1.1; }
 #results-panel .efficiency-value { font-size:23px; }
 #results-panel .hero-label,#results-panel .efficiency-label { font-size:8px; }
 #results-panel .next-round-wrapper { grid-column:2; order:1; }
 #results-panel .btn-next { min-height:52px; padding:9px; font-size:10px; gap:6px; background:#f596af; color:#171729; border-radius:3px; white-space:normal; }
 #results-panel .btn-next svg { width:18px; height:18px; flex-shrink:0; }
 #results-panel .results-comparison { grid-column:1/-1; order:2; grid-template-columns:1fr 1fr; gap:18px; }
 #results-panel .comparison-item { display:flex; flex-direction:column-reverse; align-items:stretch; gap:7px; }
 #results-panel .comparison-data { display:flex; justify-content:space-between; align-items:baseline; gap:6px; text-align:left; }
 #results-panel .comparison-label { font-size:8px; letter-spacing:.05em; }
 #results-panel .comparison-value { font-size:14px; }
 #results-panel #round-discoveries { flex-direction:row; align-items:center; gap:9px; }
 #results-panel .round-discoveries-heading { font-size:10px; }
 #results-panel .round-discoveries-empty { font-size:10px; }
 #results-panel .round-share-actions { margin:0; padding-top:4px; }
}
@media(max-width:360px){
 #gameplay-hud { padding-left:12px; padding-right:12px; }
 #gameplay-hud .hud-stats { gap:10px; }
 #gameplay-hud .hud-stat { gap:3px; }
 #results-panel { padding-left:12px; padding-right:12px; }
 #results-panel .results-content { grid-template-columns:minmax(0,1fr) 100px; gap:10px; }
 #results-panel .results-hero { gap:10px; }
 #results-panel .hero-score { font-size:30px; }
 #results-panel .efficiency-value { font-size:20px; }
}

/* Pocket atlas: marginalia, neatlines and a legible survey slip. No floating cards. */
@media(max-width:700px){
 #gameplay-hud { padding:calc(22px + env(safe-area-inset-top)) 18px 12px; min-height:94px; grid-template-rows:30px 24px; background:#101c28; border-bottom:1px solid #91b9bf; backdrop-filter:none; -webkit-backdrop-filter:none; }
 #gameplay-hud::before { display:block!important; content:'PATHFINDR / FIELD ATLAS'; position:absolute; left:18px; right:auto; bottom:auto; height:auto; top:calc(8px + env(safe-area-inset-top)); background:none; filter:none; color:#8eb1b9; font:9px 'IBM Plex Mono',monospace; letter-spacing:.17em; pointer-events:none; }
 #gameplay-hud::after { display:block!important; content:''; position:absolute; left:18px; right:18px; bottom:0; height:5px; background:repeating-linear-gradient(90deg,#9fc5c980 0 1px,transparent 1px 12px); pointer-events:none; }
 #gameplay-hud #current-location { font-size:16px; font-weight:500; letter-spacing:.015em; }
 #gameplay-hud .hud-stats { gap:14px; }
 #gameplay-hud .hud-label { color:#a3b6bc; font-size:8px; }
 #gameplay-hud .hud-value { font:500 13px 'IBM Plex Mono',monospace; color:#edc89d; }
 #gameplay-hud #mobile-options { align-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; width:48px; height:56px; gap:3px; background:none; border:0; border-left:1px solid #89b3bb60; border-radius:0; color:#a6e7e9; font:9px 'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
 #mobile-options svg { width:25px; height:25px; }
 #route-identity-legend { top:calc(103px + env(safe-area-inset-top)); left:18px; font:8px 'IBM Plex Mono',monospace; background:#101c28d9; }
 #mobile-options:focus-visible { outline:2px solid #94e9ee; outline-offset:2px; }
 #results-panel { color:#deedf0; background:#101c28; border-top:1px solid #76c3cf; padding:9px 16px calc(6px + env(safe-area-inset-bottom)); box-shadow:0 -6px 24px #09142244; }
 #results-panel .results-content { gap:7px 14px; }
 #results-panel .survey-heading { display:flex; grid-column:1/-1; order:-1; justify-content:space-between; align-items:baseline; padding-bottom:8px; border-bottom:1px solid #375e6266; text-transform:uppercase; font:500 12px 'IBM Plex Mono',monospace; letter-spacing:.12em; }
 #results-panel .survey-heading small { font-size:8px; letter-spacing:.12em; color:#8daab7; }
 #results-panel .hero-score { color:#f4c38f; -webkit-text-fill-color:#f4c38f; font-size:29px; }
 #results-panel .efficiency-value { color:#9cdee2; font-size:21px; }
 #results-panel .hero-label,#results-panel .efficiency-label,#results-panel .comparison-label { color:#9fb6c3; }
 #results-panel .comparison-item.yours .comparison-label { color:#e7bb8d; }
 #results-panel .comparison-item.optimal .comparison-label { color:#90d6dc; }
 #results-panel .comparison-value { color:#dfecef; font:500 12px 'IBM Plex Mono',monospace; }
 #results-panel .btn-next { min-height:44px; padding:7px; background:#283143; color:#ffb3c7; border-radius:4px 12px 4px 12px; border:1px solid #ad708b; box-shadow:none; }
 #results-panel .btn-next:hover { background:#24545c; }
 #results-panel .glow-border { display:none; }
 #results-panel .comparison-bar { background:#617c7c30; height:3px; }
 #results-panel #user-bar { background:repeating-linear-gradient(90deg,#e7bb8d 0 12px,transparent 12px 15px,#e7bb8d 15px 18px,transparent 18px 21px); }
 #results-panel #optimal-bar { background:repeating-linear-gradient(90deg,#90d6dc 0 5px,transparent 5px 8px); }
 #results-panel #round-discoveries { border-color:#70929c40; color:#9bb9c6; padding-top:6px; }
 #results-panel .round-discoveries-heading,#results-panel .round-discoveries-empty { color:#9bb9c6; }
 #results-panel .round-discovery { background:none; color:#c9e1e6; border-color:#70929c55; border-radius:0; }
 #results-panel .round-share-actions { border-color:#375e6240; gap:24px; }
 #results-panel .round-share-actions button { color:#a4cbd5; border-bottom:1px solid #44676d; font:500 11px 'IBM Plex Mono',monospace; }
}

/* A city note, not a second card. Facts load independently of the result handoff. */
#results-panel #location-fact:not(.hidden) { display:flex; grid-column:1/-1; order:3; align-items:flex-start; gap:10px; margin:0; padding:8px 0 6px; border:0; border-top:1px solid #7395a344; border-radius:0; background:none; box-shadow:none; }
#results-panel #location-fact .fact-icon { font-size:0; flex:0 0 34px; }
#results-panel #location-fact .fact-icon::after { content:'LOCAL\A NOTE'; white-space:pre; font:8px/1.5 'IBM Plex Mono',monospace; letter-spacing:.12em; color:#eea2b8; }
#results-panel #location-fact .fact-text { color:#c0d0d8; font:400 12px/1.45 var(--font-sans-premium); }
@media(max-width:700px){
 #results-panel .survey-heading { padding-bottom:5px; font-size:10px; }
 #results-panel .comparison-data { flex-direction:row; align-items:baseline; }
 #results-panel .comparison-item { gap:4px; }
 #results-panel #location-fact .fact-text { font-size:11px; }
 #results-panel .round-discoveries-empty { display:none; }
}
