/* Reset, type, focus and a few layout utilities (docs/r2/DESIGN.md §4). Tokens only. */
*, *::before, *::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + var(--s9))}
body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--label);font:var(--t-body);letter-spacing:var(--k-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
main{flex:1;display:block}
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote, fieldset, legend{margin:0;padding:0}
ul, ol{list-style:none}
fieldset{border:0;min-width:0}
h1, h2, h3, h4{text-wrap:balance}
h1, .t-title1{font:var(--t-title1);letter-spacing:var(--k-title1)}
h2, .t-title2{font:var(--t-title2);letter-spacing:var(--k-title2)}
h3, .t-title3{font:var(--t-title3);letter-spacing:var(--k-title3)}
h4, .t-headline{font:var(--t-headline);letter-spacing:var(--k-headline)}
.t-display{font:var(--t-display);letter-spacing:var(--k-display)}
.t-body{font:var(--t-body);letter-spacing:var(--k-body)}
.t-reading{font:var(--t-reading);letter-spacing:var(--k-reading);max-width:var(--reading-max)}
.t-callout{font:var(--t-callout);letter-spacing:var(--k-callout)}
.t-subhead{font:var(--t-subhead);letter-spacing:var(--k-subhead)}
.t-footnote{font:var(--t-footnote);letter-spacing:var(--k-footnote)}
.t-caption{font:var(--t-caption);letter-spacing:var(--k-caption);text-transform:uppercase}
.dim{color:var(--label-2)}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.good{color:var(--good)} .warn { color:var(--warn)} .bad { color:var(--bad)}
a{color:var(--accent);text-decoration:none;text-underline-offset:0.18em}
a:hover{text-decoration:underline}
img, svg, video{display:block;max-width:100%}
img{height:auto;background:var(--fill)}
button, input, select, textarea{font:inherit;letter-spacing:inherit;color:inherit}
button{cursor:pointer}
summary{cursor:pointer;list-style:none;min-height:var(--target)}
summary::-webkit-details-marker{display:none}
hr{border:0;border-top:var(--hairline) solid var(--separator);margin:0}
table{border-collapse:collapse;width:100%}
th{text-align:left;font-weight:600}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--accent-tint)}
[hidden]{display:none !important}
.icon{flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.sr-only, .skip:not(:focus){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip:focus{position:fixed;z-index:100;top:var(--s2);left:var(--s2);padding:var(--s3) var(--s4);background:var(--bg-elev);border-radius:var(--r-s);box-shadow:var(--shadow-sheet)}
.wrap{width:100%;max-width:calc(var(--page-max) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.measure{max-width:var(--reading-max)}
.stack > * + *{margin-top:var(--gap, var(--s4))}
.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap, var(--s2))}
.split{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4)}
.inline-form{display:inline}
.pre{white-space:pre-line}

/* Plain pages: terms, credits, errors, sign-in. One readable column. */
.page{padding-block:var(--s7) var(--s9)}
.page > h1{margin-bottom:var(--s4)}
.page h2{margin-top:var(--s7);margin-bottom:var(--s2)}
.page p + p, .page p + ul, .page ul + p{margin-top:var(--s3)}
.page li{padding-left:var(--s4);position:relative}
.page li::before{content:"–";position:absolute;left:0;color:var(--label-3)}
.credits li{display:flex;gap:var(--s3);padding:var(--s3) 0}
.credits li > div{min-width:0;overflow-wrap:anywhere}
.page p a, .measure a, .pf-sec p a, dd a{text-decoration:underline}
.credits li::before{content:none}
.credits-thumb{flex:none;width:4.5rem;height:4.5rem;object-fit:cover;border-radius:var(--r-s)}
.note-line{padding:var(--s3) var(--gutter);font:var(--t-subhead);color:var(--label-2);border-bottom:var(--hairline) solid var(--separator)}
.foot{padding:var(--s6) var(--gutter) calc(var(--s6) + env(safe-area-inset-bottom));font:var(--t-footnote);color:var(--label-2);text-align:center}
.foot a{color:inherit;display:inline-block;min-width:var(--target);padding-block:0.8125rem}
a.u{text-decoration:underline}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 var(--s5)}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after{animation-duration:0.01ms !important;transition-duration:100ms !important;transition-property:opacity, background-color, color !important;scroll-behavior:auto !important}
}
