:root {
  --paper: #E9EEDE; --paper2: #DEE5CD; --ink: #1E2A1E; --ink-soft: #4C5A48;
  --leaf: #2F6B3E; --shell: #D9A227; color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #2C3150; --paper2: #3B4168; --ink: #EDECF8; --ink-soft: #A9AACB; --leaf: #C8DCBD; --shell: #EFC24E; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font: 1.1875rem/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
main { max-width: 40rem; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }
h1 { font-size: 2rem; line-height: 1.2; margin: 1rem 0 .25rem; }
h2 { font-size: 1.3rem; margin: 2.25rem 0 .5rem; border-top: 3px solid var(--shell); padding-top: 1rem; }
p, li { max-width: 36rem; }
ul { padding-left: 1.25rem; }
li + li { margin-top: .4rem; }
a { color: var(--leaf); text-underline-offset: .15em; }
.updated { color: var(--ink-soft); margin-top: 0; }
.langs { display: flex; gap: .75rem; flex-wrap: wrap; font-size: 1rem; }
.langs a, .langs span { padding: .5rem .75rem; min-height: 44px; display: inline-flex; align-items: center; border-radius: .5rem; }
.langs span { background: var(--paper2); font-weight: 600; }
.short { background: var(--paper2); border-radius: .75rem; padding: 1rem 1.25rem; margin: 1.5rem 0; }
.short p { margin: 0; }
code { font-size: .95em; }
