/* header.css — ЕДИНАЯ ШАПКА ПОРТАЛА (Фаза В). Самодостаточно, ЛИТЕРАЛЬНЫЕ цвета
   (без var(): имена переменных на разных страницах расходятся, а корневые
   документы палитры members не знают). Разметка шапки — site/header_inc.php.
   Подключать ПОСЛЕ footer.css. Классы канона (взяты 1:1 со стилей Поиска/index):
   uhead urow1 urow2 ulogo uact uibtn uava ukey kbadge usteam utab ubadge admdesk
   rvwrap rvlist svnum. Колокол (.nb*) — отдельно в notif_bell_inc.php.
   Правки шапки — ТОЛЬКО тут; этих классов в инлайн-<style> страниц быть не должно.
   Исключение: .utab svg{margin-right} — переопределение хелпера $ico на index/catalog,
   остаётся в их <style>. Мобильный перенос вкладок (.urow2 flex-wrap ≤920) — в layout.css. */

/* ── ряд 1: лого + правая зона ─────────────────────────────────────────── */
.uhead { padding:10px 0 0; border-bottom:1px solid #1a212c; margin-bottom:14px; }
.urow1 { display:flex; align-items:center; gap:9px; }
.ulogo { display:flex; align-items:center; gap:9px; color:#e8ecf2; text-decoration:none;
         font-family:'Oswald',sans-serif; font-size:clamp(12.5px,3.6vw,17px); white-space:nowrap;
         flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.ulogo img { width:30px; height:30px; border-radius:50%; border:1px solid #242c38; flex:none; }
.uact { margin-left:auto; display:flex; align-items:center; gap:8px; flex:none; }
.uibtn { width:38px; height:38px; border-radius:9px; border:1px solid #242c38; background:transparent;
         color:#8b96a5; display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
         flex:none; padding:0; text-decoration:none; }
.uibtn:hover { border-color:#3d4a5e; color:#e8ecf2; }
.uava { width:38px; height:38px; border-radius:50%; border:1px solid #3a4656; cursor:pointer; flex:none; }
.ukey { position:relative; border-color:rgba(197,240,43,.45); color:#c5f02b; display:none; } /* ПК: ключ спрятан, мобила вернёт */
.ukey:hover { border-color:rgba(197,240,43,.7); color:#c5f02b; }
.kbadge { position:absolute; top:-6px; right:-6px; background:#e6482e; color:#fff; font-size:9px;
          font-weight:700; border-radius:9px; padding:2px 5px; line-height:1.2; }
.usteam { display:inline-flex; align-items:center; gap:7px; background:#1b2838; color:#e8ecf2;
          border:1px solid #2a475e; border-radius:9px; padding:0 14px; height:38px;
          font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap; }
.usteam:hover { background:#233c53; border-color:#66c0f4; }

/* ── бейдж тарифа / CTA «Подписка» для фри ──────────────────────────────── */
.ubadge { display:inline-flex; align-items:center; gap:6px; padding:0 10px; height:30px;
          border-radius:8px; font-size:11.5px; font-weight:600; color:#c5f02b;
          background:rgba(197,240,43,.08); cursor:pointer; flex:none; border:0; white-space:nowrap;
          text-decoration:none; }
.ubadge.freeb { color:#8b96a5; background:rgba(139,150,165,.12); }
.ubadge.subcta { background:#c5f02b; color:#10130a; font-weight:700; }
.ubadge.subcta:hover { background:#d9ff56; }

/* ── ряд 2: вкладки ─────────────────────────────────────────────────────── */
.urow2 { display:flex; gap:8px; align-items:center; padding:10px 0;
         overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.urow2::-webkit-scrollbar { display:none; }
@media (min-width:921px) { .urow2 { overflow:visible; } }
.utab { display:inline-flex; align-items:center; gap:6px; padding:0 11px; height:30px;
        border:1px solid #242c38; border-radius:8px; font-size:12.5px; font-weight:500;
        color:#8b96a5; text-decoration:none; white-space:nowrap; flex:none; }
.utab:hover { border-color:#3d4a5e; }
.utab.on { border-color:rgba(197,240,43,.5); color:#c5f02b; font-weight:600;
           background:rgba(197,240,43,.07); }

/* ── админ-десктоп: «Ревью ▾» + меню «Жалобы», счётчик жалоб ─────────────── */
.admdesk { display:inline-flex; align-items:center; gap:8px; margin-left:auto; flex:none; }
.rvwrap { position:relative; display:inline-flex; }
.rvwrap:hover .rvlist { display:flex; }
.rvwrap .avarr { font-size:9px; opacity:.8; }
.rvlist { display:none; position:absolute; top:100%; left:0; z-index:500;
          background:#141a22; border:1px solid #242c38; border-radius:10px;
          padding:6px; flex-direction:column; min-width:140px;
          box-shadow:0 14px 40px -10px rgba(0,0,0,.6); }
.rvlist a { display:flex; align-items:center; gap:6px; padding:8px 12px; font-size:12.5px;
            font-weight:500; color:#8b96a5; text-decoration:none; border-radius:7px; white-space:nowrap; }
.rvlist a:hover { color:#e8ecf2; background:rgba(197,240,43,.06); }
.svnum { margin-left:auto; background:#e6482e; color:#fff; font-size:10px; font-weight:700;
         border-radius:9px; padding:2px 7px; }

/* ── мобила/планшет ≤920: десктоп-стол прячем, возвращаем ключ-бургер ────── */
@media (max-width:920px) {
  .admdesk { display:none; }
  .ukey { display:inline-flex; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   СКРОЛЛБАР ПОРТАЛА — «КАПСУЛА» (Вова, 24.07, выбран из трёх вариантов)
   Один вид на ВСЁ и НАВСЕГДА: и страница, и дропдауны героев, и любой будущий
   список. Живёт ЗДЕСЬ, потому что header.css подключён на всех страницах —
   и в members, и в корневых (лендинг/тарифы/оферта). Новый блок со скроллом
   ничего не требует: стиль подхватится сам.
   Как устроено: палец лаймовый, дорожка тёмная, у обоих прозрачная рамка 4px
   + background-clip:padding-box — это и даёт «воздух» по краям и скругление
   капсулы без лишней разметки.
   ЦВЕТА ЛИТЕРАЛЬНЫЕ (#c5f02b), не var(--brand): корневые документы палитру
   members не знают — это правило файла, не лень.
   ТОЛЬКО ДЛЯ МЫШИ: всё внутри @media (hover:hover) and (pointer:fine).
   На телефонах и планшетах iOS/Android рисуют свою плавающую полоску и
   ::-webkit-scrollbar игнорируют либо ломают инерционный скролл — там
   оставляем системное поведение, оно привычнее и не мешает пальцу.
   Кто ПРЯЧЕТ свой скролл осознанно (горизонтальные ленты .urow2, .userbox,
   .statbar, .hall-track), тот и продолжит его прятать: у них селектор с
   классом, а он весомее нашего — ничего не сломается.
   ══════════════════════════════════════════════════════════════════════════ */
/* (правка Вовы, 24.07) В ПОКОЕ — ТЁМНЫЙ, ЛАЙМ ТОЛЬКО ПОД КУРСОРОМ. Сперва
   палец был лаймовым всегда: полоса страницы справа тянула на себя внимание с
   контента и спорила с кнопками (закон «лайм только для действий»). Теперь
   палец — приглушённая олива, ярким становится при наведении и нажатии.
   Firefox управляется одной строкой scrollbar-color и hover не умеет — ему
   отдаём сразу тихий цвет, это нормально: главное, чтобы не бил в глаза. */
@media (hover:hover) and (pointer:fine) {
  /* ВНУТРЕННИЕ блоки (списки героев, дропдауны, длинные карточки) — в теме
     сайта: тихая олива в покое, лайм под курсором. Здесь полоса короткая,
     появляется по делу и подсказывает «этот блок листается». */
  * { scrollbar-width:thin; scrollbar-color:#46521f #12161d; }
  ::-webkit-scrollbar { width:14px; height:14px; }
  ::-webkit-scrollbar-track { background:#12161d; border-radius:20px;
        border:4px solid transparent; background-clip:padding-box; }
  ::-webkit-scrollbar-thumb { background:#46521f; border-radius:20px;
        border:4px solid transparent; background-clip:padding-box;
        transition:background .15s ease-in-out; }
  ::-webkit-scrollbar-thumb:hover { background:#c5f02b; }
  ::-webkit-scrollbar-thumb:active { background:#d9ff4d; }
  /* угол между вертикальной и горизонтальной полосой — без серого квадрата */
  ::-webkit-scrollbar-corner { background:transparent; }

  /* (правка Вовы, 24.07) ГЛАВНАЯ ПОЛОСА СПРАВА — БЕЗ ЗЕЛЁНОГО, СЕРАЯ И ТИХАЯ.
     Она висит во всю высоту экрана ВСЕГДА, поэтому любой намёк на лайм там
     работает как мигающая лампочка и тянет взгляд с контента. Внутренние
     полосы остаются лаймовыми — они короткие и по делу. Селектор с html
     весомее общего, порядок файлов не важен. */
  html { scrollbar-color:#2b3240 #0e1218; }
  html::-webkit-scrollbar-track { background:#0e1218; }
  html::-webkit-scrollbar-thumb { background:#2b3240; }
  html::-webkit-scrollbar-thumb:hover { background:#3d4757; }
  html::-webkit-scrollbar-thumb:active { background:#4a556a; }

  /* ДРОПДАУН «МЕХАНИКА» и любой нативный <select> с длинным списком: список
     рисует сам браузер, наши отступы и радиусы там не работают — получалась
     толстая лаймовая палка, выбивавшаяся из всего. Отдаём ему узкую серую
     полосу без рамок-хитростей. */
  select { scrollbar-color:#2b3240 #0e1218; }
  select::-webkit-scrollbar { width:10px; }
  select::-webkit-scrollbar-track { background:#0e1218; border:0; border-radius:0; }
  select::-webkit-scrollbar-thumb { background:#2b3240; border:0; border-radius:5px; }
  select::-webkit-scrollbar-thumb:hover { background:#3d4757; }
}
