/* TG 3GM — Página de pieza: artículo + acciones + La Tertulia.
   Requiere tokens.css + componentes.css. */

article.pieza{max-width:720px;margin:0 auto;padding:6px 20px 0}

/* En la página de pieza a dos columnas (estilo portada), el artículo, las
   acciones y La Tertulia llenan la columna principal (no se centran a 720). */
.cuerpo-pieza main > .pieza,
.cuerpo-pieza main > .acciones,
.cuerpo-pieza main > .tertulia{max-width:none;margin-left:0;margin-right:0}
.cuerpo-pieza main > .pieza,
.cuerpo-pieza main > .tertulia{padding-left:0;padding-right:0}
article.pieza h1{font-family:var(--display);font-weight:800;font-size:40px;line-height:1.08;
  letter-spacing:-.015em;margin:14px 0 16px}
.entradilla{font-family:var(--lectura);font-size:20px;line-height:1.5;color:var(--tinta-2);
  font-weight:400;margin-bottom:20px}
.entradilla{text-wrap:pretty}
.firma-linea{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--linea);
  border-bottom:1px solid var(--linea);font-family:var(--ui);font-size:12px;color:var(--tinta-3);letter-spacing:.03em}
.firma-linea .autor{color:var(--tinta);font-weight:600}
.firma-linea .punto{width:3px;height:3px;border-radius:50%;background:var(--linea-fuerte)}

article.pieza .figura{margin:22px 0 6px;height:380px}
.pie-foto{font-family:var(--ui);font-size:11px;color:var(--tinta-3);padding:8px 2px 0;letter-spacing:.02em}

.texto{padding:22px 0 6px;max-width:720px}
.texto p{font-family:var(--lectura);font-size:19px;line-height:1.68;color:var(--tinta);margin-bottom:20px;max-width:68ch}
.texto p:first-of-type::first-letter{font-family:var(--display);font-weight:900;float:left;
  font-size:66px;line-height:.72;padding:8px 12px 0 0;color:var(--rojo)}
.texto h2{font-family:var(--display);font-weight:700;font-size:25px;margin:10px 0 14px;line-height:1.2}
.texto blockquote{border-left:3px solid var(--rojo);margin:26px 0;padding:4px 0 4px 22px;
  font-family:var(--display);font-style:italic;font-weight:500;font-size:23px;line-height:1.35;color:var(--tinta)}
.fuente-nota{font-family:var(--ui);font-size:12.5px;color:var(--tinta-3);border-top:1px solid var(--linea);
  padding-top:14px;margin-top:8px;letter-spacing:.02em}

.acciones{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:26px auto 10px;max-width:720px;padding:16px 20px;
  border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
form.f-sello{display:inline-block}
.sello-btn{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--linea-fuerte);
  background:var(--blanco);padding:8px 15px;cursor:pointer;font-family:var(--ui);font-size:12.5px;
  color:var(--tinta-2);letter-spacing:.04em;transition:.18s}
.sello-btn .lacre{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--rojo-osc);
  display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:8px;color:var(--rojo-osc)}
.sello-btn:hover{border-color:var(--rojo)}
.sello-btn.activo{background:var(--rojo);border-color:var(--rojo);color:#fff}
.sello-btn.activo .lacre{background:#fff;color:var(--rojo);border-color:#fff}
.accion-ghost{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--linea);
  background:transparent;padding:8px 14px;cursor:pointer;font-family:var(--ui);font-size:12.5px;color:var(--tinta-2);letter-spacing:.04em}
.accion-ghost:hover{border-color:var(--tinta-3);color:var(--tinta)}
.acciones .lecturas{margin-left:auto;font-family:var(--ui);font-size:11.5px;color:var(--tinta-3);letter-spacing:.05em}

/* Páginas estáticas (legales / editoriales): sin capital roja, con
   listas y subtítulos legibles. */
.texto-estatico p:first-of-type::first-letter{font-family:inherit;float:none;
  font-size:inherit;line-height:inherit;padding:0;color:inherit}
.texto-estatico h2{font-family:var(--display);font-weight:700;font-size:22px;margin:28px 0 10px;line-height:1.2}
.texto-estatico p{font-size:17px;line-height:1.62;max-width:70ch;margin-bottom:16px}
.texto-estatico ul{margin:0 0 18px;padding-left:20px;max-width:70ch}
.texto-estatico li{font-family:var(--lectura);font-size:17px;line-height:1.55;color:var(--tinta);margin-bottom:8px}
.texto-estatico a{color:var(--rojo);font-weight:500}
.texto-estatico code{font-family:var(--ui);font-size:13px;background:var(--papel);padding:1px 5px;border:1px solid var(--linea)}
.nota-construccion{background:var(--papel);border-left:3px solid var(--rojo);padding:14px 18px;
  margin:6px 0 22px;font-family:var(--lectura);font-size:15.5px;line-height:1.55;color:var(--tinta-2)}
.nota-construccion strong{color:var(--rojo)}

/* La Tertulia */
.tertulia{max-width:720px;margin:34px auto 0;padding:0 20px 40px}
.tertulia-cab{display:flex;align-items:baseline;justify-content:space-between;
  border-bottom:2px solid var(--tinta);padding-bottom:10px;margin-bottom:6px}
.tertulia-cab h2{font-family:var(--display);font-weight:800;font-size:26px}
.tertulia-cab .n{font-family:var(--ui);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-3)}
.tertulia-intro{font-family:var(--lectura);font-style:italic;font-size:15.5px;color:var(--tinta-3);margin:10px 0 24px}

.destacada{position:relative;background:var(--papel);border:1px solid var(--linea);padding:26px 28px 22px;margin-bottom:30px}
.destacada .marca{position:absolute;top:-11px;left:22px;background:var(--rojo);color:#fff;
  font-family:var(--ui);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;padding:4px 10px}
.destacada .cita{font-family:var(--display);font-style:italic;font-weight:500;font-size:22px;line-height:1.44;color:var(--tinta)}
.destacada .rubrica{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px;
  font-family:var(--ui);font-size:12px;color:var(--tinta-3);letter-spacing:.03em}
.destacada .rubrica .quien{color:var(--tinta);font-weight:600}
.avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;
  font-family:var(--display);font-weight:700;font-size:13px;flex-shrink:0}

.orden{display:flex;gap:18px;align-items:center;margin-bottom:8px;font-family:var(--ui);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--tinta-3)}
.orden a{padding-bottom:3px}
.orden a.on{color:var(--tinta);border-bottom:2px solid var(--rojo)}
.orden a:hover{color:var(--rojo)}

.replica{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:22px 0;border-bottom:1px solid var(--linea)}
.replica .cab{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:8px;
  font-family:var(--ui);font-size:12px;color:var(--tinta-3);letter-spacing:.02em}
.replica .cab .quien{color:var(--tinta);font-weight:600;font-size:13px}
.replica .verif{color:var(--rojo)}
.replica .texto-r{font-family:var(--lectura);font-size:16.5px;line-height:1.6;color:var(--tinta-2)}
.replica .texto-r p{margin-bottom:12px}
.replica .cita-nivel{border-left:2px solid var(--linea-fuerte);padding:2px 0 2px 14px;margin:4px 0 12px;
  color:var(--tinta-3);font-style:italic;font-size:15px}
.replica-acc{display:flex;gap:16px;align-items:center;margin-top:12px;font-family:var(--ui);font-size:11px;
  letter-spacing:.06em;color:var(--tinta-3);text-transform:uppercase}
.replica-acc form{display:inline}
.replica-acc button{background:none;border:0;cursor:pointer;color:inherit;font:inherit;display:inline-flex;align-items:center;gap:6px;padding:0}
.replica-acc button:hover{color:var(--rojo)}
.replica-acc .sellitos{color:var(--rojo);font-weight:600}
.mini-lacre{width:16px;height:16px;border:1px solid var(--rojo);border-radius:50%;display:inline-grid;
  place-items:center;font-size:5px;color:var(--rojo);font-family:var(--display);font-weight:700}

.componer{margin-top:26px;border:1px solid var(--borde-campo);background:var(--blanco)}
.componer .barra{display:flex;gap:2px;border-bottom:1px solid var(--linea);padding:7px 10px;background:var(--papel);
  font-family:var(--ui);font-size:11px;color:var(--tinta-3)}
.componer textarea{width:100%;border:0;resize:vertical;min-height:96px;padding:14px 16px;
  font-family:var(--lectura);font-size:16.5px;color:var(--tinta);line-height:1.55;background:transparent}
.componer .pie{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding:10px 14px;border-top:1px solid var(--linea)}
.componer .aviso{font-family:var(--ui);font-size:11px;color:var(--tinta-3);letter-spacing:.02em}
.componer .aviso a{color:var(--rojo)}
.componer button.enviar{background:var(--rojo);color:#fff;border:0;padding:10px 20px;cursor:pointer;
  font-family:var(--ui);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.componer button.enviar:hover{background:var(--rojo-osc)}
/* Barra de formato del editor (botones de la toolbar) */
.componer .barra button{background:var(--blanco);border:1px solid var(--linea);cursor:pointer;
  width:30px;height:26px;display:inline-grid;place-items:center;font-family:var(--ui);font-size:12px;
  color:var(--tinta-2);line-height:1}
.componer .barra button:hover{border-color:var(--tinta-3);color:var(--tinta)}

/* Acciones extra de réplica (editar / retirar / reportar) */
.replica-acc .acc-link{background:none;border:0;padding:0;cursor:pointer;color:inherit;font:inherit;
  text-transform:uppercase;letter-spacing:.06em;line-height:inherit}
.replica-acc a.acc-link:hover,.replica-acc button.acc-link:hover{color:var(--rojo)}

/* Edición inline de una réplica (reutiliza el aspecto del compositor) */
.editar-inline{margin:8px 0 4px}
.editar-inline .cancelar{font-family:var(--ui);font-size:11px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--tinta-3);margin-right:14px}
.editar-inline .cancelar:hover{color:var(--rojo)}

/* Formulario de reporte inline */
.reportar-inline{margin:12px 0 4px;border:1px solid var(--linea-fuerte);background:var(--papel);padding:14px 16px}
.reportar-inline .rep-cab{font-family:var(--ui);font-size:11px;text-transform:uppercase;letter-spacing:.14em;
  color:var(--tinta-2);font-weight:600;margin-bottom:12px}
.reportar-inline label{display:block;font-family:var(--ui);font-size:12px;color:var(--tinta-3);margin-bottom:10px}
.reportar-inline select{display:block;margin-top:5px;width:100%;padding:8px;border:1px solid var(--linea);
  font-family:var(--ui);font-size:13px;background:var(--blanco)}
.reportar-inline textarea{width:100%;border:1px solid var(--linea);padding:9px 11px;
  font-family:var(--lectura);font-size:14.5px;resize:vertical;min-height:52px}
.reportar-inline .rep-pie{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:12px}
.reportar-inline .cancelar{font-family:var(--ui);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-3)}
.reportar-inline .cancelar:hover{color:var(--rojo)}
.reportar-inline .enviar{background:var(--rojo);color:#fff;border:0;padding:9px 18px;cursor:pointer;
  font-family:var(--ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.reportar-inline .enviar:hover{background:var(--rojo-osc)}

/* Aviso de acción realizada (reporte enviado, etc.) */
.aviso-ok{background:var(--papel);border-left:3px solid var(--rojo);padding:12px 16px;margin:0 0 20px;
  font-family:var(--lectura);font-size:15px;color:var(--tinta-2)}

.no-acred{font-family:var(--lectura);font-size:15px;color:var(--tinta-3);text-align:center;padding:22px;
  border:1px dashed var(--linea-fuerte);margin-top:22px}
.no-acred a{color:var(--rojo);font-weight:600}
.vacia{font-family:var(--lectura);font-style:italic;font-size:15px;color:var(--tinta-3);padding:20px 0}

@media(max-width:760px){
  article.pieza h1{font-size:30px}
  .texto p{font-size:17.5px}
  article.pieza .figura{height:240px}
}

/* Atajo de corrección para la redacción (E9). Discreto pero visible:
   una etiqueta con filete rojo sobre la propia noticia. Solo la ve quien
   tiene sesión de redactor, así que nunca aparece para el público. */
.corregir-pieza{display:inline-flex;align-items:center;gap:7px;margin-bottom:14px;
  padding:5px 12px;border:1px solid var(--rojo);color:var(--rojo);background:var(--blanco);
  font-family:var(--ui);font-size:11.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;transition:.15s}
.corregir-pieza:hover{background:var(--rojo);color:#fff}
.corregir-pieza svg{flex-shrink:0}
@media print{.corregir-pieza{display:none}}