:root { color-scheme: light dark; }
body {
  margin: 0 auto; padding: 1.5rem 1.25rem 4rem; max-width: 46rem;
  font-family: Lato, system-ui, sans-serif; font-size: 1.0625rem; line-height: 1.65;
  color: #1F2718; background: #E8E2D0;
}
h1, h2, h3 { font-family: Fraunces, Georgia, serif; line-height: 1.2; color: #2F6B4F; }
h1 { font-size: 2rem; margin: 0.5rem 0 1rem; }
h2 { font-size: 1.35rem; margin: 2.5rem 0 0.75rem; }
h3 { font-size: 1.05rem; margin: 1.5rem 0 0.25rem; }
a { color: #2F6B4F; }
header { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: baseline;
  padding-bottom: 1rem; border-bottom: 1px solid #C9D6BE; }
header .home { font-family: Fraunces, Georgia, serif; font-weight: 700; text-decoration: none; }
header nav { font-size: 0.875rem; }
.lede { font-size: 1.15rem; }
.facts { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; }
.fact { display: grid; grid-template-columns: 14rem 1fr; gap: 1rem;
  padding: 0.5rem 0; border-bottom: 1px solid #C9D6BE; }
.fact dt { font-weight: 700; }
.fact dd { margin: 0; }
.qa h3 { color: #1F2718; }
.qa p { margin-top: 0.25rem; }
.plant-list { list-style: none; padding: 0; }
.plant-list li { padding: 0.4rem 0; border-bottom: 1px solid #C9D6BE; }
.plant-list span { display: block; font-size: 0.875rem; opacity: 0.75; }
.tags { font-size: 0.875rem; opacity: 0.8; }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid #C9D6BE;
  font-size: 0.875rem; opacity: 0.85; }
@media (max-width: 34rem) { .fact { grid-template-columns: 1fr; gap: 0; } }
@media (prefers-color-scheme: dark) {
  body { color: #E8E2D0; background: #1B2018; }
  h1, h2, h3, a, header .home { color: #9CC5A1; }
  .qa h3 { color: #E8E2D0; }
  .fact, .plant-list li, header, footer { border-color: #37402F; }
}