.site-nav { display:flex; gap:6px; margin-left:auto; }
.site-nav a { padding:8px 11px; border-radius:8px; color:#36523e; text-decoration:none; font-size:13px; white-space:nowrap; }
.site-nav a:hover, .site-nav a[aria-current] { background:#e8f1e9; }
.content-shell { min-height:100%; height:auto; grid-template-rows:auto 1fr auto; background:#f5f8f5; color:#263d2e; }
.content-shell .site-header { min-height:64px; }
.content-page { width:min(1240px, 100%); margin:0 auto; padding:44px 24px 64px; }
.page-intro { max-width:780px; margin-bottom:30px; }
.page-intro h1 { font-size:clamp(28px,4vw,42px); letter-spacing:-.035em; margin:8px 0 12px; }
.page-intro p { line-height:1.65; color:#5b6f60; }
.page-intro .eyebrow { color:#477451; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.catalog-filters { display:flex; align-items:end; flex-wrap:wrap; gap:16px; padding:20px; background:white; border:1px solid #d9e3dc; border-radius:14px; }
.catalog-filters div { flex:1 1 240px; }
.catalog-filters label { display:block; font-size:13px; margin-bottom:8px; }
.catalog-filters input, .catalog-filters select { width:100%; min-height:44px; padding:10px; border:1px solid #b8c8bd; border-radius:8px; font:inherit; background:white; }
a { color:#315f40; }
.primary-button { display:inline-block; background:#284c35; border:0; color:white; border-radius:8px; padding:12px 20px; font:inherit; text-decoration:none; cursor:pointer; }
.result-count { color:#647468; font-size:14px; margin:24px 0 16px; }
.species-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:20px; }
.species-card { min-width:0; border:1px solid #d9e3dc; border-radius:16px; padding:24px; background:#fff; overflow-wrap:anywhere; }
.category-badge { display:inline-block; color:#306044; background:#edf5ef; border-radius:6px; padding:5px 8px; font-size:11px; }
.category-badge.invasive { background:#fff0e8; color:#963f25; }
.species-card h2 { font-size:22px; font-weight:600; margin:18px 0; }
.card-attributes { display:grid; grid-template-columns:1fr 1.4fr; gap:10px 14px; font-size:14px; line-height:1.5; }
dt { color:#66776b; } dd { margin:0; }
.map-link { display:inline-block; margin:18px 0; font-weight:600; }
summary { cursor:pointer; font-size:14px; padding:10px 0; color:#365d40; }
.observations { border-top:1px solid #e3eae5; }
.observations .muted { font-size:12px; color:#6b7b70; line-height:1.5; }
.observation { border-top:1px solid #e3eae5; padding:10px 0; font-size:13px; }
.observation h3 { font-size:14px; }.observation dl { display:grid; gap:5px; }.observation dd { margin-bottom:8px; }
.localities ul { padding-left:18px; line-height:1.6; font-size:13px; }
.empty-state { grid-column:1/-1; padding:40px; border:1px dashed #b8c8bd; border-radius:16px; }
.about-page { max-width:980px; }.project-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:28px; }
.project-stats div { padding:24px; background:#e8f1e9; border-radius:14px; }.project-stats strong { display:block; font-size:30px; margin-bottom:8px; }.project-stats span { font-size:14px; color:#526e5a; }
.prose-panel { padding:28px; background:white; border:1px solid #d9e3dc; border-radius:14px; margin-bottom:18px; line-height:1.75; }.prose-panel h2 { margin-top:0; font-size:23px; }.prose-panel li { margin:8px 0; }.page-actions { display:flex; align-items:center; gap:24px; margin-top:20px; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible { outline:3px solid #799f80; outline-offset:3px; }
@media(max-width:1050px) { .brand-title { max-width:30vw; }.species-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:780px) { .page-shell { grid-template-rows:auto minmax(0,1fr) auto; }.site-header { flex-wrap:wrap; padding:10px 12px; gap:8px; }.brand { flex:1; }.brand-title { max-width:55vw; }.site-nav { order:3; width:100%; margin:0; justify-content:center; }.site-nav a { font-size:12px; }.content-page { padding:28px 16px; }.species-grid { grid-template-columns:1fr; }.project-stats { grid-template-columns:1fr; }.project-stats div { padding:16px; }.prose-panel { padding:20px; }.app .sidebar { max-height:32vh; } }
.category-filters { border:0; padding:0; margin:18px 0 12px; }
.category-filters legend { font-size:12px; color:#637668; margin-bottom:10px; }
.sidebar .filter-option { display:flex; align-items:center; gap:8px; margin:10px 0; font-size:13px; font-weight:400; cursor:pointer; }
.category-rare { background:#2d6cdf; }.category-resource { background:#2e8b57; }.category-invasive { background:#d4552d; }
.filter-option .swatch { flex:0 0 10px; width:10px; height:10px; }
.sidebar input[type=checkbox] { width:16px; height:16px; flex:0 0 16px; accent-color:#284c35; cursor:pointer; }
.filter-actions { display:flex; gap:8px; margin-bottom:18px; }.filter-actions button { background:white; border:1px solid #c4d3c8; padding:7px 12px; border-radius:6px; color:#315f40; cursor:pointer; }
#species-search { width:100%; padding:10px; border:1px solid #afbeb2; border-radius:6px; font:inherit; font-size:13px; }
.filter-count { color:#627767; font-size:12px; }
.species-filter-row { display:flex; align-items:center; gap:6px; }.species-filter-row[hidden] { display:none; }
.species-filter-row:has(input:disabled) { opacity:.55; }
.invasive-map-symbol, .invasive-legend-symbol { border-radius:50%; background:white; }
.invasive-legend-symbol { flex:0 0 28px; width:28px; height:28px; }