/* Guía del facilitador — estilos para pantalla e impresión (A4) */
@font-face { font-family: "Inter"; src: url("../assets/fonts/InterVariable.woff2") format("woff2"); font-weight: 100 900; font-display: block; }
:root { --tinta: #14181F; --gris: #5B6472; --linea: #D9DEE5; --suave: #F3F5F8; --ambar: #B8791A; --ambar-claro: #FFF3D6; --cian: #0B6E99; --cian-claro: #E3F2FA; --rosa: #B3324B; --rosa-claro: #FBE7EB; --verde: #1E7F5C; }
* { box-sizing: border-box; }
html, body { margin: 0; background: #fff; color: var(--tinta); font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 10.5pt; line-height: 1.42; }
#guia { max-width: 190mm; margin: 0 auto; padding: 12mm 0; }
@media print { #guia { max-width: none; padding: 0; } }
h1, h2, h3, h4 { margin: 0; line-height: 1.15; letter-spacing: -0.01em; }
p { margin: 0 0 6pt; }
ul, ol { margin: 0 0 6pt; padding-left: 16pt; }
li { margin-bottom: 2pt; }
.seccion { break-before: page; }
.seccion.sin-salto { break-before: auto; }
.kicker { font-size: 8.5pt; letter-spacing: 0.14em; text-transform: uppercase; color: var(--cian); font-weight: 700; margin-bottom: 4pt; }
h2.titulo-seccion { font-size: 18pt; font-weight: 700; border-left: 4pt solid #F5B942; padding-left: 8pt; margin-bottom: 10pt; }
h3 { font-size: 12.5pt; font-weight: 700; margin: 10pt 0 6pt; }
.gris { color: var(--gris); }
.pequeno { font-size: 9pt; }

/* Portada */
.portada { min-height: 240mm; display: flex; flex-direction: column; justify-content: space-between; }
.portada .titulo-grande { font-size: 30pt; font-weight: 800; letter-spacing: -0.02em; margin: 4pt 0 6pt; }
.portada .taller { font-size: 13pt; color: var(--gris); margin-bottom: 18pt; }
.meta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8pt; margin: 14pt 0; }
.meta div { border: 1px solid var(--linea); border-radius: 6pt; padding: 8pt 10pt; }
.meta b { display: block; font-size: 15pt; letter-spacing: -0.01em; }
.meta span { font-size: 8.5pt; color: var(--gris); text-transform: uppercase; letter-spacing: 0.08em; }
.caja { border: 1px solid var(--linea); border-radius: 6pt; padding: 10pt 12pt; margin-bottom: 8pt; background: #fff; }
.caja.ambar { background: var(--ambar-claro); border-color: #F0D9A6; }
.firma { font-size: 9pt; color: var(--gris); border-top: 1px solid var(--linea); padding-top: 8pt; }

/* Tablas */
table { width: 100%; border-collapse: collapse; margin-bottom: 8pt; font-size: 9.5pt; }
th, td { text-align: left; vertical-align: top; padding: 4pt 6pt; border-bottom: 1px solid var(--linea); }
th { font-size: 8pt; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gris); font-weight: 700; }
td.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
tr.actual td { background: var(--ambar-claro); }
.tabular { font-variant-numeric: tabular-nums; }

/* Guion */
.bloque-enc { break-after: avoid; margin: 14pt 0 6pt; padding: 6pt 10pt; background: var(--suave); border-radius: 6pt; display: flex; justify-content: space-between; align-items: baseline; }
.bloque-enc h3 { margin: 0; font-size: 12pt; }
.bloque-enc span { font-size: 9pt; color: var(--gris); font-variant-numeric: tabular-nums; }
.pantalla { break-inside: avoid; border: 1px solid var(--linea); border-radius: 6pt; padding: 8pt 10pt 6pt; margin-bottom: 7pt; }
.pantalla-enc { display: flex; align-items: baseline; gap: 8pt; margin-bottom: 4pt; }
.pantalla-enc .id { font-weight: 800; color: var(--ambar); font-variant-numeric: tabular-nums; }
.pantalla-enc h4 { font-size: 11.5pt; font-weight: 700; flex: 1; }
.pantalla-enc .tiempo { font-size: 9pt; color: var(--gris); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pantalla-enc .frags { font-size: 8pt; color: var(--gris); border: 1px solid var(--linea); border-radius: 999pt; padding: 0 6pt; white-space: nowrap; }
.col2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8pt; }
.parte { font-size: 9.3pt; }
.parte .rotulo { font-size: 7.5pt; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; margin-bottom: 2pt; }
.parte.pantalla-txt { background: var(--suave); border-radius: 4pt; padding: 6pt 8pt; }
.parte.pantalla-txt .rotulo { color: var(--gris); }
.parte.digo .rotulo { color: var(--cian); }
.parte.hago .rotulo { color: var(--ambar); }
.parte ul { padding-left: 12pt; margin: 0; }
.parte li { margin-bottom: 2pt; }
.ojo { margin-top: 5pt; font-size: 9pt; background: var(--rosa-claro); color: var(--rosa); border-radius: 4pt; padding: 4pt 8pt; }
.ojo b { letter-spacing: 0.1em; font-size: 7.5pt; text-transform: uppercase; margin-right: 4pt; }
.txt-titulo { font-weight: 700; }
.txt-sub { color: var(--gris); }
.txt-lista { margin: 2pt 0 0; padding-left: 12pt; }
.txt-cita { font-style: italic; }
.veredicto { display: inline-block; font-size: 7.5pt; font-weight: 800; letter-spacing: 0.12em; border: 1px solid currentColor; border-radius: 3pt; padding: 0 4pt; margin-left: 4pt; }
.veredicto.FALSO { color: var(--rosa); } .veredicto.VERDADERO { color: var(--verde); } .veredicto.DEPENDE, .veredicto.DEBATE { color: var(--cian); }
kbd { font-family: inherit; font-size: 0.9em; border: 1px solid var(--linea); border-bottom-width: 2px; border-radius: 3pt; padding: 0 4pt; background: #fff; white-space: nowrap; }
.dos-col { column-count: 2; column-gap: 14pt; }
.dos-col > * { break-inside: avoid; }
.chip { display: inline-block; border: 1px solid var(--linea); border-radius: 999pt; padding: 1pt 8pt; margin: 0 4pt 4pt 0; font-size: 9pt; }
