: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{--ground: #0a1520;--panel: #14263a;--panel-hi: #1d3550;--gutter: #0e1e2e;--edge: #2a4664;--stone: #e3d9c6;--coffer: #f2dfa8;--stone-last: #efe7d8;--p1: #c4551a;--p2: #16255e;--mark: #14202e;--alarm: #b3261e;--gold: #f0b93c;--ring: #ffd98a;--ink: #101a26;--text: #f4f7fb;--muted: #a9bdd4;--toll-ink: #dce6f2;--toll-origin: #8fa6c0;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--gap: 5px;--pad: 6px;--n: 5;--shake: 3px;--tcell-mine: 13px;--tcell-rival: 9px;--tcell-float: 11px}[hidden]{display:none!important}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--ground);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}#app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.main-content{flex:1 0 auto;display:flex;flex-direction:column}.site-footer{flex-shrink:0;padding:14px 16px calc(14px + env(safe-area-inset-bottom));text-align:center;color:var(--muted);font-size:13px}.site-footer a{color:var(--muted)}body.playing .site-footer{display:none!important}a{color:var(--gold)}.screen{width:100%;max-width:560px;margin:0 auto;padding:12px 8px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px;flex:1 0 auto}.btn,.lobby-btn,.re-go,.re-create{min-height:48px;padding:12px 18px;border-radius:14px;border:1px solid var(--edge);background:var(--panel);color:var(--text);font:600 16px/1.2 var(--font);cursor:pointer;transition:transform .12s ease,background .12s ease}.btn:active,.lobby-btn:active{transform:translateY(1px)}.btn.primary,.lobby-btn.primary,.re-create{background:var(--gold);border-color:var(--gold);color:#201704}.btn.ghost,.lobby-btn.ghost{background:transparent}.btn:disabled{opacity:.55;cursor:default}.linkbtn{background:none;border:0;color:var(--muted);font:600 15px/1 var(--font);padding:12px 10px;min-height:44px;cursor:pointer;text-decoration:underline}.iconbtn{min-width:44px;min-height:44px;border-radius:12px;border:1px solid var(--edge);background:var(--panel);color:var(--text);font-size:15px;cursor:pointer}:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 5px var(--gold)}.menu{justify-content:center;text-align:center;gap:18px;padding:16px 12px calc(16px + env(safe-area-inset-bottom))}.brand h1{margin:8px 0 4px;font-size:42px;letter-spacing:.02em}.tagline{margin:0;color:var(--muted);font-size:15px}.logo{display:flex;align-items:center;justify-content:center;height:60px}.logo svg{width:108px;height:60px}.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.chip{min-height:44px;padding:10px 16px;border-radius:999px;border:1px solid var(--edge);background:var(--panel);color:var(--text);font:600 15px/1 var(--font);cursor:pointer}.chip.on{background:var(--panel-hi);border-color:var(--gold);color:var(--gold)}.mode-blurb{margin:10px 4px 0;color:var(--muted);font-size:14px;min-height:34px}.mode-best{margin:4px 0 0;color:var(--muted);font-size:13px}.menu-actions{display:flex;flex-direction:column;gap:10px}.menu-links{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}.field-label{color:var(--muted);font-size:13px;margin:0}.game{gap:6px;max-width:100%}.hud{display:flex;align-items:center;gap:8px;min-height:44px;width:100%;max-width:560px;margin:0 auto}.hud-turn{flex:1;display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;min-width:0}.hud-turn .rtok{flex:none}.hud-mode{color:var(--muted);font-size:13px;font-weight:600}.clockbar{height:4px;width:min(100%,560px);margin:0 auto;background:var(--panel);border-radius:999px;overflow:hidden;flex:none}.clockbar i{display:block;height:100%;background:var(--gold);transition:width .3s linear}.clockbar.low i{background:var(--alarm)}.board-host{position:relative;align-self:center;width:var(--board);height:var(--board);aspect-ratio:1;flex:none}.board-host{--board: min( calc(100vw - 16px) , calc(100vh - 372px) , 460px);--board: min( calc(100vw - 16px) , calc(100dvh - 372px) , 460px)}.board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--n),1fr);grid-auto-rows:1fr;gap:var(--gap);padding:var(--pad);background:var(--gutter);border-radius:16px;touch-action:none;user-select:none;-webkit-tap-highlight-color:transparent}.fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}.cell{position:relative;min-width:0;min-height:0;padding:0;border:0;border-radius:12%;background:var(--stone);cursor:pointer;touch-action:none;transition:transform .14s ease,filter .14s ease;box-shadow:0 2px 4px #04081080}.cell.coffer{background:var(--coffer)}.cell.coffer:before{content:"";position:absolute;inset:14%;border:2px dashed rgba(20,32,46,.5);border-radius:50%}.cell.last-from,.cell.last-to{background:var(--stone-last)}.cell.last-from{outline:2px dashed rgba(20,32,46,.75);outline-offset:-4px}.cell.last-to{outline:2px solid rgba(20,32,46,.85);outline-offset:-4px}.cell .mark{position:absolute;inset:30%;border-radius:50%;border:3px solid var(--mark);display:none;z-index:2;pointer-events:none}.cell.t-move .mark{display:block}.cell.t-take .mark{display:block;inset:8%;border-color:var(--alarm);border-width:4px}.cell.t-take .mark:after,.cell.t-take .mark:before{content:"";position:absolute;left:12%;right:12%;top:46%;height:4px;background:var(--alarm)}.cell.t-take .mark:after{transform:rotate(45deg)}.cell.t-take .mark:before{transform:rotate(-45deg)}.cell.t-move,.cell.t-take{transform:translateY(-2px)}.cell.nope{animation:nope .12s linear 2}@keyframes nope{0%,to{transform:translate(0)}50%{transform:translate(4px)}}.tok{position:absolute;left:15%;top:15%;width:70%;height:70%;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 3px 3px rgba(4,8,16,.55));z-index:2;pointer-events:none}.tok.p1{background:var(--p1);border-radius:50%}.tok.p2{background:var(--p2);clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.tok .ring{position:absolute;inset:22%;border-radius:50%;border:3px solid var(--ring);display:none}.tok.beacon .ring{display:block}.tok.p2.beacon .ring{inset:30%}.cell.picked .tok{transform:scale(1.08);filter:drop-shadow(0 0 0 3px var(--mark)) drop-shadow(0 3px 3px rgba(4,8,16,.55))}.cell.picked{outline:3px solid var(--mark);outline-offset:-3px}.cell.movable:after{content:"";position:absolute;left:6%;top:6%;width:12%;height:12%;border-radius:50%;background:var(--mark);opacity:.55}.tok.hop{animation:hop .24s cubic-bezier(.34,1.2,.5,1)}@keyframes hop{0%{transform:translate(calc(var(--gx, 0) * (100% + var(--gap) / .7)),calc(var(--gy, 0) * (100% + var(--gap) / .7)))}to{transform:translate(0)}}.board.shaking{animation:shake .3s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(var(--shake))}75%{transform:translate(calc(-1 * var(--shake)))}}.board.flash{outline:4px solid var(--gold)}.hand{display:flex;gap:8px;justify-content:center;align-items:flex-start;flex:none;width:100%}.hand.rival{opacity:.92}.toll{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 7px;border-radius:12px;border:1px solid var(--edge);background:var(--panel);color:var(--text);cursor:default;flex:none;transition:transform .12s ease,border-color .12s ease,background .12s ease}.hand.mine .toll{cursor:pointer;min-height:44px}.hand.mine .toll.on{background:var(--panel-hi);border-color:var(--gold);transform:translateY(-2px)}.hand.mine .toll:disabled{opacity:.45;cursor:default}.toll .tname{font:700 11px/1 var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}.hand.mine .toll.on .tname{color:var(--gold)}.tgrid{display:grid;grid-template-columns:repeat(5,var(--wc));grid-auto-rows:var(--wc);gap:1px;--wc: var(--tcell-mine)}.tgrid i{display:block;border-radius:2px;background:#8fa6c038}.tgrid i.o{background:var(--toll-origin);border-radius:50%}.tgrid i.x{background:var(--toll-ink)}.hand.rival .tgrid{--wc: var(--tcell-rival)}.toll.float{border-style:dashed;border-color:var(--gold)}.toll.float .tgrid{--wc: var(--tcell-float)}.toll.float .tname{color:var(--gold)}.opening .hand{flex-wrap:wrap;gap:10px;margin:12px 0}.opening .toll{cursor:pointer;min-height:44px}.toll.pair-a{border-color:var(--p1);border-width:2px}.toll.pair-b{border-color:var(--gold);border-width:2px}.pairbtn{display:flex;gap:8px;padding:10px;border-radius:16px;border:2px solid var(--edge);background:var(--panel);cursor:pointer;min-height:44px}.pairbtn:not(:disabled):hover,.pairbtn:not(:disabled):focus-visible{border-color:var(--gold)}.pairbtn:disabled{opacity:.6}.hand .sep{align-self:center;color:var(--muted);font-size:11px;writing-mode:vertical-rl;letter-spacing:.08em}.prompt{text-align:center;color:var(--muted);font-size:14px;margin:0;min-height:20px;flex:none}.turn-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;flex:none}.pick-ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:#060c16db;border-radius:16px;z-index:7;padding:10px}.pick-ov .toll{cursor:pointer;min-height:44px}.countdown{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:800 20vmin/1 var(--font);color:var(--gold);text-shadow:0 6px 24px rgba(0,0,0,.6);pointer-events:none;z-index:5}.countdown.pop{animation:pop .5s ease}@keyframes pop{0%{transform:scale(.6);opacity:0}40%{transform:scale(1.08);opacity:1}to{transform:scale(1);opacity:.9}}.pause-ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#040810db;border-radius:16px;z-index:6}.pause-card{display:flex;flex-direction:column;gap:10px;padding:18px;text-align:center}.overlay{position:fixed;inset:0;background:#03060cbd;display:flex;align-items:flex-end;justify-content:center;z-index:50}.sheet{position:relative;width:100%;max-width:560px;max-height:86vh;overflow-y:auto;background:var(--panel);border:1px solid var(--edge);border-radius:20px 20px 0 0;padding:20px 18px calc(24px + env(safe-area-inset-bottom))}.sheet h2{margin:0 0 12px;padding-right:44px}.sheet h3{margin:18px 0 8px;font-size:16px}.sheet-close.x{position:absolute;right:12px;top:12px;min-width:44px;min-height:44px;border-radius:12px;border:1px solid var(--edge);background:var(--panel-hi);color:var(--text);font-size:16px;cursor:pointer}.help-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:10px;line-height:1.5}.help-list.small{font-size:14px;gap:8px}.help-note{color:var(--muted);font-size:14px}.about-attrib{color:var(--muted);font-size:13px}.help-figure{display:flex;gap:12px;align-items:center;justify-content:center;padding:10px 0}.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:var(--panel);border:1px solid var(--edge);color:var(--text);padding:10px 18px;border-radius:999px;font-weight:600;opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:60}.toast.show{opacity:1;transform:translate(-50%)}.results-head{text-align:center}.results-head h2{margin:0 0 6px;font-size:26px}.results-sub{margin:0;color:var(--muted)}.results-tally{margin:8px 0 0;color:var(--muted);font-size:13px}.finalboard{width:100%;max-width:320px;margin:0 auto;display:block;height:auto}.rrows{display:flex;flex-direction:column;gap:10px}.rrow{background:var(--panel);border:1px solid var(--edge);border-radius:16px;padding:12px 14px}.rrow.won{border-color:var(--gold)}.rname{display:flex;align-items:center;gap:8px;font-weight:700}.rtok{width:16px;height:16px;flex:none}.rtok.p1{background:var(--p1);border-radius:50%}.rtok.p2{background:var(--p2);clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.rverdict{color:var(--muted);font-size:13px;margin:2px 0 8px}.rrow.won .rverdict{color:var(--gold);font-weight:700}.rstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px;margin:0}.rstats div{background:var(--panel-hi);border-radius:10px;padding:8px;text-align:center}.rstats dt{color:var(--muted);font-size:11px}.rstats dd{margin:2px 0 0;font-weight:700;font-size:17px}.verdict{min-height:24px;text-align:center}.verdict-line,.verdict-progress{color:var(--muted);font-size:14px;margin:0}.waiting-note{color:var(--muted);font-size:13px;text-align:center;margin:0}.fault-note{color:var(--alarm);text-align:center;font-weight:600}.lobby-searching{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted);padding:40px 0;font-weight:600}.spinner{width:20px;height:20px;border:3px solid var(--edge);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite;flex:none}.spinner.sm{width:14px;height:14px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.room-entry,.lobby{display:flex;flex-direction:column;gap:12px}.re-field,.lobby-link,.re-input{width:100%;min-width:0;padding:13px 14px;border-radius:12px;border:1px solid var(--edge);background:var(--gutter);color:var(--text);font:600 16px/1 var(--font)}.re-row,.re-join,.lobby-invite,.lobby-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.lobby-invite>*{min-width:0}.re-title,.lobby h2,.lobby h3,.lobby-title{text-align:center}.re-sub,.lobby-sub,.re-note,.lobby-wait{color:var(--muted);text-align:center;font-size:14px}.lobby-code{text-align:center;font:800 30px/1 var(--font);letter-spacing:.16em;color:var(--gold)}.lobby-players,.lobby-roster{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.lobby-players li{background:var(--panel);border:1px solid var(--edge);border-radius:12px;padding:10px 12px;display:flex;gap:8px;align-items:center}.lobby-badge{font-size:12px;color:var(--muted)}.lobby-badge.ok{color:var(--gold)}.lobby-qr{display:flex;justify-content:center;padding:8px 0}.lobby-qr svg{width:190px;height:190px;max-width:70%}.lobby-modes{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.mode-btn{min-height:44px}.host-pick{text-align:center;color:var(--muted)}.host-pick strong{color:var(--gold)}.lobby-flash{text-align:center;color:var(--gold);font-weight:700}.side{display:none}@media(max-width:359px){:root{--gap: 4px;--pad: 4px}}@media(max-height:719px)and (orientation:portrait){:root{--tcell-mine: 10px;--tcell-rival: 7px;--tcell-float: 9px}.board-host{--board: min( calc(100vw - 16px) , calc(100vh - 300px) , 460px);--board: min( calc(100vw - 16px) , calc(100dvh - 300px) , 460px)}.toll .tname{font-size:10px}}@media(min-width:720px)and (max-width:999px)and (min-height:560px){.screen{max-width:680px}:root{--tcell-mine: 15px;--tcell-rival: 11px;--tcell-float: 13px}.board-host{--board: min( calc(100vw - 48px) , calc(100vh - 372px) , 480px);--board: min( calc(100vw - 48px) , calc(100dvh - 372px) , 480px)}}@media(min-width:1000px){:root{--tcell-mine: 16px;--tcell-rival: 12px;--tcell-float: 14px}.screen{max-width:1180px}.screen.game{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:10px 24px;align-items:start;padding:24px}.game .hud,.game .clockbar,.game .board-host,.game .hand,.game .prompt,.game .turn-actions{grid-column:1}.game .side{display:block;grid-column:2;grid-row:1 / span 8;background:var(--panel);border:1px solid var(--edge);border-radius:16px;padding:14px;align-self:stretch}.side h3{margin:0 0 10px;font-size:15px}.movelist{list-style:none;margin:0;padding:0;max-height:46vh;overflow-y:auto;font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:4px}.movelist li{padding:4px 6px;border-radius:8px;background:var(--gutter)}.board-host{--board: min( calc(100vw - 362px) , 440px, calc(100vh - 430px) );--board: min( calc(100vw - 362px) , 440px, calc(100dvh - 430px) );justify-self:center}.menu{max-width:620px}.results-screen{max-width:900px}}@media(orientation:landscape)and (max-height:559px){:root{--tcell-mine: 10px;--tcell-rival: 8px;--tcell-float: 9px}.screen.game{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;align-content:center;gap:4px 12px;padding:6px 10px;max-width:100%}.game .board-host{grid-column:1;grid-row:1 / span 7;--board: min( calc(100vh - 20px) , calc(100vw - 250px) , 460px);--board: min( calc(100dvh - 20px) , calc(100vw - 250px) , 460px)}.game .hud,.game .clockbar,.game .hand,.game .prompt,.game .turn-actions{grid-column:2;margin:0}.game .turn-actions,.game .hand{justify-content:flex-start}.hud{min-height:34px}.side{display:none}.prompt{font-size:12px;min-height:16px}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:1ms}.countdown.pop,.tok.hop,.board.shaking,.cell.nope{animation:none}.btn,.cell,.clockbar i,.toll{transition:none}}