/* Прототип светлой темы (П7, docs/spec/2026-09-26-design-elite.md) — только под html[data-iq-theme="light"].
   Разбор Heartz — скрэтчпад .../scratchpad/heartz/ (ref-*.jpg/png, heartz-online-*.png): холодный
   светло-серо-голубой фон, матовые панели, почти чёрный текст, мятный акцент, плоско (радиус 0–6px,
   тень едва заметна), волосяные линии, пунктир, пиксельный шрифт на цифрах/лейблах. Логотип, персонажей
   и подписи Heartz НЕ копируем — только настроение поверхности. Тёмная тема (без атрибута) не тронута:
   все правила через html[data-iq-theme="light"], кроме кнопки переключателя (пояснение в конце файла).
   Сводится в iq-next.css лидом перед выкладкой (новое имя css-файла = полная выкладка). */

@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@400;500;600;700&display=swap');

/* ===== 1. Токены П1 в светлом исполнении =====
   Специфичность body.iq-variant-techspec под html[data-iq-theme="light"] перебивает боевой тёмный
   набор той же связки в iq-theme.css (тот же селектор, но без атрибута — наш длиннее и позже в каскаде). */
html[data-iq-theme='light'] {
  color-scheme: light;
}

html[data-iq-theme='light'] input[data-slot='input'] {
  background: var(--iq-input-bg);
  border-color: var(--iq-hair-strong);
  color: var(--iq-fg-primary);
}

/* ===== 0. shadcn/Tailwind-токены (globals.css) — отдельная система от --iq-* =====
   Обнаружено контраст-аудитом лида (главная ПК): `body{color:var(--foreground)}` и кнопки shadcn
   (`variant="outline"` — «В корзину» на карточке товара, `.iq-page-title` заголовки кабинета/корзины без
   своего цвета) читают --foreground/--background из globals.css, а не из --iq-*. `[data-theme='dark']`
   на <html> статичен (тот атрибут — ЧУЖОЙ, не трогаю, его держит Tailwind darkMode для админки) — под
   ним --foreground всегда светлый текст, поэтому эти элементы оставались светлыми на моём светлом фоне.
   Селектор `html[data-iq-theme='light']` (html + атрибут = специфичность 0,1,1) выше чем голый
   `[data-theme='dark']` (0,1,0) — эти значения побеждают независимо от порядка подключения файлов.
   Значения — не то же самое, что store-дефолт shadcn (:root в globals.css), а мои токены из блока 1
   выше: так все компоненты (наши и shadcn) держат один холст/текст/акцент. */
html[data-iq-theme='light'] {
  --background: #e8ebf2;
  --foreground: #232429;
  --card: #ffffff;
  --card-foreground: #232429;
  --popover: #ffffff;
  --popover-foreground: #232429;
  --primary: #0000ff;
  --primary-foreground: #f4f8fb;
  --secondary: #f2f5fa;
  --secondary-foreground: #232429;
  --muted: #f2f5fa;
  --muted-foreground: #5b5d66;
  --accent: #f2f5fa;
  --accent-foreground: #232429;
  --destructive: #c62839;
  --destructive-foreground: #f4f8fb;
  --border: rgb(35 36 41 / 14%);
  --input: rgb(35 36 41 / 14%);
  --ring: #0000ff;
  --success: #186339;
  --warning: #8a6d1a;
  --error: #c62839;
}

html[data-iq-theme='light'] body.iq-variant-techspec {
  /* 3 уровня фона: холст / панель / приподнятая (карточки, поповеры, модалки) */
  --iq-bg-canvas: #e8ebf2;
  --iq-bg-surface: #f2f5fa;
  --iq-bg-surface-raised: #ffffff;

  /* 3 уровня текста (третий — --iq-fg-faint ниже, не в --iq-fg-muted: 2.4:1 не проходит AA для обычного текста) */
  --iq-fg-primary: #232429;
  --iq-fg-muted: #5b5d66;

  /* Заход 2 (замечание владельца, П7): «у Heartz были другие акценты» — разбор heartz-online-desktop.png
     (скрэтчпад heartz/) дал две зашитые краски вместо нашего тёмно-бирюзового #0a6e88: электрик-синий
     бегущей строки (замер py по крупному пикселю — rgb(5,0,253) ≈ #0500fd) и мятная заливка
     кружка-стрелки (rgb(153,222,175) ≈ #99deaf, уже близко к нашему --iq-mint-soft #9fe0b0 ниже).
     Синий — на линии/ссылки/фокус/большинство заливок кнопок (см. `.btn`/`.main-banner__cta` и т.п.:
     держат светлый --iq-bg-canvas как цвет текста поверх этого фона, светлому тексту нужен тёмный фон —
     синий этому условию отвечает, тёмно-бирюзовый ему отвечал тоже, но был не тем оттенком). Взят чистый
     #0000ff (не #0500fd): чуть чище и с тем же запасом контраста (замер py: 7.2:1 на холсте, 8.66:1 на
     белом — было 4.89:1/5.84:1 у бирюзового, тоже проходил, здесь просто ближе к разбору Heartz).
     Мятная заливка — точечно на «плашках/активных элементах» (переключатель темпа героя, активная
     вкладка входа) — см. блок 7 ниже, а не здесь: этот токен продолжает нести роль «линия/фокус», менять
     его на мятный означало бы перекрасить фокус-рамки и ссылки в мятный, что Heartz не делает. */
  --iq-action-primary: #0000ff;
  /* Второй акцент на светлом — мятный вместо серого techspec (см. блок 4 ниже про голубой/лайм/мятный) */
  --iq-action-signal: #186339;
  /* Лайм — «успех/новинка» (правило П1); на белом фоне как текст не проходит AA, затемнён до мшистого */
  --iq-action-emotion: #5c6f1a;

  --iq-button-primary-fg: #f4f8fb;
  --iq-card-bg: #ffffff;
  --iq-card-bg-hover: #f2f5fa;
  --iq-input-bg: #ffffff;

  /* Плоско: 0–6px вместо 3/12/24 тёмной темы — по духу Heartz, не по П1 буквально (решение этого потока) */
  --iq-radius-input: 3px;
  --iq-radius-media: 2px;
  --iq-radius-panel: 3px; /* углы ≤ 3px — TECHSPEC § 04 */

  /* Волосяные линии Heartz — точный rgba из разбора, две силы */
  --iq-hair: rgb(35 36 41 / 12%);
  --iq-hair-strong: rgb(35 36 41 / 22%);
  --iq-border-subtle: rgb(35 36 41 / 12%);
  --iq-border-tint: #232429;
}

/* Токены вне пары body.iq-variant-techspec: живут в :root/базовом body{} тёмной темы фиксированными
   значениями (не color-mix от --iq-bg-canvas), поэтому светлой версии нужна отдельная строка. */
html[data-iq-theme='light'] body {
  --iq-color-danger: #c62839; /* было #ff5a67 — на светлом фоне не проходил AA (замер py: 4.68:1 после правки) */
  --iq-success: #186339; /* было #6ee0a8 — светлый мятный как текст на белом/холсте не читался */
  --iq-danger: var(--iq-color-danger);

  /* Третий уровень текста Heartz (подписи, disabled, счётчики) — сознательно вне --iq-fg-muted */
  --iq-fg-faint: #9498a3;

  /* Собственные токены светлой темы: мятный как отдельный третий цвет (не подменяет --iq-action-signal
     везде разом — точечно, где нужен именно мятный чип/бейдж, см. блок 4) */
  --iq-mint-soft: #9fe0b0;
  --iq-mint-strong: #6fcf8e;
  --iq-mint-ink: #186339; /* AA-безопасный мятный текст: 6.1:1 на холсте, 7.3:1 на белом */
  --iq-lime-ink: #465413; /* AA-безопасный затемнённый лайм текст: 6.9:1 на холсте, 8.3:1 на белом */

  --iq-pixel-font: 'Pixelify Sans', var(--iq-font-mono, 'IQ Manrope'), monospace;
}

/* ===== 2. Точечные зашитые цвета (лавандовая утечка П1 и другие hex мимо токенов) ===== */
html[data-iq-theme='light'] .main-banner__tempo-track {
  stroke: rgb(35 36 41 / 20%);
}
html[data-iq-theme='light'] .main-banner__tempo-switch {
  background: rgb(255 255 255 / 70%);
  border-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] .iq-music-guide__table tbody th {
  border-bottom-color: var(--iq-hair);
}
html[data-iq-theme='light'] .iq-music-guide__table tbody th a span {
  border-bottom-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] .catalog-item__buttons-wrap {
  border-top-color: var(--iq-hair-strong);
}

/* ===== 2б. Найдено автообходом контраста (лид, 26.09.2026) — зашитые hex мимо --iq-*, не разбор ссылки =====
   Контраст-аудит (скрипт обходит все текстовые узлы, считает WCAG к фактическому фону с подъёмом по
   предкам) нашёл конкретные литералы старой тёмной темы: `.iq-page-title{color:#e8ecf0}` (iq-next.css,
   раздел «формы магазина»), `.catalog-item__real-price`/`.catalog-item__description` с точечным
   `:not(.search__item)` оверрайдом (`color:#b8c0cc`/`#8d97a4`), `.catalog-item__cart-label{color:var(--iq-bg,#0b0c0e)}`
   (тёмный текст на кнопке — ждёт тёмного холста), `.equipment-installment__chip{color:#7dd88f}`,
   `.iq-filter-chip{background:#08060f57}` (полупрозрачный «почти чёрный» на светлом холсте даёт грязно-серый,
   от него один текст не может быть контрастным). Список до/после — в отчёте потока. */
html[data-iq-theme='light'] .iq-page-title {
  color: var(--iq-fg-primary);
}
html[data-iq-theme='light'] body.iq-variant-techspec .catalog-item:not(.search__item) .catalog-item__real-price {
  color: var(--iq-fg-primary);
}
html[data-iq-theme='light'] body.iq-variant-techspec .catalog-item:not(.search__item) > .catalog-item__description {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] .catalog-item__cart-label {
  color: var(--iq-button-primary-fg);
}
html[data-iq-theme='light'] body.iq-variant-techspec .equipment-installment__chip {
  color: var(--iq-mint-ink);
}
html[data-iq-theme='light'] body .iq-filter-chip {
  color: var(--iq-fg-primary);
  background: var(--iq-bg-surface-raised);
  border-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] body .iq-filter-chip__count {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] body .iq-filter-chip.is-active {
  color: var(--iq-lime-ink);
  border-color: var(--iq-lime-ink);
  background: rgb(92 111 26 / 12%);
}

/* Фото-панель подписки в подвале (`.footer__library`, iq-theme.css): background-color:#000 + чёрный
   градиент-скрим НАМЕРЕННО — фото группы, текст должен читаться на тёмном независимо от темы сайта.
   Подвал целиком стал светлым (--iq-void→--iq-bg-canvas), но эта плашка — фиксированный тёмный остров:
   переобъявляю 4 токена локально на «как в тёмной теме», а не глобально. */
html[data-iq-theme='light'] .footer__library {
  --iq-fg-primary: #e8ecf0;
  --iq-fg-muted: #b8c0cc;
  --iq-action-primary: #6ee7ff;
  --iq-action-emotion: #b8c0cc;
}

/* Вторая копия ссылок сайдбар-меню — в подвале (`.footer-nav__column-submenu`, SEO-дубликат каталога,
   скрыт вторым столбцом на мобильном). `color:var(--iq-fg-muted)` там уже стоит и переменная у элемента
   верно резолвится в моё значение (проверено getComputedStyle), но итоговый `color` всё равно остаётся
   старым тёмным — что-то в каскаде iq-theme.css перебивает победившую переменную более специфичным
   литералом, который не нашёлся построчным grep по 372 КБ минифицированного файла. `!important` —
   осознанно, как единственный точечный выход без правки чужого файла вслепую. */
html[data-iq-theme='light'] .footer-nav__column-submenu a {
  color: var(--iq-fg-muted) !important;
}
html[data-iq-theme='light'] .footer-nav__column-submenu > li > a {
  color: var(--iq-fg-primary) !important;
}

/* ===== 3. Пиксельный шрифт на ценах и лейблах (Heartz) ===== */
html[data-iq-theme='light'] .iq-currency,
html[data-iq-theme='light'] .catalog-item__real-price,
html[data-iq-theme='light'] .catalog-item__old-price,
html[data-iq-theme='light'] .product__price,
html[data-iq-theme='light'] .product__price--old,
html[data-iq-theme='light'] .installment-popup__price,
html[data-iq-theme='light'] .iq-buy-dock__price,
html[data-iq-theme='light'] .mobile-product-cta__price,
html[data-iq-theme='light'] .catalog-item__label {
  font-family: var(--iq-pixel-font);
  letter-spacing: 0.01em;
}

/* Бейдж «новинка/распродажа» на фото товара: тёмный глянцевый чип тёмной темы на светлом сайте читался бы
   как чужеродное пятно (тем более фото уходят на тёмную студийную подложку по П3) — матовое стекло вместо. */
html[data-iq-theme='light'] .catalog-item__label {
  color: var(--iq-fg-primary);
  background: rgb(255 255 255 / 82%);
  border: 1px solid var(--iq-hair-strong);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
html[data-iq-theme='light'] .catalog-item__label--new {
  color: var(--iq-mint-ink);
  background: rgb(255 255 255 / 88%);
  border-color: var(--iq-mint-strong);
}

/* ===== 4. Хлебные крошки — дух Heartz (капс, пунктир), без их формулировок =====
   Правка после ревью лида (главная ПК): текущий пункт был бледнее остальных — на бою наоборот,
   `.breadcrumb__list li:last-child a{color:#404040}` зашито мимо токенов и не читалось на светлом
   иначе как «блёкло». Текущий — самый тёмный (--iq-fg-primary), прежние шаги — приглушены (--iq-fg-muted). */
html[data-iq-theme='light'] .breadcrumbs {
  border-bottom: 1px dashed var(--iq-hair-strong);
}
html[data-iq-theme='light'] .breadcrumb__list a,
html[data-iq-theme='light'] .breadcrumb__list span {
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 11px;
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] .breadcrumb__list li:last-child a {
  color: var(--iq-fg-primary);
  font-weight: 700;
}

/* ===== 4б. Два блока с собственной палитрой мимо токенов сайта (обнаружено по снимку) =====
   .iq-mega (выпадающее меню «Каталог», iq-next.css) держит СВОИ переменные --iq-mega-* — сознательно
   изолированный прототип (комментарий в файле), не связан с --iq-* сайта. .iq-library-intro (блок
   подписки, iq-theme.css) — та самая «фиолетовая утечка» из П1/П2 (другой поток чинит на токены сайта
   для тёмной темы; светлую версию делаем здесь отдельно, чтобы не зависеть от очерёдности потоков). */
html[data-iq-theme='light'] body.iq-variant-techspec .iq-mega {
  --iq-mega-void: #ffffff;
  --iq-mega-raised: #f2f5fa;
  --iq-mega-line: rgb(35 36 41 / 12%);
  --iq-mega-line-hi: rgb(0 0 255 / 45%);
  --iq-mega-text: #232429;
  --iq-mega-muted: #5b5d66;
  --iq-mega-dim: #9498a3;
  /* Заход 2: тот же синий, что --iq-action-primary — держал старый тёмно-бирюзовый литералом,
     обновлён вместе с ним (см. блок 1). */
  --iq-mega-cyan: #0000ff;
  --iq-mega-cyan-dim: rgb(0 0 255 / 12%);
  background: rgb(255 255 255 / 92%);
}
html[data-iq-theme='light'] .iq-mega__sec b {
  color: var(--iq-mega-text);
}
html[data-iq-theme='light'] .iq-mega__sec--on b {
  color: var(--iq-mega-text);
}
html[data-iq-theme='light'] .iq-mega__rail {
  background: rgb(255 255 255 / 55%);
}

html[data-iq-theme='light'] body.iq-variant-techspec .iq-library-intro {
  background: var(--iq-bg-surface-raised);
  border-color: var(--iq-hair-strong);
}

/* ===== 4в. Постоянная верхняя полоса поиска (`.help-block`, каждая страница, не только главная) =====
   Ревью лида (ПК, любая страница): чёрная полоса с полем «Введите запрос» над шапкой. Разметка та же,
   что у мобильного меню (`.help-block js--mobile-menu`) — на ПК её раскрывает не `open` (React-состояние
   гамбургера), а design-намерение самого CSS: сама полоса всегда видна (комментарий в iq-next.css,
   строка 114 — «постоянная верхняя полоса (поиск)»), а пункты меню/избранное внутри неё скрыты до 991px.
   `background:#0b0c0e` зашит там же (iq-next.css, самая первая правка мобильного меню 24.09.2026) —
   мимо --iq-*, поэтому не откликнулся на токены. Красим саму полосу и поле поиска в цвет шапки. */
html[data-iq-theme='light'] body.iq-variant-techspec .help-block {
  background: var(--iq-bg-surface-raised);
  box-shadow: none;
  border-bottom-color: var(--iq-hair);
}
html[data-iq-theme='light'] body.iq-variant-techspec .iq-search input {
  background: var(--iq-input-bg);
  color: var(--iq-fg-primary);
  border-color: var(--iq-border-subtle);
}
html[data-iq-theme='light'] body.iq-variant-techspec .iq-search input::placeholder {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] body.iq-variant-techspec .help-block__question,
html[data-iq-theme='light'] body.iq-variant-techspec .help-block__favorites {
  color: var(--iq-fg-primary);
  border-bottom-color: var(--iq-hair);
}
html[data-iq-theme='light'] body.iq-variant-techspec .help-block__question {
  color: var(--iq-action-primary);
}
html[data-iq-theme='light'] body.iq-variant-techspec .help-block a {
  color: var(--iq-fg-primary);
}

/* ===== 5. Шапка и герой главной =====
   Ревью лида (главная ПК, 26.09.2026): пункты меню/«Вход»/«Регистрация» были не видны, заголовок героя
   тёмный по тёмному. Причина — `body.home .header{background:linear-gradient(#100b22…)}` и
   `body.home .main-banner--iq{background:…#090711…}` в iq-theme.css: обе зашиты мимо токенов И взяты с
   двумя классами (специфичность выше моего первого варианта на одном классе — тот проигрывал молча).
   Решение потока — вариант (а) из ревью: шапка и герой светлые целиком (текст на них уже держится на
   токенах --iq-ink/--iq-cyan/--iq-muted и после этой правки просто становится тёмным); 3D-волна остаётся
   «витриной» — не сам холст (перекрашивать WebGL не в CSS), а её место на странице: `.main-banner__tempo-desk`
   (реальный контейнер, куда HeroObject.tsx монтирует canvas — see src/components/iq/home/hero/HeroObject.tsx)
   получает тёмную панель со скруглением, чтобы волна читалась как поставленная в рамку, а не как дыра. */
html[data-iq-theme='light'] body.home .header {
  background: var(--iq-bg-surface-raised);
  border-bottom-color: var(--iq-hair);
}
html[data-iq-theme='light'] body.home .header__cart svg {
  fill: var(--iq-fg-primary);
}
html[data-iq-theme='light'] body.home .main-banner--iq {
  background: var(--iq-bg-canvas);
  border: 1px solid var(--iq-hair);
  border-radius: var(--iq-radius-panel);
}
html[data-iq-theme='light'] body.home .main-banner--iq:before {
  /* Затемняющий градиент прод-темы (нужен, чтобы белый текст читался на тёмном фото/волне) на светлом
     фоне не нужен вовсе — гасим, иначе холст приобретает грязный оттенок поверх моего --iq-bg-canvas. */
  background: none;
}
html[data-iq-theme='light'] body.home .main-banner__secondary {
  border-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] body.home .main-banner__tempo-button {
  background: var(--iq-bg-surface-raised);
  border-color: var(--iq-hair-strong);
}
/* Волна-«витрина» (заход 2, замечание владельца после выкладки — снимок Safari, ПК): «на белом фоне
   некрасиво выглядит чёрный квадрат». Прежнее решение («карточка в рамке») было ошибкой именно на
   светлом — тёмный прямоугольник читался как дыра/баг, а не как оформленная витрина. Убрано целиком
   на всех ширинах (было — только на ≤520px, см. старый комментарий ниже сохранён как объяснение мобильного
   случая). Холст canvas.js уже `alpha:true` (src/components/iq/home/hero/scene.js:213) — без панели он
   честно прозрачен, волна стоит прямо на --iq-bg-canvas. */
html[data-iq-theme='light'] body.home .main-banner__tempo-desk {
  background: none;
  border: none;
  box-shadow: none;
}

/* ===== 5б. Мятная заливка активного переключателя (заход 2, П7 — «плашки, активные элементы») =====
   `.main-banner__tempo-button.is-active` в iq-theme.css красится в `var(--iq-action-primary)` — с блока 1
   это теперь синий (роль «линия/ссылка/фокус»), а активная плашка переключателя темпа — ровно тот
   «активный элемент», для которого разбор Heartz просит мятный. Текст — почти чёрный (`--iq-fg-primary`),
   не светлый: на мятной заливке светлый текст не проходит AA (см. блок 1, токены --iq-mint-*). */
html[data-iq-theme='light'] body.home .main-banner__tempo-button.is-active {
  background: var(--iq-mint-soft);
  color: var(--iq-fg-primary);
}

/* ===== 6. Кнопка переключателя темы =====
   Живёт в этом файле (структурная часть П7), но НЕ scoped на html[data-iq-theme="light"]: кнопка нужна
   в обеих темах (иначе из светлой некуда вернуться в тёмную) — единственное сознательное исключение из
   правила «только под light» в этом файле, см. отчёт. Красится токенами --iq-*, поэтому на тёмной теме
   выглядит как тёмная (var(--iq-fg-primary) и var(--iq-hair) там уже свои) — новых цветов не вносит. */
.iq-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  color: var(--iq-fg-primary);
  background: transparent;
  border: 1px solid var(--iq-hair, rgb(232 236 240 / 16%));
  border-radius: var(--iq-radius-input, 3px);
  cursor: pointer;
  transition: border-color 0.18s, background-color 0.18s;
}
.iq-theme-toggle:hover {
  border-color: var(--iq-hair-strong, rgb(232 236 240 / 32%));
  background: var(--iq-card-bg-hover);
}
.iq-theme-toggle svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.5px;
  fill: none;
}
.iq-theme-toggle .iq-theme-toggle__sun {
  display: none;
}
html[data-iq-theme='light'] .iq-theme-toggle .iq-theme-toggle__moon {
  display: none;
}
html[data-iq-theme='light'] .iq-theme-toggle .iq-theme-toggle__sun {
  display: block;
}

/* «Может понравиться» в пустой корзине (П2, добавлено параллельным потоком в CartView.tsx 26.09.2026,
   docs/spec/2026-09-26-design-elite.md): `--iq-ink`/`--iq-fg-primary` на самом h2 верно резолвятся в
   моё светлое значение (проверено getComputedStyle), но итоговый color всё равно старый тёмный литерал —
   тот же необъяснённый случай, что и вторая копия меню в подвале выше: где-то в 372 КБ минифицированного
   iq-theme.css матчится более специфичный h2-селектор с зашитым #e8ecf0, найти построчным grep не
   вышло. `!important` — точечно, тем же приёмом. */
html[data-iq-theme='light'] .iq-cart-empty__suggestions-title {
  color: var(--iq-fg-primary) !important;
}

/* ===== 7. Формы shadcn (вход/регистрация/кабинет) — заход 2, «аудит прошлого захода их не обходил» =====
   Root cause (проба py на сложенном DOM, не догадка): `[data-slot="input"|"textarea"|"select-trigger"
   |"label"|"checkbox"|"button"]` в iq-next.css — литеральные тёмные цвета (`background:#131519`,
   `color:#e8ecf0`, кнопка `.bg-primary{background:#6ee7ff}` и т.п.), НЕ через --iq-*/--primary. Эти
   правила лежат вне `html[data-iq-theme='light']`, поэтому не видели тему вообще — токены блока 0/1 тут
   ни при чём, ловилось `document.styleSheets` перебором правил, совпадающих с полем /login/. Тот же слой
   стилизует Email/Password (LoginForm), вкладки «Пароль»/«Код на почту» (LoginTabs), «Регистрация» и
   кнопки «Подробнее»/«Все заказы» (account), чекбокс согласия (RegisterForm) — переопределяю весь набор
   разом под светлую тему, зеркалом чисел iq-next.css (только цвета, размеры/радиусы не трогаю). */
html[data-iq-theme='light'] [data-slot='textarea'] {
  background: var(--iq-input-bg);
  border-color: var(--iq-hair-strong);
  color: var(--iq-fg-primary);
}
html[data-iq-theme='light'] [data-slot='select-trigger'] {
  background: var(--iq-input-bg);
  border-color: var(--iq-hair-strong);
  color: var(--iq-fg-primary);
}
html[data-iq-theme='light'] [data-slot='input']::placeholder,
html[data-iq-theme='light'] [data-slot='textarea']::placeholder {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] [data-slot='input']:focus-visible,
html[data-iq-theme='light'] [data-slot='textarea']:focus-visible,
html[data-iq-theme='light'] [data-slot='select-trigger']:focus-visible {
  border-color: var(--iq-action-primary);
  box-shadow: 0 0 0 1px var(--iq-action-primary);
}
html[data-iq-theme='light'] [data-slot='label'] {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] [data-slot='checkbox'] {
  border-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] [data-slot='checkbox'][data-state='checked'] {
  background: var(--iq-action-primary);
  border-color: var(--iq-action-primary);
  color: var(--iq-button-primary-fg);
}
html[data-iq-theme='light'] [data-slot='checkbox'] ~ [data-slot='label'] {
  color: var(--iq-fg-primary);
}
/* Кнопка «Войти»/«Все заказы»/«Применить купон» (variant=default → .bg-primary) — синяя заливка блока 1;
   «Регистрация»/«Подробнее»/вкладка «Код на почту» (variant=outline → .border-input/.bg-secondary) —
   светлая рамка вместо белого текста на прозрачном (был невидим на светлом холсте). */
html[data-iq-theme='light'] [data-slot='button'].bg-primary {
  background: var(--iq-action-primary);
  color: var(--iq-button-primary-fg);
  border-color: var(--iq-action-primary);
}
html[data-iq-theme='light'] [data-slot='button'].bg-primary:hover {
  background: #4d4dff; /* светлее --iq-action-primary на фикс. шаг, тот же приём, что и тёмная тема (#a5f0ff от #6ee7ff) */
  border-color: #4d4dff;
}
html[data-iq-theme='light'] [data-slot='button'].bg-primary:disabled {
  background: var(--iq-hair);
  border-color: var(--iq-hair-strong);
  color: var(--iq-fg-faint);
  opacity: 1;
}
html[data-iq-theme='light'] [data-slot='button'].border-input,
html[data-iq-theme='light'] [data-slot='button'].bg-secondary {
  background: var(--iq-bg-surface-raised);
  color: var(--iq-fg-primary);
  border-color: var(--iq-hair-strong);
}
html[data-iq-theme='light'] [data-slot='button'].border-input:hover,
html[data-iq-theme='light'] [data-slot='button'].bg-secondary:hover {
  border-color: var(--iq-action-primary);
  color: var(--iq-action-primary);
  background: var(--iq-bg-surface-raised);
}
html[data-iq-theme='light'] [data-slot='button']:focus-visible {
  outline-color: var(--iq-action-primary);
}
/* Активная вкладка входа («Пароль»/«Код на почту», LoginTabs — role=tab) — тот же «активный элемент»
   Heartz, что и переключатель темпа в блоке 5б: мятная заливка, тёмный текст, не синяя заливка CTA. */
html[data-iq-theme='light'] [data-slot='button'][role='tab'][aria-selected='true'] {
  background: var(--iq-mint-soft);
  color: var(--iq-fg-primary);
  border-color: var(--iq-mint-soft);
}

/* Вход через VK ID / Яндекс ID (OAuthButtons.tsx): `.iq-oauth__sep`/`.iq-oauth__btn` в iq-next.css —
   белый текст и еле заметные rgba(255,255,255,…) обводки/градиенты, рассчитанные на тёмный холст —
   на светлом «или одним касанием» и подписи кнопок были не видны совсем (замечание владельца). */
html[data-iq-theme='light'] .iq-oauth__sep {
  color: var(--iq-fg-muted);
}
html[data-iq-theme='light'] .iq-oauth__sep::before,
html[data-iq-theme='light'] .iq-oauth__sep::after {
  background: var(--iq-hair-strong);
}
html[data-iq-theme='light'] .iq-oauth__btn {
  background: var(--iq-bg-surface-raised);
  border-color: var(--iq-hair-strong);
  color: var(--iq-fg-primary) !important; /* тот же приём, что и iq-next.css: там тоже !important на цвет */
}
html[data-iq-theme='light'] .iq-oauth__btn:focus-visible {
  outline-color: var(--iq-action-primary);
}

/* Бейджи статуса заказа (OrderStatus) и баннер Message: `.bg-success`/`.bg-warning`/`.bg-error` красят
   только фон, текст наследует `--foreground` — на нашем тёмном --success (#186339) тёмный текст давал
   2.1:1 (владелец: «бейдж ВЫПОЛНЕН тёмно-зелёный с нечитаемым текстом»). Светлый текст токеном
   --iq-button-primary-fg проходит на всех трёх (замер py: success 6.8:1, warning 4.6:1, error 5.2:1). */
html[data-iq-theme='light'] .bg-success,
html[data-iq-theme='light'] .bg-warning,
html[data-iq-theme='light'] .bg-error {
  color: var(--iq-button-primary-fg);
}
/* «Заказ № …» и счётчик `× N` в OrderItem.tsx держат Tailwind `text-primary/50` — при синем --primary
   50% на холсте читались бледно (владелец: «номера заказов бледные»). Поднимаю до непрозрачного
   --iq-fg-muted, который уже проходит AA (см. блок 1). */
html[data-iq-theme='light'] .text-primary\/50 {
  color: var(--iq-fg-muted);
}

/* Меню кабинета (AccountNav — «Профиль/Заказы/Загрузки/Избранное/Выйти», iq-next.css `.iq-account-nav a`):
   тот же приём, что и `[data-slot]`-формы блока 7 — литеральные тёмные цвета мимо --iq-*, не видели тему.
   Обычный пункт был rgba(232,236,240,.62) (светлый текст 62% на светлом холсте — еле виден), активный —
   зашитый #6ee7ff. Проба: `.iq-account-nav a` (не `[data-slot]`) — нашёл перебором styleSheets по
   реальному DOM-узлу «Заказы» в `nav[aria-label="Личный кабинет"]`. */
html[data-iq-theme='light'] .iq-account-nav a {
  color: var(--iq-fg-muted);
  border-color: var(--iq-hair);
}
html[data-iq-theme='light'] .iq-account-nav a:hover {
  color: var(--iq-fg-primary);
}
html[data-iq-theme='light'] .iq-account-nav a[aria-current='page'] {
  color: var(--iq-action-primary);
  border-color: var(--iq-action-primary);
}

/* Не доделано в этом файле (см. отчёт): фото товаров P3 ещё на белом фоне (проба тёмной/светлой подложки
   не выбрана) — рамка блока 5 рассчитана на обе; пиксельный шрифт грузится с Google Fonts CDN — для боя
   нужен свой woff2 с кириллицей рядом с Manrope/Unbounded (scripts/theme/sync.py), сейчас это только для
   прототипа песочницы; два случая выше (footer-nav__column-submenu, iq-cart-empty__suggestions-title) —
   контраст закрыт `!important`, но причина (какое правило в iq-theme.css реально побеждает переменную)
   не найдена — стоит спросить лида «сведения в iq-next.css» или пройти по файлу в редакторе с DevTools
   Computed, а не grep, прежде чем сводить прототип в бой. */