/*
 * Material 3 (M3) Design Tokens - EXPRESSIVE
 * Schema: Dark Theme
 * Generated by a Principal UI/UX Designer
 * DO NOT EDIT MANUALLY
*/

:root {
    /* -- Font Family */
    --md-sys-font-family-name: 'Roboto';

    /* -- Elevation (Shadows) - NEW Expressive Style (Bible 1.4.1) */
    --md-sys-elevation-level0: none;
    --md-sys-elevation-level1: 0 4px 8px -2px rgba(0,0,0,0.2), 0 2px 4px -2px rgba(0,0,0,0.12);
    --md-sys-elevation-level2: 0 8px 16px -4px rgba(0,0,0,0.2), 0 4px 6px -2px rgba(0,0,0,0.1);
    --md-sys-elevation-level3: 0 12px 24px -4px rgba(0,0,0,0.22), 0 8px 12px -4px rgba(0,0,0,0.12);
    --md-sys-elevation-level4: 0 16px 32px -6px rgba(0,0,0,0.22), 0 10px 16px -4px rgba(0,0,0,0.12);
    --md-sys-elevation-level5: 0 24px 48px -8px rgba(0,0,0,0.25), 0 12px 20px -6px rgba(0,0,0,0.15);

    /* -- Shape (Border Radius) - NEW Expressive Scale (Bible 1.2.1) */
    --md-sys-shape-none: 0px;
    --md-sys-shape-corner-xs: 8px; /* Mapped to old extra-small */
    --md-sys-shape-corner-s: 12px; /* Mapped to old small */
    --md-sys-shape-corner-m: 16px; /* Mapped to old medium */
    --md-sys-shape-corner-l: 20px; /* Mapped to old large */
    --md-sys-shape-corner-xl: 28px; /* Mapped to old extra-large */
    --md-sys-shape-corner-full: 9999px; /* Mapped to old full */

    /* For compatibility with existing CSS classes until full refactor */
    --md-sys-shape-extra-small: var(--md-sys-shape-corner-xs);
    --md-sys-shape-small: var(--md-sys-shape-corner-s);
    --md-sys-shape-medium: var(--md-sys-shape-corner-m);
    --md-sys-shape-large: var(--md-sys-shape-corner-l);
    --md-sys-shape-extra-large: var(--md-sys-shape-corner-xl);
    --md-sys-shape-full: var(--md-sys-shape-corner-full);

    /* -- Motion (Bible 3.2) */
    --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1.0);
    --md-sys-motion-duration-short: 200ms;
    --md-sys-motion-duration-medium: 400ms;

    /* -- Color Palette (Dark Theme) - UPDATED TO EXPRESSIVE PURPLE */
    --md-sys-color-primary: #D0BCFF;
    --md-sys-color-primary-rgb: 208, 188, 255; /* For rgba() usage */
    --md-sys-color-on-primary: #381E72;
    --md-sys-color-primary-container: #4F378B;
    --md-sys-color-on-primary-container: #EADDFF;
    --md-sys-color-secondary: #CCC2DC;
    --md-sys-color-on-secondary: #332D41;
    --md-sys-color-secondary-container: #4A4458;
    --md-sys-color-on-secondary-container: #E8DEF8;
    --md-sys-color-tertiary: #EFB8C8;
    --md-sys-color-on-tertiary: #492532;
    --md-sys-color-tertiary-container: #633B48;
    --md-sys-color-on-tertiary-container: #FFD8E4;
    --md-sys-color-error: #F2B8B5;
    --md-sys-color-on-error: #601410;
    --md-sys-color-error-container: #8C1D18;
    --md-sys-color-on-error-container: #F9DEDC;
    --md-sys-color-background: #141218; /* Slightly darker for more depth */
    --md-sys-color-on-background: #E6E1E5;
    --md-sys-color-surface: #141218;
    --md-sys-color-on-surface: #E6E1E5;
    --md-sys-color-surface-variant: #49454F;
    --md-sys-color-on-surface-variant: #CAC4D0;
    --md-sys-color-outline: #938F99;
    --md-sys-color-outline-variant: #49454F;
    --md-sys-color-shadow: #000000;
    --md-sys-color-scrim: #000000;
    --md-sys-color-inverse-surface: #E6E1E5;
    --md-sys-color-inverse-on-surface: #313033;
    --md-sys-color-inverse-primary: #6750A4;
    --md-sys-color-surface-dim: #141216;
    --md-sys-color-surface-bright: #3A383D;
    --md-sys-color-surface-container-lowest: #0F0D11;
    --md-sys-color-surface-container-low: #1C1B1F;
    --md-sys-color-surface-container: #201F23;
    --md-sys-color-surface-container-high: #2B292D;
    --md-sys-color-surface-container-highest: #363438;

    /* -- Typography Roles - NEW Expressive Style (Bible 1.3.2) */
    /* Display */
    --md-sys-typescale-display-large-font: var(--md-sys-font-family-name);
    --md-sys-typescale-display-large-size: 57px;
    --md-sys-typescale-display-large-weight: 700; /* Bolder */
    --md-sys-typescale-display-large-line-height: 64px;

    /* Headline */
    --md-sys-typescale-headline-medium-font: var(--md-sys-font-family-name);
    --md-sys-typescale-headline-medium-size: 28px;
    --md-sys-typescale-headline-medium-weight: 700; /* Bolder */
    --md-sys-typescale-headline-medium-line-height: 36px;

    /* Title */
    --md-sys-typescale-title-large-font: var(--md-sys-font-family-name);
    --md-sys-typescale-title-large-size: 22px;
    --md-sys-typescale-title-large-weight: 700; /* Bolder */
    --md-sys-typescale-title-large-line-height: 28px;

    /* Label */
    --md-sys-typescale-label-large-font: var(--md-sys-font-family-name);
    --md-sys-typescale-label-large-size: 14px;
    --md-sys-typescale-label-large-weight: 500;
    --md-sys-typescale-label-large-line-height: 20px;

    /* Body */
    --md-sys-typescale-body-large-font: var(--md-sys-font-family-name);
    --md-sys-typescale-body-large-size: 16px;
    --md-sys-typescale-body-large-weight: 400;
    --md-sys-typescale-body-large-line-height: 24px;

    --md-sys-typescale-body-medium-font: var(--md-sys-font-family-name);
    --md-sys-typescale-body-medium-size: 14px;
    --md-sys-typescale-body-medium-weight: 400;
    --md-sys-typescale-body-medium-line-height: 20px;

    /* -- Component-Specific Tokens */
    --comp-progress-ring-size: 120px;
    --comp-progress-ring-stroke: 12px;
}