:root{--bg:#f4f1ea;--text:#1f1c17;--muted:#6f685d;--line:#e2dccf;--surface:#fff;--accent:#b45309;--board:#d9c9a5;--grid:#b39d72;--special:#a88a59;--frame:#3f3427;--attacker:#2d2a26;--defender:#f7f2e7;--king:#f7f2e7;--gold:#c9971c;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#151412;--text:#f2eee6;--muted:#a59e92;--line:#2b2925;--surface:#1d1b18;--accent:#f59e0b;--board:#c8b78f;--grid:#a08a60;--special:#94784a;--frame:#2a231a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0}a{color:inherit;text-underline-offset:3px}button{font:inherit;color:inherit}.muted{color:var(--muted)}.layout{gap:16px;max-width:620px;margin:0 auto;padding:32px 16px 64px;display:grid}.header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}h1{letter-spacing:-.02em;margin:0;font-size:28px}h1+p{margin:4px 0 0;font-size:14px}h2{margin:0 0 8px;font-size:15px}.segmented{border:1px solid var(--line);background:var(--surface);border-radius:10px;flex-wrap:wrap;padding:3px;display:inline-flex}.segmented button{cursor:pointer;background:0 0;border:0;border-radius:7px;padding:6px 10px;font-size:14px}.segmented button.active{background:var(--text);color:var(--bg)}.segmented button:not(.active):hover{background:var(--line)}.status{align-items:center;gap:8px;min-height:24px;margin:0;font-weight:600;display:flex}.dot{border:1px solid var(--muted);border-radius:50%;width:10px;height:10px}.dot.attackers{background:var(--attacker)}.dot.defenders{background:var(--defender)}.dot.over{background:var(--accent);border-color:var(--accent)}.board{grid-template-columns:repeat(var(--size), minmax(0, 1fr));grid-template-rows:repeat(var(--size), minmax(0, 1fr));aspect-ratio:1;border:10px solid var(--frame);background:var(--board);border-radius:12px;display:grid;overflow:hidden;box-shadow:0 12px 32px #0003}.square{min-width:0;min-height:0;box-shadow:inset 0 0 0 .5px var(--grid);cursor:pointer;background:0 0;border:0;place-items:center;padding:0;display:grid;position:relative}.square.throne,.square.corner{background:var(--special)}.square.throne:before,.square.corner:before{content:"";border:2px solid #ffffff73;position:absolute;inset:22%;transform:rotate(45deg)}.square.last{background-image:linear-gradient(#b4530938,#b4530938)}.square.selected{box-shadow:inset 0 0 0 3px var(--accent)}.square.target:after{content:"";aspect-ratio:1;background:#b4530999;border-radius:50%;width:28%}.square.captured:after{content:"";aspect-ratio:1;border:2px dashed #b91c1c99;border-radius:50%;width:54%;animation:.9s ease-out forwards fade}@keyframes fade{to{opacity:0;transform:scale(1.3)}}.square:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}.piece{z-index:1;aspect-ratio:1;border-radius:50%;width:72%;position:relative}.piece.attacker{background:radial-gradient(circle at 35% 30%, #4a4540, var(--attacker) 65%);box-shadow:0 2px #0d0c0b,0 4px 6px #0000004d}.piece.defender{background:radial-gradient(circle at 35% 30%, #fff, var(--defender) 65%);box-shadow:inset 0 0 0 1px #d4c9b0,0 2px #c8bb9d,0 4px 6px #00000040}.piece.king{background:radial-gradient(circle at 35% 30%, #fff, var(--king) 65%);width:84%;box-shadow:inset 0 0 0 3px var(--gold), 0 2px 0 #c8bb9d, 0 4px 6px #0000004d}.piece.king:after{content:"";background:var(--gold);clip-path:polygon(0 100%,0 20%,25% 60%,50% 0,75% 60%,100% 20%,100% 100%);position:absolute;inset:30% 26% 34%}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.counts{font-variant-numeric:tabular-nums;margin-left:auto;font-size:14px}.ghost{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;padding:7px 14px;font-size:14px}.ghost:hover:not(:disabled){background:var(--line)}.ghost:disabled{opacity:.4;cursor:default}.rules ul{color:var(--muted);margin:0 0 8px;padding-left:18px;font-size:14px;line-height:1.7}.rules p{margin:0;font-size:14px}@media (prefers-reduced-motion:reduce){.square.captured:after{opacity:0;animation:none}}