/* TRAMIA — base visual de la familia CQ, ADOPTADA de NUVIA (copiada, no
   compartida: si mañana cambia NUVIA, TRAMIA no se entera).
   Paleta marfil + tinta cálida + bordó (acción) + dorado (selección),
   estados semánticos ink+bg. Sobrio, denso, sin animaciones, sin framework.
   La herramienta tiene que desaparecer mientras se trabaja. */

:root {
  /* fondo y superficie (marfil de la familia) */
  --fondo: #FAF6EC;
  --panel: #FFFDF8;
  --panel-2: #ECE2CD;
  --borde: #E2D6BC;
  /* texto */
  --tinta: #352E25;
  --tinta-suave: #6A6051;
  --apagado: #968A75;
  /* acción y marca */
  --acento: #7E1F2E;      /* bordó: botones y acción principal */
  --acento-2: #9B2D3F;
  --acento-bg: #F2E1E1;
  --dorado: #B0862F;      /* selección, destacado */
  --dorado-bg: #F4E9CC;
  /* semánticos ink + bg pastel */
  --ok: #4F7D5B;    --ok-bg: #E4F0E4;
  --error: #9A2A2A; --error-bg: #F7E6E3;
  --info: #5F7CA3;  --info-bg: #E7EDF6;
  --alerta: #8A5A00; --alerta-bg: #F7EDD3;
  --radius: 10px;
  accent-color: var(--acento);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--fondo);
  color: var(--tinta);
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
a { color: var(--acento); text-decoration: none; }
a:hover { text-decoration: underline; }
::selection { background: #D9BE72; color: var(--tinta); }

/* ── Login ─────────────────────────────────────────────────────────────── */
.pantalla-login { display: flex; min-height: 100vh; align-items: center; justify-content: center; }
.tarjeta-login {
  background: var(--panel); border: 1px solid var(--borde); border-radius: 14px;
  padding: 2.2rem 2.4rem; width: min(92vw, 22rem); box-shadow: 0 8px 26px rgba(150,125,70,.13);
}
.tarjeta-login h1 { margin: 0; font-size: 1.4rem; letter-spacing: .04em; color: var(--acento); }
.subtitulo { margin: .2rem 0 1.4rem; color: var(--apagado); font-size: .9rem; }
.tarjeta-login label { display: block; margin: .8rem 0 .25rem; font-size: .8rem; font-weight: 700;
  color: var(--tinta-suave); text-transform: uppercase; letter-spacing: .06em; }
.tarjeta-login input {
  width: 100%; padding: .6rem .7rem; border: 1px solid var(--borde); border-radius: 8px;
  font-size: 1rem; background: #fff; color: var(--tinta);
}
.tarjeta-login input:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(126,31,46,.15); }
.tarjeta-login button {
  margin-top: 1.2rem; width: 100%; padding: .65rem; border: 0; border-radius: 8px;
  background: var(--acento); color: #fff; font-size: 1rem; font-weight: 700; cursor: pointer;
}
.tarjeta-login button:hover { background: var(--acento-2); }

/* ── Menú lateral (patrón familia; drawer en móvil con CSS puro) ───────── */
.navtoggle, .navburger, .navscrim { display: none; }
.sidebar {
  position: fixed; top: 0; left: 0; bottom: 0; width: 215px; z-index: 30;
  display: flex; flex-direction: column;
  background: var(--panel); border-right: 1px solid var(--borde); overflow-y: auto;
}
.side-brand { display: flex; flex-direction: column; gap: 2px; padding: 16px 16px 13px; border-bottom: 1px solid var(--borde); }
.side-brand .marca { font-weight: 800; letter-spacing: .04em; color: var(--acento); font-size: 1.05rem; }
.side-brand .marca:hover { text-decoration: none; }
.side-sub { color: var(--apagado); font-size: .74rem; letter-spacing: .04em; }
.side-nav { flex: 1 1 auto; padding: 10px 9px; display: flex; flex-direction: column; gap: 2px; }
.side-nav a { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border-radius: 9px;
  color: var(--tinta-suave); font-weight: 600; font-size: .93rem; white-space: nowrap; }
.side-nav a .ic { width: 20px; text-align: center; flex: 0 0 auto; }
.side-nav a .tx { overflow: hidden; text-overflow: ellipsis; }
.side-nav a:hover { background: var(--panel-2); color: var(--tinta); text-decoration: none; }
.side-nav a.activa { background: var(--acento-bg); color: var(--acento); box-shadow: inset 3px 0 0 var(--acento); }
.side-user { border-top: 1px solid var(--borde); padding: 11px 14px; display: flex;
  align-items: center; justify-content: space-between; gap: 8px; font-size: .85rem; color: var(--apagado); }
.su-name { font-weight: 700; color: var(--tinta); overflow: hidden; text-overflow: ellipsis; }
.salir { border: 1px solid var(--borde); background: transparent; border-radius: 8px;
  padding: .3rem .7rem; cursor: pointer; color: var(--tinta-suave); font-size: .85rem; }
.salir:hover { color: var(--acento); border-color: var(--acento); }
.content { margin-left: 215px; min-width: 0; }
.contenido { padding: 1.3rem 1.6rem 2.2rem; max-width: 1280px; }
.inline { display: inline; }

/* ── Titulares y estructura ────────────────────────────────────────────── */
.encabezado { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
h1 { font-size: 1.35rem; margin: .3rem 0 .8rem; }
h1 a { color: inherit; }
h2 { font-size: .82rem; margin: 1.5rem 0 .5rem; color: var(--apagado);
  text-transform: uppercase; letter-spacing: .07em; font-weight: 700; }
.acciones { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; }

/* ── Botones (familia: acción = bordó) ─────────────────────────────────── */
.boton { display: inline-flex; align-items: center; gap: 6px; background: var(--acento); color: #fff;
  border: 0; border-radius: 9px; padding: .48rem .95rem; text-decoration: none;
  font-size: .9rem; font-weight: 600; cursor: pointer; }
.boton:hover { background: var(--acento-2); text-decoration: none; }
.boton.secundario { background: var(--panel); color: var(--tinta); border: 1px solid var(--borde); font-weight: 600; }
.boton.secundario:hover { background: var(--panel); border-color: var(--acento); color: var(--acento); }
.enlace { color: var(--acento); font-size: .9rem; }
.peligro { border: 1px solid var(--borde); background: var(--panel); color: var(--error);
  border-radius: 8px; padding: .3rem .6rem; cursor: pointer; font-size: .85rem; }
.peligro:hover { border-color: var(--error); background: var(--error-bg); }
.mini { border: 1px solid var(--borde); background: var(--panel); border-radius: 7px;
  padding: .16rem .5rem; font-size: .8rem; cursor: pointer; color: var(--tinta-suave); }
.mini:hover { color: var(--acento); border-color: var(--acento); }

/* ── Tablas ────────────────────────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--borde);
  border-radius: var(--radius); overflow: hidden; font-size: .92rem; }
th { text-align: left; padding: .55rem .7rem; color: var(--apagado); font-weight: 700;
  font-size: .72rem; text-transform: uppercase; letter-spacing: .05em;
  border-bottom: 1px solid var(--borde); background: var(--fondo); }
td { padding: .5rem .7rem; border-bottom: 1px solid var(--borde); vertical-align: top; }
tr:last-child td { border-bottom: 0; }
tr:hover td { background: #FBF7EC; }
tr.inactivo { opacity: .55; }
td a { color: var(--acento); }
.acciones-fila { display: flex; gap: .6rem; align-items: center; }

/* ── Formularios ───────────────────────────────────────────────────────── */
.formulario { max-width: 46rem; background: var(--panel); border: 1px solid var(--borde);
  border-radius: var(--radius); padding: 1.1rem 1.3rem; }
.formulario label { display: block; margin: .7rem 0 .2rem; font-size: .84rem; color: var(--tinta-suave); font-weight: 600; }
.formulario input, .formulario select, .formulario textarea, .fila-form input, .fila-form select,
.captura input, .captura select, .rechazo select, .rechazo input {
  width: 100%; padding: .45rem .6rem; border: 1px solid var(--borde); border-radius: 8px;
  font-size: .95rem; background: #fff; color: var(--tinta); font-family: inherit; }
.formulario input:focus, .formulario select:focus, .formulario textarea:focus,
.fila-form input:focus, .fila-form select:focus, .captura input:focus {
  outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px rgba(126,31,46,.12); }
.fila-doble { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .85rem; }
input.corto, select.corto, .corto { width: 7rem !important; }
.fila-form { display: flex; gap: .6rem; align-items: center; margin: .7rem 0; flex-wrap: wrap; }
.fila-form input, .fila-form select { width: auto; }
.filtros { font-size: .9rem; }
.lista-series .fila-form { margin: .3rem 0; }
.formulario.compacto { padding: .8rem 1rem; margin: .5rem 0; max-width: none; }
.preguntas-episodio { border: 1px solid var(--borde); background: var(--dorado-bg); border-radius: var(--radius); padding: .7rem 1rem; }
fieldset.preguntas-episodio { margin: .8rem 0 0; }
.preguntas-episodio legend { font-weight: 700; padding: 0 .4rem; font-size: .88rem; color: var(--tinta-suave); }

/* ── Captura rápida (ideas) ────────────────────────────────────────────── */
.captura { display: flex; gap: .6rem; margin: .6rem 0 1rem; flex-wrap: wrap;
  background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: .8rem; }
.captura input[name=titulo_tentativo] { flex: 2 1 14rem; }
.captura input[name=nota] { flex: 3 1 18rem; }
.captura select, .captura input.corto { flex: 0 1 auto; width: auto; }
.lista-ideas { display: flex; flex-direction: column; gap: .5rem; }
.idea { display: flex; justify-content: space-between; gap: 1rem; align-items: center;
  background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: .6rem .9rem; }
.idea.estado-descartada { opacity: .55; }
.idea .nota { margin: .15rem 0; color: var(--tinta-suave); }
.idea small { color: var(--apagado); }
.idea-acciones { display: flex; gap: .5rem; align-items: center; flex-shrink: 0; }
.potencial { color: var(--dorado); margin-left: .4rem; }
.gancho { margin: .15rem 0; font-weight: 600; }

/* ── Chapas (pastel ink+bg, familia) ───────────────────────────────────── */
.chapa { display: inline-block; border-radius: 999px; padding: .1rem .6rem; font-size: .76rem;
  font-weight: 600; background: var(--panel-2); color: var(--tinta-suave); }
.chapa-publicado, .chapa-promovida { background: var(--ok-bg); color: var(--ok); }
.chapa-descartada { background: var(--error-bg); color: var(--error); }
.chapa-produccion, .chapa-guion { background: var(--info-bg); color: var(--info); }
.chapa-af-verificada { background: var(--ok-bg); color: var(--ok); }
.chapa-af-no_verificada { background: var(--alerta-bg); color: var(--alerta); }
.chapa-af-se_cree_que { background: #ECE7F5; color: #4E3A86; }
.chapa-esc-pendiente { background: var(--panel-2); }
.chapa-esc-aprobada_calidad { background: var(--ok-bg); color: var(--ok); }
.chapa-esc-rechazada_calidad, .chapa-esc-descartada { background: var(--error-bg); color: var(--error); }
.chapa-esc-pendiente_revision_calidad { background: var(--alerta-bg); color: var(--alerta); }
.chapa-esc-imagen_lista, .chapa-esc-video_listo { background: var(--info-bg); color: var(--info); }
.chapa-rev-pendiente { background: var(--alerta-bg); color: var(--alerta); }
.chapa-rev-aprobado { background: var(--ok-bg); color: var(--ok); }
.chapa-rev-rechazado { background: var(--error-bg); color: var(--error); }
.chapa-job-pendiente { background: var(--alerta-bg); color: var(--alerta); }
.chapa-job-corriendo { background: var(--info-bg); color: var(--info); }
.chapa-job-ok { background: var(--ok-bg); color: var(--ok); }
.chapa-job-error { background: var(--error-bg); color: var(--error); }
.chapa-job-cancelado { background: var(--panel-2); color: var(--tinta-suave); }
.chapa-momento { background: #ECE7F5; color: #4E3A86; }
.chapa-rima { background: var(--dorado-bg); color: var(--dorado); }

/* ── Fichas, datos y mensajes ──────────────────────────────────────────── */
.ficha .datos, dl.datos { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1rem;
  background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: .9rem 1.1rem; margin: .6rem 0; }
dl.datos dt { color: var(--apagado); font-size: .85rem; }
dl.datos dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.biblia-caja { background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: 1rem 1.2rem; }
dl.biblia { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1.2rem; margin: 0; }
dl.biblia dt { color: var(--apagado); font-size: .85rem; text-transform: capitalize; }
dl.biblia dd { margin: 0; overflow-wrap: anywhere; }
.biblia-lista { margin: 0; padding-left: 1.1rem; }
.vacio { color: var(--apagado); }
.seccion-futura h2 { margin-bottom: .2rem; }
.error { color: var(--error); background: var(--error-bg); border: 1px solid #E4C6BE; border-radius: 8px;
  padding: .5rem .8rem; font-size: .9rem; }
p.error, div.error { margin: .6rem 0; }
.tarjeta-login .error { margin: 0 0 .6rem; }
.aviso { background: var(--alerta-bg); border: 1px solid #E8D5A8; color: var(--alerta);
  border-radius: 8px; padding: .5rem .8rem; font-size: .9rem; margin: .6rem 0; }
.aviso-fuerte { font-weight: 700; border-width: 2px; }
.error-inline { color: var(--error); }
.ambito-canal { background: var(--info-bg); border: 1px solid #CBD8EA; color: var(--info);
  border-radius: 8px; padding: .5rem .8rem; }

/* ── Tarjetas genéricas / investigación ────────────────────────────────── */
.investigacion { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; align-items: start; }
.tarjeta { background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius);
  padding: .7rem .9rem; margin: .5rem 0; }
.tarjeta-cab { display: flex; gap: .6rem; align-items: baseline; flex-wrap: wrap; }
.tarjeta-pie { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; margin-top: .4rem; }
blockquote.cita { margin: .5rem 0; padding: .4rem .8rem; border-left: 3px solid var(--dorado);
  background: var(--fondo); font-style: italic; white-space: pre-wrap; }
.desde-fuente { margin-top: .5rem; border-top: 1px dashed var(--borde); padding-top: .5rem; }
.desde-fuente input[name=texto] { flex: 1 1 12rem; }
.plegable > summary { list-style: none; cursor: pointer; display: inline-flex; margin: .3rem 0; }
.plegable > summary::-webkit-details-marker { display: none; }
.inline-det { display: inline-block; }
.inline-det > summary { cursor: pointer; color: var(--acento); font-size: .9rem; list-style: none; }
.grupo-titulo { margin: 1rem 0 .3rem; display: inline-block; }
.afirmacion.af-verificada { border-left: 3px solid var(--ok); }
.afirmacion.af-no_verificada { border-left: 3px solid var(--dorado); }
.afirmacion.af-se_cree_que { border-left: 3px solid #4E3A86; }
.af-texto { margin: .1rem 0 .3rem; }

/* ── EDITOR DE GUION: horas de lectura y escritura ─────────────────────── */
/* Columna contenida, serif, interlineado amplio, fondo marfil que no cansa. */
.guion-layout { display: grid; grid-template-columns: minmax(0, 47rem) minmax(14rem, 19rem);
  gap: 1.6rem; align-items: start; }
.guion-editor .bloque { background: var(--panel); border: 1px solid var(--borde);
  border-radius: var(--radius); margin: 0 0 .9rem; overflow: hidden; }
.bloque-cab { display: flex; justify-content: space-between; align-items: center; gap: .6rem;
  padding: .35rem .8rem; border-bottom: 1px solid var(--borde); background: var(--fondo); font-size: .82rem; }
.bloque-cab .acciones { gap: .45rem; }
.bloque-texto, .bloque-texto-fijo {
  width: 100%; border: 0; padding: 1.15rem 1.5rem; font-size: 1.06rem; line-height: 1.8;
  font-family: Georgia, 'Iowan Old Style', 'Times New Roman', serif; color: var(--tinta);
  background: var(--panel); resize: none; overflow: hidden; min-height: 6rem; white-space: pre-wrap; }
.bloque-texto:focus { outline: none; background: #FFFDF4; }
.bloque-aprobado { border-color: #BFD5C2; }
.bloque-aprobado .bloque-cab { background: var(--ok-bg); }
.bloque-texto-fijo { background: #FCFDF8; color: #3d3930; }
.barra-guion { position: sticky; bottom: 0; background: var(--fondo); padding: .6rem 0;
  border-top: 1px solid var(--borde); }
.panel-afirmaciones { background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius);
  padding: .8rem 1rem; max-height: 82vh; overflow-y: auto; position: sticky; top: 1rem; }
.panel-afirmaciones h2 { margin-top: 0; }
.af-mini { border-left: 3px solid var(--borde); padding: .3rem .6rem; margin: .4rem 0; font-size: .87rem; }
.af-mini.af-verificada { border-color: var(--ok); }
.af-mini.af-no_verificada { border-color: var(--dorado); background: #FBF4E4; }
.af-mini.af-se_cree_que { border-color: #4E3A86; }
.lectura { max-width: 47rem; background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius);
  padding: 1.7rem 2.1rem; font-family: Georgia, 'Iowan Old Style', 'Times New Roman', serif;
  font-size: 1.06rem; line-height: 1.8; white-space: pre-wrap; }
.dif-quitado, .dif-quitado-muestra { background: #F7E3E0; text-decoration: line-through; color: #7C2B2B; }
.dif-agregado, .dif-agregado-muestra { background: var(--ok-bg); color: #1D5A28; }
.dif-quitado-muestra, .dif-agregado-muestra { padding: 0 .4rem; border-radius: 4px; text-decoration: none; }
.dif-quitado { text-decoration-color: #B98383; }

/* ── TABLERO DE ESCENAS: storyboard en grilla ──────────────────────────── */
.tablero-escenas { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: .9rem; align-items: start; }
.escena-card { margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.esc-visual { position: relative; display: block; background: #2A2620; min-height: 150px; max-height: 170px; overflow: hidden; }
.esc-visual img { width: 100%; height: 160px; object-fit: cover; display: block; }
.esc-visual-icono { display: flex; align-items: center; justify-content: center; height: 150px;
  font-size: 2.3rem; color: #8C8474; background: var(--panel-2); }
.esc-visual-icono.vacia { background: repeating-linear-gradient(45deg, var(--panel-2) 0 12px, #E5DAC2 12px 24px); }
.esc-numero { position: absolute; top: .5rem; left: .5rem; background: rgba(30,25,20,.78); color: #fff;
  font-weight: 800; font-size: .95rem; border-radius: 8px; padding: .05rem .55rem; }
.esc-dur { position: absolute; bottom: .5rem; right: .5rem; background: rgba(30,25,20,.78); color: #fff;
  font-size: .78rem; border-radius: 7px; padding: .05rem .45rem; }
.esc-cuerpo { padding: .55rem .8rem .6rem; display: flex; flex-direction: column; gap: .25rem; }
.esc-chapas { margin: 0; display: flex; gap: .3rem; flex-wrap: wrap; }
.esc-frag { font-family: Georgia, serif; margin: 0; font-size: .92rem; line-height: 1.45; }
.esc-descr { margin: 0; color: var(--tinta-suave); font-size: .85rem; }
.esc-entidades { margin: 0; display: flex; gap: .3rem; flex-wrap: wrap; }
.esc-pie { margin: .15rem 0 0; display: flex; justify-content: space-between; align-items: center;
  gap: .5rem; font-size: .82rem; }
.escena-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.4rem; align-items: start; }
.panel-prompt { background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: .9rem 1.1rem; }
.prompt-vista { background: var(--fondo); border: 1px solid var(--borde); border-radius: 8px;
  padding: .8rem 1rem; white-space: pre-wrap; font-size: .88rem; max-height: 60vh; overflow-y: auto; }

/* ── Referencias, recursos ─────────────────────────────────────────────── */
.galeria { display: flex; gap: .9rem; flex-wrap: wrap; }
.ref { margin: 0; width: 11rem; background: var(--panel); border: 1px solid var(--borde);
  border-radius: var(--radius); overflow: hidden; }
.ref img { width: 100%; height: 8.2rem; object-fit: cover; display: block; }
.ref figcaption { padding: .4rem .6rem; font-size: .8rem; color: var(--tinta-suave); }
.ref-principal { border-color: var(--dorado); box-shadow: 0 0 0 1px var(--dorado); }
.miniatura { width: 3.2rem; height: 2.2rem; object-fit: cover; border-radius: 6px; border: 1px solid var(--borde); }
.miniatura-icono { display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem;
  width: 3.2rem; height: 2.2rem; background: var(--panel-2); }
.recurso-sel { border-color: var(--dorado); box-shadow: 0 0 0 1px var(--dorado); }

/* ── REVISIÓN DE CALIDAD: la imagen manda ──────────────────────────────── */
.revision-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(17rem, 23rem);
  gap: 1.4rem; align-items: start; }
.rev-archivo { min-width: 0; }
.rev-grande { display: block; width: 100%; max-height: 82vh; object-fit: contain;
  border-radius: var(--radius); border: 1px solid var(--borde); background: #191613; }
.rev-contexto { position: sticky; top: 1rem; max-height: 94vh; overflow-y: auto;
  background: var(--panel); border: 1px solid var(--borde); border-radius: var(--radius); padding: .8rem 1rem; }
.rev-contexto h2:first-child { margin-top: 0; }
.rev-acciones { display: flex; gap: 1rem; align-items: center; margin: .8rem 0; flex-wrap: wrap; }
.rechazo { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.rechazo select, .rechazo input { width: auto; }
.chico { font-size: .78rem; max-height: 10rem; overflow-y: auto; }

/* ── Gráfico simple de aprendizaje (antes pisaba a la cabecera .barra) ─── */
.barra-grafico { display: inline-block; height: .7rem; background: var(--acento);
  border-radius: 3px; vertical-align: middle; }

/* ── Cola de trabajos ──────────────────────────────────────────────────── */
.celda-larga { max-width: 26rem; font-size: .85rem; }
#ia-banner button { margin-left: .4rem; }
#ia-banner { margin: .6rem 0; }

/* ── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 66rem) {
  .investigacion, .guion-layout, .escena-layout, .revision-layout { grid-template-columns: 1fr; }
  .panel-afirmaciones, .rev-contexto { position: static; max-height: none; }
}
@media (max-width: 880px) {
  /* Drawer: menú lateral oculto; hamburguesa + scrim (CSS puro, sin animación) */
  .sidebar { transform: translateX(-100%); box-shadow: 0 0 40px rgba(40,25,20,.28); }
  .navtoggle:checked ~ .sidebar { transform: translateX(0); }
  .content { margin-left: 0; padding-top: 52px; }
  .navburger { display: flex; align-items: center; justify-content: center; position: fixed;
    top: 9px; left: 9px; z-index: 20; width: 40px; height: 40px; font-size: 20px; line-height: 1;
    cursor: pointer; border: 1px solid var(--borde); border-radius: 10px; color: var(--acento);
    background: var(--panel); user-select: none; }
  .navtoggle:checked ~ .navscrim { display: block; position: fixed; inset: 0; z-index: 25;
    background: rgba(30,20,15,.42); }
  .contenido { padding: .9rem .9rem 2rem; }
  .fila-doble { grid-template-columns: 1fr; }
  /* Tablas: scroll horizontal antes que encimarse */
  table { display: block; overflow-x: auto; }
  .celda-larga { max-width: 16rem; }
  .tablero-escenas { grid-template-columns: 1fr; }
  .idea { flex-direction: column; align-items: flex-start; gap: .4rem; }
  .bloque-texto, .bloque-texto-fijo { padding: .9rem 1rem; }
}