:root{--vh: 1vh}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none;background-color:var(--bg, #0b1220)}html,body{touch-action:manipulation;overflow-x:hidden;max-width:100%}body{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-sizing:border-box}input,textarea,[contenteditable],.selectable{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}button,[role=button],a,label,summary{touch-action:manipulation}button,input,select,textarea{font-family:inherit;font-size:inherit}input,textarea,select{font-size:max(16px,1em)}button,[role=button]{min-height:44px;min-width:44px;cursor:pointer}.board,.field,canvas,.drag-surface{touch-action:none}.control-layer{position:fixed;inset:0;z-index:30;pointer-events:none;touch-action:none}.control-layer>*{pointer-events:auto}.safe-inset{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--sea: #0c1c28;--sea-deep: #081521;--land: #2a3a48;--land-border: #486072;--panel: #12293a;--panel-deep: #0e2130;--text: #e8f0f4;--muted: #a9bcc8;--ink: #0c1c28;--accent: #ffd166;--solved: #46cf72;--hot: #ff6b64;--radius: 14px;--font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}[hidden]{display:none!important}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--sea-deep);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{min-height:100vh;min-height:calc(var(--vh, 1vh) * 100);display:flex;flex-direction:column;background:radial-gradient(120% 90% at 50% 0%,#103049 0%,var(--sea-deep) 62%)}.main-content{flex:1 0 auto;display:flex;flex-direction:column;align-items:stretch;padding:max(10px,env(safe-area-inset-top)) 12px 8px;min-height:0}.site-footer{flex-shrink:0;text-align:center;padding:12px;font-size:12px;color:var(--muted)}.site-footer a{color:var(--muted)}body.playing .site-footer{display:none!important}.screen{width:100%;max-width:680px;margin:0 auto;flex:1 1 auto;display:flex;flex-direction:column;min-height:0}button{font-family:inherit;cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:12px 18px;border:1px solid #2e4657;border-radius:var(--radius);background:var(--panel);color:var(--text);font-size:16px;font-weight:600;transition:transform .08s ease,background .15s ease,border-color .15s ease}.btn:active{transform:scale(.98)}.btn.primary{background:linear-gradient(180deg,#2ec4b6,#1c9c90);border-color:#1c9c90;color:#04231f}.btn.ghost{background:transparent;border-color:#274050}.btn .sub{font-size:12px;font-weight:500;opacity:.75;margin-left:4px}.btn:disabled{opacity:.55;cursor:default}.linkbtn{background:none;border:none;color:var(--muted);font-size:14px;padding:8px 10px;min-height:40px;border-radius:8px}.linkbtn:hover{color:var(--text)}.menu-actions{display:flex;flex-direction:column;gap:10px;max-width:420px;width:100%;margin:0 auto}.menu{justify-content:center;text-align:center;gap:4px;padding:18px 0 24px}.brand{margin-bottom:6px}.brand-mark{width:76px;height:76px;margin:0 auto 10px;border-radius:20px;background:radial-gradient(circle at 68% 34%,var(--hot) 0 9px,transparent 10px),radial-gradient(circle at 30% 70%,#2ec4b6 0 5px,transparent 6px),var(--sea);border:1px solid #24384a;position:relative}.brand-mark:after{content:"";position:absolute;inset:14px;border-radius:50%;border:2px solid #35495b}.brand-title{font-size:40px;margin:0;letter-spacing:-.02em;background:linear-gradient(90deg,#7fe6db,#ffd166);-webkit-background-clip:text;background-clip:text;color:transparent}.brand-tag{color:var(--muted);max-width:30ch;margin:6px auto 12px;font-size:15px;line-height:1.4}.mode-pick,.lobby-modes{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:6px auto 4px}.chip{min-height:44px;padding:9px 16px;border-radius:999px;border:1px solid #2e4657;background:var(--panel-deep);color:var(--muted);font-weight:600;font-size:14px}.chip.on{background:#1d3d4a;border-color:#2ec4b6;color:var(--text)}.mode-blurb{color:var(--muted);font-size:13.5px;line-height:1.4;max-width:40ch;margin:4px auto 14px;min-height:2.6em}.menu-foot{display:flex;justify-content:center;gap:4px;flex-wrap:wrap;margin-top:14px}.best{color:var(--muted);margin-top:10px;font-size:14px}.best strong{color:var(--accent)}.game{gap:8px;height:100%}.hud{flex:0 0 auto;display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted)}.hud-mode{font-weight:700;color:var(--text)}.hud-left{font-variant-numeric:tabular-nums}.hud-timer{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700;color:var(--text);background:var(--panel);border-radius:8px;padding:3px 9px}.hud-timer.low{color:var(--hot)}.hud-quit{margin-left:auto}.hud-timer:not([hidden])+.hud-quit{margin-left:0}.mapwrap{flex:0 0 auto;position:relative;height:34vh;min-height:158px;max-height:46vh;border-radius:var(--radius);overflow:hidden;background:var(--sea);border:1px solid #1c3040}.map{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.silbox{position:absolute;top:8px;right:8px;background:#f0f6faf0;border-radius:10px;padding:6px 6px 3px;display:flex;flex-direction:column;align-items:center;box-shadow:0 3px 12px #0000004d}.silbox canvas{width:92px;height:92px;display:block}.sil-cap{font-size:10px;color:#33475a;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.play{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;gap:8px}.search{flex:0 0 auto;position:relative}.search-form{display:flex;gap:8px}.search-input{flex:1 1 auto;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid #33506380;background:var(--panel-deep);color:var(--text);font-size:16px}.search-input:focus{outline:2px solid #2ec4b6;outline-offset:1px}.search-go{min-width:74px;min-height:48px;border-radius:12px;border:none;background:var(--accent);color:#241a00;font-weight:700;font-size:15px}.search-go:disabled{opacity:.5}.search-list{list-style:none;margin:6px 0 0;padding:0;position:absolute;z-index:20;left:0;right:0;background:var(--panel);border:1px solid #2e4657;border-radius:12px;overflow:hidden;max-height:46vh;overflow-y:auto;box-shadow:0 12px 30px #0006}.search-list:not(.open){display:none}.search-item{display:flex;align-items:center;gap:8px;min-height:46px;padding:10px 14px;border-bottom:1px solid #1e3444}.search-item:last-child{border-bottom:none}.search-item.active{background:#1d3d4a}.search-item.taken{opacity:.42}.si-name{flex:1 1 auto}.si-tag{font-size:11px;color:var(--muted)}.search-empty{padding:12px 14px;color:var(--muted);font-size:14px}.guesslist{list-style:none;margin:0;padding:0;flex:1 1 auto;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch}.guesslist.small{max-height:42vh}.grow{display:grid;grid-template-columns:12px 1fr auto 22px 64px auto;align-items:center;gap:8px;padding:9px 6px;border-bottom:1px solid #18303f;animation:rowin .25s ease}@keyframes rowin{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.g-swatch{width:12px;height:12px;border-radius:3px;background:var(--heat)}.g-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.g-dist{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px;white-space:nowrap}.g-arrow{font-size:18px;color:var(--accent);text-align:center;line-height:1}.g-bar{height:8px;border-radius:4px;background:#16303f;overflow:hidden}.g-fill{display:block;height:100%;background:var(--heat)}.g-pct{font-variant-numeric:tabular-nums;font-weight:700;font-size:13px;text-align:right;min-width:34px}.grow.correct .g-name,.grow.correct .g-dist{color:var(--solved)}.results{justify-content:flex-start;gap:6px;text-align:center;padding-top:8px}.res-win,.res-lose{font-size:26px;margin:6px 0 2px}.res-win{color:var(--solved)}.res-lose{color:var(--hot)}.res-answer{font-size:16px;margin:2px 0}.res-streak{color:var(--muted);margin:0 0 8px}.results .guesslist{flex:0 1 auto;text-align:left}.pr-list{list-style:none;margin:6px 0 14px;padding:0;text-align:left;overflow-y:auto;flex:0 1 auto}.prow{border:1px solid #22384a;border-radius:12px;padding:10px 12px;margin-bottom:8px;background:var(--panel-deep)}.prow.you{border-color:#2ec4b6}.prow.solved{background:#123626;border-color:#2f7a4e}.pr-head{display:flex;align-items:center;gap:8px}.pr-rank{font-weight:800;width:22px;color:var(--accent)}.pr-name{font-weight:700;flex:1 1 auto}.pr-wins{color:var(--accent);font-size:13px}.pr-status{color:var(--muted);font-size:13px}.pr-trail{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.pill{font-size:11px;padding:3px 7px;border-radius:999px;background:#17313f;border-left:5px solid var(--heat);color:var(--text)}.waiting-note{color:var(--muted);font-size:13px;min-height:1.2em;margin:2px 0;text-align:center}.lobby,.room-entry{max-width:460px;margin:0 auto;width:100%;padding:12px 0}.lobby-head,.re-head{text-align:center;margin-bottom:12px}.lobby-title,.re-title{margin:0;font-size:22px}.lobby-code{color:var(--accent);letter-spacing:.12em}.lobby-sub,.re-sub{color:var(--muted);font-size:14px;margin:4px 0 0}.lobby-invite{display:flex;gap:8px;margin:12px 0}.lobby-link,.re-input{flex:1 1 auto;min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid #33506380;background:var(--panel-deep);color:var(--text);font-size:15px}.lobby-btn{min-height:46px;padding:10px 16px;border-radius:10px;border:1px solid #2e4657;background:var(--panel);color:var(--text);font-weight:600;font-size:15px}.lobby-btn.primary{background:linear-gradient(180deg,#2ec4b6,#1c9c90);border:none;color:#04231f}.lobby-btn.ghost{background:transparent}.lobby-players{list-style:none;margin:12px 0;padding:0}.lobby-player{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #22384a;border-radius:10px;margin-bottom:6px}.lobby-player.is-self{border-color:#2ec4b6}.lobby-dot{width:10px;height:10px;border-radius:50%;background:#3a5568}.lobby-dot.ready{background:var(--solved)}.lobby-name{flex:1 1 auto}.lobby-badge{font-size:11px;font-weight:700;padding:2px 7px;border-radius:999px;background:#24384a;color:var(--muted)}.lobby-badge.ok{background:#1d4a30;color:var(--solved)}.lobby-actions{display:flex;flex-direction:column;gap:8px;margin-top:10px}.lobby-searching,.lobby-wait,.host-pick{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--muted);font-size:14px;padding:8px;text-align:center}.lobby-offer{flex-direction:column}.spinner{width:20px;height:20px;border-radius:50%;border:3px solid #2b465a;border-top-color:#2ec4b6;animation:spin .8s linear infinite;flex:0 0 auto}.spinner.sm{width:14px;height:14px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.lobby-modeslot{margin:8px 0}.lobby-flash{text-align:center;color:var(--accent);font-size:13px;min-height:1.2em;opacity:0;transition:opacity .2s}.lobby-flash.show{opacity:1}.re-vis,.vis{display:flex;gap:8px;margin:10px 0}.vis-chip{flex:1 1 0;padding:10px;border-radius:10px;border:1px solid #2e4657;background:var(--panel-deep);color:var(--text);display:flex;flex-direction:column;gap:2px}.vis-chip.on{border-color:#2ec4b6;background:#1d3d4a}.vis-name{font-weight:700}.vis-meta{font-size:12px;color:var(--muted)}.re-note{font-size:12px;color:var(--muted);text-align:center;margin:6px 0;line-height:1.4}.re-divider{text-align:center;color:var(--muted);font-size:12px;margin:12px 0;position:relative}.re-divider span{background:var(--sea-deep);padding:0 10px;position:relative;z-index:1}.re-divider:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#24384a}.re-join{display:flex;gap:8px}.re-error{color:var(--hot);font-size:13px;text-align:center;min-height:1.2em}.re-rooms{list-style:none;margin:0;padding:0}.re-room{width:100%;text-align:left;padding:12px;border-radius:10px;border:1px solid #22384a;background:var(--panel-deep);color:var(--text);margin-bottom:8px;display:grid;gap:2px}.re-empty{color:var(--muted);font-size:14px;text-align:center;line-height:1.5}.overlay{position:fixed;inset:0;z-index:100;background:#040c12b8;display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}.sheet{width:100%;max-width:460px;max-height:86vh;overflow-y:auto}.sheet-card{background:var(--panel);border:1px solid #2b4557;border-radius:18px;padding:20px}.sheet-card h2{margin:0 0 10px}.sheet-card p{color:var(--text);line-height:1.5;font-size:15px}.sheet-card .fine{color:var(--muted);font-size:13px}.sheet-card a{color:#7fe6db}.howto{padding-left:18px;line-height:1.6;font-size:15px}.howto b{color:var(--accent)}.key{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:middle}.sheet-close{margin-top:14px;width:100%}.countdown{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;font-size:72px;font-weight:800;color:var(--accent);pointer-events:none;text-shadow:0 4px 24px rgba(0,0,0,.6)}.countdown.pop{animation:pop .6s ease}@keyframes pop{0%{transform:scale(.6);opacity:0}30%{transform:scale(1.15);opacity:1}to{transform:scale(1);opacity:.9}}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--panel);border:1px solid #2e4657;color:var(--text);padding:10px 16px;border-radius:999px;font-size:14px;opacity:0;transition:all .2s ease;z-index:200}.toast.show{opacity:1;transform:translate(-50%)}.net-debug{font:11px/1.4 ui-monospace,monospace}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}@media(min-width:620px){.mapwrap{height:40vh;max-height:420px}}