/* Specimen pages — same tokens as website/index.html */
:root{
  --ink:        oklch(19% 0.02  55);
  --ink-soft:   oklch(38% 0.02  55);
  --paper:      oklch(96% 0.012 75);
  --paper-2:    oklch(92% 0.016 70);
  --line:       oklch(80% 0.02  60);
  --rust:       oklch(48% 0.13  35);
  --rust-dim:   oklch(48% 0.13  35 / 0.12);
  --ochre:      oklch(72% 0.11  75);
  --bone:       oklch(98% 0.006 80);
  --dark:       oklch(16% 0.015 50);
  --pin:        #e0452b;
  --ev:         oklch(50% 0.11 150);   /* evidence  */
  --hy:         oklch(58% 0.13  70);   /* hypothesis */
  --un:         oklch(52% 0.03 260);   /* unknown   */
  --max: 72rem;
  --serif: Palatino,'Palatino Linotype','Iowan Old Style','URW Palladio L',P052,Georgia,serif;
  --sans: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono: ui-monospace,'SF Mono','Cascadia Code','Roboto Mono',Menlo,Consolas,monospace;
  color-scheme: light;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:var(--serif);
      font-size:18px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration-color:var(--rust); text-underline-offset:.18em; }
a:hover{ color:var(--rust); }
h1,h2,h3{ margin:0; line-height:1.1; }
h1{ font-size:clamp(2.2rem,4.1vw,4.8rem); overflow-wrap:break-word; font-weight:300; letter-spacing:-.015em; }
h1 i{ font-weight:700; }
h2{ font-size:clamp(1.7rem,4vw,2.5rem); font-weight:300; margin-bottom:1rem; }
h2 b{ font-weight:800; }
h3{ font-size:1.1rem; font-weight:700; margin:0 0 .4rem; }
p{ margin:0 0 1rem; max-width:68ch; }
.wrap{ max-width:var(--max); margin-inline:auto; padding-inline:16px; }
@media (min-width:768px){ .wrap{ padding-inline:3rem; } }
section{ padding-block:clamp(2.5rem,7vw,5rem); border-top:1px solid var(--line); }
.tag{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--rust); margin:0 0 .8rem; }
.soft{ color:var(--ink-soft); }
.small{ font-size:.85rem; }
.lede{ font-size:clamp(1.1rem,2.2vw,1.3rem); color:var(--ink-soft); max-width:46ch; }

header.site{ position:sticky; top:0; z-index:20; background:color-mix(in oklch,var(--paper) 90%,transparent);
  backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
header.site .wrap{ display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-block:.8rem; }
.brand{ font-weight:800; text-decoration:none; }
.brand em{ font-style:normal; color:var(--rust); }
header.site nav{ display:flex; gap:1rem; font-family:var(--sans); font-size:.85rem; overflow-x:auto; }
header.site nav a{ text-decoration:none; white-space:nowrap; }

/* hero */
.hero{ border-top:0; }
.hero-grid{ display:grid; gap:2rem; align-items:center; }
@media (min-width:900px){ .hero-grid{ grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); } }
.say{ font-family:var(--sans); font-size:.9rem; color:var(--ink-soft); margin-top:.6rem; }
.bone-card{ background:var(--bone); border:1px solid var(--line); border-radius:4px; overflow:hidden; }
.bone-card .stage{ height:min(60vh,420px); }
.bone-card figcaption{ padding:.9rem 1rem; font-family:var(--sans); font-size:.85rem; color:var(--ink-soft); border-top:1px solid var(--line); }
.bone-card figcaption b{ color:var(--ink); }

/* fact strip */
.facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:1px; background:var(--line);
  border:1px solid var(--line); margin-top:2.5rem; }
.facts div{ background:var(--paper); padding:1rem 1.1rem; }
.facts dt{ font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
.facts dd{ margin:.25rem 0 0; font-size:1.25rem; font-weight:700; line-height:1.25; }
.facts dd small{ display:block; font-size:.8rem; font-weight:400; color:var(--ink-soft); font-family:var(--sans); margin-top:.2rem; }

/* timeline */
.timeline{ width:100%; height:auto; display:block; margin-top:1rem; font-family:var(--sans); }
.timeline text{ font-size:11px; fill:var(--ink-soft); }
.timeline .big{ font-size:13px; font-weight:700; fill:var(--ink); }

/* globes */
.globes{ display:grid; gap:1.5rem; margin-top:1.5rem; }
@media (min-width:860px){ .globes{ grid-template-columns:1fr 1fr; } }
.globe-card{ background:var(--dark); color:var(--bone); border-radius:4px; overflow:hidden; }
.globe-card .stage{ height:min(72vw,420px); cursor:grab; }
.globe-card figcaption{ padding:.9rem 1rem; font-family:var(--sans); font-size:.85rem; color:oklch(85% 0.01 70); }
.globe-card figcaption b{ color:var(--bone); }

/* 3d stages */
.stage{ position:relative; width:100%; touch-action:none; }
.stage canvas{ display:block; width:100%; height:100%; }
.labels{ position:absolute; inset:0; pointer-events:none; }
.pin3d,.tag3d,.hl3d,.tick3d,.dim3d{ font-family:var(--sans); white-space:nowrap; }
.pin3d{ font-size:.72rem; color:#fff; background:oklch(20% 0.02 50 / .75); padding:.1rem .4rem; border-radius:2px; transform:translateY(-60%); }
.tag3d{ font-size:.75rem; color:var(--ink); background:oklch(98% 0.006 80 / .85); padding:.1rem .4rem; border-radius:2px; }
.hl3d{ font-size:.75rem; font-weight:700; color:#fff; background:var(--pin); padding:.15rem .45rem; border-radius:2px; }
.tick3d{ font-size:.68rem; color:var(--ink-soft); }
.dim3d{ font-size:.75rem; font-weight:700; color:var(--rust); background:oklch(96% 0.012 75 / .85); padding:0 .3rem; }
.err{ position:absolute; inset:auto 1rem 1rem; font-family:var(--sans); font-size:.85rem; color:var(--rust); }

.viewer{ border:1px solid var(--line); background:linear-gradient(var(--bone),var(--paper-2)); border-radius:4px; overflow:hidden; margin-top:1.5rem; }
.viewer .stage{ height:min(75vh,560px); }
.controls{ display:flex; flex-wrap:wrap; gap:.5rem; padding:.75rem; border-bottom:1px solid var(--line); background:var(--bone); font-family:var(--sans); }
.controls button{ font:inherit; font-size:.85rem; font-weight:600; border:1px solid var(--ink); background:transparent; color:var(--ink);
  padding:.45rem .9rem; border-radius:2px; cursor:pointer; min-height:44px; }
.controls button[aria-pressed="true"]{ background:var(--ink); color:var(--paper); }
.controls button:hover{ border-color:var(--rust); }
.controls button:focus-visible{ outline:2px solid var(--rust); outline-offset:2px; }
.controls .hint{ margin-left:auto; align-self:center; font-size:.78rem; color:var(--ink-soft); }
.viewer-note{ font-family:var(--sans); font-size:.82rem; color:var(--ink-soft); padding:.75rem 1rem; border-top:1px solid var(--line); background:var(--bone); margin:0; max-width:none; }

/* found / missing */
.two{ display:grid; gap:2rem; }
@media (min-width:860px){ .two{ grid-template-columns:1fr 1fr; } }
.boxed{ background:var(--bone); border:1px solid var(--line); padding:1.2rem 1.3rem; border-radius:4px; }
.boxed ul{ margin:.4rem 0 0; padding-left:1.1rem; }
.boxed li{ margin-bottom:.35rem; }
.column{ width:100%; height:auto; display:block; margin-top:1rem; font-family:var(--sans); }
.column text{ font-size:11px; fill:var(--ink-soft); }

/* evidence ledger */
.legend{ display:flex; flex-wrap:wrap; gap:1rem 1.5rem; font-family:var(--sans); font-size:.85rem; margin:1rem 0 1.5rem; }
.badge{ display:inline-block; font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
  color:#fff; padding:.15rem .45rem; border-radius:2px; vertical-align:.12em; }
.badge.ev{ background:var(--ev); } .badge.hy{ background:var(--hy); } .badge.un{ background:var(--un); }
.claims{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); }
.claim{ background:var(--paper); padding:1.1rem 1.2rem; display:grid; gap:.4rem; }
@media (min-width:860px){ .claim{ grid-template-columns:9.5rem 1fr; gap:1.5rem; } }
.claim h3{ font-size:1.05rem; }
.claim p{ margin:0 0 .5rem; }
.claim .src{ font-family:var(--sans); font-size:.78rem; color:var(--ink-soft); }
.claim .src a{ color:var(--ink-soft); }

/* weight table */
table{ border-collapse:collapse; width:100%; font-family:var(--sans); font-size:.88rem; margin-top:1rem; }
th,td{ text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
th{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; }
td.n{ font-variant-numeric:tabular-nums; white-space:nowrap; font-weight:700; }
.scroll-x{ overflow-x:auto; }
.massbar{ width:100%; height:auto; display:block; margin-top:1.2rem; font-family:var(--sans); }
.massbar text{ font-size:11px; fill:var(--ink-soft); }

/* credits */
.credits li{ margin-bottom:.6rem; font-size:.92rem; }
.refs{ font-family:var(--sans); font-size:.8rem; color:var(--ink-soft); columns:2 26rem; column-gap:2.5rem; padding-left:1.2rem; }
.refs li{ margin-bottom:.45rem; break-inside:avoid; }
footer{ padding-block:2rem 3rem; font-family:var(--sans); font-size:.8rem; color:var(--ink-soft); border-top:1px solid var(--line); }