:root {
    --font-sans: 'Manrope', 'Segoe UI', sans-serif;
    --font-display: 'Fraunces', Georgia, serif;

    --bg: #07111f;
    --bg-2: #0d1b2d;
    --surface: #13253d;
    --surface-2: #1b324f;
    --surface-3: #203b5e;
    --text: #ecf3ff;
    --muted: #a8bedc;
    --line: rgba(176, 201, 234, 0.24);

    --primary: #0fa3b1;
    --primary-strong: #1dc7d6;
    --secondary: #f4b942;
    --danger: #ef6461;
    --success: #1db954;

    /* Slightly softer shadows so cards feel lighter */
    --shadow-soft: 0 12px 26px rgba(5, 11, 20, 0.28);
    --shadow-float: 0 22px 48px rgba(3, 7, 14, 0.38);

    --radius-xs: 8px;
    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 24px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 28px;
    --space-7: 36px;
    --space-8: 48px;
    --space-9: 64px;

    --text-xs: 12px;
    --text-sm: 14px;
    --text-md: 16px;
    --text-lg: 19px;
    --text-xl: 28px;
    --text-2xl: 38px;
}

:root[data-theme='light'] {
    --bg: #eef3f9;
    --bg-2: #ffffff;
    --surface: #ffffff;
    --surface-2: #f5f8fd;
    --surface-3: #edf2fa;
    --text: #0f1b2e;
    --muted: #42576f;
    --line: rgba(39, 60, 85, 0.14);

    --primary: #006d77;
    --primary-strong: #018f9b;
    --secondary: #d97b00;
    --danger: #bf3f3c;
    --success: #187b3a;

    --shadow-soft: 0 10px 22px rgba(21, 41, 64, 0.08);
    --shadow-float: 0 20px 48px rgba(19, 35, 55, 0.12);
}