/* Shared by about.html and privacy.html: the same tokens as index.html, set as reading pages. */
:root {
  --bg: #f6f6f7; --surface: #ffffff; --fg: #131417; --muted: #676c75; --faint: #9a9fa7;
  --line: #e9eaed; --up: #e0323a;
  --font-body: "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
  --col: 760px; --pad: 16px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0e0f11; --surface: #15171a; --fg: #ececee; --muted: #a3a8b0; --faint: #6d727a;
    --line: #25282d; --up: #ff5a60; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0e0f11; --surface: #15171a; --fg: #ececee; --muted: #a3a8b0; --faint: #6d727a;
  --line: #25282d; --up: #ff5a60; color-scheme: dark;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--fg); font-family: var(--font-body); font-size: 15px; line-height: 1.7; }
a { color: inherit; }
.col { max-width: var(--col); margin: 0 auto; padding-left: max(var(--pad), env(safe-area-inset-left, 0px)); padding-right: max(var(--pad), env(safe-area-inset-right, 0px)); }
.bar { background: var(--surface); border-bottom: 1px solid var(--line); }
.bar .col { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 12px; padding-bottom: 12px; }
.logo { font-size: 21px; font-weight: 700; letter-spacing: -0.03em; text-decoration: none; }
.logo span { color: var(--up); font-size: 15px; }
.bar nav { display: flex; gap: 14px; font-size: 13px; color: var(--muted); }
.bar nav a { text-decoration: none; }
.bar nav a[aria-current="page"] { color: var(--fg); font-weight: 600; }
main { padding-top: 8px; padding-bottom: 48px; }
h1 { font-size: 24px; letter-spacing: -0.02em; margin: 24px 0 4px; }
.updated { color: var(--faint); font-size: 13px; margin: 0 0 24px; }
h2 { font-size: 17px; margin: 32px 0 6px; scroll-margin-top: 16px; }
p, li { max-width: 64ch; }
ul, ol { padding-left: 1.25em; }
code { font-size: 13px; background: var(--line); padding: 1px 5px; border-radius: 4px; word-break: break-all; }
table { border-collapse: collapse; font-size: 14px; margin: 8px 0; }
th, td { text-align: left; padding: 6px 12px 6px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color: var(--muted); font-weight: 500; }
.note { color: var(--muted); font-size: 14px; }