/* Hallmark · genre: modern-minimal · macrostructure: Workbench · theme: Cobalt
 * · enrichment: none (real product screenshots) · nav: N13 ⌘K pill · footer: Ft5 Statement
 * · pre-emit critique: P5 H5 E5 S5 R4 V5
 *
 * Cobalt axis values — paper: light (99%) · display: grotesk-sans (Space Grotesk)
 * · accent hue: cool (cobalt ~256°, aligned to the launcher's steel blue)
 *
 * Locked tokens. Every colour and font-family in style.css references a name
 * from this file; no inline oklch()/hex in the page layer.
 */

:root {
  color-scheme: light;

  /* ---------------------------- surfaces ---------------------------- */
  --color-paper: oklch(99.2% 0.002 250);
  --color-paper-2: oklch(97.4% 0.004 250);
  --color-paper-3: oklch(95.2% 0.006 252);

  /* ------------------------------- ink ------------------------------ */
  --color-ink: oklch(22% 0.02 258);
  --color-ink-2: oklch(38% 0.016 258);
  --color-muted: oklch(54% 0.014 258);

  /* ------------------------------ rules ----------------------------- */
  --color-rule: oklch(90.5% 0.006 258);
  --color-rule-strong: oklch(83% 0.008 258);
  --color-rule-ink: oklch(22% 0.02 258);

  /* ----------------------------- accent ----------------------------- */
  --color-accent: oklch(54% 0.17 256);
  --color-accent-hover: oklch(47% 0.18 256);
  --color-accent-soft: oklch(96.5% 0.022 256);
  --color-accent-ink: oklch(99.4% 0.004 256);

  /* --------------------------- semantics ---------------------------- */
  --color-focus: oklch(58% 0.19 256);
  --color-ok: oklch(56% 0.12 155);
  --color-ok-soft: oklch(96% 0.03 155);
  --color-warn: oklch(58% 0.13 75);
  --color-warn-soft: oklch(96.5% 0.035 75);
  --color-danger: oklch(56% 0.18 25);

  /* -------------------------- app icon tile ------------------------- */
  --icon-tile: #ffffff;
  --icon-stroke: #c9c4bb;
  --icon-mark: #186cce;

  /* --------------------------- overlays ----------------------------- */
  --overlay: oklch(22% 0.02 258 / 0.28);
  --shadow-card: 0 12px 40px oklch(12% 0.02 258 / 0.08);

  /* ----------------------------- fonts ------------------------------ */
  --font-display: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;


  /* ----------------------------- type scale ------------------------- */
  --text-display: clamp(2.5rem, 5vw + 0.5rem, 4.75rem);
  --text-display-s: clamp(2rem, 3.5vw + 0.5rem, 3.25rem);
  --text-3xl: clamp(1.5rem, 1.6vw + 1rem, 2rem);
  --text-2xl: clamp(1.25rem, 1vw + 0.9rem, 1.5rem);
  --text-xl: 1.125rem;
  --text-lg: 1.0625rem;
  --text-md: 0.9375rem;
  --text-sm: 0.875rem;
  --text-xs: 0.8125rem;
  --text-2xs: 0.75rem;

  --leading-display: 0.98;
  --leading-tight: 1.15;
  --leading-body: 1.6;
  --tracking-display: -0.03em;
  --tracking-tight: -0.015em;
  --tracking-caps: 0.08em;

  /* ---------------------------- spacing (4pt) ----------------------- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;
  --space-4xl: 9.5rem;

  /* ------------------------------ layout ---------------------------- */
  --page-max: 1180px;
  --page-gutter: clamp(1rem, 4vw, 1.75rem);
  --measure: 62ch;
  --measure-tight: 46ch;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  /* ------------------------------ rules ----------------------------- */
  --rule-hair: 1px;

  /* ------------------------------- motion --------------------------- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;

  /* ------------------------------- depth ---------------------------- */
  --shadow-pop: 0 18px 40px -28px oklch(22% 0.02 258 / 0.5);
  --shadow-nav: 0 8px 28px -18px oklch(22% 0.02 258 / 0.35);
}

/* Russian copy: Space Grotesk ships no Cyrillic glyphs, so the display face
 * falls through to Inter on Cyrillic runs. Letter-spacing eases off a touch
 * because Cyrillic lowercase fills more of the em. */
html[lang='ru'] {
  --font-display: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --tracking-display: -0.02em;
}

/* Dark theme — mirrors the launcher's dark tokens (src/renderer/src/assets/
 * main.css) so the site and the app feel like one product. The cobalt accent
 * reads on both; only the soft tint deepens. */
[data-theme='dark'] {
  color-scheme: dark;

  /* ---------------------------- surfaces ---------------------------- */
  --color-paper: #141311;
  --color-paper-2: #1d1b18;
  --color-paper-3: #282521;

  /* ------------------------------- ink ------------------------------ */
  --color-ink: #edeae4;
  --color-ink-2: #c9c5bd;
  --color-muted: #8f8a81;

  /* ------------------------------ rules ----------------------------- */
  --color-rule: #ffffff0f;
  --color-rule-strong: #ffffff1f;
  --color-rule-ink: #edeae4;

  /* ----------------------------- accent ----------------------------- */
  --color-accent-soft: oklch(54% 0.17 256 / 0.16);

  /* --------------------------- semantics ---------------------------- */
  --color-focus: oklch(62% 0.17 256);
  --color-ok: #69c98d;
  --color-ok-soft: #69c98d1f;
  --color-warn: #c9a35c;
  --color-warn-soft: #c9a35c1f;
  --color-danger: #e07a70;

  /* -------------------------- app icon tile ------------------------- */
  --icon-tile: #186cce;
  --icon-stroke: #ffffff2e;
  --icon-mark: #ffffff;

  /* --------------------------- overlays ----------------------------- */
  --overlay: oklch(0% 0 0 / 0.55);
  --shadow-card: 0 12px 40px oklch(0% 0 0 / 0.45);

  /* ------------------------------- depth ---------------------------- */
  --shadow-pop: 0 18px 40px -28px oklch(0% 0 0 / 0.6);
  --shadow-nav: 0 8px 28px -18px oklch(0% 0 0 / 0.5);
}