/* Reset + base typography */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: var(--font-body);
    font-size: var(--step-0);
    line-height: 1.6;
    color: var(--ink);
    background: var(--bg);
    font-feature-settings: "cv02","cv03","cv04","cv11";
}
img, svg { max-width: 100%; display: block; }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4, h5 { line-height: 1.25; margin: 0 0 0.6em; letter-spacing: -0.01em; }
h1 { font-size: var(--step-4); font-weight: 700; }
h2 { font-size: var(--step-3); font-weight: 700; }
h3 { font-size: var(--step-2); font-weight: 600; }
h4 { font-size: var(--step-1); font-weight: 600; }
p { margin: 0 0 1em; }
code, pre {
    font-family: var(--font-mono);
    font-size: 0.9em;
}
pre {
    background: var(--bg-alt);
    padding: 1rem 1.25rem;
    border-radius: var(--radius-sm);
    overflow-x: auto;
    border: 1px solid var(--line);
}
code { background: var(--bg-alt); padding: 0.1em 0.35em; border-radius: 3px; }
pre code { background: transparent; padding: 0; }
hr { border: 0; border-top: 1px solid var(--line); margin: 2rem 0; }
blockquote {
    margin: 1.5rem 0;
    padding: 0.75rem 1.25rem;
    border-left: 3px solid var(--brand);
    background: var(--bg-alt);
    color: var(--ink-2);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
table { border-collapse: collapse; width: 100%; margin: 1.5rem 0; }
th, td { text-align: left; padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--line); }
th { font-weight: 600; background: var(--bg-alt); }
mark { background: #FFF3B0; padding: 0.05em 0.15em; border-radius: 2px; }
::selection { background: var(--brand-tint); color: var(--ink); }