/* Единая тема сайта — «Космос» (02.08). Светлая «Заря» и второй тёмный вариант «Ночное небо» убраны после сравнения: тема на сайте одна, выбирать нечего. ПОЧЕМУ КЛАСС, А НЕ :root. Страницы держат собственные пары :root + @media(prefers-color-scheme) — их не пришлось вычищать: специфичность html.kosmos (0,1,1) выше :root внутри media-блока (0,1,0), поэтому наши значения побеждают в любом порядке подключения. Класс ставит inline-сниппет в (до первой отрисовки, иначе мигает светлым) и theme.js. Здесь же общий слой оформления, снятый с главной: типографика, переливы кнопок, стекло панелей. Раньше он жил только в matrix_calculator.html, и лендинги рядом с главной выглядели как чужой сайт. */ @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,600;0,700;1,600&family=Manrope:wght@300;400;500;600;700&display=swap'); html.kosmos{ --bg:#0B0714; --bg2:#171024; --ink:#F1EDFA; --txt:#F1EDFA; --body:#CFC6E4; --muted:#8E85A8; --muted2:#6F6790; --gold:#E8B45C; --gold2:#F6CE85; --gold-bright:#F6CE85; --violet:#8B6FD0; --violet-dim:#5A4590; --panel:rgba(23,16,36,.72); --card:#171024; --line:rgba(185,150,255,.22); --line-soft:rgba(185,150,255,.10); --ember:#E8B45C; --soft:rgba(232,180,92,.10); --accent:#C9B2FF; --accentDim:rgba(201,178,255,.16); --tint:rgba(241,237,250,.05); --input-bg:rgba(11,7,20,.6); /* Кнопка — звёздное золото темы. Оранжевый #E8760A на фиолете бил в глаза. */ /* Кнопки: янтарь между бледным золотом и фирменным оранжевым. Золото #E8B45C на фиолете читалось тускло, оранжевый #E8760A — аварийкой. */ --cta1:#FFC978; --cta2:#F0A03C; --on-cta:#1E1206; --cta-glow:rgba(240,160,60,.62); --btn1:#FFC978; --btn2:#F0A03C; --btn-txt:#1E1206; --btn-glow:rgba(240,160,60,.62); --serif:'Cormorant Garamond',Georgia,serif; --sans:'Manrope',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; --scheme:dark; color-scheme:dark; } /* Переключатель тем скрыт: тема одна. Разметку и логику НЕ удаляем — вернуть выбор будет вопросом снятия одной строки. */ .theme-toggle{ display:none !important } /* ── Оформление с главной ─────────────────────────────────────────────────── Только шрифты, цвета и эффекты: размеры и раскладку страниц не трогаем, иначе поедет вёрстка, рассчитанная под свои брейкпоинты. */ /* Фон-узор «Цветок Жизни»: сакральная геометрия как фактура, а не декор. Возвращён 02.08 после того, как был снят вместе со светлой темой. Альфа 0.035 вместо прежних 0.07 — вдвое тише: узор должен угадываться за звёздами, а не спорить с ними и с текстом. Цвет уведён из золота в аметист, в тон темы. На /arkany/ и SEO-страницах узор вшит в их собственный html,body — там альфа снижена на месте, чтобы не наложились два слоя. */ html.kosmos body{ font-family:var(--sans); color:var(--ink); background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='79.67'%3E%3Cg fill='none' stroke='rgba(198,168,255,0.035)' stroke-width='1'%3E%3Ccircle cx='0' cy='0' r='46'/%3E%3Ccircle cx='46' cy='0' r='46'/%3E%3Ccircle cx='23' cy='39.8' r='46'/%3E%3Ccircle cx='-23' cy='39.8' r='46'/%3E%3Ccircle cx='69' cy='39.8' r='46'/%3E%3Ccircle cx='0' cy='79.7' r='46'/%3E%3Ccircle cx='46' cy='79.7' r='46'/%3E%3C/g%3E%3C/svg%3E") repeat fixed, var(--bg); } html.kosmos h1, html.kosmos h2, html.kosmos h3, html.kosmos .h-serif{ font-family:var(--serif); letter-spacing:.01em } html.kosmos h1{ font-weight:600 } html.kosmos h1 em, html.kosmos h2 em{ font-style:italic; color:var(--gold-bright) } /* Надзаголовок: разрядка в 0.42em — фирменный приём главной */ html.kosmos .kicker{ font-size:11px; letter-spacing:.42em; text-transform:uppercase; color:var(--gold); font-weight:600; } /* Кнопки: перелив по диагонали + мягкое свечение под ним, подъём на наведении. Собраны все имена, которыми лендинги зовут главное действие. */ html.kosmos .cta:not(.ghost), html.kosmos button.go, html.kosmos .btn-primary, html.kosmos a.btn:not(.ghost){ background:linear-gradient(135deg,var(--btn1),var(--btn2)); color:var(--btn-txt); border:none; box-shadow:0 10px 28px -10px var(--btn-glow); transition:transform .12s ease, box-shadow .2s ease; } html.kosmos .cta:not(.ghost):hover, html.kosmos button.go:hover, html.kosmos .btn-primary:hover, html.kosmos a.btn:not(.ghost):hover{ transform:translateY(-1px); box-shadow:0 14px 32px -8px var(--btn-glow); } html.kosmos .cta:not(.ghost):active, html.kosmos button.go:active{ transform:translateY(0) } html.kosmos .cta.ghost{ background:none; border:1.5px solid var(--gold); color:var(--gold2); box-shadow:none; } /* Панели-стекло: полупрозрачная подложка, размытие и глубокая мягкая тень — на фиолетовом фоне карточка перестаёт быть плоским прямоугольником. */ html.kosmos .box, html.kosmos .feat, html.kosmos .sc, html.kosmos .tier, html.kosmos .card, html.kosmos details, html.kosmos .input-card, html.kosmos table{ background:var(--panel); border-color:var(--line); backdrop-filter:blur(12px); box-shadow:0 24px 60px -34px rgba(0,0,0,.85); } html.kosmos .tier.pay{ border-color:var(--gold); background:var(--soft) } html.kosmos th.us{ color:var(--gold2) } html.kosmos td.us{ color:var(--ink); background:var(--soft) } /* Блок-финал («Твоя Матрица уже посчитана») был коричнево-оранжевым намертво */ html.kosmos .big{ background:linear-gradient(135deg,var(--bg2),var(--card)); color:var(--ink); border:1px solid var(--line); } html.kosmos .big b{ color:var(--gold2) } /* Поля ввода — как на главной: тёмное стекло, золотой фокус */ html.kosmos input, html.kosmos select, html.kosmos textarea{ color:var(--ink); background:var(--input-bg); border-color:var(--line); color-scheme:dark; } html.kosmos input:focus, html.kosmos select:focus, html.kosmos textarea:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(232,180,92,.14); outline:none; } html.kosmos a{ color:var(--gold2) } html.kosmos hr, html.kosmos footer{ border-color:var(--line) } /* ── Живой фон (Glitter Wrap) ─────────────────────────────────────────────── Слой лежит под контентом и не ловит события. Тема одна и тёмная, поэтому инверсия (она делала белый снег чёрным для светлой «Зари») больше не нужна. */ #glitterwrap-bg{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0; transition:opacity 1.6s ease; } /* Поднимает контент над фоном. ИСКЛЮЧЕНИЯ ОБЯЗАТЕЛЬНЫ для всего, что должно лежать ПОВЕРХ страницы своим fixed-слоем: правило перебивает и position, и z-index, потому что его специфичность выше одиночного #id. 07.08: сюда не был внесён #starTunnel – и туннель на /stars/ терял fixed, получал z-index:1 и уезжал ПОД контент. Внешне это выглядело как «туннель не работает»: сцена рисовалась исправно, её просто не было видно. Симптом появился ровно тогда, когда звёздный фон стал базовым на всех страницах. Добавляя новый полноэкранный слой – дописывать его сюда. */ body>*:not(#glitterwrap-bg):not(#orbStage):not(#starTunnel):not(#starPre):not(#stDbg){ position:relative; z-index:1 } #glitterwrap-bg.in{ opacity:.6 } @media (prefers-reduced-motion:reduce){ #glitterwrap-bg{ display:none } }