/* AUTO-GENERATED by ttsCast-design-tokens v0.2.2 — DO NOT EDIT.
   Source of truth: tokens.json. Regenerate with `npm run build`, then sync. */

/* The web/Core app and the extensions are dark-only, so :root carries the
   DARK palette. Light values are available via [data-theme="light"]. */
:root {
  /* ---- color (dark) ---- */
  --tts-color-text: #F0F9FF;
  --tts-color-text-status: #A9B5D6;
  --tts-color-text-secondary: #8498cb;
  --tts-color-tab-icon-default: #8498cb;
  --tts-color-tab-icon-selected: #489B71;
  --tts-color-link: #489B71;
  --tts-color-primary: #5FD48B;
  --tts-color-primary-dark: #489B71;
  --tts-color-primary-light: #5FD48B;
  --tts-color-accent: #5FD48B;
  --tts-color-accent-fill: #5FD48B;
  --tts-color-on-accent: #0d0f25;
  --tts-color-accent-dim: #489B71;
  --tts-color-accent-muted: #1D3441;
  --tts-color-glass-tint: rgba(17, 21, 51, 0.16);
  --tts-color-glass-scrim: rgba(9, 11, 28, 0.72);
  --tts-color-glass-text: #F0F9FF;
  --tts-color-glass-text-secondary: #E2E8F5;
  --tts-color-send-button: #059669;
  --tts-color-background-root: #0d0f25;
  --tts-color-background-default: #111533;
  --tts-color-background-secondary: #0d0f25;
  --tts-color-background-tertiary: #1a2040;
  --tts-color-border: #242b58;
  --tts-color-success: #5FD48B;
  --tts-color-play-icon: #5FD48B;
  --tts-color-error: #EF4444;
  --tts-color-warning: #F59E0B;

  /* ---- color: legacy aliases (do not use in new code) ----
     button-text used to be a hard white. Under the single-accent rule any
     text on an accent fill is navy (on-accent); white stays correct only on
     error/destructive fills — use #fff literally there. */
  --tts-color-button-text: var(--tts-color-on-accent);

  /* ---- spacing ---- */
  --tts-space-xs: 4px;
  --tts-space-sm: 8px;
  --tts-space-md: 16px;
  --tts-space-lg: 24px;
  --tts-space-xl: 32px;
  --tts-space-2xl: 40px;
  --tts-space-3xl: 48px;
  --tts-space-4xl: 56px;
  --tts-space-5xl: 64px;
  --tts-space-input-height: 48px;
  --tts-space-button-height: 48px;
  --tts-space-mini-player-height: 72px;
  --tts-space-utility-bar-height: 72px;
  --tts-space-touch-target: 44px;

  /* ---- radius ---- */
  --tts-radius-xs: 4px;
  --tts-radius-sm: 8px;
  --tts-radius-md: 12px;
  --tts-radius-lg: 16px;
  --tts-radius-xl: 24px;
  --tts-radius-2xl: 32px;
  --tts-radius-3xl: 40px;
  --tts-radius-full: 9999px;

  /* ---- typography ---- */
  --tts-font-size-h1: 28px;
  --tts-font-weight-h1: 700;
  --tts-font-size-h2: 22px;
  --tts-font-weight-h2: 600;
  --tts-font-size-h3: 18px;
  --tts-font-weight-h3: 600;
  --tts-font-size-h4: 16px;
  --tts-font-weight-h4: 600;
  --tts-font-size-body: 16px;
  --tts-font-weight-body: 400;
  --tts-font-size-small: 14px;
  --tts-font-weight-small: 400;
  --tts-font-size-caption: 12px;
  --tts-font-weight-caption: 500;
  --tts-font-size-link: 16px;
  --tts-font-weight-link: 400;
  --tts-font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --tts-font-serif: Georgia, 'Times New Roman', serif;
  --tts-font-rounded: 'SF Pro Rounded', 'Hiragino Maru Gothic ProN', Meiryo, 'MS PGothic', sans-serif;
  --tts-font-mono: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;

  /* ---- shadows ---- */
  --tts-shadow-sm: 0 2px 2px rgba(0, 0, 0, 0.1);
  --tts-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);

  /* ---- motion ---- */
  --tts-dur-fast: 200ms;
  --tts-dur-base: 300ms;
  --tts-dur-slow: 450ms;
  --tts-dur-pulse: 650ms;
  --tts-dur-spin: 900ms;
  --tts-press-scale: 0.88;
  --tts-press-scale-fab: 0.88;
  --tts-press-scale-button: 0.98;

  /* ---- states ---- */
  --tts-opacity-disabled: 0.5;
  --tts-opacity-inert: 0.4;
  --tts-opacity-played: 0.5;
  --tts-opacity-pressed-icon: 0.6;
  --tts-opacity-pressed-row: 0.7;
  --tts-opacity-pressed-card: 0.8;
  --tts-opacity-subtitle-on-accent: 0.8;
  --tts-overlay-scrim: rgba(0, 0, 0, 0.5);
  --tts-overlay-scrim-strong: rgba(0, 0, 0, 0.6);
  --tts-overlay-tutorial-dim: rgba(0, 0, 0, 0.45);
  --tts-overlay-processing-veil: rgba(0, 0, 0, 0.35);
  --tts-overlay-ring-track: rgba(255, 255, 255, 0.25);

  /* ---- icons (Feather outline everywhere; filled play/pause only) ---- */
  --tts-icon-size-toolbar: 24px;
  --tts-icon-size-mini-player: 28px;
  --tts-icon-size-card: 32px;
  --tts-icon-size-row: 20px;
  --tts-icon-size-chevron: 16px;
  --tts-icon-size-menu: 16px;
  --tts-icon-size-fab-glyph: 38px;
  --tts-icon-size-player-disc-glyph: 44px;

  /* ---- component geometry ---- */
  --tts-fab-size: 52px;
  --tts-fab-glyph: 38px;
  --tts-player-disc-size: 88px;
  --tts-player-disc-glyph: 44px;
  --tts-card-border-width: 1px;
  --tts-card-padding: 16px;
  --tts-card-radius: 12px;
  --tts-row-padding-vertical: 13px;
  --tts-row-padding-horizontal: 14px;
  --tts-row-title-size: 14px;
  --tts-row-meta-size: 12px;
  --tts-segmented-radius: 10px;
  --tts-segmented-inner-padding: 3px;
  --tts-segmented-segment-radius: 8px;
  --tts-segmented-label-size: 14px;
  --tts-progress-bar-height: 3px;
  --tts-progress-bar-radius: 2px;
  --tts-pinned-card-border: 1.5px;
  --tts-menu-width: 240px;
  --tts-menu-radius: 14px;
  --tts-sheet-top-radius: 24px;
  --tts-sheet-padding: 32px;
  --tts-tutorial-bubble-max-width: 340px;
  --tts-tutorial-bubble-line-height: 24px;
  --tts-tutorial-bubble-padding-vertical: 16px;
  --tts-tutorial-bubble-padding-horizontal: 18px;
  --tts-swipe-action-column-width: 150px;
  --tts-swipe-action-min-row-height: 48px;
  --tts-swipe-action-commit-ratio: 0.6;
  --tts-swipe-action-commit-max-px: 180px;

  /* ---- materials (fallbacks; glass itself is iOS-only) ---- */
  --tts-material-solid-fill: rgba(13, 15, 37, 0.96);
  --tts-material-blur-intensity: 80;
  --tts-material-glass-text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

[data-theme="light"] {
  --tts-color-text: #171B33;
  --tts-color-text-status: #4A4F63;
  --tts-color-text-secondary: #646A80;
  --tts-color-tab-icon-default: #646A80;
  --tts-color-tab-icon-selected: #0E6A21;
  --tts-color-link: #0E6A21;
  --tts-color-primary: #5FD48B;
  --tts-color-primary-dark: #0E6A21;
  --tts-color-primary-light: #5FD48B;
  --tts-color-accent: #0B7821;
  --tts-color-accent-fill: #5FD48B;
  --tts-color-on-accent: #0d0f25;
  --tts-color-accent-dim: #0E6A21;
  --tts-color-accent-muted: #DCEFE2;
  --tts-color-glass-tint: rgba(17, 21, 51, 0.16);
  --tts-color-glass-scrim: rgba(9, 11, 28, 0.72);
  --tts-color-glass-text: #F0F9FF;
  --tts-color-glass-text-secondary: #E2E8F5;
  --tts-color-send-button: #059669;
  --tts-color-background-root: #EDEFF4;
  --tts-color-background-default: #F6F7FA;
  --tts-color-background-secondary: #EDEFF4;
  --tts-color-background-tertiary: #FAFBFE;
  --tts-color-border: #E0E3EB;
  --tts-color-success: #0B7821;
  --tts-color-play-icon: #5FD48B;
  --tts-color-error: #EF4444;
  --tts-color-warning: #F59E0B;
}

[data-theme="dark"] {
  --tts-color-text: #F0F9FF;
  --tts-color-text-status: #A9B5D6;
  --tts-color-text-secondary: #8498cb;
  --tts-color-tab-icon-default: #8498cb;
  --tts-color-tab-icon-selected: #489B71;
  --tts-color-link: #489B71;
  --tts-color-primary: #5FD48B;
  --tts-color-primary-dark: #489B71;
  --tts-color-primary-light: #5FD48B;
  --tts-color-accent: #5FD48B;
  --tts-color-accent-fill: #5FD48B;
  --tts-color-on-accent: #0d0f25;
  --tts-color-accent-dim: #489B71;
  --tts-color-accent-muted: #1D3441;
  --tts-color-glass-tint: rgba(17, 21, 51, 0.16);
  --tts-color-glass-scrim: rgba(9, 11, 28, 0.72);
  --tts-color-glass-text: #F0F9FF;
  --tts-color-glass-text-secondary: #E2E8F5;
  --tts-color-send-button: #059669;
  --tts-color-background-root: #0d0f25;
  --tts-color-background-default: #111533;
  --tts-color-background-secondary: #0d0f25;
  --tts-color-background-tertiary: #1a2040;
  --tts-color-border: #242b58;
  --tts-color-success: #5FD48B;
  --tts-color-play-icon: #5FD48B;
  --tts-color-error: #EF4444;
  --tts-color-warning: #F59E0B;
}
