:root {
    --color-bg: #ffffff;
    --color-bg-secondary: #d4d4d4;
    --color-bg-secondary-light: rgb(0 0 0 / 3%);
    --color-purple: #dde0ff;
    --color-purple-hover: #adb1da;

    --color-black: #333333;
    --color-black-dark: #1f1f1f;

    /* --color-accent: #d1fa94;
    --color-accent-hover: #baeb72; */

    --color-accent: #dde0ff;
    --color-accent-hover: #adb1da;
    --color-accent2: #d1fa94;

    /* Границы и тени */
  
    --border-color-grey: #e0e0e0;
    --border-color-green: #b0e365;
    --border-color-purple: #8c91c5;

    /* Дополнительные цвета */

    --color-red: rgb(219, 59, 59);
    --color-blue: rgb(59, 123, 219);
    

    /* Отступы */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 32px;
    --spacing-xl: 64px;

    /* Шрифты */
    --font-main: 'Inter', sans-serif;
    --font-title: 'IBM Plex Sans', sans-serif;
    --font-capital: 'Pacifico', sans-serif;
    --font-pixel: "Tiny5", sans-serif;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-lg: 20px;
    --font-size-xl: 28px;
    --font-size-uxl: 32px;
    --font-size-uuxl: 64px;
    --line-height-base: 1.6;

    /* Анимации */
    --transition-speed: 0.3s;
    --transition-func: ease-in-out;

    /* Скругление */
    --border-radius: 12px;
    --border_radius: 12px;
    --border_radius_small: 8px;
}

/* Основной: "Inter", sans-serif;
Заголовки: "IBM Plex Sans", sans-serif;
Доп(прописной): "Pacifico", cursive; */
/* Пиксельный:font-family: "Tiny5", sans-serif;