:root {
    --bg-main: #f2f9fb;
    --bg-content: #ffffff;
    --text-main: #2a4a55;
    --text-muted: #7a9aa5;
    --accent: #00acc1;
    --accent-light: #80deea;
    --accent-pale: #e0f7fa;
    --border: #b2ebf2;
    --shadow: 0 8px 30px rgba(0, 172, 193, 0.1);
    --radius: 25px;

    --bg-glow-1: rgba(128, 222, 234, 0.25);
    --bg-glow-2: rgba(0, 172, 193, 0.15);
    --bg-pattern: url('data:image/svg+xml,%3Csvg width="80" height="80" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M20 40 Q30 30 40 40 T60 40" fill="none" stroke="%2380deea" stroke-width="0.8" opacity="0.5"/%3E%3C/svg%3E');
    --header-icon: '🏝️';
    --title-shadow: 0 1px 3px rgba(0, 172, 193, 0.15);

    --input-bg: #ffffff;
    --input-bg-focus: #ffffff;
    --focus-shadow: rgba(0, 172, 193, 0.1);
    --button-bg: linear-gradient(135deg, #4dd0e1, #00acc1);
    --button-bg-hover: linear-gradient(135deg, #00acc1, #00838f);
    --button-text: #ffffff;
    --button-shadow: 0 8px 20px rgba(0, 172, 193, 0.3);
    --button-shadow-hover: 0 12px 25px rgba(0, 172, 193, 0.4);

    --card-bg: #ffffff;
    --card-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    --card-shadow-hover: 0 12px 30px rgba(0, 172, 193, 0.2);
    --info-bg: #f0fafc;
}
