/* ============================================================
   AVE SHELL — слой реcкина каркаса Эфира (Фаза 1b).
   Навешивается ПОВЕРХ реальной разметки. Все селекторы привязаны к
   .ave-root НА КОНТЕЙНЕРЕ (.sidebar / .main-head / .members) — класс
   добавляет ave-shell.js по флагу ?ave=1. Флаг выключен → ни одно правило
   не матчится → живой апп выглядит как сейчас. Цвет канала берём из
   --ch-accent (его ставит app.js на кнопку .ch). Значения — из одобренного
   макета reference/shell.html. См. РЕДИЗАЙН-AVE.md, Фаза 1.
   ============================================================ */

/* контейнеры получают токены AVE + моно-шрифт от блока .ave-root (tokens/layout.css);
   здесь — фон/границы под AVE */
.sidebar.ave-root { background: var(--panel); border-right: 1px solid var(--line); color: var(--ink-dim); }
/* плашка «Команда» — мягкая ПЛАВАЮЩАЯ панель как в прототипе (скруглённый левый край 16px + рамка + тень).
   Раньше AVE-override делал её квадратной full-bleed (border-radius:0, только левая граница) — владелец:
   «угловатая, как устаревший дизайн». Возвращаем скругление/рамку; margin/overflow/тень и так приходят из
   базового .members (style.css) — они совпадают с прототипом (membersStyle: radius 16px 0 0 16px, float). */
.members.ave-root { background: var(--panel); border: 1px solid var(--line); border-right: none; border-radius: 16px 0 0 16px; }

/* ===== ЕДИНАЯ панель «Команда» на ВСЕХ вкладках (решение владельца) =====
   Кнопка «Команда» (#btn-team в шапке) переключает общую .members через team-hidden. Раньше на Задачах/
   Досках/ЛС/Встречах .members была принудительно скрыта (display:none!important — там пейны занимали место
   2/-1), поэтому кнопка «не раскрывала» панель. Делаем поведение единым (JS не трогаем — кнопка и так
   рулит team-hidden):
   1) НЕ прячем .members на этих вкладках, пока команда не скрыта вручную (team-hidden). Спецификой +
      !important перебиваем прежний force-hide; при team-hidden наше правило не матчится → force-hide
      снова прячет (как и должно).
   2) Пейны держим в КОЛОНКЕ КОНТЕНТА (grid-column:2, не 2/-1), чтобы центрированное окно не наезжало на
      .members справа. При скрытой команде грид 2-колоночный и «2» == «2/-1» (полная ширина) — поведение
      прежнее; при показанной — окно в средней колонке, команда в правой.
   3) На Задачах убираем ИХ собственную панель .tk-pteam и её тумблер — общая .members заменяет их.
   Всё под .ave-root + десктоп (?ave=0 и мобайл < 761px не трогаем — там прежнее поведение). */
@media (min-width: 761px) {
  body.ave-root.tk-active .app:not(.team-hidden) aside.members,
  body.ave-root.bds-open .app:not(.team-hidden) aside.members,
  body.ave-root.dm-active .app:not(.team-hidden) aside.members,
  body.ave-root.meet-active .app:not(.team-hidden) aside.members { display: flex !important; }
  body.ave-root.tk-active #tasks-pane,
  body.ave-root.bds-open .bds-overlay,
  body.ave-root.dm-active #dm-pane,
  body.ave-root.meet-active #meet-pane { grid-column: 2; }
}
.ave-root #tasks-pane .tk-pteam,
.ave-root #tasks-pane .tk-teamtoggle { display: none !important; }
/* Фидбек владельца (боевой тест 2026-07-07): убрать «полоску»-разделитель под шапкой — иконки просто плывут над полем. */
.main-head.ave-root { border-bottom: none; background: transparent; }
/* [2026-07-04] Баг владельца: на welcome-экране шапка ниже, чем в аудиочате/на других вкладках,
   иконки зарезаются. Причина — старое правило `.welcome-mode .main-head` в style.css (не под
   гейтом, наследие до-AVE дизайна): padding-top:12px/padding-bottom:0 вместо обычных 13px/13px.
   При icon-btn 32px (старый дизайн) это было задумано (прозрачная лёгкая шапка на старте); при
   icon-btn 36px (AVE, см. правило ниже по файлу) нижнего паддинга не хватает — иконка утыкается
   в край. Возвращаем полный паддинг ТОЛЬКО под ave-root, `?ave=0` не трогаем. */
.app.welcome-mode .main-head.ave-root { padding-top: 13px; padding-bottom: 13px; }

/* ---------- шапка сайдбара: F1 интерактивное пиксель-лого (как в прототипе — большой знак-точки над
   раскрытым сайдбаром; welcome-центр остаётся с обычным минималистичным знаком) ---------- */
.sidebar.ave-root .sidebar-head { padding: 18px 14px 14px; border-bottom: 1px solid var(--line-2); }
.sidebar.ave-root .side-brand-c { display: flex; flex-direction: column; align-items: center; }
.sidebar.ave-root .side-brand-c canvas.ave-logo { display: block; cursor: pointer; }
/* большой лого-хедер выше прежнего → сдвигаем список ниже, чтобы не залезал под absolute-шапку (было 150px) */
.sidebar.ave-root .channels { padding-top: 188px; }
.sidebar.ave-root .side-brand-mark { width: 28px; height: 28px; object-fit: contain; }
.sidebar.ave-root .side-brand-title {
  font: var(--fw-semibold) var(--fs-lg) var(--font-display);
  letter-spacing: .2em; text-transform: uppercase; color: var(--ink);
}
.sidebar.ave-root .total-unread {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  font: var(--fw-bold) 10.5px var(--font-mono); background: var(--signal); color: var(--on-signal);
}

/* ---------- единый ряд навигации (Мои задачи / Доски / Встречи / Сообщения), как в прототипе ----------
   Собирается в JS (buildExpandedNav) первым блоком в #channel-list. Мои задачи/Доски продолжают
   ЖИТЬ и СЧИТАТЬСЯ там же, где жили (tk-myspace у tasks-ui.js, .bds-launch у boards-ui.js) — здесь
   их СТАРОЕ визуальное представление просто прячем (клик/бейдж по-прежнему читаются из скрытого
   DOM), а поверх строим единообразную строку-иконку. См. решение владельца №20. */
.sidebar.ave-root #tk-myspace,
.sidebar.ave-root .bds-launch { display: none; }

.sidebar.ave-root #ave-nav-block { padding: 6px 0 4px; margin-bottom: 4px; border-bottom: 1px solid var(--line-2); }
.sidebar.ave-root .ave-navrow {
  display: flex; align-items: center; gap: 10px; width: calc(100% - 12px); margin: 0 6px 1px;
  padding: 7px 10px; border-radius: 9px; border: 1px solid transparent; background: transparent;
  color: var(--muted); cursor: pointer; font: var(--fw-medium) 13.5px var(--font-mono); text-align: left;
}
.sidebar.ave-root .ave-navrow:hover { background: color-mix(in srgb, var(--ink) 5%, transparent); color: var(--ink); }
/* активная строка = открыт соответствующий оверлей (updateNavActive в ave-shell.js) — эталон navStyle */
.sidebar.ave-root .ave-navrow.active {
  background: color-mix(in srgb, var(--signal) 12%, transparent);
  border-color: color-mix(in srgb, var(--signal) 24%, var(--line));
  color: var(--ink); font-weight: var(--fw-semibold);
}
.sidebar.ave-root .ave-navrow-ic { flex: none; width: 17px; height: 17px; }
.sidebar.ave-root .ave-navrow-lbl { flex: 1; }
.sidebar.ave-root .ave-navrow-badge {
  flex: none; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  font: var(--fw-bold) 10.5px var(--font-mono); background: var(--signal); color: var(--on-signal);
}
/* свёрнутый рейл прячет весь текстовый блок целиком — там свои плитки-иконки (см. navTile() ниже) */
.app.ave-collapsed .sidebar.ave-root #ave-nav-block { display: none; }

.sidebar.ave-root .tk-pghead {
  display: flex; align-items: center; gap: 7px; width: 100%;
  padding: 10px 6px 6px; color: var(--muted-2); background: none; border: none;
}
.sidebar.ave-root .tk-pglbl {
  flex: 1; text-align: left;
  font: var(--fw-semibold) var(--fs-label) var(--font-mono);
  letter-spacing: var(--ls-label); text-transform: uppercase;
}
.sidebar.ave-root .tk-pgadd { color: var(--muted-2); font-size: 15px; line-height: 1; }
.sidebar.ave-root .tk-pgadd:hover { color: var(--signal); }

/* ---------- СТРОКА КАНАЛА (.ch) — значения из reference/components.html, цвет = --ch-accent ---------- */
.sidebar.ave-root .ch {
  position: relative; display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  border: 1px solid transparent; border-radius: 9px; padding: 4px 9px 4px 11px;
  color: var(--muted); background: transparent;
}
.sidebar.ave-root .ch:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); color: var(--ink-dim); }
.sidebar.ave-root .ch.active {
  border-color: color-mix(in srgb, var(--ch-accent) 24%, var(--line)); color: var(--ink);
  background: linear-gradient(110deg, color-mix(in srgb, var(--ch-accent) 15%, transparent), transparent 62%),
              color-mix(in srgb, var(--stage) 52%, transparent);
}
/* светящаяся рельса слева у активного — псевдоэлемент (в реальной разметке отдельного узла нет) */
.sidebar.ave-root .ch.active::before {
  content: ""; position: absolute; left: 3px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 16px; border-radius: 3px;
  background: var(--ch-accent); box-shadow: 0 0 10px -1px var(--ch-accent);
}
/* непрочитанный (не активный) канал — та же рельса, но полу-высотой (эталон прототипа: railTransform
   active scaleY(1) / hasUnread scaleY(.55) / иначе scaleY(0)). У нас «иначе» = псевдоэлемента просто нет. */
.sidebar.ave-root .ch.has-unread::before {
  content: ""; position: absolute; left: 3px; top: 50%; transform: translateY(-50%) scaleY(.55);
  width: 3px; height: 16px; border-radius: 3px;
  background: var(--ch-accent); box-shadow: 0 0 10px -1px var(--ch-accent);
}
/* плитка */
.sidebar.ave-root .ch-tile {
  flex: none; width: 22px; height: 22px; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--ch-accent) 12%, var(--panel-2));
  border: 1px solid color-mix(in srgb, var(--ch-accent) 24%, transparent);
  color: var(--ch-accent); font-size: 12px; line-height: 1; overflow: hidden;
}
.sidebar.ave-root .ch.active .ch-tile {
  background: color-mix(in srgb, var(--ch-accent) 28%, var(--panel-2));
  border-color: color-mix(in srgb, var(--ch-accent) 52%, transparent);
}
.sidebar.ave-root .ch-tile canvas.ave-dot { width: 14px; height: 14px; display: block; }
.sidebar.ave-root .ch-tile-icon svg { width: 13px; height: 13px; }
/* имя */
.sidebar.ave-root .ch-body { flex: 1; min-width: 0; }
.sidebar.ave-root .ch-name { font-size: 13.5px; font-weight: 500; }
.sidebar.ave-root .ch.active .ch-name { font-weight: 600; }
/* справа: непрочитанные (.ch-count) = бейдж signal; счётчик голосовых (.ch-mem) = чип акцента */
.sidebar.ave-root .ch-count {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  font: var(--fw-bold) 10.5px var(--font-mono); background: var(--signal); color: var(--on-signal);
}
.sidebar.ave-root .ch-mem {
  font: var(--fw-semibold) 10px var(--font-mono); color: var(--ch-accent);
  background: color-mix(in srgb, var(--ch-accent) 12%, transparent); border-radius: 7px; padding: 4px 6px;
}
.sidebar.ave-root .ch-cog { color: var(--muted-2); }
.sidebar.ave-root .ch-cog:hover { color: var(--ink); }

/* ---------- участники голосового канала (.voice-members / .vm) ---------- */
.sidebar.ave-root .voice-members { display: flex; flex-direction: column; gap: 1px; margin: 1px 0 2px 30px; }
.sidebar.ave-root .vm {
  display: flex; align-items: center; gap: 7px; padding: 3px 8px; border-radius: 7px;
  color: var(--muted); font-size: 12.5px;
}
.sidebar.ave-root .vm:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); color: var(--ink-dim); }
.sidebar.ave-root .vm .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 6px -1px var(--ok); flex: none; }
.sidebar.ave-root .vm .live-chip {
  font: var(--fw-bold) 8px var(--font-mono); letter-spacing: .08em; text-transform: uppercase;
  color: var(--carrot); background: color-mix(in srgb, var(--carrot) 16%, transparent);
  border: 1px solid color-mix(in srgb, var(--carrot) 40%, transparent); border-radius: 5px; padding: 1px 4px;
}

/* ---------- self-bar ---------- */
.sidebar.ave-root .self-bar { border-top: 1px solid var(--line); background: color-mix(in srgb, var(--stage) 40%, transparent); }
.sidebar.ave-root .avatar-sm { border-radius: 11px; border: 1px solid var(--line); }
.sidebar.ave-root .self-name { font: var(--fw-semibold) 14px var(--font-mono); color: var(--ink); }
/* .self-meta (плашка роли) — единственное правило ниже по файлу (свёрнуто из бывшего дубля, Грабля №2):
   там и плашка-стиль, и цвет роли. Здесь больше НЕ дублируем. */
.sidebar.ave-root .self-status { font: 11px var(--font-mono); color: var(--muted); }
.sidebar.ave-root .self-ping-ms { margin-left: auto; color: var(--muted-2); font: 11px var(--font-mono); }
.sidebar.ave-root .self-ping-text { font: 11px var(--font-mono); color: var(--muted); }
/* иконочные кнопки сайдбара/хедера — вид AVE iconbtn (состояния .live/.muted-on/.danger красятся токенами сами) */
.sidebar.ave-root .icon-btn,
.main-head.ave-root .icon-btn {
  width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid var(--line-2); background: var(--field); color: var(--muted);
}
.sidebar.ave-root .icon-btn:hover,
.main-head.ave-root .icon-btn:hover { color: var(--ink); background: var(--panel-2); }
/* «+» создать канал у лого — НЕ боксовая кнопка, а лёгкий глиф (эталон прототипа: font 15px,
   var(--muted-2), padding 0 4px; тот же вид, что «+» у групп каналов .tk-pgadd). Перебиваем и
   .icon-btn-коробку, и inline style="font-size:17px" (нужный ?ave=0) — отсюда !important только
   на font-size; остальное перебивается специфичностью id-селектора без !important. */
.sidebar.ave-root #btn-add-channel {
  width: auto; height: auto; min-width: 0; padding: 0 4px;
  border: none; background: transparent; color: var(--muted-2);
  font-size: 15px !important; line-height: 1;
}
.sidebar.ave-root #btn-add-channel:hover { background: transparent; color: var(--signal); }

/* ---------- ХЕДЕР ---------- */
.main-head.ave-root .main-title { font: var(--fw-semibold) 15px var(--font-mono); color: var(--ink); }
/* (переключатель Офис/Плитки удалён партией «Снос legacy» 17.07) */

/* ---------- ПАНЕЛЬ «КОМАНДА» ---------- */
.members.ave-root .members-head {
  font: var(--fw-semibold) var(--fs-label) var(--font-mono);
  letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted-2);
}
.members.ave-root .member { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 10px; }
.members.ave-root .member:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); }
.members.ave-root .member.offline { opacity: .55; }
.members.ave-root .presence { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--ok); box-shadow: 0 0 6px -1px var(--ok); }
.members.ave-root .member.offline .presence { background: var(--muted-2); box-shadow: none; }
.members.ave-root .m-avatar { width: 38px; height: 38px; border-radius: 11px; border: 1px solid var(--line); }
.members.ave-root .m-name { font: var(--fw-semibold) 13.5px var(--font-mono); color: var(--ink); }
.members.ave-root .m-role {
  font: var(--fw-bold) 9px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--rc, var(--muted));
  background: color-mix(in srgb, var(--rc, var(--muted)) 15%, transparent);
  border: 1px solid color-mix(in srgb, var(--rc, var(--muted)) 30%, transparent); border-radius: 999px; padding: 2px 6px;
}
.members.ave-root .m-statustx { font: 11.5px var(--font-mono); color: var(--muted); }
.members.ave-root .m-load { font: 11px var(--font-mono); color: var(--muted-2); }
.members.ave-root .mf-empty { color: var(--muted); font: 12px var(--font-mono); padding: 10px; }

/* ============================================================
   JOST — display-шрифт вордмарка (self-host, Фаза 1c). Лежит здесь, а не в
   @import-нутом tokens/fonts.css, чтобы кэш-бастер ave-shell.css?v сбрасывал.
   ============================================================ */
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/jost-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/jost-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:500;src:url(fonts/jost-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:500;src:url(fonts/jost-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:600;src:url(fonts/jost-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:600;src:url(fonts/jost-cyrillic-600-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:700;src:url(fonts/jost-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Jost';font-style:normal;font-display:swap;font-weight:700;src:url(fonts/jost-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}

/* ============================================================
   СВЁРНУТЫЙ САЙДБАР — РЕЙЛ 64 (Фаза 1c).
   Рейл — инъекция ave-shell.js (.ave-rail/.ave-rail-toggle). Грид сужает колонку,
   реальный контент сайдбара прячется, показывается рейл. Цвет плиток — --ch-accent.
   ============================================================ */
.app.ave-collapsed { grid-template-columns: 64px minmax(0,1fr) 248px; }
.app.ave-collapsed.team-hidden { grid-template-columns: 64px minmax(0,1fr); }

/* кнопка-тумблер на правой границе сайдбара */
.sidebar.ave-root .ave-rail-toggle {
  position: absolute; top: 50%; right: -11px; transform: translateY(-50%); z-index: 6;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--panel-2); border: 1px solid var(--line); color: var(--muted);
  font: 13px/1 var(--font-mono); display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.sidebar.ave-root .ave-rail-toggle:hover { color: var(--ink); border-color: var(--muted-2); }

/* переключение контент <-> рейл */
.sidebar.ave-root .ave-rail { display: none; }
.app.ave-collapsed .sidebar.ave-root > *:not(.ave-rail):not(.ave-rail-toggle) { display: none !important; }
.app.ave-collapsed .sidebar.ave-root .ave-rail {
  display: flex; flex-direction: column; align-items: center; flex: 1; min-height: 0;
  padding: 14px 0 10px; gap: 6px;
}
/* лого рейла — ГОЛЫЙ знак, крупный и весомый, как в прототипе (без плашки/рыжей обводки; фидбек владельца) */
.sidebar.ave-root .ave-rail-mark {
  width: 44px; height: 44px; border-radius: 0;
  background: transparent; border: 0;
  display: flex; align-items: center; justify-content: center; flex: none; margin-bottom: 6px; cursor: pointer;
  transition: transform .15s ease, filter .15s ease;
}
.sidebar.ave-root .ave-rail-mark:hover {
  transform: scale(1.07);
  filter: drop-shadow(0 0 9px color-mix(in srgb, var(--ink) 30%, transparent));
}
.sidebar.ave-root .ave-rail-logo { width: 38px; height: 38px; object-fit: contain; opacity: 1; }
/* «+» в свёрнутом рейле — багфикс: раньше открыть меню Создать канал/проект/встречу можно было только
   в развёрнутом сайдбаре (см. #btn-add-channel), рейл строился отдельной разметкой без этой кнопки */
.sidebar.ave-root .ave-rail-add {
  width: 42px; height: 42px; border-radius: 11px; flex: none; margin-bottom: 6px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  background: transparent; border: 1px dashed var(--line-2); color: var(--muted);
  font: var(--fw-semibold) 19px/1 var(--font-mono);
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.sidebar.ave-root .ave-rail-add:hover {
  color: var(--signal); border-color: color-mix(in srgb, var(--signal) 50%, var(--line-2));
  background: color-mix(in srgb, var(--signal) 8%, transparent); border-style: solid;
}
.sidebar.ave-root .ave-rail-sep { width: 24px; height: 1px; flex: none; margin: 3px auto; background: var(--line); }
.sidebar.ave-root .ave-rail-chans {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%;
}
.sidebar.ave-root .ave-rail-tile {
  position: relative; width: 42px; height: 42px; border-radius: 11px;
  border: 1px solid transparent; background: transparent; flex: none;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.sidebar.ave-root .ave-rail-tile:hover { background: color-mix(in srgb, var(--ink) 5%, transparent); }
.sidebar.ave-root .ave-rail-tile.active {
  border-color: color-mix(in srgb, var(--ch-accent) 42%, transparent);
  background: color-mix(in srgb, var(--ch-accent) 14%, transparent);
}
.sidebar.ave-root .ave-rail-tile.active::before {
  content: ""; position: absolute; left: -9px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 18px; border-radius: 3px;
  background: var(--ch-accent); box-shadow: 0 0 10px -1px var(--ch-accent);
}
.sidebar.ave-root .ave-rail-tile canvas { width: 22px; height: 22px; }
.sidebar.ave-root .ave-rail-tile .ave-rail-badge {
  position: absolute; top: -3px; right: -3px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; font: var(--fw-bold) 9px var(--font-mono);
  background: var(--signal); color: #16130c; border: 2px solid var(--panel);
}

/* флайаут выбора канала (на body — вне сайдбара; клик по иконке-группе свёрнутого рейла) */
.ave-rail-flyout {
  position: fixed; z-index: 200; min-width: 214px; max-width: 288px;
  background: color-mix(in srgb, var(--panel, #14161b) 96%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid var(--line, #262a31); border-radius: 14px; box-shadow: 0 20px 50px -18px rgba(0, 0, 0, .8); padding: 8px;
}
.ave-rail-fly-h { font: 700 10px var(--font-mono, monospace); letter-spacing: .14em; color: var(--muted, #8a8f98); padding: 6px 8px 8px; }
.ave-rail-fly-row {
  display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; border: none; border-radius: 10px;
  background: transparent; color: var(--ink, #f0f0f0); cursor: pointer; font: 600 13px var(--font-mono, monospace); text-align: left;
}
.ave-rail-fly-row:hover { background: color-mix(in srgb, var(--ink, #fff) 6%, transparent); }
.ave-rail-fly-row.active { background: color-mix(in srgb, var(--signal, #ff6a3d) 12%, transparent); color: var(--signal, #ff6a3d); }
.ave-rail-fly-ic { flex: none; color: var(--muted, #8a8f98); font-size: 13px; width: 16px; text-align: center; }
.ave-rail-fly-tx { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ave-rail-fly-cnt {
  flex: none; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  font: 700 11px var(--font-mono, monospace); background: color-mix(in srgb, var(--signal, #ff6a3d) 18%, transparent); color: var(--signal, #ff6a3d);
}
.sidebar.ave-root .ave-rail-self { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 9px; padding-top: 8px; }
.sidebar.ave-root .ave-rail-av {
  width: 38px; height: 38px; border-radius: 11px; border: 1px solid var(--line);
  background: var(--panel-2) center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
  font: var(--fw-bold) 15px var(--font-mono); color: var(--muted);
}
.sidebar.ave-root .ave-rail-gear {
  width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid var(--line-2); background: var(--field); color: var(--muted);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.sidebar.ave-root .ave-rail-gear:hover { color: var(--ink); }
.sidebar.ave-root .ave-rail-gear svg { width: 18px; height: 18px; }

/* вордмарк — точным Jost */
.sidebar.ave-root .side-brand-title { font-family: var(--font-display); }

/* ---- ЖИВОЕ сквозное dot-поле (B-II-1): canvas #ave-live-field — первый ребёнок body, ПОД интерфейсом
        по порядку DOM. Без z-index/isolation (ломали раскладку и клики в прошлых заходах); pointer-events:none.
        Подложка — родной тёмный фон body (--bg). СТРАХОВКА: body.ave-field-css (?fieldcss=1) — канвас
        скрыт/не создаётся, возвращаются старые CSS-точки на .app. ---- */
#ave-live-field { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; display: block; }
.ave-root.ave-field-css #ave-live-field { display: none; }
.ave-root .app { background: transparent; }
.ave-root.ave-field-css .app {
  background-color: var(--bg);
  background-image: radial-gradient(circle, rgba(206, 214, 232, .07) 1.1px, transparent 1.7px);
  background-size: 34px 34px;
}
.ave-root .main { background: transparent; }
/* ---- P1 (решение №11): контент ПРЯМО на поле, без «окна»-коробки. Рамка/фон/тень контейнера — нет
        (как в прототипе: строки и карточки сами по себе на точках). background:transparent обязателен —
        перекрывает СВОЙ непрозрачный фон базовых #tasks-pane/.bds-overlay.
        ШИРИНА — ЭТАЛОННАЯ ИЗ ИСХОДНИКА ПРОТОТИПА: контейнер задач там max-width:1100px; margin:0 auto
        (строки 1087/1103 AVE Chat.dc.html). Прежние 1320/снятие правила — мои ошибки замера по
        отскейленным скринам; число 1100 взято из кода, не с экрана. ---- */
.ave-root #tasks-pane {
  justify-self: center; width: min(1100px, calc(100% - 48px)); margin: 14px 0;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
/* доска (Excalidraw) — на ВЕСЬ экран, НЕ windowed 1100px: холсту нужен максимум места
   (фидбек владельца, боевой тест 2026-07-07). Список досок центрируется своим внутренним
   max-width:1120 (.bds-grid/.bds-listhead), так что раскладка списка не ломается. */
.ave-root .bds-overlay {
  justify-self: stretch; width: 100%; margin: 0;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
/* [2026-07-04] БЫЛО здесь: явное display:none для .main-head на tk-active/bds-open/dm-active —
   лечение симптома не в ту сторону (владелец сверил с прототипом: шапка там ВСЕГДА видна,
   независимо от вкладки — она физически вынесена из-под переключения view). Настоящий фикс —
   структурный: .main-head теперь отдельный грид-элемент .app (ряд 1), #main/#tasks-pane/
   .bds-overlay/#dm-pane ограничены рядом 2 (см. style.css, index.html, ave-dm.css, tasks-ui.js,
   boards-ui.js) — им физически негде больше пересекаться с шапкой, прятать её незачем. */
/* welcome живёт ВНУТРИ .chat-frame — на стартовом экране снимаем его хром (паттерн base voice-mode) */
.ave-root .app.welcome-mode .chat-frame { background: transparent; border: 0; box-shadow: none; }
/* ---- ГЛОБАЛЬНО ДЛЯ AVE: тонкие полупрозрачные полосы прокрутки у ВСЕХ скроллеров (единый LED-минимализм;
        закрывает и Firefox, и вебкит, и любые будущие скроллеры без точечных правил) ---- */
body.ave-root, body.ave-root * { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--line) 60%, transparent) transparent; }
body.ave-root ::-webkit-scrollbar { width: 8px; height: 8px; }
body.ave-root ::-webkit-scrollbar-track { background: transparent; }
body.ave-root ::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
body.ave-root ::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--line) 60%, transparent); border-radius: 6px; }
body.ave-root :hover::-webkit-scrollbar-thumb { background: var(--line); }

/* ---- пин-в-Фокус: хэндл на строке задачи (перетащи на поле точек → закрепить в виджете «Фокус») ---- */
.ave-root #tasks-pane .tk-trow { position: relative; }
.ave-root .ave-pinh {
  flex: none; width: 24px; height: 24px; margin-left: 4px; border: none; border-radius: 7px; cursor: grab;
  background: transparent; display: inline-flex; align-items: center; justify-content: center; opacity: 0;
  transition: opacity .12s ease, background .12s ease, box-shadow .12s ease; touch-action: none;
}
.ave-root #tasks-pane .tk-trow:hover .ave-pinh { opacity: .6; }
.ave-root .ave-pinh:hover { opacity: 1 !important; background: color-mix(in srgb, var(--signal) 14%, transparent); }
.ave-root .ave-pinh:active { cursor: grabbing; }
.ave-root .ave-pinh canvas { width: 13px; height: 13px; pointer-events: none; }
.ave-root .ave-pinh.ave-pinned { opacity: 1 !important; background: color-mix(in srgb, var(--signal) 30%, transparent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--signal) 40%, transparent); }

/* ============================================================
   P5a (2026-07-02): SELF-BAR — доводка под прототип v22 (футер сайдбара,
   исходник стр. ~190–214). Аватар 40×40 r12; роль — ЧИП в строке с именем
   (700 8px, тон currentColor 15/32); строка связи: «Связь» + LED-бар из 14
   сегментов (segStyle прототипа: r1.5, свечение) вместо точки и «В сети»,
   сегменты красит ave-shell.js от пинга; «Покинуть эфир» — широкая danger-
   кнопка. Онлайн-точку прототипа НЕ добавляем: правый-нижний угол аватара
   занят нашим эмодзи-настроением (богатство Эфира). Всё под .ave-root.
   ============================================================ */

.sidebar.ave-root .self-bar .avatar-sm { width: 40px; height: 40px; border-radius: 12px; font-size: 16px; }

/* имя + чип роли в одну строку (в разметке они в колонку — флексуем контейнер) */
.sidebar.ave-root .self-info { display: flex; align-items: center; gap: 6px; }
.sidebar.ave-root .self-meta {
  flex: none; font: var(--fw-bold) 8px/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase;
  padding: 3px 5px; border-radius: 6px;
  /* цвет РОЛИ (--rc из ROLE_COLORS, ставит renderSelf), fallback --signal; подложка/рамка — из него же
     через currentColor (эталон прототипа: color-mix 15% / 32%). Раньше color был жёстко --signal → плашка
     всегда оранжевая независимо от роли. */
  color: var(--rc, var(--signal));
  background: color-mix(in srgb, currentColor 15%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 32%, transparent);
}

/* строка связи: прячем точку и «В сети», геометрия прототипа (gap 9 / отступ 9) */
.sidebar.ave-root .self-status { gap: 9px; padding-top: 9px; }
.sidebar.ave-root .self-ping-dot,
.sidebar.ave-root .self-ping-text { display: none; }
.sidebar.ave-root .ave-sig-lbl {
  flex: none; font: var(--fw-bold) 8px/1 var(--font-mono);
  letter-spacing: .16em; text-transform: uppercase; color: var(--muted-2);
}
.sidebar.ave-root .ave-sig-bar { flex: 1; display: flex; align-items: stretch; gap: 2px; height: 11px; }
.sidebar.ave-root .ave-sig-bar span { flex: 1; border-radius: 1.5px; background: color-mix(in srgb, var(--ink) 8%, transparent); }
.sidebar.ave-root .ave-sig-bar span.on { background: var(--sig-c, var(--ok)); box-shadow: 0 0 7px -1px var(--sig-c, var(--ok)), 0 0 2px var(--sig-c, var(--ok)); }

/* «Покинуть эфир» — широкая danger-кнопка, как в прототипе */
.sidebar.ave-root .self-actions #btn-hangup {
  flex: 1; width: auto; border-radius: 9px; color: var(--danger);
  background: color-mix(in srgb, var(--danger) 13%, transparent);
  border-color: color-mix(in srgb, var(--danger) 32%, transparent);
}

/* ============================================================
   P5b (2026-07-02): РЕЙЛ + ШАПКА — финальная сверка блока P
   (эталон: rail-блок прототипа, стр. ~219–232; шапка ~288–303).
   Плитки r12, иконки 18px (отрисовка ужата в ave-shell.js — CSS-скейл
   замылил бы пиксель-арт), разделитель 26/line-2/7px, низ рейла 16px,
   аватар-зеркало 42/r13, шестерёнка — призрачная (ink-5%). Бейдж
   колокола шапки — сигнальный чип прототипа вместо красного
   (панель уведомлений целиком — F5). Лого рейла НЕ трогаем —
   голый крупный знак закреплён фидбеком владельца.
   ============================================================ */

.sidebar.ave-root .ave-rail-tile { border-radius: 12px; }
/* иконки рейла = welcome-глиф 18px (фидбек владельца 2026-07-06 «под размер стартового окна,
   одинаковыми»): рисуются в buildRail тоже на 18 — canvas не растягивается, пиксели чёткие */
.sidebar.ave-root .ave-rail-tile canvas { width: 18px; height: 18px; }
.sidebar.ave-root .ave-rail-sep { width: 26px; margin: 7px auto; background: var(--line-2); }
.app.ave-collapsed .sidebar.ave-root .ave-rail { padding-bottom: 16px; }
.sidebar.ave-root .ave-rail-av { width: 42px; height: 42px; border-radius: 13px; }
.sidebar.ave-root .ave-rail-gear { border-color: transparent; background: color-mix(in srgb, var(--ink) 5%, transparent); }

/* H2b: звук-док у СВЁРНУТОГО рейла (эталон v22) — фикс-колонка mic/deaf/cam/leave справа от рейла.
   DOM строит app.js (renderRailVoiceDock, у него доступ к state.muted/deafened/camStream). */
.ave-root .ave-rvdock { position: fixed; left: 74px; bottom: 18px; z-index: 43; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.ave-root .ave-rvbtn { width: 44px; height: 44px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: none; padding: 0; background: transparent; border: 1px solid transparent; transition: background .14s ease, border-color .14s ease, transform .12s ease; }
.ave-root .ave-rvbtn:hover { background: color-mix(in srgb, var(--ink) 11%, transparent); border-color: var(--line); transform: translateY(-1px); }
.ave-root .ave-rvbtn canvas { width: 26px; height: 26px; pointer-events: none; }
.ave-root .ave-rvsep { width: 18px; height: 1px; background: var(--line-2); margin: 2px 0; }

/* бейдж непрочитанных на колоколе (в шапке) — сигнальный, тёмный текст, кайма фона */
.ave-root .nf-badge {
  top: -4px; right: -4px; border-radius: 8px;
  font: var(--fw-bold) 9px/13px var(--font-mono);
  background: var(--signal); color: var(--on-signal);
  border: 1.5px solid var(--bg); box-shadow: none;
}

/* ============================================================
   M1 · МОБАЙЛ (≤760px). AVE-слой писался десктоп-первым — здесь возвращаем старый мобильный режим
   (сайдбар-оверлей + бургер) в AVE-коже. Рейл на мобайле НЕ строится (ave-shell.js: collapsedNow()
   учитывает ширину; класс ave-collapsed там не вешается) — тут гасим рейл-хром и страхуем грид.
   Контент-пейны (M2) и голос/офис-оверлеи (M3) — своими секциями/JS-гейтами. ?ave=0 не трогаем.
   ============================================================ */
@media (max-width: 760px) {
  /* переключатель рейла не нужен — сайдбар открывается бургером (старый мобильный режим) */
  .sidebar.ave-root .ave-rail-toggle { display: none !important; }
  /* страховка грида: даже если ave-collapsed где-то просочится, раскладка остаётся одноколоночной
     (как в старом мобильном style.css), а не 3-колоночным рейл-гридом (.app.ave-collapsed, спец. 2 класса). */
  body.ave-root .app.ave-collapsed,
  body.ave-root .app.ave-collapsed.team-hidden { grid-template-columns: 1fr; }

  /* ---- M2: полноэкранные контент-пейны на всю ширину ----
     Каждый пейн чинит свой grid-column:1/-1 на ≤760px в СВОЁМ файле (tasks-ui.js / boards-ui.js /
     ave-meetings.css / ave-dm.css) — ВАЖНО: ave-shell.css грузится РАНЬШЕ них, поэтому правило пейна из
     shell проигрывает по каскаду базовому правилу модуля (так и было с #dm-pane — уезжал вбок). Здесь —
     только снимаем десктопное центрирование 1100px у задач/досок (P1). */
  .ave-root #tasks-pane, .ave-root .bds-overlay { width: 100%; margin: 8px 0; }

  /* ---- M1b: компактный лого-хедер сайдбара (десктопные 188px тяжеловаты на телефоне).
     Сам canvas уменьшается в JS (initLogoParticles: масштаб 0.68 при innerWidth<=760) —
     тут только паддинги шапки и компенсация absolute-шапки у списка. */
  .sidebar.ave-root .sidebar-head { padding: 12px 14px 10px; }
  .sidebar.ave-root .channels { padding-top: 136px; }
}