/* Стили модуля js/categories/astrology.js. До 19.09.2026 скрипт вставлял их тегом <style>;
   с 19.09.2026 CSP сайта без 'unsafe-inline' такие теги не применяет, поэтому стили — здесь.
   Правите стили раздела — правьте этот файл и поднимайте его ?v=N в index.html. */

        .astro-app {
            display: flex; flex-direction: column; gap: 14px;
            color: #d9d3ea;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
        }
        /* ===== Описание раздела (тёмное стекло, как остальные карточки) ===== */
        .astro-intro {
            display: flex; gap: 16px; align-items: flex-start;
            background: rgba(255,255,255,0.05);
            -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
            border: 1px solid rgba(255,255,255,0.14);
            border-radius: 18px; padding: 20px 22px;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), 0 12px 30px rgba(0,0,0,0.3);
        }
        .astro-intro__ic {
            flex: 0 0 auto; width: 50px; height: 50px; border-radius: 14px;
            display: flex; align-items: center; justify-content: center; font-size: 22px;
            color: #2a1e05; background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            box-shadow: 0 8px 20px rgba(240,184,74,0.35);
        }
        .astro-intro__text { min-width: 0; }
        .astro-intro__text h3 { margin: 0 0 8px; font-size: 21px; line-height: 1.2; color: #fff; font-weight: 700; letter-spacing: -0.01em; }
        .astro-intro__text p { margin: 0 0 8px; font-size: 14px; line-height: 1.6; color: #d9d3ea; }
        .astro-intro__text strong { color: #ffd75c; font-weight: 600; }
        .astro-intro__cta { color: #ffe6b8; font-weight: 600; margin-bottom: 0; }
        @media (max-width: 560px) { .astro-intro { flex-direction: column; gap: 12px; padding: 18px; } .astro-intro__text h3 { font-size: 19px; } }

        .astro-nav { display: flex; flex-direction: column; gap: 10px; }
        .astro-nav-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
        @media (max-width: 720px) { .astro-nav-grid { grid-template-columns: 1fr 1fr; } }
        @media (max-width: 430px) { .astro-nav-grid { grid-template-columns: 1fr; } }

        /* стеклянные кнопки — как на странице входа; одинаковая высота, текст по центру */
        .astro-tab {
            position: relative;
            display: flex; align-items: center; justify-content: center; text-align: center;
            min-height: 56px; line-height: 1.25;
            background: rgba(255,255,255,0.06);
            -webkit-backdrop-filter: blur(16px) saturate(150%);
            backdrop-filter: blur(16px) saturate(150%);
            border: 1px solid rgba(255,255,255,0.14);
            color: #d7d1e8;
            padding: 12px 16px;
            border-radius: 14px;
            cursor: pointer;
            font-size: 14px;
            font-weight: 600;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);
            transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
        }
        .astro-tab:hover { color: #fff; background: rgba(255,255,255,0.12); transform: translateY(-1px); box-shadow: 0 0 14px rgba(255,231,166,0.28), 0 0 40px rgba(255,231,166,0.13); }
        .astro-tab.active {
            background: rgba(255,255,255,0.18);
            border-color: rgba(255,255,255,0.38);
            color: #fff;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), 0 8px 20px rgba(0,0,0,0.3);
        }

        /* «Исходные данные» — золотая кнопка (точка входа), первая в сетке (слева вверху) */
        .astro-tab--gold {
            color: #2a1e05;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            border-color: transparent;
            box-shadow: 0 10px 24px rgba(240,184,74,.30);
        }
        .astro-tab--gold:hover { color: #2a1e05; background: linear-gradient(135deg, #ffefc2, rgb(245,193,90) 45%, rgb(232,150,88)); }
        /* активное состояние: сохраняем золотой градиент (перебиваем .astro-tab.active) */
        .astro-tab--gold.active {
            color: #2a1e05;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            border-color: rgba(255,255,255,0.55);
            box-shadow: 0 10px 24px rgba(240,184,74,.40), inset 0 1px 0 rgba(255,255,255,0.5);
        }

        /* Платные функции (PRO) — золотая коронка в правом верхнем углу кнопки */
        .astro-tab--pro { padding-right: 24px; }
        .astro-tab__crown {
            position: absolute; top: 6px; right: 8px;
            font-size: 10px; line-height: 1; color: #ffd75c;
            filter: drop-shadow(0 1px 2px rgba(0,0,0,0.5));
            pointer-events: none;
        }
        .astro-tab--pro.active .astro-tab__crown { color: #ffe08a; }

        /* «Журнал результатов» — один в последнем ряду, тянем на всю ширину сетки */
        .astro-tab--wide { grid-column: 1 / -1; }
        @media (max-width: 430px) { .astro-tab--wide { grid-column: auto; } }

        /* ===== Подвкладки объединённых разделов («Календарь планет», «Транзиты») ===== */
        .astro-subnav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
        .astro-subtab {
            position: relative;
            padding: 9px 14px 9px 14px; border-radius: 11px;
            background: rgba(255,255,255,0.05);
            border: 1px solid rgba(255,255,255,0.12);
            color: #cfc8e2; font-family: inherit; font-size: 13px; font-weight: 600;
            line-height: 1.2; cursor: pointer;
            transition: background-color .2s ease, color .2s ease, border-color .2s ease;
        }
        .astro-subtab:hover { color: #fff; background: rgba(255,255,255,0.11); border-color: rgba(255,255,255,0.26); }
        .astro-subtab.active {
            color: #2a1e05; border-color: transparent;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            box-shadow: 0 6px 16px rgba(240,184,74,.28);
        }
        .astro-subtab--pro { padding-right: 22px; }
        .astro-subtab .astro-tab__crown { top: 4px; right: 6px; }
        .astro-subtab.active .astro-tab__crown { color: #7a5a10; filter: none; }
        @media (max-width: 430px) { .astro-subtab { flex: 1 1 100%; text-align: center; } }

        /* ===== Астролог-консультант: широкая кнопка-баннер под сеткой функций ===== */
        .astro-consult-cta {
            display: flex; align-items: center; gap: 16px; width: 100%; text-align: left;
            padding: 15px 18px; border-radius: 16px; cursor: pointer;
            background: linear-gradient(120deg, rgba(124,92,255,0.28), rgba(255,179,71,0.20)), rgba(255,255,255,0.06);
            border: 1px solid rgba(255,215,92,0.42);
            color: #fff; font-family: inherit;
            -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.14), 0 14px 34px rgba(0,0,0,0.30);
            transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
        }
        .astro-consult-cta:hover {
            transform: translateY(-2px); border-color: rgba(255,215,92,0.75);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 18px 44px rgba(0,0,0,0.4), 0 0 26px rgba(255,215,92,0.18);
        }
        .astro-consult-cta__ic {
            flex: 0 0 auto; width: 52px; height: 52px; border-radius: 15px;
            display: grid; place-items: center; font-size: 23px; color: #2a1e05;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            box-shadow: 0 8px 20px rgba(240,184,74,0.35);
        }
        .astro-consult-cta__tx { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
        .astro-consult-cta__title { font-size: 17px; font-weight: 800; letter-spacing: -0.01em; }
        .astro-consult-cta__sub { font-size: 12.5px; line-height: 1.45; color: rgba(255,255,255,0.75); }
        .astro-consult-cta__go {
            flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
            padding: 10px 18px; border-radius: 999px; font-size: 13.5px; font-weight: 700; color: #2a1e05;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
            box-shadow: 0 10px 22px rgba(240,184,74,0.3);
            transition: transform .18s ease;
        }
        .astro-consult-cta:hover .astro-consult-cta__go { transform: translateX(2px); }
        @media (max-width: 640px) {
            .astro-consult-cta { flex-wrap: wrap; }
            .astro-consult-cta__tx { flex-basis: calc(100% - 68px); }
            .astro-consult-cta__go { margin-left: 68px; }
        }

        /* аккуратный зазор сверху при плавной прокрутке к окну функционала */
        .astro-view { scroll-margin-top: 14px; }

        /* ===== ФОН РАЗДЕЛА: космос + падающие звёзды, full-bleed ===== */
        .astro-cosmos { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; }
        body[data-section="astrology"] .astro-cosmos { opacity: 1; }
        .astro-cosmos__img { position: absolute; inset: 0; background: #0b0818 url('../../img/bg-astrology-v2.webp') center/cover no-repeat; }
        .astro-cosmos__veil { position: absolute; inset: 0; background: radial-gradient(120% 92% at 50% 28%, rgba(10,8,24,0.14), rgba(6,5,16,0.50) 80%), linear-gradient(180deg, rgba(6,5,16,0.26), rgba(6,5,16,0.58)); }
        .astro-cosmos__stars { position: absolute; inset: 0; width: 100%; height: 100%; }
        body[data-section="astrology"] #categoryContainer,
        body[data-section="astrology"] #categoryContainer .page { background: transparent; border: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; margin-top: 0; }

        .astro-active-bar {
            background: rgba(255,255,255,0.04);
            border-radius: 10px;
            padding: 8px 14px;
            font-size: 12px;
            color: rgba(255,255,255,0.8);
            display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
            border-left: 3px solid rgba(255,255,255,0.12);
        }
        .astro-active-name { color: #ffd75c; font-weight: 600; }
        .astro-active-empty { color: rgba(255,255,255,0.6); font-style: italic; }

        .astro-view {
            background: rgba(255,255,255,0.96);
            color: #d9d3ea;
            border-radius: 14px;
            padding: 22px;
            min-height: 200px;
        }

        .astro-section { display: flex; flex-direction: column; gap: 16px; }
        .astro-h3 { margin: 0 0 4px; font-size: 18px; color: #d9d3ea; display: flex; align-items: center; gap: 8px; }
        .astro-h4 { margin: 0 0 8px; font-size: 14px; color: #d9d3ea; text-transform: uppercase; letter-spacing: .5px; }

        .astro-form { display: flex; flex-direction: column; gap: 12px; }
        .astro-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
        .astro-field { display: flex; flex-direction: column; gap: 4px; min-width: 140px; position: relative; }
        .astro-grow { flex: 1 1 220px; }
        .astro-label { font-size: 11px; color: #d9d3ea; text-transform: uppercase; letter-spacing: .5px; }
        .astro-field input,
        .astro-field select {
            padding: 8px 10px;
            border: 1px solid rgba(255,255,255,0.12);
            border-radius: 7px;
            font-size: 14px;
            background: rgba(255,255,255,0.05);
            color: #d9d3ea;
        }
        .astro-field input:focus, .astro-field select:focus {
            outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15);
        }

        .astro-coords-row { background: rgba(255,255,255,0.05); padding: 8px 12px; border-radius: 7px; font-family: 'SF Mono', Menlo, monospace; }
        .astro-coords-label { color: #6a5a30; font-size: 12px; margin-right: 8px; }
        .astro-coords-value { color: #d9d3ea; font-weight: 600; }

        .astro-options { gap: 18px; }
        .astro-radio { display: flex; gap: 6px; align-items: center; cursor: pointer; }

        .astro-actions { gap: 10px; }
        .astro-btn {
            border: none; border-radius: 8px; padding: 10px 18px;
            cursor: pointer; font-size: 14px; font-weight: 500;
            transition: all .15s ease;
            width: auto; margin-top: 0;     /* нейтрализуем глобальное button{width:100%} */
        }
        .astro-btn-primary   { background: linear-gradient(90deg, #5c8dff, #5cc8ff); color: #fff; }
        .astro-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(92,141,255,0.35); }
        .astro-btn-secondary { background: rgba(255,255,255,0.05); color: #e6c877; }
        .astro-btn-secondary:hover { background: rgba(255,255,255,0.05); }
        .astro-btn-ghost     { background: rgba(255,255,255,0.05); color: #d9d3ea; }
        .astro-btn-ghost:hover { background: rgba(255,255,255,0.05); }

        /* ===== Бесплатные функции (светлые карточки, розовый акцент раздела) ===== */
        .free-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; }
        .free-date { color: #d9d3ea; font-size: 14px; padding-bottom: 8px; }
        .free-lead { color: #d9d3ea; font-size: 14px; line-height: 1.5; margin: 0; }
        .free-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 18px 20px; box-shadow: 0 2px 10px rgba(30,40,70,0.05); }
        .free-card + .free-card { margin-top: 14px; }
        .free-card-title { font-size: 17px; font-weight: 700; color: #d9d3ea; margin-bottom: 8px; }
        .free-p { color: #d9d3ea; font-size: 14.5px; line-height: 1.55; margin: 6px 0; }
        .free-note { color: #d9d3ea; font-size: 12px; font-style: italic; margin-top: 10px; }
        .free-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
        .free-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
        @media (max-width: 640px) { .free-grid, .free-grid3 { grid-template-columns: 1fr; } }
        .free-item { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 11px 13px; display: flex; flex-direction: column; gap: 4px; }
        .free-item b { color: #d9d3ea; font-size: 13px; }
        .free-item span { color: #d9d3ea; font-size: 13.5px; line-height: 1.45; }
        .free-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
        .free-chip { background: rgba(255,92,141,0.10); color: #b13a5f; border: 1px solid rgba(255,92,141,0.25); border-radius: 999px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; }
        .free-compat-pct { font-size: 40px; font-weight: 800; color: #ff5c8d; line-height: 1.1; margin-top: 4px; }
        .free-bar { height: 12px; border-radius: 999px; background: rgba(255,255,255,0.05); overflow: hidden; margin: 8px 0 12px; }
        .free-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #ff8e5c, #ff5c8d); }
        .free-moon { display: flex; align-items: center; gap: 16px; }
        .free-moon-emoji { font-size: 52px; line-height: 1; }
        .free-moon-sub { color: #d9d3ea; font-size: 13.5px; margin-top: 2px; }
        .free-retro { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid rgba(255,255,255,0.12); font-size: 14.5px; color: #d9d3ea; }
        .free-retro:first-of-type { border-top: none; }
        .free-retro.on { color: #b13a5f; font-weight: 600; }
        .free-retro.off { color: #74e0a4; font-weight: 600; border: none; }
        .free-retro-dt { color: #d9d3ea; font-size: 13px; font-variant-numeric: tabular-nums; }
        .free-chinese-emoji { font-size: 56px; line-height: 1; margin-bottom: 4px; }
        .bio-host { border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; overflow: hidden; margin: 8px 0; }
        .bio-svg { width: 100%; min-width: 560px; height: auto; display: block; }

        /* расширенные интерпретации */
        .free-trait { color: #8a5cff; font-size: 14px; font-style: italic; margin: 0 0 8px; }
        .free-advice { margin-top: 12px; padding: 11px 14px; border-radius: 10px; background: rgba(92,141,255,0.09); border-left: 3px solid #5c8dff; color: #d9d3ea; font-size: 14px; line-height: 1.5; }
        .free-avoid { margin-top: 10px; padding: 11px 14px; border-radius: 10px; background: rgba(224,85,111,0.08); border-left: 3px solid #e0556f; color: #8a3350; font-size: 14px; line-height: 1.5; }
        .free-quote { margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(255,255,255,0.12); color: #d9d3ea; font-style: italic; font-size: 14px; }
        .free-subs { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
        .free-sub { display: flex; align-items: center; gap: 10px; }
        .free-sub-lbl { flex: 0 0 108px; font-size: 13px; color: #d9d3ea; }
        .free-sub-val { flex: 0 0 42px; text-align: right; font-size: 13px; font-weight: 700; color: #b13a5f; font-variant-numeric: tabular-nums; }
        .free-bar-sm { flex: 1 1 auto; height: 8px; margin: 0; }
        .free-item.free-good { background: rgba(46,158,91,0.08); border-color: rgba(46,158,91,0.22); }
        .free-item.free-good b { color: #74e0a4; }
        .free-item.free-bad { background: rgba(224,85,111,0.07); border-color: rgba(224,85,111,0.2); }
        .free-item.free-bad b { color: #b13a5f; }

        /* Дневник снов → кнопка «Журнал снов» + сам журнал */
        .dream-journal-cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 8px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.12); }
        .dream-journal-hint { color: #d9d3ea; font-size: 13px; }
        .dj-count { color: #d9d3ea; font-size: 13.5px; font-weight: 600; }
        .dj-del { border: none; background: rgba(255,255,255,0.05); color: #b13a5f; width: 26px; height: 26px; border-radius: 7px; cursor: pointer; font-size: 16px; line-height: 1; }
        .dj-del:hover { background: #eebcc4; }
        /* Панель управления журналом снов: три ровных окошка на одной линии
           (десктоп) → аккуратный столбец во всю ширину (мобайл). */
        .dj-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
        .dj-controls .astro-btn { height: 40px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }
        .dj-date { display: flex; align-items: center; gap: 8px; margin: 0; }
        .dj-date-lbl { font-size: 13px; font-weight: 600; color: #d9d3ea; white-space: nowrap; }
        .dj-date input[type="date"] { height: 40px; box-sizing: border-box; padding: 8px 10px; border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; font-size: 14px; background: rgba(255,255,255,0.05); color: #d9d3ea; }
        .dj-date input[type="date"]:focus { outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15); }
        @media (max-width: 700px) {
            .dj-controls { flex-direction: column; align-items: stretch; }
            .dj-controls .astro-btn { width: 100%; }
            .dj-date { width: 100%; flex-direction: column; align-items: stretch; gap: 6px; }
            .dj-date input[type="date"] { width: 100%; }
        }

        .astro-place-wrap { position: relative; }
        /* Список мест после «Найти» лежит поверх полей «День», «Месяц»… — фон непрозрачный, как у .horo-sug.
           До 14.10.2026 был rgba(255,255,255,0.05): строки списка накладывались на поля и не читались. */
        .astro-suggest {
            position: absolute; top: 100%; left: 0; right: 0; z-index: 50; margin-top: 4px;
            background: #221c3f; border: 1px solid rgba(255,255,255,0.18); border-radius: 10px;
            box-shadow: 0 16px 36px rgba(0,0,0,0.45);
            max-height: 280px; overflow-y: auto;
            display: none;
        }
        .astro-suggest.open { display: block; }
        .astro-suggest-item { padding: 10px 12px; display: grid; grid-template-columns: minmax(0, 1fr); cursor: pointer; font-size: 14px; gap: 2px; border-bottom: 1px solid rgba(255,255,255,0.12); }
        .astro-suggest-item:hover { background: rgba(255,255,255,0.08); }
        .astro-sg-city { color: #fff; font-weight: 600; font-size: 15px; }
        .astro-sg-country { color: #cfc8e6; font-size: 13px; }
        .astro-sg-coords { font-family: 'SF Mono', Menlo, monospace; font-size: 12px; color: #b7b0cf; }

        /* ===== Натальная карта — экран "Исходные данные" ===== */
        .astro-natal { gap: 22px; }

        .natal-head { text-align: left; }
        .natal-title {
            margin: 0 0 14px; font-size: 34px; line-height: 1.1; font-weight: 700;
            letter-spacing: -0.02em;
            font-family: var(--font-apple, -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', system-ui, sans-serif);
        }
        .natal-title em { font-style: normal; }
        .nt-red  { color: #ff9d7a; }
        .nt-dark { color: #e9e5f6; }
        .natal-sub {
            margin: 0; max-width: 760px; font-size: 17px; line-height: 1.6; color: #d9d3ea;
        }
        .natal-howto { color: #c0392b; text-decoration: none; font-weight: 600; margin-left: 4px; }
        .natal-howto:hover { text-decoration: underline; }

        .natal-card {
            background: rgba(255,255,255,0.05);
            border-radius: 22px;
            padding: 26px 30px 30px;
            display: flex; flex-direction: column; gap: 20px;
            box-shadow: 0 6px 24px rgba(120, 80, 50, 0.08);
        }
        .natal-card-head { display: flex; justify-content: space-between; align-items: center; }
        .natal-card-title { color: #c0392b; font-weight: 700; font-size: 18px; }
        .natal-clear {
            color: #c0392b; font-size: 14px; text-decoration: none;
            border-bottom: 1px dashed #c0392b; padding-bottom: 1px;
        }
        .natal-clear:hover { opacity: .75; }

        .natal-grid { display: grid; gap: 18px; }
        /* minmax(0, 1fr), а не 1fr: у 1fr автоминимум берётся от содержимого,
           и длинная подпись (например, часового пояса) раздувает колонку. */
        .natal-grid-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
        .natal-grid-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }

        .natal-field { display: flex; flex-direction: column; gap: 8px; position: relative; }
        .natal-lbl {
            font-size: 14px; font-weight: 600; color: #d9d3ea;
            display: inline-flex; align-items: center; gap: 6px;
        }
        .natal-help {
            display: inline-flex; align-items: center; justify-content: center;
            width: 16px; height: 16px; border-radius: 50%;
            background: rgba(255,255,255,0.05); color: #e6c877; font-size: 11px; font-weight: 700;
            cursor: help; line-height: 1;
        }
        .natal-field input,
        .natal-select {
            border: none; background: rgba(255,255,255,0.05); border-radius: 14px;
            padding: 16px 18px; font-size: 16px; color: #d9d3ea;
            box-shadow: 0 1px 2px rgba(0,0,0,0.04);
            -webkit-appearance: none; appearance: none;
        }
        .natal-field input[type="number"] { text-align: center; }
        .natal-field input::placeholder { color: #b6b0aa; }
        .natal-field input:focus,
        .natal-select:focus {
            outline: none; box-shadow: 0 0 0 3px rgba(192,57,43,0.18);
        }
        .natal-select {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23e6c877' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
            background-repeat: no-repeat; background-position: right 18px center;
            padding-right: 42px; cursor: pointer;
        }

        /* Подпись под полем часового пояса: что определено автоматически */
        .natal-tz-note {
            font-size: 11.5px; line-height: 1.35; color: #b9b2cc;
            display: block; min-height: 15px; word-break: break-word;
        }
        .natal-tz-note.is-manual { color: #e6c877; }
        .natal-tz-note a { color: #e6c877; text-decoration: none; border-bottom: 1px dashed rgba(230,200,119,0.5); }
        .natal-tz-note a:hover { opacity: .8; }

        .natal-check {
            display: inline-flex; align-items: center; gap: 8px;
            font-size: 15px; color: #d9d3ea; cursor: pointer; align-self: flex-start;
        }
        .natal-check input { width: 16px; height: 16px; accent-color: #c0392b; cursor: pointer; }

        .natal-advanced {
            background: rgba(255,255,255,0.05); border-radius: 16px; overflow: hidden;
        }
        /* Заголовок блока: значок | название с пояснением под ним | кнопка «Показать / Скрыть».
           До 01.10.2026 стрелкой был символ «⌄» в конце строки: на iPhone он обрезался сверху,
           а название и пояснение ужимались в узкие колонки — блок не выглядел раскрывающимся. */
        .natal-advanced > summary {
            list-style: none; cursor: pointer; user-select: none;
            display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 6px 12px;
            padding: 16px 20px; font-size: 16px; color: #d9d3ea;
            position: relative;
        }
        .natal-advanced > summary::-webkit-details-marker { display: none; }
        .natal-adv-icon { font-size: 18px; line-height: 1; }
        .natal-adv-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
        .natal-adv-text b { font-size: 16px; line-height: 1.3; }
        .natal-adv-hint { font-size: 13px; color: #b7b0cf; font-weight: 400; line-height: 1.35; }
        .natal-adv-toggle {
            display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
            padding: 7px 13px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.22);
            background: rgba(255,255,255,0.08); color: #efeaff; font-size: 13px; font-weight: 600; line-height: 1;
        }
        .natal-adv-toggle::before { content: 'Показать'; }
        .natal-adv-toggle::after {
            content: '\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 11px;
            transition: transform .2s ease;
        }
        .natal-advanced[open] .natal-adv-toggle::before { content: 'Скрыть'; }
        .natal-advanced[open] .natal-adv-toggle::after { transform: rotate(180deg); }
        .natal-advanced > summary:hover .natal-adv-toggle { background: rgba(255,255,255,0.14); }
        /* Телефон: кнопка — строкой под пояснением, чтобы название не ломалось на две строки */
        @media (max-width: 480px) {
            .natal-advanced > summary { grid-template-columns: auto minmax(0, 1fr); padding: 16px 18px; }
            .natal-adv-toggle { grid-column: 2; justify-self: start; margin-top: 4px; }
        }
        .natal-adv-body {
            padding: 4px 22px 22px; display: flex; flex-direction: column; gap: 18px;
        }
        .natal-adv-body .natal-field input,
        .natal-adv-body .natal-select { padding: 12px 14px; font-size: 15px; }
        .natal-dms {
            background: rgba(255,255,255,0.05); border-radius: 14px; padding: 12px 14px;
            font-family: 'SF Mono', Menlo, monospace; font-size: 13px; color: #d9d3ea;
        }
        .natal-coord-hint { font-size: 12.5px; color: #d9d3ea; line-height: 1.5; margin-top: -6px; }
        .astro-suggest-loading { padding: 8px 12px; font-size: 13px; color: #d9d3ea; font-style: italic; }
        /* Обязательная подпись источника данных: лицензия ODbL и правила Nominatim */
        .astro-suggest-attr { padding: 6px 12px; font-size: 12px; color: #b7b0cf; border-top: 1px solid rgba(255,255,255,0.12); }
        /* Поле места + кнопка «Найти»: мировую базу спрашиваем только по нажатию */
        .astro-place-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; align-items: stretch; }
        .astro-place-find { border: 1px solid rgba(255,255,255,0.22); background: rgba(255,255,255,0.06);
            color: #efeaff; border-radius: 10px; padding: 0 12px; font-size: 13px; cursor: pointer; white-space: nowrap; }
        .astro-place-find:hover { background: rgba(255,255,255,0.12); }

        /* ===== Окно «Поделиться» ===== */
        .share-overlay {
            position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center;
            background: rgba(20,20,25,0.5); padding: 16px;
        }
        .share-dialog {
            position: relative;
            background: rgba(28,24,46,0.97); border-radius: 18px; padding: 20px 22px; width: 100%; max-width: 420px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.35);
        }
        .share-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; padding-right: 40px; }
        .share-title { font-size: 18px; font-weight: 700; color: #d9d3ea; }
        /* Единый стандарт крестика закрытия: круг 34px, правый верхний угол 14/14 */
        .share-close {
            position: absolute; top: 14px; right: 14px; z-index: 5; margin: 0;
            width: 34px; height: 34px; border: 1px solid rgba(255,255,255,0.14); border-radius: 50%;
            background: rgba(255,255,255,0.08); color: #e8e6f5;
            font-size: 18px; line-height: 1; cursor: pointer; margin-top: 0; padding: 0;
            display: grid; place-items: center;
        }
        .share-close:hover { background: rgba(255,255,255,0.16); color: #fff; }
        .share-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
        .share-item {
            display: flex; flex-direction: column; align-items: center; gap: 7px;
            padding: 12px 4px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05);
            cursor: pointer; text-decoration: none; width: auto; margin-top: 0; transition: all .12s ease;
        }
        .share-item:hover { background: rgba(255,255,255,0.05); transform: translateY(-1px); }
        .share-ic {
            width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
            color: #fff; font-size: 20px; font-weight: 700;
        }
        .share-name { font-size: 12px; color: #d9d3ea; }
        .share-note { margin-top: 16px; font-size: 12px; color: #d9d3ea; line-height: 1.5; text-align: center; }

        .natal-submit-row {
            display: flex; justify-content: center; align-items: center; gap: 14px;
            flex-wrap: wrap; margin-top: 6px;
        }
        .natal-build-btn {
            background: #3a2c28; color: #f4c430; border: none;
            border-radius: 30px; padding: 18px 48px; font-size: 18px; font-weight: 700;
            cursor: pointer; transition: all .15s ease;
        }
        .natal-build-btn:hover { background: #4a3a34; transform: translateY(-1px); box-shadow: 0 6px 18px rgba(58,44,40,0.3); }
        .natal-save-btn {
            background: rgba(255,255,255,0.05); color: #e6c877; border: none;
            border-radius: 30px; padding: 18px 28px; font-size: 15px; font-weight: 600;
            cursor: pointer; transition: all .15s ease;
        }
        .natal-save-btn:hover { background: rgba(255,255,255,0.05); }

        @media (max-width: 720px) {
            .natal-title { font-size: 30px; }
            .natal-grid-2, .natal-grid-3 { grid-template-columns: 1fr; }
            .natal-card { padding: 20px 18px 24px; }
        }

        /* ===== Натальная карта (результат) ===== */
        .natal-chart-card {
            background: rgba(255,255,255,0.05); border-radius: 18px; padding: 22px 24px;
            box-shadow: 0 6px 28px rgba(60,50,40,0.10); margin-top: 18px;
        }
        .nch-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
        .nch-title { margin: 0; font-size: 24px; font-weight: 700; color: #d9d3ea; flex: 1 1 auto; }
        .nch-expand {
            background: #2f2a26; color: #f4f4f4; border: none; border-radius: 20px;
            padding: 8px 16px; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
            flex: 0 0 auto; width: auto; white-space: nowrap; align-self: flex-start;
        }
        .nch-expand:hover { background: #423a33; }

        /* Свёрнутый вид: инфо + колесо в строке, таблицы — под ними (узкий контейнер) */
        .nch-body {
            display: grid;
            grid-template-columns: 180px 1fr;
            grid-template-areas: "info wheel" "right right";
            gap: 16px 18px; align-items: start; margin-top: 14px;
        }
        .nci  { grid-area: info; }
        .nch-wheel  { grid-area: wheel; }
        .nch-right  { grid-area: right; }
        @media (max-width: 720px) {
            /* minmax(0,1fr), а не 1fr: иначе автоминимум трека берётся от содержимого
               колеса и трек раздувается шире карточки — карта обрезается по краю. */
            .nch-body { grid-template-columns: minmax(0, 1fr); grid-template-areas: "info" "wheel" "right"; }
        }
        @media (max-width: 600px) {
            /* Вложенные отступы (astro-view + карточка) съедали 92px из 375 —
               колесу оставалось 245px, подписи градусов сжимались до 5 пикселей. */
            .astro-view { padding: 10px; }
            .natal-chart-card { padding: 14px 12px; }
            .nch-title { font-size: 19px; }
            .nch-body { gap: 12px; }
            /* Мелкие подписи внутри колеса (8 единиц viewBox) на телефоне нечитаемы */
            .astro-chart-svg text[font-size="8"] { font-size: 15px; }
            .astro-chart-svg text[font-size="11"] { font-size: 16px; }
            .astro-chart-svg text[font-size="12"] { font-size: 16px; }
            /* Кнопка «развернуть» — основной способ рассмотреть карту на телефоне */
            .nch-expand { padding: 10px 18px; font-size: 14px; }
        }

        .nci { display: flex; flex-direction: column; gap: 16px; font-size: 13px; color: #d9d3ea; }
        .nci-block > div { margin: 2px 0; }
        .nci-h { font-weight: 700; color: #d9d3ea; margin-bottom: 4px !important; }
        /* Сноски под данными карты: система домов и оговорка о средних узлах */
        .nci-note { margin-top: 6px !important; font-size: 11.5px; line-height: 1.4; opacity: .72; }
        .nci-stat { display: flex; justify-content: space-between; max-width: 160px; }
        .nci-stat span:first-child { font-weight: 600; }
        .nci-foot { color: #d9d3ea; }
        .nci-moon { margin-top: 8px; }

        .nch-wheel { width: 100%; max-width: 440px; margin: 0 auto; }
        .nch-wheel .astro-chart-svg { width: 100%; height: auto; display: block; }

        /* В свёрнутом виде таблицы и аспектарий идут в ряд под колесом */
        .nch-right { display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px 28px; align-items: flex-start; font-size: 13px; }
        .nch-cols { display: grid; grid-template-columns: auto auto; gap: 6px 14px; }
        .nch-col { display: flex; flex-direction: column; gap: 3px; }
        .nch-row { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
        .nch-name { color: #d9d3ea; min-width: 64px; }
        .nch-house-row .nch-name { min-width: 52px; }
        .nch-glyph { font-size: 16px; width: 18px; text-align: center; }
        /* Чёрный знак на светлом чипе — тот же вид, что и на колесе карты */
        .nch-sign {
            font-size: 15px; min-width: 20px; text-align: center; display: inline-block;
            color: #14111f; background: #efeaf9; border-radius: 5px; padding: 0 3px; line-height: 1.35;
        }
        .nch-deg { font-variant-numeric: tabular-nums; color: #d9d3ea; font-weight: 500; }
        .nch-r { color: #c0392b; font-weight: 700; font-size: 11px; min-width: 8px; }

        /* Аспектарий по своей природе шире узкого экрана (17 столбцов по 19px).
           Пусть прокручивается внутри себя, а не тащит за собой всю страницу. */
        .nch-grid-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .nch-grid { border-collapse: collapse; margin-top: 4px; }
        .nch-grid td {
            width: 19px; height: 19px; text-align: center; vertical-align: middle;
            border: 1px solid rgba(255,255,255,0.12); font-size: 12px; line-height: 1;
        }
        .nch-grid-head { font-size: 13px !important; background: rgba(255,255,255,0.05); }
        .nch-grid-cell { background: rgba(255,255,255,0.05); }

        /* ВАЖНО: этот медиазапрос обязан стоять ПОСЛЕ базовых правил .nch-cols и .nch-right.
           Медиазапрос не добавляет специфичности — при равной побеждает то, что ниже по файлу.
           Планеты и дома шли двумя колонками: 189 + 14 + 134 = 337 при доступных 331,
           блок вылезал за карточку, подписи слева обрезались, появлялась горизонтальная
           прокрутка. Одна колонка даёт строку 189px — помещается с запасом.
           min-width: 0 обязателен: без него flex-элемент в grid-треке не даёт себя сжать. */
        @media (max-width: 600px) {
            .nch-right { min-width: 0; }
            .nch-cols { grid-template-columns: minmax(0, 1fr); }
        }

        .nch-actions { display: flex; justify-content: center; gap: 14px; margin-top: 18px; }
        .nch-btn { border: none; border-radius: 26px; padding: 14px 30px; font-size: 15px; font-weight: 600; cursor: pointer; transition: all .15s ease; }
        .nch-btn-dark { background: #2f2a26; color: #f4c430; }
        .nch-btn-dark:hover { background: #423a33; }

        /* ФИКС «Развернуть на весь экран»: у #categoryContainer есть backdrop-filter,
           который делает его containing block для position:fixed. Из-за этого полноэкранные
           карточки раскрывались только в пределах карточки, а не на весь экран.
           Пока открыт ЛЮБОЙ полноэкранный вид — временно снимаем фильтр со ВСЕХ .page
           (роутер вкладывает .page в .page — фильтр есть у обеих; обычный вид не меняется). */
        .page:has(.natal-fs),
        .page:has(.tlz-fs),
        .page:has(.cyh-fs),
        .page:has(.gpz-fs),
        .astro-view:has(.natal-fs),
        .astro-view:has(.tlz-fs),
        .astro-view:has(.cyh-fs),
        .astro-view:has(.gpz-fs) {
            -webkit-backdrop-filter: none !important;
            backdrop-filter: none !important;
        }

        /* Пока открыт полноэкранный вид — блокируем прокрутку самой страницы, иначе
           позади остаётся её обычная (более высокая) разметка и появляется общий
           скролл окна поверх полноэкранной карточки. Класс вешается/снимается в JS
           (_setFsLock) вместе с открытием/закрытием любого из «Развернуть». */
        html.astro-fs-lock,
        html.astro-fs-lock body {
            overflow: hidden !important;
        }

        /* Полноэкранный режим («Развернуть») — контент подгоняется зумом под экран
           (см. _fitFsContent), поэтому скролл внутри карточки не нужен и намеренно
           отключён. ВАЖНО: непрозрачный фон, иначе форма позади просвечивает. */
        .natal-chart-card.natal-fs {
            position: fixed; inset: 10px; z-index: 9999; margin: 0; overflow: hidden;
            display: flex; flex-direction: column;
            background: linear-gradient(160deg, #1c1836, #14111f) !important;
            border: 1px solid rgba(255,255,255,0.12);
            box-shadow: 0 0 0 100vmax rgba(10,8,20,0.72), 0 30px 80px rgba(0,0,0,0.5);
        }
        .natal-chart-card.natal-fs .nch-body {
            grid-template-columns: 190px minmax(0,1fr) 300px;
            grid-template-areas: "info wheel right";
            align-items: center;
        }
        .natal-chart-card.natal-fs .nch-wheel { max-width: min(540px, 66vh); }
        .natal-chart-card.natal-fs .nch-actions { margin-top: auto; padding-top: 12px; }

        /* Те же полноэкранные режимы (транзиты · картограмма · график-прогноз) —
           непрозрачный фон, чтобы контент позади не просвечивал и текст не накладывался. */
        .tlz-wrap.tlz-fs, .cyh-wrap.cyh-fs, .gpz-wrap.gpz-fs {
            background: linear-gradient(160deg, #1c1836, #14111f) !important;
            border: 1px solid rgba(255,255,255,0.12);
            box-shadow: 0 0 0 100vmax rgba(10,8,20,0.72), 0 30px 80px rgba(0,0,0,0.5);
        }

        /* ===== Лента транзитов (Gantt) ===== */
        .tlz-wrap-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 6px; }
        .tlz-wrap-title { font-weight: 700; color: #d9d3ea; font-size: 15px; }
        .tlz-host { margin-top: 6px; border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 10px 12px; background: rgba(255,255,255,0.05); overflow-x: auto; }

        /* Полноэкранный режим ленты: график сверху + текст снизу, видны одновременно.
           Оба зумятся под доступное место (_fitFsContent) — внутренний скролл отключён. */
        .tlz-wrap.tlz-fs {
            position: fixed; inset: 10px; z-index: 9999; margin: 0; overflow: hidden;
            background: rgba(255,255,255,0.05); border-radius: 14px; padding: 14px 18px;
            display: flex; flex-direction: column;
            box-shadow: 0 0 0 100vmax rgba(20,20,25,0.55);
        }
        .tlz-wrap.tlz-fs .tlz-wrap-head { flex: 0 0 auto; }
        .tlz-wrap.tlz-fs .tlz-host { flex: 0 0 auto; overflow: hidden; }
        .tlz-wrap.tlz-fs .tlz-text { flex: 0 0 auto; overflow: hidden; margin-top: 12px; }

        /* ===== Календарь-прогноз (гистограммы по домам) ===== */
        .cyh { margin-top: 8px; }
        .cyh-axis { display: flex; font-size: 12px; color: #d9d3ea; }
        .cyh-axis-pad { flex: 0 0 112px; }
        .cyh-axis-line { position: relative; flex: 1 1 auto; height: 18px; }
        .cyh-month { position: absolute; transform: translateX(2px); white-space: nowrap; }
        .cyh-rows { position: relative; display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; overflow: hidden; cursor: crosshair; }
        .cyh-cursor { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1.5px solid #3b5bbf; pointer-events: none; z-index: 4; display: none; }
        .cyh-cursor.on { display: block; }
        .cyh-readout { margin-top: 8px; font-size: 14px; color: #d9d3ea; min-height: 20px; font-variant-numeric: tabular-nums; }
        .cyh-readout b { font-size: 15px; color: #d9d3ea; }
        .cyh-readout-hint { color: #b0a9c9; font-size: 12px; font-style: italic; }
        .cyh-row { display: flex; align-items: stretch; border-top: 1px solid rgba(255,255,255,0.12); }
        .cyh-row:first-child { border-top: none; }
        .cyh-row.hl { background: rgba(255,255,255,0.05); }
        .cyh-label { flex: 0 0 112px; display: flex; align-items: center; gap: 6px; font-size: 12px; color: #d9d3ea; padding: 4px 10px; border-right: 1px solid rgba(255,255,255,0.12); }
        .cyh-label b { display: inline-block; min-width: 30px; color: #d9d3ea; }
        .cyh-label span { color: #d9d3ea; }
        .cyh-chart { flex: 1 1 auto; min-width: 0; }
        .cyh-svg { width: 100%; height: 56px; display: block; }
        .cyh-status {
            margin-top: 10px; font-size: 13px; color: #d9d3ea;
            background: rgba(255,255,255,0.05); border-radius: 8px; padding: 9px 13px; min-height: 38px; line-height: 1.4;
        }

        /* Полноэкранный календарь — .cyh зумится под доступное место (_fitFsContent),
           внутренний скролл отключён. */
        .cyh-wrap.cyh-fs {
            position: fixed; inset: 10px; z-index: 9999; margin: 0; overflow: hidden;
            background: rgba(255,255,255,0.05); border-radius: 14px; padding: 14px 18px;
            display: flex; flex-direction: column;
            box-shadow: 0 0 0 100vmax rgba(20,20,25,0.55);
        }
        .cyh-wrap.cyh-fs .cyh { display: flex; flex-direction: column; margin-top: 10px; }
        .cyh-wrap.cyh-fs .cyh-rows { flex: 0 0 auto; }
        .cyh-wrap.cyh-fs .cyh-row { flex: 0 0 auto; }
        .cyh-wrap.cyh-fs .cyh-status, .cyh-wrap.cyh-fs .cyh-readout { flex: 0 0 auto; }
        .astro-leg-note { color: #d9d3ea; font-style: italic; }
        .tlz-axis { display: flex; align-items: flex-end; height: 20px; }
        .tlz-axis-pad { flex: 0 0 34px; }
        .tlz-axis-line { flex: 1; position: relative; height: 20px; min-width: 600px; }
        .tlz-tick { position: absolute; bottom: 0; transform: translateX(-50%); font-size: 10px; color: #b0a9c9; }
        .tlz-tick.day { color: #d9d3ea; font-weight: 700; }
        .tlz-tick.day::before { content: ''; position: absolute; left: 50%; bottom: 16px; width: 1px; height: 6px; background: #b6bcc6; }

        .tlz-rows { display: flex; flex-direction: column; gap: 3px; margin-top: 2px; }
        .tlz-row { display: flex; align-items: center; }
        .tlz-rowlabel { flex: 0 0 34px; text-align: center; font-size: 17px; }
        .tlz-track { flex: 1; position: relative; height: 22px; min-width: 600px; background: rgba(255,255,255,0.05); border-radius: 4px; }
        .tlz-bar {
            position: absolute; top: 3px; height: 16px; border-radius: 4px; cursor: pointer;
            display: flex; align-items: center; box-sizing: border-box; overflow: visible;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,0.25);
        }
        .tlz-good    { background: #2e9e5b; }
        .tlz-bad     { background: #d6453c; }
        .tlz-neutral { background: #3b7fd6; }
        .tlz-bar.sel { outline: 2px solid #2b2b2b; outline-offset: 1px; z-index: 5; }
        .tlz-bar-lbl { font-size: 10px; color: #fff; white-space: nowrap; padding: 0 4px; line-height: 1; }
        .tlz-exact { position: absolute; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,0.05); transform: translate(-50%,-50%); box-shadow: 0 0 0 1px rgba(0,0,0,0.25); }

        .tlz-text { margin-top: 14px; padding: 14px 16px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; }
        .tlz-text:empty { display: none; }
        .tlz-text-head { font-weight: 700; font-size: 15px; color: #d9d3ea; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
        .tlz-text-glyphs { font-size: 17px; }
        .tlz-good-fg { color: #74e0a4; }
        .tlz-bad-fg  { color: #b5362e; }
        .tlz-neutral-fg { color: #2f66ad; }
        .tlz-text-window { font-size: 12px; color: #d9d3ea; margin: 4px 0 10px; }
        .tlz-text-body { font-size: 14px; line-height: 1.65; color: #d9d3ea; text-align: justify; }

        .astro-result { margin-top: 14px; }
        .astro-result-grid { display: grid; grid-template-columns: minmax(min(280px,100%), 1fr) minmax(min(300px,100%), 1fr); gap: 22px; }
        @media (max-width: 900px) { .astro-result-grid { grid-template-columns: 1fr; } }

        .astro-chart { background: rgba(255,255,255,0.05); border-radius: 10px; padding: 6px; border: 1px solid rgba(255,255,255,0.12); }
        .astro-chart-svg { width: 100%; height: auto; display: block; }
        .astro-chart-meta { font-size: 12px; color: #d9d3ea; margin-top: 10px; display: flex; flex-direction: column; gap: 3px; }
        .astro-chart-meta b { color: #d9d3ea; }

        .astro-tables { display: flex; flex-direction: column; gap: 16px; }
        .astro-table-box { background: rgba(255,255,255,0.05); padding: 10px 12px; border-radius: 10px; }
        .astro-tbl { width: 100%; font-size: 13px; border-collapse: collapse; }
        .astro-tbl th, .astro-tbl td { text-align: left; padding: 5px 6px; border-bottom: 1px solid rgba(255,255,255,0.12); }
        .astro-tbl th { color: #d9d3ea; font-weight: 500; font-size: 11px; text-transform: uppercase; }
        .astro-tbl-glyph { font-size: 16px; width: 24px; text-align: center; }
        .astro-retro { color: #c0392b; font-weight: bold; text-align: center; }

        .astro-aspects-box { background: rgba(255,255,255,0.05); padding: 12px 14px; border-radius: 10px; }
        .astro-aspects-legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 12px; color: #d9d3ea; margin-bottom: 10px; }
        .astro-aspects-legend i { display: inline-block; width: 14px; height: 8px; vertical-align: middle; margin-right: 4px; border-radius: 2px; }
        .astro-aspects-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px,100%), 1fr)); gap: 6px; }
        .astro-asp { display: flex; align-items: center; gap: 8px; font-size: 13px; padding: 5px 8px; border-radius: 6px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); }
        .astro-asp-line { display: inline-block; width: 16px; height: 3px; border-radius: 2px; }
        .astro-asp-orb { color: #d9d3ea; font-size: 11px; margin-left: auto; }
        .astro-asp-name { font-style: italic; color: #d9d3ea; padding: 0 4px; }
        .astro-asp-good { background: rgba(255,255,255,0.05); }
        .astro-asp-bad  { background: rgba(255,255,255,0.05); }

        .astro-empty {
            text-align: center; padding: 60px 20px; color: #d9d3ea; font-style: italic;
            background: rgba(255,255,255,0.05); border-radius: 10px;
        }

        /* «Журнал результатов»: подзаголовок + плашка лимита бесплатного тарифа */
        .astro-sub { font-size: 13.5px; line-height: 1.55; color: #c8c2dc; margin: -4px 0 14px; }
        .astro-jrn-limit {
            display: flex; gap: 12px; flex-wrap: wrap; align-items: center; justify-content: space-between;
            padding: 12px 14px; margin-bottom: 12px; border-radius: 12px;
            background: linear-gradient(135deg, rgba(240,184,74,.10), rgba(120,90,220,.10));
            border: 1px solid rgba(240,184,74,.28);
        }
        .astro-jrn-limit__txt { font-size: 13px; line-height: 1.5; color: #e6e1f4; flex: 1 1 240px; }
        .astro-jrn-limit__txt b { color: #ffd77a; }
        .astro-jrn-limit__txt i { color: #f0b84a; margin-right: 5px; }
        .astro-jrn-limit .astro-btn-primary { white-space: nowrap; }

        /* Прочие кастомные кнопки тоже освобождаем от глобального button{width:100%} */
        .nch-btn, .natal-build-btn, .natal-save-btn, .nch-expand { width: auto; margin-top: 0; }

        .astro-controls {
            display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
            padding: 12px 14px; background: rgba(255,255,255,0.05); border-radius: 10px;
        }
        .astro-controls label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #d9d3ea; font-weight: 500; }
        .astro-controls input, .astro-controls select {
            padding: 8px 10px; border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; font-size: 14px;
            background: rgba(255,255,255,0.05); color: #d9d3ea;          /* было невидимо: текст наследовал белый цвет */
            min-width: 78px;
        }
        .astro-controls input:focus, .astro-controls select:focus {
            outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15);
        }
        /* Компактные кнопки навигации « » в тулбаре */
        .astro-controls .astro-btn-ghost {
            min-width: 40px; padding: 9px 12px; font-size: 16px; line-height: 1; font-weight: 700;
        }
        .astro-controls .astro-btn-primary { padding: 9px 22px; }
        .astro-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: #d9d3ea; margin-top: -4px; }
        .astro-legend i { display: inline-block; width: 14px; height: 8px; vertical-align: middle; margin-right: 4px; border-radius: 2px; }
        .astro-leg-cell { display: inline-flex; align-items: center; }

        /* Интерпретация */
        .astro-ip-day { background: rgba(255,255,255,0.05); border-radius: 10px; padding: 12px 14px; margin-top: 10px; }
        .astro-ip-day-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,0.12); }
        .astro-ip-day-date { font-weight: 600; color: #d9d3ea; text-transform: capitalize; }
        .astro-ip-day-score { font-size: 13px; padding: 3px 10px; border-radius: 6px; font-weight: 600; }
        .astro-ip-day-score.pos { background: rgba(255,255,255,0.05); color: #74e0a4; }
        .astro-ip-day-score.neg { background: rgba(255,255,255,0.05); color: #721c24; }
        .astro-ip-day-aspects { display: flex; flex-direction: column; gap: 6px; }
        .astro-ip-aspect { padding: 6px 8px; border-radius: 6px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); }
        .astro-ip-asp-head { display: flex; align-items: center; gap: 8px; font-size: 13px; }
        .astro-ip-asp-icon { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
        .astro-ip-asp-orb { margin-left: auto; color: #d9d3ea; font-size: 11px; }
        .astro-ip-asp-text { font-size: 12px; color: #d9d3ea; margin-top: 4px; margin-left: 20px; }

        /* База данных */
        .astro-db-list { display: flex; flex-direction: column; gap: 8px; }
        .astro-db-card {
            display: flex; gap: 12px; justify-content: space-between; align-items: center;
            background: rgba(255,255,255,0.05); padding: 10px 14px; border-radius: 9px; border: 1px solid rgba(255,255,255,0.12);
        }
        .astro-db-card.active { border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.05); }
        .astro-db-card-name { font-weight: 600; color: #d9d3ea; }
        .astro-db-card-meta, .astro-db-card-coords { font-size: 12px; color: #d9d3ea; }
        .astro-db-card-coords { font-family: 'SF Mono', Menlo, monospace; }
        .astro-db-tag { display: inline-block; padding: 1px 6px; border-radius: 4px; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; margin-right: 4px; }
        .tag-self  { background: rgba(255,255,255,0.05); color: #74e0a4; }
        .tag-other { background: rgba(255,255,255,0.05); color: #0c5460; }
        .astro-db-card-actions { display: flex; gap: 6px; }
        .astro-db-card-actions .astro-btn { padding: 6px 12px; font-size: 12px; }

        /* Календарь */
        .astro-calendar-host { overflow: auto; max-width: 100%; }
        .astro-calendar-wrap { display: inline-block; min-width: 100%; }
        .astro-calendar { border-collapse: collapse; font-size: 11px; }
        .astro-calendar th, .astro-calendar td { border: 1px solid rgba(255,255,255,0.12); padding: 0; }
        .astro-calendar th { background: rgba(255,255,255,0.05); color: #d9d3ea; padding: 4px 6px; text-align: center; font-weight: 500; }
        .ch-house { width: 36px; }
        .ch-month { min-width: 60px; }
        .ch-day { min-width: 18px; }
        .ch-cell { width: 60px; height: 26px; }
        .ch-cell-wide { width: 22px; height: 26px; }
        .cw-days .ch-month-day { font-size: 9px; padding: 1px; }

        /* График */
        .astro-graph-controls { display: flex; flex-direction: column; gap: 12px; background: rgba(255,255,255,0.05); padding: 12px 14px; border-radius: 10px; }
        .astro-graph-period { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
        .gp-field { display: flex; flex-direction: column; gap: 5px; width: 160px; }
        .gp-lbl { font-size: 12px; font-weight: 600; color: #d9d3ea; text-align: left; }
        .astro-graph-period select, .astro-graph-period input {
            width: 100%; box-sizing: border-box; height: 40px;
            padding: 8px 10px; border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; font-size: 14px;
            background: rgba(255,255,255,0.05); color: #d9d3ea;          /* текст полей видимый (был белым на белом) */
        }
        .astro-graph-period select:focus, .astro-graph-period input:focus {
            outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15);
        }

        .astro-graph-toggles { display: flex; gap: 14px; flex-wrap: wrap; }
        .astro-toggle-group { border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; padding: 8px 10px; flex: 1 1 280px; min-width: 250px; background: rgba(255,255,255,0.05); }
        .astro-toggle-group legend { font-size: 11px; color: #d9d3ea; padding: 0 6px; text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
        .astro-toggle-row { display: flex; flex-wrap: wrap; gap: 5px; }
        /* Тумблеры: глиф серый в выкл., чёрный во вкл. */
        .gp-tog {
            width: 32px; height: 30px; padding: 0; margin-top: 0;
            display: inline-flex; align-items: center; justify-content: center;
            font-size: 17px; line-height: 1; font-weight: 500;
            border: 1px solid rgba(255,255,255,0.12); border-radius: 6px; background: rgba(255,255,255,0.05);
            color: #aab0b8;            /* серый — невыбран */
            cursor: pointer; transition: all .1s ease;
        }
        .gp-tog:hover { border-color: #b0a9c9; background: rgba(255,255,255,0.05); }
        .gp-tog.on { color: #d9d3ea; border-color: #d9d3ea; background: rgba(255,255,255,0.05); font-weight: 700; }
        .gp-tog-wide { width: auto; padding: 0 9px; font-size: 13px; font-weight: 600; }

        .astro-graph-host { overflow-x: auto; background: rgba(255,255,255,0.05); border-radius: 10px; padding: 6px; border: 1px solid rgba(255,255,255,0.12); }
        .astro-graph-svg { width: 100%; min-width: 800px; height: auto; display: block; }

        /* ===== Дневник снов ===== */
        .dream-intro { background: rgba(255,255,255,0.05); border-radius: 10px; padding: 10px 14px; }
        .dream-intro > summary { cursor: pointer; font-weight: 600; color: #d9d3ea; list-style: none; }
        .dream-intro > summary, .bm-intro > summary, .bm-omens > summary { display: flex; align-items: center; gap: 8px; }
        .dream-intro > summary::after, .bm-intro > summary::after, .bm-omens > summary::after {
            content: '\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 11px;
            margin-left: auto; flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%;
            display: grid; place-items: center; color: #efeaff;
            background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2); transition: transform .2s ease;
        }
        .dream-intro[open] > summary::after, .bm-intro[open] > summary::after, .bm-omens[open] > summary::after { transform: rotate(180deg); }
        .dream-intro > summary::-webkit-details-marker { display: none; }
        .dream-intro > summary::before { content: '📖 '; }
        .dream-intro-body { margin-top: 8px; font-size: 13.5px; line-height: 1.6; color: #d9d3ea; }
        .dream-form { display: flex; flex-direction: column; gap: 14px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 16px; }
        .dream-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
        @media (max-width: 640px) { .dream-grid2 { grid-template-columns: 1fr; } }
        .dream-field { display: flex; flex-direction: column; gap: 6px; }
        .dream-lbl { font-size: 13px; font-weight: 600; color: #d9d3ea; }
        .dream-field input, .dream-field textarea {
            border: 1px solid rgba(255,255,255,0.12); border-radius: 9px; padding: 10px 12px; font-size: 14px;
            background: rgba(255,255,255,0.05); color: #d9d3ea; font-family: inherit; width: 100%; box-sizing: border-box;
        }
        .dream-field input { height: 42px; }   /* дата-время и заголовок — одной высоты */
        .dream-field textarea { resize: vertical; line-height: 1.5; }
        .dream-field input:focus, .dream-field textarea:focus { outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15); }
        .dream-causes-row { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
        .dream-cause {
            display: flex; align-items: center; gap: 10px; font-size: 14px; color: #d9d3ea; cursor: pointer;
            padding: 9px 12px; border: 1px solid rgba(255,255,255,0.12); border-radius: 9px; background: rgba(255,255,255,0.05);
            transition: all .12s ease;
        }
        .dream-cause:hover { border-color: #c3b8ff; background: rgba(255,255,255,0.05); }
        .dream-cause input { width: 17px; height: 17px; accent-color: #6c5cff; flex-shrink: 0; cursor: pointer; }
        .dream-cause:has(input:checked) { border-color: #6c5cff; background: rgba(255,255,255,0.05); color: #d9d3ea; font-weight: 500; }
        .dream-analysis:empty { display: none; }
        .dream-analysis { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 12px 14px; font-size: 13.5px; line-height: 1.6; color: #d9d3ea; }
        .dream-an-title { font-weight: 700; color: #c3aaff; margin-bottom: 6px; }
        .dream-an-row { margin: 3px 0; }
        .dream-an-hint { margin-top: 8px; font-size: 12px; color: #d9d3ea; font-style: italic; }
        .dream-actions { display: flex; gap: 10px; }
        .dream-saved { margin-top: 18px; }
        .dream-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
        .dream-card-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
        .dream-card-title { font-weight: 700; color: #d9d3ea; }
        .dream-card-btns { display: flex; gap: 4px; flex-shrink: 0; }
        .dream-edit, .dream-del { width: 28px; height: 28px; border: none; border-radius: 6px; background: rgba(255,255,255,0.05); color: #d9d3ea; cursor: pointer; font-size: 15px; line-height: 1; margin-top: 0; padding: 0; }
        .dream-del:hover { background: rgba(255,255,255,0.05); color: #c0392b; }
        .dream-edit:hover { background: rgba(255,255,255,0.05); }
        .dream-card-meta { font-size: 12px; color: #d9d3ea; margin: 5px 0; }
        .dream-card-text { font-size: 13.5px; line-height: 1.55; color: #d9d3ea; white-space: pre-wrap; }
        .dream-card-causes { font-size: 12.5px; color: #d9d3ea; margin-top: 6px; }
        .dream-card-an { font-size: 12.5px; color: #c3aaff; background: rgba(255,255,255,0.05); border-radius: 7px; padding: 6px 9px; margin-top: 8px; }

        /* Интерпретация образов сна */
        .dream-interp-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
        .dream-interp-by { font-size: 12px; color: #d9d3ea; font-style: italic; }
        .dream-interp-result:empty { display: none; }
        .dream-interp-result { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 12px 14px; }
        .dream-interp-empty { font-size: 13.5px; color: #e6c877; font-style: italic; }
        .dream-interp-head { font-weight: 700; color: #e6c877; margin-bottom: 10px; font-size: 13.5px; }
        .dream-sym { padding: 8px 0; border-top: 1px solid rgba(255,255,255,0.12); }
        .dream-sym:first-of-type { border-top: none; padding-top: 0; }
        .dream-sym-name { font-weight: 700; color: #c3aaff; font-size: 14px; margin-bottom: 4px; }
        .dream-sym-int { font-size: 13px; line-height: 1.55; color: #d9d3ea; margin: 3px 0; }
        .dream-sym-book { font-weight: 600; color: #b07b2e; }
        .dream-interp-note { margin-top: 12px; padding-top: 10px; border-top: 1px dashed rgba(255,255,255,0.12); font-size: 12px; color: #d9d3ea; line-height: 1.5; font-style: italic; }

        /* Голосовой ввод */
        .dream-voice-row { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; }
        .dream-voice-btn {
            display: inline-flex; align-items: center; gap: 6px; width: auto; margin-top: 0;
            border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05); color: #d9d3ea; border-radius: 9px;
            padding: 8px 14px; font-size: 13px; font-weight: 500; cursor: pointer;
        }
        .dream-voice-btn:hover { background: rgba(255,255,255,0.05); }
        .dream-voice-btn.rec { background: rgba(255,255,255,0.05); border-color: #e7a9a3; color: #c0392b; animation: dream-pulse 1.2s ease-in-out infinite; }
        @keyframes dream-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(192,57,43,0.0); } 50% { box-shadow: 0 0 0 5px rgba(192,57,43,0.12); } }
        .dream-voice-status { font-size: 12.5px; color: #d9d3ea; }
        .dream-voice-note { margin: 6px 0 0; font-size: 11.5px; line-height: 1.45; color: #9f98b8; display: flex; align-items: flex-start; gap: 6px; }
        .dream-voice-note i { margin-top: 2px; opacity: 0.75; }

        /* Памятка */
        .dream-memo { margin-top: 14px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-left: 4px solid #c0392b; border-radius: 10px; padding: 12px 16px; }
        .dream-memo-title { font-weight: 700; color: #d9d3ea; margin-bottom: 6px; }
        .dream-memo-red { margin: 0; color: #c0392b; font-size: 13.5px; line-height: 1.65; font-weight: 500; }

        /* ===== Дневник событий ===== */
        .ev-instruction { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 12px 16px; font-size: 13.5px; line-height: 1.6; color: #d9d3ea; }
        .ev-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; font-size: 12.5px; color: #d9d3ea; }
        .ev-legend span { display: inline-flex; align-items: center; }
        .ev-legend i { display: inline-block; width: 14px; height: 9px; border-radius: 2px; margin-right: 5px; }
        .ev-date-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin-top: 14px; }
        .ev-field { display: flex; flex-direction: column; gap: 5px; }
        .ev-field-sm { width: 90px; }
        /* День/Месяц/Год: одинаковая ширина и высота — подписи на одной линии */
        .ev-date-row .ev-field { width: 120px; }
        .ev-date-row .ev-field input, .ev-date-row .ev-field select { height: 42px; box-sizing: border-box; }
        .ev-date-row .astro-btn { height: 42px; }
        .ev-lbl { font-size: 13px; font-weight: 600; color: #d9d3ea; }
        .ev-field input, .ev-field select, .ev-field textarea {
            border: 1px solid rgba(255,255,255,0.12); border-radius: 9px; padding: 9px 11px; font-size: 14px;
            background: rgba(255,255,255,0.05); color: #d9d3ea; font-family: inherit; width: 100%; box-sizing: border-box;
        }
        .ev-field textarea { resize: vertical; line-height: 1.5; margin-top: 14px; }
        .ev-field input:focus, .ev-field select:focus, .ev-field textarea:focus { outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15); }
        .ev-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
        .ev-result:empty { display: none; }
        .ev-result { margin-top: 14px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 14px 16px; }
        .ev-empty { font-size: 13.5px; color: #d9d3ea; font-style: italic; }
        .ev-an-head { font-size: 14px; color: #d9d3ea; margin-bottom: 10px; }
        .ev-tone-good { color: #2e9e5b; } .ev-tone-bad { color: #e74c3c; } .ev-tone-mixed { color: #c98b2e; } .ev-tone-neutral { color: #3b7fd6; }
        .ev-an-sub { font-weight: 700; font-size: 13px; color: #d9d3ea; margin: 12px 0 6px; }
        .ev-an-sub-muted { color: #d9d3ea; font-weight: 600; }
        .ev-tr { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; padding: 6px 10px; border-radius: 7px; margin: 4px 0; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05); }
        .ev-tr-gl { font-size: 15px; }
        .ev-tr-cap { color: #d9d3ea; }
        .ev-tr-time { margin-left: auto; font-size: 11.5px; color: #d9d3ea; }
        .ev-tr-good { border-left: 3px solid #2e9e5b; }
        .ev-tr-bad  { border-left: 3px solid #e74c3c; }
        .ev-tr-neutral { border-left: 3px solid #3b7fd6; }
        .ev-time-block { margin: 6px 0; }
        .ev-time-h { font-size: 12.5px; color: #d9d3ea; margin: 4px 0; }
        .ev-an-note { margin-top: 12px; padding-top: 10px; border-top: 1px dashed rgba(255,255,255,0.12); font-size: 12px; color: #d9d3ea; line-height: 1.5; font-style: italic; }
        .ev-tone-badge { font-size: 12px; font-weight: 600; }

        /* Сопоставление со снами */
        .ev-dream-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-left: 3px solid #6c5cff; border-radius: 9px; padding: 10px 13px; margin: 8px 0; }
        .ev-dream-head { font-size: 13.5px; color: #d9d3ea; margin-bottom: 6px; }
        .ev-dream-syms { font-size: 12.5px; color: #d9d3ea; margin-bottom: 6px; }
        .ev-dream-sym { display: inline-block; background: rgba(255,255,255,0.05); color: #c3aaff; border-radius: 6px; padding: 2px 8px; font-size: 12px; margin: 0 4px 4px 0; font-weight: 600; }
        .ev-dream-text { font-size: 13px; line-height: 1.5; color: #d9d3ea; font-style: italic; }
        .ev-dream-int { font-size: 12.5px; line-height: 1.5; color: #d9d3ea; margin-top: 5px; }
        .ev-dream-int b { color: #c3aaff; }

        /* Связь события с картограммой (сигналами тела) */
        .ev-sig-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-left: 3px solid #d9a441; border-radius: 9px; padding: 10px 13px; margin: 8px 0; }
        .ev-sig-head { font-size: 13.5px; color: #d9d3ea; }
        .ev-sig-when { font-size: 12px; color: #e6c877; }
        .ev-sig-omen { font-size: 12.5px; color: #e6c877; margin-top: 5px; }
        .ev-sig-desc { font-size: 13px; color: #d9d3ea; font-style: italic; margin-top: 4px; }
        .ev-sig-out { font-size: 12.5px; color: #d9d3ea; margin-top: 5px; }
        .ev-sig-out b { color: #7a5a1f; }
        .ev-sig-out-muted { color: #a99a78; font-style: italic; }

        /* Журнал моих событий */
        .ev-journal { margin-top: 20px; }
        .ev-journal-toggle {
            width: 100%; margin-top: 0; display: flex; justify-content: space-between; align-items: center;
            background: #2f2a26; color: #f4f4f4; border: none; border-radius: 12px;
            padding: 14px 18px; font-size: 15px; font-weight: 600; cursor: pointer;
        }
        .ev-journal-toggle:hover { background: #423a33; }
        .ev-journal-chevron { transition: transform .2s ease; font-size: 14px; }
        .ev-journal-toggle.open .ev-journal-chevron { transform: rotate(180deg); }
        .ev-journal-body { margin-top: 12px; padding: 14px 16px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; }
        .ev-journal-search { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
        .ev-journal-search input[type="date"] {
            border: 1px solid rgba(255,255,255,0.12); border-radius: 9px; padding: 8px 11px; font-size: 14px; background: rgba(255,255,255,0.05); color: #d9d3ea;
        }
        .ev-journal-search input[type="date"]:focus { outline: none; border-color: #5c8dff; box-shadow: 0 0 0 3px rgba(92,141,255,0.15); }

        /* ===== Картограмма на тело ===== */
        .bm-intro, .bm-omens { background: rgba(255,255,255,0.05); border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; }
        .bm-intro > summary, .bm-omens > summary { cursor: pointer; font-weight: 600; color: #d9d3ea; list-style: none; }
        .bm-intro > summary::-webkit-details-marker, .bm-omens > summary::-webkit-details-marker { display: none; }
        .bm-intro > summary::before { content: '🖐 '; }
        .bm-intro-body { margin-top: 8px; font-size: 13.5px; line-height: 1.65; color: #d9d3ea; }
        .bm-omens-body { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: #d9d3ea; }
        .bm-omen-line b { color: #d9d3ea; }
        .bm-form { display: flex; flex-direction: column; gap: 14px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
        /* День / Месяц / Год / Время — колонки равной ширины: на телефоне по два в ряд,
           на широком экране все четыре (раньше поля по 110px оставляли пустоту справа) */
        .bm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(120px, 100%), 1fr)); gap: 12px; align-items: end; }
        .bm-grid .ev-field { width: auto; min-width: 0; }
        .bm-grid .ev-field input, .bm-grid .ev-field select { height: 42px; box-sizing: border-box; }
        .bm-omen-hint:empty { display: none; }
        .bm-omen-hint { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; padding: 8px 12px; font-size: 13px; color: #e6c877; margin-top: -6px; }
        .bm-omen-hint b { color: #6a5410; }

        .bm-cartogram { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
        .bm-cg-title { font-weight: 700; color: #74e0a4; margin-bottom: 8px; }
        .bm-cg-row { display: flex; gap: 12px; align-items: baseline; padding: 6px 0; border-top: 1px solid rgba(255,255,255,0.12); flex-wrap: wrap; }
        .bm-cg-row:first-of-type { border-top: none; }
        .bm-cg-part { font-weight: 700; color: #d9d3ea; min-width: 130px; }
        .bm-cg-stat { font-size: 13px; color: #d9d3ea; }
        .bm-cg-note { margin-top: 10px; font-size: 12px; color: #d9d3ea; font-style: italic; line-height: 1.5; }

        .bm-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
        .bm-card-head { display: flex; align-items: center; gap: 10px; }
        .bm-card-part { font-weight: 700; color: #d9d3ea; }
        .bm-card-when { font-size: 12px; color: #d9d3ea; }
        .bm-card-head .dream-del { margin-left: auto; }
        .bm-card-omen { font-size: 12.5px; color: #e6c877; margin: 5px 0; }
        .bm-card-desc { font-size: 13.5px; color: #d9d3ea; line-height: 1.5; }
        .bm-outcome { margin-top: 8px; font-size: 13px; color: #d9d3ea; background: rgba(255,255,255,0.05); border-radius: 8px; padding: 7px 10px; }
        .bm-delta { color: #c3aaff; font-weight: 600; }
        .bm-outcome-add { margin-top: 8px; width: auto; background: rgba(255,255,255,0.05); color: #d9d3ea; border: none; border-radius: 8px; padding: 7px 12px; font-size: 12.5px; cursor: pointer; }
        .bm-outcome-add:hover { background: rgba(255,255,255,0.05); }
        .bm-outcome-form { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; background: rgba(255,255,255,0.05); border-radius: 8px; padding: 10px; }
        .bm-of-row { display: flex; gap: 8px; flex-wrap: wrap; }
        .bm-outcome-form input, .bm-outcome-form select { border: 1px solid rgba(255,255,255,0.12); border-radius: 8px; padding: 8px 10px; font-size: 13px; background: rgba(255,255,255,0.05); color: #d9d3ea; }
        .bm-outcome-form input[type="text"] { width: 100%; box-sizing: border-box; }
        .bm-of-btns { display: flex; gap: 8px; }

        /* ===== График-прогноз (две линии 0..100) ===== */
        .gpz-host { margin-top: 8px; }
        .gpz { display: flex; }
        .gpz-yaxis {
            flex: 0 0 34px; display: flex; flex-direction: column; justify-content: space-between;
            font-size: 11px; color: #d9d3ea; text-align: right; padding-right: 6px;
            font-variant-numeric: tabular-nums;
        }
        .gpz-main { flex: 1 1 auto; min-width: 0; }
        .gpz-plot { position: relative; border: 1px solid rgba(255,255,255,0.12); border-radius: 6px; overflow: hidden; cursor: crosshair; background: rgba(255,255,255,0.05); }
        .gpz-svg { width: 100%; height: 320px; display: block; }
        .gpz-cursor { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1.5px solid #3b5bbf; pointer-events: none; z-index: 4; display: none; }
        .gpz-cursor.on { display: block; }
        .gpz-xaxis { position: relative; height: 18px; margin-top: 2px; }
        .gpz-xtick { position: absolute; transform: translateX(-50%); font-size: 10px; color: #b0a9c9; white-space: nowrap; }
        .gpz-xtick.major { color: #d9d3ea; font-weight: 600; }
        .gpz-readout { margin-top: 8px; font-size: 14px; color: #d9d3ea; min-height: 20px; font-variant-numeric: tabular-nums; }
        .gpz-readout b { font-size: 15px; color: #d9d3ea; }
        .gpz-readout-hint { color: #b0a9c9; font-size: 12px; font-style: italic; }
        .gpz-about {
            margin-top: 12px; padding: 12px 16px; background: rgba(255,255,255,0.05); border-radius: 10px;
            font-size: 13px; line-height: 1.6; color: #d9d3ea;
        }
        .gpz-about b { color: #d9d3ea; }
        .gpz-about-g { color: #1f9e4d; font-weight: 600; }
        .gpz-about-r { color: #e23b30; font-weight: 600; }

        /* Полноэкранный график — .gpz-host зумится под доступное место (_fitFsContent);
           пояснительный блок скрыт, чтобы весь экран доставался графику. */
        .gpz-wrap.gpz-fs {
            position: fixed; inset: 10px; z-index: 9999; margin: 0; overflow: hidden;
            background: rgba(255,255,255,0.05); border-radius: 14px; padding: 14px 18px;
            display: flex; flex-direction: column;
            box-shadow: 0 0 0 100vmax rgba(20,20,25,0.55);
        }
        .gpz-wrap.gpz-fs .gpz-host { flex: 0 0 auto; display: flex; flex-direction: column; }
        .gpz-wrap.gpz-fs .gpz-about { display: none; }

        /* ================= ВАРИАНТ A: тёмное стекло функциональной панели =================
           Панель, тексты, формы и «бесплатные» карточки — тёмные. Сложные схемы
           (натальная карта, календари-гистограммы, графики, картограмма) остаются светлыми
           «островками» — у них свой белый фон, их не трогаем. */
        .astro-view {
            background: rgba(18, 15, 36, 0.32) !important;
            -webkit-backdrop-filter: blur(34px) saturate(135%);
            backdrop-filter: blur(34px) saturate(135%);
            border: 1px solid rgba(255,255,255,0.10);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), 0 24px 60px rgba(0,0,0,0.30);
            color: #e9e5f6;
        }
        .astro-h3, .astro-h3 i { color: #f2eefc; }
        .astro-h4 { color: #cdc6e6; }
        .astro-label { color: #b3abcf; }
        .astro-coords-row { background: rgba(255,255,255,0.05); }
        .astro-coords-label { color: #d8c78f; }
        .astro-coords-value { color: #fff; }
        .astro-radio { color: #d7d2e8; }
        /* поля ввода во всех видах — тёмные */
        .astro-view input, .astro-view select, .astro-view textarea {
            background: rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.16) !important; color: #f0ecfb !important;
        }
        .astro-view input::placeholder, .astro-view textarea::placeholder { color: #9d96b8 !important; }
        .astro-btn-ghost { background: rgba(255,255,255,0.08); color: #e5e0f2; }
        .astro-btn-ghost:hover { background: rgba(255,255,255,0.14); }

        /* ---- Бесплатные функции — тёмные стеклянные карточки ---- */
        .free-card { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.10); box-shadow: none; }
        .free-card-title { color: #f2eefc; }
        .free-p { color: #d7d2e8; }
        .free-lead, .free-date, .free-moon-sub { color: #b7b0cf; }
        .free-note { color: #d9d3ea; }
        .free-trait { color: #c3aaff; }
        .free-item { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.09); }
        .free-item b { color: #f0ecfb; }
        .free-item span { color: #c6c0da; }
        .free-chip { background: rgba(255,92,141,0.16); color: #ffb3ca; border-color: rgba(255,92,141,0.35); }
        .free-bar { background: rgba(255,255,255,0.10); }
        .free-sub-lbl { color: #c6c0da; }
        .free-sub-val { color: #ff9bb6; }
        .free-retro { border-top-color: rgba(255,255,255,0.10); color: #d7d2e8; }
        .free-retro.on { color: #ff9bb6; }
        .free-retro.off { color: #74e0a4; }
        .free-retro-dt { color: #a49dbe; }
        .free-advice { background: rgba(92,141,255,0.16); color: #dfe6ff; border-left-color: #7ea2ff; }
        .free-avoid { background: rgba(224,85,111,0.16); color: #ffcdd6; border-left-color: #ff7a92; }
        .free-quote { color: #b7b0cf; border-top-color: rgba(255,255,255,0.14); }
        .free-item.free-good { background: rgba(46,158,91,0.16); border-color: rgba(46,158,91,0.30); }
        .free-item.free-good b { color: #74e0a4; }
        .free-item.free-bad { background: rgba(224,85,111,0.14); border-color: rgba(224,85,111,0.30); }
        .free-item.free-bad b { color: #ff9bb6; }
        .bio-host { border-color: rgba(255,255,255,0.12); }

        /* ---- Дневники снов/событий — тёмные ---- */
        .dream-form { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.10); }
        .dream-lbl { color: #cdc6e6; }
        .dream-card { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.10); }
        .dream-card-title { color: #f2eefc; }
        .dream-card-meta, .dream-card-text { color: #cfc9e2; }
        .dream-card-an { color: #b7b0cf; }
        .dream-journal-hint, .dj-count { color: #b0a9c9; }
        .dream-intro summary, .dream-intro-body { color: #cfc9e2; }
        .ev-tr, .astro-asp, .astro-ip-aspect { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.10) !important; color: #e4dff2 !important; }
        .astro-db-card { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.12) !important; color: #e9e5f6; }
        .astro-db-card.active { background: rgba(255,215,92,0.14) !important; border-color: rgba(255,215,92,0.5) !important; }
        .astro-toggle-group { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.12); }
        .astro-empty { color: #a49dbe; }

        /* ---- Форма «Данные рождения» (ввод, не диаграмма) — тёмная ---- */
        .natal-card { background: rgba(255,255,255,0.05) !important; box-shadow: none !important; }
        .natal-card-title { color: #ff9d7a; }
        .natal-clear { color: #ff9d7a; border-bottom-color: rgba(255,157,122,0.6); }
        .natal-lbl, .natal-check { color: #e7e2f3; }
        /* background-color, а не сокращение background: сокращение сбрасывало
           background-repeat/position, и стрелка выпадающего списка размножалась
           плиткой по всему полю (её просто не было видно, пока она была тёмной). */
        .natal-field input, .natal-select { background-color: rgba(255,255,255,0.06) !important; color: #f0ecfb !important; box-shadow: none !important; }
        .natal-field input::placeholder { color: #9d96b8; }
        .natal-select {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23cbb7ff' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
            background-repeat: no-repeat !important;
            background-position: right 18px center !important;
        }
        .natal-advanced { background: rgba(255,255,255,0.04); }
        .natal-advanced > summary { color: #e7e2f3; }
        .natal-howto { color: #ff9d7a; }

        /* ================= Гороскоп: одинарная и двойная карта, «Динамика» ================= */
        .astro-tab--span2 { grid-column: span 2; }
        @media (max-width: 720px) { .astro-tab--span2 { grid-column: 1 / -1; } }
        @media (max-width: 430px) { .astro-tab--span2 { grid-column: auto; } }

        /* Глобальные кнопки и поля сайта — стекло во всю ширину. Здесь сброс с нулевой
           специфичностью (:where), чтобы классы гороскопа перебивали его без !important. */
        :where(.horo-card, .horo-dlg) button {
            width: auto; margin: 0; letter-spacing: 0; overflow: visible; font-family: inherit;
            -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none;
        }
        :where(.horo-card, .horo-dlg) button::before { display: none; }
        :where(.horo-card, .horo-dlg) button:hover { box-shadow: none; }
        :where(.horo-card, .horo-dlg) button:active { transform: none; }
        :where(.horo-card, .horo-dlg) :is(input, select) { width: auto; -webkit-backdrop-filter: none; backdrop-filter: none; }

        .horo-card { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
        .horo-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
        .horo-bar__sp { flex: 1 1 auto; }
        .horo-menu { position: relative; }
        .horo-menu__btn, .horo-quick {
            display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 10px;
            background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); color: #ece8f7;
            font-size: 13.5px; font-weight: 600; line-height: 1.2; cursor: pointer;
        }
        .horo-menu__btn:hover, .horo-quick:hover { background: rgba(255,255,255,0.14); border-color: rgba(255,255,255,0.26); }
        .horo-menu__btn[aria-expanded="true"] { background: rgba(255,255,255,0.16); }
        .horo-quick.on {
            color: #2a1e05; border-color: transparent;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
        }
        .horo-menu__list {
            position: absolute; top: calc(100% + 6px); left: 0; z-index: 40; min-width: 250px;
            display: flex; flex-direction: column; padding: 6px; border-radius: 12px;
            background: #221c3f; border: 1px solid rgba(255,255,255,0.16); box-shadow: 0 18px 40px rgba(0,0,0,0.5);
        }
        .horo-menu__list[hidden] { display: none; }
        .horo-menu__list button {
            text-align: left; background: none; border: 0; border-radius: 8px; color: #ece8f7;
            padding: 9px 12px; font-size: 14px; font-weight: 500; cursor: pointer;
        }
        .horo-menu__list button:hover, .horo-menu__list button:focus-visible { background: rgba(255,255,255,0.10); outline: none; }

        .horo-dyn {
            display: flex; flex-direction: column; gap: 9px; padding: 11px 14px; border-radius: 12px;
            background: rgba(255,215,92,0.07); border: 1px solid rgba(255,215,92,0.32);
        }
        .horo-dyn[hidden] { display: none; }
        .horo-dyn__head { display: flex; align-items: center; gap: 12px; color: #ffe6b8; font-size: 15px; }
        .horo-dyn__shift { color: #d9d3ea; font-size: 13px; font-variant-numeric: tabular-nums; }
        .horo-x {
            margin-left: auto !important; background: none; border: 0; color: #cfc8e2;
            font-size: 24px; line-height: 1; padding: 0 4px; cursor: pointer;
        }
        .horo-x:hover { color: #fff; }
        .horo-dyn__who { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 13.5px; color: #e9e5f6; }
        .horo-when { font-variant-numeric: tabular-nums; color: #fff; }
        .horo-dyn__row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13px; color: #d9d3ea; }
        .horo-dyn__row label { display: inline-flex; align-items: center; gap: 7px; }
        .horo-dyn input, .horo-dyn select {
            padding: 7px 9px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.16); font-size: 14px; min-width: 0;
        }
        .horo-dyn #horoStepN { width: 76px; text-align: center; }
        .horo-dyn__btns { display: inline-flex; gap: 6px; }
        .horo-dbtn {
            width: 48px; height: 40px; padding: 0; border-radius: 10px; font-size: 16px; line-height: 1; cursor: pointer;
            background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.2); color: #fff;
            touch-action: manipulation; user-select: none; -webkit-user-select: none;
        }
        .horo-dbtn:hover { background: rgba(255,255,255,0.18); }
        .horo-dbtn--play, .horo-dbtn--play:hover {
            color: #2a1e05; border-color: transparent;
            background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74));
        }
        .horo-dbtn--play.on { background: #ffd75c; }

        .horo-msg {
            font-size: 13px; color: #ffe6b8; background: rgba(255,215,92,0.10);
            border: 1px solid rgba(255,215,92,0.3); border-radius: 10px; padding: 8px 12px;
        }
        .horo-msg.err { color: #ffcdd6; background: rgba(224,85,111,0.14); border-color: rgba(224,85,111,0.35); }
        .horo-msg[hidden] { display: none; }

        .horo-lines { display: flex; flex-direction: column; gap: 3px; font-size: 13.5px; line-height: 1.45; color: #e9e5f6; }
        .horo-line b { color: #fff; font-weight: 600; }
        .horo-line__hs { color: #b7b0cf; }
        .horo-k0 { color: #ffd75c; font-weight: 700; }
        .horo-k1 { color: #8fd3ff; font-weight: 700; }
        .horo-warn { color: #ffb3a1; font-size: 12px; }

        .horo-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
        .horo-chip {
            position: relative; width: 36px; height: 32px; padding: 0; border-radius: 8px; cursor: pointer;
            display: inline-flex; align-items: center; justify-content: center;
            background: #efeaf9; border: 1px solid rgba(255,255,255,0.3); font-size: 17px; line-height: 1;
            font-family: 'Segoe UI Symbol','Noto Sans Symbols2','Noto Sans Symbols','Apple Symbols',serif;
        }
        .horo-chip:hover { background: #fff; }
        .horo-chip.off { background: rgba(255,255,255,0.10); opacity: .6; }
        .horo-chip.off::after {
            content: ''; position: absolute; left: 7px; right: 7px; top: 50%; height: 2px;
            background: #ff8a7a; transform: rotate(-35deg); border-radius: 1px;
        }
        .horo-chip--txt, .horo-chip--txt:hover {
            width: auto; padding: 0 12px; font-family: inherit; font-size: 13px; font-weight: 600;
            background: rgba(255,255,255,0.07); color: #ece8f7; border-color: rgba(255,255,255,0.16);
        }

        .horo-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, max-content); gap: 16px 24px; align-items: start; }
        @media (max-width: 1000px) { .horo-body { grid-template-columns: minmax(0, 1fr); } }
        .horo-wheel { width: 100%; max-width: 620px; margin: 0 auto; }
        .horo-wheel svg { width: 100%; height: auto; display: block; }
        .horo-side { min-width: 0; }
        /* Таблица положений на телефоне шире экрана и прокручивается внутри себя.
           Раньше об этом ничто не говорило, и у второй карты знак с домом просто
           обрезались. Тень у правого края — чисто на CSS (background-attachment:
           local у первого слоя, scroll у второго): она гаснет сама, когда
           прокрутка дошла до конца. Плюс подсказка словами на узких экранах. */
        .horo-table-wrap {
            max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
            background:
                linear-gradient(to right, rgba(24,20,40,0) 0, rgba(24,20,40,0) 100%) 0 0 / 100% 100% local,
                linear-gradient(to left, rgba(24,20,40,.85), rgba(24,20,40,0)) 100% 0 / 26px 100% scroll;
            background-repeat: no-repeat;
        }
        .horo-scrollhint { display: none; }
        @media (max-width: 560px) { .horo-scrollhint { display: inline; } }
        .horo-tbl { border-collapse: collapse; font-size: 13px; color: #e9e5f6; font-variant-numeric: tabular-nums; }
        .horo-tbl th, .horo-tbl td { padding: 2px 5px; white-space: nowrap; text-align: left; font-weight: 400; }
        .horo-tbl thead th { font-size: 12.5px; font-weight: 700; padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,0.14); }
        .horo-tbl tbody th { text-align: center; padding-right: 8px; }
        .horo-tbl .horo-gap { border-left: 1px solid rgba(255,255,255,0.16); padding-left: 10px; }
        .horo-tbl .horo-r { color: #ff8a7a; font-weight: 700; font-size: 11px; min-width: 9px; }
        .horo-tbl .horo-h { color: #b7b0cf; font-size: 12px; min-width: 16px; }
        .horo-tbl tr.horo-cusp th { font-size: 12px; font-weight: 700; color: #d8c78f; }
        .horo-tbl tr.horo-sep > * { border-top: 1px solid rgba(255,255,255,0.14); padding-top: 6px; }
        .horo-tbl-note { margin-top: 6px; font-size: 12px; color: #b7b0cf; max-width: 440px; }
        .horo-g {
            display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 2px;
            border-radius: 5px; background: #efeaf9; font-size: 15px; line-height: 1;
            font-family: 'Segoe UI Symbol','Noto Sans Symbols2','Noto Sans Symbols','Apple Symbols',serif;
        }

        .horo-asp { display: grid; grid-template-columns: minmax(0, max-content) minmax(0, 1fr); gap: 16px 28px; align-items: start; }
        @media (max-width: 900px) { .horo-asp { grid-template-columns: minmax(0, 1fr); } }
        .horo-asp-col { min-width: 0; }
        .horo-asp h4 { margin: 0 0 8px; font-size: 12.5px; color: #cdc6e6; text-transform: uppercase; letter-spacing: .4px; }
        .horo-grid-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .horo-grid { border-collapse: collapse; }
        .horo-grid th, .horo-grid td {
            width: 22px; height: 22px; padding: 0; text-align: center; vertical-align: middle; line-height: 1;
            border: 1px solid rgba(255,255,255,0.12); font-size: 13px; font-weight: 400;
            font-family: 'Segoe UI Symbol','Noto Sans Symbols2','Noto Sans Symbols','Apple Symbols',serif;
        }
        .horo-grid th { background: #efeaf9; font-size: 12.5px; font-weight: 700; }
        .horo-grid td { background: rgba(255,255,255,0.03); }
        .horo-grid td.x { background: #f6f2fd; font-weight: 700; cursor: help; }
        .horo-grid .horo-grid-corner { font-family: Arial, sans-serif; font-size: 9px; color: #5c5476; white-space: nowrap; padding: 0 3px; }
        .horo-asp-list { max-height: 340px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: #e9e5f6; }
        .horo-asp-row {
            display: grid; grid-template-columns: minmax(0, 1fr) 26px minmax(0, 1fr) 54px 84px;
            gap: 6px; align-items: center; padding: 3px 6px; border-radius: 6px;
        }
        .horo-asp-row:nth-child(odd) { background: rgba(255,255,255,0.045); }
        .horo-asp-pt { display: inline-flex; align-items: center; gap: 6px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .horo-asp-g {
            display: inline-flex; justify-content: center; align-items: center; width: 24px; height: 20px; border-radius: 5px;
            background: #efeaf9; font-size: 14px; font-weight: 700;
            font-family: 'Segoe UI Symbol','Noto Sans Symbols2','Noto Sans Symbols','Apple Symbols',serif;
        }
        .horo-asp-orb { font-variant-numeric: tabular-nums; }
        .horo-asp-ap { color: #b7b0cf; font-size: 12px; }
        .horo-asp-ap.ap { color: #ffd75c; }
        @media (max-width: 560px) {
            .horo-asp-row { grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 46px; }
            .horo-asp-ap { display: none; }
        }

        .horo-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12px; color: #b7b0cf; }
        .horo-legend i { display: inline-block; width: 16px; height: 3px; margin-right: 6px; vertical-align: middle; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,0.45); }
        .horo-legend i.dash { height: 0; border-top: 2px dashed #a37b3d; border-radius: 0; }
        .horo-legend b { font-weight: 700; }

        /* Полный экран: колесо и таблица, остальное прячем */
        .horo-card.natal-fs { gap: 8px; }
        .horo-card.natal-fs .horo-asp, .horo-card.natal-fs .horo-legend, .horo-card.natal-fs .horo-tbl-note { display: none; }
        .horo-card.natal-fs .horo-body { grid-template-columns: minmax(0, 1fr) minmax(0, max-content); align-items: center; }
        .horo-card.natal-fs .horo-wheel { max-width: min(640px, 70vh); }

        /* Окна гороскопа (вне .astro-view — свои тёмные поля) */
        .horo-modal {
            position: fixed; inset: 0; z-index: 10050; overflow-y: auto;
            display: flex; align-items: flex-start; justify-content: center; padding: 5vh 12px;
            background: rgba(10,8,20,0.66);
        }
        .horo-dlg {
            width: min(660px, 100%); border-radius: 16px; color: #ece8f7;
            background: linear-gradient(160deg, #241e44, #17132b); border: 1px solid rgba(255,255,255,0.14);
            box-shadow: 0 30px 80px rgba(0,0,0,0.55);
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
        }
        .horo-dlg__head {
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
            padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,0.10); font-size: 18px; font-weight: 700;
        }
        .horo-dlg__x { background: none; border: 0; color: #cfc8e2; font-size: 28px; line-height: 1; padding: 0 4px; cursor: pointer; }
        .horo-dlg__x:hover { color: #fff; }
        .horo-dlg__body { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; }
        .horo-dlg__foot {
            display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
            padding: 12px 18px 16px; border-top: 1px solid rgba(255,255,255,0.10);
        }
        .horo-dlg__sp { flex: 1 1 auto; }
        .horo-dlg__hr { border: 0; border-top: 1px dashed rgba(255,255,255,0.2); margin: 4px 0; }
        .horo-dlg label { color: #d9d3ea; font-size: 13px; }
        .horo-dlg input, .horo-dlg select {
            background-color: rgba(255,255,255,0.07); color: #f0ecfb; border: 1px solid rgba(255,255,255,0.18);
            border-radius: 8px; padding: 9px 10px; font-size: 14px; min-width: 0;
        }
        .horo-dlg input:focus, .horo-dlg select:focus { outline: none; border-color: #ffd75c; box-shadow: 0 0 0 3px rgba(255,215,92,0.18); }
        .horo-dlg input:disabled { opacity: .5; }
        :where(.horo-card, .horo-dlg) input[type="checkbox"] {
            width: 17px; height: 17px; padding: 0; margin: 0; flex: 0 0 auto; accent-color: #f0b84a; cursor: pointer;
        }
        .horo-form { display: flex; flex-direction: column; gap: 10px; }
        .horo-form__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
        .horo-form__num { font-weight: 700; color: #ffd75c; }
        .horo-fg { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
        .horo-fg > label, .horo-fl { display: flex; flex-direction: column; gap: 5px; }
        .horo-fg > label { flex: 1 1 150px; }
        .horo-fg > label.horo-fg__narrow { flex: 0 0 80px; }
        .horo-fg > label input, .horo-fg > label select, .horo-fl input, .horo-fl select { width: 100%; }
        .horo-fl { width: 100%; }
        .horo-place { position: relative; }
        .horo-sug {
            position: absolute; left: 0; right: 0; top: 100%; z-index: 5; margin-top: 4px; max-height: 260px; overflow-y: auto;
            background: #221c3f; border: 1px solid rgba(255,255,255,0.18); border-radius: 10px; box-shadow: 0 16px 36px rgba(0,0,0,0.45);
        }
        .horo-sug[hidden] { display: none; }
        .horo-sug__item { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; cursor: pointer; }
        .horo-sug__item:hover { background: rgba(255,255,255,0.08); }
        .horo-sug__item b { color: #fff; font-size: 14px; font-weight: 600; }
        .horo-sug__item span { color: #b7b0cf; font-size: 12px; }
        .horo-sug__load { padding: 8px 12px; color: #b7b0cf; font-size: 12px; font-style: italic; }
        .horo-sug__attr { padding: 6px 12px; color: #b7b0cf; font-size: 11px; border-top: 1px solid rgba(255,255,255,0.12); }
        .horo-place-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; align-items: stretch; }
        .horo-place-find { border: 1px solid rgba(255,255,255,0.22); background: rgba(255,255,255,0.06);
            color: #efeaff; border-radius: 10px; padding: 0 12px; font-size: 13px; cursor: pointer; white-space: nowrap; }
        .horo-place-find:hover { background: rgba(255,255,255,0.12); }
        /* Телефоны уже 360px: поле места во всю ширину, «Найти» — под ним. Рядом с кнопкой
           полю оставалось ~118px, и подсказка «Например, Москва» обрезалась (01.10.2026). */
        @media (max-width: 359px) {
            .astro-place-row, .horo-place-row { grid-template-columns: minmax(0, 1fr); }
            .astro-place-find, .horo-place-find { padding: 8px 12px; }
        }
        .horo-check { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 8px; cursor: pointer; }
        .horo-note { font-size: 12px; line-height: 1.45; color: #b7b0cf; }
        .horo-err { color: #ffb3a1; font-size: 13px; }
        .horo-err[hidden] { display: none; }
        .horo-link {
            background: none; border: 0; padding: 0; color: #ff9d7a; cursor: pointer;
            font-size: 13px; font-weight: 500; text-decoration: underline; text-underline-offset: 3px;
        }
        .horo-btn {
            border-radius: 10px; padding: 10px 18px; font-size: 14px; font-weight: 600; line-height: 1.2; cursor: pointer;
            border: 1px solid transparent;
        }
        .horo-btn[hidden] { display: none; }
        .horo-btn--gold, .horo-btn--gold:hover { color: #2a1e05; background: linear-gradient(135deg, #ffe9b0, rgb(240,184,74) 45%, rgb(224,138,74)); }
        .horo-btn--ghost { color: #ece8f7; background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.16); }
        .horo-btn--ghost:hover { background: rgba(255,255,255,0.15); }
        .horo-btn--sm { padding: 8px 12px; font-size: 13px; }
        .horo-new { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
        @media (max-width: 560px) { .horo-new { grid-template-columns: minmax(0, 1fr); } }
        .horo-new__card {
            display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 12px; text-align: left; cursor: pointer;
            background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); color: #ece8f7;
        }
        .horo-new__card:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,215,92,0.5); }
        .horo-new__card b { font-size: 16px; color: #fff; }
        .horo-new__card span { font-size: 13px; color: #b7b0cf; font-weight: 400; }
        .horo-pts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 24px; }
        .horo-pts__h { margin-bottom: 4px; font-size: 12px; color: #cdc6e6; text-transform: uppercase; letter-spacing: .4px; }
        .horo-pts__h--gap { margin-top: 14px; }
        .horo-pt { display: flex; align-items: center; gap: 9px; padding: 4px 0; cursor: pointer; font-size: 14px !important; color: #ece8f7 !important; }
        .horo-pts__quick { display: flex; flex-wrap: wrap; gap: 8px 18px; }
        .horo-db { display: flex; flex-direction: column; gap: 6px; max-height: 60vh; overflow-y: auto; }
        .horo-db__row {
            display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
            padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,0.05);
        }
        .horo-db__row b { display: block; color: #fff; }
        .horo-db__row span { font-size: 12px; color: #b7b0cf; }
        .horo-db__btns { display: flex; flex-wrap: wrap; gap: 6px; }

        /* Печать: только карточка гороскопа, на белом */
        @media print {
            html.horo-print body * { visibility: hidden !important; }
            html.horo-print #horoCard, html.horo-print #horoCard * { visibility: visible !important; }
            html.horo-print #horoCard {
                position: absolute !important; left: 0; top: 0; width: 100% !important; margin: 0 !important;
                background: #fff !important; box-shadow: none !important; border: 0 !important;
            }
            html.horo-print .horo-bar, html.horo-print .horo-dyn, html.horo-print .horo-chips, html.horo-print .horo-msg { display: none !important; }
            html.horo-print .horo-lines, html.horo-print .horo-line b, html.horo-print .horo-tbl,
            html.horo-print .horo-asp-list, html.horo-print .horo-legend, html.horo-print .horo-asp h4, html.horo-print .horo-tbl-note { color: #111 !important; }
            html.horo-print .horo-asp-list { max-height: none; overflow: visible; }
            html.horo-print .horo-k1 { color: #1c5f8c !important; }
            html.horo-print .horo-k0 { color: #8a6200 !important; }
        }

        

/* ---- Пояснение «Система домов» (пилот 07.10.2026, astrology.js → _houseHelp, houseHelpOn) ---- */
.natal-help--btn {
    width: 20px; height: 20px; min-width: 20px; padding: 0; margin: 0; border: none; cursor: pointer;
    background: rgba(230, 200, 119, 0.16); color: #e6c877; font-size: 12px; font-weight: 800;
}
.natal-help--btn:hover { background: rgba(230, 200, 119, 0.28); }
.natal-hint { font-size: 12.5px; line-height: 1.4; color: rgba(231, 226, 243, 0.62); margin-top: -2px; }
.hs-modal { width: min(540px, 100%); }
.hs-modal .df-title { padding: 0 40px; line-height: 1.3; }
.hs-lead { font-size: 14px; line-height: 1.55; opacity: .88; margin: 0 0 12px; text-align: left; }
.hs-rec {
    padding: 12px 14px; margin: 0 0 12px; border-radius: 14px; text-align: left; font-size: 13.5px; line-height: 1.5;
    background: rgba(240, 184, 74, 0.10); border: 1px solid rgba(240, 184, 74, 0.45);
}
.hs-rec b { color: #ffe3a3; }
.hs-list { display: flex; flex-direction: column; gap: 8px; }
.hs-item {
    display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; text-align: left;
    background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.10);
}
.hs-item.is-current { border-color: rgba(240, 184, 74, 0.6); background: rgba(240, 184, 74, 0.07); }
.hs-text { flex: 1 1 auto; min-width: 0; }
.hs-item b { display: block; font-size: 14.5px; margin-bottom: 3px; }
.hs-item b em { font-style: normal; font-weight: 600; font-size: 12.5px; color: #e6c877; }
.hs-item span { display: block; font-size: 13px; line-height: 1.45; opacity: .8; }
.hs-pick {
    flex: 0 0 auto; width: auto; padding: 7px 13px; border-radius: 999px; cursor: pointer;
    border: 1px solid rgba(240, 184, 74, 0.55); background: rgba(240, 184, 74, 0.12);
    color: #ffe3a3; font-size: 12.5px; font-weight: 700;
}
.hs-note { font-size: 12.5px; opacity: .65; margin: 12px 0 14px; text-align: center; }