:root {
    --white: #ffffff;
    --neutral-50: #f8fbff;
    --neutral-100: #eef5ff;
    --neutral-200: #d9e7f5;
    --neutral-300: #c0d3e6;
    --neutral-400: #94a3b8;
    --neutral-500: #64748b;
    --neutral-600: #475569;
    --neutral-700: #334155;
    --neutral-800: #0f172a;
    --neutral-900: #04152d;
    --neutral-950: #020617;

    --primary-50: #eff8ff;
    --primary-100: #dff4ff;
    --primary-200: #b9ebff;
    --primary-300: #7dd3fc;
    --primary-400: #38bdf8;
    --primary-500: #38bdf8;
    --primary-600: #0ea5e9;
    --primary-700: #0284c7;
    --primary-800: #0369a1;
    --primary-900: #04152d;
    --primary-950: #020617;

    --primary: #04152d;
    --primary-lifted: #0b2345;
    --primary-accented: #14325a;

    --secondary: #8b5cf6;
    --secondary-lifted: #7c3aed;
    --secondary-accented: #6d28d9;

    --success: #22c55e;
    --success-lifted: #16a34a;
    --success-accented: #15803d;

    --info: #38bdf8;
    --info-lifted: #0ea5e9;
    --info-accented: #0284c7;

    --notice: #8b5cf6;
    --notice-lifted: #7c3aed;
    --notice-accented: #6d28d9;

    --warning: #ef4444;
    --warning-lifted: #dc2626;
    --warning-accented: #b91c1c;

    --error: #ef4444;
    --error-lifted: #dc2626;
    --error-accented: #b91c1c;

    --grayscale: var(--neutral-900);
    --grayscale-lifted: var(--neutral-800);
    --grayscale-accented: var(--neutral-700);

    --neutral: var(--neutral-500);
    --neutral-lifted: var(--neutral-600);
    --neutral-accented: var(--neutral-700);

    --text-inverted: var(--white);
    --text-muted: #64748b;
    --text-lifted: #475569;
    --text-accented: #334155;
    --text: #04152d;

    --border-muted: rgba(217, 231, 245, 0.85);
    --border: rgba(148, 163, 184, 0.32);
    --border-lifted: rgba(148, 163, 184, 0.52);
    --border-accented: rgba(71, 85, 105, 0.8);

    --bg: #ffffff;
    --bg-muted: #f8fbff;
    --bg-lifted: #eef5ff;
    --bg-accented: #d9e7f5;
    --bg-inverted: #04152d;

    --yellow-200: #fff085;
    --yellow-300: #ffdf20;
    --teal-300: #46edd5;
    --teal-400: #00d5be;
    --emerald-300: #5ee9b5;
    --pink-400: #fb64b6;

    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    --outline-sm: 1px;
    --outline-md: 2px;
    --outline-lg: 3px;

    --rounding-sm: 0.75rem;
    --rounding-md: 1rem;
    --rounding-lg: 1.5rem;

    --letter-spacing: 0em;
    --disabled-opacity: 25%;
}

body {
    font-family: "Segoe UI Variable Text", "Aptos", "Trebuchet MS", sans-serif;
}