/* Панель раздела «Аналитика» в шапке.

   Панель живёт не внутри <nav>, а рядом с ним: у навигации
   overflow-x:auto для горизонтальной прокрутки на узких экранах, и любой
   выпадающий блок внутри неё обрезался бы по краю. Позицию по горизонтали
   считает скрипт по координатам самого пункта меню.

   Своего position шапке здесь НЕ задаём: в site-header.css у неё уже
   position:sticky, и селектор по классу перебивал его на relative - шапка
   переставала прилипать при прокрутке. Sticky сам по себе является
   позиционированным элементом, и абсолютной панели этого достаточно. */

.an-nav{position:relative;flex:none;display:inline-flex}
.an-nav .an-caret{
  display:inline-block;width:5px;height:5px;margin-left:5px;vertical-align:1px;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translateY(-1px);opacity:.55;
  transition:transform .18s cubic-bezier(.16,1,.3,1),opacity .18s
}
.an-nav[data-open="1"] .an-caret{transform:rotate(-135deg) translateY(-2px);opacity:1}

.an-panel{
  position:absolute;top:calc(100% - 6px);z-index:60;
  width:min(560px,calc(100vw - 32px));padding:10px;
  background:var(--white,#fff);border:1px solid var(--g200,#e3e6ea);border-radius:18px;
  box-shadow:0 18px 48px rgba(12,12,14,.16);
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
  opacity:0;visibility:hidden;transform:translateY(-7px);
  transition:opacity .19s cubic-bezier(.16,1,.3,1),transform .19s cubic-bezier(.16,1,.3,1),visibility .19s
}
.an-panel[data-open="1"]{opacity:1;visibility:visible;transform:none}
/* Панель на две карточки: не растягиваем её на ширину панели из четырёх,
   иначе половина всплывающего окна остаётся пустой. */
.an-panel[data-narrow="1"]{width:min(452px,calc(100vw - 32px))}

.an-card{
  display:block;padding:12px;border-radius:13px;text-decoration:none;
  background:var(--g50,#f6f7f9);border:1px solid transparent;
  transition:background .16s,border-color .16s,transform .16s cubic-bezier(.16,1,.3,1)
}
.an-card:hover,.an-card:focus-visible{
  background:var(--white,#fff);border-color:var(--g300,#c9cdd3);transform:translateY(-2px);outline:none
}
.an-card:focus-visible{border-color:var(--ink,#0c0c0e);box-shadow:0 0 0 2px var(--ink,#0c0c0e)}
.an-card[aria-current="page"]{background:var(--lime-soft,#eef8c9);border-color:var(--lime600,#b4dd33)}

.an-thumb{display:block;width:100%;height:64px;border-radius:9px;overflow:hidden;margin-bottom:9px}
.an-card .t{
  display:block;font-family:'Manrope',system-ui,sans-serif;font-size:14px;font-weight:700;
  color:var(--ink,#0c0c0e);letter-spacing:-.01em
}
.an-card .d{
  display:block;margin-top:3px;font-family:'Manrope',system-ui,sans-serif;
  font-size:12px;line-height:1.45;color:var(--g500,#71757e)
}

@media (max-width:640px){
  .an-panel{grid-template-columns:1fr;left:12px!important;right:12px;width:auto}
  .an-thumb{height:48px}
}
@media (prefers-reduced-motion:reduce){
  .an-panel,.an-card,.an-nav .an-caret{transition:none}
}