/* UNIQ — тёмная тема. Переопределяем общие CSS-переменные при data-theme="dark" на . Селектор :root[data-theme="dark"] имеет более высокую специфичность, чем :root, поэтому перекрывает страничные значения независимо от порядка подключения. */ :root[data-theme="dark"] { color-scheme: dark; --cream: #15110D; /* основной фон */ --cream-light: #211B15; /* фон карточек, инпутов */ --ink: #F2EADF; /* основной текст */ --ink-soft: #CFC4B5; --ink-muted: #9E9183; --terracotta: #D9774F; /* акцент — чуть ярче для контраста на тёмном */ --terracotta-dark:#C2613B; --sage: #8FA577; --sage-light: #2E3A24; /* был светлый фон-плашка — делаем тёмным */ --peach: #2C2118; /* был светлый фон/ховер — делаем тёмным тёплым */ --line: #3A3128; /* границы */ --line-soft: #2B241D; --home: #D9774F; --success: #6FA86B; --error: #E0654A; } /* Тёмные скроллбары и плавный переход темы */ :root[data-theme="dark"] body { background: var(--cream); color: var(--ink); } /* Режим уменьшенных анимаций (доступность) */ :root[data-reduce-motion] *, :root[data-reduce-motion] *::before, :root[data-reduce-motion] *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; } /* Высокий контраст — светлая тема: текст темнее, границы чётче */ :root[data-contrast="high"] { --ink: #000000; --ink-soft: #1A1A1A; --ink-muted: #3A3A3A; --line: #6B6157; --line-soft: #8A8075; } /* Высокий контраст — тёмная тема: текст светлее, границы чётче */ :root[data-theme="dark"][data-contrast="high"] { --ink: #FFFFFF; --ink-soft: #EDE6DC; --ink-muted: #CFC4B5; --line: #6B6157; --line-soft: #564E45; } /* Эмодзи Twemoji — размер под текст */ img.emoji { height: 1.15em; width: 1.15em; margin: 0 .05em 0 .1em; vertical-align: -0.18em; display: inline-block; } /* Прячем заглушки имени/статуса/аватара/приветствия до загрузки реальных данных (убирает мигание «Дима» / «Москва · СДВГ» / «друг.») */ html.uniq-profile-pending .sidebar-profile .profile-name, html.uniq-profile-pending .sidebar-profile .profile-name-mini, html.uniq-profile-pending .sidebar-profile .profile-status, html.uniq-profile-pending .sidebar-profile .profile-status-mini, html.uniq-profile-pending .sidebar-profile .profile-avatar, html.uniq-profile-pending .sidebar-profile .mini-avatar, html.uniq-profile-pending [data-uniq="name"], html.uniq-profile-pending [data-uniq="firstName"], html.uniq-profile-pending [data-uniq="firstName-dot"] { visibility: hidden; } /* Карточка профиля в меню — фиксируем имя и статус в одну строку (с многоточием), чтобы длинный диагноз не переносился и не «толкал» меню по вертикали (без прыжков) */ .sidebar-profile .profile-name, .sidebar-profile .profile-name-mini, .sidebar-profile .profile-status, .sidebar-profile .profile-status-mini { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } /* Пункты меню тоже не переносим, чтобы бейдж непрочитанного не менял высоту строки */ .nav-item .label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Фиксированный размер аватара в нижней карточке меню на ВСЕХ страницах (иначе на части страниц фото при подгрузке меняет высоту и карточка прыгает) */ .sidebar-profile .mini-avatar, .sidebar-profile .profile-avatar { width: 40px; height: 40px; min-width: 40px; flex-shrink: 0; border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; }