/* ==========================================================================
   VoriTools design tokens — direction A ("Editorial Terminal")
   One scale replaces the audit findings: 2189 ad-hoc hex values, 43 font
   sizes, 48 radii and 257 shadows measured across public/static/style/*.css.
   Loaded last so the existing sheets keep working underneath.
   ========================================================================== */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/static/fonts/instrument-sans-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/static/fonts/geist-mono-latin.woff2') format('woff2');
}

:root {
  /* ink & surface */
  --vt-ink: #0d1512;
  --vt-ink-2: #223229;
  --vt-ink-3: #5b6b62;
  --vt-line: #d8e2dc;
  --vt-line-strong: #c2d0c7;
  --vt-surface: #ffffff;
  --vt-surface-2: #f5f9f6;
  --vt-surface-3: #e9f1ec;

  /* one accent, three steps */
  --vt-accent: #0b7a4b;
  --vt-accent-hi: #12a065;
  --vt-accent-ink: #054a2e;
  --vt-accent-wash: #e7f5ee;

  /* type */
  --vt-display: 'Instrument Sans', -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --vt-text: 'Instrument Sans', -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --vt-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --vt-xs: 12px;
  --vt-sm: 13px;
  --vt-md: 15px;
  --vt-lg: 18px;
  --vt-xl: 22px;
  --vt-2xl: 28px;
  --vt-3xl: 36px;
  --vt-4xl: 48px;

  /* space (4px base) */
  --vt-1: 4px;  --vt-2: 8px;  --vt-3: 12px; --vt-4: 16px;
  --vt-5: 24px; --vt-6: 32px; --vt-7: 48px; --vt-8: 72px;

  /* radius: three */
  --vt-r-sm: 8px; --vt-r-lg: 16px; --vt-r-pill: 999px;

  /* elevation: two */
  --vt-shadow-1: 0 1px 2px rgba(13, 21, 18, .06), 0 1px 1px rgba(13, 21, 18, .04);
  --vt-shadow-2: 0 18px 40px -24px rgba(13, 21, 18, .35);
}

/* The token layer also retires the Bootstrap/Menlo/Helvetica mix measured on
 * the live pages: one text face, one mono face, everywhere.  The locale sheet
 * sets `html[data-kiv-locale] body, button, input, select, textarea`, so the
 * face has to be re-declared at the same specificity. */
html[data-kiv-locale] body,
html[data-kiv-locale] button,
html[data-kiv-locale] input,
html[data-kiv-locale] select,
html[data-kiv-locale] textarea,
html body {
  font-family: var(--vt-text);
}
html body {
  color: var(--vt-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
html body code, html body kbd, html body pre, html body samp,
html body .kiv-home-featured-eyebrow, html body .kiv-home-catalog-eyebrow,
html body .kiv-home-featured-tag, html body .kiv-nav-count,
html body .kiv-catalog-count, html body .kiv-home-catalog-total {
  font-family: var(--vt-mono);
}

/* The catalog colour-coded its tool tiles with thirteen hues (teal #218978,
 * navy #4e769c, olive #718847, purple #7663a0 …).  Direction A keeps the
 * category label for scanning and gives every tile the same accent. */
html body [class^="kiv-icon-"],
html body [class*=" kiv-icon-"] {
  border-color: var(--vt-line) !important;
  background: var(--vt-accent-wash) !important;
  color: var(--vt-accent-ink) !important;
}

/* Dark mode.  The site already ships a dark shell (html.kiv-shell-dark, body
 * #1b2630) so the tokens only re-point to that navy family instead of
 * inventing a palette the rest of the pages would fight. */
html.kiv-shell-dark {
  --vt-ink: #e9eff5;
  --vt-ink-2: #c3cfdb;
  --vt-ink-3: #8fa1b2;
  --vt-line: #2a3946;
  --vt-line-strong: #35485a;
  --vt-surface: #141d26;
  --vt-surface-2: #18222c;
  --vt-surface-3: #1e2a35;
  --vt-accent: #35c98a;
  --vt-accent-hi: #4ede9c;
  --vt-accent-ink: #bdf0d7;
  --vt-accent-wash: #142c26;
  --vt-shadow-1: 0 1px 2px rgba(0, 0, 0, .55);
  --vt-shadow-2: 0 18px 40px -24px rgba(0, 0, 0, .9);
}
