*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ── SKIP TO CONTENT ── */
.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);
  padding:0.6rem 1.2rem;background:var(--accent-primary);color:#fff;font-size:0.85rem;
  font-family:var(--font-sans);font-weight:600;border-radius:0 0 var(--radius-md) var(--radius-md);
  z-index:var(--z-tour);text-decoration:none;transition:top 0.2s ease;}
.skip-link:focus{top:0;outline:2px solid var(--accent-primary);outline-offset:2px;}

/* ── FOCUS VISIBLE ── */
:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;}
button:focus-visible,.zbtn:focus-visible,.nav-btn:focus-visible,.lang-btn:focus-visible,
.view-btn:focus-visible,.hom-filter:focus-visible,.era-preset:focus-visible{
  outline:2px solid var(--accent-primary);outline-offset:2px;}
:root{
  /* ── Core surfaces (warm charcoal) ── */
  --bg:#141618;
  --surface:#1c1f24;
  --surface-raised:#252930;
  --surface-overlay:rgba(20,22,24,0.97);
  /* ── Text hierarchy (warm off-whites) ── */
  --parchment:#ede8df;
  --text-primary:#ede8df;
  --text-secondary:#b0a99e;
  --text-muted:#8a8279;
  --text-dim:rgba(237,232,223,0.45);
  --text-faint:rgba(237,232,223,0.30);
  /* ── Primary accent: warm amber ── */
  --accent:#c8883a;
  --accent-light:#daa04d;
  --accent-dim:rgba(200,136,58,0.15);
  --accent-rgb:200,136,58;
  /* ── Semantic colors ── */
  --terra:#c45c4a;
  --sage:#5b9a6b;
  --accent-primary:#c8883a;
  --accent-primary-dim:rgba(200,136,58,0.12);
  --accent-secondary:#5b9a8b;
  --accent-secondary-dim:rgba(91,154,139,0.12);
  --accent-success:#5b9a6b;
  --accent-danger:#c45c4a;
  --panel-bg:rgba(28,31,36,0.97);
  /* ── Functional colors ── */
  --error:#e05252;
  --error-bg:rgba(224,82,82,0.12);
  --error-border:rgba(224,82,82,0.30);
  --success:#4a9a5b;
  --success-bg:rgba(74,154,91,0.12);
  --success-border:rgba(74,154,91,0.30);
  --warning:#d4883a;
  --warning-bg:rgba(212,136,58,0.12);
  --warning-border:rgba(212,136,58,0.30);
  --info:#5a8a9a;
  --info-bg:rgba(90,138,154,0.12);
  --info-border:rgba(90,138,154,0.30);
  /* ── Difficulty tiers ── */
  --diff-easy:#4a9a5b;--diff-medium:#5a8a9a;--diff-hard:#d4883a;--diff-expert:#c45c4a;--diff-master:#9a6abf;
  /* ── Conservation (IUCN) ── */
  --iucn-cr:#d44040;--iucn-en:#d47030;--iucn-vu:#c89a20;--iucn-nt:#7aaa30;--iucn-lc:#4a9a5b;
  /* ── Lineage badges ── */
  --lineage-human:#b07a3e;--lineage-human-bg:rgba(176,122,62,0.15);--lineage-human-border:rgba(176,122,62,0.35);
  --lineage-ape:#b05050;--lineage-ape-bg:rgba(176,80,80,0.12);--lineage-ape-border:rgba(176,80,80,0.30);
  /* ── Borders (warm tint) ── */
  --border:#332e28;
  --divider:#332e28;
  /* ── Typography ── */
  --font-head:'Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --font-display:'Inter',system-ui,sans-serif;
  --font-sans:'Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono','Fira Code',monospace;
  /* ── Elevation system ── */
  --shadow-1:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.08);
  --shadow-2:0 4px 12px rgba(0,0,0,0.15),0 2px 4px rgba(0,0,0,0.08);
  --shadow-3:0 8px 32px rgba(0,0,0,0.2),0 4px 8px rgba(0,0,0,0.1);
  /* ── Spacing scale ── */
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;
  /* ── Typography scale (≈1.2× minor-third ratio) ── */
  --text-2xs:0.625rem;--text-xs:0.75rem;--text-sm:0.8125rem;--text-base:0.9375rem;
  --text-md:1.0625rem;--text-lg:1.25rem;--text-xl:1.5rem;--text-2xl:1.875rem;--text-3xl:2.5rem;
  /* ── Line heights ── */
  --leading-tight:1.2;--leading-snug:1.3;--leading-normal:1.5;--leading-relaxed:1.65;
  /* ── Font weights ── */
  --font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;
  /* ── Letter spacing ── */
  --tracking-tight:-0.01em;--tracking-normal:0;--tracking-wide:0.04em;--tracking-wider:0.08em;--tracking-widest:0.12em;
  /* ── Animation ── */
  --ease-standard:cubic-bezier(0.2,0,0,1);
  --ease-decelerate:cubic-bezier(0,0,0,1);
  --duration-fast:150ms;--duration-normal:250ms;--duration-slow:400ms;
  --transition-fast:150ms cubic-bezier(0.2,0,0,1);
  --transition-normal:250ms cubic-bezier(0.2,0,0,1);
  /* ── Glassmorphism ── */
  --glass-bg:rgba(28,31,36,0.75);
  --glass-border:rgba(255,255,255,0.06);
  --glass-blur:blur(16px);
  /* ── Radius ── */
  --radius-sm:6px;
  --radius-md:10px;
  --radius-lg:14px;
  --radius-full:9999px;
  /* ── Z-index scale ── */
  --z-base:0;
  --z-tree:1;
  --z-controls:100;
  --z-nav:200;
  --z-search:300;
  --z-panel:400;
  --z-toast:500;
  --z-modal:1000;
  --z-overlay:1100;
  --z-splash:9999;
  --z-tour:10000;
  --z-tour-target:10001;
  --z-tour-content:10002;
  /* ── Tree Redesign ── */
  --tree-node-size:52px;
  --tree-node-size-mobile:44px;
  --tree-node-fill:#1a0f08;
  --tree-branch-brown:#8b6a3a;
  --tree-branch-brown-light:#c4a882;
  --tree-human-path:#c8883a;
  --tree-human-path-light:#a06a28;
  --tree-photo-opacity:0.93;
  --tree-photo-opacity-hover:1;
  --tree-sibling-dim:0.3;
  --tree-ghost-size:18px;
  --tree-label-name-size:var(--text-2xs);
  --tree-label-latin-size:0.5625rem;
  --tree-label-name-size-mobile:var(--text-2xs);
  --tree-label-latin-size-mobile:0.5rem;
  /* ── World map (Scientific Atlas) ── */
  --map-ocean:#0f1923;
  --map-land:#152030;
  --map-land-border:#2a4060;
  --map-grid:#1a2a3a;
  --map-highlight:#0d7377;
  --map-highlight-border:#15b3b8;
}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--parchment);}
body{font-family:var(--font-body);user-select:none;cursor:grab;}
body.dragging{cursor:grabbing;}