/**
 * OQILA AI — Design Tokens
 * Source: docs/design-tokens.json v1.0
 * Do not invent values — change JSON (with founder approval) then sync here.
 */

:root {
  /* Raw color */
  --oq-night: #1B2A4A;
  --oq-indigo: #2F4A7A;
  --oq-sky: #7FA3C9;
  --oq-gold: #C4A35A;
  --oq-ivory: #F7F1E8;
  --oq-sand: #EFE6D8;
  --oq-ink: #1A1A1A;
  --oq-muted: #5C6570;
  --oq-line: #D9D0C3;
  --oq-pomegranate: #9B3B3B;
  --oq-sage: #6E8B7A;
  --oq-success: #3F6F5A;
  --oq-warning: #B7843C;
  --oq-danger: #8E2F2F;
  --oq-white: #FFFFFF;
  --oq-salomatlik: #C48B82;

  /* Semantic */
  --oq-bg: var(--oq-ivory);
  --oq-surface: var(--oq-white);
  --oq-surface-muted: var(--oq-sand);
  --oq-text: var(--oq-ink);
  --oq-text-muted: var(--oq-muted);
  --oq-border: var(--oq-line);
  --oq-brand: var(--oq-indigo);
  --oq-brand-strong: var(--oq-night);
  --oq-accent: var(--oq-gold);
  --oq-focus: var(--oq-indigo);

  /* Pillar tints */
  --oq-pillar-bilim: var(--oq-indigo);
  --oq-pillar-ruhiyat: var(--oq-sage);
  --oq-pillar-salomatlik: var(--oq-salomatlik);
  --oq-pillar-oila: var(--oq-gold);
  --oq-pillar-ustoz: var(--oq-night);
  --oq-pillar-madaniyat: var(--oq-gold);

  /* Typography */
  --oq-font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --oq-font-body: Manrope, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --oq-weight-regular: 400;
  --oq-weight-medium: 500;
  --oq-weight-semibold: 600;
  --oq-weight-bold: 700;

  --oq-text-hero: clamp(2.5rem, 5vw, 4rem);
  --oq-text-h1: clamp(2rem, 3vw, 2.75rem);
  --oq-text-h2: 1.75rem;
  --oq-text-h3: 1.35rem;
  --oq-text-body: 1.0625rem;
  --oq-text-small: 0.925rem;
  --oq-text-micro: 0.8rem;
  --oq-measure-prose: 68ch;

  /* Space */
  --oq-space-1: 4px;
  --oq-space-2: 8px;
  --oq-space-3: 12px;
  --oq-space-4: 16px;
  --oq-space-5: 24px;
  --oq-space-6: 32px;
  --oq-space-7: 48px;
  --oq-space-8: 64px;
  --oq-space-9: 96px;

  --oq-page-px-xs: 16px;
  --oq-page-px-sm: 20px;
  --oq-page-px-md: 32px;
  --oq-page-px-lg: 40px;

  --oq-section-y-sm: 32px;
  --oq-section-y-md: 48px;
  --oq-section-y-lg: 64px;
  --oq-section-y-xl: 96px;

  /* Radius / shadow */
  --oq-radius-s: 8px;
  --oq-radius-m: 14px;
  --oq-radius-l: 22px;
  --oq-radius-full: 999px;

  --oq-shadow-soft: 0 8px 28px rgba(27, 42, 74, 0.08);
  --oq-shadow-lift: 0 14px 40px rgba(27, 42, 74, 0.12);

  /* Motion */
  --oq-motion-fast: 120ms;
  --oq-motion-base: 200ms;
  --oq-motion-enter: 280ms;
  --oq-motion-room: 400ms;
  --oq-motion-ritual: 600ms;
  --oq-motion-breath: 4.5s;

  --oq-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --oq-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --oq-ease-ritual: cubic-bezier(0.45, 0, 0.2, 1);

  /* Layout */
  --oq-max-content: 1200px;
  --oq-max-auth: 420px;
  --oq-max-prose: 68ch;
  --oq-bp-sm: 576px;
  --oq-bp-md: 768px;
  --oq-bp-lg: 992px;
  --oq-bp-xl: 1200px;
  --oq-bp-xxl: 1400px;
  --oq-touch-min: 44px;

  --oq-z-base: 1;
  --oq-z-sticky: 100;
  --oq-z-drawer: 200;
  --oq-z-modal: 300;
  --oq-z-toast: 400;
  --oq-z-crisis: 500;

  --oq-opacity-motif: 0.14;
  --oq-opacity-scrim: 0.48;
  --oq-opacity-disabled: 0.48;

  /* Components */
  --oq-btn-h-sm: 40px;
  --oq-btn-h-md: 44px;
  --oq-btn-h-lg: 52px;
  --oq-btn-px: 20px;
  --oq-door-min-h: 140px;
  --oq-door-p: 24px;
  --oq-guide-avatar-sm: 40px;
  --oq-guide-avatar-md: 96px;
  --oq-guide-hero-max: 560px;
  --oq-input-h: 48px;
}