:root{--font:ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--scale:1;--ink-w:2.5px;--r-sticker:20px;--r-control:999px;--lift:4px;--tap:48px;--ease-bounce:cubic-bezier(.34, 1.56, .64, 1);--bg:#f3fbff;--surface:#fff;--surface-alt:#e8f6fd;--text:#16324a;--text-muted:#4b6476;--primary:#5a189a;--primary-text:#fff;--accent:#ffb703;--correct:#005f99;--wrong:#b33c00;--close:#7a5a00;--border:#cfe3ee;--ink:var(--text)}html[data-text=s]{--scale:.9}html[data-text=l]{--scale:1.15}html[data-text=xl]{--scale:1.3}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--font);font-size:calc(16px * var(--scale));color:var(--text);background:var(--bg);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;line-height:1.45}#app{flex-direction:column;height:100dvh;display:flex}h1,h2,h3{letter-spacing:-.01em;margin:0;line-height:1.15}h1{font-size:1.75em;font-weight:800}h2{font-size:1.25em;font-weight:800}h3{font-size:1.05em;font-weight:700}p{margin:0}a{color:var(--primary)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}.screen{padding:20px 16px calc(96px + env(safe-area-inset-bottom));flex:1;inline-size:100%;max-inline-size:640px;margin-inline:auto;overflow-y:auto}.screen>*+*{margin-block-start:16px}.screen-header{align-items:center;gap:8px;display:flex}.muted{color:var(--text-muted)}.stack>*+*{margin-block-start:10px}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.sticker{background:var(--surface);border:var(--ink-w) solid var(--ink);border-radius:var(--r-sticker);box-shadow:0 var(--lift) 0 var(--ink);padding:16px}.sticker.flat{box-shadow:none}.btn{appearance:none;font:inherit;min-block-size:var(--tap);min-inline-size:var(--tap);border-radius:var(--r-control);border:var(--ink-w) solid var(--ink);background:var(--surface);color:var(--text);box-shadow:0 var(--lift) 0 var(--ink);cursor:pointer;justify-content:center;align-items:center;gap:8px;padding:10px 22px;font-weight:800;text-decoration:none;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.btn:active:not(:disabled){transform:translateY(var(--lift));box-shadow:0 0 0 var(--ink)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--primary);color:var(--primary-text)}.btn.accent{background:var(--accent);color:#1a1300}.btn.ghost{box-shadow:none;background:0 0;border-color:#0000}.btn.block{inline-size:100%}.btn.small{min-block-size:40px;padding:6px 14px;font-size:.9em}.icon-btn{inline-size:var(--tap);padding:0}input[type=text],input[type=email],textarea,select{font:inherit;border:var(--ink-w) solid var(--ink);background:var(--surface);inline-size:100%;color:var(--text);border-radius:14px;padding:12px 16px;font-size:max(16px,1em)}textarea{resize:vertical;min-block-size:140px}label{font-weight:700}fieldset{border:0;margin:0;padding:0}legend{margin-block-end:8px;padding:0;font-weight:800}.segmented{flex-wrap:wrap;gap:8px;display:flex}.segmented label{border:var(--ink-w) solid var(--ink);border-radius:var(--r-control);cursor:pointer;background:var(--surface);align-items:center;min-block-size:44px;padding:8px 16px;font-weight:700;display:inline-flex;position:relative}.segmented input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.segmented label:has(input:checked){background:var(--primary);color:var(--primary-text)}.segmented label:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}.switch{justify-content:space-between;align-items:center;gap:12px;min-block-size:48px;display:flex}.switch input{block-size:30px;inline-size:52px;accent-color:var(--primary)}.banner{background:var(--surface-alt);border:var(--ink-w) solid var(--ink);border-radius:14px;align-items:center;gap:10px;padding:10px 14px;font-weight:600;display:flex}.bottom-nav{z-index:20;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:var(--surface);border-block-start:var(--ink-w) solid var(--ink);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid;position:fixed;inset-block-end:0;inset-inline:0}.bottom-nav a{min-block-size:52px;color:var(--text-muted);border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:.8em;font-weight:700;text-decoration:none;display:flex}.bottom-nav a[aria-current=page]{color:var(--primary);background:var(--surface-alt)}.bottom-nav svg{block-size:24px;inline-size:24px}.game-map{background:var(--water,var(--map-water));touch-action:none;position:relative;overflow:hidden}.game-map__water{pointer-events:none;block-size:100%;inline-size:100%;position:absolute;inset:0}.game-map__ol{direction:ltr;position:absolute;inset:0}.game-map__shadow{filter:blur(var(--shadow-blur,4px));transform:translateY(var(--shadow-y,3px))}.game-map .ol-zoom{background:0 0;flex-direction:column;gap:8px;padding:0;display:flex;inset-block:42% auto;inset-inline:auto 10px}.game-map .ol-zoom button{background:var(--surface);block-size:44px;inline-size:44px;color:var(--text);border:var(--ink-w) solid var(--ink);box-shadow:0 3px 0 var(--ink);border-radius:14px;margin:0;font-size:22px;font-weight:800}.game-map__pin{cursor:grab;touch-action:none;filter:drop-shadow(0 3px #00000059);block-size:54px;inline-size:40px}.game-map__pin.dragging{cursor:grabbing;transform:translateY(-8px)scale(1.1)}.game-map__pin svg{block-size:100%;inline-size:100%}.game-map__pin path{fill:var(--map-pin);stroke:var(--map-pin-stroke);stroke-width:2.5px}.game-map__pin circle{fill:var(--map-pin-stroke)}.game-map__pin.drop{animation:pin-drop .42s var(--ease-bounce);transform-origin:50% 100%}@keyframes pin-drop{0%{opacity:0;transform:translateY(-40px)scaleY(1.1)}60%{opacity:1;transform:translateY(0)scaleY(.85)}to{transform:none}}.game-map__target,.game-map__answer{pointer-events:none;block-size:44px;inline-size:44px;position:relative}.game-map__target span,.game-map__answer span{border-radius:50%;margin:auto;position:absolute;inset:0}.game-map__target span:first-child{background:var(--map-target);border:4px solid var(--map-target-halo);block-size:20px;inline-size:20px}.game-map__target span:last-child{border:4px solid var(--map-target);block-size:44px;inline-size:44px;animation:1.4s ease-out infinite pulse}@keyframes pulse{0%{opacity:1;transform:scale(.45)}to{opacity:0;transform:scale(1.5)}}.game-map__answer span{background:var(--map-answer);border:4px solid var(--map-target-halo);block-size:24px;inline-size:24px;box-shadow:0 0 0 3px var(--map-answer)}.game-map__answer.pop span{animation:pop .46s var(--ease-bounce)}@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.35)}to{transform:scale(1)}}.reduce-motion *,html.reduce-motion *{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}html.reduce-motion .game-map__target span:last-child{opacity:.6;transform:scale(1.1);animation:none!important}.result-icon{flex:none;block-size:1.6em;inline-size:1.6em}.is-correct{--tone:var(--correct)}.is-wrong{--tone:var(--wrong)}.is-close{--tone:var(--close)}.chip{background:var(--surface);border:2px solid var(--ink);border-radius:999px;align-items:center;gap:4px;padding:4px 10px;font-size:.85em;font-weight:800;display:inline-flex}.tag{background:var(--surface-alt);border:2px solid var(--border);border-radius:999px;padding:2px 10px;font-weight:600}.map-frame{border:var(--ink-w) solid var(--ink);background:var(--map-water);border-radius:14px;position:relative;overflow:hidden}.top-bar{background:var(--surface);border-block-end:var(--ink-w) solid var(--ink);flex-wrap:wrap;flex:none;align-items:center;gap:12px 24px;padding:10px 32px;display:flex}.top-nav{flex-wrap:wrap;gap:4px;margin-inline-start:auto;display:flex}.top-nav a{border-radius:var(--r-control);min-block-size:48px;color:var(--text-muted);align-items:center;gap:8px;padding:8px 18px;font-weight:700;text-decoration:none;display:inline-flex}.top-nav a:hover{color:var(--text);background:var(--surface-alt)}.top-nav a[aria-current=page]{color:var(--primary);background:var(--surface-alt)}@media (width>=960px){.screen{max-inline-size:1200px;padding:40px 32px 64px}.screen>*+*{margin-block-start:24px}.screen.narrow{max-inline-size:760px}.screen>h1,.screen>header h1{font-size:2.25em}.sticker{padding:20px 24px}}.sr-only{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}