/* Tokens: identical to the story pages and to the news-and-stories widget,
   which hardcodes these same values. Nothing invented. */
:root{
  --se-bg:#262C31; --se-inner:#2E343A; --se-frame:#31373E; --se-deep:#1A1E22;
  --se-primary:#C5E86C; --se-nexus:#3DA5D9;
  --se-text:#F9F9F9; --se-text-white:#fff;
  --se-text-secondary:rgba(255,255,255,.75); --se-text-dim:rgba(255,255,255,.6);
  --se-text-caption:rgba(255,255,255,.5);
  --font-primary:'Open Sans',sans-serif; --font-secondary:'Roboto',sans-serif;
  --r-md:6px; --r-lg:10px; --r-xl:14px; --r-pill:999px;
  --accent:var(--se-primary); --rule:rgba(126,164,176,.16);
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--se-bg);font-family:var(--font-primary);color:var(--se-text);line-height:1.6}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* ── Header ─────────────────────────────────────────────────
   80 of the 149 notices have no photograph and the median is four
   paragraphs, so imageless is the normal case, not the exception. The
   YEAR carries the page instead — these are archive entries, and their
   date is the thing that locates them.                                  */
.news-head{position:relative;padding:54px 0 0;overflow:hidden}
.ghost-year{position:absolute;right:-12px;top:6px;font-family:var(--font-secondary);font-weight:700;
  font-size:clamp(96px,17vw,190px);line-height:.8;color:var(--se-text-white);opacity:.045;
  letter-spacing:-.04em;pointer-events:none;user-select:none}
.kicker{display:flex;align-items:center;gap:10px;font-family:var(--font-secondary);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 16px;position:relative}
.kicker .dot{width:4px;height:4px;border-radius:50%;background:currentColor}
.kicker .when{color:var(--se-text-caption)}
h1{font-family:var(--font-secondary);font-weight:700;font-size:clamp(27px,3.9vw,40px);line-height:1.16;
  letter-spacing:-.01em;color:var(--se-text-white);margin:0 0 16px;max-width:24ch;position:relative}
.standfirst{font-size:17.5px;line-height:1.6;color:var(--se-text-secondary);margin:0;max-width:60ch;position:relative}
.rule{height:1px;background:var(--rule);margin:32px 0 0}

.art-hero{margin:32px 0 0}
.art-hero img{width:100%;border-radius:var(--r-xl);display:block;border:1px solid var(--rule);background:var(--se-inner)}
.art-hero.small img{width:auto;height:auto;max-width:100%}
.art-hero.small{display:flex;justify-content:flex-start}

.news-body{padding:32px 0 24px;max-width:68ch}
.news-body p{font-size:16.5px;color:var(--se-text-secondary);margin:0 0 20px}
.news-body p:first-of-type{font-size:18px;color:var(--se-text)}
.embedded-audio{margin:0 0 24px}
.embedded-audio iframe{display:block;width:100%;height:400px;border:0;max-width:800px}
.news-body .article-image{margin:0 0 28px}
.news-body .article-image img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:var(--r-xl)}
.news-body .article-image--logo img{width:min(100%,602px);background:var(--se-inner);padding:18px}
.air-guitar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 34px}
.air-guitar-grid a{border:0}
.air-guitar-grid img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:var(--r-lg)}
@media(max-width:560px){.air-guitar-grid{grid-template-columns:1fr}}
.restored-media{margin:0 0 28px}
.restored-media img,.restored-media video{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:var(--r-xl)}
.restored-media--embed{position:relative;aspect-ratio:16/9}
.restored-media--embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:var(--r-xl)}

/* the handful of dialogue and Q&A items reuse the story treatments */
.qa{margin:0 0 30px}
.qa h3{font-family:var(--font-secondary);font-weight:700;font-size:18px;line-height:1.35;
  color:var(--se-text-white);margin:0 0 10px;padding-left:16px;position:relative}
.qa h3::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:3px;border-radius:2px;background:var(--accent)}
.turn{margin:0 0 18px}
.turn .sp{display:block;font-family:var(--font-secondary);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;margin-bottom:4px}
.turn p{margin:0}
.turn.guest .sp{color:var(--accent)}
.turn.guest p{font-size:17px;color:var(--se-text)}
.turn.host{padding-left:15px;border-left:2px solid var(--rule);margin:26px 0 16px}
.turn.host .sp{color:var(--se-text-caption)}
.turn.host p{font-size:15px;color:var(--se-text-dim)}

.pull{margin:32px 0;padding:22px 26px;border-radius:var(--r-xl);
  background:linear-gradient(180deg,var(--se-frame),var(--se-inner));border:1px solid var(--rule);position:relative}
.pull::before{content:"\201C";position:absolute;top:2px;left:12px;font-family:var(--font-secondary);
  font-size:46px;line-height:1;color:var(--accent);opacity:.5}
.pull p{font-family:var(--font-secondary);font-size:19px;line-height:1.45;font-weight:500;
  color:var(--se-text-white);margin:0;padding-left:24px}

/* ── Neighbours in time ─────────────────────────────────────
   An archive entry is only meaningful next to what surrounded it. */
.around{margin:40px 0 80px;padding-top:28px;border-top:1px solid var(--rule)}
.around h2{font-family:var(--font-secondary);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--se-text-caption);margin:0 0 16px;font-weight:600}
.around .pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:620px){.around .pair{grid-template-columns:1fr}}
.around a{display:block;text-decoration:none;border:1px solid var(--rule);border-radius:var(--r-lg);
  padding:14px 16px;background:linear-gradient(180deg,var(--se-frame),var(--se-inner));transition:.2s;min-width:0}
.around a:hover{border-color:rgba(197,232,108,.4)}
.around .dir{display:block;font-family:var(--font-secondary);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);margin-bottom:5px}
.around .t{color:var(--se-text-white);font-size:14.5px;line-height:1.35}
.around .d{display:block;margin-top:5px;font-family:var(--font-secondary);font-size:11px;color:var(--se-text-caption)}
@media(max-width:600px){.news-head{padding-top:32px}.pull p{font-size:17px}}

/* A bare URL is an attribution, not a paragraph. */
.source-note{margin:30px 0 0;padding-top:16px;border-top:1px solid var(--rule);
  font-family:var(--font-secondary);font-size:13px;color:var(--se-text-caption)}
.source-note a{color:var(--accent);text-decoration:none}
.source-note a:hover{text-decoration:underline}

/* raw URLs in the source prose become real links */
.news-body a, .story-body a{color:var(--accent);text-decoration:none;
  border-bottom:1px solid rgba(197,232,108,.32)}
.news-body a:hover, .story-body a:hover{border-bottom-color:var(--accent)}

.standfirst a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(197,232,108,.32)}
.standfirst a:hover{border-bottom-color:var(--accent)}

/* ── Index cards ── (shared: the deployed pages link this file) */
.yr{font-family:var(--font-secondary);font-size:13px;letter-spacing:.14em;color:var(--accent);
margin:46px 0 16px;padding-top:20px;border-top:1px solid var(--rule);display:flex;justify-content:space-between}
.yr span{color:var(--se-text-caption);font-size:11px}
.ix{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}
.c{text-decoration:none;border:1px solid var(--rule);border-radius:var(--r-lg);overflow:hidden;min-width:0;
background:linear-gradient(180deg,var(--se-frame),var(--se-inner));display:flex;flex-direction:column;transition:.2s}
.c:hover{border-color:rgba(197,232,108,.4);transform:translateY(-2px)}
.c img,.c .nop{aspect-ratio:16/9;width:100%;object-fit:cover;display:block;background:var(--se-deep)}
.c .nop{display:grid;place-items:center;font-family:var(--font-secondary);font-size:11px;
letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.16);font-weight:700}
.cb{padding:11px 13px 13px}.cb b{display:block;color:var(--se-text-white);font-size:13.5px;line-height:1.35}
.cb span{display:block;margin-top:5px;font-family:var(--font-secondary);font-size:10.5px;color:var(--se-text-caption)}

/* Prose inside a transcript: the episode's own narration, and the
   continuation paragraphs of an answer whose first line carried the name. */
.transcript .aside, .news-body .aside{margin:0 0 18px;padding-left:0;
  font-size:16.5px;color:var(--se-text-secondary)}
.turn + .aside{margin-top:-6px;padding-left:0}

/* Sub-headings and lists recovered from the source articles. */
h3.sub{font-family:var(--font-secondary);font-weight:700;font-size:18px;line-height:1.35;
  color:var(--se-text-white);margin:34px 0 12px}
ul.body-list{margin:0 0 22px;padding-left:22px;list-style:none}
ul.body-list li{position:relative;font-size:16.5px;color:var(--se-text-secondary);margin:0 0 10px}
ul.body-list li::before{content:"";position:absolute;left:-18px;top:.62em;width:6px;height:6px;
  border-radius:50%;background:var(--accent);opacity:.75}

/* An archived article states the prices that were true when it was published.
   Nothing in the copy is rewritten — a dated note carries the caveat instead. */
.archive-prices{margin:34px 0 0;padding:16px 18px;border-radius:var(--r-lg);
  background:rgba(126,164,176,.06);border:1px solid var(--rule)}
.archive-prices p{margin:0;font-size:14px;line-height:1.6;color:var(--se-text-dim)}
.archive-prices b{color:var(--se-text-secondary)}
.archive-prices a{color:var(--accent)}