:root {
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);

  /* brand */
  --leaf: #1c5a3a;
  --leaf-deep: #0c2419;
  --mango: #f5a623;
  --cream: #fff6df;
  --night: #0e2a1c;
  --night-2: #143524;

  /* theme (light) */
  --bg: #fff7e2;
  --bg-2: #fde8b3;
  --ink: #17281c;
  --muted: #4f5f4a;
  --line: rgba(23, 40, 28, .22);
  --cta-bg: #1c5a3a;
  --cta-ink: #fff6df;
  --star: #d98200;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f2418;
    --bg-2: #163222;
    --ink: #fff1cf;
    --muted: #b9c9ad;
    --line: rgba(255, 241, 207, .22);
    --cta-bg: #f5a623;
    --cta-ink: #1e2a12;
    --star: #f5a623;
  }
}
:root[data-theme="dark"] {
  --bg: #0f2418;
  --bg-2: #163222;
  --ink: #fff1cf;
  --muted: #b9c9ad;
  --line: rgba(255, 241, 207, .22);
  --cta-bg: #f5a623;
  --cta-ink: #1e2a12;
  --star: #f5a623;
}
*, *::before, *::after { box-sizing: inherit; }
html { scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 4.5rem); scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Prompt, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: Mitr, Georgia, "Times New Roman", serif; font-weight: 500; margin: 0; letter-spacing: 0; }
:focus-visible { outline: 3px solid var(--mango); outline-offset: 3px; border-radius: 4px; }
.wrap { width: min(1080px, 100% - 2.5rem); margin-inline: auto; }

[hidden] { display: none !important; }