:root{--bg:#0f172a;--card:#1e293b;--fg:#f1f5f9;--accent:#38bdf8;--ocean:#0b2540;--land:#3b4a5f;--ok-text:#4ade80;--bad-text:#f87171;--ok:#16a34a;--bad:#dc2626}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);overscroll-behavior:none;font-family:system-ui,-apple-system,sans-serif}.app{max-width:480px;height:100%;padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));flex-direction:column;gap:12px;margin:0 auto;display:flex}header{justify-content:space-between;align-items:center;display:flex}h1{margin:0;font-size:1.25rem}.score{font-variant-numeric:tabular-nums;opacity:.8}.card{aspect-ratio:1;background:var(--ocean);border-radius:20px;flex:none;place-items:center;width:100%;padding:0;display:grid;position:relative;overflow:hidden}.card svg{width:100%;height:100%;max-height:100%}.card path{stroke:var(--bg);stroke-width:.5px;stroke-linejoin:round}.card .land{fill:var(--land)}.card .target{fill:var(--accent);stroke-width:.8px}.prompt{text-align:center;opacity:.7;margin:auto 0 0}.options{grid-template-columns:1fr 1fr;gap:10px;display:grid}.option,.next{font:inherit;color:var(--fg);background:var(--card);border:2px solid #0000;border-radius:14px;min-height:60px;padding:16px 8px}.option:active:not(:disabled){border-color:var(--accent)}.option.correct{background:var(--ok)}.option.wrong{background:var(--bad)}.next{background:var(--accent);color:var(--bg);min-height:52px;font-weight:600}.badge{z-index:1;letter-spacing:.04em;text-transform:uppercase;color:var(--bg);background:#fbbf24;border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:600;position:absolute;top:10px;left:10px}.reveal{text-align:center;pointer-events:none;paint-order:stroke fill;-webkit-text-stroke:6px var(--bg);flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:0 16px;font-size:2rem;font-weight:800;line-height:1.1;animation:.45s cubic-bezier(.2,1.4,.4,1) both reveal-pop;display:flex;position:absolute;inset:0}.reveal.right{color:var(--ok-text)}.reveal.wrong{color:var(--bad-text);animation-name:reveal-pop,reveal-shake;animation-duration:.45s,.4s;animation-delay:0s,.45s}@keyframes reveal-pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}@keyframes reveal-shake{25%{transform:translate(-8px)}75%{transform:translate(8px)}}@media (prefers-reduced-motion:reduce){.reveal,.reveal.wrong{animation:none}}.reveal small{-webkit-text-stroke-width:4px;font-size:1.05rem;font-weight:600}.right{align-items:center;gap:12px;display:flex}.icon{font:inherit;color:var(--fg);background:var(--card);border:0;border-radius:50%;width:40px;height:40px;font-size:1.25rem;line-height:1}.settings .scroll{flex-direction:column;flex:1;gap:20px;display:flex;overflow-y:auto}.field{border:0;margin:0;padding:0}.field legend{opacity:.7;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;padding:0;font-size:.85rem}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{font:inherit;color:var(--fg);background:var(--card);border:2px solid #0000;border-radius:999px;min-height:44px;padding:10px 16px}.chip.active{border-color:var(--accent);background:#0c4a6e;font-weight:600}.hint{opacity:.6;margin:8px 0 0;font-size:.85rem}.start{visibility:visible}.clue{text-align:center;color:var(--accent);place-items:center;padding:0 20px;font-size:2.5rem;font-weight:800;line-height:1.1;display:grid}.clue:has(.flag){grid-template-columns:minmax(0,1fr);padding:0 16px}.flag{object-fit:contain;border-radius:6px;width:100%;max-height:80%;box-shadow:0 2px 12px #0006}.loading{margin:auto}.select{font:inherit;width:100%;color:var(--fg);background:var(--card);border:2px solid #0000;border-radius:14px;min-height:48px;padding:12px}.stage{flex-direction:column;flex:1;gap:12px;min-height:0;display:flex}.stage.enter{animation:.28s ease-out both stage-in}.stage.leave{animation:.2s ease-in both stage-out}@keyframes stage-in{0%{opacity:0;transform:translate(28px)}to{opacity:1;transform:none}}@keyframes stage-out{0%{opacity:1;transform:none}to{opacity:0;transform:translate(-28px)}}@media (prefers-reduced-motion:reduce){.stage.enter,.stage.leave{animation:none}}.next{position:relative;overflow:hidden}.next .label{position:relative}.next .fill{transform-origin:0;background:#0f172a38;animation:linear both fill-up;position:absolute;inset:0}@keyframes fill-up{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media (prefers-reduced-motion:reduce){.next .fill{animation:none}}.summary{overflow-y:auto}.result{aspect-ratio:auto;background:var(--card);text-align:center;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:6px;padding:28px 16px;display:flex}.result .big{color:var(--accent);font-size:3.5rem;font-weight:800;line-height:1}.result .verdict{opacity:.8}.missed h2{opacity:.7;text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px;font-size:.85rem}.missed ul{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.missed li{background:var(--card);border-radius:12px;justify-content:space-between;gap:12px;padding:10px 14px;display:flex}.missed li small{opacity:.6}.actions{flex-direction:column;gap:10px;margin-top:auto;display:flex}.link{font:inherit;color:var(--fg);opacity:.7;background:0 0;border:0;padding:8px;text-decoration:underline}.statbar{font-variant-numeric:tabular-nums;align-items:center;gap:10px;font-size:.8rem;display:flex}.statbar .bar{background:var(--card);border-radius:999px;flex:1;height:6px;overflow:hidden}.statbar .bar span{background:var(--accent);border-radius:999px;height:100%;transition:width .4s;display:block}.daily{font:inherit;color:var(--bg);background:#fbbf24;border:0;border-radius:999px;padding:5px 12px;font-size:.8rem;font-weight:600}.result .earned{opacity:.7;margin-top:4px;font-size:.9rem}.card{width:min(100%,100dvh - 340px);margin-inline:auto}.card.result{width:100%}.mini{font:inherit;background:var(--card);border:0;border-radius:50%;width:30px;height:30px;padding:0;font-size:1rem;line-height:1}.mapwrap{background:var(--ocean);border-radius:16px;flex:1;min-height:0;position:relative;overflow:auto}.mapwrap svg{display:block}.mapwrap path{stroke:var(--bg);stroke-width:.4px;cursor:pointer}.m-back{fill:var(--land);opacity:.55;pointer-events:none}path.m0{fill:#3b4a5f}path.m1{fill:#f59e0b}path.m2{fill:#38bdf8}path.m3{fill:#22c55e}path.sel{stroke:#fff;stroke-width:1.4px}.zoom{gap:6px;width:max-content;margin:0 8px 8px auto;display:flex;position:sticky;bottom:8px;left:100%}.zoom button{font:inherit;width:38px;height:38px;color:var(--fg);background:#0f172ad9;border:0;border-radius:50%;font-size:1.2rem}.info{min-height:1.5em}.muted{opacity:.6;font-weight:400}.legend{flex-wrap:wrap;gap:6px 14px;font-size:.8rem;display:flex}.dot{vertical-align:baseline;border-radius:50%;width:10px;height:10px;display:inline-block}i.dot.m0{background:#3b4a5f}i.dot.m1{background:#f59e0b}i.dot.m2{background:#38bdf8}i.dot.m3{background:#22c55e}.badges{grid-template-columns:1fr;align-content:start;gap:8px;display:grid}.badge-card{background:var(--card);opacity:.55;border-radius:14px;align-items:center;gap:14px;padding:12px 14px;display:flex}.badge-card.got{opacity:1}.badge-card .emoji{filter:grayscale();font-size:2rem}.badge-card.got .emoji{filter:none}.badge-card>div{flex-direction:column;flex:1;gap:2px;display:flex}.badge-card small{opacity:.7}.badge-card .when{color:#4ade80;opacity:1}.meter{background:var(--bg);border-radius:999px;height:5px;margin-top:4px;overflow:hidden}.meter span{background:var(--accent);height:100%;display:block}.toast{left:50%;top:max(12px, env(safe-area-inset-top));max-width:calc(100% - 32px);color:var(--bg);z-index:10;background:#fbbf24;border-radius:999px;padding:10px 18px;font-weight:700;animation:.4s cubic-bezier(.2,1.4,.4,1) both toast-in;position:fixed;transform:translate(-50%);box-shadow:0 4px 20px #00000080}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)scale(.6)}to{opacity:1;transform:translate(-50%)scale(1)}}.mapwrap.fit{flex:none}.pin .dot{fill:#fbbf24;stroke:var(--bg);stroke-width:1.5px}.pin .pulse{fill:none;stroke:#fbbf24;stroke-width:1.5px;transform-box:fill-box;transform-origin:50%;animation:1.8s ease-out infinite pin-pulse}@keyframes pin-pulse{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.2)}}@media (prefers-reduced-motion:reduce){.pin .pulse{opacity:0;animation:none}}.card .tile{aspect-ratio:1;cursor:pointer;background:#08182ceb;border:1.5px solid #f1f5f98c;border-radius:10px;width:27%;max-width:120px;padding:0;position:absolute;bottom:8px;right:8px;overflow:hidden;box-shadow:0 2px 10px #00000080}.tile svg{width:100%;height:100%;display:block}.loc path{fill:#475569;stroke:#0f172a;stroke-width:.3px}.card .loc .here{fill:var(--accent);stroke:#fff;stroke-width:.5px}.loc .ring{fill:none;stroke:#fbbf24;stroke-width:1.2px}.loc .pin .dot,.loc .pin .pulse{stroke-width:.5px}.welcome{justify-content:space-between}.hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;display:flex}.hero img{border-radius:22px}.hero h1{font-size:2.2rem}.hero p{opacity:.7;margin:0}.welcome .actions{margin-top:0}.welcome .hint{text-align:center;margin:0}.input{font:inherit;width:100%;color:var(--fg);background:var(--card);border:2px solid #0000;border-radius:14px;min-height:48px;padding:12px 14px}.input:focus{border-color:var(--accent);outline:none}label.field .legend{opacity:.7;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;font-size:.85rem;display:block}form.scroll{flex-direction:column;flex:1;gap:16px;display:flex;overflow-y:auto}.tabs{flex:none}.alert{color:#fecaca;background:#7f1d1d;border-radius:12px;margin:0;padding:10px 14px;font-size:.9rem}.notice{color:#bbf7d0;background:#14532d;border-radius:12px;margin:0;padding:10px 14px;font-size:.9rem}.next:disabled{opacity:.5}.guestbar{opacity:.85;background:var(--card);border-radius:10px;justify-content:space-between;align-items:center;gap:8px;padding:6px 10px;font-size:.8rem;display:flex}.guestbar button{font:inherit;color:var(--bg);background:var(--accent);border:0;border-radius:999px;padding:4px 12px;font-size:.8rem;font-weight:600}.nudge{background:var(--card);border-radius:14px;flex-direction:column;gap:6px;padding:14px;font-size:.9rem;display:flex}.nudge span{opacity:.75}.zp{touch-action:none;cursor:zoom-in;-webkit-user-select:none;user-select:none;position:absolute;inset:0;overflow:hidden}.zp.zoomed{cursor:grab}.zp-inner{transform-origin:0 0;will-change:transform;width:100%;height:100%}.zp-inner svg{display:block}.zp-reset{font:inherit;color:var(--fg);background:#0f172ad9;border:1px solid #f1f5f966;border-radius:999px;padding:4px 12px;font-size:.75rem;font-weight:600;position:absolute;top:8px;right:8px}.sort{flex:1;width:auto;min-width:140px}.mlist{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.mlist li{border-bottom:1px solid #94a3b826;grid-template-columns:10px 1fr auto;align-items:center;gap:10px;padding:10px 4px;display:grid}.mlist .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
