:root{font-family:"Nunito",system-ui,sans-serif;color:#fff7e8;background:#241910;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,.square:focus-visible{outline:3px solid #ffe28a;outline-offset:2px}.hidden{display:none!important}.scene{min-height:100vh;background:linear-gradient(#28140a77,#24140d99),url('assets/porch.webp') center/cover fixed;position:relative;overflow:hidden}.scene:before{display:none;content:"";position:absolute;inset:0;opacity:.25;background:repeating-linear-gradient(90deg,transparent 0 13%,#130d0a 13.1% 13.5%,transparent 13.6% 25%);pointer-events:none}.scene:after{display:none;content:"";position:absolute;bottom:0;left:0;right:0;height:12vh;background:repeating-linear-gradient(90deg,#684332 0 9.8%,#503322 10% 10.3%);box-shadow:0 -8px 18px #1e0f0d88;pointer-events:none}.topbar{height:58px;padding:9px 22px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.home{color:#fff0cc;text-decoration:none;font-weight:900;letter-spacing:.02em}.icon-button,.small-button{color:#fff7e8;background:#2d2119;border:1px solid #ad7651;border-radius:12px;padding:8px 14px}.layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(320px,670px) minmax(260px,360px);align-items:center;justify-content:center;gap:clamp(22px,4vw,64px);padding:0 24px 35px;min-height:calc(100vh - 58px)}.table-wrap{width:min(100%,70vh);justify-self:center}.table-top,.table-bottom{display:flex;justify-content:space-between;align-items:center;padding:5px 9px;color:#ffecd3;font-size:1.02rem;font-weight:900;text-shadow:0 2px 2px #211}.piece-count{background:#24150fbb;border:1px solid #d9ad6b66;border-radius:40px;padding:2px 12px}.board{display:grid;width:100%;aspect-ratio:1;grid-template-columns:repeat(8,1fr);border:clamp(9px,1.6vw,16px) solid #3a2218;border-radius:9px;box-shadow:0 20px 30px #150c0bbc,0 0 0 3px #c79257,inset 0 0 0 2px #e4bc7e;background:#50301d;touch-action:manipulation}.square{border:0;border-radius:0;padding:0;display:grid;place-items:center;position:relative;min-width:0;min-height:0}.square.light{background:#e9c992}.square.dark{background:#915d3d}.square.dark:nth-child(4n){background:#895739}.square.selected{background:#f7d563}.square.last{box-shadow:inset 0 0 0 5px #ffffff55}.square.target:after{content:"";width:28%;height:28%;border-radius:50%;background:#ffec9dba;box-shadow:0 0 0 4px #44221344}.square.capture-target:after{width:42%;height:42%;background:transparent;border:5px solid #ffe28b;box-shadow:0 0 16px #fff2a9}.piece{position:relative;display:block;width:77%;height:77%;border-radius:50%;box-shadow:0 6px 3px #21150b77, inset 0 -7px 0 #0003,inset 0 4px 0 #fff5;border:3px solid #fff4;transition:transform .15s}.piece.red{background:radial-gradient(circle at 38% 30%,#f37e53,#b73528 65%,#7d241d);border-color:#f6b577}.piece.cream{background:radial-gradient(circle at 38% 30%,#fff7d8,#e1c890 65%,#9c764a);border-color:#fff4cc}.piece:after{content:"";position:absolute;inset:19%;border-radius:50%;border:2px dashed #fff7;opacity:.7}.piece.king:before{content:"♛";position:absolute;z-index:2;inset:0;display:grid;place-items:center;color:#fff8d8;font-size:clamp(17px,3vw,35px);text-shadow:0 2px #553322}.piece.cream.king:before{color:#74502b;text-shadow:0 1px #fff}.piece.new-king{animation:crown .6s ease-out}@keyframes crown{50%{transform:scale(1.28) rotate(-10deg)}100%{transform:scale(1)}}.piece.sulk{transform:rotate(20deg) scale(.85)}.side{max-width:360px;align-self:center}.sign{text-align:center;background:#3d281c;border:6px double #d4a46b;border-radius:14px;box-shadow:0 8px 0 #26160e,0 14px 24px #170d0c99;padding:10px 15px 12px;transform:rotate(-1deg)}.sign-small{font-size:.8rem;font-weight:900;letter-spacing:.2em;color:#ecc18a}.sign h1{font-family:"Baloo 2",system-ui;font-size:clamp(2.5rem,5vw,4.2rem);line-height:1;margin:3px 0;color:#ffdf9f;text-shadow:0 4px #6f311f}.sign-line{font-weight:700;color:#f5d7b2}.status-card{display:flex;flex-direction:column;gap:5px;background:#f2dbaf;color:#4b3022;border:5px solid #b87946;border-radius:14px;padding:16px;margin-top:25px;min-height:126px;box-shadow:0 9px 0 #402416}.status-card>span:first-child{text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;font-weight:1000;color:#996344}.status-card strong{font-family:"Baloo 2",system-ui;font-size:1.55rem;line-height:1.2}.status-card>span:last-child{font-size:.85rem;line-height:1.35}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}.action,.big{border:2px solid #e9bb82;color:#3a2519;background:#f3d5a4;border-radius:12px;padding:10px 12px;font-weight:1000;box-shadow:0 5px 0 #7c4c31;transition:transform .12s,box-shadow .12s}.action:hover,.big:hover{transform:translateY(-2px);box-shadow:0 7px 0 #7c4c31}.action:active,.big:active{transform:translateY(4px);box-shadow:0 1px 0 #7c4c31}.action:disabled{opacity:.5;cursor:default}.action.primary,.big.primary{grid-column:span 2;background:#f7aa65;color:#48251b;border-color:#ffd798}.record{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:20px;color:#f6d9b3;font-size:.87rem}.record strong{font-size:1.05rem}.rule-note{margin-top:14px;color:#eec99f;font-size:.83rem;line-height:1.45}.settings-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px;font-size:.75rem}.settings-row select{max-width:140px;background:#2d2119;color:#fff4df;border:1px solid #ad7651;border-radius:8px;padding:7px}.overlay{position:fixed;inset:0;z-index:5;display:grid;place-items:center;padding:20px;background:#1b100bba;backdrop-filter:blur(5px);overflow:auto}.menu-card{width:min(96vw,480px);background:#f5dfba;color:#4f2f1e;border:8px solid #8e5936;border-radius:20px;box-shadow:0 20px 50px #130907b8,inset 0 0 0 2px #ffecc8;text-align:center;padding:20px clamp(18px,4vw,35px) 28px}.checker-mascot{font-size:3.6rem;color:#b3362c;line-height:1;animation:bob 2s infinite ease-in-out}@keyframes bob{50%{transform:translateY(-6px) rotate(5deg)}}.menu-card h2{font-family:"Baloo 2",system-ui;font-size:2.25rem;line-height:1.1;margin:6px 0}.menu-card p{margin:8px auto 15px;line-height:1.35}.pick{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:9px 0;font-weight:900}.pick select{width:60%;padding:9px;border-radius:8px;border:2px solid #b9794c;background:#fff5dd;color:#492817}.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:17px}.menu-actions .primary{grid-column:span 2}.big.subtle{grid-column:span 2;background:#fff6df}.menu-tip{font-size:.8rem;color:#76543e}.result-icon{font-size:3.2rem;color:#bd7937}.result-card{max-width:390px}.toast{position:fixed;z-index:8;left:50%;bottom:22px;transform:translateX(-50%);background:#1e150fde;color:#ffe8b6;padding:9px 18px;border-radius:20px;border:1px solid #e6b06b;box-shadow:0 4px 20px #0008;text-align:center;max-width:90vw}@media(max-width:800px){.layout{grid-template-columns:1fr;gap:22px;padding:5px 15px 35px}.table-wrap{width:min(100%,70vh,550px)}.side{max-width:550px;width:100%;justify-self:center}.sign{padding:5px}.sign h1{font-size:2.3rem}.status-card{margin-top:16px;min-height:auto}.scene:after{display:none}}@media(max-width:500px){.topbar{height:45px;padding:4px 10px}.layout{min-height:0}.table-wrap{width:min(100%,54vh)}.table-top,.table-bottom{font-size:.8rem}.board{border-width:7px}.side{display:grid;grid-template-columns:1fr 1fr;gap:10px}.sign{grid-column:span 2}.status-card{grid-column:span 2;margin-top:0;padding:10px}.actions{grid-column:span 2;margin-top:0}.record,.rule-note,.settings-row{grid-column:span 2;margin-top:0}.piece{border-width:2px}.square.capture-target:after{border-width:3px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Generated, optimized ceramic checker pieces; CSS disks above remain as loading fallback. */
.piece{width:94%;height:94%;background-color:transparent;border:0;box-shadow:none;background-position:center;background-repeat:no-repeat;background-size:contain}
.piece:after,.piece.king:before{display:none}
.piece.red{background-image:url('assets/piece-red.webp');background-color:transparent;border:0}
.piece.cream{background-image:url('assets/piece-cream.webp');background-color:transparent;border:0}
.piece.red.king{background-image:url('assets/piece-red-king.webp')}
.piece.cream.king{background-image:url('assets/piece-cream-king.webp')}
.piece.red,.piece.cream{background-position:center;background-repeat:no-repeat;background-size:contain}
/* Keep the rule differences visible before the first move in an embedded player. */
.variant-preview{margin:0 0 8px!important;padding:8px 10px;border-radius:9px;background:#fff4d7;color:#68452d;font-size:.82rem;line-height:1.3;text-align:left}
.menu-card{max-height:calc(100dvh - 24px);overflow-y:auto}
@media(max-height:650px){.menu-card{padding:12px 18px 16px;border-width:5px}.checker-mascot{font-size:2.2rem}.menu-card h2{font-size:1.7rem;margin:3px 0}.menu-card p{margin:5px auto 8px}.pick{margin:5px 0}.pick select{padding:6px}.menu-actions{margin-top:8px}.big{padding:7px 10px}}