/* ── Единый канон светлой темы, шаг 2.4: функциональные границы ──
   Граница, которая НЕСЁТ СМЫСЛ — поле ввода, кольцо фокуса, дорожка тумблера,
   чекбокс, активная вкладка — обязана быть видимой. Декоративные --border и
   --sep для этого слишком слабые (контраст 1.2–1.6), состояние на них вешать
   нельзя. Светлая тема — #8a6a24 (4.09 к фону), тёмная — rgba(230,196,118,.45)
   (3.10, значение уже жило в offline.html). */
:root{--border-strong:rgba(230,196,118,.45)}
html.light,html.lite,html.cardlite,html[data-theme="light"]{--border-strong:#8a6a24}
input:not([type=hidden]),select,textarea{border-color:var(--border-strong)}
input:not([type=hidden]):focus,select:focus,textarea:focus,button:focus-visible,
a:focus-visible,[role=button]:focus-visible{outline:2px solid var(--border-strong);outline-offset:2px}
.tg,.cbox,.ch,.tab.on,.nav-tab.active,.seg button.on{border-color:var(--border-strong)}

/* Обёртка списков даты/времени: внутри строки настроек она флекс-элемент и без
   min-width:0 не сжимается — два списка вылезают за строку. */
.dzdob{min-width:0;max-width:100%}
.r .dzdob{flex:0 0 auto}
.r .dzdob .dzd{flex:0 0 auto;width:auto;min-width:0;padding-left:7px;padding-right:18px;font-size:14px}

/* ── СВЕТЛАЯ ТЕМА ДЛИННЫХ ДОКУМЕНТОВ ──────────────────────────────────────
   Оферта, конфиденциальность, порядок удаления аккаунта и поддержка — это
   самые длинные экраны приложения, и читают их дольше всего. Светлой темы у
   них не было вообще: тумблер в профиле их не касался, своего тумблера не
   было, и человек, выбравший светлую, попадал в чёрный лист.

   Правила живут ЗДЕСЬ, а не в каждом документе, потому что вёрстка у всех
   четырёх одна (.top/.doc/.card/.qa/.warn). canon.css подключается раньше
   вёрстки экрана, поэтому специфичность поднята префиксом html.light —
   иначе более позднее правило страницы победило бы.

   Значения — канон: bgRoot.light #EFE7D3, cream.light #241C08,
   gold.light #8A6A24 (design/tokens.json). Своих цветов не выдумываем. */
html.light body{background:#efe7d3;color:#241c08}
/* Фото ночного неба в светлой теме не прячем насовсем: экран, у которого
   есть СВОЙ светлый снимок (Карта), перебивает это правило своим filter —
   поэтому здесь именно filter, а не opacity/display, иначе светлое небо
   Карты стало бы невидимым. */
html.light .csky{filter:brightness(1.5) saturate(.72) contrast(.82) opacity(.22)}
html.light .cskyscrim,html.light .cscrim{background:linear-gradient(180deg,#f6f0e0,#efe7d3)}
html.light .top b{color:#241c08}
html.light .bk{border-color:rgba(138,106,36,.42);color:#795a20}
html.light .doc{background:rgba(255,253,248,.86);border-color:rgba(138,106,36,.24);box-shadow:0 10px 30px rgba(120,100,40,.10)}
html.light .doc h1{color:#241c08}
html.light .doc h2,html.light .doc h3{color:#795a20}
html.light .doc p,html.light .doc li{color:#514b43}
html.light .doc a,html.light main a{color:#795a20}
html.light .op,html.light .lead{color:#514b43}
html.light .upd,html.light .legal{color:#514b43}
html.light .lead,html.light .warn{background:rgba(201,168,76,.12);border-color:rgba(138,106,36,.32);color:#514b43}
html.light hr{border-top-color:rgba(138,106,36,.24)}
html.light .card{background:rgba(255,253,248,.76);border-color:rgba(138,106,36,.26)}
html.light .card .ic{background:rgba(201,168,76,.12);border-color:rgba(138,106,36,.32)}
html.light .card .ic svg{stroke:#795a20}
html.light .card .tt{color:#241c08}
html.light .card .ss,html.light .qa .a{color:#514b43}
html.light .qa .q{color:#795a20}
html.light main{color:#241c08}
html.light main h1,html.light main h2{color:#795a20}

/* ── СВЕТЛАЯ ТЕМА ЭКРАНОВ-ФОРМ И КАРТОЧЕК ────────────────────────────────
   «Оценка сотрудника», совместимость, семейные, карта другому, подарок,
   редактирование данных рождения — у всех одна вёрстка
   (.csky/.cscrim/.wrap/.top/.card/.seg/.go/.paywall) и до сих пор не было
   светлого набора: класс темы вставал, а экран оставался тёмным. Это и есть
   «упрощённый набор», которого быть не должно.

   Набор ОДИН и общий — тот же, что у документов и у Карты: bgRoot.light
   #EFE7D3, cream.light #241C08, gold.light #8A6A24 (design/tokens.json).
   Специфичность поднята префиксом html.light: canon.css подключается раньше
   вёрстки экрана и без префикса проиграл бы ей. */

html.light .cstars,html.light .cskyscrim{display:none}
html.light .cscrim{background:linear-gradient(180deg,#f6f0e0,#efe7d3 60%,#efe7d3)}
html.light .pw-bg{background:linear-gradient(180deg,#f6f0e0,#efe7d3);filter:none}
html.light body{color:#241c08}
html.light .top h1,html.light .top .tt,html.light .ttl{color:#241c08}
html.light .back,html.light .bk{background:rgba(255,253,248,.72);border-color:rgba(138,106,36,.42);color:#795a20}
html.light .intro,html.light .msg,html.light .bnote{color:#514b43}
/* `.sect` УБРАН ИЗ СПИСКА ПЛАШЕК. Это капслок-подпись секции («ТВОИ КАРТЫ»,
   «ДОБАВИТЬ»), а не поверхность: под ней вырастала кремовая полоса во всю
   ширину, которой нет ни на одном макете. Плотность плашки задаётся ниже,
   в блоке «стекло», — здесь остаются только край и тень. */
html.light .card,html.light .doc,html.light .bdoc,html.light .gcard,html.light .fav,html.light .sec
{background:rgba(255,253,248,.86);border-color:rgba(138,106,36,.26);box-shadow:0 10px 30px rgba(120,100,40,.10)}
html.light label,html.light .gsh,html.light .fav-title{color:#795a20}
html.light input:not([type=hidden]),html.light textarea,html.light select
{background:rgba(255,253,248,.9);color:#241c08;border-color:rgba(138,106,36,.42)}
html.light input::placeholder,html.light textarea::placeholder{color:rgba(36,28,8,.42)}
html.light .seg button{background:rgba(255,253,248,.7);color:#514b43;border-color:rgba(138,106,36,.36)}
html.light .seg button.on{background:linear-gradient(135deg,#e7c66d,#c89b49);color:#29251f}
html.light .go,html.light .act,html.light .gsbtn{color:#29251f}
html.light .load,html.light .empty,html.light .fav-meta,html.light .fav-time,html.light .gstxt,html.light .gssub
{color:#514b43}
html.light .bdoc p,html.light .doc p{color:#514b43}
html.light .bdoc b,html.light .doc b,html.light .fav-label{color:#795a20}
html.light .paywall{background:linear-gradient(180deg,rgba(255,252,246,.94),rgba(246,240,224,.88))!important;
border-color:rgba(138,106,36,.34)!important;box-shadow:0 18px 50px rgba(120,100,40,.14)!important}
html.light .paywall h3{color:#241c08!important;text-shadow:none!important}
html.light .paywall p{color:#514b43!important;text-shadow:none!important}
html.light .paywall .cta.alt{background:rgba(255,253,248,.9)!important;color:#795a20!important;
border-color:rgba(138,106,36,.4)!important}
html.light .paywall .tariff,html.light .ctariff{background:rgba(255,253,248,.8)!important;
border-color:rgba(138,106,36,.3)!important}

/* ── ФОН ЭКРАНА НЕ ЗАКРАШИВАТЬ ─────────────────────────────────────────────
   ЗАКОН: экраны полноэкранные, плашки плавают стеклом, ФОН ИДЁТ ПОД НИМИ.

   Экран с атмосферным фоном строит его тремя слоями — .csky (снимок неба),
   .cstars (звёздная пыль), .cscrim (затемнение под текст). Все три стоят на
   ОТРИЦАТЕЛЬНОМ z-index, то есть ниже содержимого. Но собственный фон <body>
   непрозрачен (`background:var(--bg)`), а по порядку отрисовки фон блочного
   потомка корня рисуется ПОСЛЕ слоёв с отрицательным z-index — и закрашивает
   их целиком. Человек видит плоскую чёрную заливку: именно её владелец и
   прислал со снимка «Прогноз на неделю» до генерации.

   Чинится ровно один раз и здесь, а не в каждом экране: фон уводится на
   <html> (он рисует холст и не перекрывает слои), а <body> становится
   прозрачным. Правило действует ТОЛЬКО там, где слои реально есть, поэтому
   экраны без них (главная со своим .bg, чат, профиль) не затронуты.
   Цвет на <html> остаётся, чтобы не было ни белой вспышки при загрузке, ни
   просвета под слоями. */
html:has(> body > .csky){background:#06060b}
html.light:has(> body > .csky),html.cardlite:has(> body > .csky),
html[data-theme="light"]:has(> body > .csky){background:#efe7d3}
body:has(> .csky){background:transparent!important}

/* ══════════════════════════════════════════════════════════════════════════
   СВЕТЛАЯ ТЕМА: МИР — ВУАЛЬ — СТЕКЛО — ШАПКА — БАР
   Утверждено владельцем по макетам light-theme-luminous-worlds-2026-08-14.

   До этого блока «светлая тема» означала плоскую кремовую страницу: мира не
   было, стекла не было, шапка и нижний бар оставались ночными. Утверждена
   другая композиция — светящийся мир-фотография во всю страницу, поверх него
   молочное стекло, светлая шапка и светлый нижний бар.

   Живёт ЗДЕСЬ, а не в тридцати одном экране, потому что композиция у всех
   одна. Экран называет только свой мир (через `data-dz-route`), всё
   остальное — общее. Тёмной темы блок не касается вообще: каждый селектор
   начинается с `html.light` (внутренние экраны) или `html.lite` (главная,
   которая живёт по времени суток и класса `light` не получает никогда).
   ══════════════════════════════════════════════════════════════════════════ */

html.light,html.lite{
  /* палитра — утверждена, не переоткрывать */
  --lt-ink:#29251f;              /* ink чипов */
  --lt-gold:#795a20;             /* золото текста */
  --lt-gold-warm:#654b19;        /* главная и семейные — теплее */
  --lt-sec:#514b43;              /* вторичный серый */
  --lt-milk:255,253,248;         /* молоко #FFFDF8 */
  --lt-line:rgba(121,90,32,.30);
  --lt-line-soft:rgba(121,90,32,.20);
  /* вуаль на мир — потолок .22, выше не поднимать */
  --lt-veil:rgba(255,255,255,.22);
  /* стекло — ПОЛ, не потолок: где макет плотнее, экран ставит плотнее сам */
  --lt-s-f0:rgba(var(--lt-milk),.30);      /* F0 — результат прогноза */
  --lt-s-panel:rgba(var(--lt-milk),.42);   /* плашки */
  --lt-s-form:rgba(var(--lt-milk),.52);    /* формы и карточки-документы */
  --lt-s-field:rgba(var(--lt-milk),.62);   /* поля ввода */
  --lt-blur-panel:blur(9px);
  --lt-blur-form:blur(13px);
  --lt-world:none;
}

/* ── КАРТА МИРОВ: экран → мастер. Канон — ROUTE_ASSET_MAP.md ──────────────
   `data-dz-route` пишут ДВА места (встроенная загрузка в <head> каждого
   экрана и dztheme.js), и оба оставляют расширение: значение равно
   "card.html", а не "card". Формат менять не стали — это поведение темы,
   утверждённое прошлым проходом, и трогать его ради вёрстки нельзя.
   Поэтому здесь перечислены ОБА написания: живое "card.html" и голое
   "card" — на случай, если адреса когда-нибудь станут без расширения,
   мир не должен молча исчезнуть. */

html.light[data-dz-route="card.html"],
html.light[data-dz-route="card"],
html.light[data-dz-route="external_new.html"],
html.light[data-dz-route="external_new"]{--lt-world:url("assets/w/inner-atlas.jpg")}

html.light[data-dz-route="solar_year.html"],
html.light[data-dz-route="solar_year"]{--lt-world:url("assets/w/solar-observatory.jpg")}

html.light[data-dz-route="forecast_week.html"],
html.light[data-dz-route="forecast_week"]{--lt-world:url("assets/w/forecast-week.jpg")}

html.light[data-dz-route="forecast_month.html"],
html.light[data-dz-route="forecast_month"],
html.light[data-dz-route="mirror.html"],
html.light[data-dz-route="mirror"]{--lt-world:url("assets/w/forecast-month.jpg")}

html.light[data-dz-route="forecast_business_week.html"],
html.light[data-dz-route="forecast_business_week"]{--lt-world:url("assets/w/business-week.jpg")}

html.light[data-dz-route="forecast_business_month.html"],
html.light[data-dz-route="forecast_business_month"]{--lt-world:url("assets/w/business-month.jpg")}

html.light[data-dz-route="business_doc.html"],
html.light[data-dz-route="business_doc"]{--lt-world:url("assets/w/business-risks.jpg")}

html.light[data-dz-route="employee_new.html"],
html.light[data-dz-route="employee_new"],
html.light[data-dz-route="profile.html"],
html.light[data-dz-route="profile"],
html.light[data-dz-route="birth_edit.html"],
html.light[data-dz-route="birth_edit"]{--lt-world:url("assets/w/celestial-profile.jpg")}

html.light[data-dz-route="compat_hub.html"],
html.light[data-dz-route="compat_hub"],
html.light[data-dz-route="compat_new.html"],
html.light[data-dz-route="compat_new"]{--lt-world:url("assets/w/confluence.jpg")}

html.light[data-dz-route="family.html"],
html.light[data-dz-route="family"]{--lt-world:url("assets/w/family-partner.jpg")}

html.light[data-dz-route="family_new.html"],
html.light[data-dz-route="family_new"]{--lt-world:url("assets/w/family-child.jpg")}

html.light[data-dz-route="day_setup.html"],
html.light[data-dz-route="day_setup"],
html.light[data-dz-route="diary.html"],
html.light[data-dz-route="diary"]{--lt-world:url("assets/w/living-grove.jpg")}

html.light[data-dz-route="chat.html"],
html.light[data-dz-route="chat"],
html.light[data-dz-route="favorites.html"],
html.light[data-dz-route="favorites"],
html.light[data-dz-route="signals.html"],
html.light[data-dz-route="signals"],
html.light[data-dz-route="bell.html"],
html.light[data-dz-route="bell"],
html.light[data-dz-route="privacy.html"],
html.light[data-dz-route="privacy"],
html.light[data-dz-route="terms.html"],
html.light[data-dz-route="terms"],
html.light[data-dz-route="support.html"],
html.light[data-dz-route="support"]{--lt-world:url("assets/w/quiet-reading.jpg")}

html.light[data-dz-route="login.html"],
html.light[data-dz-route="login"],
html.light[data-dz-route="onboarding.html"],
html.light[data-dz-route="onboarding"],
html.light[data-dz-route="delete-account.html"],
html.light[data-dz-route="delete-account"]{--lt-world:url("assets/w/quiet-form.jpg")}

html.light[data-dz-route="offline.html"],
html.light[data-dz-route="offline"]{--lt-world:url("assets/w/offline-calm.jpg")}

html.light[data-dz-route="gift.html"],
html.light[data-dz-route="gift"]{--lt-world:url("assets/w/sunlit-threshold.jpg")}

/* ── СЛОЙ МИРА И ВУАЛЬ ──────────────────────────────────────────────────────
   Мир — псевдоэлементы КОРНЯ, а не разметка экрана: тогда его получают все
   тридцать один экран разом и ни один не копирует у соседа. Ширина повторяет
   рамку приложения (440px по центру) — ровно как `.bg` главной, иначе на
   планшете мир расползся бы шире содержимого.

   z-index:-1 выбран не «поменьше», а точно: ночные слои экранов стоят на
   -3/-2/-1, и кремовый `body::before` серверных документов — на -2. Мир на
   -1 встаёт ВЫШЕ них и НИЖЕ любого содержимого в потоке. */
html.light::before,html.light::after{
  content:"";position:fixed;top:0;bottom:0;left:50%;width:100%;max-width:440px;
  transform:translateX(-50%);z-index:-1;pointer-events:none}
html.light::before{
  background-image:var(--lt-world);background-size:cover;background-position:center top;
  background-repeat:no-repeat}
html.light::after{background:var(--lt-veil)}

/* Фон корня — земля ПОД миром: без неё при загрузке мигает белым, а по краям
   широкого экрана зияет пусто. */
html.light{background:#efe7d3}

/* ЗАКОН ПОЛНОЭКРАННОСТИ. Непрозрачный фон <body> рисуется ПОСЛЕ слоёв с
   отрицательным z-index и закрасил бы мир целиком — это та же ловушка, что
   описана выше для `.csky`, только теперь она касается каждого экрана.
   Поэтому в светлой теме несущие оболочки прозрачны, а цвет живёт на <html>.
   `!important` здесь обязателен: canon.css грузится РАНЬШЕ вёрстки экрана. */
html.light body,html.light .phone,html.light .wrap,html.light .hub,
html.light .page,html.light main{background:transparent!important}

/* СЕРВЕРНЫЕ ДОКУМЕНТЫ — отдельный случай, и без него мира на них не будет.
   Разбор Карты, готовый прогноз и бизнес-документ приходят с сервера и
   ПОДМЕНЯЮТ документ целиком, дописывая собственный <style> уже после
   canon.css. Там есть `html.cardlite body{background:#efe7d3!important}` —
   та же специфичность (0,1,2), что и у правила выше, но позже по порядку,
   поэтому побеждает оно и заливает мир сплошным кремом.
   `html.light.cardlite body` даёт (0,2,2) и выигрывает независимо от порядка.
   Классы `light` и `cardlite` встроенная загрузка ставит всегда вместе. */
html.light.cardlite body{background:transparent!important}

/* Ночные слои экрана в светлой теме не показываем: это снимки ночного неба,
   звёздная пыль и затемнение под белый текст. Их место занял мир. */
html.light :is(.csky,.cstars,.cskyscrim,.cscrim,.cdust,.stars,.dust,.starfield,
  .grain,.vignette,.bgw,.dzsky,.dzstars,.dzscrim,.pw-bg){display:none!important}

/* ── МОЛОЧНОЕ СТЕКЛО ───────────────────────────────────────────────────────
   Стекло обязано ПРОПУСКАТЬ мир. Плотность — пол из утверждённых значений;
   экран, которому по макету нужно плотнее, ставит плотнее у себя. */
html.light :is(.card,.doc,.bdoc,.gcard,.fav,.sec,.row,.opt,.tile,.box,.item,
  .rowc,.pcard,.dcard,.scard){
  background:var(--lt-s-form)!important;
  -webkit-backdrop-filter:var(--lt-blur-form) saturate(1.05);
  backdrop-filter:var(--lt-blur-form) saturate(1.05);
  border-color:var(--lt-line)!important;
  box-shadow:0 10px 28px rgba(90,74,32,.10)!important}

/* Плашки — легче форм: под ними мир должен читаться. */
html.light :is(.chip,.pill,.tag,.badge,.seg,.tabs,.nav-tabs){
  background:var(--lt-s-panel)!important;
  -webkit-backdrop-filter:var(--lt-blur-panel);backdrop-filter:var(--lt-blur-panel);
  border-color:var(--lt-line)!important}

/* Поля ввода — самые плотные: в них пишут. */
html.light :is(input:not([type=hidden]),textarea,select){
  background:var(--lt-s-field)!important;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:var(--lt-ink)!important}

/* Капслок-подписи секций: цвет на полной альфе, НИКАКОЙ плашки под ними —
   на макетах они лежат прямо на мире. */
html.light .sect{opacity:1;background:none!important;border:0!important;
  box-shadow:none!important;color:var(--lt-gold)!important;
  text-shadow:0 1px 4px rgba(255,253,246,.85),0 0 10px rgba(255,253,246,.55)}

/* Текст поверх мира читается только с молочным подсветом — иначе буква тонет
   в светлом снимке. Тень белая и короткая, это не «свечение». */
html.light :is(h1,h2,.hero h1,.ttl,.tt,.hero p,.intro,.lead,.empty,.load,.note,
  .addbtn,.sub,.hint,.msg){
  text-shadow:0 1px 4px rgba(255,253,246,.80)}
html.light :is(.card,.doc,.bdoc,.gcard,.fav,.sec,.row,.opt) :is(h1,h2,h3,p,b,span,div){
  text-shadow:none}

/* ── ШАПКА ─────────────────────────────────────────────────────────────────
   Сплошной полосы от края до края нет НИ В ОДНОМ состоянии — ни в покое, ни
   прилипшей. Это закон владельца («плашки плавают стеклом, контент проходит
   под ними») и он же — письменное решение дизайн-пакета:
   · FINAL_DESIGN_CRITIQUE.md, п. 8: «A broad header override created flat white
     forecast strips → removed; only legal/support sticky headers keep the
     protected bar»;
   · IMPLEMENTATION_HANDOFF.md: «Headers/back/theme buttons: S1/S2 or transparent
     safe-zone, not flat edge-to-edge white».
   Прошлый проход как раз и вернул снятый дизайнером дефект: `.top` получил
   заливку во всю ширину с жёсткой нижней границей («квадрат сверху»).

   Состояний ровно два, и оба сняты с утверждённых макетов:
   · `.topbar` — плавающая пилюля (Семья, Совместимость, Профиль, Избранное,
     Сигналы). На макетах пилюля видна пиксельно: у compat_hub её левая грань
     стоит на x=24 при ширине кадра 720;
   · `.top` — ПРОЗРАЧНАЯ безопасная зона. На макетах card/diary/bell/day_setup/
     gift/mirror/birth_edit/business_doc/прогнозов/privacy/terms/support никакой
     плашки под шапкой нет: мир доходит до верха, плавают только круглые кнопки
     (сканирование тех же строк даёт ровный мир без вертикальных граней).
   Исключение одно и оно тоже из пакета: правовые и поддержка — единственные
   экраны, где `.top` ПРИЛИПАЕТ. Прозрачной ей там быть нельзя, под ней поедет
   текст, поэтому она становится такой же плавающей пилюлей, что и `.topbar`. */
html.light .topbar{
  background:rgba(var(--lt-milk),.72)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08);backdrop-filter:blur(18px) saturate(1.08);
  border-color:var(--lt-line)!important;
  box-shadow:0 8px 24px rgba(90,74,32,.12)!important}

html.light .top{
  background:none!important;background-color:transparent!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  border:0!important;box-shadow:none!important}

/* Прилипшая шапка правовых и поддержки — пилюля, а не полоса. Безопасную зону
   переносим из padding в margin: иначе отступ статус-бара оказался бы ВНУТРИ
   стекла и пилюля выросла бы вверх до самого края экрана. */
html.light[data-dz-route^="privacy"] .top,
html.light[data-dz-route^="terms"] .top,
html.light[data-dz-route^="support"] .top{
  position:sticky!important;
  top:calc(env(safe-area-inset-top,0px) + 10px)!important;
  z-index:50!important;
  margin:calc(env(safe-area-inset-top,0px) + 10px) 12px 10px!important;
  padding:10px 14px!important;
  border-radius:20px!important;
  background:rgba(var(--lt-milk),.72)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  border:1px solid var(--lt-line)!important;
  box-shadow:0 8px 24px rgba(90,74,32,.12)!important}
html.light :is(.top,.topbar) :is(b,.tt,h1,.ttl){color:var(--lt-ink)!important}
html.light :is(.bk,.back,.cth,.topbar .bk,.topbar .cth){
  background:rgba(var(--lt-milk),.82)!important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-color:var(--lt-line)!important;color:var(--lt-gold)!important}

/* Плавающие круглые кнопки серверных документов (назад / тумблер темы). */
html.light #dzbar .db{
  background:rgba(var(--lt-milk),.82)!important;color:var(--lt-gold)!important;
  border-color:var(--lt-line)!important;
  box-shadow:0 6px 18px rgba(90,74,32,.16)!important}

/* ── НИЖНИЙ БАР ────────────────────────────────────────────────────────────
   Молочное стекло, тёмные неактивные значки, золотой активный. Правило общее,
   хотя сегодня бар живёт на главной: экран, который его получит, возьмёт
   готовый вид, а не станет переписывать заново. */
html.light .nav,html.lite .nav{
  background:linear-gradient(180deg,rgba(var(--lt-milk),0),
    rgba(var(--lt-milk),.62) 24%,rgba(var(--lt-milk),.88) 49%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.06);backdrop-filter:blur(16px) saturate(1.06);
  border-top:1px solid rgba(121,90,32,.16)!important;
  box-shadow:0 -10px 30px rgba(52,62,56,.08)!important}
html.light .nav .it,html.lite .nav .it{color:#615c55!important}
html.light .nav .it .ni,html.lite .nav .it .ni{opacity:.64}
html.light .nav .it.on,html.lite .nav .it.on{color:var(--lt-gold-warm)!important;font-weight:500}
html.light .nav .it.on .ni,html.lite .nav .it.on .ni{
  opacity:1;filter:drop-shadow(0 0 5px rgba(184,139,54,.24))!important}
html.light .nav .center .cl,html.lite .nav .center .cl{color:var(--lt-gold-warm)!important}

/* Системная строка Android под баром — светлая, значки тёмные. */
html.light .systembar,html.lite .systembar{
  background:rgba(var(--lt-milk),.91)!important;color:#4f4a44!important}

/* ── ИСКЛЮЧЕНИЕ: «Удаление аккаунта» ───────────────────────────────────────
   Единственный экран, где документ лежит прямо в <main> без плашки-обёртки:
   текст оказывался на мире без стекла и читался хуже всех. По карте миров это
   «ясность решения» — самый плотный уровень S4, а не обычные .52. Экран один,
   поэтому и правило адресное: общее `main` остаётся прозрачным. */
html.light[data-dz-route^="delete-account"] main{
  background:rgba(var(--lt-milk),.78)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.05);backdrop-filter:blur(16px) saturate(1.05);
  border:1px solid var(--lt-line);border-radius:20px;padding:22px 20px;
  box-shadow:0 14px 36px rgba(90,74,32,.12)}

/* ══════════════════════════════════════════════════════════════════════════
   НОЧНАЯ ПАЛИТРА ЭКРАНОВ — ОДИН ПЕРЕСЧЁТ НА ВСЮ СВЕТЛУЮ ТЕМУ
   ══════════════════════════════════════════════════════════════════════════
   Это тот самый класс «жёлтые надписи», который владелец увидел на прогнозе,
   на подарке и в зеркале. Корень у него ОДИН и он не в этих трёх местах.

   Двадцать пять экранов объявляют в своём `:root` ночную палитру:
     --gold #C9A84C · --gold-bright #ECCD86 · --gold-l #ECCD86 · --gold-b #ECCD86
     --cream #F0EAD6 · --text #F0EAD6
     --muted rgba(240,234,214,.66…72) · --quiet rgba(240,234,214,.42…44)
     --dim #B8B09A
   Шесть из них (compat_hub, family, favorites, onboarding, profile, signals)
   когда-то дописали себе `html.light{--gold:…}` руками. Остальные девятнадцать
   не дописали ничего — и в светлой теме буква остаётся почти белой или
   светло-золотой прямо на светлом мире. Замер по пикселям на кандидате:
   «Карта другому человеку» 1.16, «Подписка на месяц» 1.19, «Подписка на год»
   1.21, цена «17 900 ₽» 1.51, неактивная вкладка «Месяц» 1.13/1.15,
   «Созданные карты» 1.86, «портрет месяца» 1.85. Это не подбор прозрачности и
   не «тень получше» — это ненайденный токен.

   Веб-слой уже знает правильный ответ: `lightfix.css` пересчитывает ровно эти
   имена для `:root[data-theme="light"]`, и на серверных документах они годами
   работают. Но `lightfix.css` подключён ТОЛЬКО внутри подменённого документа
   (его дописывает dzDW), в экраны приложения он не приходит никогда. Поэтому
   тот же пересчёт переносится сюда — значения буква в букву, ничего нового.

   СПЕЦИФИЧНОСТЬ. Экран пишет палитру в `:root{…}` — это (0,1,0), ровно
   столько же, сколько у `html.light{…}`, а canon.css грузится РАНЬШЕ вёрстки
   экрана, поэтому `html.light` проиграл бы по порядку. `:root.light` даёт
   (0,2,0) и выигрывает у `:root` независимо от порядка — и при этом остаётся
   ниже адресных правил экрана вида `html.light .sect{…}` (0,1,2).

   ТЁМНОЙ ТЕМЫ БЛОК НЕ КАСАЕТСЯ: без класса `light` ни одно правило не
   применяется. Главная (`html.lite`), вход, онбординг и офлайн помечены
   `data-dz-theme="dark-only"` — класс `light` им не ставится никогда, значит
   сюда они не попадают физически, а не «по договорённости». */
:root.light{
  --text:#241c08;--cream:#241c08;
  --text-dim:#514b43;--text-muted:#514b43;--dim:#514b43;--muted:#514b43;--quiet:#514b43;
  --gold:#795a20;--gold-l:#795a20;--gold-d:#795a20;--gold-b:#795a20;
  --gold-soft:#795a20;--gold-bright:#795a20;
  --acl:#795a20;--accent:#795a20;--amber:#795a20;
}
/* Семейные экраны — тёплое золото #654B19, это канон палитры («на главной и
   семейных золото теплее»), а не исключение ради одного экрана. Значение
   берётся из уже объявленного выше токена, второй копии числа не заводим. */
:root.light[data-dz-route^="family"]{
  --gold:var(--lt-gold-warm);--gold-l:var(--lt-gold-warm);
  --gold-b:var(--lt-gold-warm);--gold-bright:var(--lt-gold-warm);
}

/* ── ТОТ ЖЕ КЛАСС, НО МИМО ТОКЕНА ──────────────────────────────────────────
   Часть надписей никогда не проходила через переменную: ночное золото и
   ночной крем вписаны в правило экрана или прямо в атрибут style. Пересчёт
   выше их не видит, а глазу разницы нет — это ровно те же нечитаемые буквы.
   Замер до правки: «портрет месяца» 1.88, «Созданные карты» 1.89,
   «5 систем · помнит тебя» 2.76, «Готов составить твой прогноз» 1.43,
   пояснение под ним 1.15.

   Слоты структурные и общие для экранов, поэтому и правило одно, а не по
   экрану. Цвета — те же два канонных значения, что и в пересчёте выше. */

/* Подпись под заголовком в плавающей шапке (Вести, Настройка дня, Зеркало)
   и подпись «пять систем» в шапке чата — капслок того же назначения, что
   `.sect`: цвет золотом на полной альфе, молочный подсвет как у соседей.
   Ночная тень `0 1px 6px #000` на светлом мире — прямой остаток тёмной темы. */
html.light :is(.ttl p,.ti-tx span){
  color:var(--lt-gold)!important;opacity:1!important;
  text-shadow:0 1px 4px rgba(255,253,246,.85),0 0 10px rgba(255,253,246,.55)!important}

/* Экран «прогноз ещё не составлен»: заголовок и пояснение собираются в JS
   через style.cssText, поэтому побеждают любую вёрстку — кроме !important.
   `.load` уже перечислен в списке молочного подсвета выше, тень наследуется. */
html.light .load :is(h3,h4){color:var(--lt-gold)!important}
html.light .load p{color:var(--lt-sec)!important}

/* Ночные цвета в самом атрибуте style. Совпадение идёт по строке «color:…»,
   поэтому фон и границы того же оттенка (золотые плашки, активные вкладки)
   не задеты: у них в атрибуте стоит `background:` или `,#c9a84c)`. */
html.light [style*="color:#c9a84c"],
html.light [style*="color:#eccd86"],
html.light [style*="color:#e8c97a"],
html.light [style*="color:rgba(236,205,134"]{color:var(--lt-gold)!important}
html.light [style*="color:#f0ead6"],
html.light [style*="color:#f0ede6"],
html.light [style*="color:#d8cfae"],
html.light [style*="color:#b8b09a"],
html.light [style*="color:#cfc7b2"],
html.light [style*="color:rgba(240,234,214"],
html.light [style*="color:rgba(240,237,230"]{color:var(--lt-sec)!important}

/* ТОТ ЖЕ КЛАСС, НО ФОН — А НЕ БУКВА.
   Правило выше перевело инлайновые ночные ЦВЕТА на светлые токены. Плашка под
   ними осталась ночной: совпадение шло только по «color:». На совместимостях и
   внешних картах список строится в JS с инлайновым `background:rgba(14,13,22,.55)`
   (`compat_hub.html:row()`), а инлайн бьёт любое правило без !important — до него
   не доходили ни пересчёт палитры, ни утверждённая плашка «вариант A».
   Замер на кандидате: строки (96,92,83)…(112,104,97) при молочных соседях
   (231,229,222). То есть без этого правила буква стала тёмной, а подложка нет —
   тёмное по тёмному, хуже, чем было до правки.
   Значение — тот же токен .62, что уже держат `.addbtn` и `.quota` на этих
   экранах (утверждено Стефом 15.08, «совместимость вариант А»). Второй копии
   числа не заводим. Размытие 12px — из того же утверждённого листа. */
html.light [style*="background:rgba(14,13,22,.55)"]{
  background:var(--lt-s-field)!important;
  border-color:var(--lt-line)!important;
  backdrop-filter:blur(12px) saturate(1.05)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.05)!important;
}

/* ПОЛНАЯ АЛЬФА У ПОДПИСЕЙ. Правило уже принято для `.sect` («цвет на полной
   альфе») — просто оно не дошло до двух соседних слотов той же роли: капслок
   группы в профиле (`.grp-h`, opacity .85) и подсказка при подписи поля
   (`<span style="opacity:.55">— можно пропустить</span>`). На ночном фоне
   ослабленная альфа читалась, на светлом мире гасит букву: 2.80 и 2.05.
   Цвет не меняем — возвращаем ту же букву на полную силу. */
html.light :is(.grp-h,.gsh,label > span){opacity:1!important}