:root { color-scheme: light; --background: #f8f9f5; --surface: #ffffff; --text: #1c2517; --muted: #526047; --border: #dce3d4; --accent: #b5ed6a; --accent-text: #315f03; --on-accent: #16220d; --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem; --space-16: 4rem; --space-24: 6rem; --content-width: 66rem; --reading-width: 46rem; --radius: .35rem; }
:root[data-theme="dark"] { color-scheme: dark; --background: #111111; --surface: #1a1a1a; --text: #eff2e9; --muted: #b1b6aa; --border: #32352e; --accent-text: #b5ed6a; }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--background); color: var(--text); font-family: Inter, "Segoe UI", system-ui, sans-serif; line-height: 1.7; }
a { color: var(--accent-text); text-underline-offset: .2em; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: .15rem solid var(--accent-text); outline-offset: .3rem; }
h1, h2, p, dl { margin-top: 0; }
h1, h2 { line-height: 1.13; letter-spacing: -.035em; }
.skip-link { position: absolute; inset: var(--space-4) auto auto var(--space-4); transform: translateY(-200%); background: var(--surface); padding: var(--space-2) var(--space-4); z-index: 1; }
.skip-link:focus { transform: none; }