/* Цветовая система Silvana (silvana.one) Извлечено из продакшен-CSS сайта 2026-08-17. Модель: :root = светлая тема (по умолчанию), .dark = тёмная тема. Переключение темы делается классом `dark` на (см. docs/README.md). */ :root { color-scheme: light; /* Поверхности и фон */ --bg: #f7f8fb; --section-bg: #f7f8fb; --section-hero-bg: #f7f7f7; --surface: #fff; --surface-2: #eef1f6; /* Текст */ --fg: #12151c; --muted: #5b626f; /* Разделители/линии */ --line: #12151c25; /* fg с ~15% альфа */ --line-rail: #12151c20; /* fg с ~12% альфа, более тонкая линия */ --hairline-width: 1px; /* Акцентный цвет бренда — розово-малиновый (magenta/pink) */ --accent: #d6448f; --accent-hover: #c13a7f; --accent-fill: #c64086; --accent-fill-hover: #b22a6f; --accent-fill-fg: #fff; /* Инверсные цвета (текст/поверхности поверх accent-fill) */ --inverse-surface: var(--accent-fill); --inverse-fg: #fff; --inverse-muted: #ffffffbd; --inverse-subtle: #ffffff8f; --inverse-line: #ffffff1a; /* Семантика "покупка/продажа" (трейдинговый контекст сайта) */ --buy: #2f9d76; --sell: #c75f6b; --buy-soft: var(--buy); --sell-soft: var(--sell); --buy-strong: var(--buy); --sell-strong: var(--sell); } @supports (color: color-mix(in lab, red, red)) { :root { --buy-soft: color-mix(in srgb, var(--buy) 13%, transparent); --buy-strong: color-mix(in srgb, var(--buy) 24%, transparent); --sell-soft: color-mix(in srgb, var(--sell) 13%, transparent); --sell-strong: color-mix(in srgb, var(--sell) 24%, transparent); } } :root { /* Стеклянные (glass) поверхности — полупрозрачные, с backdrop-blur */ --glass-bg: #ffffffb8; --glass-bg-strong: #fff; --glass-border: var(--line); } /* ================= ТЁМНАЯ ТЕМА ================= */ .dark { color-scheme: dark; --bg: #0a0a0f; --section-bg: #0a0a0f; --section-hero-bg: #101018; --surface: #15151d; --surface-2: #1e1e28; --fg: #f5f5f7; --muted: #9aa1af; --line: #f5f5f72b; --line-rail: #f5f5f724; --accent: #e25aa3; --accent-hover: #ee76b6; --accent-fill: #c64086; --accent-fill-hover: #b22a6f; --accent-fill-fg: #fff; --inverse-surface: var(--accent-fill); --inverse-fg: #fff; --inverse-muted: #ffffffc7; --inverse-subtle: #ffffff9e; --inverse-line: #f5f5f71f; --buy: #5bc79a; --sell: #ec7c86; --buy-soft: var(--buy); --sell-soft: var(--sell); --buy-strong: var(--buy); --sell-strong: var(--sell); --glass-bg: #0f0f15b8; --glass-bg-strong: #15151d; } @supports (color: color-mix(in lab, red, red)) { .dark { --buy-soft: color-mix(in srgb, var(--buy) 15%, transparent); --buy-strong: color-mix(in srgb, var(--buy) 27%, transparent); --sell-soft: color-mix(in srgb, var(--sell) 15%, transparent); --sell-strong: color-mix(in srgb, var(--sell) 27%, transparent); } } /* Доп. акцентные оттенки, встречающиеся в hover/градиентах на сайте (используются точечно поверх --accent, не как отдельные токены темы): #8f245e (тёмный accent, для теней/бордеров) #f06dad, #f18abb, #ffc8df (светлые accent-тинты для градиентов/иконок) */