:root { color-scheme: light dark; --bg:#faf7f1; --surface:#fff; --text:#24231f; --muted:#625d53; --line:#ddd5c8; --accent:#624500; --focus:#006fba; }
* { box-sizing:border-box; }
html { scroll-padding-top:2rem; }
body { margin:0; background:var(--bg); color:var(--text); font:1rem/1.7 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; overflow-wrap:anywhere; }
a { color:var(--accent); text-underline-offset:.2em; }
a:hover { text-decoration-thickness:2px; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--focus); outline-offset:5px; border-radius:3px; }
header,main,footer { width:min(100% - 2.5rem, 760px); margin-inline:auto; }
header { border-bottom:1px solid var(--line); padding-block:1rem; }
nav { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; align-items:center; }
nav a { min-height:44px; display:inline-flex; align-items:center; }
nav a:first-child { font-weight:750; margin-right:auto; text-decoration:none; }
main { padding-block:3rem; min-height:60vh; }
h1 { font-size:clamp(2rem,6vw,3.25rem); line-height:1.15; letter-spacing:-.04em; margin:.5rem 0 1.5rem; }
h2 { font-size:1.35rem; line-height:1.35; margin-top:2.5rem; }
p,li { max-width:70ch; }
li+li { margin-top:.75rem; }
.eyebrow { margin:0; color:var(--muted); font-weight:650; }
.intro { font-size:1.2rem; color:var(--muted); }
.card { background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:1.5rem; margin:2rem 0; }
.card h2 { margin-top:0; }
.links { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:center; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.6rem 1rem; background:var(--accent); color:var(--surface); border-radius:10px; font-weight:650; text-decoration:none; }
details { border-bottom:1px solid var(--line); padding:1rem 0; }
summary { cursor:pointer; font-weight:650; min-height:44px; }
details p { margin:.5rem 0 1rem; }
footer { border-top:1px solid var(--line); padding-block:1.25rem; color:var(--muted); font-size:.9rem; }
.skip { position:absolute; top:-100px; left:1rem; padding:.6rem 1rem; background:var(--surface); z-index:1; }
.skip:focus { top:1rem; }
@media(prefers-color-scheme:dark) { :root { --bg:#181714; --surface:#24221d; --text:#f4f0e7; --muted:#c3bcad; --line:#494438; --accent:#ebc875; --focus:#70c9ff; } .button { color:#181714; } }
@media(max-width:420px) { header,main,footer { width:calc(100% - 2rem); } main { padding-block:2rem; } nav { gap:.25rem 1rem; } .card { padding:1rem; } }
