/* IVE — Brand Bible Tokens
 * Single source of truth for color, type, spacing.
 * The three audience treatments share a single core palette and type
 * system; only specific tokens swap between modes.
 */

:root {
  /* ── Core palette ───────────────────────────────────── */
  --ive-ink:        #13150E;   /* near-black, olive-tinted */
  --ive-ink-2:      #2A2D1F;   /* soft ink (body) */
  --ive-ink-3:      #4F5238;   /* muted ink (captions, lines) */
  --ive-rule:       #BFC0A4;   /* hairline rule on sage paper */
  --ive-rule-soft:  #D2D3B8;
  --ive-paper:      #EFEEDD;   /* primary warm-sage paper */
  --ive-paper-2:    #E8E6D2;   /* deeper sage */
  --ive-bone:       #DDD9C0;   /* bone-sage */
  --ive-card:       #F5F3E4;   /* lightest sage / card */
  --ive-white:      #FBFAEF;
  --ive-bw:         #FFFFFF;

  /* Signal accent — calibrated olive. Single hue, vary lightness. */
  --ive-ochre:      #6F7D3A;   /* signal — mid olive */
  --ive-ochre-deep: #4E5A23;
  --ive-ochre-soft: #AEB783;
  --ive-ochre-veil: rgba(111, 125, 58, 0.10);

  /* Mode-specific seconds */
  --ive-civic:      #1E2A1A;   /* civic dark forest */
  --ive-civic-soft: #4C5A44;
  --ive-field:      #3E5A35;   /* field-notes moss */
  --ive-field-soft: #7A9070;

  /* Verification status — muted, never saturated */
  --ive-verified:    #3F6B3A;
  --ive-contested:   #6F7D3A;
  --ive-disputed:    #9C3B2E;
  --ive-unsupported: #6E6E4E;
  --ive-opinion:     #4E5A6E;
  --ive-unverified:  #8E9382;

  /* ── Type ───────────────────────────────────────────── */
  --ive-serif: "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --ive-sans:  "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --ive-mono:  "Geist Mono", "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale (display set in major-third) */
  --ive-d1: 80px;
  --ive-d2: 56px;
  --ive-d3: 40px;
  --ive-d4: 28px;
  --ive-h1: 22px;
  --ive-h2: 17px;
  --ive-body: 14px;
  --ive-cap: 11px;
  --ive-micro: 9.5px;

  /* Spacing — 8pt with 4pt half-steps */
  --ive-s-1: 4px;
  --ive-s0:  8px;
  --ive-s1:  12px;
  --ive-s2:  16px;
  --ive-s3:  24px;
  --ive-s4:  32px;
  --ive-s5:  48px;
  --ive-s6:  64px;
  --ive-s7:  96px;

  /* Radii — restrained. Editorial = mostly square. */
  --ive-r0: 0px;
  --ive-r1: 2px;
  --ive-r2: 4px;
  --ive-r3: 8px;
}

/* Reusable utility shells used inside artboards */
.ive-board {
  position: absolute; inset: 0;
  background: var(--ive-paper);
  color: var(--ive-ink);
  font-family: var(--ive-sans);
  font-feature-settings: "ss01", "cv11";
  overflow: hidden;
}
.ive-board--dark {
  background: var(--ive-ink);
  color: var(--ive-paper);
}
.ive-board--card {
  background: var(--ive-card);
}
.ive-board--bone {
  background: var(--ive-bone);
}

.ive-serif { font-family: var(--ive-serif); font-weight: 400; letter-spacing: -0.01em; }
.ive-sans  { font-family: var(--ive-sans); }
.ive-mono  { font-family: var(--ive-mono); font-feature-settings: "ss03"; }

.ive-eyebrow {
  font-family: var(--ive-mono);
  font-size: var(--ive-cap);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ive-ink-3);
}
.ive-rule { height: 1px; background: var(--ive-rule); }
.ive-rule-thin { height: .5px; background: var(--ive-rule); }
.ive-hair { border: none; border-top: 1px solid var(--ive-rule); margin: 0; }

/* Artboard chrome — frame title in bottom-left, edition stamp, etc. */
.ive-artboard-tag {
  position: absolute;
  bottom: 16px; left: 20px;
  font-family: var(--ive-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ive-ink-3);
}
.ive-artboard-tag--dark { color: rgba(244,239,227,0.55); }

.ive-stamp {
  position: absolute; top: 16px; right: 20px;
  font-family: var(--ive-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ive-ink-3);
  display: flex; align-items: center; gap: 8px;
}
.ive-stamp--dark { color: rgba(244,239,227,0.55); }
.ive-stamp .dot {
  width: 6px; height: 6px; background: var(--ive-ochre); border-radius: 0;
}

/* Cartographic grid — used in Field Notes mode + some technical diagrams */
.ive-grid-cart {
  background-image:
    linear-gradient(to right, rgba(14,15,16,0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,15,16,0.05) 1px, transparent 1px);
  background-size: 24px 24px;
}
.ive-grid-cart-fine {
  background-image:
    linear-gradient(to right, rgba(14,15,16,0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,15,16,0.08) 1px, transparent 1px),
    linear-gradient(to right, rgba(14,15,16,0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,15,16,0.03) 1px, transparent 1px);
  background-size: 96px 96px, 96px 96px, 24px 24px, 24px 24px;
}
.ive-grid-dot {
  background-image: radial-gradient(rgba(14,15,16,0.15) 0.8px, transparent 0.8px);
  background-size: 12px 12px;
}

/* Crosshairs / corner ticks for the cartographic mode */
.ive-corner {
  position: absolute; width: 16px; height: 16px;
  border: 1px solid var(--ive-ink-3);
}
.ive-corner--tl { top: 12px; left: 12px; border-right: 0; border-bottom: 0; }
.ive-corner--tr { top: 12px; right: 12px; border-left: 0; border-bottom: 0; }
.ive-corner--bl { bottom: 12px; left: 12px; border-right: 0; border-top: 0; }
.ive-corner--br { bottom: 12px; right: 12px; border-left: 0; border-top: 0; }

/* IVE — typographic flourish */
.ive-mark {
  font-family: var(--ive-serif);
  font-weight: 300;
  letter-spacing: -0.02em;
  font-feature-settings: "ss02", "lnum";
}

/* Score chips */
.ive-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px;
  font-family: var(--ive-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid var(--ive-ink);
  color: var(--ive-ink);
  background: transparent;
}
.ive-chip .swatch {
  width: 6px; height: 6px; background: var(--ive-ink);
}