:root {
    --brand-violet: #6a1bce;
    --brand-blue: #1e88e5;
    --brand-indigo: #4a3bd1;
    --brand-turquoise: #00b9ad;
    --brand-lavender: #9aa4d6;
    --surface: #ffffff;
    --surface-raised: rgba(255, 255, 255, .86);
    --surface-muted: #f5f7fb;
    --surface-soft: #eef4ff;
    --border-color: #dce4f3;
    --border-strong: #c5d0e6;
    --text-color: #142033;
    --text-soft: #657196;
    --text-muted: #8792b1;
    --shadow-sm: 0 10px 24px rgba(27, 41, 78, .07);
    --shadow-md: 0 18px 48px rgba(27, 41, 78, .12);
    --shadow-lg: 0 28px 80px rgba(30, 45, 90, .18);
    --brand-gradient: linear-gradient(135deg, #6a1bce 0%, #4a3bd1 44%, #1e88e5 100%);
    --accent-gradient: linear-gradient(135deg, #00b9ad 0%, #1e88e5 100%);
    --brand-gradient-glow: radial-gradient(circle at 18% 12%, rgba(0, 185, 173, .34), transparent 28%), linear-gradient(135deg, #6a1bce 0%, #4a3bd1 48%, #1e88e5 100%);
    --focus-ring: 0 0 0 .24rem rgba(0, 185, 173, .22);
}

[data-theme="dark"] {
    --surface: #121827;
    --surface-raised: rgba(23, 32, 51, .9);
    --surface-muted: #0b1020;
    --surface-soft: #182239;
    --border-color: #27344f;
    --border-strong: #374867;
    --text-color: #eef3ff;
    --text-soft: #b8c1df;
    --text-muted: #8e9abd;
    --shadow-sm: 0 10px 26px rgba(0, 0, 0, .26);
    --shadow-md: 0 20px 54px rgba(0, 0, 0, .36);
    --shadow-lg: 0 32px 92px rgba(0, 0, 0, .45);
    --brand-gradient-glow: radial-gradient(circle at 18% 12%, rgba(0, 185, 173, .22), transparent 30%), linear-gradient(135deg, #351075 0%, #28206f 52%, #0e4d85 100%);
}