/* Illustrated playmat. Functional engravings follow the same grid as live cards. */
.table-active #play-view{background:#06121d}
.table-active .table-layout{gap:clamp(12px,1.4vw,32px)}
.table-active .table-main{grid-template-rows:minmax(0,1fr) clamp(100px,17vh,230px);gap:0}
.table-active #match-table .table-board{position:relative;isolation:isolate;overflow:hidden;border-radius:16px;border:1px solid #8b774347;background:#123346 url('assets/arena/voyage-mat.png') center/100% 100% no-repeat;padding:clamp(14px,1.7vw,32px) clamp(22px,3.5vw,76px);grid-template-rows:minmax(0,1fr) 26px minmax(0,1fr);box-shadow:0 20px 45px #0008,0 0 28px #279cb015}
.table-active .table-board::before,.table-active .table-board::after{content:'';position:absolute;pointer-events:none;z-index:-1}
.table-active .table-board::before{inset:0;background:linear-gradient(105deg,transparent 20%,#66ddd71c 42%,#baf4e734 49%,#64caba0c 58%,transparent 75%);transform:translateX(-110%);animation:mat-light 18s linear infinite;will-change:transform,opacity}
.table-active .table-board::after{inset:0;border:2px solid #7be6e023;border-radius:16px;box-shadow:inset 0 0 46px #37ced233;animation:mat-tide 9s ease-in-out infinite alternate}
.table-active #match-table .table-player.own,.table-active #match-table .auto-player.opponent{background:transparent!important;padding:4px 0!important;gap:4px}
.table-active #match-table .table-player-heading{padding:0 8px;background:none;text-shadow:0 2px 4px #000;min-height:20px;flex-basis:20px}
.table-active #match-table .table-player-heading strong{color:#eee0b9;font-weight:650}
.table-active #match-table .table-player-heading>span{color:#bfcccf}
.table-active #match-table .auto-public{column-gap:clamp(10px,1.4vw,30px);row-gap:8px}
.table-active #match-table .auto-characters{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:clamp(8px,1.7vw,36px);padding:4px 2%;overflow:visible}
.table-active #match-table .auto-characters>.table-card,.table-active #match-table .auto-characters>.table-slot{height:100%;max-height:none;max-width:100%;min-width:0;width:auto;aspect-ratio:63/88;justify-self:center;align-self:center;margin:0;z-index:1}
.table-active #match-table .auto-characters>.table-slot{border:0;background:none!important;box-shadow:none}
.mat-sockets{position:absolute;inset:4px 2%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1.7vw,36px);pointer-events:none;z-index:0}
.mat-sockets i{height:100%;aspect-ratio:63/88;max-width:100%;justify-self:center;border:1px solid #c2a76a66;border-radius:3px;box-shadow:inset 0 0 0 3px #0b243252,inset 0 0 0 4px #b79c5d26;display:flex;align-items:center;justify-content:center;color:#d3b77438;font:500 clamp(20px,2.2vw,46px)/1 Georgia;background:#061c2b14}
.table-active #match-table .auto-leader{position:relative}
.table-active #match-table .auto-leader:before{content:'';position:absolute;height:100%;aspect-ratio:63/88;border:1px solid #ddbd777a;outline:1px solid #c8ad6540;outline-offset:4px;border-radius:3px;pointer-events:none;background:#05162218}
.table-active #match-table .auto-leader>small{display:block;position:absolute;bottom:-10px;color:#dbc2869c;font-size:9px;letter-spacing:2px;line-height:1}
.table-active #match-table .auto-stage{position:relative;border:1px solid #c3aa5b55;outline:1px solid #c3aa5b20;outline-offset:3px;background:#05213124;min-width:0;aspect-ratio:63/88;border-radius:3px}
.table-active #match-table .stage-placeholder{background:none;border:0;color:#d2bd8570;font-size:10px;letter-spacing:1.4px}
.table-active #match-table .auto-don{position:relative;border-top:1px solid #c9ad6666;border-bottom:1px solid #c9ad6633;border-radius:0;background:linear-gradient(90deg,#071c3155,transparent)!important;padding:5px 10px;align-self:center;height:86%;width:100%}
.table-active #match-table .auto-don small{color:#b1c7ce}
.table-active #match-table .auto-don>span strong{color:#f7d88c}
.table-active #match-table .auto-piles{padding-left:8px;border-left:1px solid #c9ad6640;gap:5px}
.table-active #match-table .auto-piles strong{color:#ebd7a6;text-shadow:0 2px 3px #000;font-size:clamp(9px,.65vw,15px)}
.table-active #match-table .empty-trash{border:1px solid #c9ad6666;background:#07203340;color:#dcc68b66;border-radius:3px}
.table-active #match-table .table-turn-line{position:relative;background:linear-gradient(90deg,transparent,#051a2cc9 20%,#051a2cc9 80%,transparent);border:0;padding:0 10px;gap:10px;border-radius:0;z-index:3}
.table-active #match-table .table-turn-indicator{color:#eadbb9;text-align:center;font-size:clamp(11px,.75vw,17px)}
.table-active #match-table .turn-dot{background:#edcc82;box-shadow:0 0 8px #edcc8244}
.table-active #match-table .turn-number{color:#cdb87f;font-size:10px;letter-spacing:1px}
.table-active #match-table .table-main>.table-hand{background:linear-gradient(180deg,#0d25315c,transparent);border-top:1px solid #ad904a40;border-radius:0;padding:8px 4% 5px}
.table-active #match-table .table-hand-heading{color:#bdb48e}
.table-active #match-table .table-card{box-shadow:0 5px 9px #0008;background:transparent}
.table-active #match-table .table-card b{background:linear-gradient(0deg,#071722f5,#071722c9);color:#fff1c5;text-shadow:0 2px 3px #000}
.table-active #match-table .table-card.selected{outline-color:#ffe3a0;box-shadow:0 0 18px #ffe3a021}
.table-active #match-table .table-rail{border-left:0;padding:0 6px 0 0;background:linear-gradient(180deg,transparent,#0a1d2944);gap:12px}
.table-active #match-table .auto-prompt{border-top:1px solid #b1985355;padding-top:10px}
.table-active #match-table .confirm-card-action,.table-active #match-table .turn-controls>.button{background:linear-gradient(110deg,#b9914e,#f0d496,#cba960)!important;color:#102536!important;box-shadow:inset 0 0 0 1px #f8e6b766,0 5px 14px #0004!important;border-radius:4px;letter-spacing:.2px}
.table-active #match-table #mat-motion{background:none;border:1px solid #b6a66d4a;color:#d6c593;border-radius:4px;padding:5px 8px;font-size:12px;white-space:nowrap}
.table-active #match-table #mat-motion[aria-pressed=false]{color:#8c9da4;border-color:#71818a44}
.mat-paused .table-board::before,.mat-paused .table-board::after,.mat-hidden .table-board::before,.mat-hidden .table-board::after{animation-play-state:paused!important}
@keyframes mat-light{0%{transform:translateX(-110%);opacity:0}12%{opacity:.85}70%{opacity:.85}88%,100%{transform:translateX(110%);opacity:0}}
@keyframes mat-tide{from{opacity:.25}to{opacity:.85}}
@media(max-height:850px){.table-active #match-table .table-board{padding:12px 26px;grid-template-rows:minmax(0,1fr) 24px minmax(0,1fr)}.table-active #match-table .auto-public{row-gap:5px}.table-active #match-table .auto-don{padding:3px 6px;height:90%}.table-active #match-table .auto-leader>small{display:none}.table-active #match-table .table-player-heading{flex-basis:16px;min-height:16px}}
@media(max-width:1000px){.table-active #match-table .table-board{padding:10px 16px}.table-active #match-table .auto-characters,.mat-sockets{gap:8px}.table-active #match-table .auto-don{padding:2px 4px}.table-active #match-table #mat-motion{font-size:10px;padding:4px}.table-active #match-table .auto-leader>small{display:none}}
@media(max-width:650px){.table-active #match-table .table-board{padding:9px 8px;border-radius:8px}.table-active #match-table .auto-characters,.mat-sockets{gap:4px}.table-active #match-table .auto-piles{padding-left:3px}.table-active #match-table .table-turn-indicator{font-size:9px}.table-active #match-table .auto-stage{outline:0}.table-active #match-table .auto-don{border:0;background:transparent!important}.table-active #match-table #mat-motion{font-size:9px}}
@media(prefers-reduced-motion:reduce){.table-active .table-board::before,.table-active .table-board::after{animation:none!important;will-change:auto}.table-active .table-board::before{opacity:0}}
.table-active #match-table .auto-don .don-card{flex:0 0 auto;margin-right:clamp(-26px,-1vw,-10px)}
@media(max-width:650px){.table-active #match-table .auto-don .don-card{margin-right:-14px}}

/* Event feedback is confined to the table; card art remains the focal point. */
.table-active #match-table .table-player{position:relative;isolation:isolate}
.table-active #match-table .table-player::after{content:'';position:absolute;inset:0 -12px;z-index:-1;pointer-events:none;border-radius:12px;background:radial-gradient(ellipse at center,#69dfcc25,transparent 72%);box-shadow:inset 0 -2px #79dac400;opacity:0;transition:opacity .5s ease}
.table-active #match-table .table-player.turn-lit::after{opacity:1;box-shadow:inset 0 -2px #79dac447}
.table-active #match-table #table-sound{background:none;border:1px solid #b6a66d4a;color:#d6c593;border-radius:4px;padding:5px 8px;font-size:12px;white-space:nowrap}
.table-active #match-table #table-sound[aria-pressed=false]{color:#8c9da4}
.combat-result-cue.feedback-block{color:#c3f7ff;border-color:#79e5ff;background:#072333ee;text-shadow:0 0 18px #4ddfff99}
.combat-result-cue.feedback-positive{color:#9dffc4;border-color:#79e7a4;background:#07271dee;text-shadow:0 0 16px #45dd8588}
.combat-result-cue.feedback-hit,.combat-result-cue.feedback-ko{color:#ffdbad;border-color:#ff986c;background:#351713ee;text-shadow:0 0 18px #ff633aaa}
.combat-result-cue.feedback-ko{font-size:clamp(24px,2.4vw,48px)}
.table-motion-ghost>.don-card{display:block!important;width:100%!important;height:100%!important;margin:0!important}
.table-motion-ghost>.don-card img{width:100%;height:100%;object-fit:contain}
@media(prefers-reduced-motion:reduce){.table-active #match-table .table-player::after{transition:none}}
