.game-nav{display:flex;gap:6px;align-items:center}.game-nav a{padding:9px 15px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:14px;font-weight:700}.game-nav a[aria-current=page]{background:var(--ink);color:var(--paper)}.game-nav a:hover{box-shadow:inset 0 0 0 1px var(--ink)}.checkers-intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.checkers-intro h1{font-size:48px;margin:10px 0}.checkers-intro h1 span{color:var(--orange)}.checkers-intro p{color:var(--muted);font-size:16px;margin:0}.rules-button{border:1px solid var(--ink);border-radius:8px;padding:12px 17px;font-weight:650;background:transparent;color:var(--ink);font-size:14px}.rules-button span{margin-left:12px}.draughts-layout{display:grid;grid-template-columns:minmax(0,1fr) 325px;gap:25px;align-items:start}.draughts-panel{background:var(--paper);border:1px solid var(--border);padding:20px 22px 18px;border-radius:18px;box-shadow:0 4px 0 #164d3008}.player-strip{display:flex;align-items:center;gap:12px;min-height:48px}.player-strip>div{display:flex;flex-direction:column;gap:5px}.player-strip strong{font-size:16px}.player-strip>div>span{font-size:12px;color:var(--muted)}.player-token{width:35px;height:35px;border-radius:50%;border:4px double #456356;box-shadow:0 3px 0 #0002;flex:none}.black-token{background:#172b24}.white-token{background:#f6edce;border-color:#bea878}.turn-pill{margin-left:auto;border-radius:5px;background:var(--lime);font-size:10px;font-weight:750;letter-spacing:1px;padding:6px 8px}.board-frame{position:relative;padding:0 0 24px 24px;margin:18px 0 7px}.checkers-board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));aspect-ratio:1;border:5px solid #1a3b2e;box-shadow:0 4px 0 #123a29;overflow:hidden;border-radius:6px;background:#264c37;position:relative}.checkers-row{display:contents}.checkers-square{border:0;border-radius:0;position:relative;aspect-ratio:1;min-width:0;padding:0;display:grid;place-items:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:#ede6c7;cursor:default}.checkers-square.dark{background:#3f674b;cursor:pointer}.checkers-square.selected{background:#a5b364;box-shadow:inset 0 0 0 4px #f8d373}.checkers-square.last-move{box-shadow:inset 0 0 0 3px #b8cb9277}.checkers-square.legal:after{content:'';position:absolute;width:24%;height:24%;border-radius:50%;background:#e5f491;box-shadow:0 0 0 5px #e5f49126}.checkers-square.legal:hover{background:#627d4e}.checkers-square:focus-visible{outline:3px solid #f8cc59;outline-offset:-4px;z-index:2}.checker-piece{width:75%;height:75%;border-radius:50%;display:grid;place-items:center;position:relative;pointer-events:none;font-family:var(--display);font-weight:800;font-size:clamp(20px,2.6vw,32px);line-height:1;transition:transform .18s,opacity .18s}.checker-piece:before{content:'';position:absolute;inset:13%;border-radius:50%;border:1.5px solid currentColor;opacity:.35}.checker-piece.black{background:radial-gradient(circle at 35% 28%,#425d4e,#172c23 70%);color:#bfceac;box-shadow:0 4px 0 #0f2119,0 6px 6px #0003,inset 0 2px 0 #728474}.checker-piece.white{background:radial-gradient(circle at 35% 28%,#fff9e5,#e8d7a7 75%);color:#927644;box-shadow:0 4px 0 #aa956b,0 6px 6px #0003,inset 0 2px 0 #fffef1}.checker-piece.captured{opacity:.3;filter:grayscale(1);transform:scale(.88)}.checker-piece.movable{outline:2px solid #dcea9666;outline-offset:3px}.checker-piece.king{border:2px solid #e2b850}.checker-piece.landed{animation:piece-land .3s ease-out}.checker-piece.crowned{animation:piece-crown .7s ease-out}.board-ranks{position:absolute;left:0;top:0;bottom:24px;width:20px;display:grid;grid-template-rows:repeat(8,1fr);text-align:center;align-items:center;font-size:11px;color:var(--muted)}.board-files{position:absolute;left:24px;bottom:0;right:0;display:grid;grid-template-columns:repeat(8,1fr);text-align:center;font-size:11px;color:var(--muted)}.checkers-sidebar{display:flex;flex-direction:column;gap:14px}.turn-card{border-radius:13px;background:var(--ink);padding:22px;color:var(--paper)}.turn-card .eyebrow{color:var(--lime);font-size:11px}.turn-card h2{font-size:30px;margin:10px 0}.turn-card p{line-height:1.5;font-size:15px;margin:0;color:#e2ead8;min-height:45px}.capture-banner{border-top:1px solid #ffffff36;padding-top:13px;margin-top:14px;font-size:14px;color:var(--lime);font-weight:650}.endgame-counter{font-size:13px;margin-top:10px}.play-card,.checkers-sound,.moves-card{border:1px solid var(--border);background:var(--paper);padding:20px;border-radius:13px}.play-card label{font-size:11px;font-weight:750;letter-spacing:1.6px;display:block;margin-bottom:9px}.play-card select{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:11px;color:var(--ink);font:inherit;font-size:14px;cursor:pointer}.play-card p{font-size:12px;color:var(--muted);line-height:1.5;margin:10px 0 16px}.checkers-actions{display:grid;grid-template-columns:1.4fr 1fr;gap:8px}.checkers-sound{background:#e4ebdd;padding:18px}.checkers-sound .eyebrow{font-size:10px}.sound-note{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:5px}.sound-controls{display:flex;flex-wrap:wrap;gap:6px;margin:13px 0}.sound-controls .audio-button{padding:7px 9px;font-size:12px;min-height:36px}.checkers-sound .volume-control input{flex:1;width:70px}.yard-rules{padding:10px 12px;display:flex;gap:14px;align-items:center}.yard-rules h2{font-size:18px}.yard-rules p{font-size:14px;line-height:1.6;margin:5px 0 0;color:var(--muted)}.moves-card{padding:15px 18px}.moves-card summary{font-size:14px;font-weight:650;cursor:pointer}.moves-card summary span{float:right;background:var(--bg);border-radius:5px;padding:1px 6px}.moves-card ol{max-height:170px;overflow:auto;margin-bottom:0;padding-left:26px;font-size:13px;line-height:1.8}.empty-history{list-style:none;color:var(--muted)}.move-side{display:inline-block;min-width:47px;font-weight:650}.draughts-page footer a{color:var(--ink);font-size:13px}.rule-sources{font-size:12px!important}.rule-sources a{color:var(--ink)}#checkers-rules{max-height:85vh;width:min(580px,calc(100% - 30px));overflow-y:auto}#checkers-rules li{font-size:14px}.confirm-actions{display:flex;gap:10px}.checkers-board[data-busy=true]{cursor:wait}.checkers-board[data-busy=true] .checkers-square{cursor:wait}@keyframes piece-land{50%{transform:scale(1.12)}}@keyframes piece-crown{50%{transform:scale(1.2);filter:brightness(1.35)}}@media(max-width:1000px){.draughts-layout{grid-template-columns:minmax(0,1fr) 280px;gap:18px}.draughts-panel{padding:16px 14px}.checkers-actions{grid-template-columns:1fr 1fr}.checkers-actions .button{font-size:12px;padding:10px 7px}.turn-card{padding:18px}}@media(max-width:760px){.game-nav{gap:2px}.game-nav a{padding:8px 9px;font-size:12px}.site-header .brand-dot{display:none}.site-header{padding:0 15px}.site-header .brand{font-size:19px;gap:7px}.brand-mark{width:32px;height:33px;font-size:23px;line-height:27px}.checkers-intro{align-items:flex-start;gap:10px}.checkers-intro .eyebrow{font-size:9px;letter-spacing:1.2px}.checkers-intro h1{font-size:38px}.checkers-intro p{font-size:13px;max-width:250px;line-height:1.5}.rules-button{font-size:12px;padding:8px;white-space:nowrap}.rules-button span{display:none}.draughts-layout{grid-template-columns:1fr}.draughts-panel{padding:15px 12px 12px}.board-frame{padding-left:19px;margin-top:15px}.board-files{left:19px}.board-ranks{width:16px}.checkers-board{border-width:4px}.checker-piece{font-size:26px}.player-strip strong{font-size:15px}.player-strip>div>span{font-size:11px}.checkers-sidebar{display:grid;grid-template-columns:1fr}.turn-card{grid-row:1}.turn-card p{min-height:0}.sound-controls .audio-button{font-size:14px}.checkers-actions .button{font-size:14px}.checkers-sound .volume-control input{max-width:210px}}@media(prefers-reduced-motion:reduce){.checker-piece{transition:none;animation:none!important}}
.online-panel[hidden],.online-panel [hidden]{display:none!important}.online-panel h2{font-size:22px;margin-bottom:8px}.online-panel input{width:100%;min-width:0;padding:11px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit;font-size:14px;margin-bottom:12px}.online-panel input:focus-visible{outline:3px solid var(--orange);outline-offset:2px}.online-panel form .button,.online-panel #join-match{width:100%}.online-panel .invite-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.online-panel a.button{text-decoration:none;font-size:13px}.online-role{font-size:12px;font-weight:750;letter-spacing:1px;color:var(--ink)}.online-panel #online-status{font-size:14px;line-height:1.6;color:var(--ink)}.online-panel #online-status[data-error=true]{color:#9c3a24}.online-panel #recent-matches{display:grid;gap:7px;margin-top:12px}.recent-match{border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--ink);text-align:left;padding:10px;font:inherit;font-size:13px;line-height:1.5}.recent-match:hover{background:var(--lime)}.online-panel .text-button{margin-top:13px;font-size:13px}

#join-quick-actions[hidden],#join-quick-actions [hidden],#play-as-host[hidden]{display:none!important}
#join-quick-actions .button{width:100%;margin-top:10px}#join-help{font-size:14px;line-height:1.5}

.checkers-motion-layer{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.checkers-motion-layer .motion-piece{position:absolute;margin:0;transition:none;will-change:transform,opacity;pointer-events:none}
.checkers-square.motion-hidden>.checker-piece{visibility:hidden}
@media(prefers-reduced-motion:reduce){.checkers-motion-layer{display:none}.checkers-square.motion-hidden>.checker-piece{visibility:visible}}