:root {
  color-scheme: light;
  --map-cream: #f6f1e6;
  --water: #b9d9eb;
  --park: #d6e5c9;
  --ink: #594f3f;
  --deep-ink: #3f382d;
  --muted: #655c4e;
  --line: #d5cfc0;
  --paper: #ffffff;
  --blue: #0a84ff;
  --blue-text: #0758af;
  --blue-pressed: #0967d2;
  --pin: #ff3b30;
  --display: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --body: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --book: Georgia, "Times New Roman", serif;
  --label: ui-monospace, "SFMono-Regular", Consolas, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; color: var(--ink); background: var(--map-cream); font-family: var(--body); font-size: 18px; line-height: 1.6; font-variant-numeric: tabular-nums; }
button, input { font: inherit; }
button, a, input { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: var(--blue-text); text-underline-offset: 4px; }
a:hover { color: #064384; }
button:focus-visible, input:focus-visible, a:focus-visible { outline: 3px solid #0758af; outline-offset: 4px; }
h1, h2, h3, p { margin-top: 0; }
p { margin-bottom: 16px; }
h1, h2, h3 { color: var(--deep-ink); font-family: var(--display); }
img { display: block; max-width: 100%; height: auto; }
[hidden] { display: none !important; }
::selection { color: #283d49; background: #b9d9eb; }
.c-skip { position: fixed; z-index: 20; top: 12px; left: 16px; min-height: 48px; padding: 12px 16px; background: white; border: 2px solid var(--blue-text); border-radius: 8px; transform: translateY(-160%); }
.c-skip:focus { transform: translateY(0); }
.c-shell { position: relative; width: min(1360px, calc(100% - 96px)); margin: 0 auto; padding-top: 24px; padding-bottom: 48px; }
.c-chapter { width: min(760px, 100%); }
@media (max-width: 1050px) { .c-shell { width: min(760px, calc(100% - 48px)); } }
@media (max-width: 600px) {
  body { font-size: 17px; }
  .c-shell { width: calc(100% - 24px); padding-top: 12px; padding-bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media print {
  body { background: #fff; color: #222; font-size: 12pt; }
  .c-shell { width: 100%; margin: 0; padding: 0; }
  .c-map, .c-map-note, .c-skip { display: none; }
  .c-chapter { width: 100%; }
  a { color: #222; }
}