/* ===========================================
   Bilingual Journal — Design Tokens
   AUTO-GENERATED from design-tokens.json — do not edit by hand.
   Edit the JSON, then run `make tokens-gen`.
   =========================================== */

:root {
  --font-sans: "Outfit", "Zen Kaku Gothic New", "GovoriteCyrillic", system-ui, sans-serif;
  --font-family: "Outfit", "Zen Kaku Gothic New", "GovoriteCyrillic", system-ui, sans-serif;
  --font-japanese: "Zen Kaku Gothic New", sans-serif;
  --font-cyrillic: "GovoriteCyrillic", "PT Sans", "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Outfit", sans-serif;
  --font-diary: "PT Serif", "Zen Kaku Gothic New", "PT Sans", Georgia, serif;

  --font-size-display: 22px;
  --font-weight-display: 600;
  --letter-spacing-display: -0.01em;
  --font-size-heading: 18px;
  --font-weight-heading: 600;
  --font-size-heading-lg: 28px;
  --font-weight-heading-lg: 600;
  --font-size-title: 16px;
  --font-weight-title: 600;
  --font-size-body: 16px;
  --font-weight-body: 400;
  --line-height-body: 1.65;
  --font-size-meta: 12px;
  --font-weight-meta: 400;
  --font-size-caption: 11px;
  --font-weight-caption: 500;
  --font-size-label: 11px;
  --font-weight-label: 500;
  --letter-spacing-label: 0em;
  --font-size-diary-body: 17px;
  --font-weight-diary-body: 400;
  --line-height-diary-body: 1.8;
  --font-size-conversation-body: 17px;
  --font-weight-conversation-body: 400;
  --line-height-conversation-body: 1.7;
  --font-size-metric: 24px;
  --font-weight-metric: 600;
  --line-height-metric: 1.2;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --border-width: 1px;
  --motion-fast: 150ms;
  --motion-base: 200ms;
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --shadow-floating: 0px 3px 10px 0px rgba(0, 0, 0, 0.12);

  /* --- Colors (light) --- */
  --bg-app: #F7F5F1;
  --bg-surface: #F0EDE7;
  --bg-card: #FFFFFF;
  --border-default: #DDD8CE;
  --border-subtle: #E8E4DC;
  --text-primary: #2C2C2A;
  --text-secondary: #5F5E5A;
  --text-muted: #6D6961;
  --accent-cta: #995D12;
  --accent-cta-bg: #FEF3E2;
  --accent-cta-border: #F0C070;
  --accent-success: #347448;
  --accent-success-bg: #E8F3EC;
  --accent-success-border: #B8DAC4;
  --accent-warning: #B34428;
  --accent-warning-bg: #FFF1EC;
  --accent-diary: #985D40;
  --accent-diary-bg: #FFF8F3;
  --mic-waiting-bg: #D3D1C7;
  --conversation-bg: #F0EDE6;
  --subtitle-area-bg: #F7F5F1;
  --tab-bar-bg: #F7F5F1;
  --tab-bar-border: #E8E4DC;
  --tab-inactive: #6D6961;
  --audio-player-bg: #EDEAE3;
  --audio-player-border: #E8E4DC;
  --audio-progress-bg: #D3D1C7;
  --metrics-bg: #F0EDE7;
  --metrics-border: #E8E4DC;
  --login-google-bg: #2C2C2A;
  --login-google-text: #F0EDE6;
  --login-terms: #6D6961;
  --bubble-ai-bg: #EDEAE3;
  --bubble-ai-border: #B8DAC4;
  --bubble-ai-text: #2C2C2A;
  --bubble-user-bg: #FEF3E2;
  --bubble-user-border: #F0C070;
  --bubble-user-text: #2C2C2A;
  --cefr-a1-bg: #E8F5E7;
  --cefr-a1-text: #2D4A2A;
  --cefr-a2-bg: #D8F0DC;
  --cefr-a2-text: #085041;
  --cefr-b1-bg: #DAEAF9;
  --cefr-b1-text: #0C447C;
  --cefr-b2-bg: #C5DCF5;
  --cefr-b2-text: #083070;
  --cefr-c1-bg: #EAE8F7;
  --cefr-c1-text: #2A2650;
  --cefr-c2-bg: #E5E3F5;
  --cefr-c2-text: #201C48;
  --segment-bg: #EDEAE3;
  --segment-active-bg: #FFFFFF;
  --segment-active-text: #2C2C2A;
  --segment-inactive-text: #6D6961;
  --on-accent: #FFFFFF;
  --on-warning: #FFFFFF;
  --border-control: #858177;
  --segment-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  --overlay-scrim: rgba(0, 0, 0, 0.5);
}

/* --- Dark Mode (explicit class) --- */
.dark {
  /* --- Colors (dark) --- */
  --bg-app: #1E1C18;
  --bg-surface: #252320;
  --bg-card: #2E2C28;
  --border-default: #46423B;
  --border-subtle: #3A3835;
  --text-primary: #F0EDE6;
  --text-secondary: #9E9B94;
  --text-muted: #AAA59B;
  --accent-cta: #F0A855;
  --accent-cta-bg: #3D2A10;
  --accent-cta-border: #5A3D18;
  --accent-success: #8DCEA0;
  --accent-success-bg: #1E2E20;
  --accent-success-border: #2A4A2C;
  --accent-warning: #EF987B;
  --accent-warning-bg: #3D2010;
  --accent-diary: #D9A88B;
  --accent-diary-bg: #2A1E18;
  --mic-waiting-bg: #3A1810;
  --conversation-bg: #1A1814;
  --subtitle-area-bg: #1E1C18;
  --tab-bar-bg: #252320;
  --tab-bar-border: #3A3835;
  --tab-inactive: #AAA59B;
  --audio-player-bg: #252320;
  --audio-player-border: #3A3835;
  --audio-progress-bg: #3A3835;
  --metrics-bg: #252320;
  --metrics-border: #3A3835;
  --login-google-bg: #F0EDE6;
  --login-google-text: #1E1C18;
  --login-terms: #AAA59B;
  --bubble-ai-bg: #252320;
  --bubble-ai-border: #2A4A2C;
  --bubble-ai-text: #F0EDE6;
  --bubble-user-bg: #2A1E10;
  --bubble-user-border: #5A3D18;
  --bubble-user-text: #F0EDE6;
  --cefr-a1-bg: #2D4A2A;
  --cefr-a1-text: #8FCC8A;
  --cefr-a2-bg: #2A4020;
  --cefr-a2-text: #7EC490;
  --cefr-b1-bg: #1A3A5C;
  --cefr-b1-text: #85B7EB;
  --cefr-b2-bg: #12305A;
  --cefr-b2-text: #6AA8E8;
  --cefr-c1-bg: #2A2650;
  --cefr-c1-text: #AFA9EC;
  --cefr-c2-bg: #201C48;
  --cefr-c2-text: #9A94E0;
  --segment-bg: #1E1C18;
  --segment-active-bg: #2E2C28;
  --segment-active-text: #F0EDE6;
  --segment-inactive-text: #AAA59B;
  --on-accent: #1E1C18;
  --on-warning: #1E1C18;
  --border-control: #8C887F;
  --segment-shadow: none;
  --overlay-scrim: rgba(0, 0, 0, 0.5);
}

/* System preference fallback (when no explicit class) */
@media (prefers-color-scheme: dark) {
  :root:not(.light) {
    /* --- Colors (dark) --- */
    --bg-app: #1E1C18;
    --bg-surface: #252320;
    --bg-card: #2E2C28;
    --border-default: #46423B;
    --border-subtle: #3A3835;
    --text-primary: #F0EDE6;
    --text-secondary: #9E9B94;
    --text-muted: #AAA59B;
    --accent-cta: #F0A855;
    --accent-cta-bg: #3D2A10;
    --accent-cta-border: #5A3D18;
    --accent-success: #8DCEA0;
    --accent-success-bg: #1E2E20;
    --accent-success-border: #2A4A2C;
    --accent-warning: #EF987B;
    --accent-warning-bg: #3D2010;
    --accent-diary: #D9A88B;
    --accent-diary-bg: #2A1E18;
    --mic-waiting-bg: #3A1810;
    --conversation-bg: #1A1814;
    --subtitle-area-bg: #1E1C18;
    --tab-bar-bg: #252320;
    --tab-bar-border: #3A3835;
    --tab-inactive: #AAA59B;
    --audio-player-bg: #252320;
    --audio-player-border: #3A3835;
    --audio-progress-bg: #3A3835;
    --metrics-bg: #252320;
    --metrics-border: #3A3835;
    --login-google-bg: #F0EDE6;
    --login-google-text: #1E1C18;
    --login-terms: #AAA59B;
    --bubble-ai-bg: #252320;
    --bubble-ai-border: #2A4A2C;
    --bubble-ai-text: #F0EDE6;
    --bubble-user-bg: #2A1E10;
    --bubble-user-border: #5A3D18;
    --bubble-user-text: #F0EDE6;
    --cefr-a1-bg: #2D4A2A;
    --cefr-a1-text: #8FCC8A;
    --cefr-a2-bg: #2A4020;
    --cefr-a2-text: #7EC490;
    --cefr-b1-bg: #1A3A5C;
    --cefr-b1-text: #85B7EB;
    --cefr-b2-bg: #12305A;
    --cefr-b2-text: #6AA8E8;
    --cefr-c1-bg: #2A2650;
    --cefr-c1-text: #AFA9EC;
    --cefr-c2-bg: #201C48;
    --cefr-c2-text: #9A94E0;
    --segment-bg: #1E1C18;
    --segment-active-bg: #2E2C28;
    --segment-active-text: #F0EDE6;
    --segment-inactive-text: #AAA59B;
    --on-accent: #1E1C18;
    --on-warning: #1E1C18;
    --border-control: #8C887F;
    --segment-shadow: none;
    --overlay-scrim: rgba(0, 0, 0, 0.5);
  }
}