@font-face { font-family: Geist; src: url(/learn/geist.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
:root { color-scheme: dark; --bg:#07070c; --fg:#f4f4f8; --muted:#a9a9bd; --line:#26263a; --accent:#a78bfa; --primary:#8b5cf6; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:17px/1.7 Geist, system-ui, sans-serif; }
a { color:var(--accent); }
header, main, footer { max-width: 44rem; margin: 0 auto; padding: 0 1.25rem; }
header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1.25rem; padding-bottom:1.25rem; border-bottom:1px solid var(--line); }
header a.brand { display:flex; align-items:center; gap:.6rem; color:var(--fg); text-decoration:none; font-weight:600; letter-spacing:-.01em; }
header a.brand img { width:28px; height:28px; }
header nav a { color:var(--muted); text-decoration:none; font-size:.9rem; }
header nav a:hover { color:var(--fg); }
main { padding-top:2.5rem; padding-bottom:3rem; }
h1 { font-size: clamp(1.9rem, 5vw, 2.6rem); line-height:1.15; letter-spacing:-.03em; margin:0 0 .75rem; }
.lead { color:var(--muted); font-size:1.15rem; margin:0 0 2rem; }
h2 { font-size:1.35rem; letter-spacing:-.02em; margin:2.4rem 0 .6rem; }
p, li { color:#d6d6e2; }
ul, ol { padding-left:1.3rem; }
table { width:100%; border-collapse:collapse; margin:1rem 0; font-size:.95rem; }
th, td { text-align:left; padding:.45rem .6rem; border-bottom:1px solid var(--line); }
th { color:var(--muted); font-weight:500; }
.cta { display:inline-block; margin-top:2rem; padding:.7rem 1.2rem; border-radius:8px; background:var(--primary); color:#fff; text-decoration:none; font-weight:500; }
.cards { list-style:none; padding:0; margin:1.5rem 0 0; border-top:1px solid var(--line); }
.cards li { border-bottom:1px solid var(--line); }
.cards a { display:block; padding:1rem 0; text-decoration:none; color:var(--fg); }
.cards a span { display:block; color:var(--muted); font-size:.95rem; }
footer { padding-top:1.5rem; padding-bottom:3rem; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
footer ul { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; margin:0 0 1rem; }