/* Lumen — tokens. GENERADO desde tokens.json con lumen/scripts/build-tokens.js: no editar a mano. */

:root {
  color-scheme: light;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", Geist, "Helvetica Neue", system-ui, sans-serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", Geist, "Helvetica Neue", system-ui, sans-serif;
  --font-mono: "SF Mono", "Geist Mono", ui-monospace, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-xl: 28px;
  --radius-pill: 980px;
  --blur-glass: saturate(180%) blur(20px);
  --surface: #f5f5f7;
  --surface-raised: #ffffff;
  --fill: #e8e8ed;
  --fill-hover: #dcdce1;
  --fill-selected: #ffffff;
  --ink: #1d1d1f;
  --ink-muted: #6e6e73;
  --line: #0000001a;
  --line-strong: #86868b;
  --accent: #0071e3;
  --accent-hover: #0062c4;
  --on-accent: #ffffff;
  --accent-text: #0066cc;
  --accent-soft: #e8f2fd;
  --focus-ring: #0071e3;
  --focus-glow: #0071e340;
  --success: #1a7f37;
  --success-soft: #e8f6ec;
  --warning: #b25000;
  --warning-soft: #fff1e0;
  --danger: #d70015;
  --danger-soft: #ffebed;
  --glass: #ffffffb8;
  --knob: #ffffff;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.06);
  --shadow-control: 0 1px 3px rgba(0,0,0,0.12), 0 0 0 0.5px rgba(0,0,0,0.04);
  --shadow-overlay: 0 12px 40px rgba(0,0,0,0.16);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --surface: #000000;
  --surface-raised: #1c1c1e;
  --fill: #2c2c2e;
  --fill-hover: #3a3a3c;
  --fill-selected: #636366;
  --ink: #f5f5f7;
  --ink-muted: #a1a1a6;
  --line: #ffffff26;
  --line-strong: #6e6e73;
  --accent: #0071e3;
  --accent-hover: #0062c4;
  --on-accent: #ffffff;
  --accent-text: #2997ff;
  --accent-soft: #0b2540;
  --focus-ring: #2997ff;
  --focus-glow: #2997ff4d;
  --success: #30d158;
  --success-soft: #11301b;
  --warning: #ff9f0a;
  --warning-soft: #33240b;
  --danger: #ff453a;
  --danger-soft: #3a1513;
  --glass: #1d1d1fb8;
  --knob: #ffffff;
  --shadow-card: 0 0 0 1px rgba(255,255,255,0.06);
  --shadow-control: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-overlay: 0 12px 40px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.08);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface: #000000;
    --surface-raised: #1c1c1e;
    --fill: #2c2c2e;
    --fill-hover: #3a3a3c;
    --fill-selected: #636366;
    --ink: #f5f5f7;
    --ink-muted: #a1a1a6;
    --line: #ffffff26;
    --line-strong: #6e6e73;
    --accent: #0071e3;
    --accent-hover: #0062c4;
    --on-accent: #ffffff;
    --accent-text: #2997ff;
    --accent-soft: #0b2540;
    --focus-ring: #2997ff;
    --focus-glow: #2997ff4d;
    --success: #30d158;
    --success-soft: #11301b;
    --warning: #ff9f0a;
    --warning-soft: #33240b;
    --danger: #ff453a;
    --danger-soft: #3a1513;
    --glass: #1d1d1fb8;
    --knob: #ffffff;
    --shadow-card: 0 0 0 1px rgba(255,255,255,0.06);
    --shadow-control: 0 1px 3px rgba(0,0,0,0.4);
    --shadow-overlay: 0 12px 40px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.08);
  }
}

/* Estilos tipográficos */
.lm-text-display { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 700; letter-spacing: -0.025em; }
.lm-text-title-1 { font-family: var(--font-display); font-size: 34px; line-height: 40px; font-weight: 600; letter-spacing: -0.022em; }
.lm-text-title-2 { font-family: var(--font-display); font-size: 24px; line-height: 30px; font-weight: 600; letter-spacing: -0.015em; }
.lm-text-title-3 { font-family: var(--font-display); font-size: 19px; line-height: 24px; font-weight: 600; letter-spacing: -0.01em; }
.lm-text-headline { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 600; letter-spacing: -0.01em; }
.lm-text-body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.lm-text-body-strong { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; }
.lm-text-callout { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.lm-text-caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.01em; }
.lm-text-mono { font-family: var(--font-mono); font-size: 13px; line-height: 18px; font-weight: 400; }
