/* ============================================================
   DREVMARK — SHARED BASE STYLES
   Common reset, colour tokens, and nav/logo/empty-state rules
   used across the site's pages. Load this before each page's
   own <style> block so page-specific rules can still override
   where a page genuinely differs (e.g. nav height/padding,
   link colour weight).
   Layout, card grids and other page-specific rules stay local.
   ============================================================ */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

:root {
  --bg:     #0c0c0e;
  --line:   rgba(255,255,255,.07);
  --accent: #d4863a;
}

a, button { cursor: pointer; }

/* ── Logo — identical markup + styling on every page ── */
.nav-logo{display:flex;flex-direction:column;gap:4px;text-decoration:none}
.nav-logo-text{font-family:'Playfair Display',serif;font-style:normal;font-size:24px;font-weight:400;color:rgba(255,255,255,.95);letter-spacing:.01em;line-height:1}
.nav-logo-sub{font-family:'JetBrains Mono',monospace;font-size:7px;font-weight:300;letter-spacing:.32em;color:var(--accent);text-transform:uppercase;opacity:.85}

/* ── Nav hamburger — base look; each page sets its own margin-left ── */
.nav-hamburger{
  display:none;
  background:none;border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.55);
  font-size:8px;letter-spacing:.14em;
  padding:5px 11px;cursor:pointer;
}

/* ── Description / body copy — capped to a readable measure.
   ch is relative to each element's own font-size, so one rule
   holds ~65-75ch everywhere despite the pages using different
   type scales. Narrower page-specific max-widths (e.g. fidx-desc)
   already read fine and are left as-is. ── */
.hero-sub, .card-desc, .card-body, .cta-desc, .hero-descriptor {
  max-width: 70ch;
}

/* ── Prose — sentence-length explanatory text (drawer copy, disclaimers,
   hero sub-taglines): a third typeface distinct from Playfair Display
   (headlines) and JetBrains Mono (labels/badges/dates/category tags,
   which stay mono — this rule is never meant to touch those).
   Inter's x-height reads noticeably smaller than JetBrains Mono at an
   equal px value, so instances don't reuse their old mono font-size —
   each sets --prose-size to a value re-tuned for comfortable reading. ── */
.prose{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:var(--prose-size, 13px);
  line-height:1.7;
  letter-spacing:normal;
}

/* ── Empty-state placeholder box — dashed border, used when a page
   has no data yet (originally accuracy.html's "Not enough data yet"). ── */
.empty-box{
  text-align:center;padding:70px 20px;
  border:1px dashed rgba(255,255,255,.1);
  max-width:560px;margin:0 auto;
}
.empty-box-title{
  font-family:'Playfair Display',serif;font-style:italic;
  font-size:19px;color:rgba(255,255,255,.8);margin-bottom:12px;
}
.empty-box-sub{
  font-size:9.5px;line-height:1.9;letter-spacing:.05em;
  color:rgba(255,255,255,.35);font-family:'JetBrains Mono',monospace;
}