/* ══════════════════════════════════════════════════════════════════════
   GNOSIS · brand stylesheet
   Single source of truth for fonts, color tokens, and base type styles.
   Loaded by /map, /ontology.html, /brand.html. Scoped tokens use the
   --gn- prefix so they don't collide with legacy --accent/--bg variables.
   ══════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Stencil+Display:wght@500;700;800&family=Geist+Mono:wght@300;400;500;600;700&display=swap');

:root {
  /* ── Surfaces ────────────────────────────────────────────────────── */
  --gn-ink:           #0a0d12;   /* deepest field — page background */
  --gn-ink-2:         #0d1219;   /* primary panel */
  --gn-ink-3:         #11161e;   /* elevated panel / hover surface */
  --gn-rule:          #1d2531;   /* hairline separator */
  --gn-rule-strong:   #2a3445;   /* container / panel border */

  /* ── Foreground text ─────────────────────────────────────────────── */
  --gn-paper:         #c9c8c2;   /* default body — slightly warm parchment */
  --gn-paper-bright:  #e9e7df;   /* headings, primary data values */
  --gn-paper-dim:     #5a6470;   /* labels, secondary metadata */
  --gn-paper-faint:   #3a4250;   /* tertiary scaffolding (rules, marks) */

  /* ── Signals ─────────────────────────────────────────────────────── */
  /* Amber is the dominant signal — selection, focus, primary action.
     Phosphor green = live/healthy. Blood-orange = alert/blocked.
     Cyan is reserved for secondary info / hyperlinks only. */
  --gn-amber:         #f59e0b;
  --gn-amber-soft:    rgba(245, 158, 11, 0.12);
  --gn-amber-glow:    rgba(245, 158, 11, 0.45);
  --gn-live:          #84cc16;
  --gn-live-soft:     rgba(132, 204, 22, 0.14);
  --gn-alert:         #ea580c;
  --gn-alert-soft:    rgba(234, 88, 12, 0.14);
  --gn-info:          #38bdf8;
  --gn-info-soft:     rgba(56, 189, 248, 0.12);

  /* ── Domain swatches (used by ontology palette) ──────────────────── */
  --gn-domain-crm:        #38bdf8;
  --gn-domain-directory:  #a78bfa;
  --gn-domain-production: #8b5cf6;
  --gn-domain-logistics:  #f59e0b;
  --gn-domain-docs:       #6366f1;
  --gn-domain-comms:      #84cc16;
  --gn-domain-catalog:    #06b6d4;
  --gn-domain-geo:        #7c3aed;

  /* ── Type stack ──────────────────────────────────────────────────── */
  --gn-display:  'Big Shoulders Stencil Display', 'IBM Plex Sans Condensed',
                  ui-sans-serif, system-ui, sans-serif;
  --gn-mono:     'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* ── Type ramp (in px so they fit the dense layout) ─────────────── */
  --gn-fs-display-xl: 64px;
  --gn-fs-display-lg: 36px;
  --gn-fs-display-md: 22px;
  --gn-fs-display-sm: 14px;
  --gn-fs-data-lg: 14px;
  --gn-fs-data-md: 12px;
  --gn-fs-data-sm: 11px;
  --gn-fs-data-xs: 10px;
  --gn-fs-micro:    9px;

  /* ── Letter spacing — tight in display, slightly opened in micro ─ */
  --gn-ls-display: 0.04em;
  --gn-ls-tactical: 0.18em;   /* ALL-CAPS section labels */
  --gn-ls-data:    0.02em;
  --gn-ls-micro:   0.06em;
}

/* ── Base classes (use selectively; not a global reset) ──────────── */
.gn-display       { font-family: var(--gn-display); letter-spacing: var(--gn-ls-display); font-weight: 700; }
.gn-display-bold  { font-family: var(--gn-display); letter-spacing: var(--gn-ls-display); font-weight: 800; }
.gn-tactical      { font-family: var(--gn-display); font-weight: 700; letter-spacing: var(--gn-ls-tactical); text-transform: uppercase; }
.gn-mono          { font-family: var(--gn-mono); letter-spacing: var(--gn-ls-data); }
.gn-mono-light    { font-family: var(--gn-mono); font-weight: 300; }

.gn-wordmark {
  font-family: var(--gn-display);
  font-weight: 800;
  letter-spacing: 0.06em;
  font-size: var(--gn-fs-display-md);
  color: var(--gn-paper-bright);
  text-transform: uppercase;
}
.gn-wordmark .gn-dot {
  display: inline-block;
  width: 0.32em;
  height: 0.32em;
  background: var(--gn-amber);
  margin-left: 0.1em;
  vertical-align: 0.05em;
  box-shadow: 0 0 6px var(--gn-amber-glow);
}

/* ── Brand icon defaults — pulls from sprite injected by brand_icons.js */
.gn-icon {
  display: inline-block;
  vertical-align: -0.18em;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: square;
  stroke-linejoin: miter;
}
.gn-icon-amber { color: var(--gn-amber); }
.gn-icon-live  { color: var(--gn-live); }
.gn-icon-alert { color: var(--gn-alert); }
.gn-icon-dim   { color: var(--gn-paper-dim); }