:root {
    --bg-main: #f5f7ff;
    --bg-content: #ffffff;
    --text-main: #3a3f5a;
    --text-muted: #8a8fa8;
    --accent: #7c6fd4;
    --accent-light: #c5c3f0;
    --accent-pale: #eeedfb;
    --border: #d5d8f0;
    --shadow: 0 8px 30px rgba(160, 150, 220, 0.1);
    --radius: 25px;

    --bg-glow-1: rgba(180, 170, 240, 0.2);
    --bg-glow-2: rgba(150, 200, 255, 0.15);
    --bg-pattern: url('data:image/svg+xml,%3Csvg width="80" height="80" xmlns="http://www.w3.org/2000/svg"%3E%3Ccircle cx="10" cy="10" r="1" fill="%23a0a8d0" opacity="0.4"/%3E%3Ccircle cx="50" cy="30" r="1.5" fill="%23a0a8d0" opacity="0.3"/%3E%3Ccircle cx="70" cy="60" r="1" fill="%23a0a8d0" opacity="0.2"/%3E%3C/svg%3E');
    --header-icon: '🌙';
    --title-shadow: 0 1px 3px rgba(124, 111, 212, 0.1);

    --input-bg: #ffffff;
    --input-bg-focus: #ffffff;
    --focus-shadow: rgba(124, 111, 212, 0.1);
    --button-bg: linear-gradient(135deg, #a99cf0, #8f80e0);
    --button-bg-hover: linear-gradient(135deg, #8f80e0, #7567cc);
    --button-text: #ffffff;
    --button-shadow: 0 8px 20px rgba(143, 128, 224, 0.3);
    --button-shadow-hover: 0 12px 25px rgba(143, 128, 224, 0.4);

    --card-bg: #ffffff;
    --card-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    --card-shadow-hover: 0 12px 30px rgba(160, 150, 220, 0.2);
    --info-bg: #f9f9ff;
}
