:root {
  --bg: #f6f4ef; --surface: #fffdf8; --fg: #1f2328; --muted: #5d636b; --line: #e3ded2; --accent: #2f6690; --accent-soft: #e4eef6;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #14171a; --surface: #1b1f23; --fg: #e6e8ea; --muted: #9aa3ac; --line: #2b3137; --accent: #86b8de; --accent-soft: #1d2b37; color-scheme: dark; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 17px/1.6 Charter, "Iowan Old Style", Georgia, serif; }
header, main, footer { max-width: 44rem; margin: 0 auto; padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
header { padding-block: 28px 0; display: flex; align-items: center; gap: 10px; font: 600 16px/1 system-ui, sans-serif; }
header a { color: inherit; text-decoration: none; display: flex; align-items: center; gap: 10px; }
.mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--accent); color: var(--surface); font-weight: 700; }
main { padding-block: 32px 48px; }
h1 { font-size: 2.1rem; line-height: 1.15; margin: 0 0 .4em; text-wrap: balance; }
h2 { font: 650 1.05rem/1.3 system-ui, sans-serif; margin: 2.2em 0 .5em; }
p, li { max-width: 65ch; }
a { color: var(--accent); }
.lead { font-size: 1.2rem; color: var(--muted); }
.updated { font: 14px system-ui, sans-serif; color: var(--muted); }
.button { display: inline-block; font: 600 16px system-ui, sans-serif; background: var(--accent); color: var(--surface); padding: 10px 18px; border-radius: 8px; text-decoration: none; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 4px 22px; margin: 1.5em 0; }
.summary li { margin: .3em 0; }
ul { padding-left: 1.2em; }
footer { padding-block: 0 40px; font: 14px system-ui, sans-serif; color: var(--muted); display: flex; gap: 18px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 18px; }
footer a { color: var(--muted); }