:root{--paper:#F2F5F1;--card:#FFFFFF;--ink:#13231F;--muted:#4E615B;--line:#C9D4CE;--teal:#0E5A4B;--soft:#DCEAE4;--mark:#E9A820;
--head:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;--body:"Source Serif 4",Georgia,serif}
@media(prefers-color-scheme:dark){:root{--paper:#0F1B18;--card:#15251F;--ink:#E8EFEB;--muted:#9DB0A8;--line:#264038;--teal:#5CC6AC;--soft:#16302A;--mark:#F0B73A}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:1.05rem;line-height:1.65}
a{color:var(--teal);text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--mark);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--head);line-height:1.15;margin:0}
p{margin:0 0 1rem;max-width:64ch}
.wrap{max-width:66rem;margin:0 auto;padding:0 1.25rem}
header.top{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
header.top .wrap{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding-top:.75rem;padding-bottom:.75rem}
.brand{font-family:var(--head);font-weight:800;font-size:1.15rem;color:var(--ink);text-decoration:none;margin-right:auto}
nav{display:flex;gap:.4rem;flex-wrap:wrap}
nav a{font-family:var(--head);font-weight:600;font-size:.95rem;color:var(--ink);text-decoration:none;padding:.5rem 1rem;border-radius:6px;border:1px solid var(--line)}
nav a:hover{background:var(--soft)}
nav a[aria-current=page]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
main{padding:2.5rem 0 3rem}
.eyebrow{font-family:var(--head);font-size:.95rem;color:var(--muted);margin-bottom:.6rem}
.page-title{font-size:clamp(2rem,5vw,3.2rem);letter-spacing:-.02em;font-weight:800;margin-bottom:.6rem}
.lede{font-size:1.2rem;max-width:52ch;color:var(--muted)}
.grid{display:grid;gap:1rem}
.stats{grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));margin:2rem 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1.25rem}
.stat b{display:block;font-family:var(--head);font-size:2.4rem;font-weight:800;line-height:1;color:var(--teal)}
.stat span{font-family:var(--head);font-size:.92rem;color:var(--muted)}
.cols{grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))}
.card h3{font-size:1.2rem;margin-bottom:.4rem}
.card p{color:var(--muted);font-size:.98rem;margin-bottom:.6rem}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 0;padding:0;list-style:none}
.tags li{font-family:var(--head);font-size:.8rem;padding:.1rem .6rem;border-radius:4px;background:var(--soft)}
.badge{font-family:var(--head);font-size:.75rem;font-weight:700;padding:.1rem .55rem;border-radius:4px;background:var(--mark);color:#13231F;margin-left:.4rem;vertical-align:middle}
.btn{display:inline-block;font-family:var(--head);font-weight:700;padding:.7rem 1.2rem;border-radius:6px;background:var(--ink);color:var(--paper);text-decoration:none;border:2px solid var(--ink)}
.btn:hover{background:var(--teal);border-color:var(--teal);color:#fff}
.btn.alt{background:transparent;color:var(--ink)}.btn.alt:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.row{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.25rem}
h2.sec{font-size:1.5rem;margin:2.5rem 0 1rem}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0}
.filters button{font-family:var(--head);font-weight:600;font-size:.92rem;padding:.45rem 1rem;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}
.filters button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.meta{font-family:var(--head);font-size:.85rem;color:var(--muted);margin-bottom:.5rem}
table{width:100%;border-collapse:collapse;font-size:.98rem}
th,td{text-align:left;padding:.7rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--head);font-size:.9rem;color:var(--muted);font-weight:600}
ul.plain{margin:0;padding-left:1.1rem}
footer{border-top:1px solid var(--line);padding:1.5rem 0 2.5rem;font-family:var(--head);font-size:.9rem;color:var(--muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
footer .links{margin-left:auto;display:flex;gap:1rem}
@media(prefers-reduced-motion:no-preference){.card{transition:border-color .15s}.card:hover{border-color:var(--teal)}}
