@font-face { font-family: "Inter"; src: url("../assets/brand-v2/fonts/Inter-Variable.ttf") format("truetype"); font-style: normal; font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Rajdhani"; src: url("../assets/brand-v2/fonts/Rajdhani-SemiBold.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Rajdhani"; src: url("../assets/brand-v2/fonts/Rajdhani-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }

:root {
  color-scheme: dark;
  --color-canvas: #060805;
  --color-canvas-soft: #0a0f08;
  --color-surface: #10170d;
  --color-surface-raised: #172014;
  --color-surface-hover: #202b1b;
  --color-border: rgba(207, 239, 145, .14);
  --color-border-strong: rgba(207, 239, 145, .28);
  --color-text: #f5f8ef;
  --color-text-muted: #b6c0a7;
  --color-accent: #97c51b;
  --color-accent-strong: #c7ed4d;
  --color-accent-ink: #111900;
  --color-focus: rgba(151, 197, 27, .62);
  --color-danger: #ff7d90;
  --font-family-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-family-heading: Rajdhani, Inter, ui-sans-serif, system-ui, sans-serif;
  --page-x: clamp(16px, 4.5vw, 32px);
  --content-max: 1180px;
  --header-height: 62px;
  --nav-height: 72px;
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --shadow-card: 0 18px 44px rgba(0, 0, 0, .24);
  --motion-ease-out: cubic-bezier(.22, 1, .36, 1);
  --motion-fast: 160ms;
  --motion-standard: 220ms;
  /* Compatibility aliases for the host shell. */
  --surface: var(--color-canvas);
  --surface-card: var(--color-surface);
  --surface-soft: var(--color-canvas-soft);
  --surface-muted: var(--color-surface-raised);
  --surface-accent: rgba(151, 197, 27, .12);
  --ink: var(--color-text);
  --ink-soft: var(--color-text-muted);
  --blue: var(--color-accent);
  --blue-dark: var(--color-accent-strong);
  --green: var(--color-accent);
  --green-dark: var(--color-accent-strong);
  --border: var(--color-border);
  --border-strong: var(--color-border-strong);
  --on-primary: var(--color-accent-ink);
  --focus-ring: var(--color-focus);
  --ease-out: var(--motion-ease-out);
}

html, html[data-theme="dark"] { color-scheme: dark; }