/* titular.css — El Titular Imposible (noticia "publicada ayer") */

/* Barra de salida: OCULTA en la noticia para no delatar el sistema.
   Se muestra/oculta con TRIPLE TOQUE en el logo del periódico. */
.exit-bar { position:fixed; top:56px; right:10px; display:flex; gap:8px; z-index:80; }
.exit-bar.ex-hidden { display:none; }
.exit-btn { font-size:12px; font-weight:600; padding:6px 11px; border-radius:9px; border:1px solid var(--line); background:rgba(255,255,255,.95); color:var(--muted); cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.15); }
.exit-btn:active { transform:translateY(1px); }
.exit-btn.danger { color:var(--danger); border-color:#f3c9d2; }
#logout-btn { display:none; }

/* ===================== JUEGO (portal de noticias) ===================== */
.nw-screen { min-height:100svh; min-height:100vh; background:#fff; color:#1a1a1a;
  font-family:Georgia, "Times New Roman", serif; display:flex; flex-direction:column; }

/* Cabecera del periódico */
.nw-topbar { background:#fff; border-bottom:3px double #1a1a1a; padding:12px 16px 10px; text-align:center;
  -webkit-user-select:none; user-select:none; }
.nw-logo { font-size:26px; font-weight:900; letter-spacing:1px; font-family:Georgia,serif; }
.nw-logo span { color:#b3261e; }
.nw-tagline { font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase; color:#777; margin-top:2px; font-family:Arial,Helvetica,sans-serif; }
.nw-navrow { display:flex; gap:16px; justify-content:center; padding:8px 12px; border-bottom:1px solid #e2e2e2;
  font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#444;
  overflow-x:auto; white-space:nowrap; }
.nw-navrow b { color:#b3261e; border-bottom:2px solid #b3261e; padding-bottom:6px; margin-bottom:-9px; }

/* Cuerpo del artículo */
.nw-article { flex:1; max-width:680px; width:100%; margin:0 auto; padding:20px 18px 40px; }
.nw-kicker { display:inline-block; font-family:Arial,Helvetica,sans-serif; font-size:11px; font-weight:800;
  letter-spacing:1.5px; text-transform:uppercase; color:#fff; background:#b3261e; padding:4px 9px; border-radius:3px; }
.nw-headline { font-size:28px; line-height:1.18; font-weight:900; margin:12px 0 10px; }
.nw-sub { font-size:16.5px; line-height:1.4; color:#555; margin:0 0 14px; font-style:italic; }
.nw-meta { display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;
  font-family:Arial,Helvetica,sans-serif; font-size:12.5px; color:#666; flex-wrap:wrap; }
.nw-meta .avatar { width:34px; height:34px; border-radius:50%; background:#39508a; color:#fff; font-weight:700;
  display:flex; align-items:center; justify-content:center; font-size:14px; flex:0 0 auto; }
.nw-meta .who b { color:#1a1a1a; display:block; font-size:13px; }
.nw-meta .when { margin-left:auto; text-align:right; }
.nw-meta .when b { color:#b3261e; }

/* Imagen de cabecera (ilustración CSS) */
.nw-hero { margin:16px 0 6px; border-radius:6px; overflow:hidden; }
.nw-hero svg { display:block; width:100%; height:auto; }
.nw-caption { font-family:Arial,Helvetica,sans-serif; font-size:11.5px; color:#888; margin:6px 2px 0; }

/* Texto */
.nw-body p { font-size:16.5px; line-height:1.65; margin:16px 0; }
.nw-body p:first-of-type::first-letter { font-size:44px; font-weight:900; float:left; line-height:.85; padding:4px 8px 0 0; }
.nw-quote { border-left:4px solid #b3261e; padding:6px 0 6px 14px; margin:18px 0; font-size:18px; font-style:italic; color:#333; }
.nw-quote small { display:block; font-style:normal; font-family:Arial,Helvetica,sans-serif; font-size:12px; color:#888; margin-top:6px; }

/* Compartidos / interacción */
.nw-sharebar { display:flex; gap:14px; align-items:center; margin:20px 0 6px; padding:12px 0; border-top:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;
  font-family:Arial,Helvetica,sans-serif; font-size:12.5px; color:#666; }
.nw-sharebar .pill { display:inline-flex; align-items:center; gap:6px; }
.nw-sharebar .pill i { width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-style:normal; font-size:13px; font-weight:700; }
.nw-sharebar .fb i { background:#1877f2; } .nw-sharebar .tw i { background:#111; } .nw-sharebar .wa i { background:#25d366; }

/* Comentarios */
.nw-comments { margin-top:14px; font-family:Arial,Helvetica,sans-serif; }
.nw-comments h3 { font-size:14px; letter-spacing:.5px; text-transform:uppercase; color:#444; margin:0 0 12px; }
.nw-comment { display:flex; gap:10px; padding:10px 0; border-bottom:1px solid #efefef; }
.nw-comment .cavatar { width:32px; height:32px; border-radius:50%; color:#fff; font-weight:700; font-size:13px;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.nw-comment .cbody { font-size:13.5px; line-height:1.45; color:#333; }
.nw-comment .cbody b { display:inline-block; margin-right:6px; }
.nw-comment .cbody time { color:#999; font-size:11.5px; margin-left:6px; }
.nw-comment .likes { font-size:11.5px; color:#999; margin-top:4px; }

/* Estado de espera (sin titular todavía) */
.nw-waiting { text-align:center; padding:70px 20px; color:#999; font-family:Arial,Helvetica,sans-serif; font-size:14px; }
.nw-waiting .spin { width:26px; height:26px; margin:0 auto 14px; border:3px solid #eee; border-top-color:#b3261e; border-radius:50%; animation:nwSpin 1s linear infinite; }
@keyframes nwSpin { to { transform:rotate(360deg); } }

/* ===================== CONTROL ===================== */
.tt-templates { display:flex; flex-direction:column; gap:8px; width:100%; }
.tt-tpl { text-align:left; font-size:13px; line-height:1.35; padding:10px 12px; border-radius:12px; cursor:pointer;
  border:1.5px solid var(--line); background:#fff; color:#3a3550; }
.tt-tpl.sel { border-color:var(--brand1); background:rgba(108,92,231,.08); box-shadow:0 0 0 2px rgba(108,92,231,.14); }
.tt-tpl b { color:var(--brand1); }
.tt-preview { width:100%; border:1px solid #e2e2e2; border-left:4px solid #b3261e; border-radius:8px; padding:10px 12px;
  text-align:left; background:#fafafa; }
.tt-preview .k { font-size:10px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:#b3261e; }
.tt-preview .h { font-family:Georgia,serif; font-size:16.5px; font-weight:900; line-height:1.25; color:#1a1a1a; margin-top:4px; }
.tt-preview .m { font-size:11px; color:#888; margin-top:6px; }