@import url('https://fonts.googleapis.com/css2?family=Literata:ital,opsz,wght@0,7..72,400..800;1,7..72,400..600&display=swap');

/* GOODay — e-ink theme: the matte grey screen of an e-reader.
   No colour, no motion, no glow; contrast comes from weight, rules and inverse labels. */

:root {
  --paper: #ECECE8;
  --wash:  #E1E1DC;
  --rule:  #B4B4AE;
  --mute:  #5C5C59;
  --grey:  #2B2B29;
  --ink:   #0B0B0B;
  --red:   #0B0B0B;
  --display: "Literata", Georgia, "Times New Roman", serif;
  --text: "Literata", Georgia, "Times New Roman", serif;
}

html { filter: grayscale(1); }
html, body { background: var(--paper); }
body {
  border-top: 0;
  font-size: 18px;
  line-height: 1.62;
}
*, *::before, *::after { transition: none !important; animation: none !important; }

/* Links: e-readers underline, they do not change colour */
a:hover { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--ink); }

/* Masthead keeps its newspaper face; everything else is set in Literata */
.mast__name { font-family: "Playfair Display", var(--display); }
.mast__tag { font-style: italic; color: var(--grey); }
.topbar { color: var(--grey); }

/* Navigation: active section shown inverse, like a selected item on an e-reader */
.nav__list a { border-bottom: 0; margin-bottom: 0; }
.nav__list a[aria-current="page"] { background: var(--ink); color: var(--paper); }
.nav__list a:hover { text-decoration: underline; }

/* Ticker becomes a still line: no scrolling on e-paper */
.ticker__label { background: var(--ink); color: var(--paper); }
.ticker__track { mask-image: none; -webkit-mask-image: none; }
.ticker__list { flex-wrap: nowrap; }

/* Labels and kickers: small caps in ink */
.kicker, .side__h, .meta .sec, .op__by { color: var(--ink); }
.kicker { font-weight: 700; letter-spacing: .14em; }
.side__h { border-bottom-width: 3px; }

/* Headlines: Literata, firm weight, no high-contrast hairlines that blur on e-paper */
.lead__h, .story__h, .art__h, .block__h, .sect__h, .hl li, .op__t, .art__pn a, .days__d, .empty__h {
  font-family: var(--display);
  letter-spacing: -.01em;
}
.lead__h { font-weight: 800; }
.story__h, .hl li { font-weight: 700; }
.lead__x, .art__deck { font-weight: 600; color: var(--ink); }
.lead__cols, .story__x, .prose p { color: var(--grey); }
.lead__cols p:first-child::first-letter, .prose p.first::first-letter { font-family: var(--display); font-weight: 800; }

/* Rules a touch heavier so they survive a low-contrast screen */
.block { border-top-width: 4px; }
.cols--4 > *, .ach__col, .trio__col, .region, .foot__col, .front__side, .world__list { border-color: var(--rule); }

/* Buttons and controls: outlined, inverse when pressed */
.search__inline button, .sub button, .btn { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.search__inline button:hover, .sub button:hover, .btn:hover { background: var(--paper); color: var(--ink); border-color: var(--ink); }
.topbar__saved, .tool { border-color: var(--ink); background: transparent; }
.tool[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.sub input, .search__inline input, .search__input { background: var(--paper); }
.search { background: var(--paper); }
.foot__ok { border-left-color: var(--ink); }
.prose a { border-bottom-color: var(--ink); }

/* Footer reads like the last page of a book */
.foot { border-top-width: 4px; }
.foot__mast { font-family: "Playfair Display", var(--display); }

/* Week strip: today shown inverse */
.days__list li:first-child a { background: var(--ink); color: var(--paper); padding-left: 14px; }
.days__list li:first-child .days__n { color: var(--wash); }

@media (max-width: 760px) {
  body { font-size: 18px; }
  .nav__list.is-open { background: var(--paper); }
}

/* Edition line under the masthead */
.mast__ed { font: 600 12px/1 var(--ui); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); padding: 0 0 14px; margin-top: -6px; }
