:root {
  --bg:#07101b;
  --panel:#0b1522;
  --panel-deep:#08111b;
  --line:#213a59;
  --line-strong:#315b88;
  --text:#eef6ff;
  --muted:#a9bed4;
  --accent:#ffd166;
  --player:#6fd3ff;
  --boss:#ff7d7d;
  --good:#64d892;
  --warn:#f0b35a;
  --danger:#ff7b7b;
  --high:#d6b16a;
  --threat:#2d1820;
}

* { box-sizing:border-box; }
html, body {
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden;
  background:var(--bg);
  color:var(--text);
  font-family:Consolas, Monaco, "Courier New", monospace;
}
body { padding:4px; font-size:12px; }
[hidden] { display:none !important; }
pre { margin:0; white-space:pre-wrap; word-break:break-word; }
button {
  font:inherit;
  color:var(--text);
  background:#102035;
  border:1px solid var(--line-strong);
  border-radius:11px;
  padding:8px 12px;
  cursor:pointer;
}
button:hover { border-color:#70a1db; }
button:disabled { opacity:.5; cursor:not-allowed; }

.mobileTabs { display:none; }
.gameShell {
  display:grid;
  grid-template-columns:minmax(690px, 1.12fr) minmax(540px, .88fr);
  gap:8px;
  width:100%;
  height:calc(100vh - 8px);
  min-height:0;
}
.col { min-height:0; display:grid; gap:8px; }
.battleCol { grid-template-rows:50px 246px 42px minmax(0, 1fr); }
.choiceCol { grid-template-rows:minmax(0, 1fr) 104px; }
.panel {
  min-height:0;
  overflow:hidden;
  padding:8px;
  border:1px solid var(--line);
  border-radius:15px;
  background:linear-gradient(180deg, var(--panel), var(--panel-deep));
}

/* Barra superior */
.topbar { display:grid; grid-template-rows:min-content min-content; gap:4px; }
.topbarMain { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.btns { display:flex; flex-wrap:wrap; gap:8px; }
.movementHelp {
  max-width:265px;
  overflow:hidden;
  color:var(--muted);
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.queue {
  min-height:18px;
  max-height:18px;
  overflow:hidden;
  padding:0 2px;
  color:var(--text);
  font-size:11px;
}

/* Arena */
.arenaPanel {
  display:grid;
  grid-template-columns:252px minmax(0, 1fr);
  gap:9px;
  height:246px;
  align-items:start;
}
.arenaGrid {
  --grid-size:5;
  display:grid;
  grid-template-columns:repeat(var(--grid-size), minmax(0,1fr));
  grid-template-rows:repeat(var(--grid-size), minmax(0,1fr));
  gap:4px;
  width:240px;
  height:240px;
  justify-self:center;
  align-self:center;
  padding:4px;
  overflow:hidden;
  border:1px solid #2a4566;
  border-radius:14px;
  background:radial-gradient(circle at center,#152234,#081019 75%);
}
.arenaCell {
  position:relative;
  display:flex;
  min-width:0;
  min-height:0;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid #26415e;
  border-radius:7px;
  background:linear-gradient(145deg,#132130,#0c141f);
}
.arenaCell.high { box-shadow:inset 0 0 0 2px rgba(214,177,106,.35); }
.arenaCell.threat { background:linear-gradient(145deg,var(--threat),#101721); }
.arenaCell.hazard,
.arenaCell.danger { box-shadow:inset 0 0 0 2px rgba(240,179,90,.42); }
.arenaCell.blocked { background:#232a33; }
.arenaCell.bomb { box-shadow:inset 0 0 16px rgba(255,190,70,.35); }
.arenaCell.voidMark { box-shadow:inset 0 0 16px rgba(170,90,255,.38); }
.arenaCell.tile-cracked { background:linear-gradient(145deg,#241f29,#101721); }
.arenaCell.tile-rubble { background:linear-gradient(145deg,#2f333a,#131820); }
.arenaCell.tile-execution_line { background:linear-gradient(90deg,rgba(184,35,43,.28),#111721 50%,rgba(184,35,43,.28)); }
.arenaCell.tile-web { background:radial-gradient(circle,rgba(213,224,235,.15),#101721 70%); }
.arenaCell.tile-crater { background:radial-gradient(circle at center,#05070b 0 28%,#292229 31%,#111721 73%); }
.arenaCell.tile-artillery_shelter { background:radial-gradient(circle at center,#080b10 0 34%,#3b3427 37%,#111721 74%); }
.arenaCell.artilleryProjection { box-shadow:inset 0 -2px 0 rgba(255,184,76,.42); }
.arenaCell.selectedTarget {
  outline:3px solid var(--accent);
  outline-offset:-3px;
  box-shadow:inset 0 0 0 2px rgba(255,209,102,.45), 0 0 12px rgba(255,209,102,.35);
}
.entity {
  z-index:2;
  display:flex;
  width:32px;
  height:32px;
  align-items:center;
  justify-content:center;
  border:2px solid currentColor;
  border-radius:50%;
  background:#0b1118;
  font-size:17px;
  font-weight:900;
}
.playerEntity { color:var(--player); box-shadow:0 0 13px rgba(103,213,255,.3); }
.bossEntity { color:var(--boss); box-shadow:0 0 13px rgba(255,122,122,.3); }
.entity.minion { width:25px; height:25px; color:#e7e0cf; font-size:13px; }
.entityBadges { position:absolute; z-index:3; top:3px; right:3px; font-size:10px; letter-spacing:-2px; }
.terrainMark { position:absolute; z-index:1; top:3px; left:4px; color:var(--high); font-size:11px; }
.arenaStructureIcon { top:3px; left:auto; right:4px; color:#d8b56f; font-size:13px; }
.arenaTileIcon, .executionIcon, .webIcon, .craterIcon { top:auto; bottom:3px; left:4px; }
.voidMarkIcon { top:auto; bottom:3px; left:auto; right:4px; }
.hazardMark { color:var(--warn); }
.executionIcon { left:50%; transform:translateX(-50%); color:#ff6670; }
.artilleryProjectionIcon { top:50%; left:2px; right:2px; transform:translateY(-50%); color:#ffc261; opacity:.72; }
.webIcon { color:#d7e4f2; }
.craterIcon { color:#9a8290; }
.voidMarkIcon { color:#c889ff; text-shadow:0 0 8px rgba(190,108,255,.75); }
.coord { position:absolute; right:3px; bottom:2px; color:#6f8197; font-size:7px; opacity:.65; }

/* HUD lateral */
.arenaSide {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  grid-auto-rows:min-content;
  gap:7px;
  height:100%;
  align-content:start;
}
.arenaSide > #furyHud,
.arenaSide > #tacticalHint { grid-column:1 / -1; }
.combatHud { display:contents; }
.hudCard {
  padding:7px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0b111b;
}
.hudCard.player { border-color:rgba(103,213,255,.5); }
.hudCard.boss { border-color:rgba(255,122,122,.5); }
.hudHeader { display:flex; justify-content:space-between; gap:7px; margin-bottom:5px; font-size:12px; line-height:1.15; }
.hpTrack { height:9px; overflow:hidden; border-radius:999px; background:#1a2432; }
.hpFill { height:100%; background:linear-gradient(90deg,#42c66b,#d6c84b); transition:width .2s ease; }
.furyFill { background:linear-gradient(90deg,#ff9f43,#ffd166); }
.statusChips { display:flex; flex-wrap:wrap; gap:4px; margin-top:5px; }
.statusChip { padding:2px 5px; border:1px solid #273a55; border-radius:999px; background:#162234; font-size:9px; }
.statusChip.quiet { opacity:.68; }
.tacticalHint {
  min-height:38px;
  max-height:52px;
  overflow:hidden;
  padding:6px 7px;
  border-left:3px solid #d69a3c;
  border-radius:8px;
  background:#111925;
  font-size:9.3px;
  line-height:1.3;
}

/* Legenda em faixa própria */
.legendPanel {
  display:grid;
  grid-template-columns:125px minmax(0,1fr);
  align-items:center;
  gap:8px;
  padding:6px 9px;
}
.legendHeading {
  color:#8eb7e6;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.07em;
  white-space:nowrap;
}
.arenaLegend {
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:3px 7px;
  min-width:0;
  font-size:10.2px;
  line-height:1.15;
}
.legendItem { display:inline-flex; min-width:0; align-items:center; gap:3px; white-space:nowrap; }
.legendItem b { min-width:15px; color:var(--text); text-align:center; }

/* Jornada */
.logPanel { display:flex; flex-direction:column; }
.panelHeader { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:6px; }
.eyebrow { color:#8eb7e6; font-size:10px; letter-spacing:.08em; }
.title { font-size:17px; font-weight:700; }
.compactLegend { display:flex; gap:10px; color:var(--muted); font-size:10px; }
.log {
  flex:1;
  overflow:hidden;
  padding:9px 10px;
  border:1px solid #1d3551;
  border-radius:12px;
  background:#09111a;
  font-size:12.4px;
  line-height:1.28;
}

/* Cartas */
.choicePanel { display:flex; flex-direction:column; }
.ruleBadge { color:#dce9ff; font-size:11px; }
.choiceSummary { min-height:17px; margin-bottom:6px; color:var(--text); font-size:12px; }
.choiceSummary.small { font-size:11px; }
.choicesGrid { display:grid; grid-template-columns:1fr .9fr; gap:8px; }
.choiceSection { min-height:0; }
.sub { display:flex; justify-content:space-between; align-items:center; margin:5px 0 4px; font-size:11.5px; font-weight:700; }
.subHelp { color:var(--muted); font-size:9.5px; font-weight:400; }
.cards { display:flex; flex-direction:column; gap:5px; min-height:0; }
.cardBtn { display:block; width:100%; padding:7px 8px; border:1px solid #274768; border-radius:10px; background:#09121d; text-align:left; }
.cardBtn:hover { border-color:#5f8cc7; }
.cardBtn.selected { border-color:var(--accent); box-shadow:inset 0 0 0 1px rgba(255,209,102,.35); }
.cardTitle { margin-bottom:2px; font-size:10.7px; font-weight:700; }
.cardBody { color:var(--muted); font-size:9.1px; line-height:1.2; }
.hint { padding:7px; border:1px dashed #31435f; border-radius:10px; background:#0b111b; color:#c6d7ea; font-size:9px; }
.reactionSection { margin-top:4px; }
.detailsPanel pre { height:62px; overflow:hidden; padding:6px; border:1px solid #1d3551; border-radius:12px; background:#09111a; font-size:8.6px; line-height:1.18; }
.touchMovePad { display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:5px; }
.touchMovePad button { min-height:36px; padding:7px 0; font-weight:800; }

/* Travessia */
.transitionGrid { grid-template-rows:repeat(6, minmax(0,1fr)); }
.transitionCell { padding:0; color:var(--text); }
.transition-enemy { background:linear-gradient(145deg,rgba(150,42,42,.42),#101721); }
.transition-obstacle { background:linear-gradient(145deg,rgba(190,135,42,.28),#101721); }
.transition-ramp { background:linear-gradient(145deg,rgba(80,145,220,.30),#101721); }
.transition-energy { background:radial-gradient(circle,rgba(255,195,72,.42),#101721 68%); }
.transition-wind_left,
.transition-wind_right { background:linear-gradient(145deg,rgba(95,205,215,.24),#101721); }
.transition-exit { background:radial-gradient(circle,rgba(100,220,145,.40),#101721 70%); animation:exitPulse 1.1s ease-in-out infinite; }
.transitionMark { font-size:15px; font-weight:800; }
.transitionResultGrid { display:flex !important; align-items:center; justify-content:center; }
.transitionResultCard { width:min(270px,100%); padding:16px; border:1px solid #375273; border-radius:14px; background:#0b111b; text-align:center; line-height:1.45; }
.transitionResultCard.success { border-color:rgba(94,220,145,.7); }
.transitionResultCard.hard { border-color:rgba(240,179,90,.75); }
.transitionResultIcon { margin-bottom:8px; font-size:32px; }
@keyframes exitPulse { 0%,100%{box-shadow:inset 0 0 8px rgba(100,220,145,.25)} 50%{box-shadow:inset 0 0 20px rgba(100,220,145,.65)} }

/* História */
body.mode-story .choiceCol,
body.mode-story .arenaPanel,
body.mode-story .legendPanel,
body.mode-story .compactLegend,
body.mode-story .movementHelp,
body.mode-story #queue { display:none !important; }
body.mode-story .gameShell { display:block; height:calc(100vh - 8px); }
body.mode-story .battleCol { display:block; width:min(1060px,100%); height:100%; margin:0 auto; }
body.mode-story .topbar { margin-bottom:8px; }
body.mode-story .logPanel { height:calc(100vh - 68px); }
body.mode-story #log { font-size:14px; line-height:1.62; }
body.mode-story #statusLine { display:none; }

/* Campanha */
body.mode-campaign .arenaPanel,
body.mode-campaign .legendPanel { display:none !important; }
body.mode-campaign .gameShell { grid-template-columns:minmax(390px,.92fr) minmax(650px,1.08fr); }
body.mode-campaign .battleCol { grid-template-rows:52px minmax(0,1fr); }
body.mode-campaign .choiceCol { grid-template-rows:minmax(0,1fr) 104px; }
body.mode-campaign #skillsPanel { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
body.mode-campaign .log { font-size:11.4px; }

@media (max-width:1200px) {
  .gameShell { grid-template-columns:minmax(620px,1fr) minmax(480px,.9fr); }
  .battleCol { grid-template-rows:52px 236px 48px minmax(0,1fr); }
  .arenaPanel { height:236px; grid-template-columns:248px minmax(0,1fr); }
  .arenaGrid { width:228px; height:228px; }
  .arenaLegend { grid-template-columns:repeat(5,minmax(0,1fr)); font-size:8px; }
  .log { font-size:12.2px; }
}

/* Tablet/celular: abas, sem depender de teclado */
@media (max-width:900px) {
  .mobileTabs { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; height:42px; margin-bottom:4px; }
  .mobileTabs button.selected { border-color:var(--accent); color:var(--accent); }
  .gameShell { display:block; height:calc(100vh - 50px); }
  .battleCol,
  .choiceCol { height:100%; }

  body[data-mobile-tab="cards"] .battleCol { display:none !important; }
  body[data-mobile-tab="arena"] .choiceCol,
  body[data-mobile-tab="journey"] .choiceCol { display:none !important; }
  body[data-mobile-tab="cards"] .choiceCol { display:grid !important; grid-template-rows:minmax(0,1fr) 108px; }

  body[data-mobile-tab="arena"] .battleCol { display:grid; grid-template-rows:52px minmax(0,1fr) 60px; }
  body[data-mobile-tab="arena"] .logPanel { display:none !important; }
  body[data-mobile-tab="arena"] .arenaPanel { height:100%; grid-template-columns:minmax(220px,.95fr) minmax(170px,.7fr); }
  body[data-mobile-tab="arena"] .arenaGrid { width:min(57vw,57vh,320px); height:min(57vw,57vh,320px); }
  body[data-mobile-tab="arena"] .legendPanel { display:grid !important; }
  body[data-mobile-tab="arena"] .arenaLegend { grid-template-columns:repeat(4,minmax(0,1fr)); }

  body[data-mobile-tab="journey"] .battleCol { display:grid; grid-template-rows:52px minmax(0,1fr); }
  body[data-mobile-tab="journey"] .arenaPanel,
  body[data-mobile-tab="journey"] .legendPanel { display:none !important; }
  body[data-mobile-tab="journey"] .logPanel { height:100%; }
  body[data-mobile-tab="journey"] .log { font-size:12.5px; line-height:1.5; }

  .choicePanel,
  .detailsPanel pre { overflow:auto; }
}

/* ======================================================
   V15.5.4.16 — Campo de Correção / Visualization Gate
   Objeto → intenção → trajetória → contato → consequência.
   ====================================================== */
.correctionFieldGrid {
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(90deg,rgba(94,80,67,.10),transparent 25% 75%,rgba(94,80,67,.10)),
    linear-gradient(180deg,#222326,#0b0f14) !important;
}
.correctionFieldGrid .arenaCell { z-index:1; overflow:visible; }
.correctionFieldGrid .artilleryRoad {
  background:
    repeating-linear-gradient(90deg,transparent 0 40%,rgba(216,190,117,.52) 41% 48%,transparent 49% 100%),
    linear-gradient(145deg,#3b3b3a,#202328) !important;
  border-color:#77705e !important;
}
.correctionFieldGrid .artilleryRoad::before {
  content:"";
  position:absolute;
  left:46%; top:-3px; bottom:-3px;
  width:8%;
  background:repeating-linear-gradient(180deg,rgba(235,210,139,.85) 0 9px,transparent 9px 17px);
  opacity:.76;
}
.correctionFieldGrid .artilleryEmbankment {
  background:
    radial-gradient(circle at 21% 29%,rgba(156,132,106,.30) 0 3px,transparent 4px),
    radial-gradient(circle at 75% 72%,rgba(129,109,91,.24) 0 4px,transparent 5px),
    linear-gradient(145deg,#292722,#12171b) !important;
  border-color:#4b4941 !important;
}
.correctionFieldGrid .artilleryRoadDamaged {
  background:
    linear-gradient(42deg,transparent 42%,#0b0c0d 43% 49%,#776351 50% 54%,transparent 55%),
    linear-gradient(145deg,#342522,#17191c) !important;
  box-shadow:inset 0 0 0 2px rgba(255,126,92,.65),inset 0 0 18px rgba(160,54,39,.33);
}
.correctionFieldGrid .artilleryRoadDamaged::after {
  content:"ROTA CORTADA";
  position:absolute;
  left:2px; right:2px; bottom:2px;
  z-index:5;
  color:#ffd3c4;
  font-size:6px;
  font-weight:950;
  letter-spacing:.03em;
  text-align:center;
  text-shadow:0 1px 2px #000;
}
.artilleryCorrectionOverlay {
  position:absolute;
  inset:5px;
  z-index:2;
  pointer-events:none;
  overflow:visible;
}
.artilleryCorrectionOverlay svg { display:block; width:100%; height:100%; overflow:visible; }
.artilleryCorrectionOverlay line {
  fill:none;
  stroke:#ff826f;
  stroke-width:.065;
  stroke-linecap:round;
  stroke-dasharray:.18 .13;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 2px rgba(255,85,69,.72));
}
.artilleryCorrectionOverlay line.predictionLine {
  stroke:#ffd267;
  stroke-dasharray:.08 .15;
}
.correctionFieldGrid .spotterVisual,
.correctionFieldGrid .artilleryCrosshair,
.correctionFieldGrid .artilleryCountdown,
.correctionFieldGrid .impactWord,
.correctionFieldGrid .entity,
.correctionFieldGrid .fortressGateVisual { z-index:4 !important; }
.correctionFieldGrid .spotterTracking .spotterVisual {
  border:1px solid rgba(255,130,111,.8);
  border-radius:7px;
  box-shadow:0 0 10px rgba(255,91,73,.38);
}
.markSourceWord,
.markTerrainWord,
.markIntentWord {
  position:absolute;
  z-index:5;
  padding:1px 3px;
  border-radius:3px;
  background:rgba(4,7,10,.82);
  color:#f7f4eb;
  font-size:6px;
  font-weight:950;
  letter-spacing:.04em;
  line-height:1.25;
  text-shadow:0 1px 2px #000;
}
.markSourceWord { top:2px; right:2px; color:#ffb4a7; }
.markTerrainWord { bottom:2px; left:2px; color:#d6d0b7; }
.markIntentWord { top:2px; left:2px; color:#ffe08a; }
.objectiveSafe { border-color:#75d79a !important; color:#b9f2ca !important; }
.objectiveRisk { border-color:#ff9b77 !important; color:#ffd0c0 !important; }

@media (max-width:900px) {
  .artilleryCorrectionOverlay { inset:4px; }
  .correctionFieldGrid .artilleryRoadDamaged::after,
  .markSourceWord,.markTerrainWord,.markIntentWord { font-size:5px; padding:1px 2px; }
}

/* V16: leitura sem corte e legenda ativa */
.logPanel .panelHeader{margin-bottom:4px}
.log{padding:7px 9px}
.legendPanel{min-height:42px}
.legendItem{white-space:normal;line-height:1.12}
body.mode-battle .log{font-size:12.4px!important;line-height:1.28!important}
@media (max-height:720px){
  .battleCol{grid-template-rows:48px 232px 40px minmax(0,1fr)}
  .arenaPanel{height:232px;grid-template-columns:236px minmax(0,1fr)}
  .arenaGrid{width:226px;height:226px}
  .log{font-size:11.4px!important;line-height:1.24!important}
  .arenaLegend{font-size:9.4px}
}


/* ======================================================
   V17 — Leitura da Jornada com Lyra
   ====================================================== */
.journeyForm {
  display: grid;
  gap: 10px;
}

.journeyQuestion {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid #294d72;
  border-radius: 12px;
  background:
    linear-gradient(145deg, rgba(74, 124, 181, .10), transparent 55%),
    #09121d;
}

.journeyQuestionTitle {
  font-size: 12px;
  font-weight: 800;
  color: #f2f7ff;
}

.lyraPrompt {
  padding-left: 8px;
  border-left: 3px solid #b58cff;
  color: #d9caff;
  font-size: 10px;
  line-height: 1.38;
}

.journeyInput {
  width: 100%;
  min-height: 38px;
  resize: vertical;
  padding: 9px 10px;
  border: 1px solid #355d88;
  border-radius: 9px;
  outline: none;
  color: #eef6ff;
  background: #07101a;
  font: inherit;
  font-size: 11px;
  line-height: 1.4;
}

.journeyInput:focus {
  border-color: #c29bff;
  box-shadow: 0 0 0 2px rgba(194, 155, 255, .16);
}

.optionalNote {
  color: #8fa6bd;
  font-size: 8.5px;
}

body.mode-campaign .journeyForm {
  grid-template-columns: 1fr;
}

body.mode-campaign:has(.journeyForm) .gameShell {
  grid-template-columns: minmax(390px, .8fr) minmax(650px, 1.2fr);
}

body.mode-campaign:has(.journeyForm) #skillsPanel {
  display: block;
}

body.mode-campaign:has(.journeyForm) .choicePanel {
  overflow: auto;
}

@media (max-width: 900px) {
  .journeyQuestionTitle { font-size: 14px; }
  .lyraPrompt { font-size: 12px; }
  .journeyInput { font-size: 14px; }
  .optionalNote { font-size: 10px; }
}


/* ======================================================
   V18.3 — prévia azul de Skill, Equip e movimento
   ====================================================== */
.arenaCell.playerAttackPreview {
  box-shadow:
    inset 0 0 0 2px rgba(78, 169, 255, .78),
    inset 0 0 18px rgba(42, 126, 218, .24);
}

.arenaCell.playerStrongPreview {
  box-shadow:
    inset 0 0 0 3px rgba(99, 194, 255, .96),
    inset 0 0 24px rgba(54, 153, 255, .34),
    0 0 8px rgba(54, 153, 255, .22);
}

.arenaCell.playerMovePreview {
  outline: 2px dashed rgba(111, 221, 255, .86);
  outline-offset: -4px;
  background-image:
    linear-gradient(145deg, rgba(50, 164, 215, .15), rgba(17, 33, 48, .04));
}

.arenaCell.playerTargetPreview {
  animation: playerTargetPulse 1.05s ease-in-out infinite;
}

.arenaCell.threat.playerAttackPreview,
.arenaCell.threat.playerStrongPreview {
  background:
    linear-gradient(145deg, rgba(73, 124, 205, .25), rgba(107, 35, 56, .34)),
    #101721;
}

.arenaCell.previewClickable {
  cursor: pointer;
}

.arenaCell.previewClickable:hover {
  filter: brightness(1.18);
  border-color: #8bdcff;
}

@keyframes playerTargetPulse {
  0%, 100% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(1.32);
  }
}


/* V18.4 — identidades próprias das travessias */
.transition-switch{background:radial-gradient(circle,rgba(255,205,90,.35),#101721 70%)}
.transition-track_left,.transition-track_right{background:linear-gradient(145deg,rgba(135,170,210,.28),#101721)}
.transition-spider{background:linear-gradient(145deg,rgba(95,55,110,.45),#101721)}
.transition-web{background:radial-gradient(circle,rgba(220,235,245,.25),#101721 72%)}
.transition-anchor{background:linear-gradient(145deg,rgba(165,105,190,.42),#101721);box-shadow:inset 0 0 0 2px rgba(215,170,235,.25)}
.transition-cocoon{background:radial-gradient(circle,rgba(230,230,210,.38),#101721 70%)}
.transition-silk_left,.transition-silk_right{background:linear-gradient(145deg,rgba(185,215,230,.22),#101721)}
.transition-echo_abominado{background:linear-gradient(145deg,rgba(160,95,65,.42),#101721)}
.transition-echo_executor{background:linear-gradient(145deg,rgba(180,50,65,.38),#101721)}
.transition-echo_veu{background:linear-gradient(145deg,rgba(120,75,155,.42),#101721)}
.transition-echo_artillery{background:linear-gradient(145deg,rgba(75,115,165,.42),#101721)}
.transition-void_wall{background:radial-gradient(circle,rgba(150,80,210,.35),#0b0d15 72%)}


/* V18.5 — leitura linear da jornada */
body.mode-story #log {
  font-size: 14.5px;
  line-height: 1.68;
}
body.mode-story .battleCol {
  width: min(1120px, 100%);
}


/* V18.6 — leitura contínua por cenas completas */
body.mode-story #log {
  font-size: 14.4px;
  line-height: 1.68;
  padding: 16px 18px;
}
body.mode-story .logPanel {
  max-width: 1060px;
  margin: 0 auto;
}


/* ======================================================
   V18.8 — celular em fluxo único: arena, setas, jornada e cartas
   ====================================================== */
.mobileMoveDock { display:none; }

@media (max-width:900px) {
  html, body {
    height:auto !important;
    min-height:100%;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  body {
    padding:6px;
    font-size:14px;
  }

  .mobileTabs {
    display:none !important;
  }

  .gameShell,
  body[data-mobile-tab="arena"] .gameShell,
  body[data-mobile-tab="cards"] .gameShell,
  body[data-mobile-tab="journey"] .gameShell {
    display:flex !important;
    flex-direction:column;
    gap:8px;
    width:100%;
    height:auto !important;
    min-height:0;
  }

  .battleCol,
  .choiceCol,
  body[data-mobile-tab="arena"] .battleCol,
  body[data-mobile-tab="cards"] .battleCol,
  body[data-mobile-tab="journey"] .battleCol,
  body[data-mobile-tab="arena"] .choiceCol,
  body[data-mobile-tab="cards"] .choiceCol,
  body[data-mobile-tab="journey"] .choiceCol {
    display:flex !important;
    flex-direction:column;
    width:100%;
    height:auto !important;
    min-height:0;
    gap:8px;
  }

  .topbar {
    order:1;
    min-height:64px;
    height:auto;
  }

  .topbarMain {
    align-items:flex-start;
  }

  .movementHelp,
  #queue {
    display:none !important;
  }

  .arenaPanel,
  body[data-mobile-tab="arena"] .arenaPanel,
  body[data-mobile-tab="journey"] .arenaPanel {
    order:2;
    display:grid !important;
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "player boss"
      "fury fury"
      "grid grid"
      "hint hint";
    width:100%;
    height:auto !important;
    padding:8px;
    gap:7px;
    align-items:start;
  }

  .arenaPanel[hidden] { display:none !important; }

  .arenaGrid,
  body[data-mobile-tab="arena"] .arenaGrid {
    grid-area:grid;
    width:min(94vw, 420px) !important;
    height:min(94vw, 420px) !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:420px !important;
    max-height:420px !important;
    justify-self:center;
    margin:2px auto 0;
    gap:4px;
    padding:5px;
  }

  .arenaSide {
    display:contents !important;
  }

  #playerHud { grid-area:player; }
  #bossHud { grid-area:boss; }
  #furyHud { grid-area:fury; }
  #tacticalHint {
    grid-area:hint;
    min-height:0;
    max-height:none;
    font-size:12px;
    line-height:1.35;
  }

  .hudHeader { font-size:13px; }
  .statusChip { font-size:11px; }
  .entity { width:38px; height:38px; font-size:20px; }
  .coord { font-size:8px; }

  .mobileMoveDock {
    order:3;
    display:block;
    padding:8px;
  }
  .mobileMoveDock[hidden] { display:none !important; }
  .mobileMoveLabel {
    margin-bottom:6px;
    color:#9fc5ee;
    font-size:11px;
    letter-spacing:.06em;
  }
  .mobileMoveButtons {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:5px;
  }
  .mobileMoveButtons button {
    min-height:52px;
    padding:8px 2px;
    font-size:19px;
    font-weight:800;
  }
  .mobileMoveButtons [data-mobile-stop] {
    font-size:12px;
  }

  .legendPanel,
  body[data-mobile-tab="arena"] .legendPanel,
  body[data-mobile-tab="journey"] .legendPanel {
    order:4;
    display:grid !important;
    min-height:0;
    padding:7px;
  }
  .legendPanel[hidden] { display:none !important; }
  .arenaLegend,
  body[data-mobile-tab="arena"] .arenaLegend {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 8px;
    font-size:10px;
  }

  .logPanel,
  body[data-mobile-tab="arena"] .logPanel,
  body[data-mobile-tab="journey"] .logPanel {
    order:5;
    display:flex !important;
    height:auto !important;
    min-height:310px;
  }
  .log {
    min-height:250px;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    font-size:14px !important;
    line-height:1.5 !important;
  }
  .panelHeader .title { font-size:20px; }
  .compactLegend { display:none; }

  .choiceCol { order:2; }
  .choicePanel {
    height:auto !important;
    overflow:visible !important;
  }
  .choicesGrid {
    grid-template-columns:1fr;
    gap:8px;
  }
  .cardBtn { padding:10px; }
  .cardTitle { font-size:14px; }
  .cardBody { font-size:12px; line-height:1.35; }
  .sub { font-size:13px; }
  .detailsPanel { height:auto !important; min-height:160px; }
  .detailsPanel pre {
    height:auto !important;
    min-height:110px;
    max-height:none !important;
    overflow:visible !important;
    font-size:11px;
  }

  /* O dock abaixo da arena é o único controle de movimento no celular. */
  .choiceCol .touchMovePad { display:none !important; }

  body.mode-story .gameShell,
  body.mode-campaign .gameShell {
    display:block !important;
  }
  body.mode-story .battleCol,
  body.mode-campaign .battleCol {
    display:block !important;
  }
  body.mode-story .choiceCol { display:none !important; }
  body.mode-story .logPanel { min-height:calc(100vh - 90px); }
}


/* ======================================================
   V18.9 — texto sem arena, ações após a Jornada e leitura móvel segura
   ====================================================== */
@media (max-width:900px) {
  /* No celular, a sequência é arena → movimento → legenda → Jornada → ações → cartas. */
  .arenaPanel { order:1; }
  .mobileMoveDock { order:2; }
  .legendPanel { order:3; }
  .logPanel { order:4; }
  .topbar { order:5; margin:0; }

  .topbar .btns {
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);
    width:100%;
    gap:6px;
  }
  .topbar .btns button {
    min-height:50px;
    padding:8px 6px;
    font-size:14px;
  }

  /* Telas exclusivamente narrativas não reservam espaço para arena ou legenda. */
  body.mode-story .arenaPanel,
  body.mode-story .mobileMoveDock,
  body.mode-story .legendPanel,
  body.mode-campaign .arenaPanel,
  body.mode-campaign .mobileMoveDock,
  body.mode-campaign .legendPanel {
    display:none !important;
  }

  body.mode-story .battleCol,
  body.mode-campaign .battleCol {
    display:flex !important;
    flex-direction:column;
    gap:8px;
  }

  body.mode-story .logPanel,
  body.mode-campaign .logPanel {
    order:1;
    min-height:0;
    height:auto !important;
  }

  body.mode-story .topbar,
  body.mode-campaign .topbar {
    order:2;
  }

  body.mode-story #btnClearQueue {
    display:none;
  }

  body.mode-story .topbar .btns {
    grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
  }

  body.mode-story #log {
    min-height:0;
    padding:18px 16px 22px;
    font-size:16px !important;
    line-height:1.62 !important;
  }

  /* A tela de vitória e outras telas sem showGrid não deixam a arena antiga reaparecer. */
  .arenaPanel[hidden],
  .legendPanel[hidden],
  .mobileMoveDock[hidden] {
    display:none !important;
  }
}


/* ======================================================
   V18.10 — resultado da travessia legível no celular
   ====================================================== */
@media (max-width:900px) {
  .arenaPanel.transitionResultPanel {
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "player boss"
      "fury fury"
      "grid grid"
      "hint hint";
    height:auto !important;
    overflow:visible !important;
    align-items:start;
  }

  .arenaPanel.transitionResultPanel .transitionResultGrid {
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    padding:0 !important;
    margin:0 !important;
    overflow:visible !important;
    border:0;
    background:none;
  }

  .arenaPanel.transitionResultPanel .transitionResultCard {
    width:100% !important;
    max-width:none !important;
    min-height:0;
    padding:18px 16px 20px;
    text-align:left;
    font-size:16px;
    line-height:1.58;
    overflow:visible;
  }

  .arenaPanel.transitionResultPanel .transitionResultCard strong {
    display:block;
    margin-bottom:12px;
    font-size:19px;
    text-align:center;
  }

  .arenaPanel.transitionResultPanel .transitionResultCard p {
    margin:0 0 14px;
  }

  .arenaPanel.transitionResultPanel .transitionResultIcon {
    text-align:center;
  }

  .arenaPanel.transitionResultPanel #tacticalHint {
    margin-top:0;
  }
}


/* ======================================================
   V18.11 — travessias realmente distintas
   ====================================================== */
.mazeGrid, .artilleryGrid, .circuitGrid {
  grid-template-rows: repeat(7, minmax(0, 1fr));
}
.mazeWall {
  background: linear-gradient(145deg,#26303b,#10151d) !important;
  box-shadow: inset 0 0 0 2px rgba(200,220,235,.16);
}
.mazeWeb {
  background: radial-gradient(circle,rgba(220,235,245,.26),#101721 72%) !important;
}
.artilleryMarked {
  box-shadow: inset 0 0 0 2px rgba(255,112,82,.55), inset 0 0 20px rgba(210,55,42,.22);
}
.artilleryTimer1 { background:linear-gradient(145deg,rgba(178,38,38,.55),#101721) !important; }
.artilleryTimer2 { background:linear-gradient(145deg,rgba(155,83,42,.46),#101721) !important; }
.artilleryTimer3 { background:linear-gradient(145deg,rgba(130,111,48,.35),#101721) !important; }
.artilleryCountdown {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  z-index:1; font-size:22px; font-weight:900; color:#ffd7c7;
}
.artilleryCrater { background:radial-gradient(circle,#05080d 0 26%,#312830 30%,#111721 72%) !important; }
.artilleryGateLocked { background:linear-gradient(145deg,#2d333d,#111721) !important; }
.spiderDirectionButtons { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-top:6px; }
.spiderDirectionButtons button { min-height:42px; font-size:18px; font-weight:800; }

@media (max-width:900px) {
  .mazeGrid, .artilleryGrid, .circuitGrid {
    width:min(94vw, 520px) !important;
    height:min(94vw, 520px) !important;
    max-width:520px !important;
    max-height:520px !important;
    gap:3px !important;
    padding:4px !important;
  }
  .mazeGrid .entity, .artilleryGrid .entity, .circuitGrid .entity {
    width:32px; height:32px; font-size:17px;
  }
  .mazeGrid .transitionMark, .artilleryGrid .transitionMark, .circuitGrid .transitionMark { font-size:13px; }
  .artilleryCountdown { font-size:20px; }
  .mobileMoveButtons [data-transition-action="strike"] { font-size:10px; }
}


/* ======================================================
   V18.12 — identidade visual própria para cada travessia
   A legenda reforça; o grid deve contar a cena sozinho.
   ====================================================== */

/* ---------- Comboio Carmesim / perseguição ferroviária ---------- */
.pursuitGrid {
  grid-template-rows: repeat(7, minmax(0,1fr));
  background:
    linear-gradient(90deg, rgba(68,76,84,.16) 0 14%, transparent 14% 28%, rgba(68,76,84,.16) 28% 42%, transparent 42% 57%, rgba(68,76,84,.16) 57% 71%, transparent 71%),
    linear-gradient(180deg,#15191d,#090d12);
}
.pursuitCell { position:relative; overflow:hidden; }
.pursuitCell.railLane {
  background:
    linear-gradient(90deg, transparent 18%, #69727a 19% 25%, transparent 26% 74%, #69727a 75% 81%, transparent 82%),
    repeating-linear-gradient(180deg, transparent 0 17%, #4d4136 18% 25%, transparent 26% 42%),
    linear-gradient(180deg,#161a1e,#0c1014) !important;
  border-color:#46535e;
}
.pursuitCell.serviceLane {
  background:
    repeating-linear-gradient(135deg,rgba(105,82,52,.09) 0 7px,transparent 7px 16px),
    linear-gradient(145deg,#171d23,#0c1218) !important;
}
.pursuitCell.betweenRails::before {
  content:""; position:absolute; left:0; right:0; top:47%; height:4px;
  background:linear-gradient(90deg,#5e666e 0 36%,transparent 36% 64%,#5e666e 64%);
  opacity:.35;
}
.refineryHorizon::after {
  content:""; position:absolute; left:8%; right:8%; top:4px; height:5px;
  border-top:2px solid rgba(169,52,57,.55); border-bottom:1px solid rgba(169,52,57,.3);
}
.wagonVisual { position:absolute; inset:8% 7%; z-index:1; display:flex; flex-direction:column; justify-content:center; align-items:center; border:2px solid #77818b; border-radius:7px; background:linear-gradient(180deg,#4d555c,#252b31 62%,#171c21); box-shadow:inset 0 0 0 2px rgba(255,255,255,.05),0 4px 10px rgba(0,0,0,.35); }
.wagonCargo { font-size:8px; letter-spacing:.08em; font-weight:900; color:#f0c86d; }
.wagonWheels { position:absolute; bottom:-7px; font-size:9px; letter-spacing:10px; color:#171a1d; }
.escortVisual { position:absolute; inset:7%; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.escortHead { width:16px; height:14px; border:2px solid #d7d2c2; border-radius:50% 50% 35% 35%; background:#2d3238; }
.escortBody { width:24px; height:22px; margin-top:2px; clip-path:polygon(20% 0,80% 0,100% 100%,0 100%); background:#7f2630; border:1px solid #d7d2c2; }
.escortVisual small,.switchVisual small,.railBarrier small,.energyVisual small,.tileWord,.spotterVisual small { margin-top:2px; font-size:7px; font-weight:900; letter-spacing:.05em; color:#f0f5ff; text-shadow:0 1px 2px #000; }
.switchVisual { position:absolute; inset:7%; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; border:1px solid rgba(235,190,75,.55); border-radius:7px; background:linear-gradient(145deg,rgba(154,104,38,.28),rgba(25,24,20,.85)); }
.switchBase { width:28px; height:9px; border-radius:3px; background:#8c6b31; box-shadow:inset 0 0 0 2px #3a2a14; }
.switchLever { width:5px; height:30px; background:#e2c26b; transform:rotate(-28deg); transform-origin:bottom; border-radius:4px; box-shadow:0 0 5px rgba(232,195,92,.35); }
.railBarrier { position:absolute; inset:16% 5%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:repeating-linear-gradient(135deg,#8b2d32 0 7px,#d0c26f 7px 14px); border:2px solid #3b4149; border-radius:5px; }
.railBarrier small { background:#1119; padding:1px 3px; }
.energyVisual { position:absolute; inset:10%; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.energyVisual span { font-size:24px; color:#ffd46f; filter:drop-shadow(0 0 7px rgba(255,210,90,.55)); }
.refineryGate { position:absolute; inset:5%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid #7d343a; border-radius:6px; background:repeating-linear-gradient(90deg,#2c3137 0 6px,#161b20 6px 12px); box-shadow:inset 0 0 16px rgba(161,46,54,.22); }
.refineryGate strong { font-size:8px; color:#ff8f92; }
.refineryGate span { font-size:7px; }
.railJunction { position:absolute; inset:7%; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.railJunction>span { font-size:24px; color:#9fb4c7; }

/* ---------- Labirinto do Véu ---------- */
.mazeGrid { background:linear-gradient(145deg,#0d1714,#07100f); }
.mazeFloor {
  background:
    linear-gradient(90deg,transparent 48%,rgba(104,164,140,.08) 49% 51%,transparent 52%),
    linear-gradient(0deg,transparent 48%,rgba(104,164,140,.06) 49% 51%,transparent 52%),
    linear-gradient(145deg,#15221e,#0b1513) !important;
}
.mazeWall { background:linear-gradient(145deg,#26312d,#101715) !important; border-color:#3b4a44 !important; }
.mazeWall::before,.mazeWall::after { content:""; position:absolute; inset:-10%; background:repeating-linear-gradient(25deg,transparent 0 8px,rgba(214,229,221,.22) 9px 11px,transparent 12px 19px); transform:rotate(8deg); }
.mazeWall::after { transform:rotate(-18deg); opacity:.65; }
.mazeFiberMass { position:absolute; inset:17%; border:2px solid rgba(214,229,221,.20); border-radius:42% 58% 48% 52%; box-shadow:0 0 0 5px rgba(190,216,206,.06),0 0 0 10px rgba(190,216,206,.03); }
.mazeWeb { background:radial-gradient(circle,rgba(219,234,230,.21),#0d1714 72%) !important; }
.mazeWebIcon { font-size:26px; filter:grayscale(.2); }
.spiderVisual { position:absolute; z-index:3; font-size:28px; filter:drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.cocoonVisual { width:22px; height:38px; border-radius:50% 50% 44% 44%; background:repeating-linear-gradient(25deg,#d9ded3 0 3px,#9ca9a0 4px 6px); box-shadow:0 0 8px rgba(220,230,215,.22); }
.mazeExit { background:linear-gradient(180deg,#133629,#0d1915) !important; box-shadow:inset 0 0 18px rgba(91,225,157,.28),0 0 10px rgba(91,225,157,.20); }
.mazeExitArrow { font-size:28px; color:#8ff0b5; }
.tileWord { position:absolute; bottom:3px; left:3px; right:3px; text-align:center; }

/* ---------- Zona de Mira do Cataclismo ---------- */
.artilleryGrid { background:linear-gradient(180deg,#1b1b1d,#0a0e13); }
.artilleryGround {
  background:
    radial-gradient(circle at 18% 25%,rgba(122,105,92,.12) 0 2px,transparent 3px),
    radial-gradient(circle at 75% 70%,rgba(122,105,92,.10) 0 2px,transparent 3px),
    linear-gradient(145deg,#202329,#10141a) !important;
}
.fortressHorizon::before { content:""; position:absolute; left:8%; right:8%; top:4px; height:8px; background:repeating-linear-gradient(90deg,#59616a 0 7px,#22282e 7px 12px); border-bottom:2px solid #7d343a; opacity:.65; }
.artilleryCrosshair { position:absolute; z-index:1; width:72%; aspect-ratio:1; border:3px solid rgba(255,91,73,.82); border-radius:50%; box-shadow:0 0 0 6px rgba(255,91,73,.10),0 0 14px rgba(255,91,73,.28); }
.artilleryCrosshair::before,.artilleryCrosshair::after { content:""; position:absolute; background:rgba(255,91,73,.85); }
.artilleryCrosshair::before { width:2px; height:132%; left:50%; top:-16%; }
.artilleryCrosshair::after { height:2px; width:132%; top:50%; left:-16%; }
.artilleryCountdown { z-index:3 !important; font-size:26px !important; text-shadow:0 2px 5px #000; }
.impactWord { position:absolute; z-index:4; bottom:4px; font-size:7px; font-weight:900; color:#ffd4c9; }
.craterRim { position:absolute; width:72%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,#030508 0 27%,#161014 29% 42%,#4b3e3b 44% 52%,transparent 54%); transform:rotate(-9deg); }
.spotterVisual { position:absolute; inset:6%; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.spotterHead { width:14px; height:14px; border-radius:50%; background:#d8d0b9; border:2px solid #4a3331; }
.spotterAntenna { width:4px; height:28px; margin-top:-2px; background:#8c3a40; box-shadow:8px -8px 0 -1px #d85b60; transform:rotate(-8deg); }
.fortressGate { overflow:visible; }
.fortressGateVisual { position:absolute; inset:4%; display:flex; flex-direction:column; justify-content:center; align-items:center; background:repeating-linear-gradient(90deg,#30363e 0 6px,#171c22 6px 12px); border:2px solid #5d6772; border-bottom-color:#8b2f35; border-radius:5px; }
.fortressGateVisual strong { font-size:7px; color:#ff9094; }
.fortressGateVisual span { font-size:7px; }

/* ---------- Circuito do Centro de Integração ---------- */
.circuitGrid { background:linear-gradient(145deg,#080b12,#111522); }
.circuitFloor {
  background:
    linear-gradient(90deg,transparent 47%,rgba(109,150,204,.18) 48% 52%,transparent 53%),
    linear-gradient(0deg,transparent 47%,rgba(109,150,204,.14) 48% 52%,transparent 53%),
    radial-gradient(circle at center,rgba(135,86,183,.10),transparent 58%),
    #0d1119 !important;
}
.circuitTerminal { border-color:#4b6180 !important; }
.terminalVisual { position:absolute; inset:7%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid #526b8b; border-radius:8px; background:linear-gradient(145deg,#172033,#0b1019); box-shadow:inset 0 0 15px rgba(96,135,188,.12); }
.terminalVisual strong { font-size:8px; letter-spacing:.06em; }
.terminalVisual small { font-size:6.5px; color:#a8bdd8; }
.circuitTerminalActivated .terminalVisual { opacity:.55; border-style:dashed; }
.circuitTerminalActivated .terminalVisual::after { content:"✓"; position:absolute; font-size:26px; color:#9ee0ad; }
.circuitWall { background:#07090e !important; border-color:#282d38 !important; }
.voidPanel { position:absolute; inset:4%; display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.voidPanel span { background:linear-gradient(180deg,#25202e,#08090d); border:1px solid #473952; clip-path:polygon(12% 0,100% 8%,88% 100%,0 92%); }
.circuitCore { border-color:#7a568d !important; }
.coreVisual { position:absolute; inset:5%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid #7d5b91; border-radius:50% 50% 12px 12px; background:radial-gradient(circle at center,rgba(161,99,201,.20),#0a0d14 65%); }
.coreVisual strong { font-size:8px; }
.coreVisual small { font-size:6.5px; color:#c8aed6; }
.circuitCoreLocked .coreVisual { opacity:.6; }

@media (max-width:900px) {
  .pursuitGrid, .mazeGrid, .artilleryGrid, .circuitGrid {
    width:min(94vw,520px) !important;
    height:min(94vw,520px) !important;
    max-width:520px !important;
    max-height:520px !important;
    gap:3px !important;
    padding:4px !important;
  }
  .pursuitGrid .arenaCell, .mazeGrid .arenaCell, .artilleryGrid .arenaCell, .circuitGrid .arenaCell { min-height:0 !important; }
  .wagonCargo,.escortVisual small,.switchVisual small,.railBarrier small,.energyVisual small,.tileWord,.spotterVisual small { font-size:6px; }
  .spiderVisual { font-size:24px; }
  .mazeWebIcon { font-size:22px; }
  .artilleryCountdown { font-size:22px !important; }
  .terminalVisual strong,.coreVisual strong { font-size:7px; }
}


/* ======================================================
   V18.13 — labirintos 11×11 e leitura móvel
   ====================================================== */
.mazeGrid.largeMazeGrid {
  grid-template-rows:repeat(8,minmax(0,1fr));
}
.mazeGrid.largeMazeGrid .arenaCell {
  border-radius:5px;
}
.mazeGrid.largeMazeGrid .entity {
  width:24px; height:24px; font-size:13px; border-width:2px;
}
.mazeGrid.largeMazeGrid .spiderVisual { font-size:18px; }
.mazeGrid.largeMazeGrid .mazeWebIcon { font-size:16px; }
.mazeGrid.largeMazeGrid .cocoonVisual { width:13px; height:22px; }
.mazeGrid.largeMazeGrid .mazeExitArrow { font-size:20px; }
.mazeGrid.largeMazeGrid .tileWord { font-size:5.5px; bottom:1px; }
@media (max-width:900px) {
  .mazeGrid.largeMazeGrid {
    width:min(96vw,540px) !important;
    height:min(92vw,500px) !important;
    gap:2px !important;
    padding:3px !important;
  }
  .mazeGrid.largeMazeGrid .entity { width:22px; height:22px; font-size:12px; }
  .mazeGrid.largeMazeGrid .spiderVisual { font-size:17px; }
  .mazeGrid.largeMazeGrid .mazeWebIcon { font-size:15px; }
}

/* ======================================================
   V18.15 — Comboio Carmesim legível + labirinto 8x11
   ====================================================== */
.pursuitGrid .fixedSwitchCell {
  border-color:#8f6f2f !important;
  box-shadow:inset 0 0 0 2px rgba(224,184,83,.16);
}
.pursuitGrid .fixedSwitchCell.switch-armed {
  border-color:#e4c05b !important;
  box-shadow:inset 0 0 18px rgba(232,191,73,.24),0 0 9px rgba(232,191,73,.16);
}
.pursuitGrid .fixedSwitchCell.switch-done {
  border-color:#5ca574 !important;
  box-shadow:inset 0 0 18px rgba(87,170,112,.20);
}
.pursuitGrid .fixedSwitch {
  z-index:2;
  opacity:.96;
}
.pursuitGrid .fixedSwitch.armed .switchLever {
  transform:rotate(24deg);
  background:#ffe17c;
}
.pursuitGrid .fixedSwitch.done .switchLever {
  transform:rotate(48deg);
  background:#8fd7a2;
}
.pursuitGrid .fixedSwitch.done .switchBase {
  background:#416e4e;
}
.pursuitGrid .railJunctionCell {
  border-color:#67757f !important;
}
.pursuitGrid .railJunctionCell::after {
  content:"";
  position:absolute;
  left:14%; right:14%; bottom:8%; height:3px;
  background:linear-gradient(90deg,#78858f 0 42%,transparent 43% 57%,#78858f 58% 100%);
  transform:rotate(-18deg);
  transform-origin:center;
  opacity:.7;
}
.pursuitGrid .railJunctionCell.junction-armed::after {
  background:#e4c05b;
  box-shadow:0 0 7px rgba(228,192,91,.35);
}
.pursuitGrid .railJunctionCell.junction-done::after {
  background:#7ac08c;
  box-shadow:0 0 7px rgba(122,192,140,.30);
}
.junctionBranch {
  position:absolute;
  z-index:3;
  right:5px;
  top:4px;
  font-size:18px;
  color:#9eabb4;
  text-shadow:0 2px 3px #000;
}
.junctionBranch.armed { color:#ffd96c; }
.junctionBranch.done { color:#8ee2a4; }
.junctionLabel {
  position:absolute;
  z-index:3;
  left:3px;
  bottom:2px;
  font-size:6px;
  font-weight:900;
  color:#d9e0e6;
  text-shadow:0 1px 2px #000;
}
.statusChip.railState.armed {
  border-color:#b48d35;
  color:#ffe39a;
}
.statusChip.railState.done {
  border-color:#4f8f62;
  color:#a9e8b8;
}

/* 8 linhas x 11 colunas: os tiles permanecem próximos do quadrado no celular. */
.mazeGrid.largeMazeGrid {
  aspect-ratio:11 / 8;
  height:auto !important;
  grid-template-rows:repeat(8,minmax(0,1fr));
}
@media (max-width:900px) {
  .mazeGrid.largeMazeGrid {
    width:min(96vw,540px) !important;
    height:auto !important;
    aspect-ratio:11 / 8;
    gap:2px !important;
    padding:3px !important;
  }
  .pursuitGrid .switchVisual small { font-size:5.5px; }
  .junctionBranch { font-size:15px; }
  .junctionLabel { font-size:5.5px; }
}


/* V18.16 — resultado de travessia independente do grid anterior */
@media (max-width:900px) {
  .arenaPanel.transitionResultPanel .arenaGrid.transitionResultGrid {
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    grid-template-rows:none !important;
  }
  .arenaPanel.transitionResultPanel .transitionResultCard {
    width:100% !important;
    max-width:none !important;
    font-size:16px !important;
    line-height:1.55 !important;
  }
}

/* V18.16 — comboio estático: os vagões é que se movem */
.pursuitGrid .railLane { position:relative; }
.pursuitGrid .railLane::after {
  content:"▼"; position:absolute; right:3px; top:2px; font-size:8px; color:rgba(210,220,230,.28); z-index:0;
}
.pursuitGrid .fixedSwitch.armed { box-shadow:0 0 12px rgba(255,202,92,.55), inset 0 0 8px rgba(255,202,92,.2); }
.pursuitGrid .fixedSwitch.done { opacity:.68; }

/* ======================================================
   V18.17 — Quatro Câmaras de Integração
   ====================================================== */
.integrationGrid {
  grid-template-rows: repeat(7, minmax(0, 1fr));
  background:
    radial-gradient(circle at 50% 10%, rgba(123,86,168,.12), transparent 30%),
    linear-gradient(145deg,#090d14,#111722);
}
.integrationCell { position:relative; overflow:hidden; }
.integrationExit {
  border-color:#8c6ca6 !important;
  box-shadow:inset 0 0 18px rgba(147,97,185,.22),0 0 10px rgba(115,82,150,.16);
}
.integrationChargeLane {
  box-shadow:inset 0 0 0 2px rgba(239,151,74,.46), inset 0 0 18px rgba(195,83,39,.15);
}
.integrationChargeLane::after {
  content:""; position:absolute; left:46%; top:0; bottom:0; width:8%;
  background:linear-gradient(180deg,rgba(255,191,91,.1),rgba(255,106,62,.42),rgba(255,191,91,.1));
}
.integrationChargeTimer,.integrationAimTimer {
  position:absolute; z-index:4; top:5px; right:6px; min-width:22px; height:22px;
  border-radius:50%; display:grid; place-items:center; font-weight:900; font-size:12px;
  background:#111c; border:1px solid rgba(255,220,170,.7); color:#ffe1a3;
}
.integrationRubble {
  background:linear-gradient(145deg,#302b28,#15181c) !important;
}
.integrationRubbleVisual {
  position:absolute; inset:13%; display:grid; place-items:center; font-size:30px;
  transform:rotate(-10deg); color:#9e8d78; text-shadow:4px 3px 0 #342d27;
}
.integrationRecorded {
  background:linear-gradient(145deg,rgba(106,23,35,.52),#111721) !important;
  box-shadow:inset 0 0 0 2px rgba(233,74,92,.50);
}
.integrationRecordMark {
  position:absolute; left:3px; right:3px; bottom:4px; text-align:center;
  font-size:7px; font-weight:900; letter-spacing:.05em; color:#ff9aa4;
}
.integrationWeb {
  background:radial-gradient(circle,rgba(216,234,230,.20),#0c1714 72%) !important;
  box-shadow:inset 0 0 0 1px rgba(193,222,213,.20);
}
.integrationAim {
  box-shadow:inset 0 0 0 2px rgba(255,91,73,.5), inset 0 0 20px rgba(181,45,35,.18);
}
.integrationAim1 { background:linear-gradient(145deg,rgba(168,36,38,.54),#101721) !important; }
.integrationAim2 { background:linear-gradient(145deg,rgba(151,77,35,.40),#101721) !important; }
.integrationAim3 { background:linear-gradient(145deg,rgba(128,107,42,.30),#101721) !important; }
.integrationAim .artilleryCrosshair { width:66%; }
@media (max-width:900px) {
  .integrationGrid {
    width:min(94vw,520px) !important;
    height:min(94vw,520px) !important;
    max-width:520px !important;
    max-height:520px !important;
    gap:3px !important;
    padding:4px !important;
  }
  .integrationRubbleVisual { font-size:24px; }
  .integrationRecordMark { font-size:6px; }
  .integrationChargeTimer,.integrationAimTimer { min-width:19px; height:19px; font-size:10px; }
}

/* ======================================================
   V18.17h — Câmara do Veredito 9x9 progressiva + Centro 5x5 reconfigurável
   ====================================================== */
.verdictGrid {
  grid-template-rows: repeat(7, minmax(0,1fr));
  background:
    linear-gradient(90deg,rgba(125,24,34,.08),transparent 28%,rgba(125,24,34,.08) 72%,transparent),
    linear-gradient(145deg,#160d11,#090b10 68%);
}
.verdictCell { position:relative; overflow:hidden; }
.verdictFloor {
  background:
    linear-gradient(90deg,transparent 47%,rgba(171,57,67,.10) 48% 52%,transparent 53%),
    linear-gradient(0deg,transparent 47%,rgba(171,57,67,.08) 48% 52%,transparent 53%),
    linear-gradient(145deg,#1b171b,#0f1116) !important;
}
.verdictWall {
  background:linear-gradient(145deg,#30272b,#141419) !important;
  border-color:#4d3b41 !important;
}
.verdictWallPanel { position:absolute; inset:7%; border:2px solid #4d3d43; background:repeating-linear-gradient(90deg,#33292d 0 7px,#211b1f 7px 13px); }
.verdictPlate { box-shadow:inset 0 0 0 2px rgba(216,164,91,.30); }
.verdictPlateVisual { position:absolute; z-index:1; font-size:28px; color:#d9b15f; filter:drop-shadow(0 0 6px rgba(218,171,81,.30)); }
.verdictPlate small { position:absolute; bottom:3px; left:2px; right:2px; z-index:2; font-size:6px; font-weight:900; color:#f0d9a0; }
.verdictPlate.covered { box-shadow:inset 0 0 16px rgba(81,180,112,.25),inset 0 0 0 2px rgba(96,184,118,.48); }
.verdictCrate { position:absolute; inset:10%; z-index:4; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid #90766c; border-radius:5px; background:linear-gradient(145deg,#6b5b51,#2f2a29 70%); box-shadow:inset 0 0 0 2px rgba(255,255,255,.04),0 4px 9px rgba(0,0,0,.45); }
.verdictCrate span { font-size:25px; color:#c3a88f; text-shadow:2px 2px 0 #352b27; }
.verdictCrate small { font-size:6px; font-weight:900; color:#efe4d8; }
.verdictExit { border-color:#873b44 !important; }
.verdictExitVisual { position:absolute; inset:6%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px solid #7f3841; border-radius:5px; background:repeating-linear-gradient(90deg,#30262a 0 6px,#17161a 6px 12px); }
.verdictExitVisual strong { font-size:7px; color:#ff9aa3; }
.verdictExitVisual small { font-size:6px; color:#d8bbc0; }
.verdictExit.unlocked { box-shadow:inset 0 0 18px rgba(88,190,118,.24),0 0 10px rgba(88,190,118,.20); border-color:#4c9564 !important; }
.verdictExit.unlocked .verdictExitVisual { border-color:#67ad7a; }
.verdictLineCell { box-shadow:inset 0 0 0 2px rgba(255,67,83,.40),inset 0 0 16px rgba(190,25,42,.18) !important; }
.verdictLine-row::after { content:""; position:absolute; left:0; right:0; top:48%; height:4px; background:linear-gradient(90deg,transparent,#ff4355 12% 88%,transparent); box-shadow:0 0 9px rgba(255,50,70,.75); z-index:3; }
.verdictLine-col::after { content:""; position:absolute; top:0; bottom:0; left:48%; width:4px; background:linear-gradient(180deg,transparent,#ff4355 12% 88%,transparent); box-shadow:0 0 9px rgba(255,50,70,.75); z-index:3; }
.verdictEmitter { position:absolute; z-index:8; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:#5e141e; border:2px solid #ff6876; color:#fff0f2; font-weight:900; font-size:12px; box-shadow:0 0 12px rgba(255,63,79,.55); }

/* O Arquiteto deixa de ocupar 7x7: quatro arenas 5x5 densas e móveis. */
.integrationGrid {
  grid-template-rows: repeat(5, minmax(0,1fr));
  width:min(78vw,460px);
  height:min(78vw,460px);
  max-width:460px;
  max-height:460px;
}
.integrationVoidCell {
  background:radial-gradient(circle at center,rgba(91,58,118,.16),#05060a 58%,#020305) !important;
  border-color:#17131e !important;
  box-shadow:inset 0 0 18px rgba(0,0,0,.85) !important;
  opacity:.68;
}
.integrationVoidCell::before,
.integrationVoidCell::after { content:""; position:absolute; inset:12%; border:1px solid rgba(113,77,139,.22); transform:rotate(18deg); }
.integrationVoidCell::after { transform:rotate(-24deg) scale(.72); opacity:.6; }
.integrationVoidVisual { font-size:24px; color:#4e3a60; opacity:.65; }

@media (max-width:900px) {
  .verdictGrid {
    width:min(94vw,520px) !important;
    height:min(94vw,520px) !important;
    max-width:520px !important;
    max-height:520px !important;
    gap:3px !important;
    padding:4px !important;
  }
  .verdictGrid .arenaCell { min-height:0 !important; }
  .verdictCrate span,.verdictPlateVisual { font-size:21px; }
  .verdictEmitter { width:21px; height:21px; font-size:10px; }
  .integrationGrid {
    width:min(88vw,440px) !important;
    height:min(88vw,440px) !important;
    max-width:440px !important;
    max-height:440px !important;
  }
}

/* ======================================================
   V18.18 — desktop: minijogos grandes + resultados sem corte
   O bloco e exclusivo para computador. O layout <=900px permanece intacto.
   ====================================================== */
@media (min-width:901px) {
  /* Durante travessias, a coluna de batalha recebe altura real para o puzzle. */
  .battleCol:has(.arenaPanel.verdictTransitionPanel),
  .battleCol:has(.arenaPanel.pursuitTransitionPanel),
  .battleCol:has(.arenaPanel.mazeTransitionPanel),
  .battleCol:has(.arenaPanel.artilleryTransitionPanel),
  .battleCol:has(.arenaPanel.circuitTransitionPanel) {
    grid-template-rows:50px minmax(360px,52vh) 42px minmax(0,1fr);
  }

  .gameShell:has(.arenaPanel.verdictTransitionPanel),
  .gameShell:has(.arenaPanel.pursuitTransitionPanel),
  .gameShell:has(.arenaPanel.mazeTransitionPanel),
  .gameShell:has(.arenaPanel.artilleryTransitionPanel),
  .gameShell:has(.arenaPanel.circuitTransitionPanel) {
    grid-template-columns:minmax(720px,1.18fr) minmax(430px,.82fr);
  }

  .arenaPanel.verdictTransitionPanel,
  .arenaPanel.pursuitTransitionPanel,
  .arenaPanel.mazeTransitionPanel,
  .arenaPanel.artilleryTransitionPanel,
  .arenaPanel.circuitTransitionPanel {
    height:100%;
    grid-template-columns:minmax(400px,1fr) minmax(245px,.58fr);
    gap:12px;
    align-items:center;
  }

  .arenaPanel.verdictTransitionPanel .arenaGrid,
  .arenaPanel.pursuitTransitionPanel .arenaGrid,
  .arenaPanel.artilleryTransitionPanel .arenaGrid,
  .arenaPanel.circuitTransitionPanel .arenaGrid {
    width:min(100%,500px) !important;
    height:auto !important;
    aspect-ratio:1 / 1;
    max-width:500px !important;
    max-height:500px !important;
    gap:4px;
    padding:5px;
  }

  /* O labirinto preserva sua proporcao retangular em vez de ser espremido. */
  .arenaPanel.mazeTransitionPanel .arenaGrid.mazeGrid {
    width:min(100%,620px) !important;
    height:auto !important;
    max-width:620px !important;
    max-height:none !important;
  }

  /* A arena final 5x5 aproveita melhor o espaço do monitor. */
  .arenaPanel.circuitTransitionPanel .arenaGrid.integrationGrid {
    width:min(100%,500px) !important;
    height:auto !important;
    aspect-ratio:1 / 1;
  }

  .arenaPanel.verdictTransitionPanel .arenaSide,
  .arenaPanel.pursuitTransitionPanel .arenaSide,
  .arenaPanel.mazeTransitionPanel .arenaSide,
  .arenaPanel.artilleryTransitionPanel .arenaSide,
  .arenaPanel.circuitTransitionPanel .arenaSide {
    align-content:center;
    gap:9px;
  }

  .arenaPanel.verdictTransitionPanel .tacticalHint,
  .arenaPanel.pursuitTransitionPanel .tacticalHint,
  .arenaPanel.mazeTransitionPanel .tacticalHint,
  .arenaPanel.artilleryTransitionPanel .tacticalHint,
  .arenaPanel.circuitTransitionPanel .tacticalHint {
    max-height:120px;
    overflow:auto;
    font-size:10.5px;
    line-height:1.35;
  }

  /* Resultado da travessia nao herda mais a caixa 240x240 do grid. */
  .battleCol:has(.arenaPanel.transitionResultPanel) {
    grid-template-rows:50px minmax(330px,44vh) 42px minmax(0,1fr);
  }

  .arenaPanel.transitionResultPanel {
    height:100%;
    grid-template-columns:minmax(420px,1.25fr) minmax(260px,.75fr);
    gap:12px;
    align-items:stretch;
    overflow:hidden;
  }

  .arenaPanel.transitionResultPanel .arenaGrid.transitionResultGrid {
    display:flex !important;
    width:100% !important;
    height:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  .arenaPanel.transitionResultPanel .transitionResultCard {
    width:100% !important;
    max-width:none !important;
    height:100%;
    padding:20px 22px;
    overflow:auto;
    text-align:left;
    font-size:14px;
    line-height:1.55;
  }

  .arenaPanel.transitionResultPanel .transitionResultCard strong {
    display:block;
    margin-bottom:12px;
    text-align:center;
    font-size:17px;
  }

  .arenaPanel.transitionResultPanel .transitionResultIcon {
    text-align:center;
  }

  .arenaPanel.transitionResultPanel .arenaSide {
    align-content:center;
  }

  .arenaPanel.transitionResultPanel .tacticalHint {
    max-height:none;
    overflow:visible;
    font-size:10.5px;
  }

  /* Narrativas longas no computador podem rolar em vez de desaparecer no corte. */
  body.mode-story #log,
  body.mode-campaign #log {
    overflow:auto;
    scrollbar-gutter:stable;
  }
}

/* V18.42 — Arena Viva do Arquiteto */
.arenaCell.architectConduit {
  box-shadow:inset 0 0 12px rgba(164,122,255,.24);
}

.architectConduitIcon {
  color:#b998ff;
  font-weight:800;
}

.architectComponentIcon {
  color:#f1ddff;
  font-size:1.08rem;
  text-shadow:0 0 8px rgba(181,122,255,.75);
}

/* ======================================================
   V18.19 — ajuste fino do Carmesim no desktop
   ====================================================== */
@media (min-width:901px) {
  .arenaPanel.verdictTransitionPanel .arenaGrid.verdictGrid {
    width:min(94%,450px) !important;
    max-width:450px !important;
    height:auto !important;
    aspect-ratio:1 / 1;
  }
}

/* ======================================================
   V15.5.4 — HÍBRIDA CONSOLIDADA / LEITURA À ESQUERDA
   Autoridade visual única da linha híbrida.
   - narrativa permanente à esquerda;
   - arena + HUDs + objetivo + cartas à direita;
   - grid ocupa a faixa entre os HUDs, nunca é empurrado para baixo;
   - objetivo secundário persiste durante toda a luta;
   - legenda é modal global;
   - pós-travessia é leitura limpa;
   - minijogos usam grid grande + coluna de estado/comandos em fluxo.
   ====================================================== */

:root {
  --gdf-gold:#d4ad58;
  --gdf-gold-soft:rgba(212,173,88,.24);
  --gdf-reading:#f0ece4;
  --gdf-stage:#07101a;
  --gdf-panel:#0b1622;
  --gdf-panel-deep:#08111a;
  --hybrid-hand-h:156px;
  --hybrid-controls-h:46px;
  --hybrid-gap:7px;
}

/* ---------- leitura unificada: abertura, travessias e entradas ---------- */
body.mode-story .mobileTabs,
body.mode-story .choiceCol,
body.mode-story #arenaPanel,
body.mode-story .mobileMoveDock,
body.mode-story .detailsPanel,
body.mode-story .compactLegend,
body.mode-story .movementHelp,
body.mode-story #queue { display:none !important; }
body.mode-story .gameShell {
  display:block !important;
  width:100% !important;
  height:calc(100vh - 8px) !important;
  min-height:0 !important;
  overflow:hidden !important;
}
body.mode-story .battleCol {
  display:flex !important;
  flex-direction:column !important;
  width:min(1220px,100%) !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 auto !important;
  overflow:auto !important;
}
body.mode-story .topbar {
  order:2 !important;
  flex:0 0 52px !important;
  height:52px !important;
  min-height:52px !important;
  margin:8px 0 0 !important;
}
body.mode-story .logPanel {
  order:1 !important;
  display:flex !important;
  flex:1 0 auto !important;
  width:min(1180px,calc(100vw - 28px)) !important;
  min-height:calc(100vh - 72px) !important;
  height:auto !important;
  margin:0 auto !important;
  padding:16px 18px 18px !important;
  overflow:visible !important;
  border:1px solid rgba(188,151,75,.48) !important;
  border-radius:16px !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(202,164,82,.10),transparent 30%),
    linear-gradient(180deg,var(--gdf-panel),var(--gdf-panel-deep)) !important;
  box-shadow:0 22px 60px rgba(0,0,0,.28) !important;
}
body.mode-story .logPanel .panelHeader {
  min-height:48px !important;
  margin:0 0 8px !important;
  padding:0 2px 9px !important;
  border-bottom:1px solid var(--gdf-gold-soft) !important;
}
body.mode-story .logPanel .eyebrow {
  color:var(--gdf-gold) !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  letter-spacing:.13em !important;
}
body.mode-story #statusLine {
  display:block !important;
  color:#f2eee6 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:21px !important;
  font-weight:700 !important;
  line-height:1.18 !important;
}
body.mode-story #statusLine[hidden] { display:none !important; }
body.mode-story #log {
  display:block !important;
  flex:1 0 auto !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  padding:20px 24px 26px !important;
  overflow:visible !important;
  border:1px solid rgba(52,77,101,.84) !important;
  border-radius:13px !important;
  background:linear-gradient(180deg,#09131d,#071019) !important;
  color:var(--gdf-reading) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:17px !important;
  line-height:1.66 !important;
  letter-spacing:.003em !important;
  white-space:pre-wrap !important;
}
body.mode-story[data-phase="transition_result"] #arenaPanel,
body.mode-story[data-phase="transition_result"] .choiceCol,
body.mode-story[data-phase="transition_result"] .detailsPanel,
body.mode-story[data-phase="transition_result"] .mobileMoveDock { display:none !important; }

/* ---------- híbrida desktop ---------- */
@media (min-width:901px) {
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell {
    position:relative !important;
    display:grid !important;
    grid-template-columns:minmax(355px,.78fr) minmax(600px,1.22fr) !important;
    grid-template-rows:minmax(0,1fr) var(--hybrid-hand-h) var(--hybrid-controls-h) !important;
    grid-template-areas:
      "narrative arena"
      "narrative hand"
      "controls controls" !important;
    gap:var(--hybrid-gap) !important;
    width:100% !important;
    height:calc(100vh - 8px) !important;
    min-height:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="movement"]:not([data-phase="transition_run"]) #gameShell,
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="narrative"]:not([data-phase="transition_run"]) #gameShell {
    grid-template-rows:minmax(0,1fr) 0 var(--hybrid-controls-h) !important;
    grid-template-areas:
      "narrative arena"
      "narrative arena"
      "controls controls" !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell > .battleCol,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell > .choiceCol { display:contents !important; }

  /* Narrativa: coluna esquerda permanente, mesma identidade da abertura. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell .logPanel {
    grid-area:narrative !important;
    position:relative !important;
    z-index:20 !important;
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    margin:0 !important;
    padding:12px 13px 13px !important;
    overflow:hidden !important;
    border:1px solid rgba(188,151,75,.46) !important;
    border-radius:15px !important;
    background:
      radial-gradient(circle at 8% 0%,rgba(202,164,82,.09),transparent 29%),
      linear-gradient(180deg,#0b1622,#08111a) !important;
    box-shadow:0 16px 38px rgba(0,0,0,.26) !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .panelHeader {
    flex:0 0 auto !important;
    min-height:46px !important;
    margin:0 0 8px !important;
    padding:0 2px 8px !important;
    border-bottom:1px solid var(--gdf-gold-soft) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .eyebrow {
    color:var(--gdf-gold) !important;
    font-size:10px !important;
    font-weight:800 !important;
    letter-spacing:.12em !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .title {
    color:#f2eee6 !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:17px !important;
    line-height:1.16 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .compactLegend { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .log {
    flex:1 1 auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:16px 17px 18px !important;
    overflow:auto !important;
    scrollbar-gutter:stable !important;
    border:1px solid #20364c !important;
    border-radius:11px !important;
    background:#09121b !important;
    color:var(--gdf-reading) !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:16px !important;
    line-height:1.60 !important;
    white-space:pre-wrap !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] #btnCloseNarrativePeek,
  body.mode-battle[data-layout-variant="split-clean"] #btnNarrativePeek { display:none !important; }

  /* Arena: HUDs e grid dividem a MESMA faixa vertical. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel {
    grid-area:arena !important;
    position:relative !important;
    z-index:10 !important;
    display:grid !important;
    grid-template-columns:minmax(155px,.72fr) minmax(260px,1.45fr) minmax(175px,.82fr) !important;
    grid-template-rows:minmax(0,1fr) 32px !important;
    align-items:start !important;
    gap:6px 10px !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    padding:9px 10px 7px !important;
    overflow:hidden !important;
    border:1px solid #2a4057 !important;
    border-radius:15px !important;
    background:
      radial-gradient(circle at 50% 43%,rgba(47,78,105,.16),transparent 39%),
      linear-gradient(180deg,#09131f,#07101a) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel[hidden] { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel > .arenaGrid {
    position:static !important;
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:center !important;
    justify-self:center !important;
    width:min(100%,calc(100vh - var(--hybrid-hand-h) - var(--hybrid-controls-h) - 54px),460px) !important;
    height:auto !important;
    max-width:460px !important;
    max-height:100% !important;
    aspect-ratio:1/1 !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="movement"]:not([data-phase="transition_run"]) #arenaPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="narrative"]:not([data-phase="transition_run"]) #arenaPanel > .arenaGrid {
    width:min(100%,calc(100vh - var(--hybrid-controls-h) - 56px),500px) !important;
    max-width:500px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel > .playerHudStack {
    position:static !important;
    grid-column:1 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-self:start !important;
    justify-self:stretch !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
    max-height:100% !important;
    margin:0 !important;
    overflow:auto !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel > .bossHudStack {
    position:static !important;
    grid-column:3 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-self:start !important;
    justify-self:stretch !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
    max-height:100% !important;
    margin:0 !important;
    overflow:auto !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #playerHud,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #furyHud,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #bossHud,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #tacticalHint,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #secondaryObjectiveHud {
    position:static !important;
    inset:auto !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hudCard {
    padding:9px 10px !important;
    border-radius:11px !important;
    box-shadow:0 9px 22px rgba(0,0,0,.20) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hudHeader {
    margin-bottom:7px !important;
    font-size:12.4px !important;
    line-height:1.15 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hpTrack { height:13px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .statusChips {
    gap:4px !important;
    margin-top:6px !important;
    max-height:none !important;
    overflow:visible !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .statusChip {
    padding:3px 5px !important;
    font-size:9px !important;
    line-height:1.12 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel #tacticalHint {
    min-height:0 !important;
    max-height:140px !important;
    padding:8px 9px !important;
    overflow:auto !important;
    border-left:3px solid var(--gdf-gold) !important;
    font-size:10.2px !important;
    line-height:1.34 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .tacticalChip {
    display:block !important;
    margin:0 0 6px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .tacticalChip:last-child { margin-bottom:0 !important; }

  /* Objetivo secundário persistente, do tamanho da pilha do Guardião. */
  body.mode-battle[data-layout-variant="split-clean"] .secondaryObjectiveHud[hidden] { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveCard {
    padding:8px 9px 9px !important;
    border:1px solid rgba(204,164,82,.58) !important;
    border-left:3px solid var(--gdf-gold) !important;
    border-radius:10px !important;
    background:linear-gradient(180deg,#111b26,#0a131d) !important;
    box-shadow:0 8px 19px rgba(0,0,0,.18) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveHeader {
    display:flex !important;
    align-items:center !important;
    gap:5px !important;
    margin-bottom:5px !important;
    color:#e0c67e !important;
    font-size:9.2px !important;
    letter-spacing:.05em !important;
    text-transform:uppercase !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveIcon { font-size:13px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveBody {
    color:#eef1f4 !important;
    font-size:10.2px !important;
    font-weight:700 !important;
    line-height:1.28 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveProgress {
    margin-top:5px !important;
    color:#c9d7e5 !important;
    font-size:10px !important;
    line-height:1.25 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveDetail {
    margin-top:4px !important;
    color:#91a7bc !important;
    font-size:8.9px !important;
    line-height:1.28 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveOpportunity {
    display:flex !important;
    flex-direction:column !important;
    gap:2px !important;
    margin-top:6px !important;
    padding-top:6px !important;
    border-top:1px solid rgba(212,173,88,.18) !important;
    color:#aebfd0 !important;
    font-size:8.8px !important;
    line-height:1.25 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveOpportunity b { color:#d5ba75 !important; font-weight:700 !important; }

  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .puzzleCommandHost { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .arenaInfoBtn {
    position:static !important;
    grid-column:2 !important;
    grid-row:2 !important;
    align-self:end !important;
    justify-self:end !important;
    min-height:29px !important;
    margin:0 2px 0 0 !important;
    padding:4px 9px !important;
    border-color:#6f6547 !important;
    background:#0b1622 !important;
    color:#e0c985 !important;
    font-size:9.7px !important;
  }

  /* Mão da coluna direita: um pouco mais alta, sem achatar as Skills. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell .choicePanel {
    grid-area:hand !important;
    position:static !important;
    z-index:30 !important;
    display:none !important;
    width:100% !important;
    height:var(--hybrid-hand-h) !important;
    min-height:var(--hybrid-hand-h) !important;
    max-height:var(--hybrid-hand-h) !important;
    margin:0 !important;
    padding:6px 8px 7px !important;
    overflow:hidden !important;
    border:1px solid #31465d !important;
    border-radius:13px !important;
    background:linear-gradient(180deg,rgba(10,20,32,.985),rgba(6,12,20,.995)) !important;
    box-shadow:0 10px 26px rgba(0,0,0,.24) !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="choice"]:not([data-phase="transition_run"]) #gameShell .choicePanel {
    display:flex !important;
    flex-direction:column !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .choicePanel .panelHeader {
    flex:0 0 23px !important;
    height:23px !important;
    min-height:23px !important;
    margin:0 0 3px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .choicePanel .eyebrow,
  body.mode-battle[data-layout-variant="split-clean"] .choicePanel .ruleBadge,
  body.mode-battle[data-layout-variant="split-clean"] .choicePanel .choiceSummary,
  body.mode-battle[data-layout-variant="split-clean"] .choicePanel .sub { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"] #choiceTitle { color:#d8e6f4 !important; font-size:11.5px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .choiceTools { margin-left:auto !important; }
  body.mode-battle[data-layout-variant="split-clean"] .choicesGrid { flex:1 1 auto !important; min-height:0 !important; margin:0 !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .choicesGrid { display:block !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .reactionSection { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionSection,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionCards { height:122px !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionCards {
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:6px !important;
    width:100% !important;
    padding:0 2px 2px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillCards .cardBtn,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionCards .cardBtn {
    flex:1 1 135px !important;
    min-width:105px !important;
    max-width:170px !important;
    height:118px !important;
    margin:0 !important;
    padding:7px 8px !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .cardKicker {
    display:flex !important;
    justify-content:space-between !important;
    gap:4px !important;
    color:#91a8bd !important;
    font-size:8.4px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"] .cardTitle { font-size:10.6px !important; line-height:1.14 !important; }
  body.mode-battle[data-layout-variant="split-clean"] .cardBody {
    display:-webkit-box !important;
    overflow:hidden !important;
    color:#afc2d4 !important;
    font-size:9px !important;
    line-height:1.22 !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:4 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .choicesGrid {
    display:grid !important;
    grid-template-columns:145px minmax(0,1fr) !important;
    align-items:stretch !important;
    gap:7px !important;
    height:122px !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .reactionSection { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .equipCards {
    height:118px !important;
    min-width:0 !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .skillCards .cardBtn:not(.selected) { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .skillCards .cardBtn.selected {
    width:138px !important;
    min-width:138px !important;
    height:116px !important;
    margin:0 !important;
    padding:7px !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .equipCards {
    display:grid !important;
    grid-template-columns:repeat(5,minmax(58px,1fr)) !important;
    align-items:center !important;
    gap:4px !important;
    padding:4px 0 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="equip"] .equipCards .cardBtn {
    width:100% !important;
    height:76px !important;
    min-height:76px !important;
    margin:0 !important;
    padding:5px !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .choicesGrid { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionSection { display:block !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-ui-focus="choice"]):not([data-phase="transition_run"]) #gameShell .choicePanel { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell .detailsPanel { display:none !important; }

  /* Controles globais no rodapé. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .topbar {
    grid-area:controls !important;
    position:static !important;
    z-index:50 !important;
    width:100% !important;
    height:var(--hybrid-controls-h) !important;
    min-height:var(--hybrid-controls-h) !important;
    margin:0 !important;
    padding:4px 7px !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .topbarMain { height:100% !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .topbar .btns {
    display:grid !important;
    grid-template-columns:minmax(0,1.45fr) minmax(180px,.56fr) minmax(180px,.72fr) !important;
    width:100% !important;
    height:100% !important;
    gap:7px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="movement"]:not([data-phase="transition_run"]) #btnClearQueue { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-ui-focus="movement"]:not([data-phase="transition_run"]) .topbar .btns { grid-template-columns:minmax(0,1.5fr) minmax(220px,.62fr) !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .topbar .btns button { min-height:34px !important; padding:5px 8px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .movementHelp,
  body.mode-battle[data-layout-variant="split-clean"] #queue { display:none !important; }

  /* ---------- minijogos: composição estrutural independente da híbrida ---------- */
  body.mode-battle[data-phase="transition_run"] #gameShell {
    display:grid !important;
    grid-template-columns:minmax(560px,1.45fr) minmax(300px,.55fr) !important;
    grid-template-rows:minmax(0,1fr) 50px !important;
    grid-template-areas:"puzzle info" "pcontrols pcontrols" !important;
    gap:8px 10px !important;
    width:100% !important;
    height:calc(100vh - 8px) !important;
    min-height:0 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #gameShell > .battleCol,
  body.mode-battle[data-phase="transition_run"] #gameShell > .choiceCol { display:contents !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel {
    display:contents !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .arenaGrid {
    grid-area:puzzle !important;
    position:static !important;
    align-self:center !important;
    justify-self:center !important;
    width:min(80vh,640px,calc(100vw - 360px)) !important;
    height:min(80vh,640px,calc(100vw - 360px)) !important;
    max-width:640px !important;
    max-height:640px !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel.mazeTransitionPanel > .arenaGrid.mazeGrid {
    width:min(88vw,760px,calc(100vw - 340px),calc((100vh - 66px) * 11 / 8)) !important;
    height:auto !important;
    max-width:760px !important;
    max-height:calc(100vh - 66px) !important;
    aspect-ratio:11/8 !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .playerHudStack { display:none !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .bossHudStack {
    grid-area:info !important;
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
    min-height:0 !important;
    height:100% !important;
    gap:8px !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel #bossHud { display:none !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel #tacticalHint {
    flex:1 1 auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:10px 11px !important;
    overflow:auto !important;
    border-left:3px solid var(--gdf-gold) !important;
    font-size:11.5px !important;
    line-height:1.42 !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .puzzleCommandHost {
    display:block !important;
    flex:0 0 auto !important;
    width:100% !important;
    min-width:0 !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost > .choicePanel {
    position:static !important;
    display:block !important;
    width:100% !important;
    height:132px !important;
    min-height:132px !important;
    max-height:132px !important;
    margin:0 !important;
    padding:5px 6px !important;
    overflow:hidden !important;
    transform:none !important;
    border:1px solid #314961 !important;
    border-radius:10px !important;
    background:linear-gradient(180deg,rgba(10,20,32,.99),rgba(6,12,20,.995)) !important;
    box-shadow:none !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .panelHeader { height:19px !important; min-height:19px !important; margin:0 0 2px !important; padding:0 2px !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .eyebrow,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .choiceTools,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .choiceSummary,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .equipSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .reactionSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .skillSection .sub { display:none !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .title { font-size:0 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .title::after { content:"COMANDOS" !important; font-size:10px !important; color:var(--gdf-gold) !important; letter-spacing:.08em !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicesGrid,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards { width:100% !important; height:101px !important; margin:0 !important; padding:0 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards {
    display:grid !important;
    grid-template-columns:repeat(4,minmax(54px,1fr)) !important;
    grid-template-rows:repeat(3,29px) !important;
    gap:4px !important;
    align-content:center !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn {
    width:100% !important;
    height:29px !important;
    min-height:29px !important;
    margin:0 !important;
    padding:2px 3px !important;
    transform:none !important;
    border-radius:7px !important;
    box-shadow:none !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardKicker,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardBody { display:none !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardTitle {
    margin:0 !important;
    overflow:hidden !important;
    font-size:9px !important;
    line-height:1.08 !important;
    text-align:center !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(1) { grid-column:2; grid-row:1; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(2) { grid-column:1; grid-row:2; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(3) { grid-column:2; grid-row:2; border-color:#987d42 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(4) { grid-column:3; grid-row:2; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(5) { grid-column:2; grid-row:3; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(6) { grid-column:4; grid-row:2; }
  body.mode-battle[data-phase="transition_run"] .topbar {
    grid-area:pcontrols !important;
    position:static !important;
    width:100% !important;
    height:50px !important;
    min-height:50px !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-phase="transition_run"] #gameShell .logPanel,
  body.mode-battle[data-phase="transition_run"] #gameShell .detailsPanel,
  body.mode-battle[data-phase="transition_run"] #gameShell .mobileMoveDock,
  body.mode-battle[data-phase="transition_run"] #gameShell > .choiceCol > .choicePanel { display:none !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .arenaInfoBtn {
    position:fixed !important;
    z-index:100 !important;
    right:12px !important;
    top:12px !important;
    bottom:auto !important;
  }
}

/* ---------- Legenda: modal global, impossível ficar atrás das cartas ---------- */
body .legendPanel.arenaLegendOverlay { display:none !important; }
body.arena-info-open::before {
  content:"";
  position:fixed;
  z-index:990;
  inset:0;
  background:rgba(2,7,12,.72);
  backdrop-filter:blur(1px);
}
body.arena-info-open .legendPanel.arenaLegendOverlay {
  position:fixed !important;
  z-index:1000 !important;
  top:50% !important;
  left:50% !important;
  display:flex !important;
  flex-direction:column !important;
  width:min(720px,calc(100vw - 38px)) !important;
  max-height:min(82vh,620px) !important;
  padding:14px 16px 16px !important;
  overflow:auto !important;
  transform:translate(-50%,-50%) !important;
  border:1px solid #806a3f !important;
  border-radius:15px !important;
  background:linear-gradient(180deg,#101a27,#080e16) !important;
  box-shadow:0 28px 84px rgba(0,0,0,.78) !important;
}
body.arena-info-open .legendPanel .legendOverlayHeader {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom:11px !important;
  padding-bottom:9px !important;
  border-bottom:1px solid var(--gdf-gold-soft) !important;
}
body.arena-info-open .legendPanel .legendHeading { color:var(--gdf-gold) !important; font-size:12px !important; font-weight:800 !important; letter-spacing:.10em !important; }
body.arena-info-open .legendPanel .arenaInfoClose { position:static !important; display:inline-flex !important; min-height:34px !important; padding:5px 11px !important; transform:none !important; }
body.arena-info-open .legendPanel .arenaLegend {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px 12px !important;
  width:100% !important;
  overflow:visible !important;
  font-size:12px !important;
  line-height:1.38 !important;
}
body.arena-info-open .legendPanel .legendItem {
  display:block !important;
  min-width:0 !important;
  padding:8px 9px !important;
  border:1px solid rgba(67,91,116,.66) !important;
  border-radius:8px !important;
  background:#0a1520 !important;
  white-space:normal !important;
}
body.arena-info-open .legendPanel .arenaLegendState {
  display:block !important;
  margin-top:11px !important;
  padding:10px 11px !important;
  border:1px solid rgba(92,115,139,.62) !important;
  border-left:3px solid #caa457 !important;
  border-radius:9px !important;
  background:#09141f !important;
  color:#dbe6ef !important;
  font-size:11.5px !important;
  line-height:1.45 !important;
  white-space:pre-wrap !important;
}
body.arena-info-open .legendPanel .arenaLegendState[hidden] { display:none !important; }
body.arena-info-open .legendPanel .arenaLegendNote { margin-top:10px !important; color:#9eb0c2 !important; font-size:10.7px !important; line-height:1.4 !important; }

/* ---------- Faixas Carmesim: eixo real ---------- */
body.mode-battle .arenaCell.executionLineRow::after,
body.mode-battle .arenaCell.executionLineColumn::after {
  content:"";
  position:absolute;
  z-index:1;
  pointer-events:none;
  background:rgba(218,50,64,.58);
  box-shadow:0 0 9px rgba(218,50,64,.38);
}
body.mode-battle .arenaCell.executionLineRow::after { left:-3px; right:-3px; top:50%; height:3px; transform:translateY(-50%); }
body.mode-battle .arenaCell.executionLineColumn::after { top:-3px; bottom:-3px; left:50%; width:3px; transform:translateX(-50%); }
body.mode-battle .arenaCell.executionLineRow.executionLineColumn::before {
  content:"";
  position:absolute;
  z-index:1;
  top:-3px; bottom:-3px; left:50%; width:3px;
  transform:translateX(-50%);
  background:rgba(218,50,64,.58);
  box-shadow:0 0 9px rgba(218,50,64,.38);
  pointer-events:none;
}
body.mode-battle .executionIcon { z-index:5 !important; color:#ff6672 !important; text-shadow:0 0 7px rgba(255,75,88,.9) !important; }

/* ---------- identidade visual do piso por boss ---------- */
body.mode-battle[data-boss-type="abominado"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  border-color:#5b4d43 !important;
  background:linear-gradient(145deg,#17191d,#0d1116) !important;
  box-shadow:inset 0 0 38px rgba(110,73,50,.16),0 14px 34px rgba(0,0,0,.32) !important;
}
body.mode-battle[data-boss-type="abominado"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-cracked):not(.tile-rubble) {
  background-color:#12171d !important;
  background-image:
    linear-gradient(132deg,transparent 0 45%,rgba(160,118,88,.12) 46% 48%,transparent 49% 100%),
    linear-gradient(24deg,transparent 0 66%,rgba(116,83,63,.09) 67% 69%,transparent 70% 100%),
    radial-gradient(circle at 24% 22%,rgba(255,255,255,.035),transparent 34%) !important;
}
body.mode-battle[data-boss-type="executor"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  border-color:#633741 !important;
  background:linear-gradient(145deg,#18141a,#0b1118) !important;
  box-shadow:inset 0 0 36px rgba(153,37,50,.12),0 14px 34px rgba(0,0,0,.32) !important;
}
body.mode-battle[data-boss-type="executor"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-execution_line) {
  background-color:#111820 !important;
  background-image:
    linear-gradient(90deg,rgba(133,54,56,.06) 1px,transparent 1px),
    linear-gradient(rgba(133,54,56,.05) 1px,transparent 1px),
    linear-gradient(145deg,#14202a,#0d151d) !important;
  background-size:13px 13px,13px 13px,auto !important;
}
body.mode-battle[data-boss-type="guardia_veu"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  border-color:#485b61 !important;
  background:radial-gradient(circle at 50% 45%,rgba(161,191,194,.09),transparent 48%),linear-gradient(145deg,#101a1c,#091116) !important;
}
body.mode-battle[data-boss-type="guardia_veu"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-web) {
  background-color:#111a1d !important;
  background-image:
    repeating-radial-gradient(ellipse at 20% 80%,transparent 0 8px,rgba(185,208,210,.035) 9px 10px,transparent 11px 17px),
    linear-gradient(145deg,#132027,#0d171d) !important;
}
body.mode-battle[data-boss-type="artilharia"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  border-color:#5b543f !important;
  background:linear-gradient(145deg,#17191d,#0b1016) !important;
}
body.mode-battle[data-boss-type="artilharia"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-crater):not(.tile-artillery_shelter) {
  background-color:#121820 !important;
  background-image:
    linear-gradient(90deg,transparent 48%,rgba(213,178,93,.07) 49% 51%,transparent 52%),
    linear-gradient(transparent 48%,rgba(213,178,93,.06) 49% 51%,transparent 52%),
    radial-gradient(circle at center,rgba(210,183,120,.045) 0 16%,transparent 17%) !important;
}
body.mode-battle[data-boss-type="final"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  border-color:#58456d !important;
  background:radial-gradient(circle at center,rgba(160,112,205,.10),transparent 44%),linear-gradient(145deg,#15131c,#0a0e15) !important;
}
body.mode-battle[data-boss-type="final"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked) {
  background-color:#12151e !important;
  background-image:
    linear-gradient(45deg,transparent 45%,rgba(164,122,255,.045) 46% 48%,transparent 49%),
    linear-gradient(-45deg,transparent 45%,rgba(164,122,255,.04) 46% 48%,transparent 49%),
    radial-gradient(circle at center,rgba(178,142,223,.04) 0 18%,transparent 19%) !important;
}

/* ---------- baixa altura: cartas continuam legíveis, grid usa o restante ---------- */
@media (min-width:901px) and (max-height:660px) {
  :root { --hybrid-hand-h:148px; --hybrid-controls-h:44px; --hybrid-gap:6px; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell .logPanel { padding:9px 10px 10px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .panelHeader { min-height:39px !important; margin-bottom:6px !important; padding-bottom:6px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .title { font-size:15.5px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .log { padding:12px 14px 14px !important; font-size:14.7px !important; line-height:1.52 !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel { padding:7px 8px 5px !important; grid-template-rows:minmax(0,1fr) 30px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel > .arenaGrid {
    width:min(100%,calc(100vh - var(--hybrid-hand-h) - var(--hybrid-controls-h) - 48px),430px) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hudCard { padding:7px 8px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hudHeader { margin-bottom:5px !important; font-size:11.2px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hpTrack { height:11px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveCard { padding:6px 7px 7px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveBody { font-size:9.2px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveProgress { font-size:9px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveDetail { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionSection,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionCards { height:114px !important; }
  body.mode-battle[data-layout-variant="split-clean"][data-choice-step="skill"] .skillCards .cardBtn,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="reaction_pick"] .reactionCards .cardBtn { height:110px !important; min-height:110px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .arenaGrid {
    width:min(76vh,590px,calc(100vw - 350px)) !important;
    height:min(76vh,590px,calc(100vw - 350px)) !important;
    max-width:590px !important;
    max-height:590px !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost > .choicePanel { height:122px !important; min-height:122px !important; max-height:122px !important; }
}

/* ---------- desktop intermediário: preserva o grid antes de encolher narrativa ---------- */
@media (min-width:901px) and (max-width:1120px) {
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #gameShell {
    grid-template-columns:minmax(310px,.66fr) minmax(570px,1.34fr) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel {
    grid-template-columns:minmax(145px,.65fr) minmax(250px,1.55fr) minmax(165px,.72fr) !important;
    gap:6px 7px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) #arenaPanel .hudCard { padding:7px 8px !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveDetail { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"] .objectiveOpportunity { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"]) .logPanel .log { font-size:14.8px !important; }
}

/* ---------- mobile: mantém abas e estrutura vertical ---------- */
@media (max-width:900px) {
  body.mode-story .mobileTabs { display:none !important; }
  body.mode-story .gameShell { height:calc(100vh - 8px) !important; }
  body.mode-story .battleCol { width:100% !important; }
  body.mode-story .logPanel { width:100% !important; min-height:calc(100vh - 112px) !important; padding:12px !important; border-radius:13px !important; }
  body.mode-story #log { padding:18px 17px 22px !important; font-size:16.5px !important; line-height:1.65 !important; }
  body.mode-story #statusLine { font-size:19px !important; }

  body.mode-battle #arenaPanel {
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "player boss"
      "grid grid"
      "legend legend" !important;
    grid-template-rows:auto minmax(280px,auto) auto !important;
    height:auto !important;
    overflow:visible !important;
  }
  body.mode-battle #arenaPanel > .playerHudStack { grid-area:player !important; display:flex !important; flex-direction:column !important; gap:5px !important; min-width:0 !important; }
  body.mode-battle #arenaPanel > .bossHudStack { grid-area:boss !important; display:flex !important; flex-direction:column !important; gap:5px !important; min-width:0 !important; }
  body.mode-battle #arenaPanel > .arenaGrid { grid-area:grid !important; justify-self:center !important; }
  body.mode-battle #arenaPanel > .puzzleCommandHost { grid-column:1 / -1 !important; position:static !important; width:100% !important; }
  body.mode-battle #arenaPanel .arenaInfoBtn { grid-area:legend !important; position:static !important; justify-self:end !important; margin:2px 0 0 !important; }
  body.mode-battle #arenaPanel #tacticalHint { max-height:110px !important; overflow:auto !important; }
  body.mode-battle .hpTrack { height:10px !important; }
  body.mode-battle .secondaryObjectiveHud { max-height:120px !important; overflow:auto !important; }

  body.arena-info-open .legendPanel.arenaLegendOverlay { left:10px !important; right:10px !important; width:auto !important; max-height:78dvh !important; transform:translateY(-50%) !important; }
  body.arena-info-open .legendPanel .arenaLegend { grid-template-columns:1fr !important; }

  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost > .choicePanel {
    position:static !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin-top:5px !important;
    transform:none !important;
  }
}

/* =========================================================
   V15.5.4.2 — ESTABILIZAÇÃO DA HÍBRIDA
   Restaura contratos visuais perdidos na consolidação:
   - minijogo: grid à esquerda, estado + comandos à direita;
   - Regras em faixa própria, sem cobrir texto;
   - Fúria / Técnica Especial / escolhas auxiliares visíveis;
   - nenhum objetivo secundário dentro do minijogo.
   ========================================================= */
@media (min-width:901px) {
  /* ---------- Fúria / Especial: botões reais, nunca colapsados ---------- */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .choicesGrid,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .choicesGrid,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .choicesGrid,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .choicesGrid {
    display:block !important;
    height:122px !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .skillSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .skillCards {
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(132px,1fr)) !important;
    grid-auto-rows:1fr !important;
    gap:6px !important;
    width:100% !important;
    height:118px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .reactionSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .reactionSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .reactionSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .reactionSection {
    display:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .skillCards .cardBtn,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .skillCards .cardBtn,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .skillCards .cardBtn,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .skillCards .cardBtn {
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-width:0 !important;
    height:118px !important;
    min-height:118px !important;
    margin:0 !important;
    padding:8px 9px !important;
    overflow:hidden !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .skillCards .cardTitle,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .skillCards .cardTitle,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .skillCards .cardTitle,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .skillCards .cardTitle {
    font-size:11px !important;
    line-height:1.18 !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury"] .skillCards .cardBody,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-empower"] .skillCards .cardBody,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="special"] .skillCards .cardBody,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="second-skill"] .skillCards .cardBody {
    display:block !important;
    margin-top:5px !important;
    overflow:hidden !important;
    font-size:9.3px !important;
    line-height:1.28 !important;
  }

  /* Troca da Fúria: mão atual em duas áreas, sem esconder cards. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-swap"] .choicesGrid {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
    height:122px !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-swap"] .reactionSection { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-swap"] .skillCards,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-swap"] .equipCards {
    display:flex !important;
    gap:5px !important;
    width:100% !important;
    height:118px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="fury-swap"] .cardBtn {
    flex:0 0 118px !important;
    width:118px !important;
    height:112px !important;
    min-height:112px !important;
    margin:0 !important;
    transform:none !important;
  }

  /* Bombardeio: 25 casas cabem como seletor compacto. */
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .choicesGrid { display:block !important; height:122px !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .equipSection,
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .reactionSection { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .skillCards {
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    grid-template-rows:repeat(5,minmax(0,1fr)) !important;
    gap:3px !important;
    width:100% !important;
    height:118px !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .skillCards .cardBtn {
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    margin:0 !important;
    padding:2px 4px !important;
    transform:none !important;
  }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .skillCards .cardBody { display:none !important; }
  body.mode-battle[data-layout-variant="split-clean"]:not([data-phase="transition_run"])[data-choice-step="target"] .skillCards .cardTitle { font-size:8.7px !important; line-height:1 !important; }

  /* ---------- Minijogo: restaura a composição aprovada ---------- */
  body.mode-battle[data-phase="transition_run"] #gameShell {
    position:relative !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:minmax(0,1fr) 50px !important;
    grid-template-areas:"pstage" "pcontrols" !important;
    gap:6px !important;
    width:100% !important;
    height:calc(100vh - 8px) !important;
    min-height:0 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel {
    grid-area:pstage !important;
    position:relative !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) clamp(300px,25vw,365px) !important;
    grid-template-rows:32px auto minmax(0,1fr) auto !important;
    gap:6px 12px !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    padding:8px 10px !important;
    overflow:hidden !important;
    border:1px solid #2a4057 !important;
    border-radius:14px !important;
    background:radial-gradient(circle at 35% 42%,rgba(43,72,98,.14),transparent 42%),linear-gradient(180deg,#09131f,#07101a) !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .arenaGrid,
  body.mode-battle[data-phase="transition_run"] #arenaPanel.verdictTransitionPanel > .arenaGrid,
  body.mode-battle[data-phase="transition_run"] #arenaPanel.pursuitTransitionPanel > .arenaGrid,
  body.mode-battle[data-phase="transition_run"] #arenaPanel.mazeTransitionPanel > .arenaGrid,
  body.mode-battle[data-phase="transition_run"] #arenaPanel.artilleryTransitionPanel > .arenaGrid,
  body.mode-battle[data-phase="transition_run"] #arenaPanel.circuitTransitionPanel > .arenaGrid {
    position:static !important;
    grid-column:1 !important;
    grid-row:1 / 5 !important;
    align-self:center !important;
    justify-self:center !important;
    width:min(80vh,640px,calc(100vw - 390px)) !important;
    height:min(80vh,640px,calc(100vw - 390px)) !important;
    max-width:640px !important;
    max-height:640px !important;
    margin:0 !important;
    padding:5px !important;
    gap:4px !important;
    transform:none !important;
    aspect-ratio:1/1 !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel.mazeTransitionPanel > .arenaGrid.largeMazeGrid {
    width:min(760px,calc(100vw - 390px),calc(80vh * 1.375)) !important;
    height:auto !important;
    max-width:760px !important;
    max-height:min(76vh,555px) !important;
    aspect-ratio:11/8 !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .playerHudStack {
    position:static !important;
    grid-column:2 !important;
    grid-row:2 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:5px !important;
    width:100% !important;
    min-width:0 !important;
    max-height:100% !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .playerHudStack #secondaryObjectiveHud { display:none !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .bossHudStack {
    position:static !important;
    grid-column:2 !important;
    grid-row:3 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
    width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    max-height:100% !important;
    overflow:hidden !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel #playerHud,
  body.mode-battle[data-phase="transition_run"] #arenaPanel #bossHud,
  body.mode-battle[data-phase="transition_run"] #arenaPanel #furyHud {
    position:static !important;
    display:block !important;
    width:100% !important;
    margin:0 !important;
    transform:none !important;
    flex:0 0 auto !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .hudCard { padding:6px 7px !important; border-radius:9px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .hudHeader { margin-bottom:3px !important; font-size:10.7px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .hpTrack { height:8px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .statusChips { gap:3px !important; margin-top:3px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .statusChip { padding:1px 4px !important; font-size:8.5px !important; }
  body.mode-battle[data-phase="transition_run"] #arenaPanel #tacticalHint {
    position:static !important;
    display:block !important;
    width:100% !important;
    min-height:54px !important;
    max-height:none !important;
    margin:0 !important;
    padding:9px 10px !important;
    overflow:auto !important;
    flex:1 1 auto !important;
    border:1px solid #3b5269 !important;
    border-left:3px solid var(--gdf-gold) !important;
    border-radius:10px !important;
    background:#0a1521 !important;
    color:#e8eef5 !important;
    font-size:11.5px !important;
    line-height:1.40 !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel > .puzzleCommandHost {
    position:static !important;
    grid-column:2 !important;
    grid-row:4 !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
  }
  body.mode-battle[data-phase="transition_run"] #arenaPanel .puzzleCommandHost > .choicePanel {
    position:static !important;
    display:block !important;
    width:100% !important;
    height:136px !important;
    min-height:136px !important;
    max-height:136px !important;
    margin:0 !important;
    padding:5px 6px !important;
    overflow:hidden !important;
    border:1px solid #314961 !important;
    border-radius:10px !important;
    background:linear-gradient(180deg,rgba(10,20,32,.99),rgba(6,12,20,.995)) !important;
    box-shadow:none !important;
    transform:none !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .panelHeader {
    height:20px !important;
    min-height:20px !important;
    margin:0 0 3px !important;
    padding:0 2px !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .eyebrow,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .choiceTools,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .choiceSummary,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .equipSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .reactionSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .skillSection .sub { display:none !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .title {
    font-size:10px !important;
    color:var(--gdf-gold) !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicePanel .title::after { content:none !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .choicesGrid,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillSection,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards {
    width:100% !important;
    height:105px !important;
    margin:0 !important;
    padding:0 !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards {
    display:grid !important;
    grid-template-columns:repeat(4,minmax(54px,1fr)) !important;
    grid-template-rows:repeat(3,30px) !important;
    gap:4px !important;
    align-content:center !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn {
    width:100% !important;
    height:30px !important;
    min-height:30px !important;
    margin:0 !important;
    padding:2px 4px !important;
    overflow:hidden !important;
    transform:none !important;
    border-radius:7px !important;
    box-shadow:none !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardKicker,
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardBody { display:none !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn .cardTitle {
    margin:0 !important;
    overflow:hidden !important;
    font-size:9px !important;
    line-height:1.1 !important;
    text-align:center !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
  }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(1) { grid-column:2 !important; grid-row:1 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(2) { grid-column:1 !important; grid-row:2 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(3) { grid-column:2 !important; grid-row:2 !important; border-color:#987d42 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(4) { grid-column:3 !important; grid-row:2 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(5) { grid-column:2 !important; grid-row:3 !important; }
  body.mode-battle[data-phase="transition_run"] .puzzleCommandHost .skillCards .cardBtn:nth-child(6) { grid-column:4 !important; grid-row:2 !important; }

  /* Regras ocupa sua própria linha: nunca fica em cima da explicação. */
  body.mode-battle[data-phase="transition_run"] #arenaPanel .arenaInfoBtn {
    position:static !important;
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:center !important;
    justify-self:end !important;
    z-index:25 !important;
    min-height:28px !important;
    margin:0 !important;
    padding:4px 10px !important;
    transform:none !important;
  }
  body.mode-battle[data-phase="transition_run"] .topbar {
    grid-area:pcontrols !important;
    position:static !important;
    width:100% !important;
    height:50px !important;
    min-height:50px !important;
    margin:0 !important;
    transform:none !important;
  }
  body.mode-battle[data-phase="transition_run"] #gameShell .logPanel,
  body.mode-battle[data-phase="transition_run"] #gameShell .detailsPanel,
  body.mode-battle[data-phase="transition_run"] #gameShell .mobileMoveDock,
  body.mode-battle[data-phase="transition_run"] #gameShell > .choiceCol > .choicePanel { display:none !important; }
}


/* V15.5.4.3 — minijogo híbrido reorganizado: texto à esquerda, grid ao centro, HUD à direita */
@media (min-width:901px) {
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel {
    grid-template-columns: minmax(290px,.95fr) minmax(320px,1fr) clamp(260px,23vw,320px) !important;
    grid-template-rows: 32px minmax(0,1fr) auto !important;
    gap: 8px 12px !important;
    align-items: stretch !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.verdictTransitionPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.pursuitTransitionPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.mazeTransitionPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.artilleryTransitionPanel > .arenaGrid,
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.circuitTransitionPanel > .arenaGrid {
    grid-column: 2 !important;
    grid-row: 1 / 4 !important;
    width: min(80vh,640px,calc(100vw - 690px)) !important;
    height: min(80vh,640px,calc(100vw - 690px)) !important;
    max-width: 640px !important;
    max-height: 640px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel.mazeTransitionPanel > .arenaGrid.largeMazeGrid {
    width: min(760px,calc(100vw - 690px),calc(80vh * 1.375)) !important;
    max-width: 760px !important;
    max-height: min(76vh,555px) !important;
    height: auto !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel > .playerHudStack {
    grid-column: 3 !important;
    grid-row: 1 / 2 !important;
    align-self: start !important;
    overflow: visible !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel > .bossHudStack {
    grid-column: 1 / 4 !important;
    grid-row: 1 / 4 !important;
    display: contents !important;
    overflow: visible !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel #bossHud {
    grid-column: 3 !important;
    grid-row: 2 !important;
    align-self: start !important;
    width: 100% !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel #tacticalHint {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
    align-self: start !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 11px 12px !important;
    font-size: 12.3px !important;
    line-height: 1.48 !important;
    border-left: 3px solid var(--gdf-gold) !important;
    background: linear-gradient(180deg,#0b1622,#08111a) !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel > .puzzleCommandHost {
    grid-column: 3 !important;
    grid-row: 3 !important;
    align-self: end !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel .puzzleCommandHost > .choicePanel {
    height: 132px !important;
    min-height: 132px !important;
    max-height: 132px !important;
  }
  body.mode-battle[data-layout-variant="split-clean"][data-phase="transition_run"] #arenaPanel .arenaInfoBtn {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: start !important;
    margin-top: 2px !important;
  }
}


/* ---------- V15.5.4.6 — aprofundamento visual dos grids dos bosses (sem alterar geometria) ---------- */
body.mode-battle #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell {
  background-clip: padding-box !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), inset 0 -8px 14px rgba(0,0,0,.14) !important;
}

/* Abominado — mina, trilhos, pó e rachaduras */
body.mode-battle[data-boss-type="abominado"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  background-image:
    linear-gradient(90deg, transparent 0 8%, rgba(123,95,73,.07) 9% 10%, transparent 11% 89%, rgba(123,95,73,.05) 90% 91%, transparent 92% 100%),
    linear-gradient(145deg,#17191d,#0d1116) !important;
}
body.mode-battle[data-boss-type="abominado"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-cracked):not(.tile-rubble) {
  border-color:#3d342c !important;
  background-image:
    linear-gradient(148deg, transparent 0 46%, rgba(140,105,79,.15) 47% 49%, transparent 50% 100%),
    linear-gradient(34deg, transparent 0 70%, rgba(95,72,55,.12) 71% 73%, transparent 74% 100%),
    radial-gradient(circle at 24% 22%, rgba(244,219,182,.05), transparent 28%),
    radial-gradient(circle at 76% 78%, rgba(93,74,58,.16), transparent 30%),
    linear-gradient(145deg,#171f27,#0f141b) !important;
}
body.mode-battle[data-boss-type="abominado"] .arenaCell.tile-cracked {
  border-color:#574238 !important;
  background-image:
    linear-gradient(155deg, transparent 0 38%, rgba(205,165,127,.2) 39% 41%, transparent 42% 100%),
    linear-gradient(28deg, transparent 0 52%, rgba(164,124,95,.17) 53% 55%, transparent 56% 100%),
    linear-gradient(92deg, transparent 0 72%, rgba(110,82,66,.13) 73% 75%, transparent 76% 100%),
    radial-gradient(circle at 50% 48%, rgba(0,0,0,.16), transparent 60%),
    linear-gradient(145deg,#2a2328,#101721) !important;
}
body.mode-battle[data-boss-type="abominado"] .arenaCell.tile-rubble {
  border-color:#59483a !important;
  background-image:
    radial-gradient(circle at 26% 30%, rgba(152,123,95,.24) 0 9%, transparent 10%),
    radial-gradient(circle at 62% 55%, rgba(96,80,68,.28) 0 12%, transparent 13%),
    radial-gradient(circle at 78% 26%, rgba(132,107,86,.18) 0 8%, transparent 9%),
    linear-gradient(145deg,#34373e,#151a21) !important;
}

/* Executor — placas metálicas, juntas e energia carmesim */
body.mode-battle[data-boss-type="executor"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  background-image:
    linear-gradient(90deg, rgba(94,48,55,.08) 0 1px, transparent 1px 100%),
    linear-gradient(rgba(94,48,55,.06) 0 1px, transparent 1px 100%),
    linear-gradient(145deg,#18141a,#0b1118) !important;
  background-size: 18px 18px,18px 18px,auto !important;
}
body.mode-battle[data-boss-type="executor"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-execution_line) {
  border-color:#4c3036 !important;
  background-image:
    linear-gradient(90deg, rgba(149,84,92,.07) 0 1px, transparent 1px 100%),
    linear-gradient(rgba(149,84,92,.05) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.04) 0 5%, transparent 6%),
    radial-gradient(circle at 82% 82%, rgba(255,255,255,.03) 0 4%, transparent 5%),
    linear-gradient(145deg,#16212b,#0d151d) !important;
  background-size: 12px 12px,12px 12px,auto,auto,auto !important;
}
body.mode-battle[data-boss-type="executor"] .arenaCell.tile-execution_line {
  border-color:#7e303e !important;
  background-image:
    linear-gradient(90deg, rgba(195,46,60,.42), rgba(255,92,104,.18) 18%, #121821 50%, rgba(255,92,104,.18) 82%, rgba(195,46,60,.42)),
    linear-gradient(rgba(255,255,255,.03),rgba(0,0,0,.05)) !important;
  box-shadow: inset 0 0 14px rgba(196,42,58,.25), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Guardiã — fibras, umidade e trama orgânica */
body.mode-battle[data-boss-type="guardia_veu"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  box-shadow: inset 0 0 42px rgba(124,157,159,.11),0 14px 34px rgba(0,0,0,.32) !important;
}
body.mode-battle[data-boss-type="guardia_veu"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-web) {
  border-color:#355059 !important;
  background-image:
    repeating-radial-gradient(ellipse at 18% 82%, transparent 0 7px, rgba(193,217,219,.05) 8px 9px, transparent 10px 17px),
    linear-gradient(62deg, transparent 0 58%, rgba(132,163,165,.08) 59% 60%, transparent 61% 100%),
    linear-gradient(145deg,#132027,#0d171d) !important;
}
body.mode-battle[data-boss-type="guardia_veu"] .arenaCell.tile-web {
  border-color:#516f79 !important;
  background-image:
    radial-gradient(circle at center, rgba(216,233,236,.19), transparent 38%),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 7px, rgba(218,231,234,.08) 8px 9px, transparent 10px 15px),
    linear-gradient(145deg,#101821,#0b1218) !important;
}

/* Artilharia — grade de mira, pó queimado e impacto */
body.mode-battle[data-boss-type="artilharia"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  background-image:
    linear-gradient(90deg, transparent 48%, rgba(213,178,93,.08) 49% 51%, transparent 52%),
    linear-gradient(transparent 48%, rgba(213,178,93,.07) 49% 51%, transparent 52%),
    radial-gradient(circle at 50% 50%, rgba(210,183,120,.05) 0 14%, transparent 15%),
    linear-gradient(145deg,#17191d,#0b1016) !important;
}
body.mode-battle[data-boss-type="artilharia"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked):not(.tile-crater):not(.tile-artillery_shelter) {
  border-color:#4f4835 !important;
  background-image:
    linear-gradient(90deg, transparent 48%, rgba(219,186,112,.07) 49% 51%, transparent 52%),
    linear-gradient(transparent 48%, rgba(219,186,112,.06) 49% 51%, transparent 52%),
    radial-gradient(circle at 72% 28%, rgba(255,215,148,.04), transparent 20%),
    linear-gradient(145deg,#141c25,#0f151d) !important;
}
body.mode-battle[data-boss-type="artilharia"] .arenaCell.tile-crater {
  border-color:#5c4539 !important;
  background-image:
    radial-gradient(circle at center, #05070b 0 22%, #1d171c 23% 33%, #3e2f35 34% 41%, #111721 62%),
    radial-gradient(circle at 40% 34%, rgba(255,188,98,.12), transparent 28%) !important;
  box-shadow: inset 0 0 16px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,166,90,.08) !important;
}
body.mode-battle[data-boss-type="artilharia"] .arenaCell.tile-artillery_shelter {
  border-color:#5b543f !important;
  background-image:
    radial-gradient(circle at center, #080b10 0 29%, #2e2a22 30% 38%, #544c37 39% 44%, #111721 72%),
    linear-gradient(145deg, rgba(255,220,146,.05), rgba(0,0,0,0)) !important;
}

/* Arquiteto — runas, diagonais e condução do vazio */
body.mode-battle[data-boss-type="final"] #arenaPanel > .arenaGrid:not(.transitionGrid) {
  box-shadow: inset 0 0 44px rgba(137,92,191,.12),0 14px 34px rgba(0,0,0,.32) !important;
}
body.mode-battle[data-boss-type="final"] #arenaPanel > .arenaGrid:not(.transitionGrid) .arenaCell:not(.threat):not(.blocked) {
  border-color:#443857 !important;
  background-image:
    linear-gradient(45deg, transparent 45%, rgba(164,122,255,.065) 46% 48%, transparent 49%),
    linear-gradient(-45deg, transparent 45%, rgba(164,122,255,.055) 46% 48%, transparent 49%),
    radial-gradient(circle at center, rgba(178,142,223,.055) 0 16%, transparent 17%),
    linear-gradient(145deg,#151922,#0f131b) !important;
}
body.mode-battle[data-boss-type="final"] .arenaCell.architectConduit {
  box-shadow: inset 0 0 0 1px rgba(179,126,255,.18), inset 0 0 14px rgba(131,82,215,.18), 0 0 7px rgba(129,78,211,.08) !important;
}

/* ======================================================
   V15.5.4.15 — Guardiã do Véu: Rede Reativa
   O estado é legível por forma + texto, nunca só por cor.
   ====================================================== */
.mazeDistributor {
  border-color:#9c763f !important;
  background:
    radial-gradient(circle at center,rgba(207,161,82,.18),transparent 54%),
    linear-gradient(145deg,#282318,#111713) !important;
}
.mazeBronzeRing {
  position:absolute;
  z-index:2;
  width:58%;
  aspect-ratio:1;
  border:4px solid #b88645;
  border-left-color:#694522;
  border-radius:50%;
  box-shadow:inset 0 0 0 3px rgba(244,201,118,.12),0 0 9px rgba(214,159,75,.22);
}
.mazeBronzeRing::before,
.mazeBronzeRing::after {
  content:"";
  position:absolute;
  left:50%;
  top:-18%;
  width:3px;
  height:136%;
  background:#9f733b;
  transform:translateX(-50%);
}
.mazeBronzeRing::after { transform:translateX(-50%) rotate(90deg); }
.mazeBronzeRing span {
  position:absolute;
  inset:32%;
  z-index:1;
  border-radius:50%;
  background:#d2a45f;
  box-shadow:0 0 0 3px #3f2a18;
}
.mazeDistributorReady {
  border-color:#f0c36f !important;
  box-shadow:inset 0 0 0 2px rgba(240,195,111,.30),0 0 13px rgba(240,195,111,.30) !important;
}
.mazeDistributorReady .mazeBronzeRing { transform:rotate(22deg); }

.mazeReactiveGate { overflow:hidden; }
.mazeGateVisual {
  position:absolute;
  inset:4% 16% 16%;
  display:flex;
  justify-content:space-between;
  gap:3px;
  border-top:4px solid #7e9c92;
}
.mazeGateVisual i {
  display:block;
  width:5px;
  height:88%;
  background:linear-gradient(180deg,#b9d0c8,#536b63);
  box-shadow:0 0 0 1px rgba(224,239,233,.18);
  transform-origin:top;
  transition:transform .22s ease,opacity .22s ease;
}
.mazeGateClosed {
  border-color:#79938b !important;
  background:
    repeating-linear-gradient(65deg,rgba(210,227,220,.12) 0 3px,transparent 4px 9px),
    linear-gradient(145deg,#24332e,#0d1613) !important;
}
.mazeGateClosed .mazeGateVisual i { transform:scaleY(1); opacity:1; }
.mazeGateOpen {
  border-color:#497b63 !important;
  background:
    linear-gradient(90deg,rgba(113,191,150,.15),transparent 25% 75%,rgba(113,191,150,.15)),
    linear-gradient(145deg,#123023,#0b1813) !important;
}
.mazeGateOpen .mazeGateVisual i:nth-child(1) { transform:translateX(-12px) scaleY(.34); opacity:.45; }
.mazeGateOpen .mazeGateVisual i:nth-child(2) { transform:scaleY(.22); opacity:.24; }
.mazeGateOpen .mazeGateVisual i:nth-child(3) { transform:translateX(12px) scaleY(.34); opacity:.45; }
.mazeGateWillOpen {
  border-color:#87dfaa !important;
  box-shadow:inset 0 0 0 2px rgba(135,223,170,.30),0 0 12px rgba(135,223,170,.22) !important;
}
.mazeGateWillClose {
  border-color:#efb35e !important;
  box-shadow:inset 0 0 0 2px rgba(239,179,94,.28),0 0 12px rgba(239,179,94,.20) !important;
}
.mazeGateWillOpen .tileWord { color:#aaf1c4; font-weight:900; }
.mazeGateWillClose .tileWord { color:#ffd08a; font-weight:900; }

@media (max-width:900px) {
  .mazeGrid.largeMazeGrid .mazeBronzeRing { border-width:3px; }
  .mazeGrid.largeMazeGrid .mazeGateVisual { inset:3% 20% 18%; gap:2px; border-top-width:3px; }
  .mazeGrid.largeMazeGrid .mazeGateVisual i { width:3px; }
  .mobileMoveButtons .mobileNetworkShift {
    grid-column:1 / -1;
    min-height:44px;
    font-size:11px;
    letter-spacing:.05em;
  }
}

@media (prefers-reduced-motion:reduce) {
  .mazeGateVisual i { transition:none; }
}

body.mode-battle[data-boss-type="guardia_veu"][data-phase="transition_run"] .arenaPanel.mazeTransitionPanel .puzzleCommandHost .skillCards .cardBtn:nth-child(7) {
  grid-column:3 / 5 !important;
  grid-row:3 !important;
  border-color:#e1ae5a !important;
  background:linear-gradient(180deg,rgba(82,59,27,.96),rgba(47,34,19,.98)) !important;
}

/* V15.5.4.18 — Arquiteto: leitura dos quatro anéis integrada ao tabuleiro. */
.integrationVoidWarning {
  border-color:#d7a65d !important;
  background:repeating-linear-gradient(135deg,rgba(227,178,93,.18) 0 5px,rgba(24,18,26,.72) 5px 10px) !important;
  box-shadow:inset 0 0 0 2px rgba(255,210,125,.28),0 0 12px rgba(230,170,80,.18);
}
.integrationRewriteWarning,.integrationPredictionWord,.integrationPlateWord,.integrationIntentWord,.integrationSourceWord {
  position:absolute;left:4px;right:4px;bottom:3px;z-index:6;text-align:center;
  font-size:8px;line-height:1.05;font-weight:900;letter-spacing:.05em;color:#ffe0a3;
  text-shadow:0 1px 2px #08070a;
}
.integrationPredictionCell { box-shadow:inset 0 0 0 2px rgba(139,207,255,.52),0 0 15px rgba(88,176,237,.28) !important; }
.integrationPredictionArrow { position:absolute;inset:7% 0 auto;z-index:6;text-align:center;font-size:24px;color:#a8ddff;text-shadow:0 0 8px #4aa9e8; }
.integrationPredictionWord { color:#bfe8ff; }
.integrationPlate { background:radial-gradient(circle,rgba(203,158,83,.26),rgba(44,36,42,.9) 63%) !important; }
.integrationArchivePlate { border-color:#e8b668 !important;box-shadow:inset 0 0 0 2px rgba(232,182,104,.26) !important; }
.integrationAlternativePlate { border-color:#76c6b4 !important;box-shadow:inset 0 0 0 2px rgba(118,198,180,.25) !important; }
.integrationPlateGlyph { position:absolute;inset:7% 0 auto;text-align:center;font-size:27px;color:#f2cc86; }
.integrationAlternativePlate .integrationPlateGlyph { color:#92e1ce; }
.integrationPlateWord { color:#f7d99f; }
.integrationAlternativePlate .integrationPlateWord { color:#a8eadb; }
.integrationCounterweightCell { overflow:visible !important; }
.integrationCounterweight { position:absolute;inset:13%;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid #cb8f4c;border-radius:7px;background:linear-gradient(145deg,#7b4d29,#3b2519);box-shadow:0 5px 0 #261711,0 0 10px rgba(226,158,76,.28);color:#ffe0a0;font-weight:900; }
.integrationCounterweight span { font-size:22px;line-height:1; }.integrationCounterweight small { font-size:8px; }
.integrationWall { background:linear-gradient(145deg,#2d333b,#11151a) !important;border-color:#65717e !important; }
.integrationWallBars { position:absolute;inset:12%;background:repeating-linear-gradient(90deg,#81909c 0 4px,#263039 4px 11px);opacity:.72; }
.integrationDistributor { border-color:#d9a55f !important;background:radial-gradient(circle,#6f4b28,#181d20 67%) !important; }
.integrationNetworkGate { overflow:hidden; }
.integrationGateBars { position:absolute;inset:5% 18%;border-top:4px solid #8eb4a8;background:repeating-linear-gradient(90deg,#9abfb3 0 4px,transparent 4px 11px);transition:transform .2s ease,opacity .2s ease; }
.integrationGateClosed { border-color:#8ba89f !important;background:#17241f !important; }
.integrationGateOpen { border-color:#67c08f !important;background:linear-gradient(90deg,rgba(96,191,139,.2),#102018,rgba(96,191,139,.2)) !important; }
.integrationGateOpen .integrationGateBars { transform:scaleY(.23);opacity:.28; }
.integrationRoad { background-color:rgba(95,116,127,.17) !important; }
.integrationRoad::after { content:"";position:absolute;inset:0 43%;z-index:0;background:repeating-linear-gradient(180deg,rgba(203,219,222,.36) 0 6px,transparent 6px 12px); }
.integrationEmbankment { background-image:radial-gradient(circle at 25% 30%,rgba(158,116,69,.22),transparent 34%) !important; }
.integrationIntentWord { bottom:3px;color:#ffd48b; }.integrationSourceWord { top:3px;bottom:auto;color:#ff9f82; }
.integrationPredictedAim { border-color:#82ccff !important;box-shadow:inset 0 0 0 2px rgba(100,193,255,.3),0 0 14px rgba(70,174,242,.32) !important; }
.integrationFixedAim { border-color:#ef9b67 !important; }
.integrationExitLocked { filter:saturate(.38);opacity:.72; }

@media (max-width:900px) {
  .integrationRewriteWarning,.integrationPredictionWord,.integrationPlateWord,.integrationIntentWord,.integrationSourceWord { font-size:8px;line-height:1.1;letter-spacing:0; }
  .integrationPredictionArrow,.integrationPlateGlyph { font-size:18px; }
  .integrationCounterweight { inset:10%; }.integrationCounterweight span { font-size:17px; }.integrationCounterweight small { font-size:8px; }
}

@media (prefers-reduced-motion:reduce) { .integrationGateBars { transition:none; } }
