:root { --bg: #f7f6f1; --ink: #1f2a24; --muted: #66706a; --accent: #2f7d55; --card: #fff; --line: #e2e0d8; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.6 system-ui, sans-serif; background: var(--bg); color: var(--ink); }
header.site { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; padding: 14px 24px; background: var(--card); border-bottom: 1px solid var(--line); }
.logo { font-weight: 700; color: var(--accent); text-decoration: none; }
#nav { display: flex; flex-wrap: wrap; gap: 4px 12px; }
#nav a { color: var(--muted); text-decoration: none; font-size: 14px; }
#nav a.active { color: var(--ink); font-weight: 600; }
main { max-width: 860px; margin: 0 auto; padding: 28px 20px 60px; }
.lede { color: var(--muted); }
.cards { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.cards a { display: block; padding: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; color: inherit; text-decoration: none; }
.cards span { display: block; color: var(--muted); font-size: 14px; }

/* pages:start — each page appends its own block below */
/* axolotl */
.page-axolotl ul { padding-left: 20px; line-height: 1.6; }
.page-axolotl li + li { margin-top: 6px; }
.page-axolotl em { font-style: italic; }

.page-tardigrade { max-width: 62ch; }
.page-tardigrade ul { padding-left: 1.2em; }
.page-tardigrade li { margin: 0.5em 0; }

/* narwhal */
.page-narwhal h1 { color: var(--accent); margin-bottom: 4px; }
.page-narwhal ul { padding-left: 20px; }
.page-narwhal li { margin-bottom: 8px; }
.page-hummingbird h1 { color: var(--accent); margin-bottom: 0.4em; }
.page-hummingbird ul { padding-left: 1.2em; }
.page-hummingbird li { margin-bottom: 0.5em; }
.page-venus-flytrap h1 { color: var(--accent); }
.page-venus-flytrap ul { padding-left: 22px; }
.page-venus-flytrap li::marker { color: var(--accent); }
/* slime-mold */
.page-slime-mold h1 { margin-bottom: 4px; }
.page-slime-mold ul { padding-left: 20px; line-height: 1.6; }
.page-slime-mold li + li { margin-top: 6px; }

.page-octopus .intro { color: var(--muted); }
.page-octopus ul { padding-left: 20px; }
.page-octopus li { margin-bottom: 8px; }
.page-mantis-shrimp h1 { color: var(--accent); }
.page-mantis-shrimp ul { padding-left: 20px; line-height: 1.6; }
.page-mantis-shrimp li + li { margin-top: 8px; }
/* pages:end */