:root {
    /* Brand */
    --color-accent-1: #D24B4B;
    --color-accent-1-hover: #c13939;
    --color-accent-2: #FE994C;
    --color-white: #fff;

    /* Text */
    --color-dark-text: #222223;
    --color-gray-4: #5C626C;
    --color-gray-3: #707680;
    --color-gray-2: #DEE1E5;
    --color-gray-1: #F2F5F5;

    /* Status / badges */
    --color-online: #27AE60;
    --color-offline: #ccc;
    --color-badge-1: #4C9EFE;
    --color-unread: #DC2626;
    --color-unread-new: #F59E0B;
    --color-danger: #c0392b;
    --color-danger-bg: #fdf0ef;
    --color-error: #991b1b;
    --color-error-bg: #fef2f2;
    --color-error-border: #fecaca;
    --color-success: #166534;
    --color-success-bg: #f0fdf4;
    --color-success-border: #bbf7d0;

    /* Radii */
    --radius: 6px;
    --radius-lg: 8px;

    /* Decorative */
    --shadow-card: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);
    --shadow-group: 0 0 10px rgba(0, 0, 0, 0.1);

    /* Typography */
    --font-text: arial;
    --font-heading: arial;
    --font-mono: monospace;

    /* Layout */
    --dialog-width: 500px;
    --page-width: 1044px;
    --mobile-width: 800px;
}