/* Каркас шапки: только расположение и логика показа. Вид задаёт style.css варианта. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
h3, p { margin: 0; }
.gh-i { width: 20px; height: 20px; flex: none; display: block; }

#gh { display: contents; }
.gh { position: sticky; top: 0; z-index: 50; }
.gh-bar { position: relative; z-index: 3; display: flex; align-items: center; gap: 28px; height: var(--gh-h, 72px); padding: 0 var(--gh-pad, 32px); transition: height .25s ease; }
.gh[data-scrolled="1"] .gh-bar { height: var(--gh-h-small, 60px); }
.gh-brand { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; flex: none; }
.gh-nav { flex: 1 1 auto; min-width: 0; }
.gh-nav ul { display: flex; align-items: center; gap: 4px; }
.gh-link { display: flex; align-items: center; min-height: 44px; padding: 0 12px; white-space: nowrap; }
.gh-right { display: flex; align-items: center; gap: 10px; flex: none; }
.gh-count { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.gh-count-v { display: inline-flex; align-items: baseline; gap: 5px; font-variant-numeric: tabular-nums; }
.gh-search-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; min-width: 44px; justify-content: center; white-space: nowrap; }
.gh-search-t, .gh-kbd { display: none; }
.gh-lang { display: inline-flex; }
.gh-lang button { min-width: 38px; min-height: 44px; }
.gh-login { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; white-space: nowrap; }
.gh-mewrap { position: relative; }
.gh-me { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; }
.gh-av { display: grid; place-items: center; width: 36px; height: 36px; flex: none; }
.gh-me-t { display: grid; text-align: left; line-height: 1.15; }
.gh-menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 220px; z-index: 6; visibility: hidden; opacity: 0; pointer-events: none; }
.gh-menu[data-open="1"] { visibility: visible; opacity: 1; pointer-events: auto; }
.gh-menu-a { display: flex; align-items: center; min-height: 44px; padding: 0 16px; }

.gh-chips { display: none; }
/* Необязательные части: вариант включает их сам */
.gh-theme, .gh-sheet-h, .gh-menu-h, .gh-menu-i, .gh-res-i, .gh-sug, .gh-login .gh-i { display: none; }

.gh-sheets { position: absolute; left: 0; right: 0; top: 100%; z-index: 2; }
.gh-sheet { position: absolute; left: var(--gh-sheet-x, 32px); right: var(--gh-sheet-x, 32px); top: var(--gh-sheet-y, 8px); visibility: hidden; opacity: 0; pointer-events: none; }
.gh-sheet[data-open="1"] { visibility: visible; opacity: 1; pointer-events: auto; }
.gh-sheet-in { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; }
.gh-groups { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 32px; }
.gh-group[data-cols="2"] .gh-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.gh-group[data-kind="tiles"] .gh-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gh-row { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-height: 40px; padding: 8px 0; }
.gh-news { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 10px 0; }
.gh-tile { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 2px 12px; padding: 12px; }
.gh-tile-i { grid-row: span 2; }
.gh-tile-l, .gh-tile-n { grid-column: 2; }
.gh-card-a, .gh-all { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.gh-sheet-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.gh-search { position: absolute; left: var(--gh-sheet-x, 32px); right: var(--gh-sheet-x, 32px); top: calc(100% + var(--gh-sheet-y, 8px)); z-index: 4; visibility: hidden; opacity: 0; pointer-events: none; }
.gh-search[data-open="1"] { visibility: visible; opacity: 1; pointer-events: auto; }
.gh-search-in { display: flex; align-items: center; gap: 12px; }
.gh-search-input { flex: 1 1 auto; min-width: 0; min-height: 52px; border: 0; outline: 0; background: none; font: inherit; color: inherit; }
.gh-search-input::-webkit-search-cancel-button { display: none; }
.gh-res-a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 12px; }
.gh-res mark { background: none; color: inherit; }

.gh-back { position: fixed; inset: 0; z-index: 1; visibility: hidden; opacity: 0; pointer-events: none; }
.gh[data-open] .gh-back, .gh[data-search] .gh-back { visibility: visible; opacity: 1; pointer-events: auto; }

.gh-toast { position: fixed; left: 50%; top: 96px; transform: translate(-50%, -8px); z-index: 60; padding: 10px 16px; visibility: hidden; opacity: 0; pointer-events: none; }
.gh-toast[data-on="1"] { visibility: visible; opacity: 1; transform: translate(-50%, 0); }

@media (min-width: 1500px) {
  .gh-search-btn { padding: 0 12px; }
  .gh-search-t, .gh-kbd { display: inline; }
}
@media (max-width: 1240px) {
  .gh-bar { gap: 16px; }
  .gh-count-l { display: none; }
  .gh-link { padding: 0 8px; }
  .gh-me-t { display: none; }
}
@media (max-width: 980px) {
  .gh-bar { height: 52px; padding: 0 16px; gap: 8px; justify-content: space-between; }
  .gh[data-scrolled="1"] .gh-bar { height: 52px; }
  .gh-nav, .gh-lang { display: none; }
  .gh-chips { position: relative; z-index: 3; display: flex; gap: 8px; height: 52px; align-items: center; padding: 0 16px; overflow-x: auto; scrollbar-width: none; }
  .gh-chips::-webkit-scrollbar { display: none; }
  .gh-chip { flex: none; min-height: 44px; padding: 0 16px; white-space: nowrap; }
  .gh-count-l { display: none; }
  .gh-sheets { position: fixed; left: 0; right: 0; top: var(--gh-top, 104px); bottom: 0; pointer-events: none; }
  .gh-sheet { left: 0; right: 0; top: 0; bottom: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .gh-sheet-in { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .gh-groups { grid-auto-flow: row; gap: 20px; }
  .gh-group[data-cols="2"] .gh-list, .gh-group[data-kind="tiles"] .gh-list { grid-template-columns: minmax(0, 1fr); }
  .gh-news { grid-template-columns: 52px minmax(0, 1fr); }
  .gh-news .gh-st { grid-column: 2; justify-self: start; }
  .gh-esc { display: none; }
  .gh-search { left: 0; right: 0; }
  .gh-toast { top: 116px; width: max-content; max-width: calc(100vw - 32px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}