/* Animated table presentation shared by all game modes. */
.match-tools { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
.effects-sound.btn { min-height:44px; gap:6px; padding:6px 10px; white-space:nowrap; font-size:16px; }
.effects-sound .i { width:18px; height:18px; }
.fx-rock-impact { position:absolute; z-index:6; transform:translate(-50%,-50%); filter:drop-shadow(0 9px 6px #0009); }
.fx-rock-impact svg { width:100%; height:100%; overflow:visible; }
.fx-rock-impact .rock-body { fill:#505e55; stroke:#c3c7a5; stroke-width:2; stroke-linejoin:round; }
.fx-rock-impact .rock-light { fill:#a7ad8e; }
.fx-rock-impact .rock-mid { fill:#708272; }
.fx-rock-impact .rock-edge { fill:none; stroke:#c3c7a577; stroke-width:2; }
.cinematic-table :is(.practice-board,.board) { position:relative; isolation:isolate; gap:10px; padding:16px; border:1px solid #b292575c; border-radius:24px; background:radial-gradient(ellipse at 50% 0%,#32423b55,transparent 65%),repeating-radial-gradient(ellipse at 50% 50%,transparent 0 39px,#d3c69b05 40px 41px),linear-gradient(145deg,#202c2a,#10191d 55%,#202323); box-shadow:0 22px 48px #0008,inset 0 0 0 5px #121a1c,inset 0 0 0 6px #b2925735,inset 0 0 45px #0007; }
.cinematic-table :is(.board-square,.sq) { border-radius:9px; border-style:solid; box-shadow:0 3px 7px #0009; transform-origin:center; }
.cinematic-table .board-square.empty { background:linear-gradient(140deg,#080d10a8,#1b242580); border-color:#788c7c33; box-shadow:inset 0 2px 9px #0009; }
.cinematic-table .board-square.empty .empty-mark { font-size:25px; font-weight:400; color:#80988b55; }
.cinematic-table .board-square.owned-0 { border-color:#6eaeea; box-shadow:0 0 0 1px #192a35,0 3px 10px #000a,0 0 14px #4f9fe022; }
.cinematic-table .board-square.owned-1 { border-color:#ee7b82; box-shadow:0 0 0 1px #35201f,0 3px 10px #000a,0 0 14px #f15f7022; }
.cinematic-table .board-square.just-played { outline:2px solid #eddaa580; outline-offset:2px; }
.cinematic-table .board-square.just-captured { outline:2px dashed #eddaa570; outline-offset:2px; }
.cinematic-table .board-square.legal { border-color:#ead8a6; background:#c9ad5e12; }
.cinematic-table .board-square.rock { background:radial-gradient(ellipse,#35423b,#10191c); border-style:double; border-width:5px; }
.cinematic-table .board-square.rock .rock-symbol { color:#dec695; text-shadow:0 0 20px #e4c67940; }
.cinematic-table .hand-card { transition:transform .16s ease,filter .16s ease; }
.cinematic-table .hand-card[aria-pressed=true] { transform:translateY(-5px); filter:drop-shadow(0 6px 8px #dfbe7150); }
.fx-stage { position:fixed; z-index:70; pointer-events:none; overflow:visible; --fx:#e6d19b; --glow:#e6d19b88; }
.fx-stage * { pointer-events:none; box-sizing:border-box; }
.fx-owner-0 { --fx:#9bd9ff; --glow:#66b7ff88; }
.fx-owner-1 { --fx:#ffb0a5; --glow:#ff697a88; }
.fx-card { position:absolute; overflow:hidden; border:3px solid var(--fx); border-radius:10px; box-shadow:0 12px 24px #0009,0 0 30px var(--glow); transform-origin:center; z-index:5; background:#14211f; }
.fx-card img { width:100%; height:100%; object-fit:cover; display:block; }
.fx-ring { position:absolute; border:2px solid var(--fx); border-radius:50%; box-shadow:0 0 18px var(--glow),inset 0 0 12px var(--glow); z-index:4; }
.fx-spark { position:absolute; width:5px; height:5px; border-radius:1px; background:var(--fx); box-shadow:0 0 8px var(--fx); z-index:8; }
.fx-strike { position:absolute; height:4px; border-radius:100%; transform-origin:0 50%; background:linear-gradient(90deg,transparent,var(--fx) 45%,#fff); box-shadow:0 0 6px var(--fx),0 0 16px var(--glow); z-index:7; }
.fx-comparison { position:absolute; padding:5px 9px; border:1px solid var(--fx); border-radius:30px; color:#fff6dc; white-space:nowrap; background:#101717ee; box-shadow:0 2px 16px #000b,0 0 12px var(--glow); font:700 16px var(--mono); z-index:9; }
.fx-banner { position:absolute; left:50%; width:max-content; max-width:94%; padding:10px 20px; text-align:center; border:1px solid var(--fx); border-radius:4px; background:linear-gradient(105deg,#111a1eee,#263330f5,#111a1eee); box-shadow:0 6px 25px #000b,0 0 20px var(--glow); color:#f5e4bc; z-index:10; }
.fx-banner strong { display:block; font:800 clamp(16px,3vw,24px) var(--sans); letter-spacing:1px; line-height:1.15; }
.fx-banner span { display:block; margin-top:4px; font:400 16px var(--mono); color:var(--fx); }
.fx-legend-title { border-color:#e5c980; background:linear-gradient(100deg,#141c18ee,#29291df5,#141c18ee); }
.fx-spotlight { position:absolute; inset:-8px; border-radius:24px; background:radial-gradient(ellipse at 50% 43%,#11190b20,#070d11dd); z-index:1; }
.fx-seal { position:absolute; display:grid; place-items:center; width:80%; aspect-ratio:1; border:1px solid var(--fx); border-radius:50%; background:repeating-conic-gradient(from 0deg,transparent 0 14deg,var(--glow) 15deg 16deg,transparent 17deg 30deg); color:var(--fx); font-size:120px; text-shadow:0 0 25px var(--fx); box-shadow:0 0 40px var(--glow),inset 0 0 30px var(--glow); z-index:2; }
.fx-portal { --fx:#b5f084; --glow:#7ff35488; }
.fx-portal .fx-seal { border:10px double #b5f084aa; background:repeating-conic-gradient(#b5f08455 0 12deg,transparent 20deg 40deg); }
.fx-box { --fx:#dbeb9a; --glow:#9def7888; }
.fx-box .fx-seal { border-radius:10%; border-style:double; border-width:6px; background:conic-gradient(transparent,#dcef7e55,transparent,#8df4c455,transparent); }
.fx-prophet { --fx:#f5b4cd; --glow:#ef89b988; }
.fx-prophet .fx-seal { border-style:dotted; border-width:8px; background:repeating-conic-gradient(#e892ba40 0 8deg,transparent 10deg 30deg); }
.fx-oracle { --fx:#c6c3ff; --glow:#a299ff88; }
.fx-oracle .fx-seal { border-style:dashed; background:radial-gradient(ellipse,transparent 35%,#adadff55 36%,transparent 38%,transparent 55%,#adadff55 56%,transparent 58%); }
.fx-flag { --fx:#b6e0ed; --glow:#58b2d288; }
.fx-flag .fx-seal { border-radius:0; border-width:0 5px; background:repeating-linear-gradient(130deg,#0b0d13cc 0 12px,#aed9e633 13px 15px,transparent 16px 30px); }
.fx-gary { --fx:#ffdb99; --glow:#ffbb5f88; }
.fx-gary .fx-seal { border:5px dotted var(--fx); background:radial-gradient(ellipse,#ffdc6540,transparent 65%); }
.fx-founder { --fx:#f4d178; --glow:#e1ae4388; }
.fx-founder .fx-seal { border:8px double var(--fx); background:repeating-conic-gradient(transparent 0 42deg,#edd48b70 43deg 45deg); }
.fx-priest { --fx:#eee2bc; --glow:#dfd3a088; }
.fx-priest .fx-seal { border:4px double var(--fx); background:radial-gradient(ellipse,transparent 35%,#f2df9f99 36%,transparent 38%,transparent 55%,#f2df9f88 56%,transparent 58%); }
.effects-reduced .hand-card { transition:none; }
.effects-reduced .hand-card[aria-pressed=true] { transform:none; }
@media(max-width:600px) {
 .cinematic-table :is(.practice-board,.board) { padding:10px; gap:7px; border-radius:17px; }
 .fx-banner { padding:8px 12px; }
 .fx-banner span { font-size:16px; }
 .fx-comparison { padding:3px 6px; }
}
@media(prefers-reduced-motion:reduce) {
 .cinematic-table .hand-card { transition:none; }
 .cinematic-table .hand-card[aria-pressed=true] { transform:none; }
}
@media(min-width:861px) { .cinematic-table :is(.practice-board,.practice-coin-flip-host) { max-width:min(440px,calc((100svh - 100px) * .63)); } }
.effects-reduced .hand-card .card-face { transition:none; transform:none; }
@media(prefers-reduced-motion:reduce) { .cinematic-table .hand-card .card-face { transition:none; transform:none; } }

.cinematic-table .board { margin-inline:auto; }