@layer theme {
    :root {
        /* ── Цвета: поверхности ── */
        --bg: #f4f6f9;              /* фон страницы */
        --surface: #fff;            /* панели, карточки */
        --border: #e4e8ef;          /* лёгкие разделители */
        --border-light: #eef1f6;    /* лёгкие разделители */
        --border-hover: #0d4a9e;

        /* ── Цвета: текст ── */
        --ink: #0f1b2d;             /* заголовки, основной текст */
        --ink-mid: #2c3a4a;         /* вторичный текст (темнее — по просьбе о контрасте) */
        --ink-soft: #55636f;        /* подписи, лейблы (темнее — контраст) */

        /* ── Акцент ── */
        --accent: #1a6bcc;          /* основной синий */
        --accent-dark: #0d4a9e;     /* синий при hover */
        --accent-light: #e8f0fb;    /* фон активных элементов */

        /* ── Статусы ── */
        --green: #16a34a;           /* свободно / успех */
        --green-light: #dcfce7;
        --amber: #d97706;           /* резерв / внимание */
        --amber-light: #fef3c7;
        --amber-hover: #b45309;
        --gray: #7c8590;            /* продано / неактивно (темнее) */
        --gray-light: #f3f4f6;
        --red: #dc2626;             /* удаление / ошибка */
        --red-light: #fee2e2;
        --red-hover: #b91c1c;
        --inactive: #c5ccd6;

        /* ── Радиусы ── */
        --r: 10px;          /* панели */
        --r-sm: 6px;        /* кнопки, поля */
        --r-lg: 14px;       /* модалки */

        /* ── Тени ── */
        --sh: 0 1px 3px rgba(15,27,45,.07), 0 4px 12px rgba(15,27,45,.05);
        --sh-md: 0 4px 20px rgba(15,27,45,.12), 0 16px 48px rgba(15,27,45,.08);
        --sh-pop: 0 4px 20px rgba(15,27,45,.13), 0 16px 48px rgba(15,27,45,.09);

        /* ── Шрифты ── */
        --font-head: 'Geologica', sans-serif;   /* заголовки, лого, числа */
        --font-body: 'Golos Text', system-ui, sans-serif;  /* весь остальной текст */

        --header-h: 72px;

        /*--font-sans: 'Golos Text', system-ui, sans-serif;*/
        /*--font-sans-accent: 'Geologica', sans-serif;*/


        --backdrop: rgba(from var(--ink) R G B / 35%);
        --photo-bg: #1a2533;
        --free-legend: #86c765;
        --free-bg: #b6e3a0;
        --free-bg-hover: #a9dc90;
        --free-color: #24632f;
        --reserved-legend: #f0b03c;
        --reserved-bg: #fcd88f;
        --reserved-bg-hover: #fad07c;
        --reserved-color: #8a5406;
        --sold-legend: #aab3bf;
        --sold-bg: #ccd2da;
        --sold-color: #5c6675;
    }
}