/* Document pages (Terms). Tokens come from tokens.css. */
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--text); font: 16px/1.6 var(--body-font); overflow-x: hidden; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.top { display: flex; align-items: center; gap: 10px; padding: 7px 16px; background: var(--band); color: var(--band-text); border-bottom: 3px solid var(--pp-red); }
.top a { display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.brand-logo { height: 42px; width: auto; display: block; }
.top .name { font: 700 1.3rem/1 var(--brand-font); letter-spacing: 0.06em; padding-top: 3px; }
.doc { max-width: 720px; margin: 0 auto; padding: 16px 16px 48px; }
.doc h1 { font: 700 1.8rem/1.2 var(--brand-font); margin: 16px 0 4px; }
.doc h2 { font: 700 1.15rem/1.3 var(--brand-font); margin: 28px 0 6px; color: var(--text); border-left: 4px solid var(--pp-red); padding: 3px 0 0 10px; }
.doc p, .doc li { overflow-wrap: anywhere; }
.doc ul { padding-left: 20px; }
.muted { color: var(--muted); }
a { color: var(--focus); }
.foot { background: var(--band); color: var(--band-muted); text-align: center; font-size: 0.8rem; padding: 12px 16px; }
.foot a { color: var(--band-text); }
.top, .foot { --focus: #38bdf8; }  /* dark bands in both themes */