/* MedGrade · окраска верхушки браузера
   Safari 26 берёт цвет ВИДИМОГО верхнего элемента (полоски меню), а не скрытого фона под ним —
   поэтому яркий цвет панели = яркая полоска. Лайм Safari не принимает (проверено 19.10):
   лайм — только линия под полоской и theme-color для Android (header.php). */
:root{--mg-chrome:#16784C; --mg-line:var(--accent, #E8FF00)}

.mgh,
.mgh.is-scrolled{
  background:var(--mg-chrome);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.mgh__inner{background:var(--paper)}

/* Полоска меню (десктоп): изумруд на обёртке — не гаснет при прокрутке;
   лаймовая линия снизу через inset-тень (высота шапки не меняется) */
.mgh__topbar-collapse{
  background:var(--mg-chrome);
  box-shadow:inset 0 -2px 0 var(--mg-line);
}
.mgh__topbar{background:transparent; border-bottom-color:transparent}
.mgh__topbar-nav a{color:#fff}
.mgh__topbar-nav a:hover{color:var(--mg-line)}
.mgh__topbar-meta,
.mgh__topbar-meta a{color:rgba(255,255,255,.88)}
.mgh__topbar-meta a:hover{color:var(--mg-line)}

/* Мобила: полоски меню нет. Safari iOS берёт цвет ~4–5px от верха шапки (тест 19.10:
   2px → белый, 4px → лайм линии под ней, 6px+ → изумруд). Поэтому реальная полоса 8px:
   изумрудный фон .mgh через padding-top + лаймовая линия 2px сверху .mgh__inner.
   Высоту шапки меряет header.js (--mgh-h), отступ контента подстраивается сам. */
@media (max-width:767px){
  .mgh__topbar-collapse{box-shadow:none}
  .mgh{padding-top:8px}
  .mgh__inner{box-shadow:inset 0 2px 0 var(--mg-line)}
  /* Оверлей поиска (fixed) — ниже полосы, с той же лаймовой линией */
  .mgh__search-overlay{top:8px; box-shadow:inset 0 2px 0 var(--mg-line)}
}
