/* ============================================================ Голос UI — тема-движок для инлайн-продуктов Версия: 3.0 (2026-06-16) Только ТОКЕНЫ + космо-фон + кнопка-тумблер. НЕ содержит reset/компонентов — не ломает вёрстку продукта. Цвета продукта переведены на var(--token, fallback), поэтому следуют за активной темой. Карточки чуть плотнее, чтобы читались без backdrop-blur. Подключение (в , absolute-путь — работает из любой подпапки): + тема-скрипт (см. ниже) ставит data-theme на до отрисовки. ============================================================ */ :root, [data-theme="light"] { --bg-page: #eef4fb; --bg-card: rgba(255, 255, 255, .78); --bg-muted: rgba(255, 255, 255, .55); --bg-soft: rgba(15, 23, 42, .06); --bg-app: url("/golos-bg-light.svg") center center / cover no-repeat fixed, linear-gradient(160deg, #eaf2fb 0%, #e7f1fa 48%, #e8f6f4 100%); --text:#0f2138; --text-soft:#51637b; --text-mute:#7c8aa0; --line:rgba(15,23,42,.07); --border:rgba(15,23,42,.10); --border-h:rgba(15,23,42,.20); --primary:#0891b2; --primary-dark:#0e7490; --primary-soft:rgba(8,145,178,.12); --primary-text:#0e7490; --secondary:#14b8a6; --gradient:linear-gradient(135deg,#06b6d4,#14b8a6); --accent-rgb:8,145,178; --success:#059669; --success-dark:#047857; --success-soft:rgba(5,150,105,.12); --warning:#d97706; --warning-soft:rgba(217,119,6,.13); --danger:#e11d48; --danger-soft:rgba(225,29,72,.10); --glass-blur: saturate(150%) blur(14px); --bokeh: radial-gradient(440px 440px at 12% 20%, rgba(56,189,248,.22), transparent 62%), radial-gradient(400px 400px at 80% 10%, rgba(45,212,191,.20), transparent 62%), radial-gradient(480px 480px at 86% 80%, rgba(99,102,241,.12), transparent 62%); } [data-theme="dark-off"] { --bg-page:#0b1730; --bg-card: rgba(20, 32, 54, .60); --bg-muted: rgba(255, 255, 255, .05); --bg-soft: rgba(255, 255, 255, .08); --bg-app: url("/golos-bg-dark.svg") center center / cover no-repeat fixed, linear-gradient(160deg, #0a1428 0%, #0c1d39 48%, #0a1730 100%); --text:#e8eef7; --text-soft:#9fb2cc; --text-mute:#6b7f9e; --line:rgba(255,255,255,.07); --border:rgba(255,255,255,.12); --border-h:rgba(255,255,255,.22); --primary:#38bdf8; --primary-dark:#0ea5e9; --primary-soft:rgba(56,189,248,.16); --primary-text:#7dd3fc; --secondary:#2dd4bf; --gradient:linear-gradient(135deg,#2dd4bf,#22d3ee); --accent-rgb:56,189,248; --success:#34d399; --success-dark:#10b981; --success-soft:rgba(52,211,153,.16); --warning:#fbbf24; --warning-soft:rgba(251,191,36,.16); --danger:#fb7185; --danger-soft:rgba(251,113,133,.16); --bokeh: radial-gradient(460px 460px at 12% 20%, rgba(56,189,248,.20), transparent 62%), radial-gradient(420px 420px at 80% 8%, rgba(45,212,191,.18), transparent 62%), radial-gradient(520px 520px at 88% 82%, rgba(99,102,241,.20), transparent 62%), radial-gradient(400px 400px at 26% 92%, rgba(168,85,247,.16), transparent 62%); } /* Космо-фон + просвечивающий боке-слой (под контентом) */ html { background: var(--bg-app); } body { position: relative; background: var(--bg-app); background-attachment: fixed; transition: color .2s cubic-bezier(.4,0,.2,1); } body::before { content: ''; position: fixed; inset: -8%; z-index: -1; pointer-events: none; background: var(--bokeh); background-attachment: fixed; } /* Кнопка-тумблер (плавающая, вставляется на каждую страницу) */ .golos-theme-toggle { position: fixed; bottom: 20px; right: 20px; z-index: 99999; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--border); background: var(--bg-card); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); color: var(--text); cursor: pointer; font-size: 19px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 6px 22px rgba(0,0,0,.18); transition: transform .12s ease, border-color .12s ease; } .golos-theme-toggle:hover { transform: translateY(-2px); border-color: var(--border-h); } .golos-theme-toggle::before { content: "🌙"; } /* Тёмная тема отключена — переключатель скрыт, только светлая */ .golos-theme-toggle { display: none !important; }