/* LAN command deck: the positions follow Spielbereich.png. */
body.debug-page,body[data-view="game"] { padding-left:196px; }
.debug-page .app-sidebar,body[data-view="game"] .app-sidebar { width:196px; padding:26px 14px; }
.debug-page .brand,body[data-view="game"] .brand { font-size:18px; }
main#board,#view-game { max-width:2000px; padding:24px; gap:18px; }
#view-game { grid-template-columns:minmax(0,1fr) 260px; }
#opponent-panel,#own-panel,.player-panel { padding:18px; min-width:0; }
#opponent-panel>.mat-scroll,#own-panel>.mat-scroll { grid-column:1 / -1; }
.mat-scroll { min-width:0; width:100%; overflow-x:auto; border-radius:12px; scrollbar-color:#38878e #0c2436; }
.battle-mat {
  display:grid; grid-template-columns:100px minmax(540px,1fr) 132px 132px;
  grid-template-areas:"silo upgrades zone damage" "silo base zone damage" "silo units deck discard" "silo count deck discard";
  gap:12px; align-items:stretch; min-width:990px; padding:38px 24px 24px;
  background:linear-gradient(#061a2d36,#061a2d36),url("assets/lan-playmat.png") center / cover;
  border:1px solid #38727f; border-radius:12px; box-shadow:inset 0 0 55px #020d18b0;
  color:#d9edf3; isolation:isolate;
}
.mat-zone-area { min-width:0; padding:10px; border:1px solid #5c9dab80; border-radius:8px; background:#081d2ac7; box-shadow:inset 0 0 18px #173e5030; }
.mat-zone-area h3 { display:flex; justify-content:space-between; gap:6px; margin:0 0 9px; color:#95d9df; text-transform:uppercase; font-size:10px; letter-spacing:1.2px; font-weight:600; }
.mat-zone-area h3 span { color:#8aa7b6; letter-spacing:0; text-transform:none; }
.mat-upgrades { grid-area:upgrades; border-top:2px solid #7ba6d0; }
.mat-base { grid-area:base; justify-self:center; width:220px; padding:0; border:0; background:transparent; }
.mat-base h3 { justify-content:center; margin:0 0 5px; }
.mat-zone { grid-area:zone; }
.mat-damage { grid-area:damage; }
.mat-units { grid-area:units; border-top:2px solid #42c6c9; }
.mat-deck { grid-area:deck; }
.mat-discard { grid-area:discard; }
.mat-hand-count { grid-area:count; color:#9bbbc8; text-align:center; margin:0; font-size:11px; }
.battle-mat .slot-row,.battle-mat .board-row,#view-game .battle-mat .slot-row,#view-game .battle-mat .board-row { min-height:166px; flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; padding:10px 3px; gap:10px; align-items:stretch; scrollbar-color:#38878e #0c2436; }
.battle-mat .slot-empty { color:#92b7c4; align-self:center; margin:auto; font-size:12px; }
.battle-mat .tcg-card,#view-game .battle-mat .tcg-card { width:124px; color:var(--navy); }
.battle-mat .tcg-card-art,#view-game .battle-mat .tcg-card-art { height:42px; }
.battle-mat .tcg-card-name { font-size:12px; }
.battle-mat .tcg-card-body,#view-game .battle-mat .tcg-card-body { padding:8px; gap:5px; font-size:11px; }
.battle-mat .tcg-card-flavor { display:none; }
.battle-mat .tcg-attack-line { font-size:11px; }
.battle-mat .base-card { width:100%; min-height:92px; padding:12px; background:linear-gradient(120deg,#133b4d,#0a293d); border-color:#5ecbd3; border-left-width:3px; box-shadow:0 0 22px #32ccd02b; }
.battle-mat .base-card .base-name,.battle-mat .base-card .base-stats b { color:#edfaff; }
.battle-mat .base-card .base-stats { color:#bed9e4; }
.battle-mat .base-card .base-production,.battle-mat .base-card.protected::after { color:#6bd9cd; }
.battle-mat .zone-slot { width:100%; min-height:154px; background:repeating-linear-gradient(135deg,#15506225 0 1px,transparent 1px 12px); border:1px dashed #4e8799; color:#b4cdd8; font-size:11px; }
.battle-mat .zone-name { color:#6ad8d3; }
.battle-mat .mini-stat-chip { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:154px; min-width:0; border:1px solid #527f92; background:linear-gradient(145deg,#20485c,#0b2235); box-shadow:3px 3px #102d40,5px 5px #477485; color:#aecbd8; }
.battle-mat .mini-stat-chip b { font-size:30px; color:#daeff6; }
.battle-mat .discard-stack { border-style:dashed; background:#0b2333; box-shadow:none; }
.damage-pool { display:flex; flex-direction:column; align-items:center; gap:14px; color:#a9c2cf; font-size:10px; text-align:center; }
.damage-tokens { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; padding:15px 0; }
.damage-tokens span { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:radial-gradient(circle at 35% 25%,#e48577,#963d49 75%); border:2px solid #ffc3a3; color:#fff; font-weight:800; box-shadow:2px 4px 0 #4b2431; }
.battle-mat .silo,#view-game .battle-mat .silo { grid-area:silo; width:100%; padding:12px 7px; display:flex; flex-direction:column; background:#0b2534dc; border-color:#497f92; }
.battle-mat .silo-scale,#view-game .battle-mat .silo-scale { height:auto; min-height:350px; flex:1; }
.battle-mat .silo-title,.battle-mat .silo-numbers,.battle-mat .silo-column-caption,.battle-mat .silo-legend { color:#b2cfda; }
.battle-mat .silo-gauge { background:#061a26; border-color:#365e70; width:22px; margin:0 4px; }
.battle-mat .silo-gauge.resource .silo-gauge-fill { background:#39b4bf80; }
.battle-mat .silo-gauge.ram .silo-gauge-fill { background:#dba75080; }
.battle-mat .silo-marker { border-color:#d3e5e9; }
.battle-mat .silo-ram-bonus-band { background:#9565bb40; }
.hand-row,#view-game .hand-row { flex-wrap:nowrap; overflow-x:auto; overflow-y:auto; align-items:stretch; padding:15px 4px 18px; gap:12px; scrollbar-color:#5b9aa4 #e4edf2; scrollbar-width:auto; }
.hand-row .tcg-card,#view-game .hand-row .tcg-card { width:164px; flex:0 0 164px; scroll-snap-align:start; }
.hand-unplayable { filter:saturate(.25); opacity:.64; cursor:not-allowed; box-shadow:none; }
.hand-unplayable:hover { transform:none; }
.hand-playable { box-shadow:0 0 0 1px #50a9a45c,0 4px 12px #112c431c; }
.hand-unavailable-label { border-top:1px solid #d4dde3; background:#eaf0f4; color:#465c6e; text-align:center; font-size:10px; padding:6px; border-radius:0 0 8px 8px; }
.hand-playable + .hand-unplayable { margin-left:18px; }
#match-log { display:block; max-height:440px; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; scrollbar-color:#6b9aa9 #edf3f6; padding-right:10px; }
.match-timeline { min-height:0; }
#log-list { max-height:360px; overflow-y:auto; scrollbar-gutter:stable; }
#log-list .timeline-entry { padding-bottom:14px; }
@media(max-width:1650px) {
  #view-game { grid-template-columns:minmax(0,1fr); }
  .match-timeline { grid-column:1; grid-row:auto; position:static; order:6; }
}
@media(max-width:700px) {
  body.debug-page,body[data-view="game"] { padding-left:0; }
  .debug-page .app-sidebar,body[data-view="game"] .app-sidebar { width:auto; padding:15px 18px; }
  main#board,#view-game { padding:16px 10px; }
  #opponent-panel,#own-panel,.player-panel { padding:12px; }
  .mat-scroll { padding-bottom:7px; }
  #match-log { max-height:320px; }
}

.empty-upgrade-slot { flex:0 0 124px; min-height:150px; display:grid; place-items:center; border:1px dashed #427080; border-radius:8px; background:linear-gradient(140deg,#21495728,#09223480); color:#668e9d; font-size:11px; letter-spacing:1px; }