.cc-stage{width:min(100%,calc((var(--board-vh) - 38px)*.866));gap:8px;max-width:760px;padding:4px 5px;display:grid}.cc-board{--cc-board-outline:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);aspect-ratio:.866;isolation:isolate;width:100%;position:relative}.cc-board:before,.cc-board-inlay{content:"";clip-path:var(--cc-board-outline);pointer-events:none;position:absolute}.cc-board:before{z-index:0;filter:drop-shadow(0 20px 27px #311c0e4d)drop-shadow(0 4px 6px #2b170b40);background-color:#3c2114;background-image:linear-gradient(#1f0f0814,#1f0f0833),url(/chinese-checkers/walnut-veneer-v1.webp);background-position:50%;background-size:cover;inset:0;box-shadow:inset 0 0 0 1px #e5b56f33}.cc-board-inlay{z-index:1;filter:saturate(.88)contrast(1.03);background-color:#d6a85f;background-image:linear-gradient(112deg,#ffffff14,#0000 28%,#673b190f 78%,#4123121a),url(/chinese-checkers/maple-veneer-v1.webp);background-position:50%;background-size:cover;inset:clamp(8px,1.35vw,14px);box-shadow:inset 0 0 0 1px #ffefc49e,inset 0 0 0 3px #5e331821,inset 0 0 28px #5430161f}.cc-hole{left:var(--cc-x);top:var(--cc-y);z-index:3;aspect-ratio:1;cursor:pointer;background:radial-gradient(circle at 46% 39%,#5a331b 0 30%,#3a1f10 56%,#211108 79%,#100805 100%);border:1px solid #4d2a13bd;border-radius:50%;width:5.05%;padding:0;transition:filter .16s,box-shadow .16s;position:absolute;transform:translate(-50%,-50%);box-shadow:inset 0 4px 6px #0c0603b8,inset 0 -1px 1px #ffdf9d47,0 0 0 1px #ffdc974d,0 1px 1px #fff8d361}.cc-hole.blue-camp{box-shadow:inset 0 4px 6px #081116c2,inset 0 -1px 1px #a9efff3d,0 0 0 1.5px #167e9ebd,0 0 5px #1782a42e}.cc-hole.coral-camp{box-shadow:inset 0 4px 6px #190808bd,inset 0 -1px 1px #ffcdc038,0 0 0 1.5px #b1413db8,0 0 5px #ad413a29}.cc-marble{--glass-bright:#39bde9;--glass-mid:#087fbe;--glass-deep:#034f9a;--glass-rim:#022b62;--glass-reflection:#c9faffc7;z-index:3;background:radial-gradient(circle at 28% 20%,#fff 0 5%,#ffffffe0 6%,#fff3 9%,transparent 11%),radial-gradient(ellipse at 72% 78%,#ffffffe6 0 5%,var(--glass-reflection) 7%,#ffffff14 13%,transparent 16%),radial-gradient(circle at 39% 34%,var(--glass-bright) 0 18%,var(--glass-mid) 48%,var(--glass-deep) 80%,var(--glass-rim) 100%);filter:saturate(1.18)contrast(1.05);border:1px solid #032e4dcc;border-radius:50%;transition:transform .18s cubic-bezier(.2,.86,.25,1.18),filter .18s;display:block;position:absolute;inset:1%;box-shadow:0 3px 2px #23110980,0 7px 8px #26130a3d,inset 0 0 0 1px #ffffff61,inset -5px -7px 8px #00143047,inset 4px 4px 7px #fff3}.cc-marble.sapphire{--glass-bright:#34c4ff;--glass-mid:#087fd4;--glass-deep:#064ea8;--glass-rim:#022b6d;--glass-reflection:#bef3ffcc;border-color:#02366cdb}.cc-marble.coral{--glass-bright:#ff7066;--glass-mid:#ed302f;--glass-deep:#a9162c;--glass-rim:#5f0e28;--glass-reflection:#ffd8bbcc;border-color:#741128db}.cc-marble:before{content:"";filter:blur(.1px);background:linear-gradient(155deg,#ffffff40,#0000 64%);border-top:2px solid #ffffffbd;border-radius:50%;width:48%;height:27%;position:absolute;top:9%;left:12%;transform:rotate(-25deg)}.cc-marble:after{content:"";filter:blur(.25px);background:#ffffff73;border-radius:50%;width:29%;height:13%;position:absolute;bottom:12%;right:12%;transform:rotate(-32deg)}.cc-marble i{aspect-ratio:1;background:#fff;border-radius:50%;width:7%;position:absolute;top:17%;left:24%;box-shadow:0 0 3px #fffffff2}.cc-hole.selected{z-index:5;box-shadow:0 0 0 3px #fff696e6,0 0 17px #ffd856b8,inset 0 3px 5px #2e190a61}.cc-hole.selected .cc-marble{filter:brightness(1.08);transform:translateY(-16%)scale(1.07)}.cc-hole.legal{z-index:4;box-shadow:0 0 0 3px #35b799c7,0 0 14px #35b79973,inset 0 3px 5px #2e190a5c}.cc-target{z-index:5;pointer-events:none;background:#fff1a1;border-radius:50%;position:absolute;inset:30%;box-shadow:0 0 0 3px #187a6f59,0 0 8px #ffe775cc}.cc-hole.last:not(.selected){box-shadow:0 0 0 2px #ffde5bd1,0 0 13px #ffc53780,inset 0 3px 5px #2e190a66}.cc-mini{aspect-ratio:1;border-radius:50%;width:24px;box-shadow:0 2px 4px #341b0d47,inset -3px -3px 5px #1915203d,inset 2px 2px 4px #ffffff80}.cc-mini.sapphire{background:#149ec8;border:1px solid #075a75}.cc-mini.coral{background:#ed6256;border:1px solid #97372f}@media (width<=900px){.cc-stage{width:min(100%,92dvh)}}@media (width<=850px){.cc-board{width:min(100%, calc(var(--board-fit-height) * .866));margin-inline:auto}}