/* =========================================================
   RESPONSIVE / LAYOUT-01 — 2026-09-11
   Patch sistêmico e escopado: interação pública, Explorar,
   Solo compacto e arena Batalha compacta. Sem mecânica.
   ========================================================= */

/* Interface pública: evita seleção/callout acidental. Campos editáveis e
   opt-out explícito preservam interação nativa e deixam Admin futuro livre. */
body:is([data-mode="solo"],[data-mode="training"],[data-mode="legacyTraining"],[data-mode="battle"],[data-mode="explore"],[data-mode="kids"],[data-mode="events"]) .app-shell,
body:is([data-mode="solo"],[data-mode="training"],[data-mode="legacyTraining"],[data-mode="battle"],[data-mode="explore"],[data-mode="kids"],[data-mode="events"]) > dialog{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
body:is([data-mode="solo"],[data-mode="training"],[data-mode="legacyTraining"],[data-mode="battle"],[data-mode="explore"],[data-mode="kids"],[data-mode="events"]) :is(input,textarea,select,[contenteditable="true"],[data-native-text-interaction]){
  -webkit-user-select:text!important;
  user-select:text!important;
  -webkit-touch-callout:default!important;
}

/* Explorar: no fullscreen, altura/padding seguem a necessidade real do board.
   O valor é alimentado pelo layout medido; desktop não herda 120px móveis. */
html:fullscreen body[data-mode="explore"] .explore-layer{
  padding-bottom:0!important;
}
html:fullscreen body[data-mode="explore"] .explore-board{
  min-height:var(--explore-min-height,100%)!important;
  box-sizing:border-box;
}
@media(max-width:900px){
  html:fullscreen body[data-mode="explore"] .explore-layer{
    padding-bottom:120px!important;
  }
}

/* Solo: quando a altura útil de notebook é curta, reserva uma faixa real
   entre o console GIRAR e o HUD sem transformar desktop em layout mobile. */
@media(min-width:901px) and (max-height:740px){
  body[data-mode="solo"] .solo-layer .single-card-zone{
    top:35.5%!important;
  }
  body[data-mode="solo"] .solo-layer .active-card-slot{
    width:min(30vw,360px)!important;
    height:min(26.25vw,315px)!important;
  }
  body[data-mode="solo"] .rotate-console{
    height:48px;
  }
}

/* Batalha: a arena é a unidade responsiva. Antes do mobile, painéis laterais
   cedem largura para a coluna central em vez de comprimir a carta. */
@media(min-width:901px) and (max-width:1366px){
  body[data-mode="battle"] .battle-layout{
    grid-template-columns:minmax(300px,27vw) minmax(410px,1fr) minmax(300px,27vw);
    gap:18px;
    padding:18px 22px;
  }
}

/* =========================================================
   RESPONSIVE / LAYOUT-02 — 2026-09-12
   Desktop compacto por altura útil: Solo + Batalha somente.
   ========================================================= */
@media (min-width:901px) and (max-height:820px){
  body[data-mode="solo"] .solo-layer .single-card-zone{
    top:39%!important;
  }
  body[data-mode="solo"] .solo-layer .active-card-slot{
    width:44.5dvh!important;
    height:39dvh!important;
  }
  body[data-mode="solo"] .single-card-handle.rotation-hint.solo-rotate-hud{
    top:calc(100% + 8px)!important;
  }
  body[data-mode="solo"] .rotate-console{
    height:48px;
  }

  body[data-mode="battle"] .battle-center .battle-card-zone{
    top:37.5%!important;
  }
  body[data-mode="battle"] .battle-center .battle-card-zone .active-card-slot{
    width:33dvh!important;
    height:29dvh!important;
  }

  /* Painel compacto: devolve largura real ao apelido sem tocar na arena,
     cartas, deck ou recursos. O desktop amplo mantém os valores originais. */
  body[data-mode="battle"] .player-panel-inner,
  body[data-mode="battle"] .player-panel.right .player-panel-inner{
    grid-template-columns:minmax(0,1fr) 106px;
    gap:8px;
  }
  body[data-mode="battle"] .player-panel.right .player-panel-inner{
    grid-template-columns:106px minmax(0,1fr);
  }
  body[data-mode="battle"] .player-avatar-hero,
  body[data-mode="battle"] .player-panel.right .player-avatar-hero{
    width:112px;
    height:112px;
    transform:translateX(6px);
  }
  body[data-mode="battle"] .player-panel.right .player-avatar-hero{
    transform:translateX(-6px);
  }
  body[data-mode="battle"] .player-title{
    font-size:clamp(17px,1.55vw,20px);
    gap:6px;
  }
  body[data-mode="battle"] .player-title .avatar-badge{
    width:32px;
    height:32px;
  }
  body[data-mode="battle"] .player-title .turn-time{
    min-width:36px;
    height:32px;
    padding:0 7px;
    font-size:18px;
  }
  body[data-mode="battle"] .player-name{
    flex:1 1 8ch;
    min-width:8ch;
  }
}

/* Altura realmente curta: contém o conjunto Solo sem alterar HUD/deck. */
@media (min-width:901px) and (max-height:740px){
  body[data-mode="solo"] .solo-layer .single-card-zone{
    top:37%!important;
  }
  body[data-mode="solo"] .solo-layer .active-card-slot{
    width:42.8dvh!important;
    height:37.5dvh!important;
  }
}