/* Design System Tokens */
:root,
[data-theme="light"] {
  /* Color Tokens */
  --lt-primary: #1a4339;
  --lt-primary-dark: #16312c;
  --lt-primary-soft: #285d50;
  --lt-grey: #8a8a8a;
  --lt-secondary: #1f1f1f;
  --lt-white: #ffffff;
  --lt-ink: #101825;
  --lt-brand-muted: rgba(246, 245, 242, 0.62);

  --lt-bg: #f6f5f2;
  --lt-surface: #fcfcfc;
  --lt-surface-strong: #ffffff;
  --lt-text: #1f1f1f;
  --lt-muted: #8a8a8a;
  --lt-border: #d1d1d1;
  --lt-border-strong: #b8bdc4;
  --lt-accent: #16312c;
  --lt-highlight: #f59e0b;
  --lt-highlight-soft: #f9c35a;
  --lt-cta-add-bg: #abc856;
  --lt-cta-add-bg-hover: #9fbe4f;

  /* Radius & Size Tokens */
  --lt-radius-xs: 4px;
  --lt-radius-sm: 6px;
  --lt-radius-md: 8px;
  --lt-radius-lg: 13px;
  --lt-radius-xl: 16px;
  --lt-radius-pill: 9999px;
  --lt-control-height-sm: 36px;
  --lt-control-height: 40px;
  --lt-control-height-lg: 44px;

  /* Spacing Tokens */
  --lt-space-1: 4px;
  --lt-space-2: 8px;
  --lt-space-3: 12px;
  --lt-space-4: 16px;
  --lt-space-5: 20px;
  --lt-space-6: 24px;
  --lt-space-7: 28px;
  --lt-space-8: 32px;

  /* Typography Tokens */
  --lt-font-size-sm: 12px;
  --lt-font-size-base: 14px;
  --lt-font-size-md: 15px;
  --lt-font-size-lg: 17px;
  --lt-font-size-xl: 20px;
  --lt-font-size-2xl: 24px;
  --lt-font-size-display: 35px;
  --lt-font-size-metric: 32px;
  --lt-letter-tight-sm: -0.09px;
  --lt-letter-tight-md: -0.22px;
  --lt-letter-tight-lg: -0.33px;
  --lt-letter-tight-xl: -0.77px;
  --lt-letter-mono: 0.01px;
  --lt-line-height-tight: 1.2;
  --lt-line-height-base: 1.4;
  --lt-line-height-relaxed: 1.55;

  /* Elevation Tokens */
  --lt-shadow: 0 1px 3px rgba(16, 24, 37, 0.08), 0 1px 2px rgba(16, 24, 37, 0.06);
  --lt-shadow-control: 0 1px 2px rgba(16, 24, 37, 0.08);
  --lt-shadow-soft: 0 2px 6px rgba(16, 24, 37, 0.08), 0 1px 3px rgba(16, 24, 37, 0.06);
  --lt-shadow-elevated: 0 12px 24px rgba(16, 24, 37, 0.12), 0 4px 10px rgba(16, 24, 37, 0.08);
  --lt-shadow-interactive: 0 6px 14px rgba(16, 24, 37, 0.12), 0 2px 6px rgba(16, 24, 37, 0.08);

  /* Motion Tokens */
  --lt-duration-fast: 120ms;
  --lt-duration-base: 180ms;
  --lt-duration-slow: 280ms;
  --lt-ease-standard: cubic-bezier(0.2, 0.72, 0.2, 1);
  --lt-ease-emphasized: cubic-bezier(0.2, 0.9, 0.22, 1);

  --color-primary: var(--lt-primary);
  --color-base-content: var(--lt-text);
  --color-base-100: var(--lt-surface-strong);
  --color-base-200: var(--lt-bg);
  --color-base-300: var(--lt-border);
}