:root {
    --color-bg: #06131f;
    --color-bg-soft: #0a1d2c;
    --color-surface: #0d2638;
    --color-surface-light: #123248;

    --color-primary: #23b9d6;
    --color-primary-light: #61e4d8;
    --color-primary-dark: #1387a4;

    --color-text: #eef9fb;
    --color-text-soft: #b7ccd4;
    --color-muted: #76909b;

    --color-border: rgba(97, 228, 216, 0.16);
    --color-border-strong: rgba(97, 228, 216, 0.28);

    --color-success: #43d59b;
    --color-warning: #f6c85f;
    --color-danger: #ef6b73;

    --gradient-primary: linear-gradient(
        135deg,
        var(--color-primary),
        var(--color-primary-light)
    );

    --gradient-dark: linear-gradient(
        145deg,
        #06131f 0%,
        #0b2235 55%,
        #0d2d43 100%
    );

    --shadow-sm: 0 8px 20px rgba(0, 0, 0, 0.18);
    --shadow-md: 0 16px 40px rgba(0, 0, 0, 0.26);
    --shadow-lg: 0 28px 70px rgba(0, 0, 0, 0.34);

    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-pill: 999px;

    --container-width: 1200px;
    --header-height: 78px;

    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
}