:root {
  --ground: #0B0D18; --surface: #151829; --hairline: #2A2F48;
  --ink: #F0F2FA; --muted: #9096B0; --faint: #5A607C;
  --accent: #7C8AFF; --amber: #F5B942;
}
@media (prefers-color-scheme: light) {
  :root {
    --ground: #F7F6F3; --surface: #FFFFFF; --hairline: #E6E3DC;
    --ink: #14161F; --muted: #5C6178; --faint: #9A9EAC;
    --accent: #4C5BD4; --amber: #D99614;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--ground); color: var(--ink);
  font: 17px/1.65 ui-rounded, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 46rem; margin: 0 auto; padding: 3rem 1.25rem 6rem; }
header { display: flex; align-items: center; gap: .75rem; margin-bottom: 3rem; }
header .mark { width: 34px; height: 34px; flex: none; }
header a { color: var(--ink); text-decoration: none; font-weight: 700; letter-spacing: -.01em; }
nav { margin-left: auto; display: flex; gap: 1.25rem; font-size: .9rem; }
nav a { color: var(--muted); text-decoration: none; }
nav a:hover { color: var(--ink); }
h1 { font-size: 2.1rem; line-height: 1.15; letter-spacing: -.02em; margin: 0 0 .5rem; }
h2 { font-size: 1.25rem; margin: 2.75rem 0 .75rem; letter-spacing: -.01em; }
h3 { font-size: 1rem; margin: 1.75rem 0 .5rem; color: var(--muted); }
p, li { color: var(--muted); }
strong { color: var(--ink); font-weight: 600; }
a { color: var(--accent); }
hr { border: 0; border-top: 1px solid var(--hairline); margin: 3rem 0; }
table { width: 100%; border-collapse: collapse; margin: 1.25rem 0; font-size: .93rem; }
th { text-align: left; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em;
     color: var(--faint); font-weight: 600; padding: .5rem .75rem .5rem 0; }
td { padding: .6rem .75rem .6rem 0; border-top: 1px solid var(--hairline); color: var(--muted);
     vertical-align: top; }
blockquote { margin: 1.5rem 0; padding: 1rem 1.25rem; border-left: 3px solid var(--accent);
             background: var(--surface); border-radius: 0 12px 12px 0; }
blockquote p { margin: 0; }
footer { margin-top: 5rem; padding-top: 2rem; border-top: 1px solid var(--hairline);
         color: var(--faint); font-size: .85rem; }
footer a { color: var(--muted); }
.lede { font-size: 1.2rem; color: var(--ink); }
.updated { color: var(--faint); font-size: .85rem; margin-bottom: 2.5rem; }