/* AI practice: board appearance only; no battle player or media loading. */
.practice-return{margin:0 0 8px}body>header{padding:16px 24px}body>header strong{font-size:26px;color:#ecc778}body>header small{font-size:14px}
html[data-practice-game=ninja] #board-frame{background:#43473a url('./moss-ground.webp') center/cover;border-color:#777966}
html[data-practice-game=kishin] #board-frame{background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1.5px) 0 0/47px 47px,radial-gradient(ellipse at 70% 60%,#49316f,transparent 65%),linear-gradient(145deg,#030611,#132641);border-color:#637996}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board{background:transparent;box-sizing:border-box;width:100%;border:0;box-shadow:none}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board .square{background:transparent;border:.5px solid #e2ddc16b}
html[data-practice-game=kishin] #board .square{border-color:#a6c4e87a}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) :is(.file-labels,.rank-labels){color:#fff4cd;text-shadow:0 1px 3px #000,0 0 4px #000}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board .square.selected{background:#ffd55c30;box-shadow:inset 0 0 0 2px #ffe07a}
html[data-practice-game=ninja] #board.dark-board .square.fog{background:#08101988}
@media(max-width:600px){html[data-practice-game=ninja] #board-frame{background-image:url('./moss-ground-mobile.webp')}body>header{padding:12px 16px}}

/* Game-specific pieces. The parent cell keeps click and visibility handling. */
html[data-practice-game=ninja] #board .square{display:flex;align-items:center;justify-content:center;padding:0}
html[data-practice-game=kishin] #board .square{display:flex;align-items:center;justify-content:center;padding:0}
.kishin-disc{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:78%;aspect-ratio:1;flex:none;border-radius:50%;border:3px solid #88cfff;background:radial-gradient(circle at 35% 25%,#b7e5ff,#3070a4 55%,#123054);box-shadow:inset 0 0 0 2px #203b68,0 3px 2px #0008;color:#fff;font:bold clamp(16px,3vw,32px)/1 "Yu Mincho","Hiragino Mincho ProN",serif;text-shadow:0 1px 2px #000;pointer-events:none}
.kishin-disc.gote{border-color:#ffad9e;background:radial-gradient(circle at 35% 25%,#ffd5c8,#a94242 55%,#4c1425);box-shadow:inset 0 0 0 2px #782234,0 3px 2px #0008}
.kishin-disc.reversed{transform:rotate(180deg)}
.kishin-disc.promoted{color:#e00000;text-shadow:0 0 2px white,0 0 4px white}
.practice-piece-hand{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:60px}
.practice-piece-hand .ninja-token{height:48px!important;max-width:none!important}
.practice-piece-hand .kishin-disc{width:44px;font-size:22px}
@media(max-width:600px){.practice-piece-hand{min-height:50px;padding:3px 5px}.practice-piece-hand .ninja-token{height:40px!important}.practice-piece-hand .kishin-disc{width:38px;font-size:20px}}

/* Blur only the continuous terrain layer, never pieces, coordinates or grid. */
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board-frame{position:relative;isolation:isolate;overflow:hidden;background:#08111d}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board-frame::before{content:"";position:absolute;inset:-8px;z-index:0;pointer-events:none;filter:blur(2.5px);background-position:center;background-size:cover}
html:is([data-practice-game=ninja],[data-practice-game=kishin]) #board-frame>div{position:relative;z-index:1}
html[data-practice-game=ninja] #board-frame::before{background-image:linear-gradient(#17271c55,#17271c55),url('./moss-ground.webp')}
html[data-practice-game=kishin] #board-frame::before{background-image:
radial-gradient(ellipse at 18% 72%,#8a467a88,transparent 36%),
radial-gradient(ellipse at 68% 30%,#477eaa99,transparent 40%),
radial-gradient(ellipse at 48% 52%,#7867a977,transparent 27%),
radial-gradient(ellipse at 80% 82%,#192e6599,transparent 45%),
linear-gradient(135deg,transparent 22%,#40597b66 37%,#8587a855 45%,#443c7666 53%,transparent 69%),
radial-gradient(circle at 12% 24%,#d9e6ff 0 1px,transparent 2px),
radial-gradient(circle at 77% 17%,#d9e6ff 0 1px,transparent 2px),
radial-gradient(circle at 35% 81%,#d9e6ff 0 1px,transparent 2px),
radial-gradient(circle at 84% 58%,#d9e6ff 0 1px,transparent 2px),
linear-gradient(145deg,#020612,#101629 55%,#050c1c)}
html[data-practice-game=kishin] #board .kishin-disc{width:80%;height:auto;min-height:0;max-height:none;aspect-ratio:1/1;border-radius:50%;clip-path:circle(50%);box-shadow:none;flex-shrink:0}
html[data-practice-game=kishin] #board .kishin-disc:not(.reversed){transform:none}
@media(max-width:600px){html[data-practice-game=ninja] #board-frame::before{background-image:linear-gradient(#17271c55,#17271c55),url('./moss-ground-mobile.webp')}}

/* Anchor the disc to the CELL, not an auto-sized grid content track. */
html[data-practice-game=kishin] #board .square{position:relative!important}
html[data-practice-game=kishin] #board .square>.kishin-disc{position:absolute!important;left:10%!important;top:10%!important;width:80%!important;height:80%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;box-sizing:border-box!important;aspect-ratio:1/1;border-radius:50%!important;clip-path:none!important;display:flex!important;align-items:center!important;justify-content:center!important}