/* Reader-only improvements. Keep the newspaper, media players and feed transport intact. */
.reader[hidden] { display: none !important; }
.reader {
  position: fixed; inset: 16px auto 16px 50%; width: min(860px, calc(100vw - 40px));
  height: auto; max-width: none; box-sizing: border-box; z-index: 110;
  overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line) transparent;
}
body.reading .reader { transform: translateX(-50%); z-index: 110; }
body.reading .scrim { z-index: 105; background: rgba(12,16,13,.58); }
body.reading { overflow: hidden; }
.reader-bar {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 18px 0; overflow: visible;
  background: var(--panel); border-bottom: 1px solid var(--line);
}
.reader-bar > button { min-height: 38px; flex: 0 0 auto; }
.reader-bar .rb-close { margin-right: auto; }
.reader-actions {
  display: flex; gap: 6px; flex: 1 1 100%; min-width: 0; overflow-x: auto;
  padding: 5px 0 10px; scrollbar-width: thin;
}
.reader-actions > * { flex: 0 0 auto; min-height: 34px; box-sizing: border-box; }
.reader-bar .rb-tx { display: inline; }
.reader-bar button:disabled { opacity: .4; cursor: default; }
.reader :focus-visible { outline: 2px solid var(--accent2); outline-offset: 3px; }
.reader-progress-track { position: absolute; bottom: -1px; left: 0; right: 0; height: 3px; pointer-events: none; }
.reader .read-progress { position: static; height: 3px; border-radius: 0; }
.reader .article { box-sizing: border-box; max-width: 744px; padding: 30px 32px 64px; }
.reader .article-src { flex-wrap: wrap; line-height: 1.5; margin-bottom: 12px; }
.reader .article-title { font-size: calc(clamp(28px, 3.1vw, 38px) * (1 + (var(--fs,1) - 1) * .6)); line-height: 1.16; letter-spacing: -.5px; }
.reader-reading-time { color: var(--muted); font: 12px/1.5 var(--sans); margin: 0 0 22px; }
.reader .hero { display: block; width: auto; max-width: 100%; max-height: 240px; height: auto; object-fit: contain; margin: 0 auto 24px; }
.reader .prose { font-size: calc(20px * var(--fs,1)); line-height: 1.72; max-width: 65ch; overflow-wrap: anywhere; }
.reader .prose p { margin-bottom: 1.1em; }
.reader .prose h2 { font-size: 1.3em; }
.reader .prose h3 { font-size: 1.12em; }
.reader .prose pre { overflow-x: auto; white-space: pre-wrap; }
.reader .prose table { display: block; max-width: 100%; overflow-x: auto; }
.reader .prose img { width: auto; max-width: 100%; height: auto; }
.reader-attribution { border-top: 1px solid var(--line); margin: 32px 0 12px; padding-top: 16px; color: var(--muted); font: 12px/1.6 var(--sans); }
.reader.reader-focus .hero, .reader.reader-focus .prose img, .reader.reader-focus .prose figcaption { display: none; }
.reader.reader-focus .article { max-width: 720px; }
@media(max-width:900px) {
  .reader, body.reading .reader {
    position: fixed; inset: 0; width: 100%; max-width: 100%; height: 100dvh;
    border: 0; border-radius: 0; transform: none; z-index: 110;
  }
  .reader-bar { padding: max(8px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 0 max(10px, env(safe-area-inset-left)); gap: 5px; }
  .reader-bar > button { min-height: 42px; padding: 7px 10px; }
  .reader-actions > * { min-height: 40px; }
  .reader .article { padding: 24px max(20px, env(safe-area-inset-right)) max(48px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); }
  .reader .prose { font-size: calc(19px * var(--fs,1)); }
  .reader .hero { max-height: 200px; }
}
@media(max-width:360px) {
  .reader-bar .rb-close-tx { display: none; }
  .reader-bar > button { padding-inline: 9px; }
}
@media(prefers-reduced-motion:reduce) { .reader .read-progress { transition: none; } }

/* A background consent bar must not cover or trap the active article dialog.
   It returns unchanged on close; this does not grant or alter consent. */
body.reading .fw-stats-notice { visibility: hidden; }
