/* ─────────────────────────────────────────────────────────────────────────────
   Переключатель темы — сам контрол. Отдельным файлом от dark.css намеренно:
   тот целиком лежит в :root[data-theme="dark"] и инертен без атрибута, а кнопка
   обязана выглядеть одинаково в ОБЕИХ темах.

   ⚠️ Подключается ПОСЛЕ инлайновых стилей страницы: у .btn-theme и базовой .btn
   одинаковый вес (0,1,0), и порядок здесь решает — иначе padding кнопки останется
   от .btn и она вытянется в пилюлю.
   ───────────────────────────────────────────────────────────────────────────── */
.btn-theme { flex: none; width: 42px; height: 42px; padding: 0;
  justify-content: center; }
.btn-theme .th-i { width: 18px; height: 18px; display: none; }
/* Показываем значок ТОГО, ЧТО ПОЛУЧИТСЯ по клику, а не текущего состояния:
   иначе кнопка читается как индикатор, и человек жмёт её «чтобы включить то,
   что нарисовано», получая обратное. */
:root[data-theme="dark"] .btn-theme .th-sun { display: block; }
:root:not([data-theme="dark"]) .btn-theme .th-moon { display: block; }
@media (max-width: 560px) { .btn-theme { width: 38px; height: 38px; } }

/* ⚠️ На узком экране троим контролам в шапке («Войти», канал, тема) места нет.
   Замер на 390 px: правый край «Войти» приходился ровно на границу экрана, то есть
   кнопка вылезала за отступ шапки — ради значка темы. Поэтому ниже 560 px тема
   теряет пилюлю и остаётся просто значком, а промежутки поджимаются.

   ⚠️ Префикс :root[data-theme] здесь обязателен. Фон и кант кнопке задаёт правило
   :root[data-theme="dark"] .btn из dark.css — оно весит (0,3,0), и голый .btn-theme
   его не перебьёт: на тёмной теме пилюля осталась бы, а «Войти» — за краем. */
@media (max-width: 560px) {
  .nav { gap: 12px; }
  .nav-cta { gap: 4px; }
  :root[data-theme] .btn-theme { width: 34px; height: 34px;
    border-color: transparent; background: none; box-shadow: none; }
  :root[data-theme] .btn-theme:hover { background: none; border-color: transparent; }
  .btn-theme .th-i { width: 19px; height: 19px; }
  /* Стрелка у «Войти» — украшение: на узком экране она стоит ~25 px, ровно тех,
     которых не хватало кнопке темы. Текст кнопки от этого не страдает. */
  .nav .btn-primary .arr { display: none; }
  /* Подпись «На главную» прячется ТОЛЬКО там, где в шапке есть ещё и вход
     (страницы тарифов и статуса). На правовых страницах ссылка назад — един-
     ственный контрол справа, места хватает, и обрезать её незачем.
     ⚠️ Браузер без :has() правило отбросит целиком — там шапка просто останется
     прежней, как до появления кнопки темы. */
  .nav:has(.btn:not(.btn-theme)) .back span { display: none; }
}