:root {
    --header-height: 68px;
    --header-offset: calc(var(--header-height) + 1px + env(safe-area-inset-top, 0px));
    --primary: #E53935;
    --primary-dark: #C62828;
    --primary-light: #FFEBEE;
    --dark: #1A1A2E;
    --white: #FFFFFF;
    --light: #F8F9FA;
    --gray: #6C757D;
    --gray-light: #E9ECEF;
    --gray-lighter: #F1F3F5;
    --blue: #1565C0;
    --blue-light: #E3F2FD;
    --green: #2E7D32;
    --green-light: #E8F5E9;
    --orange: #F57C00;
    --yellow: #FFC107;
    --yellow-dark: #FFB300;
    --purple: #7B1FA2;
    --purple-light: #F3E5F5;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}