/* Raised, readable playing surfaces. No perspective distortion or overlays over hit targets. */
.game-session-tools{display:flex;justify-content:flex-end;margin:0 0 16px;gap:12px}.game-session-tools .btn{min-height:44px}.quit-dialog{max-width:490px;width:calc(100% - 32px);padding:28px;border:1px solid var(--glass-edge);border-radius:22px;background:linear-gradient(145deg,var(--surface),var(--surface-2));color:var(--text);box-shadow:inset 0 2px #ffffff55,0 8px 0 var(--tile-edge),0 24px 65px #0005}.quit-dialog::backdrop{background:#10241dcc;backdrop-filter:blur(5px)}.quit-dialog p{line-height:1.65;color:var(--muted);margin:16px 0 24px}.quit-dialog .btn-row{flex-wrap:wrap}
.game-depth :is(.tp-board,.be-board,.ns-board,.ss-board,.h5-board,.cl-board,.pl-board,.mc-board,.sq-board,.ct-board,.sh-board,.cg-board,.lf-board,.il-board,.wc-grid,.cc-grid,.cw-grid,.ng-grid,.lg-gridwrap,.ws-board,.ch-stage,.bt-stage,.bg-tray,.tt-arena,.rs-board,.board-wrap){box-shadow:inset 0 2px 2px #ffffff66,inset 0 -3px 7px #13291e18,0 7px 0 var(--tile-edge),0 13px 0 -3px var(--line),0 22px 30px #16291d26;border-color:var(--glass-edge)}
.game-depth :is(.bt-stage,.ch-stage){background:linear-gradient(155deg,var(--surface),var(--surface-2));border-radius:22px}
.game-depth :is(.bg-grid,.ml-board,.go-board,.bg-board,.dm-table){box-shadow:inset 0 3px 5px #fff7,inset 0 -5px 10px #33261433,0 5px 0 var(--tray-edge,#6e593d),0 12px 18px #17291e30}
/* Inlaid mill lines, concave sockets and polished domed counters. */
.game-depth .ml-board{background:radial-gradient(ellipse at 24% 10%,#fff2,transparent 65%),repeating-linear-gradient(4deg,#ffffff09 0 1px,transparent 1px 9px),linear-gradient(145deg,#efd6a4,#c69b5e)}
.game-depth .ml-lines{filter:drop-shadow(0 1px 0 #fff9) drop-shadow(0 -1px 1px #563d2470)}
.game-depth .ml-pt::before{background:radial-gradient(circle at 60% 75%,#b78b48,#5e421f);box-shadow:inset 0 2px 3px #382c1b80,0 1px 1px #fff9}
.game-depth .my-turn .ml-pt.can:not(:has(.pc))::before{background:radial-gradient(circle at 35% 25%,#ffecac,#daa62b);box-shadow:inset 0 1px 1px #fff9,0 0 0 4px #e6bd5744,0 3px 4px #3a2e2033}
.game-depth .pc{background:radial-gradient(circle at 32% 24%,var(--hi),var(--base) 43%,var(--lo) 85%);box-shadow:inset 0 2px 2px #ffffff99,inset 0 -3px 5px #0002,0 4px 0 var(--edge),0 8px 9px #0004}
/* Hidden Rank Strategy: subtle frosted panes instead of flat grey squares. Team hues stay unchanged. */
.game-depth .sk-sq.a{background:linear-gradient(140deg,color-mix(in srgb,var(--surface) 85%,#fff),color-mix(in srgb,var(--surface-2) 85%,#719eac));box-shadow:inset 1px 1px #ffffff55,inset -1px -1px #203d4926}
.game-depth .sk-sq.b{background:linear-gradient(140deg,color-mix(in srgb,var(--surface-2) 70%,#8fa5a8),color-mix(in srgb,var(--slot) 70%,#779197));box-shadow:inset 1px 1px #ffffff33,inset -1px -1px #203d4933}
.game-depth .sk-sq.cloudy{background:linear-gradient(145deg,#65777f,#374d5b);box-shadow:inset 0 3px 6px #17283666}
.game-depth .sk-pc{filter:drop-shadow(0 3px 2px #13233340)}
/* Go retains a solid warm playing surface: hairline engravings and dimensional stones. */
.game-depth .go-board{background:radial-gradient(ellipse at 25% 10%,#fff3,transparent 60%),repeating-linear-gradient(3deg,#ffffff08 0 1px,transparent 1px 8px),linear-gradient(145deg,#e9d4ab,#be965f);border:1px solid #f8e5bf}
.game-depth .go-cell{filter:drop-shadow(0 1px 0 #fff3)}
.game-depth .go-cell .stone{box-shadow:inset 0 2px 3px #cce3ff66,inset 0 -3px 5px #0005,0 4px 0 #152538,0 8px 8px #17273755}
.game-depth .go-cell .stone.white{box-shadow:inset 0 2px 3px #fff,inset 0 -3px 5px #a3afbd66,0 4px 0 #99a6b6,0 8px 8px #17273755}
/* Light edge bevels keep dense number/word grids readable at phone size. */
.game-depth :is(.ng-cell,.cw-cell,.cc-cell,.ns-cell,.wc-tile,.ch-token,.tp-cell){box-shadow:inset 0 1px 0 #ffffff66,inset 0 -2px 2px #10281c1a}
.game-depth :is(.ch-token,.domino,.bg-die){box-shadow:inset 0 2px 2px #ffffff77,inset 0 -2px 4px #0002,0 4px 0 var(--tile-edge),0 8px 10px #17291e26}
@media(hover:hover){.game-depth :is(.ch-token,.domino,.bg-die):enabled:hover{filter:brightness(1.06)}.game-depth :is(.ng-cell,.cw-cell,.cc-cell,.ns-cell,.tp-cell):enabled:hover{box-shadow:inset 0 2px 3px #fff7,inset 0 0 0 2px var(--select)}}
.game-depth :is(.ch-token,.domino,.bg-die):enabled:active{translate:0 2px}
:root[data-theme=dark] .game-depth :is(.bg-tray,.tt-arena,.ch-stage,.bt-stage){box-shadow:inset 0 2px 2px #ffffff22,inset 0 -3px 8px #0002,0 7px 0 var(--tile-edge),0 20px 30px #0003}
@media(prefers-reduced-motion:reduce){.game-depth *{scroll-behavior:auto!important}.game-depth :is(.ch-token,.domino,.bg-die):enabled:active{translate:none}}
.game-depth :is(#np-grid,#cs-grid,#sg-grid,.rd-card,.nx-card,.mm-card,.gf-board,.cf-board){box-shadow:inset 0 2px 2px #ffffff66,inset 0 -3px 6px #13291e18,0 6px 0 var(--tile-edge),0 18px 25px #16291d26;border-color:var(--glass-edge)}
.game-depth :is(.np-cell,.cs-cell,.sg-cell){box-shadow:inset 0 1px 0 #ffffff77,inset 0 -2px 3px #10281c22}
.game-depth :is(.gf-tile,.gf-pad,.it-pad,.ns-pad,.ss-pad,.ls-tile):not(.correct):not(.wrong){box-shadow:inset 0 2px 2px #ffffff77,inset 0 -3px 5px #0002,0 4px 0 var(--tile-edge),0 8px 10px #17291e26}
.game-depth :is(.ladder,.lo-orbit,.bx-board,.pp-board,.hx-board,.sp-board,.rd-board){border-radius:18px;box-shadow:inset 0 2px 2px #ffffff55,inset 0 -3px 5px #18332222,0 5px 0 var(--tile-edge),0 12px 20px #17291e26}
@media(max-width:600px){.forest-header>.wrap:first-child{flex-wrap:wrap}.forest-header .nav{margin-left:auto;gap:8px;flex-wrap:wrap;max-width:100%;justify-content:flex-end}.forest-header #global-sound-toggle{padding:9px 12px;min-height:44px}}
@media(max-width:380px){.forest-header .nav{width:100%}}
@media(max-width:600px){.game-depth .game-head{flex-wrap:wrap}.game-depth .head-tools{flex-wrap:wrap;max-width:100%}}
/* Animate the countdown badge, not a full-width overlay (which caused sideways scrolling). */
.game-depth .bt-count{width:160px;height:160px;max-width:75%;inset:0;margin:auto}

/* Solid material depth from the approved concept, without idle or hover dancing. */
.game-depth .bx-dot{background:radial-gradient(circle at 30% 22%,#b4d2e4,#476579 45%,#142b40 80%);box-shadow:inset 0 1px 1px #fff9,0 4px 0 #122437,0 7px 6px #0004;transform:translateZ(9px)}
.game-depth .bx-line:not(.on)::before{background:linear-gradient(180deg,#fff4db,#d4bf8f);box-shadow:inset 0 1px #fff,0 3px 0 #ae915e,0 5px 6px #372a2033}
.game-depth .ml-pt .pc{filter:drop-shadow(0 6px 4px #49301640)}
.game-depth .ch-sq{box-shadow:inset 1px 1px #ffffff66,inset -1px -2px #24324630}
.game-depth .ch-pc svg{filter:drop-shadow(0 1px 0 #7b756b) drop-shadow(0 3px 0 #4b4841) drop-shadow(2px 6px 3px #19232e70)}
.game-depth .ch-pc.w svg{filter:drop-shadow(0 1px 0 #d9d0b7) drop-shadow(0 3px 0 #aaa18b) drop-shadow(2px 6px 3px #19232e70)}
/* Every game family gets an actual dimensional play surface, not just a card outline. */
.game-depth :is(.bt-stage,.ch-stage,.rd-card,.mm-card,.nx-card,.ladder,.lo-orbit){background:radial-gradient(ellipse at 18% 0%,#ffffff25,transparent 65%),linear-gradient(150deg,var(--surface),var(--surface-2));border:1px solid var(--glass-edge);border-radius:20px;box-shadow:inset 0 2px 2px #ffffff77,inset 0 -4px 7px #13291e20,0 6px 0 var(--tile-edge),0 18px 26px #16291d26}
.game-depth :is(.bg-tray,.board-wrap,.rs-board,.tt-arena){box-shadow:inset 0 3px 2px #ffffff99,inset 0 -4px 6px #32251930,0 7px 0 var(--tray-edge,var(--tile-edge)),0 11px 0 -2px var(--tile-edge),0 24px 30px #17291e33}
.game-depth :is(.bg-grid,.bx-board,.ml-board,.rd-grid,.gf-field,.gf-tray){box-shadow:inset 0 2px 3px #fff6,inset 0 -4px 6px #17291e33,0 4px 0 var(--tile-edge),0 10px 16px #17291e26}
.game-depth :is(.ng-cell,.lt-cell,.cw-cell,.cc-cell,.ns-cell,.tp-cell,.pl-cell,.gf-card,.cf-card,.ls-tile,.gf-choice,.wc-tile,.ch-token){box-shadow:inset 1px 2px 2px #ffffff66,inset -1px -2px 3px #13291e26,0 2px 0 var(--tile-edge)}
.game-depth :is(.ch-sq,.jk-sq,.of-cell,.pn-cell){box-shadow:inset 1px 1px #ffffff55,inset -1px -2px #142a3326}
.game-depth .hx-cell{background-image:linear-gradient(145deg,#ffffff22,transparent 40%,#00000022);box-shadow:inset 0 2px 2px #ffffff66,inset 0 -5px 4px #142a3333}
.game-depth .hx-cell::after{background:linear-gradient(145deg,#ffffff44,transparent 65%);filter:none;pointer-events:none}
.game-depth .sp-tri{filter:drop-shadow(0 2px 1px #57482c66)}
.game-depth .pp-stones i{box-shadow:inset 0 1px 1px #fff9,0 2px 0 #3c281e66,0 4px 3px #21170e55}
.game-depth :is(.gf-sphere,.gf-bead){box-shadow:inset 0 2px 2px #ffffff88,inset -3px -4px 5px #14374f55,0 3px 0 #214d6355,0 6px 6px #112f4140}
/* Fixed boards; feedback lives on the objects, so aiming stays stable. */
@media(hover:hover){.game-depth :is(.ch-sq.can,.ml-pt.can,.bg-cell.can,.sp-hole.can):hover :is(.pc,.ch-pc){filter:brightness(1.12) drop-shadow(0 4px 3px #142a3344)}.game-depth :is(.gf-choice,.gf-pad,.gf-tile,.cf-card,.wc-tile,.ch-token):enabled:hover{filter:brightness(1.06);outline:2px solid var(--select);outline-offset:2px}}
.game-depth :is(.gf-choice,.gf-pad,.gf-tile,.cf-card,.wc-tile,.ch-token):enabled:active{translate:0 2px;filter:brightness(.96)}
.game-depth :is(.ch-sq,.ml-pt,.bg-cell):active :is(.pc,.ch-pc){scale:.96}
@media(prefers-reduced-motion:reduce){.game-depth :is(.gf-choice,.gf-pad,.gf-tile,.cf-card,.wc-tile,.ch-token):enabled:active{translate:none}.game-depth :is(.ch-sq,.ml-pt,.bg-cell):active :is(.pc,.ch-pc){scale:none}}
.game-depth .hx-cell{background-image:linear-gradient(145deg,var(--surface),var(--surface-2))}
.game-depth .ch-sq.sel{box-shadow:inset 0 0 0 4px #f5c542,inset 0 -3px 4px #0002}