:root {
  color-scheme: light;
  --b4-background: #fbf7f1;
  --b4-paper: #fff;
  --b4-text: #2a231c;
  --b4-secondary: #62594d;
  --b4-accent: #7a4a12;
  --b4-divider: rgba(42, 35, 28, .12);
}

/* System colors also work when JavaScript is disabled. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --b4-background: #1c1712;
    --b4-paper: #262019;
    --b4-text: #f0e9de;
    --b4-secondary: #b7aa96;
    --b4-accent: #e3a960;
    --b4-divider: rgba(240, 233, 222, .1);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --b4-background: #1c1712;
  --b4-paper: #262019;
  --b4-text: #f0e9de;
  --b4-secondary: #b7aa96;
  --b4-accent: #e3a960;
  --b4-divider: rgba(240, 233, 222, .1);
}

html, body, #root {
  min-height: 100%;
  background: var(--b4-background);
  color: var(--b4-text);
}

body { margin: 0; }
html { scroll-padding-top: 90px; }

.updates-page { max-width: 100%; }
.updates-page h1, .seo-shell .updates-page h1 {
  margin: 0;
  font: 600 clamp(1.625rem, 5vw, 2rem)/1.2 Georgia, "Times New Roman", serif;
}
.updates-page .updates-intro {
  margin: 1rem 0 3rem;
  max-width: 36rem;
  color: var(--b4-secondary);
  font-size: 1.0625rem;
  line-height: 1.7;
}
.update-entry {
  scroll-margin-top: 90px;
  border-top: 1px solid var(--b4-divider);
  padding: 2rem 0;
}
.update-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.update-meta time { color: var(--b4-secondary); font-size: .875rem; }
.update-label {
  border: 1px solid var(--b4-divider);
  border-radius: 999px;
  color: var(--b4-accent);
  padding: .2rem .65rem;
  font-size: .75rem;
  font-weight: 600;
}
.updates-page .update-title {
  margin: 1rem 0 .75rem;
  font: 600 1.5rem/1.35 Georgia, "Times New Roman", serif;
}
.updates-page .update-title a { color: inherit; text-decoration: none; }
.updates-page .update-title a:hover { color: var(--b4-accent); text-decoration: underline; }
.updates-page .update-summary, .update-changes {
  color: var(--b4-secondary);
  font-size: 1rem;
  line-height: 1.75;
}
.update-changes { padding-left: 1.25rem; }
.update-changes li + li { margin-top: .4rem; }
.updates-page a:focus-visible { outline: 2px solid var(--b4-accent); outline-offset: 4px; }
