/* Reader tools (worker.js readerToolsHtml, reader-tools.js): the Listen / Save / Text size row under a story's byline, the
   paragraph being read aloud, the story text sizes outside the feature layout (feature.css has its own), and the reading list (/saved). */
.rt{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.rt [hidden]{display:none!important}
.rt-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;min-width:44px;padding:0 15px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:600 14px/1 var(--f-ui);letter-spacing:.1px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.rt-btn svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rt-btn:hover{background:var(--paper);border-color:color-mix(in srgb,var(--ink) 35%,var(--line))}
.rt-btn:focus-visible,.rt-list:focus-visible,.saved-rm:focus-visible,.saved-h a:focus-visible,.saved-empty-link:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.rt-btn[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
html[data-theme="dark"] .rt-btn[aria-pressed="true"]{color:#0c1911}
.rt-save[aria-pressed="true"] svg,.rt-stop svg{fill:currentColor}
.rt-stop{padding:0}
.rt-rate{padding:0 12px;min-width:58px;font-variant-numeric:tabular-nums}
.rt-prog{font:600 13px/1 var(--f-ui);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.rt-list{font:600 14px/1 var(--f-ui);color:var(--accent);text-decoration:none;white-space:nowrap}
.rt-list:hover{text-decoration:underline}
.rt-size{margin-left:auto;padding:0 13px;gap:9px}
.rt-aa{font:700 14px/1 var(--f-ui)}
.rt-aa span{font-size:20px;margin-left:1px}
.rt-pips{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.rt-pips i{display:block;width:3px;height:6px;border-radius:1px;background:currentColor;opacity:.25}
.rt-pips i:nth-child(2){height:9px}
.rt-pips i:nth-child(3){height:12px}
.rt-pips i:first-child,html:not([data-ft-size="s"]) .rt-pips i:nth-child(2),html[data-ft-size="l"] .rt-pips i:nth-child(3){opacity:1}
.rt-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* The feature layout has no SHARE label: the tools open its row of share buttons. */
.ft .article-share .rt{display:inline-flex;margin:0 6px 0 0}
.ft .rt-btn{min-height:44px;font-size:13px}
@media (max-width:560px){.ft .article-share .rt{flex:0 0 100%;margin:0 0 2px}}

/* The paragraph being read aloud: a soft tint around it that moves nothing. */
.rt-reading{--rt-hl:#e4eedf;border-radius:3px;background:var(--rt-hl);box-shadow:0 0 0 8px var(--rt-hl);transition:background-color .25s ease,box-shadow .25s ease}
html[data-theme="dark"] .rt-reading{--rt-hl:rgba(80,149,107,.2)}

/* Text size on the regular story layout: one step down or up from the house sizes (style.css). Set before the page is drawn. */
html[data-ft-size="s"] .content .article-body:not(.ft-body){--fs-body:clamp(13.5px,12.7px + .26vw,15px);--fs-intro:clamp(14.5px,13.5px + .32vw,16.5px)}
html[data-ft-size="l"] .content .article-body:not(.ft-body){--fs-body:clamp(17.5px,16.4px + .34vw,19.5px);--fs-intro:clamp(18.5px,17.2px + .42vw,21px);--fs-sub:clamp(20px,18.7px + .4vw,22.5px)}

/* ---- The reading list (/saved, /es/guardados) ---- */
.saved-page .saved-intro{margin:-10px 0 6px;font-family:var(--f-ui);font-size:15px;color:var(--muted)}
.saved-page .saved-where{margin:0;font:14px/1.5 var(--f-ui);color:var(--muted)}
.saved-where a{color:var(--accent);font-weight:700;text-decoration:none}
.saved-where a:hover{text-decoration:underline}
.saved-list{margin-top:22px;border-top:3px solid var(--ink)}
.saved-list:empty{display:none}
.saved-card{display:grid;grid-template-columns:136px minmax(0,1fr) auto;column-gap:18px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}
.saved-card.no-img{grid-template-columns:minmax(0,1fr) auto}
.saved-img{display:block;border-radius:3px;overflow:hidden;background:var(--paper);aspect-ratio:3/2}
.saved-img img{display:block;width:100%;height:100%;object-fit:cover}
.saved-page .saved-kick{margin:0 0 5px}
.saved-lang{display:inline-block;text-transform:uppercase;margin-left:7px;padding:1px 5px;border:1px solid currentColor;border-radius:3px;font:700 9.5px/1.3 var(--f-ui);letter-spacing:.1em;vertical-align:1px;opacity:.7}
.saved-page .saved-card .saved-h{margin:0 0 7px;font:600 21px/1.25 var(--f-head);letter-spacing:-.2px}
.saved-h a{color:var(--ink);text-decoration:none}
.saved-h a:hover{color:var(--accent)}
.saved-page .saved-meta{margin:0;font:13px/1.45 var(--f-ui);color:var(--muted)}
.saved-rm{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 13px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:600 13px/1 var(--f-ui);cursor:pointer}
.saved-rm svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.saved-rm:hover{background:var(--paper);border-color:color-mix(in srgb,var(--ink) 35%,var(--line))}
.saved-empty{margin-top:22px;padding:46px 16px 40px;border-top:3px solid var(--ink);text-align:center}
.saved-empty svg{width:40px;height:40px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}
.saved-page .saved-empty-h{margin:12px 0 6px;font:600 24px/1.25 var(--f-head);color:var(--ink)}
.saved-page .saved-empty-p{max-width:420px;margin:0 auto 20px;font:15px/1.55 var(--f-ui);color:var(--muted)}
.saved-empty-link{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 20px;border-radius:999px;background:var(--accent);color:#fff;font:600 14px/1 var(--f-ui);text-decoration:none}
html[data-theme="dark"] .saved-empty-link{color:#0c1911}
@media (max-width:560px){
  .saved-card{grid-template-columns:96px minmax(0,1fr);column-gap:14px;row-gap:10px;padding:16px 0}
  .saved-card.no-img{grid-template-columns:minmax(0,1fr)}
  .saved-card .saved-rm{grid-column:-2;justify-self:start}
  .saved-page .saved-card .saved-h{font-size:18px}
}