:root { --fg:#111; --muted:#555; --rule:#ddd; --bg:#fff; --accent:#0a5; }
html, body { background: var(--bg); color: var(--fg); font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; line-height: 1.55; }
.wrap { max-width: 960px; margin: 0 auto; padding: 2.25rem 1.25rem 4rem; }
h1, h2, h3 { line-height: 1.25; margin: 1.6rem 0 0.6rem; }
h1 { font-size: 1.9rem; }
h2 { font-size: 1.35rem; margin-top: 2rem; }
h3 { font-size: 1.05rem; margin-top: 1.2rem; }
p { margin: 0.6rem 0 0.6rem; }
ul, ol { margin: 0.4rem 0 1rem 1.35rem; }
li { margin: 0.25rem 0; }
small, .muted { color: var(--muted); }
hr { border: 0; border-top: 1px solid var(--rule); margin: 1.4rem 0; }
code { background: #f7f7f7; padding: 0 .25rem; border-radius: .25rem; }
.topnote { padding: .85rem 1rem; background: #f8fff9; border: 1px solid #e6f6ea; border-radius: 8px; }
.toc { border-left: 3px solid var(--rule); padding-left: .9rem; margin: .5rem 0 1.5rem; }
a { color: #0645ad; text-decoration: none; }
a:hover { text-decoration: underline; }
.caps { text-transform: uppercase; letter-spacing: .04em; font-weight: 600; }
.section-id { color: var(--muted); font-weight: 500; margin-right: .35rem; }
.footer { margin-top: 2.5rem; font-size: .9rem; color: var(--muted); }
.badge { display:inline-block; padding:.1rem .45rem; background:#eef7ff; border:1px solid #d8eefc; border-radius:6px; font-size:.78rem; }
.callout { padding:.8rem 1rem; background:#fff9f0; border:1px solid #ffe2bf; border-radius:8px; }