/* «Аналитика» (02.10.2026, документ 90). Сам раздел живёт в теневом DOM #analyticsView: его стили —
   analytics-shadow.css, общие правила кабинета внутрь не проникают и наружу не вытекают. Здесь — место раздела
   в оболочке кабинета и токены --an-*: их читают стили раздела и графики ECharts (analytics-viz.js → tokens()).
   Цвета графиков проверены валидатором палитр на поверхностях карточек обеих тем: адреса — категориальные
   слоты 1–3, ступени — фиолетовая порядковая шкала, величины — синяя последовательная, статусы — с подписью. */
.analytics-view { flex: 1; min-height: 0; overflow: auto; background: var(--bg); }
.app-shell[data-mode=analytics] #mobileMenuButton { display: none; }
.app-shell[data-mode=analytics] #liveState { display: none; }
/* ── Шапка с пятью разделами («Аналитика» — пятый) ─────────────────────────────────────────────────
   Разделы стоят по центру, пока группы слева и справа помещаются в равные доли (app.css). Пятая кнопка
   сделала разделы шире, и логотип с выбором объекта или статус связи с именем пользователя наезжали на них
   (замер 02.10: 881 px — на 14 px, 1101–1180 px в «Пульсе» и «Настройках» — на 18–37 px, 1366 px с «Назад» —
   на 7 px), а на телефоне в «Пульсе», «Настройках» и «Записях» рядом ещё бургер — «Выйти» уезжал за край. Поэтому:
   - группы не уже своего содержимого, а разделы при нехватке места сжимаются и прокручиваются вбок —
     наложения и обрезанного «Выйти» нет ни на какой ширине (центр при этом может сместиться);
   - на 881–1260 px разделы — короткими словами с отступом 8 px, на 1261–1440 px — полными с отступом 14 px;
     на 881–1000 px логотип уступает место разделам, как на телефоне, а кнопки ещё плотнее (5 px, 12,5 px);
   - пока на экране «Назад», логотип прячется до 1600 px (было до 1320);
   - на телефоне кнопки плотнее, «Аналитика» подписана «Анализ» (data-tiny), бургер уже.
   Проверка — все разделы на 360–1920 px: наложений нет, разделы без прокрутки (документ 90). */
.top-left, .top-right { min-width: max-content; }
#modes { flex: 0 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
#modes::-webkit-scrollbar { display: none; }
#modes button { flex: none; }
@media (min-width: 881px) and (max-width: 1260px) {
  #modes button { padding-inline: 8px; font-size: 0; }
  #modes button::after { content: attr(data-short); font-size: 13px; }
}
@media (min-width: 881px) and (max-width: 1000px) {
  .brand { display: none; }
  #modes button { padding-inline: 5px; }
  #modes button::after { font-size: 12.5px; }
}
@media (min-width: 1261px) and (max-width: 1440px) {
  #modes button { padding-inline: 14px; }
}
@media (max-width: 1600px) {
  body.has-back .brand { display: none; }
}
@media (max-width: 480px) {
  #modes { gap: 1px; padding-inline: 2px; }
  #modes button { padding-inline: 4px; }
  #modes button[data-tiny]::after { content: attr(data-tiny); }
  .mobile-menu-button { width: 34px; padding-inline: 7px; }
}

:root {
  --an-page: var(--bg); --an-card: var(--panel); --an-card-2: var(--panel-2); --an-card-3: var(--panel-3);
  --an-hair: var(--line); --an-hair-2: var(--line-2);
  --an-text: var(--text); --an-muted: var(--muted); --an-faint: var(--faint);
  --an-accent: var(--blue); --an-accent-ink: #ffffff; --an-accent-soft: rgba(67, 140, 246, .14);
  --an-grid: #1f2530; --an-axis: #2c3340; --an-band: rgba(150, 160, 190, .08); --an-wet: rgba(57, 135, 229, .13); --an-deemph: #4b5363;
  --an-s1: #3987e5; --an-s2: #d95926; --an-s3: #199e70;
  --an-o1: #4f40b0; --an-o2: #6b5cd6; --an-o3: #8a7cf0; --an-o4: #a99ff6; --an-o5: #c9c1ff;
  --an-q0: #182231; --an-q1: #18375f; --an-q2: #1c5cab; --an-q3: #2a78d6; --an-q4: #5598e7; --an-q5: #9ec5f4;
  --an-good: #0ca30c; --an-warning: #fab219; --an-serious: #ec835a; --an-critical: #d03b3b;
  --an-good-ink: #3fd16b; --an-critical-ink: #ff7b7b; --an-warning-ink: #fbc54d; --an-serious-ink: #f4a07c;
  --an-shadow: none; --an-tip-shadow: 0 14px 32px rgba(0, 0, 0, .35); --an-dialog-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
:root[data-theme="light"] {
  --an-accent: #1f8a5b; --an-accent-ink: #fffaf1; --an-accent-soft: rgba(31, 138, 91, .12);
  --an-grid: #efe4d2; --an-axis: #dccdb5; --an-band: rgba(140, 100, 40, .07); --an-wet: rgba(42, 120, 214, .10); --an-deemph: #cfc3ae;
  --an-s1: #2a78d6; --an-s2: #eb6834; --an-s3: #1baf7a;
  --an-o1: #a99ef0; --an-o2: #8b7fe6; --an-o3: #6e5fd6; --an-o4: #5443bd; --an-o5: #3a2a96;
  --an-q0: #f1ece2; --an-q1: #cde2fb; --an-q2: #9ec5f4; --an-q3: #5598e7; --an-q4: #256abf; --an-q5: #0d366b;
  --an-good-ink: #006300; --an-critical-ink: #a8322f; --an-warning-ink: #8a5a00; --an-serious-ink: #a14a22;
  --an-shadow: 0 1px 2px rgba(73, 50, 26, .06), 0 10px 28px rgba(73, 50, 26, .06);
  --an-tip-shadow: 0 14px 32px rgba(73, 50, 26, .18); --an-dialog-shadow: 0 30px 80px rgba(73, 50, 26, .28);
}