@font-face{font-family:DINish;src:url('assets/DINish-Regular.ttf');font-weight:400;font-display:swap}
@font-face{font-family:DINish;src:url('assets/DINish-Medium.ttf');font-weight:500;font-display:swap}
@font-face{font-family:DINish;src:url('assets/DINish-SemiBold.ttf');font-weight:600;font-display:swap}
:root{--ink:#081633;--muted:#54617e;--line:#d5daf0;--blue:#284bff;--pink:#ff4b91;--coral:#FF424D;--success:#18AD65;--amber:#FFC13D;--yellow:#FFD326;--green:#99D52D;--water:#03ABFC;--paper:#f0f2ff;--card:#fff;--glass:rgba(255,255,255,.86);--glass-card:rgba(255,255,255,.92);--prompt-glass:rgba(255,211,38,.94);--glass-blur:12px;--keyboard-inset:0px;--score-clearance:calc(max(8px,env(safe-area-inset-bottom)) + 52px)}
*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font:15px/1.4 DINish,Arial,sans-serif;color:var(--ink);background:var(--paper)}button,input,select{font:inherit;color:inherit}button,select,summary{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,svg:focus-visible{outline:3px solid var(--blue);outline-offset:3px}main,.game-layout{width:100%;height:100dvh}.game-layout{position:relative;isolation:isolate}.surface{background:var(--glass);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:0;border-radius:12px;box-shadow:0 4px 18px #08163318}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.map-panel,.map-container{position:absolute;inset:0;overflow:hidden;background:var(--paper)}#city-map{position:absolute;inset:0;width:100%;height:100%;touch-action:none;user-select:none;cursor:crosshair}#city-map.is-dragging{cursor:grabbing}
/* The edge track and gain text leave all map gestures untouched. */
/* The native radio group stays horizontal; future cities can extend this row. */
.start-scene{position:absolute;inset:0;background:var(--paper);display:flex;align-items:center;justify-content:center;padding:max(24px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));overflow:auto;touch-action:pan-y;isolation:isolate}
.start-scene:before{content:'';position:fixed;inset:0;z-index:-1;background-image:url('assets/start/map-pattern-tight.webp');background-size:480px 480px;background-repeat:repeat;background-position:-3px -3px;opacity:.07;pointer-events:none}
.home-info-button{position:absolute;left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));width:44px;height:44px;display:grid;place-items:center;background:rgba(255,255,255,.20);border:0;border-radius:50%;color:#54617e;box-shadow:0 2px 10px #08163308;z-index:1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.home-info-button:hover{background:rgba(255,255,255,.86);color:var(--ink)}
.home-info-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round}.home-info-button .info-dot{fill:currentColor;stroke:none}
.home-info{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;border-radius:20px;color:var(--ink);background:rgba(255,255,255,.95);box-shadow:0 18px 70px #08163326;overflow:hidden;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.home-info::backdrop{background:#08163326;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.home-info-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 12px;border-bottom:1px solid #0816330d}
.home-info-header h2{font-size:22px;font-weight:600}.home-info-header button{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:#08163306;color:var(--ink)}.home-info-header button:hover{background:#08163310}.home-info-header svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.home-info-content{padding:20px;max-height:calc(100dvh - 112px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;font-size:15px;line-height:1.5}
.home-info-content>.info-section + .info-section,.info-contact-grid{margin-top:20px}.info-section h3{margin:0 0 12px;font-size:17px;font-weight:600}.info-section p{margin:8px 0 0;color:var(--muted)}
.info-credits{margin:0;padding:0;list-style:none;display:grid;gap:14px}.info-credits li{display:grid;gap:2px}.info-credits li>span{font-size:14px;color:var(--muted)}.info-parotid>a,.info-credits a,.info-references a,.info-privacy>a{color:var(--blue);text-decoration-thickness:1px;text-underline-offset:3px}.info-parotid>a,.info-credits li>a,.info-privacy>a{font-weight:500}
.info-references{margin-top:18px;padding-top:14px;border-top:1px solid #0816330d}.info-references summary{font-weight:500;min-height:44px;display:list-item;align-content:center;margin-left:16px}.info-references p{font-size:14px}.info-references h4{margin:18px 0 8px;font-size:15px;font-weight:600}.info-references ul{margin:0;padding:0;list-style:none}.info-references li+li{margin-top:8px}.info-references li a{display:block;min-height:44px;align-content:center;font-size:14px;overflow-wrap:anywhere}
.info-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.info-placeholder{padding:14px;background:#284bff06;border-radius:12px}.info-placeholder h3{margin-bottom:6px;font-size:16px}.info-placeholder p{font-size:14px;margin:0}.info-privacy{padding-top:20px}.info-placeholder-label{font-size:12px;color:var(--muted);margin-left:8px}.info-privacy p{padding:12px;background:#284bff06;border-radius:10px}
@media(max-width:360px){.home-info-header{padding:12px 14px 8px}.home-info-header h2{font-size:20px}.home-info-content{padding:16px;max-height:calc(100dvh - 96px)}.info-contact-grid{grid-template-columns:1fr}}
@media(prefers-reduced-transparency:reduce){.home-info,.home-info-button{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}.home-info::backdrop{background:#08163344;-webkit-backdrop-filter:none;backdrop-filter:none}}
.start-form{width:min(400px,100%);margin:auto;display:flex;flex-direction:column;align-items:center;gap:18px}
.start-logo{position:relative;width:min(100%,320px,max(96px,calc(var(--visual-height,100dvh) - 420px)));aspect-ratio:1;flex:none;pointer-events:none}
.logo-fallback{display:block;width:100%;height:100%;object-fit:contain}
.logo-fallback{will-change:transform}
.start-city-field{width:100%;border:0;margin:0;padding:0;min-width:0}
.city-presets{display:flex;gap:10px;width:100%;overflow-x:auto;padding:4px;scrollbar-width:none;scroll-snap-type:x proximity}
.city-presets::-webkit-scrollbar{display:none}
.city-preset{position:relative;flex:1 0 0;min-width:0;cursor:pointer;scroll-snap-align:start;-webkit-tap-highlight-color:transparent}
.city-preset input{position:absolute;width:1px;height:1px;opacity:0}
.city-preset-face{display:flex;flex-direction:column;align-items:center;gap:5px;background:rgba(255,255,255,.65);border-radius:16px;padding:10px 6px 9px;box-shadow:0 3px 12px #0816330b;transition:background-color .18s,box-shadow .18s;font-size:16px;font-weight:600;line-height:1.2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.city-preset img{display:block;width:100%;height:88px;object-fit:contain;pointer-events:none;user-select:none;transform:scale(1);transition:transform .26s cubic-bezier(.22,1,.36,1)}
.city-name{min-height:2.4em;display:flex;align-items:center;justify-content:center;text-align:center;font-size:14px;line-height:1.2;max-width:100%}
.city-preset input:checked+.city-preset-face img{transform:scale(1.06)}
.city-preset:hover .city-preset-face{background:rgba(255,255,255,.9)}
.city-preset input:checked+.city-preset-face{background:rgba(222,232,255,.90);box-shadow:0 3px 14px #284bff16}
.city-preset input:focus-visible+.city-preset-face{outline:3px solid var(--blue);outline-offset:1px}
#start-game{width:calc(100% - 8px);min-height:52px;border:0;font-size:17px;font-weight:600;flex:none}
@media(max-width:360px){.city-presets{gap:7px}.city-preset img{height:70px}.city-preset-face{padding:8px 4px;font-size:15px}}
@media(max-height:500px){.start-scene{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.start-form{gap:10px;width:min(360px,100%)}.start-logo{width:min(100%,240px,max(72px,calc(var(--visual-height,100dvh) - 234px)))}.city-preset img{height:58px}.city-preset-face{padding:7px 5px;gap:3px;font-size:15px}}
@media(prefers-reduced-motion:reduce){.city-preset-face,.city-preset img{transition:none}.logo-fallback{will-change:auto}}
@media(prefers-reduced-transparency:reduce){.city-preset-face{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}.city-preset input:checked+.city-preset-face{background:#DEE8FF}}
.score-track{position:absolute;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:calc(max(8px,env(safe-area-inset-bottom)) + var(--keyboard-inset));height:24px;display:grid;gap:4px;pointer-events:none;z-index:6}
.score-segment{height:24px;min-width:0;background:#284bff12;border-radius:7px;display:grid;place-items:center;overflow:hidden}
.score-segment-icon{display:grid;place-items:center;width:20px;height:20px;color:var(--ink)}
.score-segment[data-tier="full"] .score-segment-icon{color:#108D50}.score-segment[data-tier="partial"] .score-segment-icon{color:#D69A20}.score-segment[data-tier="zero"] .score-segment-icon{color:#D52D3A}
.score-segment-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.score-gain-layer{position:absolute;inset:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));pointer-events:none;z-index:7}
.score-gain{position:absolute;display:block;background:var(--blue);color:white;padding:7px 13px;border:0;border-radius:16px;font-size:28px;line-height:1;font-weight:600;letter-spacing:-1px;white-space:nowrap;transform:rotate(-6deg);box-shadow:0 4px 12px #284bff33;pointer-events:none}
.score-gain[hidden]{display:none}
@media(max-width:650px){.score-gain{font-size:24px;padding:6px 11px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){.score-gain{transform:none}.score-segment-icon{will-change:auto}}
/* The location trigger is the only settings control outside the menu. */
.top-overlay{position:absolute;z-index:5;top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));width:min(680px,calc(100% - 232px));pointer-events:none;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.top-controls{display:flex;gap:8px;align-items:center;max-width:100%;pointer-events:none}.top-controls>*{pointer-events:auto}.location-control{position:relative;min-width:0}
.location-button{display:flex;align-items:center;gap:9px;min-height:46px;padding:8px 13px;color:var(--ink);font-size:13px;font-weight:600;white-space:nowrap}
.location-button svg{width:21px;height:21px;fill:none;stroke:var(--blue);stroke-width:1.8;flex-shrink:0}.location-button svg.chevron{width:14px;height:14px;display:block;align-self:center;margin-left:auto;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.location-label{display:flex;flex-direction:column;gap:2px;min-width:0;text-align:left;line-height:1.1}#map-area{overflow:hidden;text-overflow:ellipsis}

#mode-picker{width:100%;min-height:46px;padding:8px 36px 8px 12px;background-color:rgba(40,75,255,.94);color:white;font-size:16px;font-weight:500;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='m3 5 4 4 4-4' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:14px 14px;-webkit-backdrop-filter:none;backdrop-filter:none}
.popover{position:absolute;top:calc(100% + 8px);left:0;padding:8px;width:280px;max-width:calc(100vw - max(16px,env(safe-area-inset-left)) - max(16px,env(safe-area-inset-right)));max-height:calc(var(--visual-height,100dvh) - var(--menu-top,74px) - max(12px,env(safe-area-inset-bottom)));overflow:auto;overscroll-behavior:contain;touch-action:pan-y;z-index:10;pointer-events:auto;scrollbar-width:thin}
.menu-label{display:block;font-size:10px;letter-spacing:.6px;text-transform:uppercase;font-weight:600;color:var(--muted);margin:3px 9px 7px}.menu-mode{border-top:1px solid var(--line);margin-top:8px;padding-top:8px}
.popover button{display:block;width:100%;border:0;border-radius:8px;padding:10px 12px;min-height:44px;background:transparent;text-align:left;font-size:14px}.popover button:hover{background:rgba(237,240,255,.72)}.city-button small{display:block;font-size:11px;color:var(--muted);margin-top:2px}.popover .city-button.active{background:var(--yellow);font-weight:600}
.popover #restart{margin-top:0;text-align:center;background:var(--coral);border:0;font-weight:600}.popover #restart:hover{background:#FF626B}
.question-prompt{background:var(--prompt-glass);color:var(--ink);padding:14px 16px;pointer-events:auto;width:min(360px,100%)}h2{font-size:19px;line-height:1.2;margin:0;font-weight:600;letter-spacing:-.2px}.target-name{font-size:20px;line-height:1.25;margin:8px 0 0;font-weight:600;letter-spacing:-.2px}
.answer-tail{position:absolute;left:0;right:0;bottom:0;height:calc(var(--score-clearance) + var(--keyboard-inset));z-index:2;pointer-events:auto;touch-action:pan-y}
.bottom-overlay{position:absolute;z-index:4;left:50%;transform:translateX(-50%);bottom:calc(var(--score-clearance) + var(--keyboard-inset));width:min(460px,calc(100% - 32px));display:flex;flex-direction:column;gap:8px;pointer-events:auto;touch-action:pan-y}.bottom-overlay>*{pointer-events:auto}#question-body:empty{display:none}#question-body{display:flex;flex-direction:column;gap:8px;max-height:40dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:12px}.choices{padding:7px;display:grid;grid-template-columns:1fr 1fr;gap:6px}.choice{display:flex;align-items:center;text-align:left;gap:8px;border:0;border-radius:8px;background:rgba(248,249,255,.52);min-height:46px;padding:9px 10px;font-size:13px}.choice:before{content:'';width:12px;height:12px;border-radius:50%;border:1.5px solid #94a1d1;flex-shrink:0}.choice:hover{background:rgba(237,240,255,.72);}.choice.selected{background:var(--prompt-glass)}.choice.selected:before{border:4px solid var(--blue)}#question-actions{display:flex;gap:8px;align-items:stretch;pointer-events:auto}#question-actions>*{pointer-events:auto}.primary-button{min-height:52px;display:flex;align-items:center;justify-content:center;border:0;border-radius:12px;background:rgba(40,75,255,.94);color:white;padding:12px 22px;font-size:16px;font-weight:600;box-shadow:0 4px 18px #284bff33;flex:1}.primary-button:hover:not(:disabled){background:#1535d9;}.primary-button:disabled{background:rgba(215,224,255,.92);color:#465c98;box-shadow:0 3px 12px #08163315}.secondary-button{min-height:52px;padding:10px 15px;background:var(--glass);color:var(--blue);font-size:13px;font-weight:500}.secondary-button:hover{background:rgba(237,240,255,.72);}
/* Result cards use colour, icons and labels together. */
.result-card.correct,.round-list .correct{--result:#147d52;--result-tint:#e7f6ed}
.result-card.close,.round-list .close{--result:#a96a00;--result-tint:#fff3cc}
.result-card.miss,.round-list .miss{--result:#c72760;--result-tint:#ffe7f0}
.result-card.revealed,.round-list .revealed,.session-card{--result:#284bff;--result-tint:#edf0ff}
.feedback{padding:0;overflow:auto;overscroll-behavior:contain;background:var(--glass-card);scrollbar-width:thin}
.result-card,.session-card{border-radius:16px;border:0;box-shadow:0 7px 30px #08163320;background:var(--glass-card);animation:result-in .18s ease-out}
.result-header{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px;padding:18px 18px 16px;background:linear-gradient(120deg,color-mix(in srgb,var(--result-tint) 65%,transparent),transparent 85%)}
.result-icon{width:52px;height:52px;display:grid;place-items:center;background:var(--result-tint);border:1px solid color-mix(in srgb,var(--result) 22%,white);border-radius:15px;color:var(--result)}
.result-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.result-state{display:flex;flex-direction:column;gap:5px;min-width:0}.result-state>span:first-child{font-size:11px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:var(--result)}.result-state>span+span{font-size:12px;color:var(--muted);line-height:1.35}
.result-points{text-align:right;white-space:nowrap;display:flex;flex-direction:column}.result-points strong{font-size:36px;line-height:1;font-weight:600;letter-spacing:-1px;color:var(--result)}.result-points>span{font-size:10px;color:var(--muted);margin-top:4px}
.result-info{padding:0 18px 17px}.result-info h3{font-size:20px;font-weight:600;line-height:1.2;margin:0 0 8px;letter-spacing:-.2px}.result-info p{font-size:13px;line-height:1.5;color:var(--muted);margin:0}
.clue-deduction{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;border-top:1px solid var(--line);padding:10px 18px;font-size:11px;color:var(--muted);background:rgba(247,248,252,.45)}.clue-deduction>span:nth-child(2){font-weight:600;color:#a32755}.clue-deduction>span:last-child:not(:nth-child(2)){font-size:10px}
.session-card{overflow:hidden}.session-best{display:flex;justify-content:space-between;gap:10px;padding:2px 18px 14px;font-size:12px;color:var(--muted)}.session-best b{color:var(--blue);font-weight:600}
.round-list{display:flex;gap:6px;padding:0 18px 18px}.round-list span{flex:1;min-width:0;display:flex;align-items:center;flex-direction:column;gap:6px;border-radius:8px;background:var(--result-tint);color:var(--result);padding:8px 2px;font-size:13px}.round-list b{font-weight:600}.round-list svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@keyframes result-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.result-card,.session-card{animation:none}}
.clue-control{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;min-height:44px}.clue-budget{font-size:10px;color:var(--muted);text-align:right}.auto-clues{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--blue);font-weight:500}.auto-clues svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7}
.map-attribution{position:absolute;z-index:3;right:8px;bottom:4px;font-size:9px;line-height:1.4;background:#ffffffdf;color:#46567c;border-radius:3px;padding:2px 4px;text-decoration:none}.map-attribution:hover{text-decoration:underline}
.street-label{fill:#334367;font-family:DINish,sans-serif;font-weight:500;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round;pointer-events:none}.map-road{fill:none;stroke:#fff;stroke-width:8px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.road-spine{fill:none;stroke:#9aa5c7;stroke-width:1.3px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.road-minor{stroke:#a6b4cd;stroke-width:2.7px}.road-unplayable{stroke:#bdc6db;stroke-width:1.7px}.map-building{fill:#dce1f6;stroke:#9eaed1;stroke-width:.8px;vector-effect:non-scaling-stroke}.map-park{fill:var(--green);stroke:#6EAA1F;stroke-width:1px;vector-effect:non-scaling-stroke}.map-water{fill:var(--water);stroke:#078ACE;stroke-width:1px;vector-effect:non-scaling-stroke}.map-land{fill:#f0f2ff;stroke:#8cb4cb;stroke-width:1px;vector-effect:non-scaling-stroke}.highlight-street{fill:none;stroke:var(--pink);stroke-width:8px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.highlight-building{fill:#8b9fff;stroke:#284bff;stroke-width:2px;vector-effect:non-scaling-stroke}.answer-connector{fill:none;stroke:var(--blue);stroke-width:2.5px;stroke-dasharray:6 4;vector-effect:non-scaling-stroke}.marker-label{font-family:DINish,sans-serif;fill:#182a61;font-weight:600;paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;pointer-events:none}.marker-letter{fill:white;font-family:DINish,sans-serif;font-weight:600;pointer-events:none}
@media(max-width:650px){.top-overlay{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));width:calc(100% - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right)));gap:8px}.top-controls{display:flex;flex-direction:column;align-items:flex-start;width:calc(100% - 122px);gap:6px}.location-control,.location-button{width:100%}.location-button{font-size:12px;padding:8px 9px;gap:7px;min-height:46px}.location-button svg{width:19px;height:19px}.question-prompt{padding:11px 13px;width:100%}h2{font-size:17px}.target-name{font-size:18px}.bottom-overlay{width:calc(100% - 24px);bottom:calc(var(--score-clearance) + var(--keyboard-inset));gap:7px}.choice{font-size:12px;padding:8px;min-height:44px}.secondary-button{padding:10px 12px}.map-attribution{font-size:8px}.popover{max-width:calc(100vw - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right)))}}
@media(max-width:360px){.location-button{font-size:11px;gap:5px}}
@media(max-height:500px) and (min-width:651px){.top-overlay{width:min(520px,calc(100% - 96px));gap:6px}.question-prompt{padding:9px 12px}.bottom-overlay{left:auto;right:18px;transform:none;bottom:calc(var(--score-clearance) + var(--keyboard-inset));width:min(360px,43%)}#question-body,.feedback{max-height:49dvh}}

#question-body{pointer-events:none;max-height:min(40dvh,max(100px,calc(var(--visual-height,100dvh) - 300px)))}#question-body>*{pointer-events:auto}
@media(max-height:500px) and (min-width:651px){#question-body{max-height:49dvh}}


@media(max-width:650px) and (max-height:500px){.top-overlay{width:min(230px,calc(45% - 20px));gap:6px}.top-controls{width:100%;gap:4px}.location-button{padding:7px;gap:4px}.question-prompt{padding:8px 10px}.bottom-overlay{left:auto;right:18px;transform:none;width:calc(55% - 30px);bottom:calc(var(--score-clearance) + var(--keyboard-inset))}#question-body{max-height:49dvh}.secondary-button{padding:8px}.primary-button{padding:10px}.choice{font-size:11px;padding:7px}}

html,body{touch-action:pan-x pan-y}.game-layout{touch-action:pan-x pan-y}button,select,summary,a{touch-action:manipulation}
/* Avoid iOS form-focus page zoom on the remaining native picker. */
#mode-picker{font-size:16px}

.highlight-clue{fill:#bdc7fa;stroke:#748add;stroke-width:1.3px;vector-effect:non-scaling-stroke}#map-highlight[data-outcome=correct] .answer-building{fill:var(--correct-tint,#B9F5D3);stroke:var(--success)}.clue-label{font-weight:500}
@media(max-width:650px){.result-header{grid-template-columns:46px minmax(0,1fr) auto;gap:10px;padding:14px 14px 13px}.result-icon{width:46px;height:46px;border-radius:13px}.result-icon svg{width:25px;height:25px}.result-points strong{font-size:33px}.result-state>span:first-child{font-size:10px}.result-state>span+span{font-size:11px}.result-info{padding:0 14px 14px}.result-info h3{font-size:18px}.result-info p{font-size:12px;line-height:1.5}.clue-deduction{padding:9px 14px}.session-best{padding:0 14px 12px}.round-list{padding:0 14px 14px;gap:5px}.clue-control{gap:7px;margin-top:10px}.clue-budget{font-size:9px}}
@media(max-height:500px){.feedback{max-height:calc(100dvh - 140px)}.result-header{padding:12px 14px;gap:9px;grid-template-columns:42px minmax(0,1fr) auto}.result-icon{width:42px;height:42px}.result-points strong{font-size:30px}.result-info{padding:0 14px 12px}.result-info h3{font-size:17px}.result-info p{font-size:12px}.clue-deduction{padding:8px 14px}.clue-control{gap:6px}.clue-budget{font-size:9px}}

/* Frost stays on the outer surface; text and child controls remain crisp. */
.primary-button,.map-attribution,.map-key{-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur))}
#mode-picker option{background:#284bff;color:white}


.compass-south{fill:#08163338}.compass-north{fill:var(--ink)}
.street-halo{fill:none;stroke:var(--pink);stroke-width:8px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none;opacity:0;animation:street-pulse .7s ease-out 2}
@keyframes street-pulse{0%{stroke-width:8px;opacity:0}25%{opacity:.32}100%{stroke-width:23px;opacity:0}}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--glass:rgba(255,255,255,.97);--glass-card:rgba(255,255,255,.98);--prompt-glass:var(--yellow)}}
@media(prefers-reduced-transparency:reduce){:root{--glass:#fff;--glass-card:#fff;--prompt-glass:var(--yellow);--glass-blur:0px}.primary-button,#mode-picker{background-color:var(--blue)}.primary-button:disabled{background:#d7e0ff}.map-key,.map-attribution{background:#fff}}
@media(prefers-reduced-motion:reduce){.street-halo{animation:none}}

/* One action palette: cobalt for progress, coral for hints, yellow for prompts. */
.clue-button,#reveal{background:rgba(228,232,255,.90);border:0;color:var(--ink);font-weight:600;box-shadow:0 3px 10px #08163312}
.clue-button{min-height:44px;padding:9px 12px;border-radius:9px;font-size:12px;white-space:nowrap}
.clue-button:hover:not(:disabled),#reveal:hover:not(:disabled){background:rgba(214,221,255,.95);}
.clue-button:disabled{background:rgba(255,255,255,.55);color:#54617e;box-shadow:none}
.clue-budget{color:var(--ink);font-weight:500}.clue-deduction>span:nth-child(2){color:#b31855}
.secondary-button{}.choice.selected{background:var(--prompt-glass)}
/* Orientation, true scale and legend share the top-right corner. */
.map-key{position:absolute;right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));display:flex;align-items:center;gap:9px;padding:5px 8px 5px 5px;border:1px solid #08163324;border-radius:12px;background:var(--glass);box-shadow:0 2px 10px #08163312;color:var(--ink);pointer-events:none;z-index:2}
.north-arrow{position:relative;width:30px;height:30px;flex:none;border-right:1px solid #0816331a}
.north-arrow span{position:absolute;top:1px;left:0;width:100%;text-align:center;font-size:8px;line-height:1;font-weight:600;z-index:1}
.north-arrow svg{position:absolute;inset:0;width:30px;height:30px;transform-origin:50% 50%;fill:var(--ink)}
.scale-bar{width:60px;flex:none;display:flex;flex-direction:column;gap:3px;align-items:flex-start;font-size:9px;line-height:1.1;font-weight:500}
.scale-bar div{height:5px;border:1.5px solid var(--ink);border-top:0}
.map-legend{display:flex;flex-direction:column;gap:4px;font-size:9px;font-weight:500;line-height:1.1;white-space:nowrap}
.map-legend span{display:flex;align-items:center;gap:5px}.map-legend i{width:9px;height:9px;border-radius:3px;border:1px solid #08163335;flex:none}.legend-park{background:var(--green)}.legend-water{background:var(--water)}
.map-attribution{bottom:calc(max(8px,env(safe-area-inset-bottom)) + 10px + var(--keyboard-inset));right:max(8px,env(safe-area-inset-right))}

@media(prefers-reduced-transparency:reduce){.clue-button,#reveal{background:#E4E8FF}.clue-button:disabled{background:#fff}.map-key{background:#fff}}
/* In short phone landscape, keep scrolling feedback below the map key. */
@media(max-width:650px) and (max-height:500px){.feedback{max-height:calc(var(--visual-height,100dvh) - max(12px,env(safe-area-inset-top)) - 70px - max(22px,env(safe-area-inset-bottom)) - 70px)}}

/* Calm surfaces, bright fills: colour communicates status without outlines. */
.top-controls{width:100%}.location-control{max-width:100%}.location-button{max-width:100%}
.result-card.correct,.round-list .correct{--result:var(--correct-ink,#06462D);--result-tint:var(--correct-tint,#B9F5D3);--result-glass:rgba(185,245,211,.9)}
.result-card.close,.round-list .close{--result:var(--close-ink,#644100);--result-tint:var(--close-tint,#FFE69A);--result-glass:rgba(255,230,154,.9)}
.result-card.miss,.round-list .miss{--result:var(--miss-ink,#821A24);--result-tint:var(--miss-tint,#FFD5D9);--result-glass:rgba(255,213,217,.9)}
.result-card.revealed,.round-list .revealed,.session-card{--result:var(--revealed-ink,#183B99);--result-tint:var(--revealed-tint,#DDE7FF);--result-glass:rgba(221,231,255,.9)}
.result-card,.session-card{background:var(--result-glass);border-radius:16px;border:0;color:var(--result);box-shadow:0 6px 24px #08163318}
.result-header{background:none;padding:18px 18px 13px;grid-template-columns:36px minmax(0,1fr) auto;gap:12px}
.result-icon{width:36px;height:36px;border:0;border-radius:0;background:none;color:var(--result)}
.result-icon svg{width:30px;height:30px;stroke-width:2.4}
.result-state>span+span,.result-points>span,.result-info p,.session-best{color:var(--result)}
.result-info h3{font-size:20px}.result-info p{line-height:1.5}
.clue-deduction{background:none;border-top:1px solid #08163312;color:var(--result)}
.clue-deduction>span:nth-child(2){color:var(--result)}
.choice{box-shadow:inset 0 0 0 1px #0816330c}.choice.selected{background:var(--yellow);box-shadow:none}
.secondary-button{box-shadow:0 3px 12px #08163312}.primary-button{box-shadow:0 4px 16px #284bff26}
.clue-button,#reveal{border:0}.map-key{border:0}.popover #restart{border:0}.score-gain{border:0}
@media(max-width:650px){.top-controls{width:max-content;min-height:0}.result-header{grid-template-columns:30px minmax(0,1fr) auto;padding:14px 14px 12px;gap:9px}.result-icon{width:30px;height:30px}.result-icon svg{width:26px;height:26px}.result-info h3{font-size:18px}}
@media(max-width:650px) and (max-height:500px){.top-controls{width:100%;min-height:0}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.result-card,.session-card{background:var(--result-tint)}}
@media(prefers-reduced-transparency:reduce){.result-card,.session-card{background:var(--result-tint)}}

.map-square{fill:#edf0ff;stroke:#b7c2df;stroke-width:1px;vector-effect:non-scaling-stroke}

/* One header row; the key progressively yields space to the location trigger. */
.top-overlay{width:auto;max-width:calc(100% - max(16px,env(safe-area-inset-left)) - max(16px,env(safe-area-inset-right)) - 54px);gap:0}
.top-controls{width:max-content;max-width:100%;min-height:0;display:flex;flex-direction:row;gap:0}
.location-control{width:auto;max-width:100%}.location-button{width:max-content;max-width:min(260px,100%)}
.map-key{display:flex;flex-direction:row;align-items:center;gap:9px;width:max-content;height:40px;padding:5px 8px 5px 5px;white-space:nowrap}
.north-arrow{border-right:0}.map-legend{display:flex;flex-direction:row;gap:9px;padding:0;font-size:9px}
.map-legend>span{display:inline-flex;align-items:center;gap:5px}
/* Only the content scrolls; Check/Next remain outside it. */
.answer-content{display:flex;flex-direction:column;gap:8px;max-height:var(--answer-content-max,60dvh);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:16px;pointer-events:auto;min-height:0}
.answer-content>*{flex-shrink:0;pointer-events:auto;touch-action:pan-y}
.answer-content #question-body{max-height:none;overflow:visible;pointer-events:auto}
.answer-content #question-body>*{pointer-events:auto}
.answer-content .feedback{max-height:none;overflow:visible}
.question-prompt{width:100%}.result-info h3:last-child{margin-bottom:0}
@media(max-width:650px){.top-overlay{max-width:calc(100% - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right)) - 54px)}.top-controls{width:max-content;min-height:0;gap:0}.map-key{right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top))}.answer-content{gap:7px}}
@media(max-width:650px) and (max-height:500px){.top-overlay{width:auto;max-width:calc(100% - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right)) - 54px)}.top-controls{width:max-content;min-height:0}}

/* Compact task/target hierarchy and readable place information. */
.question-prompt{padding:16px;border-radius:16px}
.question-prompt h2{font-size:18px;line-height:1.25}
.landmark-target{padding:16px;border-radius:16px;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:12px;min-height:64px}
.landmark-target.has-sticker{grid-template-columns:minmax(0,1fr) 96px;min-height:124px}
.landmark-target .target-name{font-size:22px;line-height:1.2;font-weight:600;margin:0;overflow-wrap:break-word}
.landmark-sticker{grid-column:2;align-self:center;justify-self:center;width:96px;height:96px;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 2px 3px #08163314)}
.landmark-sticker.is-introducing{visibility:hidden}
.sticker-intro{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden;background:rgba(24,34,66,var(--intro-shade,0))}
.sticker-intro-image{position:absolute;top:0;left:0;object-fit:contain;transform-origin:center;will-change:transform,opacity;pointer-events:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 8px 12px #08163328)}
@media(max-width:650px){.landmark-target.has-sticker{grid-template-columns:minmax(0,1fr) 80px;column-gap:10px;min-height:108px}.landmark-sticker{width:80px;height:80px}}
@media(max-width:359px),(max-height:500px){.landmark-target.has-sticker{grid-template-columns:minmax(0,1fr) 64px;column-gap:8px;min-height:92px}.landmark-sticker{width:64px;height:64px}.has-sticker .target-name{font-size:20px}}
@media(prefers-reduced-motion:reduce){.sticker-intro{display:none}.landmark-sticker.is-introducing{visibility:visible}}
.result-card{padding:16px}
.compact-result-heading{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.compact-result-heading h3{font-size:22px;line-height:1.2;font-weight:600;letter-spacing:-.2px;margin:0;overflow-wrap:break-word}
.compact-status{display:inline-flex;gap:6px;align-items:center;font-size:12px;line-height:1.5;font-weight:600;padding:4px 9px;background:#ffffff55;border-radius:99px;white-space:nowrap}
.compact-status svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;flex:none}
.landmark-description{font-size:16px;line-height:1.5;margin:10px 0 0;color:var(--result)}
.result-distance{font-size:13px;line-height:1.4;margin:12px 0 0;padding:8px 10px;background:#ffffff45;border-radius:8px;color:var(--result)}
@media(max-width:650px){.question-prompt,.landmark-target,.result-card{padding:14px}}
@media(max-width:359px){
  .compact-result-heading h3{font-size:20px}
}
/* The world scene covers, rather than rebuilds, the paused game. */
.world-scene{position:absolute;inset:0;z-index:20;background:var(--water);isolation:isolate}
.world-map-container{position:absolute;inset:0;touch-action:none;user-select:none;cursor:grab;overflow:hidden}
.world-map-container.is-dragging{cursor:grabbing}
#world-map{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.world-land{fill:#dce1f6;stroke:#a4b2d8;stroke-width:1px;vector-effect:non-scaling-stroke}
.world-land path{vector-effect:non-scaling-stroke}
.world-connectors line{stroke:#08163355;stroke-width:1px;vector-effect:non-scaling-stroke}
.world-labels,.world-dots{position:absolute;inset:0;pointer-events:none}
.world-city-button{position:absolute;min-height:44px;min-width:44px;padding:10px 12px;font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;pointer-events:auto;touch-action:none;border:0}
.world-dot{position:absolute;width:16px;height:16px;border:2px solid white;border-radius:50%;background:var(--blue);box-shadow:0 0 0 7px #284bff22;transform:translate(-50%,-50%);pointer-events:none}
.world-back{position:absolute;z-index:2;top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));min-height:44px;padding:10px 14px;font-size:13px;font-weight:600;color:var(--ink)}
.world-north{position:absolute;z-index:2;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));width:40px;height:40px;border-radius:50%;pointer-events:none}
.world-north span{position:absolute;top:4px;width:100%;text-align:center;font-size:9px;font-weight:600}
.world-north svg{width:40px;height:40px;position:absolute;inset:0}
.world-attribution{position:absolute;z-index:2;right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));font-size:10px;color:var(--ink);background:var(--glass);padding:3px 6px;border-radius:4px;text-decoration:none}
.popover #open-world{margin-top:8px;background:var(--blue);color:white;text-align:center;font-weight:600}
@media(max-width:650px){.world-back{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left))}.world-north{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}}
/* A consistent task/action palette and labelled legends only. */
.choice{color:var(--ink)}
.choice:before{content:'';border:1.5px solid #08163366;border-radius:50%;width:14px;height:14px}
.choice.selected{background:var(--yellow);color:var(--ink)}
.choice:before{width:18px;height:18px;box-sizing:border-box}
.choice.selected:before{content:'';border:0;border-radius:50%;background:radial-gradient(circle,var(--yellow) 0 3px,var(--ink) 3.5px);}
.map-key[data-collapse=compact] .map-legend,.map-key[data-collapse=north] .map-legend{display:none}
.map-key[data-collapse=north] .scale-bar{display:none}
.hint-settings{font-size:12px;line-height:1.4;color:var(--muted);margin:12px 4px 4px}
/* A larger finish keeps the actions fixed while the trophy-like card scrolls. */
.bottom-overlay.is-complete{width:min(640px,calc(100% - 32px))}
.is-complete .session-card{padding:24px;color:var(--ink);background:var(--glass);border-radius:16px}
.finish-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:500;line-height:1.4}
.finish-top>span:last-child{color:var(--blue);white-space:nowrap}
.finish-main{display:flex;align-items:center;gap:18px;justify-content:space-between;margin-top:22px}
.finish-rank{display:inline-block;background:var(--yellow);padding:9px 14px;border-radius:12px;font-size:30px;line-height:1.1;font-weight:600;letter-spacing:-.4px}
.finish-line{font-size:15px;line-height:1.4;margin:10px 0 0;color:var(--muted)}
.finish-compass{width:86px;height:86px;flex:none;transform:rotate(-10deg)}
.finish-compass svg{width:100%;height:100%}.finish-compass circle{fill:#dde7ff}.finish-compass path{fill:var(--blue)}
.finish-score{display:flex;align-items:baseline;gap:14px;margin-top:14px}.finish-score strong{font-size:88px;line-height:1.05;letter-spacing:-3px;color:var(--blue);font-weight:600}.finish-score>span{font-size:20px;color:var(--muted)}
.finish-stats{display:flex;align-items:center;justify-content:space-between;font-size:13px;gap:12px;margin:10px 0 16px;color:var(--muted)}
.finish-stats b{color:var(--ink);font-weight:600;margin-left:5px}
.is-complete .round-list{padding:0;gap:7px;margin:0 0 18px}.round-list>span{background:var(--result-glass);border:0;border-radius:10px}
.share-result{width:100%;min-height:48px}
.share-options{position:absolute;inset:0;z-index:30;background:#08163355;display:flex;align-items:center;justify-content:center;padding:20px;touch-action:pan-y}
.share-panel{width:min(420px,100%);max-height:calc(100dvh - 40px);overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px;color:var(--ink)}
.share-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.share-heading button{background:none;border:0;font-size:26px;min-width:44px;min-height:44px;color:var(--ink)}
.share-panel a{text-decoration:none;flex:none}
#share-message{font-size:13px;line-height:1.4;color:var(--muted)}
@media(max-width:650px){.bottom-overlay.is-complete{width:calc(100% - 24px)}.is-complete .session-card{padding:18px}.finish-top{font-size:12px;flex-wrap:wrap;gap:4px}.finish-main{gap:10px;margin-top:18px}.finish-rank{font-size:25px;padding:8px 10px}.finish-compass{width:64px;height:64px}.finish-line{font-size:14px}.finish-score strong{font-size:76px}.finish-score>span{font-size:17px}.is-complete .round-list{gap:5px}}
@media(max-width:359px){.finish-rank{font-size:23px}.finish-compass{width:48px;height:48px}.finish-score strong{font-size:68px}.finish-score{gap:10px}.is-complete .session-card{padding:16px}}
@media(max-height:500px){.bottom-overlay.is-complete{left:auto;right:18px;transform:none;width:min(640px,calc(65% - 30px))}.finish-main{margin-top:14px}.finish-score strong{font-size:64px}.finish-compass{width:56px;height:56px}}
@media(prefers-reduced-transparency:reduce){.is-complete .session-card{background:#fff}.share-options{background:#eef0ff}.share-panel{background:#fff}}

/* Visual hints never intercept map gestures. */
#map-exclusions,.hint-excluded,.hint-street{pointer-events:none}
.hint-excluded{fill:var(--coral);fill-opacity:.18}
.hint-street{fill:none;stroke:var(--blue);stroke-width:6px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;opacity:.78}
.hint-street-label{fill:#1836b8;font-weight:600;stroke:#f3f5ff}
.hint-map-key{position:absolute;right:max(16px,env(safe-area-inset-right));top:calc(max(16px,env(safe-area-inset-top)) + 46px);display:flex;align-items:center;gap:6px;padding:6px 9px;border-radius:9px;font-size:11px;font-weight:600;color:var(--miss-ink,#821A24);pointer-events:none;z-index:2;white-space:nowrap}
.hint-map-key i{width:12px;height:12px;border-radius:3px;background:repeating-linear-gradient(135deg,#FF424D35 0 1px,transparent 1px 5px),var(--miss-tint,#FFD5D9)}
@media(max-width:650px){.hint-map-key{right:max(12px,env(safe-area-inset-right));top:calc(max(12px,env(safe-area-inset-top)) + 46px)}}
/* Keep both Find it cards visible in short landscape whenever their content fits. */
@media(max-height:500px){.question-prompt{padding:10px 12px}.question-prompt h2{font-size:16px}.landmark-target{padding:8px 12px}.landmark-target.has-sticker{min-height:80px}}

.marker-letter-dark{fill:var(--ink)}

/* City-local daily selection and archive. */
.home-info-button:hover{background:rgba(255,255,255,.40)}
.city-status{font-size:11px;font-weight:600;color:#334367;line-height:1.25}.city-countdown{font-size:9px;font-weight:400;line-height:1.3;white-space:nowrap;color:#54617e}
.day-selector{display:flex;width:100%;min-height:48px;align-items:center;padding:0;border:0;font-weight:600}.day-selector #selected-day{flex:1;text-align:left;padding:8px 16px}.day-selector .calendar-icon{flex:0 0 52px;display:grid;place-items:center}.day-selector svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;display:block}
.location-control{display:flex;align-items:center;gap:8px;min-width:0}.location-button{width:auto;min-width:0;cursor:default}.exit-button{display:grid;place-items:center;flex:0 0 46px;width:46px;min-height:46px;padding:0;color:var(--blue)}.exit-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.exit-button:hover{background:rgba(228,232,255,.90)}
#daily-message{margin:0;font-size:14px;color:#54617e;text-align:center}.menu-quiz-date{margin:12px 6px;color:#54617e;font-size:13px}
.archive-dialog{width:min(420px,calc(100% - 24px));max-height:calc(100dvh - 24px);border:0;border-radius:20px;padding:20px;background:#f8f9ff;color:var(--ink);box-shadow:0 18px 70px #08163326;overflow:auto}.archive-dialog::backdrop{background:#08163340}.archive-dialog header,.archive-month{display:flex;align-items:center;justify-content:space-between;gap:10px}.archive-dialog h2{font-size:20px;margin:0}.archive-dialog h3{font-size:17px;margin:0}.archive-dialog header button,.archive-month button{min-width:44px;min-height:44px;border:0;background:transparent;font-size:26px;border-radius:12px}.archive-month{margin:10px 0}.archive-weekdays,.archive-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}.archive-weekdays{text-align:center;font-size:12px;color:#54617e;margin-bottom:4px}.archive-days button{height:44px;min-width:0;border:0;background:transparent;border-radius:12px;font-size:16px;position:relative}.archive-days button:disabled{color:#a6aec0;cursor:default}.archive-days .is-selected{background:var(--blue);color:white}.archive-days .is-today{font-weight:700}.archive-days button[data-status="Completed"]:after,.archive-days button[data-status="In progress"]:after{content:'';position:absolute;bottom:3px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:var(--success)}.archive-days button[data-status="In progress"]:after{background:var(--blue)}.archive-days .is-selected:after{background:white!important}.archive-caption{font-size:12px;color:#54617e;margin:14px 0 0}
.dev-settings{width:100%;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0}.dev-settings legend{font-size:12px;font-weight:600}.dev-settings label{display:grid;gap:4px;font-size:12px}.dev-settings input,.dev-settings select{width:100%;min-width:0;font-size:16px;min-height:40px;border:0;background:#e7ebff;border-radius:8px;padding:6px}.start-scene:has(.dev-settings:not([hidden])){align-items:flex-start}.start-scene:has(.dev-settings:not([hidden])) .start-logo{width:150px}.start-scene:has(.dev-settings:not([hidden])) .start-form{padding:12px 0}
@media(max-width:359px){.city-preset-face{padding-left:3px;padding-right:3px}.city-countdown{font-size:8px}.archive-dialog{padding:12px}}
@media(max-height:620px){.start-logo{width:min(100%,240px,max(64px,calc(var(--visual-height,100dvh) - 338px)))}.start-form{gap:10px}.city-preset img{height:58px}}
@media(max-height:400px) and (min-width:500px){.start-form{display:grid;grid-template-columns:150px minmax(250px,360px);width:min(570px,100%);align-items:center;gap:8px 16px}.start-logo{grid-row:1 / 4;width:150px}.start-city-field,.day-selector,#start-game,#daily-message{grid-column:2}.city-preset img{height:52px}.start-city-field{margin:0}.city-preset-face{padding:6px 3px;gap:2px}.city-name{font-size:14px}.city-countdown{font-size:8px}.day-selector{min-height:44px}.dev-settings{grid-column:1 / -1}}

.practice-label{position:absolute;top:calc(100% + 8px);left:0;padding:4px 9px;font-size:12px;font-weight:600;pointer-events:none}

.archive-month button:disabled{opacity:.35}
/* Localized home actions stay visible while the content above can scroll. */
.start-action{width:100%;display:flex;justify-content:center}.start-scene .start-logo{width:min(100%,290px,max(96px,calc(var(--visual-height,100dvh) - 480px)))}
.home-language-button{position:fixed;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.20);box-shadow:0 2px 10px #08163308;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:6}
.home-language-button:hover{background:rgba(255,255,255,.40)}.home-language-button img{display:block;width:32px;height:32px;border-radius:50%;box-shadow:0 1px 4px #08163314}.home-language-button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
@media(prefers-reduced-transparency:reduce){.home-language-button{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}}
.language-dialog{width:min(420px,calc(100% - 32px));max-height:calc(var(--visual-height,100dvh) - 32px);overflow:auto;padding:20px;color:var(--ink);background:rgba(255,255,255,.96);border:0;border-radius:16px}.language-dialog::backdrop{background:#08163330}.language-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.language-dialog h2{font-size:22px;margin:0}.language-dialog header button{width:44px;height:44px;border:0;background:#08163308;border-radius:50%;font-size:24px}.language-dialog select{display:block;width:100%;min-height:48px;border:0;border-radius:10px;background:#e4e8ff;font-size:16px;padding:10px;margin:8px 0 20px}.language-dialog fieldset{margin:0;padding:0;border:0;display:grid;gap:4px}.language-dialog legend{font-weight:600;margin-bottom:8px}.language-dialog fieldset label{display:flex;align-items:center;gap:12px;min-height:44px}.language-dialog input{width:20px;height:20px;accent-color:var(--blue)}.language-dialog p{min-height:20px;font-size:14px}.name-primary{display:block}.name-secondary{display:block;margin-top:3px;font-size:14px;font-weight:400;line-height:1.3;color:var(--muted)}.choice .name-secondary{font-size:13px}.target-name .name-secondary{font-size:15px}.content-status{position:absolute;z-index:30;top:70px;left:50%;transform:translateX(-50%);padding:10px 16px;font-size:14px}.content-status button{border:0;border-radius:8px;background:var(--blue);color:white;min-height:44px;padding:8px 14px;margin-left:8px}
@media(max-width:650px),(max-height:620px){.start-scene{align-items:flex-start;padding-top:max(60px,env(safe-area-inset-top));padding-bottom:calc(100px + env(safe-area-inset-bottom) + var(--keyboard-inset));scroll-padding-bottom:calc(100px + env(safe-area-inset-bottom))}.start-form{margin:auto;gap:14px}.start-action{position:fixed;z-index:5;left:0;right:0;bottom:var(--keyboard-inset);padding:12px max(20px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:linear-gradient(transparent,rgba(240,242,255,.96) 25%);pointer-events:auto}.start-action #start-game{max-width:400px;width:100%;min-height:52px}.start-scene .start-logo{width:min(100%,290px,max(96px,calc(var(--visual-height,100dvh) - 440px)))}}
@media(max-height:400px) and (min-width:500px){.start-scene{padding-top:max(60px,env(safe-area-inset-top))}.start-form{grid-template-columns:130px minmax(250px,360px);gap:8px 16px}.start-scene .start-logo{grid-row:1 / 4;width:130px}.city-preset img{height:46px}.city-presets{padding:2px}.city-preset-face{padding:4px}.start-action{grid-column:auto}}

/* Flag rows share one geometry: no platform-native arrow or emoji sizing. */
.language-picker{position:relative;margin:8px 0 22px}
.language-select{display:grid;grid-template-columns:28px minmax(0,1fr) 14px;align-items:center;gap:12px;width:100%;min-height:52px;padding:12px 16px;border:0;border-radius:12px;background:#e4e8ff;text-align:left;font-size:16px;font-weight:500}
.language-flag{display:block;flex:none;width:28px;height:28px;border-radius:50%}
.language-chevron{display:block;width:14px;height:14px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;justify-self:end}
.language-options{position:absolute;top:calc(100% + 7px);left:0;right:0;z-index:2;padding:6px;border-radius:12px;background:#fff;box-shadow:0 8px 26px #08163322;max-height:180px;overflow:auto}
.language-option{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:10px;border:0;border-radius:8px;background:transparent;text-align:left;font-size:16px}
.language-option.is-active{background:#edf0ff}.language-option[aria-selected=true]{font-weight:600}.language-option[aria-selected=true]:after{content:'';width:8px;height:8px;border-radius:50%;background:var(--blue);margin-left:auto}
.language-dialog fieldset .language-known-row{display:grid;grid-template-columns:24px minmax(0,1fr) 20px;gap:12px;min-height:48px;padding:10px;border-radius:12px;background:#08163303;font-size:16px}
.language-known-row .language-flag{width:24px;height:24px}.language-known-row:has(input:checked){background:#eaf0ff}.language-dialog .language-known-row input{margin:0}
.language-select:disabled{opacity:.6}

/* Score hierarchy: outcome, answer and explanation; final totals stay separate. */
.result-card{padding:20px}.landmark-description{margin-top:14px}
.is-complete .session-card{padding:24px;background:var(--glass-card)}
.finish-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:16px}
.finish-context{display:flex;flex-direction:column;gap:3px;min-width:0}.finish-context strong{font-size:17px;font-weight:600}.finish-context>span{font-size:12px;color:var(--muted)}
.finish-kicker{padding:5px 9px;border-radius:8px;background:#284bff0b;color:var(--blue);font-size:12px;line-height:1.4;white-space:normal}
.finish-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:22px}
.finish-score{margin:0;flex-wrap:wrap;gap:4px 10px;min-width:0}.finish-score strong{font-size:80px;letter-spacing:-2px}.finish-score>span{font-size:17px;white-space:nowrap}
.finish-compass{width:72px;height:72px;transform:rotate(-8deg)}
.finish-main{display:block;margin-top:18px}.finish-rank{max-width:100%;font-size:27px;padding:8px 12px;overflow-wrap:break-word}.finish-line{margin-top:10px;line-height:1.5}
.finish-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.finish-stats>span{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:#284bff06;border-radius:10px;font-size:12px}.finish-stats b{font-size:18px;margin:0}
.is-complete .round-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-bottom:18px}.is-complete .round-list>span{min-height:62px;padding:10px 2px;background:var(--result-tint);gap:6px}.is-complete .round-list b{font-size:15px}
.share-result{min-height:52px}
@media(max-width:650px){.result-card{padding:16px}.is-complete .session-card{padding:18px}.finish-top{grid-template-columns:1fr;gap:8px}.finish-kicker{justify-self:start}.finish-hero{margin-top:18px}.finish-score{flex-direction:column;align-items:flex-start;gap:3px}.finish-score strong{font-size:68px}.finish-score>span{font-size:16px}.finish-compass{width:60px;height:60px}.finish-rank{font-size:25px}.finish-stats{gap:8px}.finish-stats>span{padding:10px;gap:8px}.is-complete .round-list{gap:5px}.is-complete .round-list>span{min-height:58px}}
@media(max-width:359px){.is-complete .session-card{padding:16px}.finish-score strong{font-size:64px}.finish-compass{width:52px;height:52px}.finish-rank{font-size:23px}.finish-stats>span{align-items:flex-start;flex-direction:column;gap:4px}}
@media(max-height:500px){.finish-score strong{font-size:60px}.finish-compass{width:52px;height:52px}}
@media(prefers-reduced-transparency:reduce){.is-complete .session-card{background:#fff}}

/* Collector results: the answer tray itself remains the map-tap shield. */
.bottom-overlay.is-complete{left:50%;right:auto;transform:translateX(-50%);top:var(--finish-header,80px);bottom:calc(var(--score-clearance) + var(--keyboard-inset));margin:auto 0;width:min(640px,calc(100% - 24px));height:fit-content;max-height:calc(var(--visual-height,100dvh) - var(--finish-header,80px) - var(--score-clearance) - var(--keyboard-inset) - 12px);padding:24px;gap:0;border-radius:22px;background:var(--glass-card);box-shadow:0 15px 40px #08163320;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);overflow:hidden}
.is-complete #answer-content{flex:0 1 auto;min-height:0;max-height:var(--answer-content-max);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.is-complete #question-body{max-height:none;overflow:visible;display:block;pointer-events:auto;border-radius:0}
.collector-finish-heading{display:flex;flex-direction:column;gap:5px;padding-bottom:20px;border-bottom:1px solid #e8ecf4;margin-bottom:21px}.collector-finish-heading>strong{font-size:24px;font-weight:600}.collector-date{font-size:21px;line-height:1.3;font-weight:600;color:#5b6b85}.collector-finish-heading>small{font-size:12px;color:var(--muted)}
.collector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 10px}.collector-tile{--tile-art:#e5f2e7;--tile-label:#f4faf4;--tile-status:#18ad65;--tile-icon:#fff;border:0;border-radius:13px;overflow:hidden;min-width:0;padding:0;background:var(--tile-label);color:#25364d;cursor:pointer;box-shadow:0 3px 9px #0816330b;text-align:left;transition:transform .18s,box-shadow .18s}.tier-partial{--tile-art:#fff0c6;--tile-label:#fffaec;--tile-status:#ffc13d;--tile-icon:#8f5f0b}.tier-missed{--tile-art:#f7e7eb;--tile-label:#fcf5f7;--tile-status:#ed6475;--tile-icon:#fff}.collector-tile:hover{transform:translateY(-3px);box-shadow:0 8px 15px #08163316}.collector-tile:focus-visible{outline:3px solid var(--blue);outline-offset:-3px}
.collector-art{display:flex;align-items:center;justify-content:center;position:relative;height:136px;background:var(--tile-art)}.collector-sticker{width:91%;height:90%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;user-select:none}.tier-missed .collector-sticker{filter:saturate(.55);opacity:.9}.collector-street{width:88%;height:auto;filter:drop-shadow(0 4px 2px #08163319);transform:rotate(-4deg)}.collector-title{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:56px;background:var(--tile-label);padding:9px;font-size:13px;line-height:1.2;font-weight:600}.collector-title>.name-primary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.collector-title>.name-secondary{font-size:10px;line-height:1.2;font-weight:400;margin-top:3px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.collector-status{position:absolute;left:9px;top:9px;width:23px;height:23px;border-radius:50%;background:var(--tile-status,#18ad65);color:var(--tile-icon,#fff);display:grid;place-items:center;z-index:2}.collector-status svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.is-complete #question-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 52px;gap:9px;margin-top:20px;flex:none}.is-complete #question-actions>button{width:100%;min-width:0;flex:none}#play-again{grid-column:auto}.is-complete .collector-home{min-height:52px}.collector-home{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:12px;border:0;background:#edf0ff;color:#173dbe;font-size:15px;font-weight:600}.collector-home:hover{background:#e2e8ff}.collector-home svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.collector-practice{min-height:52px;padding:0;display:grid;place-items:center;border:0;border-radius:12px;background:#edf0ff;color:#173dbe;box-shadow:0 3px 12px #08163308}.collector-practice:hover{background:#e2e8ff}.collector-practice svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.collector-viewing>#answer-content,.collector-viewing>#question-actions{visibility:hidden}.collector-inspector{position:absolute;inset:0;z-index:5;padding:18px;background:#f0f3fc;border-radius:inherit;display:grid;grid-template-rows:44px minmax(0,1fr) 44px;gap:12px;container-type:size;overflow:hidden;pointer-events:auto}.collector-inspector[hidden]{display:none}.collector-viewer-header{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;width:100%;gap:8px}.collector-viewer-header>strong{text-align:center;font-size:17px;font-weight:600}.collector-viewer-header>span{font-size:12px;color:#66738a;text-align:right}.collector-control{width:44px;height:44px;flex:none;border-radius:50%;border:0;background:#ffffffb8;color:#081633;box-shadow:0 3px 12px #08163308;display:grid;place-items:center;padding:0}.collector-control:disabled{opacity:.3}.collector-control svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.collector-control:focus-visible,.collector-dot:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.collector-viewer-stage{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;touch-action:pan-y}.collector-card-wrap{width:min(330px,calc((100cqh - 124px)*.666667),calc(100cqw - 12px));perspective:1500px}.collector-full-card{position:relative;width:100%;aspect-ratio:2/3;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.8,.2,1);touch-action:pan-y;cursor:pointer;user-select:none;-webkit-user-select:none;outline-offset:4px}.collector-full-card.flipped{transform:rotateY(180deg)}.collector-full-card:focus-visible{outline:3px solid var(--blue);border-radius:19px}.collector-face{position:absolute;inset:0;border-radius:19px;border:6px solid white;background:#fff;box-shadow:0 12px 28px #08163324;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;min-height:0}.collector-front{display:flex;flex-direction:column;--tile-art:#e5f2e7;--tile-status:#18ad65;--tile-icon:#fff}.collector-front.tier-partial{--tile-art:#fff0c6;--tile-status:#ffc13d;--tile-icon:#8f5f0b}.collector-front.tier-missed{--tile-art:#f7e7eb;--tile-status:#ed6475;--tile-icon:#fff}.collector-card-header{padding:12px 12px 9px;display:flex;justify-content:space-between;gap:8px;font-size:9px;color:#627184;font-weight:600;letter-spacing:.6px;text-transform:uppercase}.collector-large-art{flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;background:var(--tile-art)}.collector-large-art .collector-status{left:auto;right:12px;top:12px;width:32px;height:32px}.collector-large-art .collector-status svg{width:19px;height:19px}/* Hide the front badge explicitly: nested SVG layers can bleed through a flipped face in WebKit. */
.collector-front[aria-hidden="true"] .collector-status{visibility:hidden}.collector-card-name{padding:16px;background:#081633;color:white;min-height:90px;display:flex;flex-direction:column;justify-content:center}.collector-card-name h2{font-size:24px;line-height:1.1;font-weight:600;margin:0 0 7px;letter-spacing:-.3px}.collector-card-name .name-secondary{font-size:12px;color:#ffffffa6;margin-top:5px;display:block}.collector-card-name>span{font-size:11px;color:#ffffffa6}.collector-card-footer{padding:12px 13px;display:flex;justify-content:space-between;gap:8px;font-size:9px;font-weight:600;color:#68748b;letter-spacing:.3px}.collector-back{transform:rotateY(180deg);background:#f8faf3;padding:22px;display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain}.collector-back-label{font-size:11px;color:var(--blue);font-weight:600}.collector-back h2{font-size:26px;font-weight:600;line-height:1.15;margin:14px 0 18px}.collector-back .name-secondary{display:block;font-size:13px;color:var(--muted);margin-top:6px}.collector-back p{font-size:16px;line-height:1.5;color:#40516c;margin:0 0 20px}.collector-back-footer{margin-top:auto;padding-top:15px;border-top:1px solid #dbe5d6;font-size:11px;color:#527a55;line-height:1.5}.collector-viewer-nav{display:flex;align-items:center;justify-content:space-between;gap:6px;width:min(360px,100%);margin:auto}.collector-dots{display:flex;align-items:center;justify-content:center;flex:1}.collector-dot{width:26px;height:44px;border:0;background:none;padding:0;display:grid;place-items:center}.collector-dot>span{width:6px;height:6px;border-radius:50%;background:#b6bfce}.collector-dot[aria-current=true]>span{width:9px;height:9px;background:var(--blue)}
.answer-result-art{float:right;width:90px;height:95px;margin:0 0 10px 14px;display:flex;align-items:center;justify-content:center}.answer-result-art .collector-sticker{width:100%;height:100%}.answer-result-art .collector-street{width:100%}.result-card .landmark-description{clear:both;padding-top:8px;font-size:16px;line-height:1.5}
.share-panel{max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;width:min(520px,calc(100vw - 24px))}#share-preview{display:block;width:100%;max-height:44dvh;object-fit:contain;border-radius:12px;background:#f0f2ff;margin:12px 0}#share-preview[hidden]{display:none}.share-answer-toggle{display:flex;align-items:center;gap:9px;min-height:44px;font-size:14px}.share-answer-toggle input{width:20px;height:20px;accent-color:var(--blue)}#native-share-result[hidden]{display:none}
@media(max-width:650px){.bottom-overlay.is-complete{padding:18px}.collector-finish-heading>strong{font-size:22px}.collector-date{font-size:20px}.collector-grid{gap:9px 7px}.collector-art{height:102px}.collector-title{height:53px;padding:8px 7px;font-size:12px}.collector-status{left:7px;top:7px;width:20px;height:20px}.collector-status svg{width:12px;height:12px}.collector-card-name h2{font-size:22px}.collector-card-name{padding:13px;min-height:80px}.collector-card-header,.collector-card-footer{font-size:8px;padding:10px}.collector-back{padding:17px}.collector-back h2{font-size:22px}.collector-viewer-header>strong{font-size:15px}}
@media(max-width:359px){.bottom-overlay.is-complete{padding:15px}.collector-grid{gap:8px 6px}.collector-art{height:90px}.collector-title{height:50px;padding:7px 5px;font-size:11px}.collector-date{font-size:19px}.collector-inspector{padding:12px;gap:10px}.collector-dot{width:24px}.collector-card-name h2{font-size:20px}.collector-card-name{min-height:72px}.collector-large-art .collector-status{width:24px;height:24px;right:7px;top:7px}.collector-large-art .collector-status svg{width:14px;height:14px}}
@media(max-height:500px){.bottom-overlay.is-complete{padding:12px}.is-complete #question-actions{margin-top:12px;gap:5px}.collector-practice{min-height:52px}.collector-inspector{padding:8px 14px;gap:6px}.collector-card-wrap{width:min(420px,calc((100cqh - 106px)*1.5),calc(100cqw - 12px))}.collector-full-card{aspect-ratio:3/2}.collector-front{display:grid;grid-template-columns:46% 54%;grid-template-rows:26px minmax(0,1fr) 24px}.collector-card-header,.collector-card-footer{grid-column:1/-1;padding:6px 9px;font-size:8px}.collector-large-art{grid-column:1;grid-row:2}.collector-card-name{grid-column:2;grid-row:2;padding:12px;min-height:0}.collector-card-name h2{font-size:20px}.collector-card-name>span{font-size:10px}.collector-back{padding:14px}.collector-back h2{font-size:20px;margin:8px 0 12px}.collector-back p{font-size:14px}.collector-back-footer{padding-top:10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.collector-tile,.collector-full-card{transition:none}.collector-tile:hover{transform:none}}
@media(prefers-reduced-transparency:reduce){.bottom-overlay.is-complete{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}}
@supports not ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))){.bottom-overlay.is-complete{background:#fffffff7}}

.collector-art{height:var(--collector-art-height,136px)}

/* Keep result cards visible before scrolling on short Safari/phone windows. */
@media(max-height:500px){.collector-finish-heading{flex-direction:row;align-items:baseline;flex-wrap:wrap;column-gap:12px;row-gap:4px;padding-bottom:8px;margin-bottom:10px}.collector-finish-heading>strong{font-size:20px}.collector-date{font-size:16px}.collector-title{height:42px;padding:6px 8px;font-size:12px}.is-complete #question-actions{margin-top:10px;gap:6px}}
#retry-share-image[hidden]{display:none}