* { box-sizing:border-box; }
html { scroll-padding-top:28px; }
body { margin:0; background:var(--brand-paper); color:var(--brand-ink); font:16px/1.7 var(--font-sans); }
a { color:var(--brand-green); text-underline-offset:4px; }
.guide-shell { padding-block:64px 80px; }
.guide-hero { max-width:780px; margin-bottom:48px; }
h1,h2,h3 { line-height:1.12; }
h1,h2 { font-family:var(--font-serif); font-weight:500; letter-spacing:-.035em; }
h1 { margin:18px 0; font-size:clamp(2.6rem,5vw,4.5rem); }
h2 { margin:0 0 20px; font-size:2.2rem; }
h3 { margin-top:28px; font-size:1.15rem; }
p,li,dd { color:var(--brand-muted); }
p { margin:0 0 18px; }
.guide-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:64px; }
.guide-nav { display:flex; flex-direction:column; align-self:start; position:sticky; top:24px; }
.guide-nav a { padding:10px 0; font-size:14px; }
.guide-content { max-width:880px; min-width:0; }
.guide-content section { padding-bottom:32px; margin-bottom:36px; border-bottom:1px solid var(--brand-line); }
ul { padding-left:22px; }
li { padding-left:4px; margin-bottom:12px; }
strong,dt { color:var(--brand-ink); font-weight:600; }
dt { margin-top:18px; }
dd { margin:4px 0 0; }
.guide-table-wrap { overflow:auto; margin-block:24px; border:1px solid var(--brand-line); border-radius:8px; }
table { width:100%; border-collapse:collapse; text-align:left; font-size:14px; }
caption { text-align:left; padding:14px; color:var(--brand-muted); }
th,td { vertical-align:top; padding:14px; min-width:140px; border-top:1px solid var(--brand-line); }
th { font-weight:600; } thead { background:var(--color-surface-muted); } td { color:var(--brand-muted); }
code { font-size:.9em; overflow-wrap:anywhere; }
@media(max-width:900px) { .guide-layout { grid-template-columns:1fr; gap:32px; } .guide-nav { position:static; flex-direction:row; flex-wrap:wrap; gap:4px 24px; } }
@media(max-width:760px) { .guide-shell { padding-block:44px; } .guide-hero { margin-bottom:28px; } h2 { font-size:1.9rem; } }
