:root{--ground:#F2F4F1;--surface:#E6EAE5;--ink:#16201C;--ink-soft:#4A5852;--rule:#C9D1CB;--accent:#1F4E79;--amber:#9A5B1E;--amber-wash:#F3E7D8;
--display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;--body:"Source Serif 4",Georgia,serif;--mono:"JetBrains Mono",ui-monospace,Menlo,monospace}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--ground:#101517;--surface:#1A2226;--ink:#E3E8E5;--ink-soft:#9DABA5;--rule:#2C383C;--accent:#8DB8E3;--amber:#E0A86A;--amber-wash:#2A2118}}
:root[data-theme=dark]{color-scheme:dark;--ground:#101517;--surface:#1A2226;--ink:#E3E8E5;--ink-soft:#9DABA5;--rule:#2C383C;--accent:#8DB8E3;--amber:#E0A86A;--amber-wash:#2A2118}
*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--ink);font:1.1rem/1.65 var(--body);padding:0 20px 64px}
.wrap{max-width:860px;margin:0 auto}
header.top{padding:40px 0 24px;border-bottom:2px solid var(--ink);margin-bottom:28px}
.eyebrow{font:.75rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 14px}
.eyebrow a{color:inherit;text-decoration:none}.eyebrow a:hover{color:var(--accent)}
h1{font:800 clamp(2.2rem,6vw,3.8rem)/.98 var(--display);letter-spacing:-.03em;margin:0 0 14px}
h2{font:700 1.5rem/1.2 var(--display);letter-spacing:-.01em;margin:2.2em 0 .5em}
h3{font:700 1.15rem var(--display);margin:1.6em 0 .3em}
.dek{font-size:1.25rem;line-height:1.4;max-width:40ch;margin:0;color:var(--ink-soft)}
a{color:var(--accent)}p{margin:.8em 0}
.mono{font-family:var(--mono);font-size:.82rem;color:var(--ink-soft)}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:6px;padding:16px 20px}
.note{background:var(--amber-wash);border-left:4px solid var(--amber);padding:12px 18px;margin:1.4em 0;border-radius:0 6px 6px 0}
button,input,textarea,select{font:inherit}
button.btn{background:var(--accent);color:var(--ground);border:0;border-radius:5px;padding:9px 18px;font:600 .9rem var(--mono);cursor:pointer}
button.btn:hover{filter:brightness(1.1)}button.btn:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input,textarea,select{width:100%;background:var(--ground);color:var(--ink);border:1px solid var(--rule);border-radius:5px;padding:9px 12px;font-size:1rem}
label{display:block;font:.75rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:14px 0 4px}
