:root{--bg: #f7f0e2;--fg: #26251f;--muted: #6b6355;--card: #fffbf3;--line: #e3d6bd;--accent: #173c2b;--accent-fg: #fff;--wine: #681c28;--wine-dark: #4f1520;--gold: #b18b40;--hair: color-mix(in srgb, var(--gold) 55%, transparent);--black: #1c1a18;--white: #fbfaf7;--serif: "Noto Serif CJK TC", "Noto Serif TC", "Source Han Serif TC", "Songti TC", "Noto Serif CJK SC", "Noto Serif SC", "Noto Serif CJK JP", "Noto Serif JP", "Noto Serif KR", Georgia, serif;color-scheme:light}html[lang=zh-CN]{--serif: "Noto Serif CJK SC", "Noto Serif SC", "Source Han Serif SC", "Songti SC", Georgia, serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;-webkit-tap-highlight-color:transparent}a{color:var(--accent)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.muted{color:var(--muted)}.site-top{background:#f8f1e5;border-bottom:2px solid #a98038}.top{display:flex;justify-content:space-between;align-items:center;gap:16px;max-width:960px;margin:0 auto;padding:7px 16px}.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:900;font-size:22px;letter-spacing:.06em;color:var(--accent);text-decoration:none;white-space:nowrap}.brand img{width:30px;height:30px;border-radius:5px}.top-nav{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:4px 16px;font-family:var(--serif)}.top-nav>a{color:var(--fg);text-decoration:none;font-weight:700;white-space:nowrap}.top-nav>a:hover{color:var(--wine)}.lang select{font:inherit;color:var(--fg);background:#f7f0e2;border:1px solid #c8ab77;border-radius:6px;padding:3px 10px}@media(max-width:700px){.top{flex-wrap:wrap;padding-bottom:0}.top-nav{flex:0 0 calc(100% + 32px);margin:6px -16px 0;padding:6px 12px;background:#263b2c;justify-content:center;gap:2px 14px;font-size:13px}.top-nav>a{color:#fff5e2}.top-nav>a:hover{color:#f8dfa3}.lang select{font-size:12px;padding:1px 6px}}.main{max-width:960px;margin:0 auto;padding:0 16px 32px}.btn{font:inherit;font-weight:600;padding:10px 18px;border-radius:6px;border:1px solid var(--line);background:var(--card);color:var(--fg);cursor:pointer;text-decoration:none;display:inline-block}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--wine);border-color:var(--wine);color:#fff;box-shadow:0 2px 0 var(--wine-dark)}.btn.primary:hover:not(:disabled){background:var(--wine-dark)}.btn.wide{width:100%;padding:14px;font-size:18px;margin-top:8px}.lobby{display:grid;grid-template-columns:3fr 2fr;gap:16px;align-items:start}.panel{background:var(--card);border:1px solid var(--hair);border-radius:6px;padding:20px}.panel h1{font-size:22px;margin:0 0 16px}.panel.center{text-align:center;max-width:480px;margin:32px auto}.field{border:0;padding:0;margin:0 0 16px}.field legend{font-size:14px;color:var(--muted);margin-bottom:6px;padding:0}.segmented{display:flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--bg);border-radius:12px}.segmented button{flex:1 1 0;min-width:max-content;font:inherit;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:var(--fg);cursor:pointer}.segmented button.on{background:var(--card);box-shadow:0 1px 3px #00000026;font-weight:700}.segmented button:disabled{opacity:.5;cursor:default}.link{font:inherit;color:var(--accent);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}.play{max-width:600px;margin:0 auto}.play-main{min-width:0}.play-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px;min-height:32px}.status{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;font:700 19px/1.4 var(--serif);color:var(--accent)}.status.done{color:var(--wine)}.status .reason{font-weight:600}.check-tag{font-size:13px;padding:1px 8px;border-radius:999px;background:#c2412b;color:#fff}.meta{color:var(--muted);font-size:14px}.dot{width:14px;height:14px;border-radius:50%;display:inline-block;border:1px solid #0004;flex:none}.dot.black{background:var(--black)}.dot.white{background:var(--white)}.player-bar{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 2px 6px 12px;border-left:3px solid transparent;transition:border-color .15s}.player-bar .player-name{font:700 17px/1.3 var(--serif);color:var(--accent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-bar.to-move{border-left-color:var(--wine)}.player-bar.to-move .player-name{color:var(--wine)}.captured{display:inline-flex;align-items:center;flex-wrap:wrap;margin-left:4px}.captured .cap{width:18px;height:18px;margin-right:-5px}.captured .lead{margin-left:10px;font-size:13px;color:var(--muted);font-weight:600}.board-wrap{--sq-light: #ecd5ad;--sq-dark: #a97b50;position:relative;border-radius:2px;overflow:hidden;margin:10px;box-shadow:0 0 0 10px #6b4226,0 0 0 11px #4a2c17,0 18px 34px -14px #32190599}.board-wrap.dim .board{filter:saturate(.35) brightness(.92)}.board{position:relative;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);aspect-ratio:1;width:100%;touch-action:none;user-select:none;-webkit-user-select:none}.sq{position:relative;display:block;padding:0;margin:0;border:0;border-radius:0;min-width:0;background:var(--sq-light);cursor:pointer;font:inherit}.board-wrap.locked .sq{cursor:default}.sq.dark{background:var(--sq-dark)}.sq.last{background-image:linear-gradient(#9bc70069,#9bc70069)}.sq.selected{background-image:linear-gradient(#14551e80,#14551e80)}.sq.check{background-image:radial-gradient(ellipse at center,red,#e70000 25%,#a9000000 89%,#9e000000)}.sq.target:after{content:"";position:absolute;inset:0;background:radial-gradient(rgba(20,85,30,.5) 19%,transparent 20%)}.sq.capture:after{content:"";position:absolute;inset:0;background:radial-gradient(transparent 0%,transparent 79%,rgba(20,85,0,.3) 80%)}.sq:focus-visible{outline:3px solid #3b82f6;outline-offset:-3px;z-index:1}.sq .piece{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 2px 1.5px rgba(30,15,5,.35))}.sq.lifted .piece{opacity:.3}.coord{position:absolute;font:700 clamp(9px,1.8vw,12px)/1 system-ui,sans-serif;pointer-events:none}.coord.rank{top:3px;left:3px}.coord.file{bottom:2px;right:4px}.sq.light .coord{color:var(--sq-dark)}.sq.dark .coord{color:var(--sq-light)}.drag-ghost{position:absolute;top:0;left:0;z-index:3;pointer-events:none}.drag-ghost .piece{width:100%;height:100%;transform:scale(1.12);filter:drop-shadow(0 6px 6px rgba(0,0,0,.35))}.promo-veil{position:absolute;inset:0;z-index:4;background:#fafafa8c}.promo{position:absolute;width:12.5%;display:flex;flex-direction:column;box-shadow:0 6px 18px #00000059}.promo.from-bottom{flex-direction:column-reverse}.promo button{aspect-ratio:1;padding:0;border:0;background:#fffdf8;border-radius:50%;cursor:pointer;transition:border-radius .12s,background .12s}.promo button:hover,.promo button:focus-visible{background:#e9a35b;border-radius:4px;outline:none}.promo .piece{width:100%;height:100%;display:block}.play-side{margin-top:18px}.side-inner{display:flex;flex-direction:column;height:420px;background:var(--card);border:1px solid var(--hair);border-radius:6px;overflow:hidden}.side-tabs{display:flex;border-bottom:1px solid var(--line)}.side-tabs button{flex:1;position:relative;font:inherit;font-weight:600;padding:10px;border:0;background:transparent;color:var(--muted);cursor:pointer}.side-tabs button[aria-selected=true]{color:var(--wine);box-shadow:inset 0 -2px 0 var(--wine)}.unread{position:absolute;top:9px;width:7px;height:7px;margin-left:4px;border-radius:50%;background:var(--accent)}.side-title{display:none;margin:0;padding:12px 14px 6px;font:700 16px/1.3 var(--serif);color:var(--accent);text-align:center;letter-spacing:.04em}.play-side.show-chat .moves,.play-side.show-moves .chat{display:none}.side-panel{display:flex;flex-direction:column;min-height:0;flex:1}.side-empty{color:var(--muted);font-size:14px;text-align:center;margin:18px 8px}.moves-scroll{flex:1;min-height:0;overflow-y:auto;padding:4px 10px}.moves-list{list-style:none;margin:0;padding:0;font:15px/1.2 system-ui,sans-serif}.moves-list li{display:grid;grid-template-columns:2.6em 1fr 1fr;align-items:center;padding:1px 0}.moves-no{color:var(--muted);text-align:right;padding-right:8px;font-variant-numeric:tabular-nums}.moves-cell{display:inline-flex;align-items:center;justify-self:start;padding:3px 6px;border:0;border-radius:6px;background:none;color:var(--fg);font:inherit;cursor:pointer}.moves-cell:hover{background:var(--bg)}.moves-cell.cur{background:color-mix(in srgb,var(--accent) 18%,transparent);font-weight:700}.moves-cell .fig{width:1.25em;height:1.25em;margin:-.15em 0}.moves-nav{display:flex;border-top:1px solid var(--line)}.moves-nav button{flex:1;padding:8px 0;border:0;background:none;color:var(--fg);font-size:15px;cursor:pointer}.moves-nav button:hover:not(:disabled){background:var(--bg)}.moves-nav button:disabled{opacity:.3;cursor:default}.chat-mute{font-size:17px;opacity:.7}.chat-mute:hover,.chat-mute.on{opacity:1}.muted-note{display:table;margin:4px auto 8px}.chat-scroll{flex:1;min-height:0;overflow-y:auto;padding:8px 12px}.chat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.chat-sys{align-self:center;font-size:12px;color:var(--muted);padding:2px 10px;border-radius:999px;background:var(--bg)}.chat-row{display:flex;flex-direction:column;max-width:85%}.chat-row.me{align-self:flex-end;align-items:flex-end}.chat-row.them{align-self:flex-start}.chat-who{margin:0 4px 2px;font-size:12px;color:var(--muted);display:flex;gap:6px}.chat-who b{font-weight:600}.chat-bub{margin:0;padding:7px 12px;border-radius:14px;font-size:15px;line-height:1.4;overflow-wrap:anywhere}.chat-row.them .chat-bub{background:var(--bg);border:1px solid var(--line);border-top-left-radius:4px}.chat-row.me .chat-bub{background:var(--accent);color:var(--accent-fg);border-top-right-radius:4px}.typing .chat-bub{display:inline-flex;gap:4px;padding:11px 14px}.typing .chat-bub span{width:6px;height:6px;border-radius:50%;background:var(--muted);opacity:.5}@media(prefers-reduced-motion:no-preference){.typing .chat-bub span{animation:blink 1s infinite ease-in-out}.typing .chat-bub span:nth-child(2){animation-delay:.15s}.typing .chat-bub span:nth-child(3){animation-delay:.3s}@keyframes blink{0%,60%,to{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-2px)}}}.chat-form{border-top:1px solid var(--line);padding:8px}.chat-err{margin:0 4px 6px;font-size:13px;color:var(--accent)}.chat-pad{display:flex;flex-wrap:wrap;gap:2px;margin-bottom:6px}.chat-pad button{font-size:20px;line-height:1;padding:5px;border:0;background:transparent;border-radius:8px;cursor:pointer}.chat-pad button:hover{background:var(--bg)}.chat-in{display:flex;gap:6px;align-items:center}.chat-in input{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:7px 12px}.chat-in input:focus{outline:2px solid color-mix(in srgb,var(--accent) 50%,transparent);outline-offset:0;border-color:var(--accent)}.chat-em{font-size:20px;line-height:1;padding:4px;border:0;background:transparent;cursor:pointer;border-radius:8px}.chat-send{font:inherit;font-weight:600;font-size:14px;padding:7px 14px;border:0;border-radius:999px;background:var(--accent);color:var(--accent-fg);cursor:pointer}.chat-send:disabled{opacity:.4;cursor:default}.notice{margin:10px 0 0;padding:8px 12px;border-radius:10px;background:var(--card);border:1px solid var(--line);color:var(--muted);font-size:14px}.notice.ask{color:var(--fg);border-color:var(--accent)}.actions{display:flex;gap:8px;justify-content:center;margin-top:14px;flex-wrap:wrap}.panel-lead{margin:-8px 0 16px;font-size:14px}.name-field{display:flex;flex-direction:column;gap:6px;text-align:left}.name-field span{font-size:14px;color:var(--muted)}.name-field input,.invite-link input{font:inherit;font-size:16px;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 12px;min-width:0}.name-field input:focus,.invite-link input:focus{outline:2px solid color-mix(in srgb,var(--accent) 50%,transparent);border-color:var(--accent)}.tc-desc{margin:-10px 0 4px;font-size:13px}.online-private{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line)}.searching{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-top:8px;border-radius:12px;background:var(--bg);font-weight:600}.searching span:nth-child(2){flex:1;font-variant-numeric:tabular-nums}.spinner{width:18px;height:18px;border-radius:50%;border:2.5px solid var(--line);border-top-color:var(--accent);flex:none}@media(prefers-reduced-motion:no-preference){.spinner{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}}.panel.center .name-field{margin:18px 0 8px}.invite-link{display:flex;gap:8px;margin:18px 0 8px}.invite-link input{flex:1;font-size:14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.waiting-dots{display:flex;justify-content:center;gap:6px;margin:18px 0 4px}.waiting-dots span{width:8px;height:8px;border-radius:50%;background:var(--accent);opacity:.3}@media(prefers-reduced-motion:no-preference){.waiting-dots span{animation:blink 1.2s infinite ease-in-out}.waiting-dots span:nth-child(2){animation-delay:.2s}.waiting-dots span:nth-child(3){animation-delay:.4s}}.presence{width:8px;height:8px;border-radius:50%;background:var(--muted);opacity:.5;flex:none}.presence.on{background:#3a9d5d;opacity:1}.tag{flex:none;font-size:11px;padding:1px 7px;border-radius:999px;background:var(--bg);border:1px solid var(--line);color:var(--muted)}.tag.off{color:#c2412b;border-color:color-mix(in srgb,#c2412b 40%,transparent)}.player-score{flex:none;font-variant-numeric:tabular-nums;font-size:14px;color:var(--muted)}.clock-box{margin-left:auto;display:inline-flex;align-items:center;gap:6px;flex:none}.clock{font:700 20px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;padding:6px 10px;min-width:4.6em;text-align:right;border-radius:8px;background:var(--card);border:1px solid var(--line);color:var(--muted)}.clock.running{color:var(--fg);border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.clock.low{color:#c2412b}.clock.low.running.mine{background:#c2412b;border-color:#c2412b;box-shadow:none;color:#fff}.first-move{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;padding:2px 8px;border-radius:999px;background:var(--bg);border:1px solid var(--accent);color:var(--accent)}.first-move.low{background:#c2412b;border-color:#c2412b;color:#fff}@media(min-width:900px){.play{max-width:1000px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.play-side{position:relative;margin-top:84px}.side-inner{position:absolute;inset:0 0 62px;height:auto}.side-tabs{display:none}.side-title{display:block}.play-side.show-chat .moves,.play-side.show-moves .chat{display:flex}.moves{flex:1 1 0}.chat{flex:1.25 1 0}.chat-title{border-top:1px solid var(--line)}}@media(max-width:720px){.lobby{grid-template-columns:1fr}}.preset{margin:0;font-size:14px;color:var(--muted);line-height:1.6}.preset code{color:var(--fg)}body:not(.playing){--mint: #efe5d0;--accent-shadow: #0f2a1d;background:var(--bg);color:var(--fg)}html[lang=zh-CN] body:not(.playing){--serif: "Noto Serif CJK SC", "Noto Serif SC", "Source Han Serif SC", "Songti SC", Georgia, serif}body:not(.playing) .top{max-width:1200px}body:not(.playing) .brand{font-family:var(--serif);color:var(--accent)}body:not(.playing) .top-nav>a:hover{color:var(--wine)}body:not(.playing) .main{max-width:1000px;padding-top:8px}body:not(.playing) .lobby{gap:20px}body:not(.playing) .panel{position:relative;background:var(--card);border:1px solid var(--hair);border-radius:6px;box-shadow:0 14px 34px -26px #3c230a80;padding:22px 22px 24px}body:not(.playing) .panel h1{font-family:var(--serif);color:var(--accent);font-size:26px;margin-bottom:18px}body:not(.playing) .panel.single{background:linear-gradient(180deg,var(--mint),var(--card) 55%)}body:not(.playing) .panel.online h1,body:not(.playing) .panel.online .panel-lead{padding-right:104px}body:not(.playing) .panel.online .panel-lead{min-height:44px}body:not(.playing) .panel .art{position:absolute;right:10px;bottom:10px;width:112px;height:112px;pointer-events:none}body:not(.playing) .panel.single .art,body:not(.playing) .panel.online .art{top:8px;bottom:auto;width:96px;height:96px}body:not(.playing) .field legend{font-weight:700;color:var(--fg)}body:not(.playing) .segmented{background:var(--mint);border-radius:999px;padding:4px}body:not(.playing) .segmented button{border-radius:999px;color:var(--fg)}body:not(.playing) .segmented button.on{background:var(--accent);color:#fff;box-shadow:0 2px 0 var(--accent-shadow)}body:not(.playing) .btn.primary{background:var(--wine);border-color:var(--wine);color:#fff;border-radius:8px;box-shadow:0 4px 0 var(--wine-dark);transition:transform .08s,box-shadow .08s}body:not(.playing) .btn.primary:hover:not(:disabled){filter:none;background:var(--wine-dark)}body:not(.playing) .btn.primary:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--wine-dark)}body:not(.playing) .preset{padding:10px 12px;border-radius:12px;background:var(--mint);color:var(--fg)}body:not(.playing) .preset code{font-weight:700}body:not(.playing) .link{color:var(--accent)}body:not(.playing) .name-field{margin-bottom:16px}body:not(.playing) .name-field span{font-weight:700;color:var(--fg)}body:not(.playing) .name-field input{background:var(--card);border-radius:8px}body:not(.playing) .searching{background:var(--mint)}body:not(.playing) .notice{background:var(--mint);border-color:var(--line);color:var(--fg)}body:not(.playing) .btn.wide:not(.primary){border:1.5px solid var(--accent);color:var(--accent);background:var(--card);border-radius:8px}@media(max-width:720px){body:not(.playing) .panel.single .art{display:none}body:not(.playing) .panel.online .art{width:72px;height:72px}body:not(.playing) .panel.online h1,body:not(.playing) .panel.online .panel-lead{padding-right:76px}}
