:root{
  --bg:#f5f7f3; --surface:#ffffff; --ink:#1d2a26; --muted:#5b6a64; --line:#d9e1db;
  --accent:#1f6b5c; --accent-soft:#e3efe9; --sun:#9a6a0c; --sun-line:#c98a12; --sun-soft:#fbf1dc;
  --display:"Instrument Serif", Georgia, "Times New Roman", serif;
  --body:"Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111816; --surface:#18221f; --ink:#e4ece8; --muted:#9aaba4; --line:#2a3833;
  --accent:#6cc3ad; --accent-soft:#1d332d; --sun:#e8b54a; --sun-line:#e8b54a; --sun-soft:#2f2715; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111816; --surface:#18221f; --ink:#e4ece8; --muted:#9aaba4; --line:#2a3833;
  --accent:#6cc3ad; --accent-soft:#1d332d; --sun:#e8b54a; --sun-line:#e8b54a; --sun-soft:#2f2715; color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:720px;margin:0 auto;padding-block:28px 64px;display:flex;flex-direction:column;gap:36px}
header{display:flex;flex-direction:column;gap:6px}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
h1{font-family:var(--display);font-weight:400;font-size:clamp(40px,8vw,56px);line-height:1.05;margin:0;text-wrap:balance}
.date{font-family:var(--mono);font-size:14px;color:var(--accent)}
.lede{color:var(--muted);margin:4px 0 0;max-width:62ch}
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);padding-block:10px;border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;gap:6px}
.bar[hidden]{display:none}
.bar audio{width:100%;height:40px}
button{font:600 14px var(--body);border-radius:999px;padding:9px 16px;border:1px solid var(--accent);background:var(--surface);color:var(--accent);cursor:pointer}
button.primary{background:var(--accent);color:var(--bg)}
button:disabled{opacity:.45;cursor:default}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--sun-line);outline-offset:2px}
.status{font-family:var(--mono);font-size:12px;color:var(--muted)}
.notify{display:flex;flex-direction:column;gap:8px;background:var(--accent-soft);border-radius:10px;padding:14px 16px}
.notify p{margin:0}
.notify[hidden]{display:none}
section{display:flex;flex-direction:column;gap:18px}
h2{font-family:var(--display);font-weight:400;font-size:30px;line-height:1.15;margin:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
h2 .eyebrow{font-size:11px}
.alerts{background:var(--sun-soft);border:1px solid var(--sun-line);border-radius:10px;padding:14px 16px}
.alerts h2{font-size:24px}
.alerts article{border-color:color-mix(in srgb,var(--sun-line) 40%,transparent)}
article{display:flex;flex-direction:column;gap:6px;padding-bottom:18px;border-bottom:1px solid var(--line);min-width:0}
section article:last-of-type{border-bottom:0;padding-bottom:0}
h3{font-family:var(--body);font-weight:700;font-size:18px;line-height:1.35;margin:0;text-wrap:balance}
article p{margin:0;max-width:65ch}
.time{font-family:var(--mono);font-size:12.5px;color:var(--sun)}
.meta{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.meta a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;word-break:break-word}
.tag{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.tag.single{background:var(--sun-soft);color:var(--sun)}
.tag.update{background:var(--accent);color:var(--bg)}
.note{color:var(--muted);font-style:italic;margin:0}
details{border-top:1px solid var(--line);padding-top:14px}
summary{cursor:pointer;font-weight:600;color:var(--accent)}
#script p{color:var(--muted);max-width:65ch}
footer{font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.logo{display:block;width:36px;height:36px;flex:none}
.switch{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.switch a{display:block;padding:6px 12px;font:500 12px var(--mono);color:var(--muted);text-decoration:none}
.switch a[aria-current="true"]{background:var(--accent);color:var(--bg)}
.switch a:focus-visible{outline:2px solid var(--sun-line);outline-offset:-2px}
.bar .switch{align-self:flex-start}
