/* Diseño de periódico: blanco, tinta negra, filetes finos y un solo color de acento. */
:root {
  color-scheme: light;
  --bg: #ffffff; --ink: #161616; --muted: #5f5f5f; --line: #d9d9d9; --rule: #161616; --accent: #a3201a; --tint: #f5f2ec; --mark: #fff2b3;
  --head: Georgia, 'Times New Roman', Times, serif;
  --text: Georgia, 'Times New Roman', Times, serif;
  --ui: Arial, Helvetica, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 18px/1.6 var(--text); overflow-x: clip; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: var(--tint); }
h1, h2, h3 { font-family: var(--head); font-weight: 700; line-height: 1.14; margin: 0; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
main.wrap { padding-top: 22px; padding-bottom: 48px; }
article a:hover h2, article a:hover h3, .lines a:hover, .toc a:hover, .caso-t a:hover, .foot a:hover, .nav a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* Cabecera */
.mast { text-align: center; padding: 16px 0 12px; }
.logo { display: block; font: 700 clamp(34px, 6.2vw, 62px)/1 var(--head); letter-spacing: -.02em; }
.mast p { margin: 7px 0 0; font: 13px/1.3 var(--ui); color: var(--muted); }
.nav { border-top: 1px solid var(--rule); border-bottom: 3px double var(--rule); font: 700 14px/1 var(--ui); }
.nav ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 22px; list-style: none; margin: 0; padding: 0; }
.nav a { display: block; padding: 11px 0; }
.nav a[aria-current] { color: var(--accent); }
.ticker { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 22px; padding: 8px 0; border-bottom: 1px solid var(--line); font: 13px/1.4 var(--ui); color: var(--muted); }
.ticker b { color: var(--ink); font-variant-numeric: tabular-nums; }
.ticker a { text-decoration: underline; text-underline-offset: 2px; }

/* Etiquetas y titulares */
.tag { display: block; font: 700 12px/1.2 var(--ui); color: var(--accent); margin-bottom: 5px; }
.mins { display: none; }
.h { font: 700 19px/1.2 var(--head); padding-top: 7px; border-top: 3px solid var(--rule); margin-bottom: 14px; }
.h a:hover { text-decoration: underline; }
.page-h { font-size: clamp(32px, 5vw, 48px); margin-bottom: 8px; }
.lede { font-size: 20px; line-height: 1.45; color: var(--muted); margin: 0 0 22px; max-width: 760px; }

/* Portada: empieza por el problema del lector, no por una parrilla */
.ask { padding: 8px 0 34px; }
.ask h1 { font-size: clamp(44px, 8vw, 92px); letter-spacing: -.03em; line-height: 1; margin-bottom: 22px; }
.ask-g { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 44px; align-items: start; }
.ask-l { list-style: none; margin: 0; padding: 0; }
.ask-l a { display: block; padding: 13px 0; border-top: 1px solid var(--rule); font: 700 clamp(23px, 2.9vw, 34px)/1.12 var(--head); letter-spacing: -.012em; color: #8a8a8a; transition: color .12s, padding .12s; }
.ask-l li:last-child a { border-bottom: 1px solid var(--rule); }
.ask-l a:hover { color: var(--ink); }
.ask-l a[aria-current] { color: var(--accent); padding-left: 16px; box-shadow: inset 5px 0 0 var(--accent); }
.panel img { margin-bottom: 14px; aspect-ratio: 16 / 8; }
.panel h2 { font-size: 26px; margin-bottom: 12px; }
.panel + .panel { margin-top: 30px; }
.panel[hidden] { display: none; }
.panel + .panel[hidden] { margin: 0; }
.steps { list-style: none; margin: 0; padding: 0; font: 16px/1.42 var(--ui); }
.steps li { display: grid; grid-template-columns: 124px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-top: 1px solid var(--line); }
.steps b { font: 700 16px/1.42 var(--head); }
.go { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 12px 0 0; font: 14px/1.3 var(--ui); }
.go a { text-decoration: underline; text-underline-offset: 2px; }
.go .go-main { background: var(--ink); color: #fff; padding: 9px 13px; font-weight: 700; text-decoration: none; }
.go .go-main:hover { background: var(--accent); }
.band { margin: 0 calc(50% - 50vw); padding: 38px max(16px, calc(50vw - 574px)) 30px; background: var(--ink); color: #fff; }
.frase p { margin: 0; font: 400 clamp(25px, 3.6vw, 43px)/1.32 var(--head); letter-spacing: -.012em; max-width: 1040px; }
.frase input { font: inherit; color: #ffe27a; background: none; border: 0; border-bottom: 2px dashed #ffe27a; border-radius: 0; padding: 0 2px; text-align: center; -moz-appearance: textfield; appearance: textfield; }
.frase input::-webkit-outer-spin-button, .frase input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.frase input:focus { outline: 2px solid #ffe27a; outline-offset: 2px; }
#c { width: 4.6em; } #y { width: 1.6em; } #r { width: 2.5em; }
.frase output { font-weight: 700; white-space: nowrap; }
.band small { display: block; margin-top: 14px; font: 13px/1.45 var(--ui); color: #c9c9c9; max-width: 780px; }
.band a { text-decoration: underline; color: #fff; }
.story { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 34px; align-items: center; margin: 44px 0; }
.story figure { margin: 0 0 0 calc(590px - 50vw); }
@media (max-width: 1180px) { .story figure { margin-left: -16px; } }
.story img { aspect-ratio: 16 / 11; }
.story h2 { font-size: clamp(28px, 3.3vw, 40px); margin-bottom: 12px; letter-spacing: -.012em; }
.story h2 a:hover { text-decoration: underline; }
.story p { margin: 0 0 10px; font-size: 17px; line-height: 1.5; }
.story small { font: 12.5px/1.4 var(--ui); color: var(--muted); }
.story small a { text-decoration: underline; }
.score { border-top: 3px double var(--rule); padding-top: 14px; margin-bottom: 44px; }
.score h2 { font-size: clamp(34px, 5vw, 56px); letter-spacing: -.02em; }
.score > p { margin: 3px 0 14px; color: var(--muted); }
.score ol { list-style: none; margin: 0; padding: 0; }
.score li a { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 20px; align-items: baseline; padding: 10px 0; border-top: 1px solid var(--line); font: 700 19px/1.25 var(--head); }
.score li a:hover span { text-decoration: underline; }
.score li b { font: 700 13px/1.3 var(--ui); padding-left: 16px; position: relative; }
.score li b::before { content: ''; position: absolute; left: 0; top: 3px; width: 9px; height: 9px; background: #8a8a8a; }
.score .win b { color: #17663a; } .score .win b::before { background: #17663a; }
.score .lose b { color: var(--accent); } .score .lose b::before { background: var(--accent); }
.all { display: inline-block; margin-top: 12px; font: 700 14px var(--ui); text-decoration: underline; }
.road { background: var(--tint); margin: 0 calc(50% - 50vw) 44px; padding: 28px max(16px, calc(50vw - 574px)) 30px; }
.road h2 { font-size: clamp(25px, 3vw, 34px); margin-bottom: 22px; }
.road ol { list-style: none; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; border-top: 3px solid var(--rule); }
.road li a { display: block; padding: 0 12px 0 0; font: 700 15px/1.25 var(--head); }
.road li a:hover { color: var(--accent); }
.road i { display: grid; place-items: center; width: 28px; height: 28px; margin: -15px 0 10px; background: var(--ink); color: #fff; font: 700 13px var(--ui); }
.road li a:hover i { background: var(--accent); }
.nums { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 34px; margin-bottom: 44px; }
.nums b { display: block; font: 700 clamp(50px, 7vw, 92px)/.95 var(--head); letter-spacing: -.03em; color: var(--accent); margin-bottom: 8px; }
.nums a:first-child b { font-size: clamp(66px, 11vw, 140px); }
.nums span { font-size: 17px; line-height: 1.38; display: block; }
.nums a:hover span { text-decoration: underline; }
.toolrow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px; margin-bottom: 40px; }
.toolrow > div { border-top: 3px solid var(--rule); padding-top: 9px; }
.toolrow h2 { font-size: 27px; margin-bottom: 5px; }
.toolrow p { margin: 0 0 8px; font-size: 17px; }
.toolrow > div > a { font: 700 14px var(--ui); text-decoration: underline; }
.idx { border-top: 1px solid var(--rule); padding-top: 12px; }
.idx > h2 { font: 700 14px var(--ui); margin-bottom: 10px; }
.idx > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.idx h3 { font-size: 18px; margin-bottom: 4px; }
.idx p { margin: 0; font: 13.5px/1.55 var(--ui); color: var(--muted); }
.idx a:hover { color: var(--ink); text-decoration: underline; }

/* Secciones por etapas */
.stage { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 36px; padding: 18px 0 34px; border-top: 3px solid var(--rule); }
.stage header { position: sticky; top: 14px; align-self: start; }
.stage header i { display: block; font: 700 70px/.9 var(--head); color: var(--accent); }
.stage header h2 { font-size: 28px; margin: 6px 0; }
.stage header p { margin: 0; font-size: 16px; line-height: 1.4; color: var(--muted); }
.stage-top a { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 22px; align-items: center; padding-bottom: 16px; }
.stage-top h3 { font-size: clamp(25px, 2.8vw, 33px); margin-bottom: 7px; }
.stage-top p, .stage-r p { margin: 0; font-size: 16.5px; line-height: 1.42; color: #333; }
.stage-r a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 22px; padding: 12px 0; border-top: 1px solid var(--line); }
.stage-r h3 { font-size: 20px; }
.stage a:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* Final del artículo */
.next { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0 34px; margin-top: 34px; padding-top: 12px; border-top: 3px double var(--rule); }
.next-m { grid-row: span 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 20px; align-items: center; }
.next-m h2 { font-size: clamp(24px, 2.8vw, 32px); margin-bottom: 6px; }
.next-m p { margin: 0; font-size: 16px; line-height: 1.4; color: #333; }
.next-p { display: block; padding: 10px 0; border-bottom: 1px solid var(--line); font: 700 17px/1.25 var(--head); }
.next a:hover h2, .next-p:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .ask-g, .story, .next { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .story figure { margin: 0 -16px; }
  .next-m { grid-row: auto; }
  .road ol { grid-template-columns: minmax(0, 1fr); border-top: 0; border-left: 3px solid var(--rule); margin-left: 12px; }
  .road li a { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: center; padding: 7px 0; margin-left: -15.5px; }
  .road i { margin: 0; }
  .nums { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .idx > div, .toolrow { grid-template-columns: minmax(0, 1fr); }
  .stage { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .stage header { position: static; }
  .stage header i { font-size: 46px; }
}
@media (max-width: 640px) {
  .steps li { grid-template-columns: minmax(0, 1fr); gap: 1px; }
  .score li a { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .stage-top a, .stage-r a, .next-m { grid-template-columns: minmax(0, 1fr); gap: 7px; }
}
.split { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; }
.row a { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 18px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.row h3 { font-size: 22px; margin-bottom: 5px; }
.row p { margin: 0; font-size: 16px; line-height: 1.42; color: #333; }
.lines { list-style: none; margin: 8px 0 0; padding: 0; font: 700 17px/1.25 var(--head); }
.lines li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.rail > * + * { margin-top: 26px; }
.tools ul { list-style: none; margin: 0; padding: 0; font: 700 16px/1.25 var(--head); }
.tools li { padding: 9px 0; border-bottom: 1px solid var(--line); }
.tools span { display: block; font: 13px/1.35 var(--ui); color: var(--muted); margin-top: 2px; }
.tools a:hover { text-decoration: underline; }

/* Artículo */
.crumbs { font: 13px/1.3 var(--ui); color: var(--muted); margin-bottom: 10px; }
.art h1 { font-size: clamp(32px, 4.8vw, 50px); letter-spacing: -.012em; max-width: 920px; margin-bottom: 10px; }
.deck { font-size: 21px; line-height: 1.38; color: #333; margin: 0 0 12px; max-width: 800px; }
.meta { font: 13px/1.4 var(--ui); color: var(--muted); margin: 0 0 18px; padding: 8px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--line); }
.art-grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 44px; align-items: start; }
.art-main { max-width: 760px; }
.art-rail { position: sticky; top: 14px; }
.fig { margin: 0 0 18px; }
.fig figcaption { font: 12.5px/1.4 var(--ui); color: var(--muted); padding-top: 6px; }
.fig a { text-decoration: underline; }
.key { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 10px 0 12px; margin-bottom: 22px; }
.key h2 { font: 700 13px/1.3 var(--ui); margin-bottom: 5px; }
.key ul { margin: 0; padding-left: 18px; font-size: 16.5px; line-height: 1.42; }
.key li + li { margin-top: 3px; }
.inline-cifra { float: right; width: 215px; margin: 4px 0 12px 22px; padding-top: 8px; border-top: 3px solid var(--accent); }
.body { font: 19px/1.62 var(--text); }
.body h2 { font-size: 26px; margin: 30px 0 9px; scroll-margin-top: 12px; }
.body a, .sources a, .text a, .note a, .caso a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.body ul, .body ol { padding-left: 24px; margin: 14px 0; }
.body li { margin-bottom: 7px; }
.body blockquote { margin: 16px 0; padding: 12px 16px; background: var(--tint); font: 15.5px/1.55 var(--ui); }
.body blockquote p { margin: 0 0 8px; }
.body blockquote p:last-child { margin: 0; }
.table { overflow-x: auto; margin: 16px 0; }
table { width: 100%; border-collapse: collapse; font: 14.5px/1.4 var(--ui); font-variant-numeric: tabular-nums; }
th { text-align: left; font-weight: 700; border-bottom: 2px solid var(--rule); }
th, td { padding: 8px 9px 8px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
td a { text-decoration: underline; }
.sources { font: 14px/1.5 var(--ui); border-top: 3px solid var(--rule); padding-top: 9px; margin-top: 30px; clear: both; }
.sources h2 { font: 700 14px/1.3 var(--ui); margin-bottom: 5px; }
.sources ul { margin: 0; padding-left: 18px; }
.note { font: 13px/1.5 var(--ui); color: var(--muted); margin-top: 14px; }
.more { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 28px; }
.more .h { grid-column: 1 / -1; margin-bottom: 0; }
.toc h2 { font: 700 13px/1.3 var(--ui); padding-bottom: 6px; border-bottom: 1px solid var(--rule); }
.toc ul { list-style: none; margin: 0; padding: 0; font: 14px/1.35 var(--ui); }
.toc li { padding: 7px 0; border-bottom: 1px solid var(--line); }
.autor { font: 13px/1.45 var(--ui); color: var(--muted); }

/* Casos */
.caso { background: var(--tint); padding: 15px 18px 16px; margin: 26px 0; font: 15.5px/1.5 var(--ui); clear: both; }
.caso .tag { margin-bottom: 4px; }
.caso h3 { font-size: 21px; margin-bottom: 8px; }
.caso p { margin: 0 0 8px; }
.caso p:last-child { margin: 0; }
.caso small { color: var(--muted); font-size: 12.5px; }
.casos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.caso-t { padding: 16px 0 20px; border-top: 1px solid var(--rule); font: 15.5px/1.5 var(--ui); }
.caso-t h2 { font-size: 24px; margin: 4px 0 8px; }
.caso-t p { margin: 0 0 8px; }
.caso-t dl { margin: 0; }
.caso-t dt { font-weight: 700; margin-top: 9px; }
.caso-t dd { margin: 0; }
.caso-t small { display: block; color: var(--muted); font-size: 13px; }
.caso-t a { color: var(--accent); text-decoration: underline; }
.res { display: inline-block; font-weight: 700; font-size: 13px; color: var(--accent); }
.aviso { background: var(--mark); padding: 12px 16px; font: 15px/1.5 var(--ui); margin: 0 0 24px; max-width: 800px; }

/* Datos */
.data-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 40px; }
.chart { margin: 0; }
.chart figcaption { font: 12.5px/1.45 var(--ui); color: var(--muted); margin-top: 6px; }
.chart svg { display: block; width: 100%; height: auto; }
.chart h2, .chart h3 { font-size: 22px; margin-bottom: 8px; }
.ln { fill: none; stroke: var(--accent); stroke-width: 2.5; }
.gl { stroke: var(--line); stroke-width: 1; }
.ax { font: 12px var(--ui); fill: var(--muted); }
.vl { font: 700 13px var(--ui); fill: var(--ink); }
.bar { fill: var(--accent); }
.big3 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 3px solid var(--rule); border-bottom: 1px solid var(--rule); margin-bottom: 28px; }
.big3 > div { padding: 12px 16px; border-left: 1px solid var(--line); font: 13.5px/1.35 var(--ui); }
.big3 > div:first-child { padding-left: 0; border-left: 0; }
.big3 b { display: block; font: 700 32px/1.05 var(--head); margin-bottom: 4px; color: var(--ink); }
.prose { max-width: 760px; }
.prose h2 { font-size: 26px; margin: 28px 0 8px; }
.prose a { color: var(--accent); text-decoration: underline; }

/* Calculadoras */
.calc-page { max-width: 980px; margin: 0 auto; }
.calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 0; border-top: 3px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 18px 0 26px; }
.calc form { padding: 16px 28px 16px 0; border-right: 1px solid var(--line); }
.calc label { display: grid; grid-template-columns: minmax(0, 1fr) 124px; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font: 14.5px/1.3 var(--ui); }
.calc label small { display: block; color: var(--muted); font-size: 12px; }
.calc input { width: 100%; padding: 6px 7px; font: 700 17px var(--ui); text-align: right; font-variant-numeric: tabular-nums; color: var(--ink); background: #fff; border: 1px solid #8a8a8a; border-radius: 0; }
.calc input:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: var(--accent); }
.preset { display: block; margin: 12px 0 0; padding: 0; background: none; border: 0; font: 13.5px var(--ui); color: var(--accent); text-decoration: underline; cursor: pointer; text-align: left; }
.out { padding: 16px 0 16px 28px; font: 14px/1.4 var(--ui); }
.out .main { display: block; font: 700 clamp(42px, 6vw, 60px)/1 var(--head); letter-spacing: -.02em; font-variant-numeric: lining-nums tabular-nums; margin: 2px 0 12px; }
.out dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.out dt, .out dd { margin: 0; padding: 7px 0; border-top: 1px solid var(--line); }
.out dd { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; padding-left: 12px; }
.out .pos { color: #17663a; } .out .neg { color: var(--accent); }
.vs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.vs > div { padding-right: 16px; } .vs > div + div { padding: 0 0 0 16px; border-left: 1px solid var(--line); }
.vs h3 { font: 700 15px var(--ui); margin-bottom: 8px; }
.vs b { display: block; font: 700 27px/1.1 var(--head); font-variant-numeric: lining-nums; }
.vs small { display: block; margin-bottom: 10px; color: var(--muted); }
.b-int { fill: var(--accent); } .b-cap { fill: #c9c5bd; }
.leg { font: 13px var(--ui); color: var(--muted); margin: 6px 0 22px; }
.leg i { display: inline-block; width: 11px; height: 11px; margin-right: 5px; vertical-align: -1px; }
details { font: 14.5px/1.5 var(--ui); margin-bottom: 22px; } summary { cursor: pointer; font-weight: 700; padding: 8px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.text { max-width: 760px; margin: 0 auto; }
.text h1 { font-size: clamp(32px, 5vw, 46px); margin-bottom: 14px; }
.text h2 { font-size: 24px; margin: 24px 0 7px; }
.text ul { padding-left: 22px; }
mark { background: var(--mark); color: inherit; }

/* Modelos */
.modelo { border-top: 3px solid var(--rule); padding: 10px 0 26px; }
.modelo h2 { font-size: 26px; margin-bottom: 4px; }
.modelo p { margin: 0 0 10px; font: 15px/1.5 var(--ui); color: #333; }
.modelo p a { color: var(--accent); text-decoration: underline; }
.modelo pre { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0 0 10px; padding: 14px 16px; background: var(--tint); font: 15px/1.5 var(--text); }
.btn { padding: 7px 12px; background: var(--ink); color: #fff; border: 0; border-radius: 0; font: 700 13.5px var(--ui); cursor: pointer; }
.btn:hover { background: var(--accent); }

.foot { border-top: 3px double var(--rule); padding: 18px 0 26px; font: 13px/1.6 var(--ui); color: var(--muted); }
.foot .logo { color: var(--ink); font-size: 24px; margin-bottom: 8px; }
.foot nav { display: flex; flex-wrap: wrap; gap: 2px 16px; margin-bottom: 6px; }
.foot nav a { text-decoration: underline; }
.foot p { margin: 0; }

@media (max-width: 960px) {
  .split, .art-grid { grid-template-columns: minmax(0, 1fr); }
  .art-rail { position: static; }
  .toc { display: none; }
  .art-main { max-width: none; }
}
@media (max-width: 680px) {
  body { font-size: 17px; }
  .nav ul { justify-content: flex-start; gap: 0 14px; }
  .nav a { padding: 9px 0; }
  .ticker { justify-content: flex-start; }
  .mast { text-align: left; }
  .casos, .data-g, .more, .calc, .big3 { grid-template-columns: minmax(0, 1fr); }
  .big3 > div { padding: 10px 0; border-left: 0; border-top: 1px solid var(--line); }
  .big3 > div:first-child { border-top: 0; }
  .calc form { padding: 12px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .out { padding: 14px 0; }
  .row a { grid-template-columns: minmax(0, 1fr) 100px; gap: 12px; }
  .row img { aspect-ratio: 1; }
  .row h3 { font-size: 18px; }
  .row p { display: none; }
  .body { font-size: 18px; }
  .inline-cifra { float: none; width: auto; margin: 0 0 16px; }
  .vs { grid-template-columns: minmax(0, 1fr); }
  .vs > div + div { padding: 12px 0 0; border-left: 0; border-top: 1px solid var(--line); }
}
@media print {
  .mast p, .nav, .ticker, .art-rail, .foot, .more, .btn { display: none; }
}

/* Selección de texto */
::selection { background: var(--accent); color: #fff; }
.band ::selection { background: #ffe27a; color: var(--ink); }

/* Aviso de cookies */
.ck { position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; gap: 24px; padding: 14px max(16px, calc(50vw - 574px)); background: #fff; border-top: 3px solid var(--rule); box-shadow: 0 -4px 18px rgba(0, 0, 0, .12); }
.ck[hidden] { display: none; }
.ck p { margin: 0; font: 14px/1.45 var(--ui); max-width: 780px; }
.ck a { text-decoration: underline; }
.ck div { display: flex; gap: 8px; flex: none; }
.ck button { min-width: 104px; padding: 11px 16px; font: 700 14px var(--ui); color: #fff; background: var(--ink); border: 2px solid var(--ink); border-radius: 0; cursor: pointer; }
.ck button:hover { background: var(--accent); border-color: var(--accent); }
.ck-open { padding: 0; font: inherit; color: inherit; background: none; border: 0; text-decoration: underline; cursor: pointer; }
@media (max-width: 680px) {
  .ck { flex-direction: column; align-items: stretch; gap: 10px; }
  .ck div button { flex: 1; }
}