/* Generated by docs/design/tools/build-css.mjs from docs/design/tokens. Do not edit. */
/* Theme: system by default; force with data-theme="light" | "dark" on any element. */
/* Text scale: set --text-scale (1 = default, 2 = 200%) on any element. */
/* Script line height: add class script-cjk or script-tall to content text. */

:root {
  --color-indigo-50: #F1F2FB;
  --color-indigo-100: #E3E5F7;
  --color-indigo-200: #C7CBEF;
  --color-indigo-300: #A6ACE6;
  --color-indigo-400: #8187D6;
  --color-indigo-500: #5F64C2;
  --color-indigo-600: #4A4AA8;
  --color-indigo-700: #3B3A8A;
  --color-indigo-800: #2D2C6B;
  --color-indigo-900: #1F1E4A;
  --color-indigo-950: #141331;
  --color-moon-50: #FFF9EB;
  --color-moon-100: #FDF0CC;
  --color-moon-200: #F9E09A;
  --color-moon-300: #F2CB66;
  --color-moon-400: #E6B23F;
  --color-moon-500: #C99425;
  --color-moon-600: #A1741A;
  --color-moon-700: #7C5816;
  --color-moon-800: #5B4114;
  --color-moon-900: #3D2C0F;
  --color-ink-0: #FFFFFF;
  --color-ink-25: #FBFBFD;
  --color-ink-50: #F5F5F9;
  --color-ink-100: #ECECF2;
  --color-ink-200: #DCDCE6;
  --color-ink-300: #C3C3D1;
  --color-ink-400: #9C9CAF;
  --color-ink-500: #747488;
  --color-ink-600: #5A5A6C;
  --color-ink-700: #444453;
  --color-ink-800: #2E2E3A;
  --color-ink-900: #1A1A24;
  --color-ink-950: #0F0F16;
  --color-night-300: #B9B8D0;
  --color-night-400: #8F8EAD;
  --color-night-500: #6C6B8C;
  --color-night-600: #4C4B69;
  --color-night-700: #36354F;
  --color-night-800: #27263D;
  --color-night-850: #1E1D33;
  --color-night-900: #171629;
  --color-night-950: #0F0E1E;
  --color-green-50: #EAF7EF;
  --color-green-100: #CDEBD8;
  --color-green-200: #A6DBBA;
  --color-green-300: #7CC99A;
  --color-green-400: #4FB07A;
  --color-green-500: #2E9460;
  --color-green-600: #1F7A4C;
  --color-green-700: #17603C;
  --color-green-800: #114A2F;
  --color-green-900: #0B3321;
  --color-green-950: #07231A;
  --color-red-50: #FDEEEE;
  --color-red-100: #F9D5D5;
  --color-red-200: #F4B3B3;
  --color-red-300: #EE8C8C;
  --color-red-400: #E36464;
  --color-red-500: #CF4141;
  --color-red-600: #B02E2E;
  --color-red-700: #8C2424;
  --color-red-800: #6A1C1C;
  --color-red-900: #491414;
  --color-red-950: #300D0F;
  --color-amber-50: #FEF5E7;
  --color-amber-100: #FCE6C2;
  --color-amber-200: #F9D08A;
  --color-amber-300: #F5B550;
  --color-amber-400: #EE9A22;
  --color-amber-500: #D17F0F;
  --color-amber-600: #A9640C;
  --color-amber-700: #834D0B;
  --color-amber-800: #603909;
  --color-amber-900: #402606;
  --color-amber-950: #2A1904;
  --color-alpha-black-8: rgb(0 0 0 / 0.08);
  --color-alpha-black-16: rgb(0 0 0 / 0.16);
  --color-alpha-black-32: rgb(0 0 0 / 0.32);
  --color-alpha-black-56: rgb(0 0 0 / 0.56);
  --color-alpha-black-72: rgb(0 0 0 / 0.72);
  --color-alpha-indigo-12: rgb(20 19 49 / 0.12);
  --color-alpha-indigo-24: rgb(20 19 49 / 0.24);
  --color-alpha-white-8: rgb(255 255 255 / 0.08);
  --color-alpha-white-12: rgb(255 255 255 / 0.12);
  --space-0: 0px;
  --space-25: 2px;
  --space-50: 4px;
  --space-100: 8px;
  --space-150: 12px;
  --space-200: 16px;
  --space-250: 20px;
  --space-300: 24px;
  --space-400: 32px;
  --space-500: 40px;
  --space-600: 48px;
  --space-800: 64px;
  --space-1000: 80px;
  --radius-0: 0px;
  --radius-100: 4px;
  --radius-200: 8px;
  --radius-300: 12px;
  --radius-400: 16px;
  --radius-500: 20px;
  --radius-700: 28px;
  --radius-full: 9999px;
  --size-100: 4px;
  --size-200: 8px;
  --size-300: 12px;
  --size-400: 16px;
  --size-500: 20px;
  --size-600: 24px;
  --size-700: 28px;
  --size-800: 32px;
  --size-1000: 40px;
  --size-1100: 44px;
  --size-1200: 48px;
  --size-1400: 56px;
  --size-1600: 64px;
  --size-2000: 80px;
  --size-3000: 120px;
  --border-width-100: 1px;
  --border-width-150: 1.5px;
  --border-width-200: 2px;
  --border-width-300: 3px;
  --font-family-system: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --font-family-system-rounded: ui-rounded, system-ui, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-100: 12px;
  --font-size-150: 13px;
  --font-size-200: 15px;
  --font-size-300: 17px;
  --font-size-400: 20px;
  --font-size-500: 22px;
  --font-size-600: 28px;
  --font-size-700: 34px;
  --font-size-800: 40px;
  --font-line-height-tight: 1.2;
  --font-line-height-snug: 1.3;
  --font-line-height-normal: 1.4;
  --font-line-height-relaxed: 1.5;
  --font-letter-spacing-none: 0px;
  --duration-0: 0ms;
  --duration-100: 100ms;
  --duration-150: 150ms;
  --duration-200: 200ms;
  --duration-250: 250ms;
  --duration-300: 300ms;
  --duration-450: 450ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-decelerate: cubic-bezier(0, 0, 0, 1);
  --easing-accelerate: cubic-bezier(0.3, 0, 1, 1);
  --easing-linear: cubic-bezier(0, 0, 1, 1);
  --spring-snappy-damping: 22;
  --spring-snappy-stiffness: 320;
  --spring-snappy-mass: 1;
  --spring-gentle-damping: 20;
  --spring-gentle-stiffness: 180;
  --spring-gentle-mass: 1;
  --distance-enter: 8px;
  --distance-sheet: 24px;
  --scale-press: 0.97;
  --scale-feedback-from: 0.85;
  --color-text-on-brand: #FBFBFD;
  --color-border-focus-on-brand: #F2CB66;
  --color-feedback-warning-solid: #F5B550;
  --color-feedback-warning-on-solid: #0F0F16;
  --color-pro-solid: #F2CB66;
  --color-pro-on-solid: #141331;
  --space-inset-xs: 8px;
  --space-inset-sm: 12px;
  --space-inset-md: 16px;
  --space-inset-lg: 24px;
  --space-stack-2xs: 4px;
  --space-stack-xs: 8px;
  --space-stack-sm: 12px;
  --space-stack-md: 16px;
  --space-stack-lg: 24px;
  --space-stack-xl: 32px;
  --space-stack-section: 40px;
  --space-inline-2xs: 4px;
  --space-inline-xs: 8px;
  --space-inline-sm: 12px;
  --space-inline-md: 16px;
  --space-gutter-compact: 16px;
  --space-gutter-regular: 24px;
  --space-touch-gap: 8px;
  --radius-control: 12px;
  --radius-card: 16px;
  --radius-sheet: 28px;
  --radius-bubble: 20px;
  --radius-chip: 9999px;
  --radius-inner: 8px;
  --size-touch-ios: 44px;
  --size-touch-android: 48px;
  --size-control-md: 44px;
  --size-control-lg: 56px;
  --size-icon-sm: 16px;
  --size-icon-md: 20px;
  --size-icon-lg: 24px;
  --size-icon-xl: 32px;
  --size-icon-hero: 64px;
  --size-content-max-width: 640px;
  --border-width-default: 1px;
  --border-width-control: 1.5px;
  --border-width-selected: 2px;
  --border-width-focus: 2px;
  --border-focus-offset: 2px;
  --elevation-0: none;
  --typography-display-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-display-size: 34px;
  --typography-display-weight: 700;
  --typography-display-line-height: 1.2;
  --typography-display-letter-spacing: 0px;
  --typography-title-1-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-title-1-size: 28px;
  --typography-title-1-weight: 700;
  --typography-title-1-line-height: 1.2;
  --typography-title-1-letter-spacing: 0px;
  --typography-title-2-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-title-2-size: 22px;
  --typography-title-2-weight: 600;
  --typography-title-2-line-height: 1.3;
  --typography-title-2-letter-spacing: 0px;
  --typography-title-3-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-title-3-size: 20px;
  --typography-title-3-weight: 600;
  --typography-title-3-line-height: 1.3;
  --typography-title-3-letter-spacing: 0px;
  --typography-headline-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-headline-size: 17px;
  --typography-headline-weight: 600;
  --typography-headline-line-height: 1.3;
  --typography-headline-letter-spacing: 0px;
  --typography-body-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-body-size: 17px;
  --typography-body-weight: 400;
  --typography-body-line-height: 1.4;
  --typography-body-letter-spacing: 0px;
  --typography-body-strong-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-body-strong-size: 17px;
  --typography-body-strong-weight: 600;
  --typography-body-strong-line-height: 1.4;
  --typography-body-strong-letter-spacing: 0px;
  --typography-subhead-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-subhead-size: 15px;
  --typography-subhead-weight: 400;
  --typography-subhead-line-height: 1.4;
  --typography-subhead-letter-spacing: 0px;
  --typography-footnote-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-footnote-size: 13px;
  --typography-footnote-weight: 400;
  --typography-footnote-line-height: 1.4;
  --typography-footnote-letter-spacing: 0px;
  --typography-caption-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-caption-size: 12px;
  --typography-caption-weight: 500;
  --typography-caption-line-height: 1.3;
  --typography-caption-letter-spacing: 0px;
  --typography-button-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-button-size: 17px;
  --typography-button-weight: 600;
  --typography-button-line-height: 1.3;
  --typography-button-letter-spacing: 0px;
  --typography-counter-family: ui-rounded, system-ui, sans-serif;
  --typography-counter-size: 28px;
  --typography-counter-weight: 700;
  --typography-counter-line-height: 1.2;
  --typography-counter-letter-spacing: 0px;
  --typography-content-term-hero-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-term-hero-size: 40px;
  --typography-content-term-hero-weight: 600;
  --typography-content-term-hero-line-height: 1.3;
  --typography-content-term-hero-letter-spacing: 0px;
  --typography-content-term-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-term-size: 28px;
  --typography-content-term-weight: 600;
  --typography-content-term-line-height: 1.3;
  --typography-content-term-letter-spacing: 0px;
  --typography-content-sentence-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-sentence-size: 20px;
  --typography-content-sentence-weight: 400;
  --typography-content-sentence-line-height: 1.5;
  --typography-content-sentence-letter-spacing: 0px;
  --typography-content-translation-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-translation-size: 17px;
  --typography-content-translation-weight: 400;
  --typography-content-translation-line-height: 1.5;
  --typography-content-translation-letter-spacing: 0px;
  --typography-content-dialogue-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-dialogue-size: 17px;
  --typography-content-dialogue-weight: 400;
  --typography-content-dialogue-line-height: 1.5;
  --typography-content-dialogue-letter-spacing: 0px;
  --typography-content-option-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-option-size: 17px;
  --typography-content-option-weight: 500;
  --typography-content-option-line-height: 1.4;
  --typography-content-option-letter-spacing: 0px;
  --typography-content-phonetic-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --typography-content-phonetic-size: 15px;
  --typography-content-phonetic-weight: 400;
  --typography-content-phonetic-line-height: 1.4;
  --typography-content-phonetic-letter-spacing: 0px;
  --script-line-height-multiplier-default: 1;
  --script-line-height-multiplier-cjk: 1.1;
  --script-line-height-multiplier-tall: 1.25;
  --motion-press-default-duration: 100ms;
  --motion-press-default-easing: cubic-bezier(0.2, 0, 0, 1);
  --motion-press-default-delay: 0ms;
  --motion-press-reduced-duration: 100ms;
  --motion-press-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-press-reduced-delay: 0ms;
  --motion-state-default-duration: 200ms;
  --motion-state-default-easing: cubic-bezier(0.2, 0, 0, 1);
  --motion-state-default-delay: 0ms;
  --motion-state-reduced-duration: 100ms;
  --motion-state-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-state-reduced-delay: 0ms;
  --motion-enter-default-duration: 300ms;
  --motion-enter-default-easing: cubic-bezier(0, 0, 0, 1);
  --motion-enter-default-delay: 0ms;
  --motion-enter-reduced-duration: 150ms;
  --motion-enter-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-enter-reduced-delay: 0ms;
  --motion-exit-default-duration: 200ms;
  --motion-exit-default-easing: cubic-bezier(0.3, 0, 1, 1);
  --motion-exit-default-delay: 0ms;
  --motion-exit-reduced-duration: 100ms;
  --motion-exit-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-exit-reduced-delay: 0ms;
  --motion-reveal-default-duration: 250ms;
  --motion-reveal-default-easing: cubic-bezier(0.2, 0, 0, 1);
  --motion-reveal-default-delay: 0ms;
  --motion-reveal-reduced-duration: 100ms;
  --motion-reveal-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-reveal-reduced-delay: 0ms;
  --motion-feedback-default-duration: 250ms;
  --motion-feedback-default-easing: cubic-bezier(0, 0, 0, 1);
  --motion-feedback-default-delay: 0ms;
  --motion-feedback-reduced-duration: 0ms;
  --motion-feedback-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-feedback-reduced-delay: 0ms;
  --motion-progress-default-duration: 450ms;
  --motion-progress-default-easing: cubic-bezier(0, 0, 0, 1);
  --motion-progress-default-delay: 0ms;
  --motion-progress-reduced-duration: 0ms;
  --motion-progress-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-progress-reduced-delay: 0ms;
  --motion-sheet-default-duration: 300ms;
  --motion-sheet-default-easing: cubic-bezier(0, 0, 0, 1);
  --motion-sheet-default-delay: 0ms;
  --motion-sheet-reduced-duration: 150ms;
  --motion-sheet-reduced-easing: cubic-bezier(0, 0, 1, 1);
  --motion-sheet-reduced-delay: 0ms;
  --button-min-height: 56px;
  --button-padding-inline: 24px;
  --button-padding-block: 12px;
  --button-radius: 12px;
  --button-gap: 8px;
  --button-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --button-label-size: 17px;
  --button-label-weight: 600;
  --button-label-line-height: 1.3;
  --button-label-letter-spacing: 0px;
  --button-pro-bg: #F2CB66;
  --button-pro-fg: #141331;
  --card-radius: 16px;
  --card-padding: 16px;
  --card-gap: 12px;
  --list-row-min-height: 44px;
  --list-row-padding-inline: 16px;
  --list-row-padding-block: 12px;
  --list-row-gap: 12px;
  --list-row-title-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --list-row-title-size: 17px;
  --list-row-title-weight: 600;
  --list-row-title-line-height: 1.3;
  --list-row-title-letter-spacing: 0px;
  --list-row-subtitle-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --list-row-subtitle-size: 15px;
  --list-row-subtitle-weight: 400;
  --list-row-subtitle-line-height: 1.4;
  --list-row-subtitle-letter-spacing: 0px;
  --quiz-option-min-height: 56px;
  --quiz-option-padding-inline: 16px;
  --quiz-option-padding-block: 12px;
  --quiz-option-radius: 12px;
  --quiz-option-gap: 8px;
  --quiz-option-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --quiz-option-label-size: 17px;
  --quiz-option-label-weight: 500;
  --quiz-option-label-line-height: 1.4;
  --quiz-option-label-letter-spacing: 0px;
  --quiz-option-default-border-width: 1.5px;
  --quiz-option-correct-border-width: 2px;
  --quiz-option-incorrect-border-width: 2px;
  --quiz-option-dimmed-border-width: 1.5px;
  --chip-min-height: 44px;
  --chip-padding-inline: 12px;
  --chip-radius: 9999px;
  --chip-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --chip-label-size: 15px;
  --chip-label-weight: 400;
  --chip-label-line-height: 1.4;
  --chip-label-letter-spacing: 0px;
  --input-min-height: 44px;
  --input-radius: 12px;
  --input-padding-inline: 12px;
  --input-text-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --input-text-size: 17px;
  --input-text-weight: 400;
  --input-text-line-height: 1.4;
  --input-text-letter-spacing: 0px;
  --tab-bar-icon: 24px;
  --tab-bar-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --tab-bar-label-size: 12px;
  --tab-bar-label-weight: 500;
  --tab-bar-label-line-height: 1.3;
  --tab-bar-label-letter-spacing: 0px;
  --bubble-radius: 20px;
  --bubble-padding: 12px;
  --bubble-text-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --bubble-text-size: 17px;
  --bubble-text-weight: 400;
  --bubble-text-line-height: 1.5;
  --bubble-text-letter-spacing: 0px;
  --badge-radius: 9999px;
  --badge-padding-inline: 8px;
  --badge-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --badge-label-size: 12px;
  --badge-label-weight: 500;
  --badge-label-line-height: 1.3;
  --badge-label-letter-spacing: 0px;
  --badge-pro-bg: #F2CB66;
  --badge-pro-fg: #141331;
  --banner-radius: 12px;
  --banner-padding: 12px;
  --banner-gap: 12px;
  --banner-text-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --banner-text-size: 15px;
  --banner-text-weight: 400;
  --banner-text-line-height: 1.4;
  --banner-text-letter-spacing: 0px;
  --stage-size: 20px;
  --goal-ring-size: 80px;
  --goal-ring-stroke: 3px;
  --goal-ring-value-family: ui-rounded, system-ui, sans-serif;
  --goal-ring-value-size: 28px;
  --goal-ring-value-weight: 700;
  --goal-ring-value-line-height: 1.2;
  --goal-ring-value-letter-spacing: 0px;
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --sheet-radius: 28px;
  --header-title-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --header-title-size: 34px;
  --header-title-weight: 700;
  --header-title-line-height: 1.2;
  --header-title-letter-spacing: 0px;
  --header-title-compact-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --header-title-compact-size: 17px;
  --header-title-compact-weight: 600;
  --header-title-compact-line-height: 1.3;
  --header-title-compact-letter-spacing: 0px;
  --header-padding-inline: 16px;
  --nav-bar-android-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --nav-bar-android-label-size: 12px;
  --nav-bar-android-label-weight: 500;
  --nav-bar-android-label-line-height: 1.3;
  --nav-bar-android-label-letter-spacing: 0px;
  --toggle-width: 48px;
  --toggle-height: 28px;
  --toggle-thumb-size: 24px;
  --segmented-radius: 12px;
  --segmented-min-height: 44px;
  --segmented-label-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --segmented-label-size: 15px;
  --segmented-label-weight: 400;
  --segmented-label-line-height: 1.4;
  --segmented-label-letter-spacing: 0px;
  --progress-height: 4px;
  --progress-radius: 9999px;
  --skeleton-radius: 8px;
  --flashcard-radius: 16px;
  --flashcard-padding: 24px;
  --flashcard-min-height: 120px;
  --flashcard-term-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --flashcard-term-size: 28px;
  --flashcard-term-weight: 600;
  --flashcard-term-line-height: 1.3;
  --flashcard-term-letter-spacing: 0px;
  --flashcard-phonetic-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --flashcard-phonetic-size: 15px;
  --flashcard-phonetic-weight: 400;
  --flashcard-phonetic-line-height: 1.4;
  --flashcard-phonetic-letter-spacing: 0px;
  --feedback-panel-radius: 16px;
  --feedback-panel-padding: 16px;
  --feedback-panel-gap: 8px;
  --dialog-radius: 28px;
  --dialog-padding: 24px;
  --price-total-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --price-total-size: 22px;
  --price-total-weight: 600;
  --price-total-line-height: 1.3;
  --price-total-letter-spacing: 0px;
  --price-equivalent-family: system-ui, -apple-system, Roboto, "Noto Sans", sans-serif;
  --price-equivalent-size: 15px;
  --price-equivalent-weight: 400;
  --price-equivalent-line-height: 1.4;
  --price-equivalent-letter-spacing: 0px;
  --widget-padding-compact: 12px;
  --widget-padding-expanded: 16px;
  --widget-gap-compact: 8px;
  --widget-gap-expanded: 12px;
  --widget-gap-tight: 4px;
  --widget-radius-inner: 8px;
  --widget-text-term-compact: 22px;
  --widget-text-term-expanded: 28px;
  --widget-text-body-compact: 15px;
  --widget-text-body-expanded: 17px;
  --widget-text-label: 15px;
  --widget-text-meta: 12px;
  --widget-line-height-term: 1.3;
  --widget-line-height-body: 1.4;
  --widget-line-height-sentence: 1.5;
  --widget-weight-term: 600;
  --widget-weight-label: 600;
  --widget-weight-option: 500;
  --widget-weight-meta: 500;
  --widget-weight-body: 400;
  --widget-option-min-height: 44px;
  --widget-option-min-height-android: 48px;
  --widget-option-padding-inline: 12px;
  --widget-option-radius: 8px;
  --widget-option-border-width: 1.5px;
  --widget-option-border-width-answered: 2px;
  --widget-option-gap: 8px;
  --widget-action-min-height: 44px;
  --widget-action-min-height-android: 48px;
  --widget-action-padding-inline: 12px;
  --widget-action-radius: 9999px;
  --widget-action-gap: 4px;
  --widget-action-icon: 20px;
  --widget-icon-meta: 16px;
  --widget-icon-feedback: 20px;
  --widget-icon-symbol: 32px;
  --widget-bubble-radius: 12px;
  --widget-bubble-padding-inline: 8px;
  --widget-bubble-padding-block: 4px;
  --widget-bubble-gap: 4px;
  --widget-gap-mark-width: 2px;
  --widget-gap-mark-min-width: 40px;
  --text-scale: 1;
  --script-lh: 1;
}

:root, [data-theme="light"] {
  color-scheme: light;
  --color-surface-canvas: #F5F5F9;
  --color-surface-default: #FFFFFF;
  --color-surface-raised: #FFFFFF;
  --color-surface-sunken: #ECECF2;
  --color-surface-accent: #F1F2FB;
  --color-surface-inverse: #171629;
  --color-surface-brand: #2D2C6B;
  --color-text-primary: #1A1A24;
  --color-text-secondary: #5A5A6C;
  --color-text-disabled: #9C9CAF;
  --color-text-inverse: #FBFBFD;
  --color-text-on-accent: #FFFFFF;
  --color-text-accent: #4A4AA8;
  --color-text-highlight: #3B3A8A;
  --color-icon-primary: #2E2E3A;
  --color-icon-secondary: #747488;
  --color-icon-accent: #4A4AA8;
  --color-accent-default: #4A4AA8;
  --color-accent-pressed: #3B3A8A;
  --color-accent-subtle: #E3E5F7;
  --color-accent-on-subtle: #2D2C6B;
  --color-border-subtle: #DCDCE6;
  --color-border-strong: #747488;
  --color-border-selected: #4A4AA8;
  --color-border-focus: #4A4AA8;
  --color-feedback-correct-fg: #17603C;
  --color-feedback-correct-bg: #EAF7EF;
  --color-feedback-correct-border: #1F7A4C;
  --color-feedback-correct-solid: #1F7A4C;
  --color-feedback-correct-on-solid: #FFFFFF;
  --color-feedback-incorrect-fg: #8C2424;
  --color-feedback-incorrect-bg: #FDEEEE;
  --color-feedback-incorrect-border: #B02E2E;
  --color-feedback-incorrect-solid: #B02E2E;
  --color-feedback-incorrect-on-solid: #FFFFFF;
  --color-feedback-warning-fg: #603909;
  --color-feedback-warning-bg: #FEF5E7;
  --color-feedback-warning-border: #A9640C;
  --color-feedback-info-fg: #3B3A8A;
  --color-feedback-info-bg: #F1F2FB;
  --color-feedback-info-border: #5F64C2;
  --color-feedback-info-solid: #4A4AA8;
  --color-feedback-info-on-solid: #FFFFFF;
  --color-pro-fg: #7C5816;
  --color-pro-bg: #FFF9EB;
  --color-pro-border: #A1741A;
  --color-brand-symbol: #3B3A8A;
  --color-brand-wordmark: #1F1E4A;
  --color-brand-moon: #C99425;
  --color-stage-track: #747488;
  --color-stage-fill: #4A4AA8;
  --color-stage-learned: #A1741A;
  --color-overlay-scrim: rgb(0 0 0 / 0.32);
  --color-overlay-pressed: rgb(20 19 49 / 0.12);
  --color-shadow-ambient: rgb(20 19 49 / 0.12);
  --color-shadow-key: rgb(0 0 0 / 0.08);
  --elevation-1: 0px 1px 2px 0px rgb(0 0 0 / 0.08), 0px 1px 3px 0px rgb(20 19 49 / 0.12);
  --elevation-2: 0px 2px 4px 0px rgb(0 0 0 / 0.08), 0px 6px 16px 0px rgb(20 19 49 / 0.12);
  --elevation-3: 0px 4px 8px 0px rgb(0 0 0 / 0.08), 0px 12px 32px 0px rgb(20 19 49 / 0.12);
  --button-primary-bg: #4A4AA8;
  --button-primary-bg-pressed: #3B3A8A;
  --button-primary-fg: #FFFFFF;
  --button-secondary-bg: #FFFFFF;
  --button-secondary-border: #747488;
  --button-secondary-fg: #4A4AA8;
  --button-tertiary-fg: #4A4AA8;
  --button-destructive-bg: #B02E2E;
  --button-destructive-fg: #FFFFFF;
  --card-bg: #FFFFFF;
  --card-elevation: 0px 1px 2px 0px rgb(0 0 0 / 0.08), 0px 1px 3px 0px rgb(20 19 49 / 0.12);
  --card-active-bg: #FFFFFF;
  --card-active-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.08), 0px 6px 16px 0px rgb(20 19 49 / 0.12);
  --list-row-divider: #DCDCE6;
  --quiz-option-default-bg: #FFFFFF;
  --quiz-option-default-border: #747488;
  --quiz-option-default-fg: #1A1A24;
  --quiz-option-correct-bg: #EAF7EF;
  --quiz-option-correct-border: #1F7A4C;
  --quiz-option-correct-fg: #1A1A24;
  --quiz-option-correct-symbol: #17603C;
  --quiz-option-incorrect-bg: #FDEEEE;
  --quiz-option-incorrect-border: #B02E2E;
  --quiz-option-incorrect-fg: #1A1A24;
  --quiz-option-incorrect-symbol: #8C2424;
  --quiz-option-dimmed-bg: #FFFFFF;
  --quiz-option-dimmed-border: #DCDCE6;
  --quiz-option-dimmed-fg: #5A5A6C;
  --chip-default-bg: #FFFFFF;
  --chip-default-border: #747488;
  --chip-default-fg: #1A1A24;
  --chip-selected-bg: #E3E5F7;
  --chip-selected-border: #4A4AA8;
  --chip-selected-fg: #2D2C6B;
  --input-bg: #ECECF2;
  --input-border: #747488;
  --input-border-focus: #4A4AA8;
  --input-placeholder: #5A5A6C;
  --tab-bar-bg: #FFFFFF;
  --tab-bar-divider: #DCDCE6;
  --tab-bar-active: #4A4AA8;
  --tab-bar-inactive: #747488;
  --bubble-a-bg: #ECECF2;
  --bubble-a-fg: #1A1A24;
  --bubble-b-bg: #F1F2FB;
  --bubble-b-fg: #1A1A24;
  --bubble-highlight: #3B3A8A;
  --banner-warning-bg: #FEF5E7;
  --banner-warning-border: #A9640C;
  --banner-warning-fg: #603909;
  --banner-info-bg: #F1F2FB;
  --banner-info-border: #5F64C2;
  --banner-info-fg: #3B3A8A;
  --banner-error-bg: #FDEEEE;
  --banner-error-border: #B02E2E;
  --banner-error-fg: #8C2424;
  --stage-track: #747488;
  --stage-fill: #4A4AA8;
  --stage-learned: #A1741A;
  --goal-ring-track: #ECECF2;
  --goal-ring-fill: #4A4AA8;
  --goal-ring-complete: #1F7A4C;
  --focus-ring-color: #4A4AA8;
  --sheet-bg: #FFFFFF;
  --sheet-scrim: rgb(0 0 0 / 0.32);
  --sheet-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.08), 0px 12px 32px 0px rgb(20 19 49 / 0.12);
  --header-bg: #F5F5F9;
  --nav-bar-android-bg: #FFFFFF;
  --nav-bar-android-indicator: #E3E5F7;
  --nav-bar-android-active: #2D2C6B;
  --nav-bar-android-inactive: #747488;
  --toggle-track-on: #4A4AA8;
  --toggle-track-off: #747488;
  --toggle-thumb: #FFFFFF;
  --segmented-track: #ECECF2;
  --segmented-selected-bg: #E3E5F7;
  --segmented-selected-fg: #2D2C6B;
  --segmented-fg: #5A5A6C;
  --progress-track: #ECECF2;
  --progress-fill: #4A4AA8;
  --skeleton-bg: #ECECF2;
  --flashcard-bg: #FFFFFF;
  --flashcard-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.08), 0px 6px 16px 0px rgb(20 19 49 / 0.12);
  --feedback-panel-correct-bg: #EAF7EF;
  --feedback-panel-correct-border: #1F7A4C;
  --feedback-panel-correct-title: #17603C;
  --feedback-panel-incorrect-bg: #FDEEEE;
  --feedback-panel-incorrect-border: #B02E2E;
  --feedback-panel-incorrect-title: #8C2424;
  --dialog-bg: #FFFFFF;
  --dialog-scrim: rgb(0 0 0 / 0.32);
  --dialog-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.08), 0px 12px 32px 0px rgb(20 19 49 / 0.12);
  --widget-color-bg: #FFFFFF;
  --widget-color-bg-brand: #2D2C6B;
  --widget-color-fg: #1A1A24;
  --widget-color-fg-secondary: #5A5A6C;
  --widget-color-icon: #747488;
  --widget-color-accent: #4A4AA8;
  --widget-color-on-accent: #FFFFFF;
  --widget-color-surface-subtle: #ECECF2;
  --widget-color-option-border: #747488;
  --widget-color-bubble-a: #ECECF2;
  --widget-color-bubble-b: #F1F2FB;
  --widget-color-highlight: #3B3A8A;
  --widget-color-divider: #DCDCE6;
  --widget-color-feedback-correct-bg: #EAF7EF;
  --widget-color-feedback-correct-fg: #17603C;
  --widget-color-feedback-correct-border: #1F7A4C;
  --widget-color-feedback-incorrect-bg: #FDEEEE;
  --widget-color-feedback-incorrect-fg: #8C2424;
  --widget-color-feedback-incorrect-border: #B02E2E;
  --widget-color-pro-bg: #FFF9EB;
  --widget-color-pro-fg: #7C5816;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-surface-canvas: #0F0E1E;
    --color-surface-default: #171629;
    --color-surface-raised: #1E1D33;
    --color-surface-sunken: #27263D;
    --color-surface-accent: #1F1E4A;
    --color-surface-inverse: #ECECF2;
    --color-surface-brand: #1F1E4A;
    --color-text-primary: #F5F5F9;
    --color-text-secondary: #B9B8D0;
    --color-text-disabled: #6C6B8C;
    --color-text-inverse: #1A1A24;
    --color-text-on-accent: #141331;
    --color-text-accent: #A6ACE6;
    --color-text-highlight: #C7CBEF;
    --color-icon-primary: #ECECF2;
    --color-icon-secondary: #8F8EAD;
    --color-icon-accent: #A6ACE6;
    --color-accent-default: #A6ACE6;
    --color-accent-pressed: #C7CBEF;
    --color-accent-subtle: #2D2C6B;
    --color-accent-on-subtle: #E3E5F7;
    --color-border-subtle: #36354F;
    --color-border-strong: #6C6B8C;
    --color-border-selected: #A6ACE6;
    --color-border-focus: #C7CBEF;
    --color-feedback-correct-fg: #A6DBBA;
    --color-feedback-correct-bg: #07231A;
    --color-feedback-correct-border: #4FB07A;
    --color-feedback-correct-solid: #7CC99A;
    --color-feedback-correct-on-solid: #07231A;
    --color-feedback-incorrect-fg: #F4B3B3;
    --color-feedback-incorrect-bg: #300D0F;
    --color-feedback-incorrect-border: #E36464;
    --color-feedback-incorrect-solid: #EE8C8C;
    --color-feedback-incorrect-on-solid: #300D0F;
    --color-feedback-warning-fg: #F9D08A;
    --color-feedback-warning-bg: #2A1904;
    --color-feedback-warning-border: #EE9A22;
    --color-feedback-info-fg: #C7CBEF;
    --color-feedback-info-bg: #141331;
    --color-feedback-info-border: #8187D6;
    --color-feedback-info-solid: #A6ACE6;
    --color-feedback-info-on-solid: #141331;
    --color-pro-fg: #F2CB66;
    --color-pro-bg: #3D2C0F;
    --color-pro-border: #E6B23F;
    --color-brand-symbol: #FBFBFD;
    --color-brand-wordmark: #FBFBFD;
    --color-brand-moon: #F2CB66;
    --color-stage-track: #8F8EAD;
    --color-stage-fill: #A6ACE6;
    --color-stage-learned: #F2CB66;
    --color-overlay-scrim: rgb(0 0 0 / 0.56);
    --color-overlay-pressed: rgb(255 255 255 / 0.12);
    --color-shadow-ambient: rgb(0 0 0 / 0.32);
    --color-shadow-key: rgb(0 0 0 / 0.16);
    --elevation-1: 0px 1px 2px 0px rgb(0 0 0 / 0.16), 0px 1px 3px 0px rgb(0 0 0 / 0.32);
    --elevation-2: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
    --elevation-3: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
    --button-primary-bg: #A6ACE6;
    --button-primary-bg-pressed: #C7CBEF;
    --button-primary-fg: #141331;
    --button-secondary-bg: #171629;
    --button-secondary-border: #6C6B8C;
    --button-secondary-fg: #A6ACE6;
    --button-tertiary-fg: #A6ACE6;
    --button-destructive-bg: #EE8C8C;
    --button-destructive-fg: #300D0F;
    --card-bg: #171629;
    --card-elevation: 0px 1px 2px 0px rgb(0 0 0 / 0.16), 0px 1px 3px 0px rgb(0 0 0 / 0.32);
    --card-active-bg: #1E1D33;
    --card-active-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
    --list-row-divider: #36354F;
    --quiz-option-default-bg: #171629;
    --quiz-option-default-border: #6C6B8C;
    --quiz-option-default-fg: #F5F5F9;
    --quiz-option-correct-bg: #07231A;
    --quiz-option-correct-border: #4FB07A;
    --quiz-option-correct-fg: #F5F5F9;
    --quiz-option-correct-symbol: #A6DBBA;
    --quiz-option-incorrect-bg: #300D0F;
    --quiz-option-incorrect-border: #E36464;
    --quiz-option-incorrect-fg: #F5F5F9;
    --quiz-option-incorrect-symbol: #F4B3B3;
    --quiz-option-dimmed-bg: #171629;
    --quiz-option-dimmed-border: #36354F;
    --quiz-option-dimmed-fg: #B9B8D0;
    --chip-default-bg: #171629;
    --chip-default-border: #6C6B8C;
    --chip-default-fg: #F5F5F9;
    --chip-selected-bg: #2D2C6B;
    --chip-selected-border: #A6ACE6;
    --chip-selected-fg: #E3E5F7;
    --input-bg: #27263D;
    --input-border: #6C6B8C;
    --input-border-focus: #C7CBEF;
    --input-placeholder: #B9B8D0;
    --tab-bar-bg: #171629;
    --tab-bar-divider: #36354F;
    --tab-bar-active: #A6ACE6;
    --tab-bar-inactive: #8F8EAD;
    --bubble-a-bg: #27263D;
    --bubble-a-fg: #F5F5F9;
    --bubble-b-bg: #1F1E4A;
    --bubble-b-fg: #F5F5F9;
    --bubble-highlight: #C7CBEF;
    --banner-warning-bg: #2A1904;
    --banner-warning-border: #EE9A22;
    --banner-warning-fg: #F9D08A;
    --banner-info-bg: #141331;
    --banner-info-border: #8187D6;
    --banner-info-fg: #C7CBEF;
    --banner-error-bg: #300D0F;
    --banner-error-border: #E36464;
    --banner-error-fg: #F4B3B3;
    --stage-track: #8F8EAD;
    --stage-fill: #A6ACE6;
    --stage-learned: #F2CB66;
    --goal-ring-track: #27263D;
    --goal-ring-fill: #A6ACE6;
    --goal-ring-complete: #7CC99A;
    --focus-ring-color: #C7CBEF;
    --sheet-bg: #1E1D33;
    --sheet-scrim: rgb(0 0 0 / 0.56);
    --sheet-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
    --header-bg: #0F0E1E;
    --nav-bar-android-bg: #171629;
    --nav-bar-android-indicator: #2D2C6B;
    --nav-bar-android-active: #E3E5F7;
    --nav-bar-android-inactive: #8F8EAD;
    --toggle-track-on: #A6ACE6;
    --toggle-track-off: #6C6B8C;
    --toggle-thumb: #171629;
    --segmented-track: #27263D;
    --segmented-selected-bg: #2D2C6B;
    --segmented-selected-fg: #E3E5F7;
    --segmented-fg: #B9B8D0;
    --progress-track: #27263D;
    --progress-fill: #A6ACE6;
    --skeleton-bg: #27263D;
    --flashcard-bg: #171629;
    --flashcard-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
    --feedback-panel-correct-bg: #07231A;
    --feedback-panel-correct-border: #4FB07A;
    --feedback-panel-correct-title: #A6DBBA;
    --feedback-panel-incorrect-bg: #300D0F;
    --feedback-panel-incorrect-border: #E36464;
    --feedback-panel-incorrect-title: #F4B3B3;
    --dialog-bg: #1E1D33;
    --dialog-scrim: rgb(0 0 0 / 0.56);
    --dialog-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
    --widget-color-bg: #171629;
    --widget-color-bg-brand: #1F1E4A;
    --widget-color-fg: #F5F5F9;
    --widget-color-fg-secondary: #B9B8D0;
    --widget-color-icon: #8F8EAD;
    --widget-color-accent: #A6ACE6;
    --widget-color-on-accent: #141331;
    --widget-color-surface-subtle: #27263D;
    --widget-color-option-border: #6C6B8C;
    --widget-color-bubble-a: #27263D;
    --widget-color-bubble-b: #1F1E4A;
    --widget-color-highlight: #C7CBEF;
    --widget-color-divider: #36354F;
    --widget-color-feedback-correct-bg: #07231A;
    --widget-color-feedback-correct-fg: #A6DBBA;
    --widget-color-feedback-correct-border: #4FB07A;
    --widget-color-feedback-incorrect-bg: #300D0F;
    --widget-color-feedback-incorrect-fg: #F4B3B3;
    --widget-color-feedback-incorrect-border: #E36464;
    --widget-color-pro-bg: #3D2C0F;
    --widget-color-pro-fg: #F2CB66;
  }
}

[data-theme="dark"] {
  color-scheme: dark;
  --color-surface-canvas: #0F0E1E;
  --color-surface-default: #171629;
  --color-surface-raised: #1E1D33;
  --color-surface-sunken: #27263D;
  --color-surface-accent: #1F1E4A;
  --color-surface-inverse: #ECECF2;
  --color-surface-brand: #1F1E4A;
  --color-text-primary: #F5F5F9;
  --color-text-secondary: #B9B8D0;
  --color-text-disabled: #6C6B8C;
  --color-text-inverse: #1A1A24;
  --color-text-on-accent: #141331;
  --color-text-accent: #A6ACE6;
  --color-text-highlight: #C7CBEF;
  --color-icon-primary: #ECECF2;
  --color-icon-secondary: #8F8EAD;
  --color-icon-accent: #A6ACE6;
  --color-accent-default: #A6ACE6;
  --color-accent-pressed: #C7CBEF;
  --color-accent-subtle: #2D2C6B;
  --color-accent-on-subtle: #E3E5F7;
  --color-border-subtle: #36354F;
  --color-border-strong: #6C6B8C;
  --color-border-selected: #A6ACE6;
  --color-border-focus: #C7CBEF;
  --color-feedback-correct-fg: #A6DBBA;
  --color-feedback-correct-bg: #07231A;
  --color-feedback-correct-border: #4FB07A;
  --color-feedback-correct-solid: #7CC99A;
  --color-feedback-correct-on-solid: #07231A;
  --color-feedback-incorrect-fg: #F4B3B3;
  --color-feedback-incorrect-bg: #300D0F;
  --color-feedback-incorrect-border: #E36464;
  --color-feedback-incorrect-solid: #EE8C8C;
  --color-feedback-incorrect-on-solid: #300D0F;
  --color-feedback-warning-fg: #F9D08A;
  --color-feedback-warning-bg: #2A1904;
  --color-feedback-warning-border: #EE9A22;
  --color-feedback-info-fg: #C7CBEF;
  --color-feedback-info-bg: #141331;
  --color-feedback-info-border: #8187D6;
  --color-feedback-info-solid: #A6ACE6;
  --color-feedback-info-on-solid: #141331;
  --color-pro-fg: #F2CB66;
  --color-pro-bg: #3D2C0F;
  --color-pro-border: #E6B23F;
  --color-brand-symbol: #FBFBFD;
  --color-brand-wordmark: #FBFBFD;
  --color-brand-moon: #F2CB66;
  --color-stage-track: #8F8EAD;
  --color-stage-fill: #A6ACE6;
  --color-stage-learned: #F2CB66;
  --color-overlay-scrim: rgb(0 0 0 / 0.56);
  --color-overlay-pressed: rgb(255 255 255 / 0.12);
  --color-shadow-ambient: rgb(0 0 0 / 0.32);
  --color-shadow-key: rgb(0 0 0 / 0.16);
  --elevation-1: 0px 1px 2px 0px rgb(0 0 0 / 0.16), 0px 1px 3px 0px rgb(0 0 0 / 0.32);
  --elevation-2: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
  --elevation-3: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
  --button-primary-bg: #A6ACE6;
  --button-primary-bg-pressed: #C7CBEF;
  --button-primary-fg: #141331;
  --button-secondary-bg: #171629;
  --button-secondary-border: #6C6B8C;
  --button-secondary-fg: #A6ACE6;
  --button-tertiary-fg: #A6ACE6;
  --button-destructive-bg: #EE8C8C;
  --button-destructive-fg: #300D0F;
  --card-bg: #171629;
  --card-elevation: 0px 1px 2px 0px rgb(0 0 0 / 0.16), 0px 1px 3px 0px rgb(0 0 0 / 0.32);
  --card-active-bg: #1E1D33;
  --card-active-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
  --list-row-divider: #36354F;
  --quiz-option-default-bg: #171629;
  --quiz-option-default-border: #6C6B8C;
  --quiz-option-default-fg: #F5F5F9;
  --quiz-option-correct-bg: #07231A;
  --quiz-option-correct-border: #4FB07A;
  --quiz-option-correct-fg: #F5F5F9;
  --quiz-option-correct-symbol: #A6DBBA;
  --quiz-option-incorrect-bg: #300D0F;
  --quiz-option-incorrect-border: #E36464;
  --quiz-option-incorrect-fg: #F5F5F9;
  --quiz-option-incorrect-symbol: #F4B3B3;
  --quiz-option-dimmed-bg: #171629;
  --quiz-option-dimmed-border: #36354F;
  --quiz-option-dimmed-fg: #B9B8D0;
  --chip-default-bg: #171629;
  --chip-default-border: #6C6B8C;
  --chip-default-fg: #F5F5F9;
  --chip-selected-bg: #2D2C6B;
  --chip-selected-border: #A6ACE6;
  --chip-selected-fg: #E3E5F7;
  --input-bg: #27263D;
  --input-border: #6C6B8C;
  --input-border-focus: #C7CBEF;
  --input-placeholder: #B9B8D0;
  --tab-bar-bg: #171629;
  --tab-bar-divider: #36354F;
  --tab-bar-active: #A6ACE6;
  --tab-bar-inactive: #8F8EAD;
  --bubble-a-bg: #27263D;
  --bubble-a-fg: #F5F5F9;
  --bubble-b-bg: #1F1E4A;
  --bubble-b-fg: #F5F5F9;
  --bubble-highlight: #C7CBEF;
  --banner-warning-bg: #2A1904;
  --banner-warning-border: #EE9A22;
  --banner-warning-fg: #F9D08A;
  --banner-info-bg: #141331;
  --banner-info-border: #8187D6;
  --banner-info-fg: #C7CBEF;
  --banner-error-bg: #300D0F;
  --banner-error-border: #E36464;
  --banner-error-fg: #F4B3B3;
  --stage-track: #8F8EAD;
  --stage-fill: #A6ACE6;
  --stage-learned: #F2CB66;
  --goal-ring-track: #27263D;
  --goal-ring-fill: #A6ACE6;
  --goal-ring-complete: #7CC99A;
  --focus-ring-color: #C7CBEF;
  --sheet-bg: #1E1D33;
  --sheet-scrim: rgb(0 0 0 / 0.56);
  --sheet-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
  --header-bg: #0F0E1E;
  --nav-bar-android-bg: #171629;
  --nav-bar-android-indicator: #2D2C6B;
  --nav-bar-android-active: #E3E5F7;
  --nav-bar-android-inactive: #8F8EAD;
  --toggle-track-on: #A6ACE6;
  --toggle-track-off: #6C6B8C;
  --toggle-thumb: #171629;
  --segmented-track: #27263D;
  --segmented-selected-bg: #2D2C6B;
  --segmented-selected-fg: #E3E5F7;
  --segmented-fg: #B9B8D0;
  --progress-track: #27263D;
  --progress-fill: #A6ACE6;
  --skeleton-bg: #27263D;
  --flashcard-bg: #171629;
  --flashcard-elevation: 0px 2px 4px 0px rgb(0 0 0 / 0.16), 0px 6px 16px 0px rgb(0 0 0 / 0.32);
  --feedback-panel-correct-bg: #07231A;
  --feedback-panel-correct-border: #4FB07A;
  --feedback-panel-correct-title: #A6DBBA;
  --feedback-panel-incorrect-bg: #300D0F;
  --feedback-panel-incorrect-border: #E36464;
  --feedback-panel-incorrect-title: #F4B3B3;
  --dialog-bg: #1E1D33;
  --dialog-scrim: rgb(0 0 0 / 0.56);
  --dialog-elevation: 0px 4px 8px 0px rgb(0 0 0 / 0.16), 0px 12px 32px 0px rgb(0 0 0 / 0.32);
  --widget-color-bg: #171629;
  --widget-color-bg-brand: #1F1E4A;
  --widget-color-fg: #F5F5F9;
  --widget-color-fg-secondary: #B9B8D0;
  --widget-color-icon: #8F8EAD;
  --widget-color-accent: #A6ACE6;
  --widget-color-on-accent: #141331;
  --widget-color-surface-subtle: #27263D;
  --widget-color-option-border: #6C6B8C;
  --widget-color-bubble-a: #27263D;
  --widget-color-bubble-b: #1F1E4A;
  --widget-color-highlight: #C7CBEF;
  --widget-color-divider: #36354F;
  --widget-color-feedback-correct-bg: #07231A;
  --widget-color-feedback-correct-fg: #A6DBBA;
  --widget-color-feedback-correct-border: #4FB07A;
  --widget-color-feedback-incorrect-bg: #300D0F;
  --widget-color-feedback-incorrect-fg: #F4B3B3;
  --widget-color-feedback-incorrect-border: #E36464;
  --widget-color-pro-bg: #3D2C0F;
  --widget-color-pro-fg: #F2CB66;
}

.script-cjk { --script-lh: var(--script-line-height-multiplier-cjk); }
.script-tall { --script-lh: var(--script-line-height-multiplier-tall); }

.t-display {
  font-family: var(--typography-display-family);
  font-size: calc(var(--typography-display-size) * var(--text-scale));
  font-weight: var(--typography-display-weight);
  line-height: calc(var(--typography-display-line-height) * var(--script-lh));
  letter-spacing: var(--typography-display-letter-spacing);
}
.t-title-1 {
  font-family: var(--typography-title-1-family);
  font-size: calc(var(--typography-title-1-size) * var(--text-scale));
  font-weight: var(--typography-title-1-weight);
  line-height: calc(var(--typography-title-1-line-height) * var(--script-lh));
  letter-spacing: var(--typography-title-1-letter-spacing);
}
.t-title-2 {
  font-family: var(--typography-title-2-family);
  font-size: calc(var(--typography-title-2-size) * var(--text-scale));
  font-weight: var(--typography-title-2-weight);
  line-height: calc(var(--typography-title-2-line-height) * var(--script-lh));
  letter-spacing: var(--typography-title-2-letter-spacing);
}
.t-title-3 {
  font-family: var(--typography-title-3-family);
  font-size: calc(var(--typography-title-3-size) * var(--text-scale));
  font-weight: var(--typography-title-3-weight);
  line-height: calc(var(--typography-title-3-line-height) * var(--script-lh));
  letter-spacing: var(--typography-title-3-letter-spacing);
}
.t-headline {
  font-family: var(--typography-headline-family);
  font-size: calc(var(--typography-headline-size) * var(--text-scale));
  font-weight: var(--typography-headline-weight);
  line-height: calc(var(--typography-headline-line-height) * var(--script-lh));
  letter-spacing: var(--typography-headline-letter-spacing);
}
.t-body {
  font-family: var(--typography-body-family);
  font-size: calc(var(--typography-body-size) * var(--text-scale));
  font-weight: var(--typography-body-weight);
  line-height: calc(var(--typography-body-line-height) * var(--script-lh));
  letter-spacing: var(--typography-body-letter-spacing);
}
.t-body-strong {
  font-family: var(--typography-body-strong-family);
  font-size: calc(var(--typography-body-strong-size) * var(--text-scale));
  font-weight: var(--typography-body-strong-weight);
  line-height: calc(var(--typography-body-strong-line-height) * var(--script-lh));
  letter-spacing: var(--typography-body-strong-letter-spacing);
}
.t-subhead {
  font-family: var(--typography-subhead-family);
  font-size: calc(var(--typography-subhead-size) * var(--text-scale));
  font-weight: var(--typography-subhead-weight);
  line-height: calc(var(--typography-subhead-line-height) * var(--script-lh));
  letter-spacing: var(--typography-subhead-letter-spacing);
}
.t-footnote {
  font-family: var(--typography-footnote-family);
  font-size: calc(var(--typography-footnote-size) * var(--text-scale));
  font-weight: var(--typography-footnote-weight);
  line-height: calc(var(--typography-footnote-line-height) * var(--script-lh));
  letter-spacing: var(--typography-footnote-letter-spacing);
}
.t-caption {
  font-family: var(--typography-caption-family);
  font-size: calc(var(--typography-caption-size) * var(--text-scale));
  font-weight: var(--typography-caption-weight);
  line-height: calc(var(--typography-caption-line-height) * var(--script-lh));
  letter-spacing: var(--typography-caption-letter-spacing);
}
.t-button {
  font-family: var(--typography-button-family);
  font-size: calc(var(--typography-button-size) * var(--text-scale));
  font-weight: var(--typography-button-weight);
  line-height: calc(var(--typography-button-line-height) * var(--script-lh));
  letter-spacing: var(--typography-button-letter-spacing);
}
.t-counter {
  font-family: var(--typography-counter-family);
  font-size: calc(var(--typography-counter-size) * var(--text-scale));
  font-weight: var(--typography-counter-weight);
  line-height: calc(var(--typography-counter-line-height) * var(--script-lh));
  letter-spacing: var(--typography-counter-letter-spacing);
}
.t-content-term-hero {
  font-family: var(--typography-content-term-hero-family);
  font-size: calc(var(--typography-content-term-hero-size) * var(--text-scale));
  font-weight: var(--typography-content-term-hero-weight);
  line-height: calc(var(--typography-content-term-hero-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-term-hero-letter-spacing);
}
.t-content-term {
  font-family: var(--typography-content-term-family);
  font-size: calc(var(--typography-content-term-size) * var(--text-scale));
  font-weight: var(--typography-content-term-weight);
  line-height: calc(var(--typography-content-term-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-term-letter-spacing);
}
.t-content-sentence {
  font-family: var(--typography-content-sentence-family);
  font-size: calc(var(--typography-content-sentence-size) * var(--text-scale));
  font-weight: var(--typography-content-sentence-weight);
  line-height: calc(var(--typography-content-sentence-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-sentence-letter-spacing);
}
.t-content-translation {
  font-family: var(--typography-content-translation-family);
  font-size: calc(var(--typography-content-translation-size) * var(--text-scale));
  font-weight: var(--typography-content-translation-weight);
  line-height: calc(var(--typography-content-translation-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-translation-letter-spacing);
}
.t-content-dialogue {
  font-family: var(--typography-content-dialogue-family);
  font-size: calc(var(--typography-content-dialogue-size) * var(--text-scale));
  font-weight: var(--typography-content-dialogue-weight);
  line-height: calc(var(--typography-content-dialogue-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-dialogue-letter-spacing);
}
.t-content-option {
  font-family: var(--typography-content-option-family);
  font-size: calc(var(--typography-content-option-size) * var(--text-scale));
  font-weight: var(--typography-content-option-weight);
  line-height: calc(var(--typography-content-option-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-option-letter-spacing);
}
.t-content-phonetic {
  font-family: var(--typography-content-phonetic-family);
  font-size: calc(var(--typography-content-phonetic-size) * var(--text-scale));
  font-weight: var(--typography-content-phonetic-weight);
  line-height: calc(var(--typography-content-phonetic-line-height) * var(--script-lh));
  letter-spacing: var(--typography-content-phonetic-letter-spacing);
}