/* Shared styles for News, Timeline and Learn. Colours and type match the home page. */
:root{--bg:#EDF1E8;--surface:#FAFCF7;--ink:#18211A;--muted:#566457;--rule:#D3DCCF;--moss:#2F6B3A;--moss-soft:#DCEBD9;--gold:#A87A1F;--gold-soft:#F3E8CF;
  --rust:#9A4A2A;--rust-soft:#F4E1D8;
  --display:'Bricolage Grotesque',Georgia,serif;--body:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#101611;--surface:#182019;--ink:#E1E9DE;--muted:#98A799;--rule:#2A352B;--moss:#86C98F;--moss-soft:#1D2D20;--gold:#E0B75C;--gold-soft:#2C2616;--rust:#E39A78;--rust-soft:#2E1E17}}
:root[data-theme="dark"]{--bg:#101611;--surface:#182019;--ink:#E1E9DE;--muted:#98A799;--rule:#2A352B;--moss:#86C98F;--moss-soft:#1D2D20;--gold:#E0B75C;--gold-soft:#2C2616;--rust:#E39A78;--rust-soft:#2E1E17}
*{box-sizing:border-box}
html{scroll-padding-top:calc(64px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.55;
  padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
main{max-width:780px;margin:0 auto;padding:0 16px 48px}
@media (min-width:600px){main{padding:0 22px 56px}}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
img,svg,iframe{max-width:100%}

/* top bar */
.bar{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--rule);padding-top:env(safe-area-inset-top,0px)}
.bar nav{max-width:780px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
.bar nav::-webkit-scrollbar{display:none}
.bar .home{font-family:var(--display);font-weight:800;font-size:19px;text-decoration:none;margin-right:auto;white-space:nowrap;padding-right:10px}
.bar .home span{color:var(--gold)}
.bar a.tab{text-decoration:none;font-weight:700;font-size:15px;padding:8px 11px;border-radius:10px;white-space:nowrap;color:var(--muted)}
.bar a.tab:hover{color:var(--ink)}
.bar a.tab[aria-current="page"]{color:var(--ink);background:var(--moss-soft)}

/* headings */
.kicker{font-size:13px;font-weight:700;color:var(--gold);letter-spacing:.04em;text-transform:uppercase;margin:34px 0 4px}
h1{font-family:var(--display);font-weight:800;font-size:clamp(38px,9vw,58px);line-height:.98;letter-spacing:-.025em;margin:0 0 12px}
h2{font-family:var(--display);font-weight:700;font-size:clamp(26px,6vw,32px);line-height:1.08;letter-spacing:-.01em;margin:40px 0 6px}
h3{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.18;margin:0 0 6px}
.lede{color:var(--muted);font-size:17.5px;margin:0 0 18px;max-width:60ch}
.small{font-size:14px;color:var(--muted)}

/* Nib's speech */
.nib{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:var(--moss-soft);margin:18px 0}
.nib svg{width:46px;flex:none;margin-top:2px}
.nib p{margin:0;font-size:16.5px}
.nib b{font-family:var(--display)}

/* cards and grids */
.grid{list-style:none;margin:0;padding:0;display:grid;gap:14px}
@media (min-width:640px){.grid.two{grid-template-columns:1fr 1fr}}
.card{display:block;height:100%;padding:18px 18px 16px;border:1px solid var(--rule);border-radius:18px;background:var(--surface);text-decoration:none}
a.card:hover{border-color:var(--moss)}
.card .kind{font-size:13px;font-weight:700;color:var(--gold);letter-spacing:.02em}
.card h3{margin:3px 0 6px}
.card p{margin:0;color:var(--muted);font-size:15.5px}
.card .go{display:inline-block;margin-top:10px;font-weight:700;color:var(--moss)}
.card.locked{border-style:dashed;background:transparent}
.card.locked .kind{color:var(--muted)}

/* chips, badges, filters */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;padding:6px 11px;border-radius:999px;border:1px solid var(--rule);background:var(--surface);text-decoration:none;color:var(--ink)}
a.chip:hover{border-color:var(--moss)}
button.chip{font:inherit;font-size:14px;font-weight:700;cursor:pointer}
button.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;padding:3px 8px;border-radius:7px;vertical-align:2px;white-space:nowrap}
.badge.CONFIRMED{background:var(--moss);color:var(--bg)}
.badge.REPORTED{background:var(--gold-soft);color:var(--gold);border:1.5px dashed var(--gold)}
.badge.CORRECTED{background:var(--rust-soft);color:var(--rust)}
.cat{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.search{width:100%;font:inherit;font-size:17px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--rule);background:var(--surface);color:var(--ink);margin:6px 0 4px}
.search:focus{border-color:var(--moss);outline:none}

/* news story */
.story{padding:20px 0 22px;border-top:1px solid var(--rule)}
.story:target{background:linear-gradient(var(--gold-soft),transparent 70%);margin:0 -12px;padding:20px 12px 22px;border-radius:14px}
.story .meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.story h3{font-size:clamp(20px,5vw,23px)}
.story p{margin:6px 0}
.story .why{color:var(--muted)}
.story .why b{color:var(--ink)}
.story .note{font-size:14.5px;color:var(--muted);border-left:3px solid var(--gold);padding-left:10px;margin:10px 0}
.sources{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:14.5px}
.sources a{color:var(--moss);font-weight:700;text-underline-offset:3px}
.sources li::before{content:"↗ ";color:var(--muted)}
.terms{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;align-items:center}
.terms span{font-size:13px;color:var(--muted)}
.terms a{font-size:13.5px;padding:3px 9px;border-radius:999px;background:var(--moss-soft);text-decoration:none;font-weight:700}

/* legend box */
.legend{border:1px solid var(--rule);border-radius:16px;padding:14px 16px;background:var(--surface);font-size:15px;margin:16px 0}
.legend p{margin:4px 0}

/* footer */
footer{margin-top:44px;padding-top:16px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--muted)}
footer p{margin:0 0 6px}
.empty{color:var(--muted);font-style:italic;padding:18px 0}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.nibhead{flex:none;width:46px;display:block}
.nibhead svg{width:46px;display:block}

/* filter bars: one swipeable row of chips on phones, sticky on wider screens */
.filters{background:var(--bg);padding:8px 0 10px;margin:8px 0 0}
.filters .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px;padding-bottom:2px}
.filters .chips::-webkit-scrollbar{display:none}
.filters .chips>*{flex:none}
@media (min-width:700px){
  .filters{position:sticky;top:calc(52px + env(safe-area-inset-top,0px));z-index:2;margin-left:-40px;margin-right:-40px;padding-left:40px;padding-right:40px}
  .filters .chips{flex-wrap:wrap;overflow:visible;margin-right:0;padding-right:0}
  html{scroll-padding-top:calc(190px + env(safe-area-inset-top,0px))}
}