/* Extracted from Suplait/ruka_v3 83f27deac05465f695c4fea1edc432b5d3406a26; base palette retained; semantic roles use the Cassanova dark theme. */
/* =====================================================   Fonts (Avenir LT Pro · familia completa con 6 pesos + italics)
   ============================================================ */

/* Light 300 */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProLight.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProLightOblique.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

/* Book 400 */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProBook.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProBookOblique.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Roman 450 — peso intermedio (usado en body alterno) */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProRoman.otf') format('opentype');
  font-weight: 450;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProOblique.otf') format('opentype');
  font-weight: 450;
  font-style: italic;
  font-display: swap;
}

/* Medium 500 */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProMedium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProMediumOblique.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

/* Heavy 700 (semibold/bold fallback — Avenir LT Pro no tiene 600 real) */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProHeavy.otf') format('opentype');
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProHeavyOblique.otf') format('opentype');
  font-weight: 600 700;
  font-style: italic;
  font-display: swap;
}

/* Black 900 */
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProBlack.otf') format('opentype');
  font-weight: 800 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avenir LT Pro';
  src: url('AvenirLTProBlackOblique.otf') format('opentype');
  font-weight: 800 900;
  font-style: italic;
  font-display: swap;
}

/* =====================================================   Design tokens — Ruka.ai Design System
   ============================================================ */
:root {
  color-scheme: only dark;
  /* Base palette */
  --color-primary: #4e68eb;
  --color-primary-light: #7a90f0;
  --color-primary-dark: #3450cc;
  --color-primary-bg: #eef1fd;

  --color-secondary: #f9f9fb;

  --color-dark: #343a40;
  --color-dark-light: #4b5259;
  --color-dark-muted: #6c757d;

  --color-success: #00867a;
  --color-success-light: #00a896;
  --color-success-bg: #e6f5f4;

  --color-warning: #f1c40f;
  --color-warning-dark: #c9a40c;
  --color-warning-bg: #fef9e5;

  --color-danger: #cb1575;
  --color-danger-light: #e52a89;
  --color-danger-bg: #fce8f3;

  --color-white: #ffffff;
  --color-gray-50: #f9f9fb;
  --color-gray-100: #f0f0f4;
  --color-gray-200: #e0e0e8;
  --color-gray-300: #c8c8d4;
  --color-gray-400: #9898a8;
  --color-gray-500: #6c6c7e;
  --color-gray-600: #4b4b5a;
  --color-gray-700: #343a40;
  --color-gray-800: #22262a;
  --color-gray-900: #131519;

  /* Dark neutral palette — color-only contract for dark mode. */
  --dark-bg-base: #0B0F19;
  --dark-bg-subtle: #0E1522;
  --dark-surface-base: #111827;
  --dark-surface-raised: #172033;
  --dark-surface-high: #1C2540;

  --dark-text-primary: #E5E7EB;
  --dark-text-strong: #F8FAFC;
  --dark-text-secondary: #AAB4C3;
  --dark-text-muted: #7D89A0;
  --dark-text-disabled: #596579;

  --dark-border-subtle: #1B2638;
  --dark-border-base: #243044;
  --dark-border-strong: #334155;

  --dark-overlay-soft: rgba(0, 0, 0, 0.48);
  --dark-overlay-base: rgba(0, 0, 0, 0.64);
  --dark-overlay-strong: rgba(0, 0, 0, 0.78);

  --dark-neutral-hover: #172033;
  --dark-neutral-active: #1C2540;
  --dark-neutral-selected: #202B45;

  /* Semantic */
  --fg-strong: #f8fafc;
  --fg-primary: #e5e7eb;
  --fg-secondary: #bac3d1;
  --fg-muted: #b0bbcc;
  --fg-disabled: #7d89a0;
  --fg-inverse: var(--color-white);
  --fg-link: #b3c1ff;
  --fg-danger: #ffa2d3;
  --fg-success: #69c4bc;
  --fg-warning: #f4d978;
  --fg-primary-on-subtle: #b3c1ff;
  --fg-success-on-subtle: #80d8c9;
  --fg-warning-on-subtle: #f4d978;
  --fg-danger-on-subtle: #ffa2d3;

  --bg-page: #111827;
  --bg-subtle: #0e1522;
  --bg-surface: #172033;
  --bg-surface-alt: #1c2940;
  --bg-elevated: #172033;
  --bg-neutral-hover: var(--bg-surface-alt);
  --bg-neutral-active: #1c2940;
  --bg-neutral-selected: #263657;
  --bg-primary: var(--color-primary);
  --bg-primary-subtle: #202d50;
  --bg-success-subtle: #12332f;
  --bg-warning-subtle: #302913;
  --bg-danger-subtle: #351c32;
  --bg-overlay: rgba(0, 0, 0, 0.64);
  --bg-loader: rgba(17, 24, 39, 0.82);
  --border-loader: #36445b;

  --border-subtle: #2b374b;
  --border-default: #36445b;
  --border-strong: #66738a;
  --border-primary: #8fa5ff;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(52, 58, 64, 0.06);
  --shadow-sm: 0 1px 4px rgba(52, 58, 64, 0.08), 0 1px 2px rgba(52, 58, 64, 0.04);
  --shadow-md: 0 4px 12px rgba(52, 58, 64, 0.1), 0 1px 4px rgba(52, 58, 64, 0.06);
  --shadow-lg: 0 8px 24px rgba(52, 58, 64, 0.12), 0 2px 8px rgba(52, 58, 64, 0.06);
  --shadow-xl: 0 16px 40px rgba(52, 58, 64, 0.14), 0 4px 12px rgba(52, 58, 64, 0.08);

  /* Radius */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* Typography */
  --font-sans: 'Avenir LT Pro', 'Avenir', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-micro: 12px;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-md: 16px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 28px;
  --text-4xl: 32px;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-strong: 600;
  --font-weight-heading: 600;

  --leading-none: 1;
  --leading-tight: 1.2;
  --leading-snug: 1.35;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  --tracking-tight: 0em;
  --tracking-normal: 0em;
  --tracking-wide: 0.02em;
  --tracking-wider: 0.04em;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-normal: 220ms ease;
  --transition-slow: 350ms ease;
}