:root{--paper:#f7f8f5;--ink:#1b1f1a;--mute:#5a635c;--rule:#d9ded6;--green:#0b6e4f;--green-d:#084f39;--sun:#ffc857;--sun-d:#e5ab2e;--w:72rem;--measure:68ch}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.55 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-feature-settings:"kern","liga"}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:.15em}
a:hover{color:var(--green-d)}
a:focus-visible,label:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
h1,h2,h3{line-height:1.15;letter-spacing:-.015em;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,1.3rem + 2.4vw,3rem);font-weight:800;max-width:24ch}
h2{font-size:clamp(1.35rem,1.1rem + 1vw,1.8rem);font-weight:750;margin-top:2.2em}
h3{font-size:1.125rem;font-weight:700;margin-top:1.6em}
p,ul,ol,table{margin:0 0 1.1em;max-width:var(--measure)}
.wrap{width:min(100% - 2.5rem,var(--w));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem}
.skip:focus{left:1rem;z-index:10}

/* header */
.site-header{border-bottom:1px solid var(--rule);background:var(--paper)}
.bar{display:flex;align-items:center;gap:1.5rem;min-height:3.75rem;flex-wrap:wrap}
.logo{font-weight:800;font-size:1.35rem;letter-spacing:-.03em;color:var(--ink);text-decoration:none}
.logo span{color:var(--green)}
.nav{margin-left:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.1rem .9rem;max-width:none}
.nav a{color:var(--ink);text-decoration:none;font-size:.9rem;padding:.35rem 0;display:inline-block;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-color:var(--green)}
.nav-toggle{position:absolute;opacity:0;width:0;height:0}
.nav-btn{display:none;margin-left:auto;width:2.5rem;height:2.5rem;position:relative;cursor:pointer}
.nav-btn span,.nav-btn span::before,.nav-btn span::after{content:"";position:absolute;left:.5rem;width:1.5rem;height:2px;background:var(--ink);top:50%}
.nav-btn span::before{top:-7px;left:0}.nav-btn span::after{top:7px;left:0}
@media(max-width:52rem){
.nav-btn{display:block}
.nav{display:none;width:100%;margin:0;padding:.5rem 0 1rem;border-top:1px solid var(--rule)}
.nav ul{flex-direction:column;gap:0}
.nav a{display:block;padding:.6rem 0;border-bottom:1px solid var(--rule);font-size:1rem}
.nav-toggle:checked~.nav{display:block}
.nav-toggle:focus-visible~.nav-btn{outline:3px solid var(--sun)}
}

/* content */
main{padding:2rem 0 4rem}
.hero{padding:2.5rem 0 1rem}
.lead{font-size:1.15rem;color:var(--mute);max-width:var(--measure)}
.crumbs{font-size:.9rem;color:var(--mute);margin-bottom:1.25rem}
.crumbs a{color:var(--mute)}
.meta{font-size:.9rem;color:var(--mute)}
.ctas{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.25rem 0 .5rem}
.cta{display:inline-block;background:var(--sun);color:var(--ink);font-weight:700;text-decoration:none;padding:.65rem 1.1rem;border-radius:.4rem;border:1px solid var(--sun-d);line-height:1.3}
.cta:hover{background:var(--sun-d);color:var(--ink)}
article .cta{margin:.25rem 0 1.5rem}

/* directory list: the signature element */
.dir{list-style:none;margin:0 0 1rem;padding:0;max-width:none;border-top:1px solid var(--rule)}
.dir li{border-bottom:1px solid var(--rule)}
.dir a{display:grid;grid-template-columns:minmax(12rem,1fr) 2fr auto;gap:.25rem 1.5rem;align-items:baseline;padding:.85rem 0;color:var(--ink);text-decoration:none}
.dir a:hover strong{color:var(--green);text-decoration:underline}
.dir strong{font-size:1.15rem;font-weight:700;letter-spacing:-.01em}
.directory .dir strong{font-size:1.5rem;font-weight:800}
.dir-short{color:var(--mute);font-size:.95rem}
.dir-n{color:var(--mute);font-size:.9rem;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:44rem){.dir a{grid-template-columns:1fr auto}.dir-short{grid-column:1/-1}}

.cols{list-style:none;padding:0;margin:0 0 1rem;max-width:none;columns:2;column-gap:2.5rem}
.cols li{padding:.3rem 0;break-inside:avoid;border-bottom:1px solid var(--rule)}
.cols a{text-decoration:none;color:var(--ink)}
.cols a:hover{color:var(--green);text-decoration:underline}
@media(min-width:60rem){.cols{columns:3}}
@media(max-width:36rem){.cols{columns:1}}
.cols-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:.5rem 2.5rem;max-width:none}
.cols-2 h3{margin-top:.8em}

.summary{border-left:4px solid var(--green);background:#fff;padding:1rem 1.25rem .5rem;margin:1.5rem 0;max-width:var(--measure)}
.summary h2{margin-top:0;font-size:1.15rem}
.toc ol{padding-left:1.2em;columns:2;column-gap:2rem;font-size:.95rem}
@media(max-width:36rem){.toc ol{columns:1}}
table{border-collapse:collapse;width:100%;font-size:.95rem;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-weight:700;background:#fff}
.faq h3{margin-top:1.3em}
.prose{max-width:var(--measure)}
section{content-visibility:auto;contain-intrinsic-size:auto 40rem}

/* footer */
.site-footer{border-top:1px solid var(--rule);padding:2rem 0 3rem;font-size:.9rem;color:var(--mute)}
.disclosure{max-width:80ch}
.foot-links{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:1.2rem}
.foot-links a{color:var(--mute)}
.copy{margin:0}
