/* ============================================================================
   Tenovos brand tokens — VENDORED, not authored here.
   Source: https://tenovos.com/tenovos-brand-design.html, pulled 2026-08-06.
   Names and values are copied verbatim from that page's :root block, so a
   re-pull is a diff rather than a re-interpretation.

   THIS IS NOT tenovos-tokens.css, AND THEY DISAGREE. tenovos-tokens.css is the
   product design system from claude.ai/design, whose primary is #0033b3 and
   whose navy is #2b3762. The public brand is navy #1F2643 with blue #2E56A9.
   Both are real; they describe different surfaces. The rule here:

     - the LANDING page is brand-facing, so it uses these tokens
     - the EDITOR page is product chrome sitting inside CE.SDK's own light UI,
       so it stays on tenovos-tokens.css

   Do not "reconcile" them by editing values in either file. If the brand and
   the product palette genuinely converge, re-pull both.

   Deliberately a subset: colour, type ramp, spacing, radius, elevation. The
   50–950 shade scales are included only where this app uses them.

   Two substitutions the brand page assumes: Inter loads from Google Fonts here
   (the brand uses licensed Inter), and icons are Radix UI Icons inlined as SVG
   path data (MIT, viewBox 0 0 15 15) rather than a webfont, because this app
   has no bundler.
   ============================================================================ */

:root {
  /* ---- Primary ---- */
  --tnv-navy: #1F2643;
  --tnv-white: #FFFFFF;
  --tnv-offwhite: #F4F6FA;

  /* ---- Secondary ---- */
  --tnv-blue: #2E56A9;
  --tnv-highlight: #7AA5FF;
  --tnv-dark: #333333;

  /* ---- Shade scales (subset actually used) ---- */
  --tnv-navy-300: #6270AC;
  --tnv-navy-400: #3D497B;
  --tnv-navy-500: #1F2643;
  --tnv-navy-600: #1A2039;
  --tnv-navy-700: #151A2F;
  --tnv-navy-800: #101425;
  --tnv-navy-900: #0B0E1B;
  --tnv-navy-950: #090B16;

  --tnv-blue-400: #4B74C7;
  --tnv-blue-500: #2E56A9;
  --tnv-blue-600: #24458A;

  --tnv-hl-300: #B0C8F8;
  --tnv-hl-400: #96B7FB;
  --tnv-hl-500: #7AA5FF;
  --tnv-hl-600: #2D71FF;

  /* ---- Typography ----
     Weight 500 body / 800 headline is a brand rule, not a preference: the brand
     page states Light and Italic are never used. */
  --tnv-font: 'Inter', system-ui, -apple-system, sans-serif;
  --tnv-weight-body: 500;
  --tnv-weight-headline: 800;

  --tnv-h2-size: 48px;
  --tnv-h2-lh: 1.1;
  --tnv-h2-ls: -0.02em;
  --tnv-h3-size: 40px;
  --tnv-h3-lh: 1.15;
  --tnv-h3-ls: -0.015em;
  --tnv-h4-size: 28px;
  --tnv-h4-lh: 1.2;
  --tnv-h4-ls: -0.01em;
  --tnv-body-lg-size: 20px;
  --tnv-body-lg-lh: 1.6;
  --tnv-body-size: 16px;
  --tnv-body-lh: 1.65;
  --tnv-caption-size: 13px;
  --tnv-caption-lh: 1.5;
  --tnv-caption-ls: 0.04em;
  --tnv-micro-size: 11px;
  --tnv-micro-lh: 1.4;
  --tnv-micro-ls: 0.08em;

  /* ---- Spacing: 8-point grid. 4px is for micro/inline only. ---- */
  --tnv-space-4: 4px;
  --tnv-space-8: 8px;
  --tnv-space-16: 16px;
  --tnv-space-24: 24px;
  --tnv-space-32: 32px;
  --tnv-space-48: 48px;
  --tnv-space-64: 64px;
  --tnv-space-96: 96px;
  --tnv-space-128: 128px;

  /* ---- Radius ---- */
  --tnv-radius-sm: 6px;
  --tnv-radius-md: 10px;
  --tnv-radius-lg: 16px;
  --tnv-radius-full: 9999px;

  /* ---- Elevation ---- */
  --tnv-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
  --tnv-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.25);
  --tnv-shadow-glow: 0 0 40px rgba(122, 165, 255, 0.15);

  /* ---- Derived: the brand page's own dark application of the palette.
     Its surfaces run darker than raw Navy so Navy itself can be the raised
     surface; these are the values that page ships, kept under --tnv- names so
     it is obvious they are the brand's choices and not this app's. ---- */
  --tnv-surface-base: #07091a;
  --tnv-surface-1: #0e1124;
  --tnv-surface-2: #141830;
  --tnv-border: rgba(122, 165, 255, 0.1);
  --tnv-border-strong: rgba(122, 165, 255, 0.2);
  --tnv-text: rgba(255, 255, 255, 0.92);
  --tnv-text-muted: rgba(255, 255, 255, 0.62);
}