/* Contagem de quadrados vivos no editor de hull (P-070, T133; design aprovado "P-070 —
 * contagem de quadrados": P070Game, P070States, P070Turns, P070Mobile). A colocação mora no
 * quadro da prévia, o total numa 4ª linha da cabeça (desktop) e, no celular, a faixa
 * "Colocação | Hull". A grid quadrada nunca é desenhada: só os números. Carregado depois de
 * editor.css; `.none` = sem número (Apagar na colocação, forma inválida no total). */
.ed-prev { overflow: hidden; }
#ed-prev { flex: none; margin-top: 3px; }
.ed-rule { align-self: stretch; height: 1px; margin: 2px 8px 0; background: rgba(150, 185, 255, 0.16); }
.ed-pl { flex: 1; justify-content: center; gap: 4px; }
.ed-cnt { display: flex; align-items: center; gap: 5px; font-variant-numeric: tabular-nums; }
.ed-glyph { flex: none; }
.ed-n { font-weight: 750; }
.ed-cnt.p { color: var(--plasma); }
.ed-cnt.p .ed-glyph { opacity: 0.7; }
.ed-cnt.t { color: var(--text); }
.ed-cnt.t .ed-glyph { color: var(--muted); }
.ed-cnt.none, .ed-cnt.none .ed-glyph { color: #5B6788; opacity: 1; }
.ed-pl .ed-n { font-size: 19px; line-height: 1; }
.ed-tot { height: 18px; gap: 7px; white-space: nowrap; }
.ed-tot .ed-n { font-size: 15px; line-height: 18px; font-weight: 700; }
.ed-u { font: 12px var(--mono); color: var(--muted); }
.ed-u:empty { display: none; }
.ed-sqm { display: none; }

@media (max-width: 860px) {
  .ed-tot { display: none; }
  .ed-sqm {
    grid-area: sq; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); height: 36px; box-sizing: border-box;
    border-radius: 10px; background: rgba(4, 8, 22, 0.40); border: 1px solid rgba(150, 185, 255, 0.14); overflow: hidden;
  }
  .ed-sq1 { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 12px; min-width: 0; }
  .ed-sq1 + .ed-sq1 { border-left: 1px solid rgba(150, 185, 255, 0.14); }
  .ed-sq1 .ed-lab { font-size: 10.5px; }
  .ed-sq1 .ed-n { font-size: 17px; line-height: 1; }
}