/* Product-level semantic tokens. Loaded before every surface stylesheet; surfaces consume
   these tokens instead of declaring their own font stacks or Product values. */

/* Satoshi (Indian Type Foundry, ITF Free Font License; see public/fonts/Satoshi-FFL.txt).
   Self-hosted, unmodified official variable files; no third-party request at runtime. */
@font-face {
  font-family: Satoshi;
  src: url('/fonts/Satoshi-Variable.woff2') format('woff2');
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Satoshi;
  src: url('/fonts/Satoshi-VariableItalic.woff2') format('woff2');
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
}

:root {
  /* Typography */
  --oiq-font-sans: Satoshi, "Avenir Next", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --oiq-font-mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  --oiq-text-xs: 11px;
  --oiq-text-sm: 12px;
  --oiq-text-md: 13px;
  --oiq-text-base: 14px;
  --oiq-text-body: 15px;

  /* Ink on light surfaces */
  --oiq-ink: #17323b;
  --oiq-ink-secondary: #405b63;
  --oiq-ink-muted: #557078;
  --oiq-ink-subtle: #60777e;

  /* Surfaces and borders (the accepted Knowledge shell hierarchy) */
  --oiq-canvas: #f4f8f8;
  --oiq-surface: #fff;
  --oiq-surface-sunken: #eef5f5;
  --oiq-surface-hover: #dceaea;
  --oiq-border: #dbe7e9;
  --oiq-border-strong: #cfdee0;

  /* Accent and interaction states */
  --oiq-accent: #087f83;
  --oiq-accent-strong: #075e69;
  --oiq-accent-soft: #d7eaeb;
  --oiq-accent-wash: #edf6f6;
  --oiq-focus-ring: 2px solid var(--oiq-accent);
  --oiq-focus-offset: 2px;
  --oiq-warning-ink: #865f1a;
  --oiq-warning-wash: #fbf2df;
  --oiq-danger-ink: #9b3025;
  --oiq-danger-wash: #fff6f5;
  --oiq-danger-border: #fda29b;

  /* Product header: the stable dark anchor, never recoloured per Workspace */
  --oiq-header-bg: #092f3b;
  --oiq-header-ink: #fff;
  --oiq-header-ink-muted: #c5dce0;
  --oiq-header-hover: #164955;
  --oiq-header-control: #164f5b;
  --oiq-header-accent: #65d9d5;
  --oiq-header-focus-ring: 2px solid var(--oiq-header-accent);

  /* Shape, size, spacing, elevation */
  --oiq-radius-sm: 6px;
  --oiq-radius-md: 8px;
  --oiq-radius-lg: 12px;
  --oiq-radius-pill: 999px;
  --oiq-target: 44px;
  --oiq-target-compact: 36px;
  --oiq-space-1: 4px;
  --oiq-space-2: 8px;
  --oiq-space-3: 12px;
  --oiq-space-4: 16px;
  --oiq-space-5: 24px;
  --oiq-shadow-popover: 0 18px 40px #10282829;
}

/* Workspace theme tokens (--theme-primary, --theme-primary-soft, --theme-accent, --theme-surface,
   --theme-border, --theme-heading, --theme-muted) are declared per [data-theme] key in styles.css.
   They are Workspace-local accents for Knowledge Workspace content and chrome only. The Product
   header, Work, Management and Account surfaces use the Product tokens above and never consume them.

   Responsive bands used by Product surfaces (media queries cannot read custom properties):
   phone ≤600px, compact ≤760px (mobile drawers), tablet ≤1023/1080px, narrow phone ≤360px. */