/* Tela principal PC 1280×800 — layout do mockup da Arte (web-assets/mockups/tela_principal/pc_1280.css).
 * Ativa com html.layout-novo.tp-1280 (tela-principal-ui.js, largura ≥1024). Nada fica sobre o mapa:
 * Local + painel único à esquerda, Diário (abas horizontais) + baralhos à direita, Mochila + ações embaixo.
 * Painel de infraestrutura: infra-painel-1280.css. Não altera arte de cartas nem do mapa. */
html.tp-1280 {
  --tp-topo: 40px; --tp-gap: 8px; --tp-esq: 194px; --tp-dir: 228px; --tp-doca: 128px;
  --tp-local-h: 154px; --tp-abas-h: 51px; /* abas ≥44 px de toque (B-touch-44) */ --tp-baralhos-h: 104px;
  --tp-meio-top: calc(var(--tp-topo) + var(--tp-gap));
  --tp-meio-bottom: calc(var(--tp-doca) + var(--tp-gap) * 2);
}
html.tp-1280 #tela-jogo:not(.oculto) {
  background:
    repeating-linear-gradient(135deg, rgba(139,69,24,.07) 0 7px, transparent 7px 14px),
    radial-gradient(ellipse at 50% 40%, #1d1912 0%, #0c0a08 75%);
}

/* —— Topo compacto numa linha: Rodada, Fase, Integridade, Recursos, Corvos, Rei, Turno · zoom · Som · Menu —— */
html.tp-1280 #tela-jogo > .topo {
  height: var(--tp-topo); box-sizing: border-box; padding: 0 10px; gap: 8px; flex-wrap: nowrap;
  display: flex; align-items: center;
  background: linear-gradient(180deg, rgba(20,17,13,.98), rgba(12,10,8,.96));
}
html.tp-1280 #tela-jogo > .topo .topo__titulo { font-size: 12px; }
html.tp-1280 #tela-jogo > .topo .status { flex-wrap: nowrap; gap: 6px; font-size: 11px; min-width: 0; overflow: hidden; }
html.tp-1280 .topo .ln-stat { font-size: 11px; padding: 2px 8px 2px 3px; white-space: nowrap; }
html.tp-1280 .topo .ln-stat__ico { width: 16px; height: 16px; font-size: 9px; }
html.tp-1280 .topo [data-stat="energia"], html.tp-1280 .topo [data-stat="barricadas"] { display: none !important; }
html:not(.tp-1280) .tp-stat-turno, html:not(.tp-1280) .tp-topo__zoom { display: none !important; }
html.tp-1280 .tp-topo__zoom { display: inline-flex; gap: 4px; flex: 0 0 auto; }
html.tp-1280 .tp-zoom {
  width: 28px; height: 28px; padding: 0; border-radius: 6px; cursor: pointer;
  display: inline-grid; place-items: center; color: #e8dcc0; background: #2a241a; border: 1px solid var(--ln-metal);
}
html.tp-1280 .tp-zoom:disabled { opacity: .4; cursor: default; }
html.tp-1280 #btn-mudo-jogo { width: 30px; height: 28px; padding: 0; font-size: 13px; border-radius: 6px;
  background: #1a1610; color: var(--ln-texto); border: 1px solid var(--ln-metal); flex: 0 0 auto; }
html.tp-1280 #btn-menu-jogo { padding: 5px 10px; font-size: 11px; flex: 0 0 auto; }

/* —— Mapa: janela central com recorte, proporção nativa 1492:1054 (contain, sem distorção) —— */
html.tp-1280 #painel-mapa {
  inset: auto;
  left: calc(var(--tp-esq) + var(--tp-gap) * 2); right: calc(var(--tp-dir) + var(--tp-gap) * 2);
  top: var(--tp-meio-top); bottom: var(--tp-meio-bottom);
  overflow: hidden; border-radius: 8px; border: 2px solid #3a3326; box-sizing: border-box;
  box-shadow: 0 0 0 1px #0a0806, inset 0 0 0 1px rgba(201,162,39,.18), 0 10px 30px rgba(0,0,0,.6);
  background: #12100c; container-type: size;
}
html.tp-1280 #painel-mapa::after { background: radial-gradient(ellipse at 50% 48%, transparent 60%, rgba(8,6,4,.3) 100%); }
html.tp-1280 #box-mapa .mapa-viewport {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; overflow: hidden;
  max-height: none; border: 0; border-radius: 0;
}
html.tp-1280 #box-mapa .mapa-stage {
  flex: 0 0 auto; position: relative;
  width: min(100cqw, calc(100cqh * 1492 / 1054)); height: auto; aspect-ratio: 1492 / 1054;
  transition: transform .18s ease-out;
}
html.tp-1280.tp-mapa-zoom #box-mapa .mapa-viewport { cursor: grab; }
html.tp-1280 #box-mapa .mapa-wrap { width: 100%; height: 100%; }
html.tp-1280 #box-mapa .mapa-img { width: 100%; height: 100%; object-fit: fill; }
html.tp-1280 #box-mapa > .mapa-legenda:not(#mapa-legenda) { display: none; }
html.tp-1280 #box-mapa #mapa-legenda { left: 8px; bottom: 8px; max-width: 60%; font-size: 10px; }
html.tp-1280 #box-mapa #mapa-legenda:empty { display: none; }
html.tp-1280 .ln-retrato { width: 44px; height: 44px; }
html.tp-1280 .ln-retrato__nome { font-size: 9px; }

/* —— Coluna esquerda: Local atual no alto (o painel único fica abaixo) —— */
html.tp-1280 #ln-local-flutuante.ln-local {
  left: var(--tp-gap); top: var(--tp-meio-top); width: var(--tp-esq); height: var(--tp-local-h);
  box-sizing: border-box; padding: 6px; border-radius: 10px; overflow: hidden;
  display: grid; grid-template-columns: 100px 1fr; grid-template-rows: auto 1fr; column-gap: 8px; row-gap: 5px;
  background: linear-gradient(160deg, rgba(40,34,26,.96), rgba(14,12,10,.96));
}
html.tp-1280 #ln-local-flutuante .ln-local__tag { position: static; grid-column: 2; grid-row: 1; justify-self: start; font-size: 8px; padding: 2px 5px; }
html.tp-1280 #ln-local-flutuante .ln-local__carta { grid-column: 1; grid-row: 1 / span 2; width: 100px; aspect-ratio: 5 / 7; border-radius: 6px; overflow: hidden;
  border: 1px solid rgba(196,184,150,.3); background: #12100c; }
html.tp-1280 #ln-local-flutuante .ln-local__carta .carta { width: 100%; height: 100%; }
html.tp-1280 #ln-local-flutuante .ln-local__carta .carta-rail,
html.tp-1280 #ln-local-flutuante .ln-local__carta .btn-hab-carta { display: none !important; }
html.tp-1280 #ln-local-flutuante.tp-local--sem-carta .ln-local__carta::before {
  content: "Último Refúgio"; display: grid; place-items: center; height: 100%; padding: 6px; box-sizing: border-box;
  font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; text-align: center; color: var(--ln-muted);
  background: repeating-linear-gradient(135deg, rgba(139,69,24,.12) 0 6px, transparent 6px 12px);
}
html.tp-1280 .tp-local__info { grid-column: 2; grid-row: 2; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
html.tp-1280 .tp-local__nome { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; line-height: 1.15; color: var(--ln-texto); overflow-wrap: anywhere; }
html.tp-1280 .tp-local__linha { font-size: 9.5px; color: var(--ln-muted); line-height: 1.3; }
html.tp-1280 .tp-local__linha b { color: var(--ln-texto); }
html.tp-1280 .tp-local__lupa { width: 26px; height: 26px; padding: 0; border-radius: 6px; cursor: pointer; margin-top: 2px;
  display: inline-grid; place-items: center; color: #e8dcc0; background: #1a1610; border: 1px solid var(--ln-metal); }

/* —— Coluna direita: abas horizontais Diário | Inventário, Diário e baralhos —— */
html.tp-1280 #ln-tabs {
  right: var(--tp-gap); top: var(--tp-meio-top); bottom: auto; width: var(--tp-dir); height: var(--tp-abas-h);
  flex-direction: row; gap: 2px; padding: 5px 5px 0; box-sizing: border-box;
  background: rgba(14,12,10,.94); border: 2px solid var(--ln-metal); border-bottom: 0; border-radius: 10px 10px 0 0;
}
html.tp-1280 #ln-tabs .ln-tab[data-ln-panel="mao"] { display: none; }
html.tp-1280 #ln-tabs .ln-tab {
  writing-mode: horizontal-tb; transform: none; flex: 1; min-width: 0; min-height: 0; height: 100%;
  padding: 4px 2px; text-align: center; font-size: 11px; letter-spacing: .04em;
  border: 1px solid rgba(110,101,82,.5); border-bottom: 0; border-radius: 6px 6px 0 0; background: rgba(30,26,20,.8);
}
html.tp-1280 #ln-tabs .ln-tab[aria-pressed="true"] { color: var(--ln-perigo); background: rgba(46,38,24,.98); border-color: rgba(201,162,39,.6); }
html.tp-1280 #painel-diario, html.tp-1280 #painel-sobreviventes.ln-aberto {
  right: var(--tp-gap); left: auto; width: var(--tp-dir); max-height: none; box-sizing: border-box;
  top: calc(var(--tp-meio-top) + var(--tp-abas-h));
  bottom: calc(var(--tp-meio-bottom) + var(--tp-baralhos-h) + var(--tp-gap));
  border-radius: 0 0 10px 10px; border-top: 2px solid transparent;
  border-image: none;
}
html.tp-1280 #painel-diario { display: flex; flex-direction: column; }
html.tp-1280 #painel-diario.ln-recolhido { display: none; }
html.tp-1280 #painel-diario > .ln-painel__cab { display: none; }
html.tp-1280 #painel-diario .ln-diario-body { max-height: none; flex: 1 1 auto; min-height: 0; }
html.tp-1280 #painel-diario .guia-mestre { font-size: 11px; line-height: 1.45; padding: .8rem .75rem; border-width: 10px; border-image-width: 10px; }
html.tp-1280 #painel-diario .log { max-height: none; font-size: 10px; }
html.tp-1280 #painel-ordens-aliado { padding: 6px 8px; font-size: 10.5px; line-height: 1.35; }
html.tp-1280 #painel-ordens-aliado p, html.tp-1280 #painel-ordens-aliado .sub { font-size: 10.5px; margin: 0 0 4px; }
html.tp-1280 #painel-ordens-aliado .ordens-aliado button { min-height: 30px; font-size: 10px; }
html.tp-1280 #painel-sobreviventes.ln-aberto { overflow: auto; z-index: 25; }
html.tp-1280 #painel-sobreviventes .personagem-row { flex-wrap: wrap; }

html.tp-1280 .ln-baralhos {
  left: auto; right: var(--tp-gap); top: auto; bottom: var(--tp-meio-bottom);
  width: var(--tp-dir); height: var(--tp-baralhos-h); box-sizing: border-box;
}
html.tp-1280 .ln-baralhos__cab { display: none; }
html.tp-1280 .ln-baralhos__lista { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; padding: 5px; height: 100%; box-sizing: border-box; }
html.tp-1280 .ln-baralho { padding: 2px 1px; min-width: 0; }
html.tp-1280 .ln-baralho__verso { width: 34px; height: 48px; }
html.tp-1280 .ln-baralho__nome { font-size: 8px; }
html.tp-1280 .ln-baralho__cont { font-size: 8.5px; }

/* —— Doca inferior: Mochila + ações (a Mochila termina onde começam as ações) —— */
html.tp-1280 #painel-mao {
  left: var(--tp-gap); right: calc(var(--tp-acoes-w, 430px) + var(--tp-gap) * 2); bottom: var(--tp-gap);
  height: var(--tp-doca); border-radius: 10px;
}
html.tp-1280 #painel-mao .ln-painel__cab { min-height: 22px; padding: 3px 10px; }
html.tp-1280 #painel-mao .ln-painel__cab h2 { font-size: 10.5px; }
html.tp-1280 #box-mao { padding: 4px 10px 6px; gap: 8px; align-items: flex-start; }
html.tp-1280 #box-mao .carta { height: 90px; min-height: 0; width: auto; aspect-ratio: 5 / 7; padding: 0; margin-right: 58px; border-radius: 6px; }
html.tp-1280 #box-mao .carta > .overlay-info { display: none; } /* a arte da carta já traz nome e texto; Ver/Hab. ficam no trilho */
html.tp-1280 #acoes.ln-acoes, html.tp-1280 #acoes {
  left: auto; right: var(--tp-gap); bottom: var(--tp-gap); transform: none;
  height: var(--tp-doca); box-sizing: border-box; align-items: center; gap: 4px; padding: 10px 10px 8px; border-radius: 12px;
}
html.tp-1280 #acoes > button { width: 60px; min-width: 56px; font-size: 9px; }
html.tp-1280 #acoes > button .ln-acao-ico { width: 42px; height: 42px; }

/* Pós-Rei / Infinito: canto superior da janela do mapa (o Local e o painel ocupam a coluna esquerda). */
html.tp-1280 #painel-pos-rei:not(.oculto) { left: calc(var(--tp-esq) + var(--tp-gap) * 3); top: calc(var(--tp-meio-top) + var(--tp-gap)); }
html.tp-1280 #ln-local-flutuante .ln-local__carta .carta { min-height: 0; padding: 0; border: 0; border-radius: 0; }
html.tp-1280 #ln-local-flutuante .ln-local__carta .carta > .overlay-info { display: none; }
/* Balão de ordens do aliado no mapa (só visual, sem clique) cobria rótulos de região na janela menor:
   no PC 1280 fica só o chip com a ordem atual; as ordens continuam clicáveis no Diário. */
html.tp-1280 .mapa-wrap .ln-retratos-host .ln-ordens { display: none; }
html.tp-1280 .mapa-wrap .ln-retratos-host .ln-ordens-chip { display: block; }