:root {
    /* Размеры страницы и контента */
    --page-min-inline-size: 320px;
    --page-min-block-size: 100dvb;

    /* Общие отступы по макету */
    --page-padding-inline: clamp(16px, 4vw, 48px);
    --page-padding-block: clamp(20px, 5.25vw, 100px);
    --margin-padding-block: 100px;

    --content-width: clamp(
            375px,
            100vw - 2 * var(--page-padding-inline),
            700px
    );

    --mobile-content-width: 100%;

    --font-main: "Inter", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
    --font-accent: "PressStart2P", system-ui, sans-serif;

    /* Веса вариативного шрифта */
    --font-weight-text: 410;
    --font-weight-title: 785;

    /* Цвета */
    --color-bg-base: #FFFFFF;
    --color-text-base: #000000;
    --color-text-on-dark: #ffffff;
    --color-border: #000000;

    /* Кнопки */
    --button-text-color: #ffffff;
    --button-bg-color: #ffffff;
    --button-overlay-color: #000000;

    /* Карточки */
    --card-border-radius: 20px;
    --card-title-padding-inline: 4px;
    --card-title-padding-block: 10px;
    --card-padding-inline: 25px;
    --card-padding-block: 25px;
    --card-gap: 50px;

    /* Цвет обводки текста лейбла */
    --label-text-stroke-color: #ffffff;

    /* Цвета для анимации сердца */
    --contour-color: #000000;
    --animation-fill-color: #ff0000;

    /* Фон страницы: сетка + плавный градиент сверху вниз */
    --page-background-image:
            repeating-linear-gradient(
                    to right,
                    #d3d3d3 0,
                    #d3d3d3 2px,
                    transparent 2px,
                    transparent 4px
            ),
            repeating-linear-gradient(
                    to bottom,
                    #d3d3d3 0,
                    #d3d3d3 2px,
                    transparent 2px,
                    transparent 4px
            ),
            linear-gradient(
                    to bottom,
                    #e7e7e7 0,
                    #e7e7e7 0.01%,
                    #1a1a1a 100%
            );
}