:root{color:#211d15;font-synthesis:none;--paper:#f7f1e3;--paper-deep:#efe6d0;--card:#fffcf4;--ink:#211d15;--ink-soft:#5c5546;--verm:#e8481c;--mustard:#e9a820;--moss:#2f7e5e;--display:"Fraunces", "Songti SC", "STSong", serif;--shadow:3px 3px 0 var(--ink);background:#f7f1e3;font-family:Karla,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;margin:0}body:has(dialog[open]){overflow:hidden}::selection{background:var(--verm);color:var(--card)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.site-header{border-bottom:2px solid var(--ink);background:var(--paper)}.header-inner{align-items:center;gap:24px;max-width:1184px;margin:auto;padding:12px 24px;display:flex}.brand{font:700 22px var(--display);align-items:center;gap:10px;display:flex}.brand-mark{background:var(--verm);width:34px;height:34px;color:var(--card);border:2px solid var(--ink);box-shadow:var(--shadow);border-radius:10px;place-items:center;font-size:19px;font-weight:900;display:grid}.brand-word>span{color:var(--verm)}h1{font:900 20px var(--display);border-left:2px solid var(--ink);margin:0;padding-left:24px}.header-actions{gap:10px;margin-left:auto;display:flex}.button{border:2px solid var(--ink);background:var(--card);box-shadow:var(--shadow);border-radius:9px;padding:10px 16px;font-size:13px;font-weight:700;line-height:1.3;transition:transform .12s,box-shadow .12s,background .12s}.button:hover:not(:disabled){background:var(--paper-deep)}.button:active:not(:disabled){box-shadow:none;transform:translate(3px,3px)}.button.primary,.settings-button{background:var(--mustard)}.button.primary:hover:not(:disabled),.settings-button:hover{background:#efbb4a}.header-actions .button{min-height:36px;padding:8px 16px}.game-shell{width:min(100% - 32px,clamp(260px,100svh - 244px,800px));margin:16px auto 24px}.match-meta{color:var(--ink-soft);justify-content:space-between;gap:8px;margin-bottom:10px;font-size:11px;font-weight:600;line-height:18px;display:flex}.scorebar{grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;min-height:42px;margin-bottom:12px;display:grid}.team{border:2px solid #0000;border-radius:8px;justify-self:start;align-items:center;gap:7px;padding:7px 9px;font-size:12px;display:flex}.team:last-child{justify-self:end}.team.active{border-color:var(--ink);background:var(--card)}.team b{font:700 19px var(--display)}.mini-piece{border:2px solid var(--ink);width:17px;height:17px;box-shadow:0 2px 0 var(--ink);border-radius:50%;display:inline-block}.white{background:var(--card);color:var(--ink)}.black{background:var(--ink);color:var(--card)}.turn-status{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex}.turn-status strong{font-size:15px;font-weight:800}.turn-status small{color:var(--verm);font-size:11px;font-weight:700}.turn-status.finished{color:var(--verm)}.board{aspect-ratio:1;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);isolation:isolate;background:var(--paper-deep);border-radius:8px;grid-template-columns:repeat(10,1fr);display:grid;position:relative;overflow:hidden}.cell{aspect-ratio:1;background:var(--paper-deep);border:0;border-radius:0;place-items:center;min-width:0;padding:0;display:grid;position:relative}.cell.dark{background:#ceb27c}.cell.selected{background:var(--mustard)}.cell:focus-visible{outline:3px solid var(--verm);outline-offset:-3px;z-index:2}.square-number{color:#51452f;font-size:9px;position:absolute;top:2px;left:3px}.piece{border:2px solid var(--ink);width:74%;height:74%;box-shadow:0 3px 0 var(--ink);border-radius:50%;place-items:center;transition:transform .12s;display:grid;position:relative}.piece.black{box-shadow:0 3px #5c5546}.piece i{border:1.5px solid #211d1550;border-radius:50%;position:absolute;inset:15%}.piece.black i{border-color:#fffcf470}.selected .piece{outline:3px solid var(--verm);outline-offset:2px;transform:translateY(-2px)}.piece.movable{outline:2px solid var(--verm);outline-offset:2px}.landing{background:var(--moss);border:2px solid var(--card);pointer-events:none;border-radius:50%;width:28%;height:28%}.board-tools{gap:12px;margin-top:16px;display:flex}.board-tools .button{flex:1;min-height:42px}.game-message{text-align:center;color:var(--ink-soft);overflow-wrap:anywhere;margin:12px 0 0;font-size:12px;line-height:1.6}.thinking{align-items:center;gap:3px;height:7px;display:flex}.thinking i{background:var(--verm);border-radius:50%;width:4px;height:4px;animation:1s infinite pulse}.thinking i:nth-child(2){animation-delay:.15s}.thinking i:nth-child(3){animation-delay:.3s}@keyframes pulse{50%{opacity:.25}}dialog{background:var(--paper);color:var(--ink);border:2px solid var(--ink);width:min(440px,100% - 32px);max-height:calc(100dvh - 32px);box-shadow:8px 8px 0 var(--ink);border-radius:16px;margin:auto;padding:24px;inset:0;overflow:auto}dialog::backdrop{background:#211d1570}.dialog-head,.lesson-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}h2{font:900 25px var(--display);margin:0}h2 small{color:var(--ink-soft);margin-left:8px;font:500 12px Karla,PingFang SC,sans-serif}.icon-button{appearance:none;border:2px solid var(--ink);background:var(--card);border-radius:8px;flex-shrink:0;place-items:center;width:34px;height:34px;padding:0;font-size:23px;line-height:1;display:grid}.icon-button:hover{background:var(--mustard)}fieldset{border:0;margin:0 0 22px;padding:0}legend{margin-bottom:10px;font-size:12px;font-weight:700}.segmented,.difficulty-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.difficulty-grid{grid-template-columns:repeat(4,1fr)}.segmented button,.difficulty-grid button{border:2px solid var(--ink);background:var(--card);border-radius:8px;min-height:42px;padding:8px 5px;font-size:13px}button[aria-pressed=true]{background:var(--ink);color:var(--card);font-weight:700}.display-option{cursor:pointer;border-top:1px solid #211d1530;justify-content:space-between;align-items:center;gap:16px;margin:0 0 14px;padding:16px 0;font-size:13px;font-weight:600;display:flex}.display-option input{accent-color:var(--moss);cursor:pointer;width:20px;height:20px}.dialog-note{color:var(--ink-soft);margin:0 0 16px;font-size:12px;line-height:1.7}.full{width:100%}.return-link{text-align:center;margin-top:23px;font-size:12px;font-weight:600;display:block}.return-link:hover{color:var(--verm)}.move-list{margin:0;padding:0;list-style:none}.move-list li{border-top:1px solid #211d1520;grid-template-columns:32px 24px 1fr;gap:12px;padding:12px 0;font-size:13px;display:grid}.move-list li span{color:var(--ink-soft)}.move-list b{overflow-wrap:anywhere;font-weight:600}.tutorial-dialog{width:min(500px,100% - 28px)}.eyebrow{font-size:12px;font-weight:700}.lesson-head{margin-bottom:14px}.lesson-progress{gap:5px;margin:0 0 20px;display:flex}.lesson-progress i{background:#211d1520;border-radius:2px;flex:1;height:5px}.lesson-progress i.complete{background:var(--verm)}.lesson-text{min-height:47px;color:var(--ink-soft);margin:12px 0 18px;font-size:13px;line-height:1.8}.tutorial-dialog .board-wrap{max-width:min(370px,48dvh);margin:auto}.tutorial-dialog .board{box-shadow:4px 4px 0 var(--ink)}.board-help{text-align:center;color:var(--ink-soft);margin:14px 0;font-size:11px;line-height:1.6}.lesson-actions{gap:12px;margin-top:18px;display:flex}.lesson-actions .primary{flex:1}@media (width<=600px){.header-inner{gap:13px;padding:10px 16px}.brand-word{display:none}h1{border:0;padding:0;font-size:18px}.header-actions{gap:8px}.header-actions .button{padding:7px 12px;font-size:12px}.brand-mark{width:32px;height:32px;font-size:18px}.game-shell{margin-top:12px}.scorebar{gap:6px}.team{gap:5px;padding:6px}.turn-status strong{font-size:14px}.team b{font-size:18px}.piece{box-shadow:0 2px 0 var(--ink);border-width:1.5px}.piece.black{box-shadow:0 2px #5c5546}.piece i{border-width:1px}.selected .piece{outline-offset:1px;outline-width:2px}.square-number{font-size:7px;top:1px;left:2px}dialog{padding:20px}.tutorial-dialog h2{font-size:23px}.lesson-actions .button{padding:10px;font-size:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.motion-piece{pointer-events:none;z-index:5;will-change:transform;place-items:center;width:10%;height:10%;display:grid;position:absolute}.material-icon{fill:currentColor;flex:none;width:20px;height:20px;display:block}.icon-button .material-icon{width:20px;height:20px}.button{justify-content:center;align-items:center;gap:6px;display:inline-flex}.button.full{display:flex}.return-link{justify-content:center;align-items:center;gap:6px;display:flex}.selected .piece{outline-color:var(--ink)}.piece.king{box-shadow:0 3px 0 var(--card), 0 5px 0 var(--ink);border-width:2px}.piece.king.white{color:var(--ink);background:#f8d36a}.piece.king.black{background:var(--ink);color:#f8d36a;box-shadow:0 3px 0 #f8d36a, 0 5px 0 var(--ink)}.piece .material-icon.crown{width:86%;height:86%}.move-trail{pointer-events:none;z-index:1;width:100%;height:100%;color:var(--verm);position:absolute;inset:0;overflow:visible}.move-trail polyline{fill:none;stroke:currentColor;stroke-width:.55px;stroke-dasharray:1.2 1;stroke-linejoin:round;stroke-linecap:round}.move-trail marker path{fill:none;stroke:currentColor;stroke-width:.9px;stroke-linecap:round;stroke-linejoin:round}.trail-start{fill:var(--paper);stroke:var(--verm);stroke-width:.65px}.trail-hop{fill:var(--verm);stroke:var(--paper);stroke-width:.35px}.cell .piece{z-index:2}.cell .landing{z-index:3}.last-move{color:var(--ink-soft);overflow-wrap:anywhere;justify-content:center;align-items:center;gap:7px;margin:12px 0 0;font-size:12px;line-height:1.6;display:flex}.last-move .mini-piece{width:12px;height:12px;box-shadow:none;border-width:1px;flex:none}.result-dialog{text-align:center;padding:42px 24px 24px;overflow:auto}.result-dialog>:not(.confetti){z-index:1;position:relative}.result-dialog .result-close{position:absolute;top:16px;right:16px}.result-emblem{border:2px solid var(--ink);background:var(--paper-deep);width:82px;height:82px;box-shadow:4px 4px 0 var(--ink);border-radius:24px;place-items:center;margin:0 auto 24px;display:grid}.result-emblem .material-icon{width:54px;height:54px}.celebrating .result-emblem{background:var(--mustard);transform:rotate(-7deg)}.result-dialog h2{font-size:36px}.result-cheer{margin:12px 0 20px;font-size:14px;font-weight:600}.result-dialog .dialog-note{margin-bottom:28px}.result-actions{gap:12px;display:flex}.result-actions .button{flex:1}.confetti{pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti i{left:var(--x);background:var(--color);width:7px;height:12px;animation:confetti-fall 2.1s var(--delay) ease-out both;position:absolute;top:-20px}.confetti i:nth-child(3n){border-radius:50%;width:8px;height:8px}@keyframes confetti-fall{0%{opacity:0;transform:translateY(0)rotate(0)}12%{opacity:1}85%{opacity:.8}to{transform:translateY(440px) rotate(var(--spin));opacity:0}}@media (prefers-reduced-motion:reduce){.confetti{display:none}}.dialog-title:focus{outline:none}.cell .captured-remnant{opacity:.24;pointer-events:none;z-index:0}