:root {
    --font-thin: 100;
    --font-extralight: 200;
    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;

    /* Brand colours stay constant across themes. Mud's dark palette intentionally
       uses a light Primary, so it must not be used for navy brand surfaces. */
    --BM-Primary-Navy: #002974;
    --BM-Secondary-Dark-Navy: #00215d;
    --BM-Supporting-Gray-1: #f8f8f8;
    --BM-Supporting-Gray-2: #ecedee;
    --BM-Supporting-Gray-3: #d2d3d4;
    --BM-Supporting-White: #ffffff;
    --BM-Supporting-Black: #000000;

    --primary: var(--mud-palette-primary, #002974);
    --primary-dark: #00215d;
    --primary-light: var(--mud-palette-primary-lighten, #80b3e0);
    --bg-main: var(--mud-palette-background, #ffffff);
    --bg-secondary: var(--mud-palette-background-gray, #f8fafc);
    --bg-card: var(--mud-palette-surface, #ffffff);
    --border: var(--mud-palette-lines-default, #e2e8f0);
    --text-primary: var(--mud-palette-text-primary, #0f172a);
    --text-secondary: var(--mud-palette-text-secondary, #475569);
    --text-muted: var(--mud-palette-text-disabled, #94a3b8);
    --success: var(--mud-palette-success, #00695a);
    --input-bg: var(--mud-palette-background-gray, #f8fafc);
    --shadow-sm: var(--mud-elevation-1, 0 1px 3px rgba(0, 0, 0, 0.1));
    --shadow-md: var(--mud-elevation-4, 0 4px 6px rgba(0, 0, 0, 0.1));
    --shadow-lg: var(--mud-elevation-8, 0 10px 25px rgba(0, 0, 0, 0.1));
    --gradient-bg: radial-gradient(circle at 20% 50%, color-mix(in srgb, var(--primary) 8%, transparent) 0%, transparent 50%);
    --gradient-primary: linear-gradient(135deg, #002974 0%, #0047ab 100%);
    --gradient-secondary: linear-gradient(135deg, #9e9eb2 0%, #6c6c80 100%);
    --gradient-success: linear-gradient(135deg, #00695a 0%, #33cba9 100%);
    --icon-gradient-primary: var(--gradient-primary);
    --icon-gradient-secondary: var(--gradient-secondary);
}