.board{touch-action:manipulation;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:relative}.board-svg{display:block;position:absolute;inset:0}.board-layer{pointer-events:none;position:absolute;inset:0}.river-text{font-family:var(--font-pixel);-webkit-font-smoothing:none;color:var(--board-line);opacity:.85;letter-spacing:.6em;pointer-events:none;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute}.coord{font-family:var(--font-pixel);-webkit-font-smoothing:none;color:var(--board-line);pointer-events:none;font-size:12px;line-height:1;position:absolute;transform:translate(-50%,-50%)}.piece{background:radial-gradient(circle at 50% 38%, #fbf1d6 0 40%, var(--piece-face) 70%);box-shadow:0 0 0 1px var(--piece-edge), 0 2px 0 1px var(--piece-shadow);font-family:var(--font-pixel);-webkit-font-smoothing:none;transition:transform var(--move-ms,.15s) var(--ease-out);will-change:transform;pointer-events:auto;cursor:pointer;border-radius:50%;place-items:center;line-height:1;display:grid;position:absolute;top:0;left:0}.piece:before{content:"";opacity:.75;border:1.5px solid;border-radius:50%;position:absolute;inset:2px}.piece.red{color:var(--red)}.piece.black{color:var(--ink)}.piece .glyph{display:block;position:relative}.piece:after{content:"";box-shadow:0 0 0 2px var(--gold), 0 0 0 4px #4a3a18;opacity:0;transition:opacity .11s ease-out, scale .14s var(--ease-out);pointer-events:none;border-radius:50%;position:absolute;inset:-2px;scale:1.18}.piece.selected:after{opacity:1;scale:1}.piece.selected{box-shadow:0 0 0 1px var(--piece-edge), 0 5px 0 1px var(--piece-shadow);z-index:3}.piece.ghost{z-index:1;pointer-events:none;animation:.3s ease-in forwards ghost-out}@keyframes ghost-out{0%{opacity:1;scale:1}45%{opacity:.9;scale:.92}to{opacity:0;scale:.6}}.piece.in-check{box-shadow:0 0 0 2px var(--action), 0 0 0 4px var(--piece-face), 0 0 0 6px var(--action), 0 2px 0 6px var(--piece-shadow);z-index:2}.piece.shake{animation:.22s steps(4,end) shake}@keyframes shake{25%{margin-left:-3px}50%{margin-left:3px}75%{margin-left:-2px}}.check-badge{animation:pop-in .18s var(--ease-out) both;width:max-content;font-family:var(--font-pixel);-webkit-font-smoothing:none;white-space:nowrap;background:var(--action);color:var(--action-text);pointer-events:none;margin-inline:auto;padding:3px 4px;font-size:12px;line-height:1;position:absolute;bottom:calc(100% + 6px);left:-40px;right:-40px}.check-badge.below{top:calc(100% + 8px);bottom:auto}.mk{pointer-events:none;position:absolute;top:0;left:0}@keyframes pop-in{0%{opacity:0;scale:.4}}@keyframes fade-in{0%{opacity:0}}.mk-target>*{animation:pop-in .12s var(--ease-out) both}.mk-from,.mk-hint{animation:.16s ease-out both fade-in}.mk-illegal>svg{animation:pop-in .12s var(--ease-out) both}.last-tick{animation:.14s ease-out both fade-in;animation-delay:var(--move-ms,.15s)}.mk-move{box-shadow:0 0 0 2px var(--board), 0 0 0 3px #2f5a3a;background:#2f5a3a}.mk-move.hidden-hint{box-shadow:none;background:0 0}.mk-from{border:2px dashed var(--gold-dark)}.mk-hint{border:2px dashed #2f5a3a;border-radius:50%}.mk-illegal{color:var(--action)}.mk-target{pointer-events:auto;cursor:pointer}@font-face{font-family:PixelZH;src:url(/fonts/fusion-pixel-12px-zh_hant.subset.woff2)format("woff2");font-display:swap}:root{--bg:#242924;--surface:#343b2e;--surface-2:#2c3227;--surface-3:#3e4636;--line:#4d5743;--text:#f1e8d2;--text-dim:#bdb6a0;--text-faint:#8f8a78;--board:#ebce94;--board-line:#6b5230;--board-frame:#b48d55;--board-frame-dark:#8a6a3c;--red:#a43a2c;--ink:#32372c;--action:#b14434;--action-dark:#86301f;--action-text:#fff4e4;--gold:#cfad67;--gold-dark:#9c7d3d;--piece-face:#f5e7c4;--piece-edge:#d4b77b;--piece-shadow:#6b4f28;--danger:#d0533f;--font-pixel:"PixelZH", "PingFang SC", "Microsoft YaHei", sans-serif;--font-ui:system-ui, -apple-system, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;--font-label:var(--font-pixel);--gutter:16px;--tap:44px;--nav-h:84px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);--ease-out:cubic-bezier(.22, .8, .3, 1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-ui-font=system]{--font-label:var(--font-ui)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}html{background:var(--bg)}body{background:var(--bg);color:var(--text);font-family:var(--font-ui);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;font-size:15px;line-height:1.5}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.pixel{font-family:var(--font-pixel);-webkit-font-smoothing:none;font-smooth:never;letter-spacing:0;line-height:1}.label{font-family:var(--font-label);-webkit-font-smoothing:none}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.px-corners{clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}.app{flex-direction:column;display:flex;position:fixed;inset:0}.page{min-height:0;padding:calc(var(--safe-top) + 12px) calc(var(--gutter) + var(--safe-right)) 24px calc(var(--gutter) + var(--safe-left));flex:1;overflow-y:auto}.page-inner{max-width:560px;margin:0 auto}.page-title{font-family:var(--font-pixel);-webkit-font-smoothing:none;margin:8px 0 16px;font-size:24px;font-weight:400;line-height:1}.bottom-nav{background:var(--surface-2);border-top:2px solid var(--line);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left);padding-right:var(--safe-right);flex:none;grid-template-columns:repeat(4,1fr);display:grid}.nav-item{min-height:var(--nav-h);color:var(--text-faint);cursor:pointer;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:8px 0 10px;display:flex}.nav-item .label{font-size:24px;line-height:1}:root[data-ui-font=system] .nav-item .label{font-size:16px;font-weight:600}.nav-item[aria-current=page]{color:var(--gold)}.nav-item[aria-current=page] .nav-icon{background:var(--surface-3)}.nav-icon{padding:4px 14px;display:flex}.btn{min-height:var(--tap);background:var(--surface-3);color:var(--text);cursor:pointer;font-family:var(--font-label);-webkit-font-smoothing:none;clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px));border:0;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:12px;line-height:1;display:inline-flex;box-shadow:inset 0 -3px #00000047,inset 0 2px #ffffff0f}:root[data-ui-font=system] .btn{font-size:15px}.btn{transition:transform 70ms ease-out,background-color .12s ease-out}.btn:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 3px #00000047}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--action);color:var(--action-text)}.btn-gold{background:var(--gold);color:#2a2418}.btn-ghost{box-shadow:inset 0 0 0 2px var(--line);background:0 0}.btn-block{width:100%;display:flex}.btn-lg{min-height:60px;font-size:24px}:root[data-ui-font=system] .btn-lg{font-size:20px;font-weight:600}.link-btn{min-height:var(--tap);color:var(--gold);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:10px 4px;font-size:14px;text-decoration:underline}.tag{font-family:var(--font-pixel);-webkit-font-smoothing:none;background:var(--surface-3);color:var(--text-dim);padding:3px 5px;font-size:12px;line-height:1;display:inline-block}.tag-proto{color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold-dark);background:0 0}.card{background:var(--surface);box-shadow:inset 0 0 0 2px var(--line);padding:14px}.stack{flex-direction:column;gap:12px;display:flex}.row{align-items:center;gap:10px;display:flex}.muted{color:var(--text-dim);font-size:13px}.faint{color:var(--text-faint);font-size:12px}.page-inner.lobby{flex-direction:column;min-height:100%;display:flex}.lobby-center{flex-direction:column;flex:1;justify-content:center;padding-block:12px 20px;display:flex}.lobby-head{justify-content:space-between;align-items:flex-start;gap:12px;margin:8px 0 22px;display:flex}.logo-title{font-family:var(--font-pixel);-webkit-font-smoothing:none;color:var(--text);text-shadow:0 3px #161a16;margin:0;font-size:36px;font-weight:400;line-height:1}.logo-sub{font-family:var(--font-pixel);-webkit-font-smoothing:none;color:var(--gold);letter-spacing:2px;margin-top:10px;font-size:12px;line-height:1}.net-chip{color:var(--text-dim);background:var(--surface-2);white-space:nowrap;align-items:center;gap:6px;padding:6px 8px;font-size:12px;display:inline-flex}.net-dot{background:var(--gold);width:6px;height:6px}.net-dot.off{box-shadow:inset 0 0 0 1px var(--text-dim);background:0 0}.hero-pieces{justify-content:center;gap:18px;margin:4px 0 22px;display:flex}.continue-card{background:var(--surface);box-shadow:inset 0 0 0 2px var(--gold-dark);align-items:center;gap:12px;margin-bottom:14px;padding:12px;display:flex}.continue-card .grow{flex:1;min-width:0}.lobby-actions{flex-direction:column;gap:10px;display:flex}.last-setup{color:var(--text-dim);justify-content:center;align-items:center;gap:4px;margin-top:-4px;font-size:13px;display:flex}.lobby-foot{text-align:center;margin-top:0}.field-label{font-family:var(--font-label);-webkit-font-smoothing:none;color:var(--text-dim);margin:0 0 8px;font-size:12px;line-height:1}.segmented{grid-auto-columns:1fr;grid-auto-flow:column;gap:6px;display:grid}.seg-btn{min-height:var(--tap);background:var(--surface-2);color:var(--text-dim);cursor:pointer;box-shadow:inset 0 0 0 2px var(--line);border:0;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px 4px;display:flex}.seg-btn .label{font-size:12px;line-height:1}:root[data-ui-font=system] .seg-btn .label{font-size:15px}.seg-btn small{color:var(--text-faint);font-size:11px;line-height:1.2}.seg-btn[aria-checked=true]{background:var(--surface-3);color:var(--text);box-shadow:inset 0 0 0 2px var(--gold)}.seg-btn[aria-checked=true] .label:before{content:"▶";vertical-align:2px;color:var(--gold);margin-right:4px;font-size:8px}.scrim{z-index:40;background:#0a0c0a99;justify-content:center;align-items:flex-end;animation:.14s ease-out both fade-in-scrim;display:flex;position:fixed;inset:0}.sheet{animation:sheet-up .2s var(--ease-out) both;background:var(--surface);width:100%;max-width:520px;max-height:calc(100dvh - 40px);box-shadow:inset 0 2px 0 var(--gold-dark);padding:18px calc(var(--gutter) + var(--safe-right)) calc(18px + var(--safe-bottom)) calc(var(--gutter) + var(--safe-left));overflow-y:auto}@keyframes fade-in-scrim{0%{opacity:0}}@keyframes sheet-up{0%{opacity:0;translate:0 24px}}@media (width>=600px){.scrim{align-items:center}.sheet{box-shadow:inset 0 0 0 2px var(--gold-dark)}}.sheet-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.sheet-title{font-family:var(--font-pixel);-webkit-font-smoothing:none;margin:0;font-size:24px;font-weight:400;line-height:1}.icon-btn{min-width:var(--tap);min-height:var(--tap);color:var(--text-dim);cursor:pointer;font-family:var(--font-pixel);-webkit-font-smoothing:none;background:0 0;border:0;justify-content:center;align-items:center;font-size:12px;display:inline-flex}.menu-list{flex-direction:column;gap:6px;display:flex}.menu-item{background:var(--surface-2);cursor:pointer;text-align:left;border:0;justify-content:space-between;align-items:center;min-height:48px;padding:0 14px;font-size:15px;display:flex}.menu-item.danger{color:#f0a090}.menu-item small{color:var(--text-faint);font-size:12px}.menu-item[aria-pressed=true]{box-shadow:inset 3px 0 0 var(--gold)}.toast-layer{left:0;right:0;top:calc(var(--safe-top) + 64px);z-index:60;pointer-events:none;padding:0 var(--gutter);justify-content:center;display:flex;position:fixed}.toast{max-width:420px;color:var(--text);box-shadow:inset 0 0 0 2px var(--gold-dark);animation:toast-in .14s var(--ease-out), toast-out .16s ease-in 2.22s forwards;background:#171a17;padding:10px 14px;font-size:14px}@keyframes toast-in{0%{opacity:0;translate:0 -8px}}@keyframes toast-out{to{opacity:0;translate:0 -6px}}.banner{background:var(--surface);box-shadow:inset 0 0 0 2px var(--gold-dark);flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;font-size:13px;display:flex}.banner.warn{box-shadow:inset 0 0 0 2px var(--danger)}.update-bar{padding:calc(var(--safe-top) + 8px) calc(var(--gutter) + var(--safe-right)) 0 calc(var(--gutter) + var(--safe-left));flex:none}.update-bar+.page{padding-top:8px}.banner .grow{flex:180px}.banner .btn{min-height:36px;padding:0 10px}.game{min-height:0;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);flex:1;grid-template:"top""banner""board"minmax(0,1fr)"status""actions"/minmax(0,1fr);display:grid}.game-top{grid-area:top;align-items:center;gap:4px;min-height:48px;padding:4px 8px 0;display:flex}.game-top .title{text-align:center;min-width:0;color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:13px;overflow:hidden}.back-btn{min-height:var(--tap);color:var(--text);cursor:pointer;font-family:var(--font-label);-webkit-font-smoothing:none;background:0 0;border:0;align-items:center;gap:6px;padding:0 8px;font-size:12px;display:inline-flex}.game-banner{padding:0 var(--gutter) 6px;grid-area:banner}.player-row{align-items:center;gap:10px;height:52px;padding:4px 8px;display:flex}.player-row.to-move .avatar{box-shadow:inset 0 0 0 2px var(--gold), 0 0 0 2px var(--bg), 0 0 0 4px var(--gold-dark)}.avatar{background:var(--surface-3);width:36px;height:36px;font-family:var(--font-pixel);-webkit-font-smoothing:none;flex:none;place-items:center;font-size:24px;line-height:1;transition:box-shadow .16s ease-out;display:grid}.avatar.red{color:#f0b4a6;background:#5a2f27}.avatar.black{color:var(--text);background:#1c201b}.player-meta{flex:1;min-width:0}.player-name{align-items:center;gap:6px;font-size:14px;line-height:1.2;display:flex}.side-tag{font-family:var(--font-pixel);-webkit-font-smoothing:none;padding:2px 4px;font-size:12px;line-height:1}.side-tag.red{background:var(--red);color:var(--action-text)}.side-tag.black{color:var(--text);box-shadow:inset 0 0 0 1px var(--line);background:#151815}.captured{flex-wrap:wrap;gap:2px;min-height:18px;margin-top:4px;display:flex}.mini-piece{background:var(--piece-face);width:18px;height:18px;font-family:var(--font-pixel);-webkit-font-smoothing:none;box-shadow:inset 0 0 0 1px var(--piece-edge);border-radius:50%;place-items:center;font-size:12px;line-height:1;display:grid}.mini-piece.red{color:var(--red)}.mini-piece.black{color:var(--ink)}.thinking{color:var(--gold);white-space:nowrap;align-items:center;gap:6px;font-size:12px;display:inline-flex}.thinking-dots{gap:3px;display:inline-flex}.thinking-dots i{background:var(--gold);width:4px;height:4px;animation:.9s step-end infinite blink}.thinking-dots i:nth-child(2){animation-delay:.3s}.thinking-dots i:nth-child(3){animation-delay:.6s}@keyframes blink{50%{opacity:.2}}.board-area{--rows-h:104px;grid-area:board;justify-content:center;align-items:center;min-height:0;padding:0 4px;display:flex;container-type:size}.board-stack{width:min(100cqw, calc((100cqh - var(--rows-h)) * .9), 720px)}.board-fit{aspect-ratio:9/10;width:100%}.status-line{min-height:30px;padding:0 var(--gutter);text-align:center;grid-area:status;justify-content:center;align-items:center;gap:8px;font-size:14px;display:flex}.status-line .label{font-size:12px;line-height:1}.status-line.alert{color:#ffb3a4}.status-line.alert .label{background:var(--action);color:var(--action-text);padding:3px 5px}.actions{padding:6px var(--gutter) 10px;grid-area:actions;grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.move-panel{display:none}@media (height<=640px){.board-area{--rows-h:80px}.player-row{height:40px}.avatar{width:28px;height:28px;font-size:12px}.captured{display:none}.game-top{min-height:40px}}@media (aspect-ratio>=5/4) and (width>=560px){.game{grid-template:"top top""board banner""board moves"minmax(0,1fr)"board status""board actions"/minmax(0,1fr) minmax(260px,340px);column-gap:8px}.board-area{padding:8px}.move-panel{min-height:0;margin:4px var(--gutter);background:var(--surface-2);box-shadow:inset 0 0 0 2px var(--line);grid-area:moves;display:block;overflow-y:auto}.game-banner{padding-top:6px}}.move-list{grid-template-columns:2.4em 1fr 1fr;row-gap:2px;margin:0;padding:6px;font-size:14px;list-style:none;display:grid}.move-list li{display:contents}.move-no{color:var(--text-faint);text-align:right;padding:6px 6px 6px 0;font-size:12px}.move-cell{text-align:left;cursor:pointer;background:0 0;border:0;min-height:32px;padding:4px 6px;font-size:14px}.move-cell.current{background:var(--surface-3);box-shadow:inset 2px 0 0 var(--gold)}.move-cell:disabled{cursor:default}.empty-note{text-align:center;color:var(--text-faint);padding:16px;font-size:13px}.over-card{text-align:center}.over-title{font-family:var(--font-pixel);-webkit-font-smoothing:none;margin:6px 0 12px;font-size:36px;font-weight:400;line-height:1}.over-reason{font-family:var(--font-pixel);-webkit-font-smoothing:none;background:var(--surface-3);color:var(--gold);margin-bottom:14px;padding:4px 6px;font-size:12px;line-height:1;display:inline-block}.record-item{background:var(--surface);width:100%;box-shadow:inset 0 0 0 2px var(--line);cursor:pointer;text-align:left;border:0;align-items:center;gap:12px;padding:12px;display:flex}.record-item .grow{flex:1;min-width:0}.result-badge{width:44px;height:44px;font-family:var(--font-pixel);-webkit-font-smoothing:none;background:var(--surface-3);flex:none;place-items:center;font-size:24px;line-height:1;display:grid}.result-badge.red{background:var(--red);color:var(--action-text)}.result-badge.black{box-shadow:inset 0 0 0 2px var(--line);background:#151815}.replay{gap:12px;display:grid}.replay-board{width:min(100%,520px);margin:0 auto}.replay-controls{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.replay-slider{width:100%;accent-color:var(--gold);min-height:32px}@media (width>=900px){.replay{grid-template-columns:minmax(0,1fr) 320px;align-items:start}.page-inner.wide{max-width:960px}}.settings-group{margin-bottom:20px}.settings-group h2{font-family:var(--font-label);-webkit-font-smoothing:none;color:var(--gold);margin:0 0 8px;font-size:12px;font-weight:400;line-height:1}.setting-row{background:var(--surface);align-items:center;gap:12px;min-height:56px;margin-bottom:2px;padding:8px 12px;display:flex}.setting-row .grow{flex:1;min-width:0}.setting-row .desc{color:var(--text-faint);font-size:12px;line-height:1.35;display:block}.switch{background:var(--surface-2);width:48px;height:28px;box-shadow:inset 0 0 0 2px var(--line);cursor:pointer;border:0;flex:none;padding:0;position:relative}.switch:after{content:"";background:var(--text-faint);width:16px;height:16px;transition:transform .1s;position:absolute;top:6px;left:6px}.switch[aria-checked=true]{box-shadow:inset 0 0 0 2px var(--gold);background:#5a4a26}.switch[aria-checked=true]:after{background:var(--gold);transform:translate(20px)}.switch:disabled{opacity:.4;cursor:not-allowed}.data-note{color:var(--text-dim);background:var(--surface-2);padding:10px 12px;font-size:13px}.data-note p{margin:0 0 6px}.data-note p:last-child{margin:0}:root[data-reduce-motion=true] *,:root[data-reduce-motion=true] :before,:root[data-reduce-motion=true] :after{transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;animation-delay:0s!important}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;animation-delay:0s!important}}