:root{--page:#f4f0e8;--ink:#191713;--muted:#6f675b;--panel:#fffaf0;--panel-strong:#f7e8cf;--line:#d8c6a5;--dark-square:#6a4d35;--light-square:#eacb93;--accent:#0f766e;--accent-strong:#115e59;--white-piece:#f7f2e8;--black-piece:#24201c;--danger:#b45309}*{box-sizing:border-box}html{background:var(--page)}body{background:linear-gradient(120deg, #0f766e1f, transparent 34%), radial-gradient(circle at 80% 14%, #b4530924, transparent 28%), var(--page);min-height:100vh;color:var(--ink);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button{font:inherit}.game-shell{min-height:100vh;padding:clamp(16px,3vw,36px)}.game-panel{width:min(1180px,100%);margin:0 auto}.screen-enter{animation:1s cubic-bezier(.22,.68,.32,1) both screen-enter}@keyframes screen-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.setup-view,.result-view{width:min(820px,100%);margin:clamp(24px,10vh,96px) auto}.setup-brand,.result-view>.eyebrow,.result-view>h1,.result-lead{text-align:center}.setup-brand>p:last-child,.result-lead{max-width:560px;color:var(--muted);margin:16px auto 0;font-size:1.05rem;line-height:1.55}.setup-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:42px;display:grid}.setup-option,.review-card{border:1px solid var(--line);background:#fffaf0e6;border-radius:8px;box-shadow:0 16px 38px #3728191c}.setup-option{align-content:start;gap:14px;min-height:264px;padding:24px;display:grid}.setup-option h2,.review-card h2{margin:0;font-size:1.3rem}.setup-option>p{color:var(--muted);margin:0;line-height:1.45}.side-choice{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.side-choice button{border:1px solid var(--line);background:var(--panel);min-height:92px;color:var(--ink);cursor:pointer;border-radius:8px;place-items:center;gap:7px;font-weight:800;display:grid}.side-choice button.active{border-color:var(--accent-strong);box-shadow:inset 0 0 0 1px var(--accent-strong)}.side-choice .choice-piece{width:38px;min-width:38px}.setup-levels{margin-top:5px}.setup-option>strong{font-size:1.12rem}.primary-button,.secondary-button{cursor:pointer;border-radius:8px;min-height:48px;padding:0 20px;font-weight:800}.primary-button{border:1px solid var(--accent-strong);background:var(--accent);color:#fff}.primary-button:hover{background:var(--accent-strong)}.secondary-button{border:1px solid var(--line);background:var(--panel);color:var(--ink)}.secondary-button:hover{border-color:var(--accent)}.setup-start{width:min(360px,100%);margin:24px auto 0;display:block}.setup-exit{color:#fff;cursor:pointer;text-align:center;background:#1f2937;border:1px solid #1f2937;border-radius:8px;width:min(360px,100%);min-height:48px;margin:10px auto 0;padding:0 20px;font-weight:800;line-height:48px;text-decoration:none;display:block}.setup-exit:hover{background:#374151;border-color:#374151}.result-view{text-align:left}.result-view>h1{color:var(--accent-strong);margin:0}.result-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:34px 0 18px;display:grid}.result-stats>div{border:1px solid var(--line);background:#fffaf0e0;border-radius:8px;min-height:106px;padding:16px;box-shadow:0 12px 30px #37281914}.result-stats span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800;display:block}.result-stats strong{margin-top:8px;font-size:2rem;display:block}.review-card{padding:24px}.review-card .status-label{margin-bottom:7px;display:block}.review-card ul{color:var(--muted);gap:10px;margin:18px 0 0;padding-left:20px;line-height:1.45;display:grid}.result-actions{justify-content:center;gap:12px;margin-top:22px;display:flex}.result-actions a{place-items:center;text-decoration:none;display:grid}.topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;display:flex}.eyebrow{color:var(--accent-strong);text-transform:uppercase;margin:0 0 4px;font-size:.78rem;font-weight:800}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(2.2rem,5vw,4.5rem);line-height:.95}h2{margin-bottom:12px;font-size:1rem}.topbar-actions{align-items:center;gap:12px;display:flex}.sound-toggle{color:var(--muted);cursor:pointer;align-items:center;gap:8px;font-size:.84rem;font-weight:800;display:inline-flex}.sound-toggle input{opacity:0;width:1px;height:1px;position:absolute}.sound-toggle-track{border:1px solid var(--line);background:#d8d3ca;border-radius:999px;width:38px;height:22px;transition:background .18s,border-color .18s;position:relative}.sound-toggle-track:after{content:"";background:#fff;border-radius:50%;width:14px;height:14px;transition:transform .18s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #2d211738}.sound-toggle input:checked+.sound-toggle-track{border-color:var(--accent-strong);background:var(--accent)}.sound-toggle input:checked+.sound-toggle-track:after{transform:translate(16px)}.sound-toggle input:focus-visible+.sound-toggle-track{outline:2px solid var(--accent-strong);outline-offset:3px}.reset-button{border:1px solid var(--accent-strong);background:var(--accent);color:#fff;cursor:pointer;border-radius:8px;min-height:44px;padding:0 18px;font-weight:800;transition:background .16s,transform .16s}.reset-button:hover{background:var(--accent-strong);transform:translateY(-1px)}.game-layout{grid-template-columns:minmax(320px,760px) minmax(260px,340px);align-items:start;gap:clamp(18px,3vw,34px);display:grid}.board-wrap{perspective:1150px;width:100%;padding:0 0 20px;position:relative}.board-turn{z-index:2;border:1px solid var(--line);background:#fffaf0e6;border-radius:8px;grid-template-columns:max-content minmax(0,1fr) minmax(150px,max-content);align-items:center;gap:10px;min-height:54px;margin-bottom:14px;padding:10px 14px;display:grid;position:relative;box-shadow:0 10px 24px #37281917}.board-turn strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:1.05rem;overflow:hidden}.capture-required{min-height:1.2em;color:var(--danger);text-align:right;white-space:nowrap;font-size:.82rem;font-weight:800}.capture-required.is-hidden{visibility:hidden}.capture-toast{z-index:4;color:#9a3412;text-align:center;background:#fff7ed;border:1px solid #d97706;border-radius:8px;width:min(440px,100vw - 48px);padding:12px 16px;font-size:.92rem;font-weight:800;line-height:1.4;animation:.18s ease-out both capture-toast-in;position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%);box-shadow:0 14px 30px #5c350c38}@keyframes capture-toast-in{0%{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%)}}.board-stage{aspect-ratio:1;transform-origin:50%;width:min(100%,760px);margin:16px 0 30px;position:relative;transform:rotateX(45deg)rotate(-.4deg)}.board{backface-visibility:hidden;border:10px solid #3a2b20;border-radius:8px;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);width:100%;height:100%;display:grid;overflow:hidden;box-shadow:0 24px 60px #3728193d}.board-coordinates{z-index:2;color:#3a2b20;pointer-events:none;text-align:center;text-shadow:0 1px #fffaf0a6;font-size:clamp(.7rem,1.5vw,.9rem);font-weight:900;line-height:1;display:grid;position:absolute}.files{grid-template-columns:repeat(8,1fr);left:2.2%;right:2.2%}.files-top{top:-20px}.files-bottom{bottom:-20px}.ranks{grid-template-rows:repeat(8,1fr);align-items:center;top:2.2%;bottom:2.2%}.ranks-left{left:-20px}.ranks-right{right:-20px}.square{cursor:default;border:0;place-items:center;min-width:0;min-height:0;display:grid;position:relative}.square.dark{background:linear-gradient(135deg, #ffffff12, transparent 42%), var(--dark-square)}.square.light{background:var(--light-square)}.square:disabled{color:inherit}.square.movable{cursor:pointer}.square.movable:before,.square.legal:before{content:"";pointer-events:none;border-radius:6px;position:absolute;inset:10%}.square.movable:before{border:3px solid #0f766ebf}.square.selected:before{border-color:#facc15;box-shadow:inset 0 0 0 999px #facc1524}.square.legal{cursor:pointer}.square.legal:before{background:#facc15c7;border-radius:999px;inset:34%}.piece{z-index:1;aspect-ratio:1;isolation:isolate;background:var(--puck-side);width:70%;box-shadow:0 5px 0 var(--puck-shadow), 0 10px 12px #00000047;border-radius:999px;place-items:center;transition:box-shadow .16s;display:grid;position:relative}.piece:before,.piece:after{content:"";pointer-events:none;position:absolute}.piece:before{z-index:1;border:2px solid var(--puck-rim);background:var(--puck-top);border-radius:50%;inset:0 0 8%;box-shadow:inset 0 5px 7px #ffffff40,inset 0 -7px 9px #00000038}.piece:after{z-index:0;background:var(--puck-side);border-radius:0 0 50% 50%;inset:68% 7% -5%;box-shadow:inset 0 -4px 5px #00000047}.piece.arrived{animation:piece-arrive var(--move-duration,.28s) cubic-bezier(.2, .7, .25, 1) both;will-change:transform, opacity}.piece.bot-arrived{will-change:transform, opacity}.piece.setup-piece{opacity:0;animation:piece-setup-in var(--setup-duration,.42s) cubic-bezier(.18, .72, .22, 1) both;animation-delay:var(--setup-delay,0s);will-change:transform, opacity}@keyframes piece-setup-in{0%{opacity:0;transform:translateY(-34%)scale(.72)}62%{opacity:1;transform:translateY(5%)scale(1.04)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes piece-arrive{0%{opacity:.82;transform:translate(var(--move-x), var(--move-y)) scale(.96)}to{opacity:1;transform:translate(0)scale(1)}}.piece.white{--puck-top:#f7f2e8;--puck-side:#b79d72;--puck-rim:#d8c8a3;--puck-shadow:#846c4c;--puck-bottom:#c9b184;--puck-bottom-rim:#9a7a52;--puck-bottom-groove:#8a6a47}.piece.black{--puck-top:#29231f;--puck-side:#171310;--puck-rim:#0c0a08;--puck-shadow:#090705;--puck-bottom:#1d1713;--puck-bottom-rim:#0d0a08;--puck-bottom-groove:#090706}.piece.white.forced-capture{--puck-top:#e0d2b7;--puck-side:#9a7c55;--puck-rim:#b9a274;--puck-shadow:#6e5537;--puck-bottom:#b79a69;--puck-bottom-rim:#7e603d;--puck-bottom-groove:#715334}.piece.black.forced-capture{--puck-top:#514840;--puck-side:#302923;--puck-rim:#211b17;--puck-shadow:#16110e;--puck-bottom:#3a312a;--puck-bottom-rim:#211a16;--puck-bottom-groove:#17110e}.piece.king:before{border-color:var(--puck-rim);background:var(--puck-top);box-shadow:inset 0 5px 7px #ffffff40,inset 0 -7px 9px #00000038}.crown{z-index:2;aspect-ratio:1;background:radial-gradient(at 46% 30%,#ffffff57 0 9%,#0000 26%),radial-gradient(at 50% 58%,#4d00005c 0 44%,#0000 47%),#c72f2a;border:1px solid #6e1412c7;border-radius:999px;width:54%;display:block;position:relative;transform:translateY(-8%)scaleY(.72);box-shadow:inset 0 4px 6px #55000061,inset 0 -2px 4px #ffac9a38,0 1px 1px #ffffff24}.crown:before,.crown:after{content:"";pointer-events:none;position:absolute}.crown:before{z-index:1;border:1px solid #ffd6ca2e;border-radius:50%;inset:17%;box-shadow:inset 0 2px 4px #4300004d}.crown:after{z-index:2;background:#ffc7b852;border-radius:999px;inset:28% 25% 53%}.sidebar{gap:14px;display:grid}.status-card,.player-card,.difficulty-card,.score-grid>div,.rules,.history{border:1px solid var(--line);background:#fffaf0e0;border-radius:8px;box-shadow:0 12px 32px #3728191a}.status-card{padding:18px}.player-card,.difficulty-card{gap:14px;padding:18px;display:grid}.status-card strong{margin-top:4px;font-size:1.3rem;display:block}.player-card strong,.difficulty-card strong{margin-top:4px;font-size:1.15rem;display:block}.status-card p{color:var(--danger);margin:10px 0 0;font-weight:800}.player-card p,.difficulty-card p{color:var(--muted);margin:0;font-size:.92rem}.side-buttons,.difficulty-buttons{gap:8px;display:grid}.side-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.difficulty-buttons{grid-template-columns:repeat(5,minmax(0,1fr))}.side-buttons button,.difficulty-buttons button{border:1px solid var(--line);background:var(--panel);min-height:40px;color:var(--ink);cursor:pointer;border-radius:8px;font-weight:900}.side-buttons button:hover,.difficulty-buttons button:hover{border-color:var(--accent)}.side-buttons button.active,.difficulty-buttons button.active{border-color:var(--accent-strong);background:var(--accent);color:#fff}.status-label,.score-grid span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800}.score-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.score-grid>div{padding:16px}.score-grid strong{font-size:2rem;display:block}.rules,.history{padding:18px}.rules ul,.history ol{color:var(--muted);gap:8px;margin:0;padding-left:18px;display:grid}.history ol{list-style:decimal}@media (width<=840px){.setup-grid{grid-template-columns:1fr;margin-top:30px}.result-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.game-layout{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start}.topbar-actions{flex-direction:column-reverse;align-items:stretch;width:100%}.sound-toggle{justify-content:space-between}.reset-button{width:100%}.board-stage{transform:rotateX(35deg)rotate(-.25deg)}.board{border-width:6px}}@media (width<=480px){.game-shell{padding:12px}.square.movable:before{border-width:2px;inset:7%}.score-grid{grid-template-columns:1fr}.setup-view,.result-view{margin-top:28px}.setup-option,.review-card{padding:18px}.result-stats{grid-template-columns:1fr 1fr}.result-actions{flex-direction:column}.result-actions button,.result-actions a{width:100%}.board-turn{grid-template-columns:max-content minmax(0,1fr);align-items:center;min-height:80px}.capture-required{text-align:left;grid-column:1/-1;width:100%}}@media (prefers-reduced-motion:reduce){.screen-enter,.piece,.piece.arrived,.piece.setup-piece{transition:none;animation:none}.capture-toast{animation:none}}