/* ============================================================
   Arena AI — fast playtest / live state builder
   ============================================================ */
#ai-arena-launch {
  border-color: rgba(94,234,212,.36);
  background: rgba(20,184,166,.10);
  color: #d8fff8;
}

.ai-arena-drawer {
  position: fixed;
  z-index: 1300;
  top: max(8px, env(safe-area-inset-top));
  right: max(8px, env(safe-area-inset-right));
  bottom: max(8px, env(safe-area-inset-bottom));
  width: min(440px, calc(100vw - 16px));
  display: none;
  flex-direction: column;
  overflow: hidden;
  color: #eefaf7;
  background: rgba(8, 27, 24, .985);
  border: 1px solid rgba(94,234,212,.34);
  border-radius: 14px;
  box-shadow: 0 24px 70px rgba(0,0,0,.52);
  backdrop-filter: blur(16px);
}
.ai-arena-drawer.is-open { display:flex; }
.ai-arena-drawer *, .ai-arena-drawer *::before, .ai-arena-drawer *::after { box-sizing:border-box; }
.ai-arena-head {
  display:flex; align-items:center; gap:10px; padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.10); background:#0b312b;
}
.ai-arena-head h2 { margin:0; font-size:1rem; color:#f3fffc; flex:1; }
.ai-arena-head .arena-live-dot { width:8px; height:8px; border-radius:50%; background:#34d399; box-shadow:0 0 0 4px rgba(52,211,153,.12); }
.ai-arena-head button { min-height:34px; }
.ai-arena-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:8px; border-bottom:1px solid rgba(255,255,255,.08); }
.ai-arena-tabs button { min-height:38px; font-weight:800; color:#bcd7d0; background:#102d28; border:1px solid rgba(255,255,255,.09); }
.ai-arena-tabs button.is-active { color:#06231d; background:#7ee7d3; border-color:#99f6e4; }
.ai-arena-body { overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:10px 10px 80px; flex:1; }
.ai-arena-tab { display:none; }
.ai-arena-tab.is-active { display:block; }
.ai-arena-card { margin:0 0 10px; padding:10px; border:1px solid rgba(255,255,255,.10); border-radius:10px; background:#0d2521; }
.ai-arena-card h3 { margin:0 0 8px; font-size:.86rem; color:#9ff6e5; letter-spacing:.01em; }
.ai-arena-card p { margin:5px 0; }
.ai-arena-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ai-arena-grid.one { grid-template-columns:1fr; }
.ai-arena-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.ai-arena-drawer label { display:flex; flex-direction:column; gap:4px; min-width:0; font-size:.72rem; font-weight:750; color:#a9c8c1; }
.ai-arena-drawer input, .ai-arena-drawer select, .ai-arena-drawer textarea {
  width:100%; min-width:0; color:#f4fffc; background:#061c18; border:1px solid #31534c; border-radius:6px; padding:7px 8px; font:inherit; color-scheme:dark;
}
.ai-arena-drawer textarea { resize:vertical; line-height:1.3; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.72rem; }
.ai-arena-drawer input:focus, .ai-arena-drawer select:focus, .ai-arena-drawer textarea:focus { outline:2px solid rgba(94,234,212,.35); border-color:#5eead4; }
.ai-arena-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.ai-arena-actions button, .ai-arena-btn {
  min-height:36px; padding:7px 10px; border-radius:7px; border:1px solid rgba(255,255,255,.13); background:#183832; color:#eafffa; font-weight:800;
}
.ai-arena-actions button.primary, .ai-arena-btn.primary { background:#15967f; border-color:#36cfb5; color:white; }
.ai-arena-actions button.warn { background:#593817; border-color:#a66c2b; color:#ffe7b7; }
.ai-arena-actions button.danger { background:#542127; border-color:#9a3f49; color:#ffd8dd; }
.ai-arena-mini { font-size:.68rem; color:#85a69e; }
.ai-arena-status { margin-top:8px; min-height:18px; padding:6px 8px; border-radius:6px; background:#071c18; color:#a7e4d8; font-size:.72rem; white-space:pre-wrap; }
.ai-arena-player-row { display:grid; grid-template-columns:46px minmax(0,1.5fr) minmax(0,1fr); gap:6px; align-items:end; margin-bottom:7px; padding:7px; background:#0a1f1b; border-radius:7px; border:1px solid rgba(255,255,255,.06); }
.ai-arena-player-row > strong { align-self:center; font-size:.78rem; }
.ai-arena-live-player { display:grid; grid-template-columns:38px minmax(0,1.5fr) minmax(0,1fr); gap:6px; align-items:end; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.06); }
.ai-arena-live-player:last-child { border-bottom:0; }
.ai-arena-live-player .wide { grid-column:2 / -1; }
.ai-arena-build-toggle { display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; }
.ai-arena-build-state { font-weight:900; color:#b7d0ca; }
.ai-arena-build-state.on { color:#6ee7b7; }
.ai-arena-toolgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.ai-arena-toolgrid button { min-height:44px; padding:5px; font-size:.72rem; color:#d9efea; background:#102a25; border:1px solid rgba(255,255,255,.10); }
.ai-arena-toolgrid button.is-active { background:#1e7667; border-color:#5eead4; color:white; box-shadow:0 0 0 2px rgba(94,234,212,.10) inset; }
.ai-arena-selection { padding:8px; border-radius:8px; background:#071d19; border:1px solid rgba(94,234,212,.13); }
.ai-arena-selection-title { display:flex; justify-content:space-between; gap:8px; margin-bottom:8px; color:#eafffa; }
.ai-arena-chip { display:inline-flex; align-items:center; padding:2px 6px; border-radius:999px; background:#163c34; color:#aef2e5; font-size:.65rem; }
.ai-arena-unit-empty { color:#759a91; font-size:.72rem; padding:4px 0; }
body.ai-arena-build #board { cursor:crosshair !important; touch-action:none; }
body.ai-arena-build #board-wrap { box-shadow:0 0 0 2px rgba(94,234,212,.28) inset; }
body.ai-arena-build #touch-hint::after { content:' · BUILD ativo: toque no mapa para editar'; color:#5eead4; font-weight:800; }
.ai-arena-footer {
  position:absolute; left:0; right:0; bottom:0; display:flex; gap:6px; padding:8px 10px calc(8px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.10); background:rgba(7,26,22,.98);
}
.ai-arena-footer button { flex:1; min-height:38px; }
.ai-arena-raw { min-height:240px; }
.ai-arena-snapshot-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; }
.ai-arena-divider { height:1px; background:rgba(255,255,255,.08); margin:9px 0; }
.ai-arena-kv { display:grid; grid-template-columns:110px 1fr; gap:4px 8px; font-size:.7rem; }
.ai-arena-kv b { color:#8cb4aa; }
.ai-arena-kv span { color:#e8f8f4; word-break:break-word; }

@media (max-width: 700px) {
  .ai-arena-drawer { inset:0; width:100vw; height:100dvh; max-width:none; border-radius:0; border:0; }
  .ai-arena-grid, .ai-arena-grid.three { grid-template-columns:1fr 1fr; }
  .ai-arena-player-row { grid-template-columns:38px 1fr; }
  .ai-arena-player-row label:last-child { grid-column:2; }
  .ai-arena-live-player { grid-template-columns:32px 1fr; }
  .ai-arena-live-player label:nth-of-type(2) { grid-column:2; }
}

/* v9 — live AI intent / shadow-turn debugger */
.ai-arena-tabs { grid-template-columns:repeat(4,1fr); }
.ai-intent-switch { flex-direction:row !important; align-items:center; justify-content:flex-end; gap:6px !important; }
.ai-intent-switch input { width:auto !important; }
.ai-intent-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 10px; font-size:.7rem; color:#b7d6cf; }
.ai-intent-legend span { display:flex; gap:6px; align-items:center; }
.ai-intent-legend b { min-width:26px; text-align:center; color:#fff; background:#163c34; border-radius:5px; padding:2px 4px; }
.ai-intent-decisions { display:grid; gap:4px; margin-top:8px; max-height:260px; overflow:auto; }
.ai-intent-decision { padding:5px 7px; border-radius:6px; background:#071d19; border:1px solid rgba(255,255,255,.055); color:#dcece8; font:600 .69rem/1.35 ui-monospace,SFMono-Regular,Consolas,monospace; }
.ai-intent-overlay { position:absolute; pointer-events:none; z-index:70; display:none; image-rendering:auto; }
.ai-intent-hud { position:absolute; pointer-events:none; z-index:71; display:none; padding:5px 8px; border-radius:7px; border:1px solid rgba(255,255,255,.18); background:rgba(5,13,17,.82); color:#f3fbff; font:800 11px/1.25 system-ui,sans-serif; text-shadow:0 1px 2px #000; box-shadow:0 4px 16px rgba(0,0,0,.24); white-space:normal; }
body.ai-arena-build .ai-intent-overlay { opacity:.92; }
@media (max-width:700px){
  .ai-arena-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .ai-arena-tabs button { padding:5px 3px; font-size:.68rem; }
  .ai-intent-legend { grid-template-columns:1fr; }
  .ai-intent-hud { font-size:10px; }
}
.ai-intent-options { display:grid; gap:6px; align-content:end; }
.ai-intent-options label { flex-direction:row !important; align-items:center; gap:6px !important; }
.ai-intent-options input { width:auto !important; }