/* Noticias de La Mirada Tecno · misma voz que Mayores: noche, palo seco para titulares y
   serif para leer. Las páginas las genera el redactor; este archivo se edita a mano.

   Formato de noticia diaria: portada (titular grande, titular sobre la imagen o conversación
   animada) y después piezas: cada párrafo se entiende solo y puede llevar un visual.
   Esencial va en palo seco y ámbar; Profundizar, en serif y azul, como en los reportajes.

   Lectura y concentración (16-oct-2026):
   - el cuerpo de texto no es blanco puro sobre negro puro: menos halo, misma nitidez (14,9:1);
   - línea de unas 65 letras, interlineado amplio, sin viudas, palabras partidas solo en móvil;
   - ajustes del lector: nivel, tamaño de letra, fondo Noche o Papel y movimiento sí o no;
   - una línea de progreso arriba y una cabecera que se aparta al bajar y vuelve al subir;
   - el movimiento sigue (portada y visuales), pero una sola vez y nunca mientras se lee.
   Sin JavaScript o con «reducir movimiento», se ve el estado final. */
@font-face{font-family:"Instrument Sans Local";font-style:normal;font-weight:400 700;font-stretch:75% 100%;
  font-display:swap;src:url("/fonts/instrument-sans-latin.woff2") format("woff2")}
@font-face{font-family:"Newsreader Local";font-style:normal;font-weight:300 800;font-display:swap;
  src:url("/fonts/newsreader-latin.woff2") format("woff2")}
@font-face{font-family:"Newsreader Local";font-style:italic;font-weight:300 800;font-display:swap;
  src:url("/fonts/newsreader-latin-italic.woff2") format("woff2")}

/* ───────── colores: Noche (por defecto) y Papel ─────────
   La portada y la cabecera son siempre de noche: son la cara de la marca. */
:root,
html[data-tema="papel"] .portada,
html[data-tema="papel"] .barra,
html[data-tema="papel"] .ajustes{
  --bg:#070a14;
  --sup:#0d1322;
  --sup-2:#0a0f1c;
  --ink:#f4f1ea;
  --texto:#e3dfd7;
  --ink-2:#c9ccd5;
  --muted:#a3a9b6;
  --rule:#222a3c;
  --rule-2:#363e55;
  --acento:#f2b75e;
  --sobre-acento:#1d1206;
  --es:#ffb347; --es-2:#ef784c;
  --pro:#9fb2ff; --pro-2:#7189e8;
  --chip-es:#ffd08a; --chip-pro:#cdd7ff;
  --si:#5fd4a6;
  --no:#ff7a6b;
  --cifra-1:#ffe0a8;
  --visual:linear-gradient(160deg,#0e1424,#080b15);
  --sel:rgb(242 183 94 / .32);
  color-scheme:dark;
}
html[data-tema="papel"]{
  --bg:#f5f1e8;
  --sup:#fffdf8;
  --sup-2:#ece6da;
  --ink:#15171d;
  --texto:#24262d;
  --ink-2:#3f4452;
  --muted:#636a78;
  --rule:#ddd4c4;
  --rule-2:#c6bba8;
  --acento:#9a5300;
  --sobre-acento:#fffaf2;
  --es:#8f4d00; --es-2:#b84d1c;
  --pro:#3550b5; --pro-2:#2b45a6;
  --chip-es:#8f4d00; --chip-pro:#2f47a8;
  --si:#11795a;
  --no:#b4301f;
  --cifra-1:#c77a12;
  --visual:linear-gradient(160deg,#fffdf8,#f1ebe0);
  --sel:rgb(154 83 0 / .2);
  color-scheme:light;
}
:root{
  --modo:var(--es);
  --sans:"Instrument Sans Local",ui-sans-serif,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --serif:"Newsreader Local",ui-serif,"Iowan Old Style",Georgia,serif;
  --col:40rem;
  --ancho:72rem;
}
html[data-nivel="completo"]{--modo:var(--pro)}
/* tamaño de letra del lector: todo crece a la vez y la línea sigue teniendo las mismas letras */
html[data-tam="2"]{font-size:112.5%}
html[data-tam="3"]{font-size:125%}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--texto);font-family:var(--sans);-webkit-font-smoothing:antialiased;
  overflow-x:hidden;line-height:1.5}
html:not([data-mov="no"]) body{transition:background-color .35s ease,color .35s ease}
a{color:inherit}
::selection{background:var(--sel)}
:focus-visible{outline:2px solid var(--acento);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* los dos niveles de lectura: solo uno está en el flujo */
html[data-nivel="sencillo"] [data-nivel="completo"],
html[data-nivel="completo"] [data-nivel="sencillo"]{display:none!important}

/* sin movimiento: lo que se mueve aparece ya en su sitio */
html[data-mov="no"] *,html[data-mov="no"] *::before,html[data-mov="no"] *::after{
  animation:none!important;transition:none!important;scroll-behavior:auto!important}

.barra,.listado,.pie{padding-left:max(1.25rem,env(safe-area-inset-left,0px));
  padding-right:max(1.25rem,env(safe-area-inset-right,0px))}

/* ───────── progreso de lectura ───────── */
.progreso{position:fixed;inset:0 0 auto;z-index:20;height:3px;pointer-events:none}
.progreso span{display:block;height:100%;background:var(--modo);transform-origin:0 50%;transform:scaleX(0);
  box-shadow:0 0 12px color-mix(in srgb,var(--modo) 60%,transparent)}
html:not(.js) .progreso{display:none}

/* ───────── cabecera ───────── */
.barra{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:.5rem;
  min-height:4rem;padding-block:.6rem;background:rgb(7 10 20 / .88);border-bottom:1px solid var(--rule);
  color:var(--ink);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  transition:transform .32s cubic-bezier(.2,.7,.2,1)}
/* al leer, la cabecera se aparta; al subir un poco, vuelve */
.barra.fuera{transform:translateY(-100%)}
.marca{margin-right:auto;font-family:var(--serif);font-weight:620;font-size:1.22rem;letter-spacing:-.018em;
  text-decoration:none;white-space:nowrap}
.barra nav{display:flex;gap:.45rem}
.barra nav a{display:inline-grid;place-items:center;min-height:44px;padding:0 .95rem;border:1px solid var(--rule-2);
  border-radius:999px;text-decoration:none;font-size:.88rem;color:var(--ink-2)}
.barra nav a:hover{color:var(--acento);border-color:var(--acento)}
.barra__aa{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--rule-2);
  border-radius:999px;background:none;color:var(--ink);font:700 1rem/1 var(--serif);letter-spacing:-.02em;cursor:pointer}
.barra__aa[hidden]{display:none}
.barra__aa:hover,.barra__aa[aria-expanded="true"]{color:var(--acento);border-color:var(--acento)}
@media (max-width:440px){
  .barra nav{display:none}
  .marca{font-size:1.12rem}
}

/* ───────── ajustes de lectura ───────── */
.ajustes{position:fixed;z-index:30;top:4.6rem;right:max(1rem,env(safe-area-inset-right,0px));
  width:min(21rem,calc(100vw - 2rem));padding:1rem 1rem 1.1rem;border:1px solid var(--rule-2);border-radius:18px;
  background:rgb(13 19 34 / .97);color:var(--ink);box-shadow:0 30px 80px -30px rgb(0 0 0 / .8);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.ajustes[hidden]{display:none}
.ajustes__t{margin:0 0 .8rem;font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.ajustes__g{display:grid;grid-template-columns:5.2rem minmax(0,1fr);align-items:center;gap:.6rem;margin-top:.6rem}
.ajustes__l{font-size:.86rem;color:var(--ink-2)}
.ajustes__op{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;padding:3px;border:1px solid var(--rule-2);
  border-radius:999px;background:var(--sup-2)}
.ajustes__op button{min-height:38px;padding:0 .5rem;border:0;border-radius:999px;background:none;color:var(--ink-2);
  font:600 .84rem/1 var(--sans);cursor:pointer;white-space:nowrap}
.ajustes__op button:hover{color:var(--ink)}
.ajustes__op button[aria-pressed="true"]{background:var(--ink);color:#0a0d17}
.ajustes__op .a1{font-size:.8rem}.ajustes__op .a2{font-size:1rem}.ajustes__op .a3{font-size:1.2rem}
.ajustes__op .a1,.ajustes__op .a2,.ajustes__op .a3{font-family:var(--serif);font-weight:700}
.ajustes__nota{margin:.9rem 0 0;font-size:.76rem;line-height:1.4;color:var(--muted)}
@media (max-width:520px){
  .ajustes{top:auto;bottom:max(.75rem,env(safe-area-inset-bottom,0px));right:.75rem;left:.75rem;width:auto}
}

/* ───────── portada ───────── */
.portada{position:relative;isolation:isolate;overflow:hidden;border-bottom:1px solid var(--rule);
  background-color:var(--bg);color:var(--ink)}
.portada__in{position:relative;width:min(100% - 2.5rem,var(--ancho));margin-inline:auto;
  padding-block:clamp(2.2rem,7vw,5rem) clamp(2.4rem,6vw,4.6rem)}
.portada__k{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .55rem;margin:0 0 1.1rem;
  font-size:.82rem;color:var(--muted)}
.portada__k > * + *::before{content:"·";margin-right:.55rem;color:#59617a}
.portada__cat{color:var(--acento);font-weight:700;text-transform:uppercase;letter-spacing:.13em;font-size:.72rem}
@media (max-width:520px){
  .portada__cat{flex-basis:100%}
  .portada__cat + *::before{content:none}
}
.portada__h{margin:0;font-weight:700;letter-spacing:-.045em;line-height:.94;text-wrap:balance;
  font-size:clamp(2.55rem,8.4vw,5.4rem);max-width:15ch}
.portada__firma{margin:1.3rem 0 0;font-size:.86rem;color:var(--muted)}
.portada__firma b{color:var(--ink-2);font-weight:600}

/* titular grande: tipografía sola, con un resplandor del color de la sección */
.portada--texto{background:
  radial-gradient(ellipse 60% 90% at 88% 10%,rgb(242 183 94 / .16),transparent 70%),
  radial-gradient(ellipse 50% 70% at 10% 110%,rgb(113 137 232 / .14),transparent 70%),var(--bg)}
.portada--texto .portada__h{max-width:18ch}

/* titular sobre la imagen: la foto engancha; el titular se lee siempre gracias al velo */
.portada--imagen{min-height:min(88svh,46rem);display:grid;align-items:end}
.portada__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.portada--imagen::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgb(7 10 20 / .15) 0,rgb(7 10 20 / .35) 40%,rgb(7 10 20 / .94) 88%)}
.portada--imagen .portada__h{text-shadow:0 10px 40px rgb(0 0 0 / .55)}
.portada__cred{position:absolute;right:max(1.25rem,env(safe-area-inset-right,0px));bottom:.6rem;margin:0;
  font-size:.7rem;color:rgb(246 243 237 / .7)}

/* conversación animada: un trozo breve que se mueve y explica la noticia antes de leerla */
.portada--chat{background:
  radial-gradient(ellipse 46% 70% at 82% 50%,rgb(255 122 107 / .13),transparent 72%),
  radial-gradient(ellipse 50% 60% at 0% 0%,rgb(113 137 232 / .10),transparent 70%),var(--bg)}
.portada--chat .portada__in{display:grid;gap:clamp(2rem,5vw,3rem);align-items:center}
@media (min-width:900px){
  .portada--chat .portada__in{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
  .portada--chat .chat{justify-self:end}
}
.chat{position:relative;margin:0;width:100%;max-width:29rem;padding:1.4rem 1rem 1rem;border-radius:24px;
  border:1px solid var(--rule-2);background:linear-gradient(180deg,#0f1526,#0a0e1a);
  box-shadow:0 40px 90px -46px #000,inset 0 1px rgb(255 255 255 / .05)}
.chat__rec{position:absolute;top:-.72rem;left:1rem;margin:0;padding:.18rem .6rem;border-radius:999px;
  background:var(--bg);border:1px solid var(--rule-2);font-size:.64rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--muted)}
.chat__ms{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem;
  opacity:.62;filter:saturate(.65)}
.chat__m{max-width:84%;padding:.62rem .9rem;border-radius:18px;font-size:1rem;line-height:1.35}
.chat__m--tu{align-self:flex-end;border-bottom-right-radius:6px;color:#fff;background:#3a4566;
  background:color-mix(in oklab,#3a4566,#c63a2f calc(var(--ira,0) * 88%));
  font-weight:calc(470 + var(--ira,0) * 200)}
.chat__m--ia{align-self:flex-start;border-bottom-left-radius:6px;background:#1b2234;color:var(--ink-2)}
.chat__fin{display:flex;align-items:center;gap:.6rem;margin:1rem 0 0;padding:.75rem .9rem;border-radius:14px;
  background:rgb(255 122 107 / .13);border:1px solid rgb(255 122 107 / .4);color:#ffc9c0;font-weight:650;font-size:.98rem}
.chat__fin svg{flex:none;width:1.15rem;height:1.15rem;color:var(--no)}
.chat__caja{position:relative;margin:.7rem 0 0;padding:.78rem .95rem;border-radius:14px;border:1px dashed #4a3a44;
  color:#8d7f88;font-size:.9rem}
.chat__caja-a{position:absolute;left:.95rem;top:.78rem;opacity:0}
.chat__otra{position:absolute;right:.8rem;top:-.95rem;min-height:32px;padding:0 .75rem;border-radius:999px;
  border:1px solid var(--rule-2);background:var(--bg);color:var(--ink-2);font:inherit;font-size:.74rem;cursor:pointer}
.chat__otra:hover{color:var(--acento);border-color:var(--acento)}
html[data-mov="no"] .chat__otra{display:none}
@media (prefers-reduced-motion:no-preference){
  .chat__m{animation:chat-entra .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.55s + var(--i) * 1.05s)}
  .chat__ms{animation:chat-apaga .7s ease both;animation-delay:calc(.55s + var(--n) * 1.05s + .25s)}
  .chat__fin{animation:chat-fin .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.55s + var(--n) * 1.05s + .45s)}
  .chat__caja{animation:chat-caja .4s ease both;animation-delay:calc(.55s + var(--n) * 1.05s + .45s)}
  .chat__caja-a{animation:chat-sale .3s ease both;animation-delay:calc(.55s + var(--n) * 1.05s + .45s)}
  .chat__caja-b{animation:chat-sale .3s ease reverse both;animation-delay:calc(.55s + var(--n) * 1.05s + .55s)}
  .chat--parado,.chat--parado *{animation:none!important}
}
@keyframes chat-entra{from{opacity:0;transform:translateY(10px) scale(.96)}}
@keyframes chat-apaga{from{opacity:1;filter:saturate(1)}}
@keyframes chat-fin{from{opacity:0;transform:translateY(12px)}}
@keyframes chat-caja{from{border-color:var(--rule-2);color:var(--muted)}}
@keyframes chat-sale{from{opacity:1}to{opacity:0}}

/* ───────── nivel de lectura ───────── */
.lectura{width:min(100% - 2.5rem,var(--col));margin:2rem auto 0;display:flex;flex-wrap:wrap;align-items:center;
  gap:.7rem 1rem}
.lectura__t,.lectura__una{margin:0;font-size:.82rem;color:var(--muted)}
.conmutador{display:inline-flex;gap:2px;padding:4px;border:1px solid var(--rule-2);border-radius:999px;background:var(--sup-2)}
.conmutador button{min-height:44px;padding:0 1.05rem;border:0;border-radius:999px;background:none;color:var(--ink-2);
  font:inherit;font-size:.92rem;font-weight:650;cursor:pointer;transition:background-color .2s,color .2s}
.conmutador button span{font-weight:400;opacity:.72}
html[data-nivel="sencillo"] .conmutador [data-val="sencillo"]{background:linear-gradient(135deg,#ffd08a,#ef784c);color:#1d1206}
html[data-nivel="completo"] .conmutador [data-val="completo"]{background:linear-gradient(135deg,#d8dfff,#7189e8);color:#0c1433;
  font-family:var(--serif)}
html:not(.js) .conmutador,html:not(.js) .lectura__t{display:none}

/* ───────── una noticia ─────────
   Columna de unas 65 letras. Esencial en palo seco, Profundizar en serif. */
.noticia{width:min(100% - 2.5rem,var(--col));margin-inline:auto;padding-block:1.4rem 3rem}
.noticia__entradilla{margin:0 0 2.6rem;padding-bottom:2.2rem;border-bottom:1px solid var(--rule);
  font-family:var(--serif);font-size:clamp(1.24rem,2.6vw,1.46rem);line-height:1.45;color:var(--ink);text-wrap:pretty}
.noticia__figura{margin:0 0 2.4rem}
.noticia__figura img{display:block;width:100%;height:auto;border-radius:12px;background:var(--sup)}
.noticia__figura figcaption{margin-top:.55rem;font-size:.8rem;color:var(--muted)}

.pieza{margin:0 0 2.9rem}
.pieza__t{margin:0 0 .75rem;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--modo)}
.pieza__txt p{margin:0 0 1.05em;color:var(--texto);text-wrap:pretty}
.pieza__txt p:last-child{margin-bottom:0}
html[data-nivel="sencillo"] .pieza__txt p{font-family:var(--sans);font-size:1.17rem;line-height:1.64;letter-spacing:.003em}
html[data-nivel="completo"] .pieza__txt p{font-family:var(--serif);font-size:1.19rem;line-height:1.72}
@media (max-width:600px){ .pieza__txt p{hyphens:auto;-webkit-hyphens:auto} }

.pieza--opinion{padding:1.4rem 1.5rem;border:1px solid color-mix(in srgb,var(--acento) 32%,transparent);border-radius:18px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--acento) 8%,transparent),transparent 72%)}
.pieza__k{margin:0 0 .7rem;font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--acento)}
html .pieza--opinion .pieza__txt p{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.8vw,1.45rem);
  line-height:1.45;color:var(--ink)}

.pieza--pregunta{padding-top:2rem;border-top:1px solid var(--rule)}
html .pieza--pregunta .pieza__txt p:first-child{font-family:var(--sans);font-weight:700;letter-spacing:-.025em;
  font-size:clamp(1.55rem,4.2vw,2.1rem);line-height:1.14;text-wrap:balance;color:var(--ink);hyphens:manual}

.opina{display:grid;gap:.6rem;margin-top:1.4rem}
.opina__boton{justify-self:start;min-height:48px;padding:0 1.35rem;border-radius:999px;border:1px solid var(--acento);
  background:var(--acento);color:var(--sobre-acento);font:inherit;font-weight:700;cursor:pointer}
.opina__boton:hover{filter:brightness(1.08)}
.opina__aviso{margin:0;font-size:.88rem;color:var(--si)}
.opina__aviso:empty{display:none}
.opina__t{margin:.4rem 0 0;font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.opina__redes{list-style:none;display:flex;gap:.25rem;margin:0 0 0 -.55rem;padding:0}
.opina__redes a{display:grid;place-items:center;width:52px;height:52px;border-radius:10px;color:var(--ink-2);
  border:1px solid transparent}
.opina__redes a:hover{color:var(--acento);border-color:color-mix(in srgb,var(--acento) 30%,transparent);
  background:color-mix(in srgb,var(--acento) 8%,transparent)}
.opina__redes svg{width:28px;height:28px;fill:currentColor}

/* ───────── visuales: se dibujan con los datos de la pieza, una sola vez ───────── */
.visual{margin:1.8rem 0 0;padding:clamp(1.1rem,3vw,1.5rem);border:1px solid var(--rule);border-radius:20px;
  background:var(--visual)}
.visual__t{margin:0 0 1.1rem;font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.visual__pie{margin:1.1rem 0 0;font-size:.8rem;color:var(--muted)}
.anim{transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1);
  transition-delay:calc(.12s + var(--i,0) * .16s)}
html.js .visual:not(.visto) .anim{opacity:0;transform:translateY(14px)}

/* cronología */
.crono{position:relative;list-style:none;margin:0;padding:0 0 0 1.7rem;display:grid;gap:1.15rem}
.crono::before{content:"";position:absolute;left:.4rem;top:.45rem;bottom:.45rem;width:2px;border-radius:2px;
  background:linear-gradient(var(--rule-2),var(--acento));transform-origin:top;
  transition:transform 1.5s cubic-bezier(.3,.7,.2,1) .1s}
html.js .visual:not(.visto) .crono::before{transform:scaleY(0)}
.crono__i{position:relative;display:grid;gap:.12rem}
.crono__i::before{content:"";position:absolute;left:-1.7rem;top:.28rem;width:.85rem;height:.85rem;border-radius:50%;
  background:var(--bg);border:2px solid var(--rule-2)}
.crono__c{font-size:.76rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.crono__q{font-size:1.04rem;line-height:1.42;color:var(--texto)}
.crono__i--clave::before{background:var(--acento);border-color:var(--acento);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--acento) 18%,transparent)}
.crono__i--clave .crono__c{color:var(--acento)}
.crono__i--clave .crono__q{font-weight:650;color:var(--ink)}

/* sí y no */
.sino{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
@media (max-width:560px){.sino{grid-template-columns:1fr}}
.sino__col{padding:1rem 1rem 1.1rem;border:1px solid;border-radius:16px}
.sino__col--si{border-color:color-mix(in srgb,var(--si) 34%,transparent);background:color-mix(in srgb,var(--si) 7%,transparent)}
.sino__col--no{border-color:color-mix(in srgb,var(--no) 42%,transparent);background:color-mix(in srgb,var(--no) 8%,transparent)}
.sino__t{margin:0 0 .8rem;font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sino__col--si .sino__t,.sino__col--si svg{color:var(--si)}
.sino__col--no .sino__t,.sino__col--no svg{color:var(--no)}
.sino ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.sino li{display:grid;grid-template-columns:1.35rem minmax(0,1fr);gap:.55rem;align-items:start;font-size:1.02rem;
  line-height:1.38;color:var(--texto)}
.sino svg{width:1.35rem;height:1.35rem}
.sino__col--no li{font-size:1.1rem;font-weight:650;color:var(--ink)}

/* pasos: escalera, cada paso un poco más adentro */
.pasos{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.paso{display:grid;grid-template-columns:2.3rem minmax(0,1fr);gap:.8rem;align-items:center;
  margin-left:calc(var(--i,0) * .85rem);padding:.75rem .9rem;border:1px solid var(--rule);border-radius:14px;
  background:color-mix(in srgb,var(--ink) 3%,transparent);font-size:1.02rem;line-height:1.38;color:var(--texto)}
.paso__n{display:grid;place-items:center;width:2.3rem;height:2.3rem;border:1px solid var(--rule-2);border-radius:50%;
  font-weight:700;color:var(--ink-2)}
.paso--clave{border-color:color-mix(in srgb,var(--no) 50%,transparent);background:color-mix(in srgb,var(--no) 10%,transparent)}
.paso--clave .paso__n{border-color:var(--no);background:var(--no);color:var(--bg)}
.paso--clave .paso__x{font-weight:650;color:var(--ink)}
@media (max-width:560px){.paso{margin-left:calc(var(--i,0) * .4rem)}}

/* cita */
.visual--cita{padding:.2rem 0 .2rem 1.3rem;border:0;border-left:3px solid var(--modo);border-radius:0;background:none}
.cita{margin:0}
.cita p{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.38rem,3.3vw,1.78rem);line-height:1.3;
  color:var(--ink);text-wrap:pretty}
.cita__a{display:flex;flex-wrap:wrap;gap:.2rem .5rem;margin:.9rem 0 0;font-size:.88rem;color:var(--muted)}
.cita__a b{color:var(--ink-2);font-weight:650}

/* cifra */
.cifra{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .7rem;margin:0}
.cifra__n{font-weight:720;letter-spacing:-.05em;line-height:.9;font-size:clamp(3.4rem,12vw,6rem);color:var(--acento);
  background:linear-gradient(135deg,var(--cifra-1),var(--acento) 55%,var(--es-2));-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.cifra__u{font-size:1.2rem;font-weight:600;color:var(--ink-2)}
.cifra__x{margin:.7rem 0 0;font-size:1.06rem;line-height:1.45;color:var(--ink-2)}

/* ───────── final: fuentes, correcciones y por dónde seguir ───────── */
.fuentes,.correcciones{margin-top:2.6rem;padding-top:1.2rem;border-top:1px solid var(--rule)}
.fuentes h2,.correcciones h2{margin:0 0 .7rem;font-size:1rem;font-weight:650;color:var(--ink)}
.fuentes__nota{margin:0 0 .8rem;font-size:.9rem;color:var(--muted)}
.fuentes ul,.correcciones ul{margin:0;padding-left:1.1rem;color:var(--ink-2);line-height:1.6}
.fuentes li{margin-bottom:.3rem}
.fuentes a{color:var(--acento);text-underline-offset:3px;overflow-wrap:anywhere}
.correcciones li{font-size:.95rem}
.sigue{margin-top:2.6rem;padding:1.2rem;border:1px solid var(--rule);border-radius:18px;background:var(--sup)}
.sigue__t{margin:0 0 .8rem;font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.sigue__op{display:flex;flex-wrap:wrap;gap:.6rem}
.sigue__op a{display:inline-grid;place-items:center;min-height:46px;padding:0 1.2rem;border:1px solid var(--acento);
  border-radius:999px;color:var(--acento);text-decoration:none;font-weight:620}
.sigue__op a:first-child{background:var(--acento);color:var(--sobre-acento)}
.sigue__op a:hover{filter:brightness(1.08)}
.noticia__volver{margin:2.6rem 0 0}
.noticia__volver a{display:inline-grid;place-items:center;min-height:46px;padding:0 1.2rem;
  border:1px solid var(--acento);border-radius:999px;color:var(--acento);text-decoration:none;font-weight:600}
.noticia__volver a:hover{background:var(--acento);color:var(--sobre-acento)}

/* ───────── listado ───────── */
.listado{width:min(100%,56rem);margin-inline:auto;padding-block:clamp(2rem,6vw,3.5rem) 3rem}
.listado h1{margin:0 0 .5rem;font-weight:680;letter-spacing:-.035em;font-size:clamp(2.4rem,7vw,3.6rem);line-height:1;color:var(--ink)}
.listado__d{margin:0 0 2.2rem;font-family:var(--serif);font-size:1.15rem;color:var(--ink-2);max-width:40rem}
.mes{margin-bottom:2.4rem}
.mes__t{margin:0 0 .4rem;padding-bottom:.6rem;border-bottom:1px solid var(--rule);font-size:.95rem;font-weight:650;
  color:var(--muted)}
.notas{list-style:none;margin:0;padding:0}
.nota{padding:1.1rem 0;border-bottom:1px solid var(--rule)}
.nota article{position:relative;display:grid;grid-template-columns:10rem minmax(0,1fr);gap:1.2rem;align-items:start}
@media (max-width:560px){.nota article{grid-template-columns:6.2rem minmax(0,1fr);gap:.9rem}}
.nota__img{display:block;aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:var(--sup)}
.nota__img img{display:block;width:100%;height:100%;object-fit:cover}
.nota__img--tipo{display:grid;align-items:end;padding:.6rem;background:linear-gradient(135deg,var(--sup-2),var(--sup))}
.nota__img--tipo b{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--acento);line-height:1.2}
.nota__c{display:grid;gap:.35rem}
.nota__meta{display:flex;flex-wrap:wrap;gap:.3rem .9rem;margin:0;font-size:.82rem;color:var(--muted)}
.nota__meta span{color:var(--acento);font-weight:650}
.nota__t{margin:0;font-size:clamp(1.18rem,2.6vw,1.42rem);font-weight:650;letter-spacing:-.015em;line-height:1.2;color:var(--ink)}
.nota__t a{text-decoration:none}
.nota__t a::after{content:"";position:absolute;inset:0}
.nota__t a:focus-visible{outline:none}
.nota article:has(a:focus-visible){outline:2px solid var(--acento);outline-offset:4px;border-radius:12px}
.nota article:hover .nota__t a{color:var(--acento)}
.nota__d{margin:0;font-family:var(--serif);font-size:1.04rem;line-height:1.5;color:var(--ink-2);max-width:42rem;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
@media (max-width:560px){.nota__d{-webkit-line-clamp:3;font-size:.98rem}}
.nota__l{display:flex;flex-wrap:wrap;gap:.35rem;margin:.15rem 0 0}
.nota__f{margin:0;font-size:.8rem;color:var(--muted)}
/* noticia ya leída en este dispositivo: se aparta un paso para que destaque lo nuevo */
.nota--leida .nota__t,.nota--leida .nota__d{color:var(--muted)}
.nota--leida .nota__img{opacity:.6}
.nota--leida .nota__meta::after{content:"Leída";padding:0 .45rem;border-radius:999px;border:1px solid var(--rule-2);
  font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.6}
.prof-chip{display:inline-flex;align-items:center;min-height:26px;padding:0 .6rem;border:1px solid var(--rule-2);
  border-radius:999px;font-size:.7rem;font-weight:650;color:var(--ink-2);white-space:nowrap}
.prof-chip--esencial{color:var(--chip-es);border-color:color-mix(in srgb,var(--es) 32%,transparent);
  background:color-mix(in srgb,var(--es) 11%,transparent)}
.prof-chip--pro{color:var(--chip-pro);border-color:color-mix(in srgb,var(--pro) 32%,transparent);
  background:color-mix(in srgb,var(--pro) 11%,transparent);font-family:var(--serif);font-weight:600}
.vacio{padding:1.5rem;border:1px dashed var(--rule);border-radius:12px;color:var(--muted)}

/* ───────── pie ───────── */
.pie{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;padding-block:1.6rem calc(2rem + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--rule);font-size:.85rem;color:var(--muted)}
.pie p{margin:0}
.pie a{text-decoration:none;border-bottom:1px solid var(--rule-2)}

@media (max-width:420px){
  .chat__m{font-size:.95rem}
  /* «Ver otra vez» baja al borde inferior para no pisar la etiqueta «Recreación» */
  .chat__otra{top:auto;bottom:-1rem}
}
@media (prefers-reduced-motion:reduce){
  .anim,.crono::before,.barra{transition:none}
}

/* ───────── imprimir: solo el texto, negro sobre blanco ───────── */
@media print{
  .barra,.progreso,.ajustes,.lectura,.opina,.sigue,.noticia__volver,.chat,.pie{display:none!important}
  :root,html[data-tema="papel"],html[data-tema="papel"] .portada{--bg:#fff;--texto:#000;--ink:#000;--ink-2:#222;--muted:#444;--rule:#bbb;--visual:none}
  body{background:#fff;color:#000}
  .portada{background:#fff!important;color:#000;border-bottom:1px solid #bbb}
  .chat{break-inside:avoid}
  .visual{break-inside:avoid;border-color:#bbb}
  .anim{opacity:1!important;transform:none!important}
}