@import url('/arcade-v28/community/community.css');
:root{color-scheme:dark;--gold:#e7cb8a;--cream:#f8efda;--muted:#a9b8a9}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 14% 30%,#244d3e70,transparent 55%),radial-gradient(ellipse at 93% 80%,#49343c55,transparent 55%),#0c1815;color:var(--cream);font-family:Arial,sans-serif}header{max-width:1520px;border-bottom:1px solid #c4ae7430}a{color:var(--gold)}button,select{font:inherit;min-height:42px;border:1px solid #d7bf7e40;border-radius:8px;color:var(--cream);background:#24352f;padding:10px 14px;cursor:pointer}button:disabled{opacity:.5;cursor:wait}button:hover:not(:disabled){border-color:var(--gold);background:#354b40}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #f4d080;outline-offset:3px}.gold,.button-link.gold{background:linear-gradient(120deg,#f1dba2,#b99248);color:#19261d;font-weight:800;border:0}.gold:hover:not(:disabled){background:#f5dfa6}main{max-width:1480px;margin:auto;padding:0 32px}header{padding:22px 32px}header nav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.brand{color:var(--cream)}.brand small{color:var(--gold)}.intro{display:flex;justify-content:space-between;align-items:center;padding:30px 0 26px;gap:20px}.eyebrow{color:var(--gold);font-size:11px;font-weight:700;letter-spacing:2.5px}.intro h1{font:clamp(32px,4vw,56px)/1.1 Georgia,serif;margin:10px 0}.intro h1 em{font-weight:400;color:var(--gold);font-size:.72em}.intro p:last-child{color:#b7c4b8;margin:12px 0 0;font-size:14px}.edition{text-align:right;font-size:10px;letter-spacing:2px;color:var(--gold)}.edition b{display:block;font-size:10px;letter-spacing:1px;margin-top:10px;color:#94a99a}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}.arena{max-width:800px;width:100%;margin:auto}.player-bar{display:flex;gap:12px;align-items:center;padding:7px 4px 14px;min-height:65px}.player-bar small{display:block;color:#a9b8a9;font-size:9px;letter-spacing:2px;margin-bottom:6px}.player-bar strong{font:20px Georgia,serif}.player-bar>span{margin-left:auto;font-size:10px;letter-spacing:1.5px;color:var(--gold)}.avatar{width:42px;height:42px;flex-shrink:0;background-image:url('pieces.png');background-size:600% 200%;background-position:0 0}.bunny-avatar{background-position:0 100%}.board-frame{padding:14px;background:linear-gradient(135deg,#c7a969,#5c4828 20%,#a58a51 49%,#45371e 72%,#c3a56a);border:1px solid #dfc581;border-radius:6px;box-shadow:0 24px 80px #0006,inset 0 0 0 4px #1c281e}#board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);border:1px solid #101a14}.square{position:relative;width:100%;height:auto;aspect-ratio:1;min-height:0;padding:0;border:0;border-radius:0;display:block;overflow:hidden;background:#ded6b5;color:#243a2c;touch-action:manipulation}.square.dark{background:#476b58;color:#e5dfbf}.square:hover:not(:disabled){background:#e6c778}.square.dark:hover:not(:disabled){background:#60816b}.square.selected{box-shadow:inset 0 0 0 4px #ffe39b;background:#a29b55}.square.last{background:#b5b56f}.square.dark.last{background:#718d4e}.square.check{background:#b64846!important}.square .piece{position:absolute;inset:0;background-image:url('pieces.png');background-size:600% 200%;background-repeat:no-repeat;filter:drop-shadow(0 3px 2px #0007);pointer-events:none}.square .coord{position:absolute;font-size:9px;font-weight:800;left:3px;bottom:2px;z-index:2}.square .piece-label{position:absolute;right:3px;top:2px;font:bold 9px Arial;background:#11281dbf;color:#fff6db;border-radius:3px;min-width:12px;text-align:center;padding:1px;z-index:2}.square.legal:after{content:'';position:absolute;width:22%;height:22%;left:39%;top:39%;background:#172b25aa;border:1px solid #f4dfa1a0;border-radius:50%;pointer-events:none}.square.capture:after{width:84%;height:84%;left:8%;top:8%;background:none;border:4px solid #f6cf80}.square:focus-visible{outline:3px solid #fff2b0;outline-offset:-3px;z-index:3}.board-frame+.player-bar{padding-top:14px}.table-status{display:flex;align-items:center;gap:10px;font-size:13px;padding:4px 0}.table-status p{flex:1}.table-status button{font-size:11px;background:transparent}.pulse{width:7px;height:7px;background:var(--gold);border-radius:50%;flex-shrink:0}.panel{background:linear-gradient(135deg,#1b3028ed,#16251fed);border:1px solid #d9c48a30;border-radius:12px;padding:22px;margin-bottom:16px}.panel h2{font:20px Georgia,serif;margin:0}.sidebar .eyebrow{margin:0 0 16px}.mode-tabs{display:flex;margin-bottom:18px;background:#091810;padding:4px;border-radius:9px;gap:4px}.mode-tabs button{flex:1;font-size:12px;padding:10px;border:0;background:transparent;color:#b6c6b9}.mode-tabs button[aria-pressed=true]{background:#3b5143;color:var(--cream)}label{font-size:12px;display:block;color:#c6cdbd;margin-bottom:7px}select{width:100%;margin-bottom:20px;font-size:13px}.level-heading{display:flex;align-items:center;justify-content:space-between}.level-heading strong{font-size:16px;color:var(--gold)}input[type=range]{width:100%;padding:0;accent-color:var(--gold);height:24px;margin:8px 0;background:none}.range-labels{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.5px;color:#9cafa2}.muted{font-size:13px;line-height:1.7;color:#aebfb0}.fine{font-size:11px;line-height:1.6;color:#a1b0a2}.wide{width:100%;margin-top:10px}.gold.wide{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;letter-spacing:1px;font-size:12px}.list-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.list-heading button{font-size:10px;padding:6px;min-height:36px;background:none}.action-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.action-row button{flex:1;font-size:11px;padding:8px}.moves{max-height:172px;overflow:auto;margin-top:12px}.move-row{display:grid;grid-template-columns:32px 1fr 1fr;gap:10px;font:13px/2.1 monospace;padding:0 8px}.move-row:nth-child(even){background:#ffffff06}.move-row span:first-child{color:#8b9e90}.legend summary{font:18px Georgia,serif;cursor:pointer}.legend-row{display:flex;align-items:center;border-bottom:1px solid #fff1;gap:10px;font-size:12px}.legend-piece{display:block;width:48px;height:48px;background:url('pieces.png') no-repeat;background-size:600% 200%}.wait-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0;border-top:1px solid #ffffff15}.wait-row span{font-size:12px;overflow-wrap:anywhere}.wait-row small{display:block;color:#aebfaf;font-size:10px;margin-top:4px}.wait-row button{font-size:12px}footer{margin:35px 0 0;padding:25px 0;border-top:1px solid #d9c48a30;display:flex;gap:24px;flex-wrap:wrap;justify-content:space-between;color:#879e8e;font-size:10px;letter-spacing:1px}dialog{background:#172c23;color:var(--cream);border:1px solid var(--gold);border-radius:14px;padding:28px;max-width:min(520px,92vw);max-height:85dvh;overflow:auto;font:14px/1.7 Arial}dialog h2{font:28px Georgia,serif}dialog::backdrop{background:#000b}dialog button{margin:6px}#promotion-options{display:grid;grid-template-columns:repeat(4,1fr)}#promotion-options button{padding:4px}#promotion-options .legend-piece{width:65px;height:65px;max-width:100%}#toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:30;background:#263e30;border:1px solid var(--gold);box-shadow:0 10px 30px #0008;padding:12px 18px;max-width:94vw;width:600px;border-radius:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}[hidden]{display:none!important}.button-link{display:block;padding:13px;text-align:center;border-radius:8px;font-size:12px;margin-top:12px;text-decoration:none}
@media(min-width:1250px){.arena{max-width:720px}}@media(max-width:1000px){.play-layout{grid-template-columns:minmax(0,1fr) 290px;gap:22px}.panel{padding:16px}main{padding:0 22px}.edition{display:none}}@media(max-width:720px){header{padding:16px}header nav{gap:12px;font-size:11px}header nav button{font-size:10px;min-height:32px;padding:6px}main{padding:0 12px}.intro{padding:22px 4px}.intro h1{font-size:34px}.intro p:last-child{font-size:12px}.play-layout{grid-template-columns:1fr;gap:18px}.arena{max-width:550px}.board-frame{padding:7px}.player-bar{padding:5px 3px 8px;min-height:54px}.player-bar strong{font-size:18px}.player-bar>span{font-size:9px}.avatar{width:36px;height:36px}.sidebar{display:grid;grid-template-columns:1fr}.panel{padding:20px;margin-bottom:12px}.table-status{font-size:11px}.square .coord{font-size:8px}.square .piece-label{font-size:8px;right:1px;top:1px;padding:0}.table-status button{padding:7px;min-height:34px}.intro .eyebrow{font-size:9px}.brand{font-size:21px}.brand small{font-size:7px}.moves{max-height:150px}footer{gap:12px}#toast{font-size:12px;padding:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.square .classic-piece,.legend-piece.classic-piece{background-image:none!important;display:flex;align-items:center;justify-content:center;font-family:"Segoe UI Symbol","DejaVu Sans",serif;font-size:clamp(30px,4.9vw,66px);line-height:1;filter:none;text-shadow:0 2px 2px #0005}.white-piece{color:#fff9e7;-webkit-text-stroke:1px #493d2a}.black-piece{color:#12251c;-webkit-text-stroke:.5px #eed9a2}.legend-piece.classic-piece{font-size:38px}.square:has(.classic-piece) .piece-label{display:none}@media(max-width:720px){.square .classic-piece{font-size:clamp(29px,8.8vw,48px)}}

.square .classic-piece,.legend-piece.classic-piece{background-image:none!important;display:flex;align-items:center;justify-content:center;font-family:"Segoe UI Symbol","DejaVu Sans",serif;font-size:clamp(30px,4.9vw,66px);line-height:1;filter:none;text-shadow:0 2px 2px #0005}.white-piece{color:#fff9e7;-webkit-text-stroke:1px #493d2a}.black-piece{color:#12251c;-webkit-text-stroke:.5px #eed9a2}.legend-piece.classic-piece{font-size:38px}.square:has(.classic-piece) .piece-label{display:none}@media(max-width:720px){.square .classic-piece{font-size:clamp(29px,8.8vw,48px)}}

.intro h1{color:var(--cream)}.square .piece{inset:4%;background-size:600% 200%}#board-view{margin-bottom:0}

#battle-mode{margin-bottom:0}label[for=board-view],label[for=battle-mode]{margin-top:14px}.capture-battle{--duration:1.55s;position:fixed;left:50%;top:46%;transform:translate(-50%,-50%);width:min(440px,94vw);height:270px;pointer-events:none;z-index:40;filter:drop-shadow(0 12px 35px #0009);animation:battle-stage var(--duration) both}.capture-battle.quick{--duration:.55s}.battle-glow{position:absolute;inset:25px -15px;background:radial-gradient(ellipse,#f7cf6c70,#103829e8 50%,transparent 72%)}.battle-actor{position:absolute;top:30px;width:150px;height:150px;transform-origin:50% 90%}.battle-actor.attacker{left:25px;animation:battle-attack var(--duration) both}.battle-actor.defender{right:25px;animation:battle-defeat var(--duration) both}.battle-art{display:block;width:100%;height:100%;background-image:url('pieces.png');background-size:600% 200%;filter:drop-shadow(0 5px 4px #0008)}.battle-art.classic-piece{background:none;display:flex;align-items:center;justify-content:center;font:135px/1 "Segoe UI Symbol",serif}.battle-caption{position:absolute;left:0;right:0;text-align:center;bottom:12px;color:#fff0bb;text-shadow:0 2px 4px #000;font:24px Georgia,serif;letter-spacing:1px}.battle-burst{position:absolute;left:49%;top:42px;font-size:110px;line-height:1;color:#fff7d1;text-shadow:0 0 25px #ffae2b;animation:battle-impact var(--duration) both}.battle-slash{position:absolute;width:160px;height:8px;background:linear-gradient(90deg,transparent,#fffac0,#e0a92f,transparent);left:32%;top:90px;transform:rotate(-35deg);animation:battle-impact var(--duration) both}.bunny-strike .battle-slash{background:linear-gradient(90deg,transparent,#fff8fa,#efb3ce,transparent)}.battle-spark{position:absolute;left:58%;top:100px;width:8px;height:12px;background:#ffe79a;box-shadow:0 0 9px #ffc74f;animation:battle-sparks var(--duration) both}.battle-spark:nth-of-type(even){background:#b8edd0;width:5px;height:5px;border-radius:50%}@keyframes battle-stage{0%{opacity:0;scale:.8}12%,85%{opacity:1;scale:1}100%{opacity:0;scale:1.03}}@keyframes battle-attack{0%,13%{transform:translateX(-45px) rotate(-12deg)}28%{transform:translateX(75px) rotate(18deg)}38%{transform:translateX(25px) rotate(-14deg)}48%{transform:translateX(85px) rotate(21deg)}57%{transform:translateX(30px) rotate(-14deg)}68%{transform:translateX(100px) rotate(22deg)}80%,100%{transform:translateX(55px) rotate(0)}}@keyframes battle-defeat{0%,25%{transform:translateX(30px)}31%{transform:translateX(60px) rotate(20deg)}39%{transform:translateX(25px) rotate(-8deg)}50%{transform:translateX(65px) rotate(25deg)}59%{transform:translateX(25px)}70%{transform:translateX(70px) rotate(45deg);opacity:1}100%{transform:translate(150px,80px) rotate(140deg) scale(.4);opacity:0}}@keyframes battle-impact{0%,24%,35%,43%,55%,63%,81%,100%{opacity:0;scale:.4}29%,49%,69%{opacity:1;scale:1}}@keyframes battle-sparks{0%,65%{opacity:0;transform:translate(0,0) scale(.1)}70%{opacity:1}98%,100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--spin)) scale(.5)}}@media(max-width:500px){.battle-actor{width:125px;height:125px}.battle-actor.attacker{left:7px}.battle-actor.defender{right:24px}.battle-caption{font-size:21px}.battle-art.classic-piece{font-size:115px}}

.arena{margin:0 auto;perspective:none}

/* Capture choreography: composite transform/opacity only; promote transient actors. */
.capture-battle{--duration:2.15s;animation-timing-function:cubic-bezier(.22,.61,.36,1)}.capture-battle.quick{--duration:.65s}.battle-actor,.battle-spark,.battle-burst,.battle-slash{will-change:transform,opacity;backface-visibility:hidden;animation-timing-function:cubic-bezier(.25,.65,.35,1)}.battle-art{transform:translateZ(0)}
@keyframes battle-attack{0%{transform:translate3d(-26px,10px,0) rotate(-5deg)}12%{transform:translate3d(-8px,0,0) rotate(-9deg)}23%{transform:translate3d(58px,-14px,0) rotate(12deg)}29%{transform:translate3d(70px,0,0) rotate(15deg)}38%{transform:translate3d(24px,2px,0) rotate(-9deg)}48%{transform:translate3d(78px,-8px,0) rotate(17deg)}56%{transform:translate3d(29px,3px,0) rotate(-11deg)}67%{transform:translate3d(90px,-11px,0) rotate(20deg)}73%{transform:translate3d(95px,0,0) rotate(12deg)}85%{transform:translate3d(52px,0,0) rotate(-3deg)}100%{transform:translate3d(55px,0,0) rotate(0)}}
@keyframes battle-defeat{0%,23%{transform:translate3d(20px,0,0) rotate(0);opacity:1}31%{transform:translate3d(49px,-7px,0) rotate(12deg)}40%{transform:translate3d(24px,0,0) rotate(-4deg)}51%{transform:translate3d(55px,-9px,0) rotate(18deg)}59%{transform:translate3d(30px,1px,0) rotate(-3deg)}69%{transform:translate3d(65px,-20px,0) rotate(31deg);opacity:1}81%{transform:translate3d(100px,-4px,0) rotate(65deg);opacity:.95}100%{transform:translate3d(144px,65px,0) rotate(118deg) scale(.65);opacity:0}}
@keyframes battle-stage{0%{opacity:0;transform:translate(-50%,-50%) scale(.94)}12%,88%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-48%) scale(1.02)}}
@keyframes battle-impact{0%,24%,38%,44%,57%,64%,83%,100%{opacity:0;transform:scale(.6)}30%,50%,71%{opacity:1;transform:scale(1)}}
.bunny-art:not(.classic-piece){clip-path:inset(4% 4% 0 4%)}.dragon-art:not(.classic-piece){clip-path:inset(0 4% 0 4%)}

/* v29: actual WebGL scene replaces the former CSS perspective board. */
.arena.view-3d{perspective:none;max-width:none;margin:0;}
.view-3d .board-frame{transform:none!important;transition:none!important;position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;border:0;}
#scene3d{width:100%;height:clamp(430px,52vw,680px);background:#10251f;border:1px solid #bba16b66;border-radius:18px 18px 0 0;overflow:hidden;box-shadow:0 22px 60px #0005;}
#scene3d canvas{display:block;width:100%;height:100%;touch-action:none;}
#camera-tools{background:#142c23;border:1px solid #bba16b44;border-top:0;border-radius:0 0 14px 14px;padding:10px 12px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
#camera-tools>span{font-size:9px;letter-spacing:1px;color:#b5c7ac;}
#camera-tools>div{display:flex;gap:5px;flex-wrap:wrap;}#camera-tools button{font-size:10px;min-height:36px;padding:8px;}
#scene-loading{padding:15px;border:1px solid #d6ba72;color:#eed6a0;border-radius:10px;margin:10px 0;font-size:13px;}
@media(max-width:720px){#scene3d{height:420px;border-radius:12px 12px 0 0;}#camera-tools{padding:9px;justify-content:center;}#camera-tools button{min-height:40px;} .view-3d .player-bar{margin:0;}}
@media(min-width:1500px){#scene3d{height:700px;}}

.cinematic{display:flex!important;align-items:center;gap:9px;line-height:1.5;font-size:12px!important;}.cinematic input{accent-color:#d9b96c;width:18px;height:18px;}

body.board-expanded{overflow:hidden;}
.arena:fullscreen,.arena.expanded{position:fixed;inset:0;z-index:80;width:100vw;max-width:none!important;height:100dvh;margin:0;padding:12px 20px;background:#0c1d17;display:flex;flex-direction:column;gap:0;overflow:hidden;}
.arena:fullscreen #scene3d,.arena.expanded #scene3d{height:auto;min-height:0;flex:1;border-radius:12px 12px 0 0;}
.arena:fullscreen .player-bar,.arena.expanded .player-bar{min-height:42px;flex-shrink:0;padding:3px 0 7px;}
.arena:fullscreen .avatar,.arena.expanded .avatar{height:30px;width:30px;}
.arena:fullscreen .player-bar strong,.arena.expanded .player-bar strong{font-size:17px;}
.arena:fullscreen .table-status,.arena.expanded .table-status{min-height:38px;margin:0;padding:0;flex-shrink:0;}
.arena:fullscreen #camera-tools,.arena.expanded #camera-tools{flex-shrink:0;margin-bottom:6px;}
@media(max-width:720px){.arena:fullscreen,.arena.expanded{padding:6px;}.arena:fullscreen .player-bar,.arena.expanded .player-bar{min-height:34px;}.arena:fullscreen .player-bar small,.arena.expanded .player-bar small{display:none;}.arena:fullscreen #camera-tools,.arena.expanded #camera-tools{padding:5px;}.arena:fullscreen #camera-tools>span,.arena.expanded #camera-tools>span{display:none;}}

.player-clock{font:700 25px/1.2 monospace;font-variant-numeric:tabular-nums;color:#c8c4a5;background:#0d211b;border:1px solid #71846c55;border-radius:8px;min-width:86px;text-align:center;padding:8px;margin-left:auto;}.player-clock.ticking{background:#d9c389;color:#142c21;border-color:#fff1c1;}.player-clock.clock-low{color:#ffa5a5;background:#411e25;}.player-bar>span{margin-left:0!important;}#spectator-banner{display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap;padding:10px;background:#183d32;border:1px solid #aa985e;border-radius:8px;font-size:12px;margin:8px 0;}#spectator-banner span{color:#b4c9b7;font-size:11px;}#watch-section{margin-top:20px;border-top:1px solid #fff2;padding-top:15px;}#watch-section h2{font:20px Georgia;}#time-control{margin-bottom:0;}.sound-panel input[type=range]{width:100%;accent-color:#d9bd77;}.arena:fullscreen .player-clock,.arena.expanded .player-clock{font-size:21px;padding:4px;min-width:80px;}@media(max-width:720px){.player-clock{font-size:21px;min-width:74px;padding:6px;}.player-bar{gap:7px;}#spectator-banner{font-size:10px;gap:5px;}#spectator-banner span{display:none;}}