body:has(.checkers-solo) .main{padding-top:12px;padding-bottom:12px}
.checkers-solo{width:100%;min-height:0;display:flex;justify-content:center}
.checkers-game{--checkers-board-size:min(540px,calc(100vw - 160px),calc(100dvh - 285px));width:100%;display:grid;justify-items:center;align-content:start;gap:.3rem;text-align:center}
.checkers-game h1{font-size:clamp(1.05rem,4vw,1.45rem);margin:0}
.checkers-score{display:flex;justify-content:center;gap:.55rem;align-items:center;font-weight:800}
.checkers-meta{margin:0;font-size:.92rem}
.checkers-board-wrap{display:grid;grid-template-columns:28px var(--checkers-board-size) 28px;justify-content:center;align-items:center;gap:.25rem;max-width:100%}
.checkers-board{width:var(--checkers-board-size);height:var(--checkers-board-size);aspect-ratio:1 / 1;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));border:3px solid #3b2a1f;background:#eee;touch-action:manipulation;box-sizing:border-box}
.checkers-square{position:relative;display:grid;place-items:center;border:0;padding:0;min-width:0;min-height:0;width:100%;height:100%;aspect-ratio:1 / 1;overflow:hidden;box-sizing:border-box}
.checkers-square.light{background:#f3dfbd}
.checkers-square.dark{background:#72513b}
.checkers-square.legal-source::after{content:'';position:absolute;inset:10%;border:2px dashed #ffe067;border-radius:50%}
.checkers-square.selected{outline:3px solid #fff;outline-offset:-4px}
.checkers-square.destination::before{content:'';width:28%;aspect-ratio:1 / 1;height:auto;border-radius:50%;background:#69e58b;box-shadow:0 0 0 3px #154c27;pointer-events:none}
.checkers-piece{position:relative;width:68%;aspect-ratio:1 / 1;height:auto;max-width:68%;max-height:68%;border-radius:50%;border:2px solid #1b1b1b;box-sizing:border-box;box-shadow:inset 0 0 0 3px rgba(255,255,255,.22),0 2px 3px #0005;display:grid;place-items:center;flex:0 0 auto}
.checkers-piece.user{background:#f4f4f4}
.checkers-piece.mokonzi{background:#192f1e;border-color:#07120a}
.checkers-piece.king::after{content:'♛';position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(.72rem,3.2vw,1.35rem);line-height:1;color:#f7c948;text-shadow:0 1px #000;pointer-events:none}
.checkers-tray{width:28px;font-size:.66rem;font-weight:800;line-height:1;writing-mode:vertical-rl;display:flex;align-items:center;justify-content:center;gap:.18rem}
.checkers-tray b{font-size:.88rem}
.checkers-message{min-height:1.35em;margin:0;font-weight:800;color:#176b36}
.checkers-ready{text-align:center}
.checkers-ready .btn{min-height:44px}
.checkers-final{width:min(100%,430px);margin:auto}
.checkers-final h2,.checkers-final p{margin:.65rem 0}
.checkers-reward{font-weight:900;color:#176b36}
.checkers-result{font-weight:800}
@media(max-width:520px){
 body:has(.checkers-solo) .main{padding-top:4px;padding-bottom:4px}
 .checkers-solo{min-height:0}
 .checkers-game{--checkers-board-size:min(calc(100vw - 66px),calc(100dvh - 188px));gap:.18rem}
 .checkers-game h1{font-size:1.02rem}
 .checkers-score,.checkers-meta{font-size:.82rem}
 .checkers-board-wrap{grid-template-columns:24px var(--checkers-board-size) 24px;gap:.12rem}
 .checkers-board{border-width:2px}
 .checkers-tray{width:24px;font-size:.58rem;gap:.12rem}
 .checkers-tray b{font-size:.76rem}
 .checkers-message{font-size:.78rem;min-height:1.15em}
 .checkers-piece{border-width:1.5px}
 .checkers-square.legal-source::after{border-width:1.5px}
}

.checkers-square.mokonzi-preview-source{outline:3px solid currentColor;outline-offset:-5px}
.checkers-square.mokonzi-preview-destination::after{content:'';position:absolute;inset:14%;border:3px solid currentColor;border-radius:50%;pointer-events:none;animation:checkersMokonziPulse .55s ease-in-out infinite alternate}
@keyframes checkersMokonziPulse{from{transform:scale(.88);opacity:.55}to{transform:scale(1);opacity:1}}