:root {
    --white: #FFFFFF;
    --off-white: #F8FAFC;
    --surface: #F1F5F9;
    --border: #E2E8F0;
    --border-dark: #CBD5E1;
    --text-primary: #111827;
    --text-secondary: #4B5563;
    --text-muted: #9CA3AF;
    --cyan: #16C2D5;
    --cyan-dark: #0FA8BA;
    --cyan-light: #E0F9FB;
    --cyan-mid: #CFFAFE;
    --amber: #F5B731;
    --amber-light: #FEF3C7;
    --navy: #0D1B26;
    --green: #10B981;
    --green-light: #D1FAE5;
    --red-light: #FFF8E1;
    --red: #F5B731;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
    --shadow-lg: 0 20px 48px rgba(0,0,0,0.1), 0 8px 16px rgba(0,0,0,0.06);
    --shadow-cyan: 0 8px 32px rgba(22,194,213,0.2);
}