/* ==========================================================================
   AVE-START — мобильный стартовый экран «Эфира». Утверждённая владельцем композиция 09.09:
     · сверху — вертикальный БАРАБАН аудио-каналов: один в центре выделен, соседи притемнены и
       уходят за край, листается пальцем вверх-вниз;
     · в середине — календарь: цифры прямо на чёрном, под занятыми днями цветные точки проектов,
       сегодня — залитый кружок;
     · снизу — дела дня узкими плоскими плашками.
   Плоско: ни теней, ни градиентов, ни кромок. Цвет несёт смысл: цвет проекта у точки и у плашки,
   просрочка красная, закрытое серое. Токены — .ave-root (public/ave/tokens/*.css).
   Экран рисуется ТОЛЬКО на телефоне (гейт в ave-start.js), десктопный welcome не трогаем.
   ========================================================================== */

.ave-start {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column;
  background: var(--space-bg, var(--bg));   /* фон общего пространства (ave-space.css) */
  font-family: var(--font-mono);
  color: var(--ink);
  overflow: hidden;
}
.ave-start * { box-sizing: border-box; }

/* Боковая панель НЕ переопределяется: выезжает сбоку полоской, как во всём мобильном приложении
   (владелец 09.09 попробовал полноэкранную и вернул прежнее поведение). */
/* dev-плашка «DEV :порт» на этом экране лишняя (просьба владельца). На боевом домене её и так нет —
   envBadge в app.js выходит по hostname, — так что на бою прятать нечего. */
body.as-start-on .env-badge { display: none !important; }

/* «Домой» в шапке разделов — только на телефоне; на старте шапка и так скрыта */
.main-head .as-home { display: none; }
@media (max-width: 760px) {
  body.ave-root .main-head .as-home { display: inline-flex; align-items: center; justify-content: center; color: var(--signal); }
  body.ave-root .main-head .as-home svg { width: 18px; height: 18px; }
}

/* пока смонтирован новый экран — старый welcome, верхняя строка и мобильная плашка не нужны */
#app.as-on #welcome { display: none !important; }
body.as-start-on #ave-mvbar { display: none !important; }
body.as-start-on .main-head { display: none !important; }

/* Верхний отступ: 10px плюс env(safe-area-inset-top) — на случай, если в мету когда-нибудь добавят
   viewport-fit=cover. Сейчас env даёт ноль, и это ПРАВИЛЬНО: без viewport-fit iOS сам держит страницу
   ниже строки состояния (проверено на живом айфоне 10.09 — лого сидело на 123px от верха экрана,
   потому что к системным 59px я добавлял ещё 62 своих). Никаких запасов сверх env здесь быть не должно. */
.as-body {
  flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column;
  padding: calc(10px + env(safe-area-inset-top, 0px)) 18px 92px;   /* низ = место под поднятую кнопку «Меню» */
}
.as-row { display: flex; align-items: center; gap: 8px; }
.as-lbl {
  font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted-2);
}
/* Шапка — ОДНО лого по ЦЕНТРУ (решения владельца 09.09: «убрал бы саму фразу AVE Chat», «лого
   сдвинем в центр»). Тап открывает боковую панель штатной кнопкой #btn-burger. Кнопка не тянется
   на всю строку: невидимая полоса во весь экран, открывающая панель, читалась бы как случайный тап.
   ⚠️ z-index ОБЯЗАТЕЛЕН: барабан подтянут под шапку (margin-top:-44px), и его верхние 70px разгона
   прозрачны из-за маски, но ЖИВЫ для касаний — без своего слоя лого не нажималось вообще (жалоба
   владельца 09.09). Проверка кликом из JS этого не ловила: клик не делает hit-testing, тап делает. */
.as-brand {
  align-self: center; position: relative; z-index: 3;
  display: flex; align-items: center; padding: 2px 10px 6px;
  border: 0; background: none; font-family: inherit; color: var(--ink); text-align: left;
}
.as-brand img { width: 40px; height: 40px; display: block; }
.as-sechead { display: flex; align-items: flex-end; justify-content: space-between; margin: 0 0 8px; }
/* заголовок «Сегодня» лежал вплотную к последнему ряду плиток календаря */
/* список дел опущен ниже — воздух под календарём (просьба владельца), а не вплотную к плиткам */
.as-thead { margin-top: 18px; margin-bottom: 6px; }
.as-sechead .t { font-size: 14px; font-weight: 700; letter-spacing: -.01em; }
.as-sechead .c { font-size: 10.5px; color: var(--muted); display: block; margin-top: 2px; }
/* «Сегодня» и счётчик дел — в одну строку (владелец: «сам блок ужми»): двухэтажный заголовок
   съедал 16px там, где помещается ещё одно дело. */
.as-thead > div { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.as-thead .c { display: inline; margin-top: 0; white-space: nowrap; }
.as-sechead .a {
  font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted-2); background: none; border: 0; font-family: inherit; padding: 0 0 2px;
}
.as-sechead .a.act { color: var(--signal); }
/* ---------- аватар: скруглённый КВАДРАТ, не круг (правило AVE) ---------- */
.as-av {
  width: 20px; height: 20px; flex: 0 0 20px; border-radius: 6px;
  display: grid; place-items: center; font-size: 8px; font-weight: 800; color: var(--bg);
  background-size: cover; background-position: center; overflow: hidden;
}
.as-av.sm { width: 24px; height: 24px; flex: 0 0 24px; border-radius: 8px; font-size: 9px; }
.as-av.lg { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; font-size: 12px; }
.as-stack { display: flex; }
.as-stack .as-av { margin-left: -6px; box-shadow: 0 0 0 2px var(--bg); }
.as-stack .as-av:first-child { margin-left: 0; }
.as-ld { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: var(--muted-2); }
.as-ld.on { background: var(--ch-voice); }
/* Иконка канала в строке барабана: общий dot-глиф voice (размеры канве ставит сам DotIcons.draw). */
.as-wico { flex: 0 0 auto; display: block; line-height: 0; }
.as-wico.voice { color: var(--ch-voice); }
.as-wico.voice.dim { color: var(--muted-2); }
.as-wico.text { color: var(--ch-text); }
.as-wico svg { display: block; }
.as-pico svg { display: block; }

/* ---------- БАР ГОЛОСОВЫХ (владелец 05.10, макет A): одна строка под лого вместо барабана ---------- */
/* Бар — обёртка, внутри кнопка .as-vmain (и в звонке — отдельная кнопка «выйти»: кнопку в кнопку не вложить).
   Высота 56: вся строка — цель для пальца. Тень лёгкая, как у пуша; пустой бар — без тени, тише. */
.as-vbar {
  position: relative; z-index: 2; flex: 0 0 auto; display: flex; align-items: center; gap: 4px;
  height: 56px; margin: 2px 0 16px; border-radius: 18px; background: var(--panel);
  box-shadow: 0 6px 18px rgba(19, 19, 23, .07);
}
.as-vmain {
  flex: 1; min-width: 0; height: 100%; display: flex; align-items: center; gap: 12px;
  padding: 0 14px 0 10px; border: 0; border-radius: 18px; background: none;
  font-family: inherit; color: var(--ink); text-align: left; cursor: pointer;
}
.as-vstack { display: flex; flex: 0 0 auto; padding-left: 2px; }
.as-av.vb {
  width: 30px; height: 30px; flex: 0 0 30px; border-radius: 10px; font-size: 12px;
  box-shadow: 0 0 0 2px var(--panel);
}
.as-vstack .as-av.vb + .as-av.vb { margin-left: -9px; }
.as-av.vb.more { background: var(--field); color: var(--muted); font-size: 11px; }
.as-vtx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.as-vt { display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 14px; font-weight: 700; letter-spacing: -.01em; }
.as-vt .tt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-vt .live, .as-vhead .live {
  width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--ch-voice);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ch-voice) 18%, transparent);
}
.as-vs { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-vchev { flex: 0 0 auto; color: var(--muted-2); line-height: 0; }
.as-vchev svg, .as-vico svg, .as-vrico svg, .as-vclose svg, .as-vhang svg { display: block; }
.as-vico {
  width: 34px; height: 34px; flex: 0 0 34px; border-radius: 11px; display: grid; place-items: center;
  background: var(--field); color: var(--muted-2);
}
.as-vnone { padding: 0 16px; font-size: 12px; color: var(--muted-2); }
.as-vbar.quiet, .as-vbar.empty { box-shadow: none; }
.as-vbar.quiet .as-vt { color: var(--ink-dim); font-weight: 600; }
/* «кто-то зашёл»: янтарная кромка и подпись — 3 секунды, потом бар возвращается к обычному виду */
.as-vbar.push {
  box-shadow: inset 0 0 0 1.5px var(--signal), 0 8px 22px color-mix(in srgb, var(--signal) 16%, transparent);
}
.as-vbar.push-in { animation: as-vpush .24s cubic-bezier(.2, .7, .3, 1); }
.as-vbar.push .as-av.vb { width: 34px; height: 34px; flex-basis: 34px; border-radius: 11px; font-size: 13px; box-shadow: none; }
.as-vbar.push .as-vs { color: var(--signal-hi, var(--signal)); }
@keyframes as-vpush { from { transform: translateY(-6px); opacity: .4; } to { transform: none; opacity: 1; } }
/* вы в звонке: бар цвета акцента, тап — вернуться в комнату, справа — выйти */
.as-vbar.mine { background: var(--signal-d); box-shadow: none; padding-right: 6px; }
.as-vbar.mine .as-vico { background: var(--signal); color: #fff; }
.as-vbar.mine .as-vs { color: var(--warn-ink, var(--signal-hi, var(--muted))); }
.as-vhang {
  width: 44px; height: 44px; flex: 0 0 44px; border-radius: 14px; border: 0; cursor: pointer;
  background: var(--panel); color: var(--danger); display: grid; place-items: center;
}
@media (prefers-reduced-motion: reduce) { .as-vbar.push-in { animation: none; } }
/* В звонке внизу висит полоска «в эфире» (ave-call-m, 56px + 12 отступа) — она закрывала кнопку «Меню».
   Поднимаем «Меню» над полоской и даём списку дел столько же места снизу. */
body.ave-call-m.as-start-on .as-hub { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
body.ave-call-m.as-start-on .as-body { padding-bottom: 152px; }

/* ---------- карточка «кто где сидит»: раскрывается из бара (верх и края JS ставит по бару) ---------- */
.as-vcard {
  position: absolute; z-index: 4; top: 64px; left: 18px; right: 18px;
  max-height: calc(100% - 96px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding: 8px 0 12px; border-radius: 22px; background: var(--panel);
  font-family: var(--font-mono); color: var(--ink);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .22), 0 2px 6px rgba(0, 0, 0, .06);
  transform-origin: top center; animation: as-vdrop .2s cubic-bezier(.2, .7, .3, 1);
}
@keyframes as-vdrop { from { opacity: 0; transform: translateY(-6px) scaleY(.7); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .as-vcard { animation: none; } }
.as-vhead { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 16px; }
.as-vhead .t { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; }
.as-vhead .t b { color: var(--muted-2); font-weight: 600; }
.as-vclose {
  width: 44px; height: 44px; flex: 0 0 44px; border: 0; border-radius: 14px; cursor: pointer;
  background: var(--field); color: var(--ink-dim); display: grid; place-items: center;
}
.as-vrooms { display: flex; flex-direction: column; gap: 8px; padding: 6px 8px 0; }
.as-vroom { background: var(--bg); border-radius: 16px; padding: 10px 10px 6px 12px; }
.as-vrh { display: flex; align-items: center; gap: 10px; }
.as-vrico {
  width: 36px; height: 36px; flex: 0 0 36px; border-radius: 11px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--ch-voice) 13%, transparent); color: var(--ch-voice);
}
.as-vrn { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.as-vrn .n { font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-vrn .s { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-vjoin {
  height: 44px; flex: 0 0 auto; padding: 0 18px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--ink); color: var(--bg); font-family: inherit; font-size: 13px; font-weight: 600;
}
.as-vjoin.ghost { background: var(--panel); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line); }
.as-vjoin.here { background: var(--signal-d); color: var(--signal-hi, var(--signal)); }
.as-vppl { display: flex; flex-direction: column; margin-top: 6px; }
.as-vp { display: flex; align-items: center; gap: 10px; min-height: 44px; padding-left: 4px; }
.as-av.vp { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 10px; font-size: 12px; }
.as-vp .n { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-vp .scr {
  display: flex; align-items: center; gap: 4px; height: 22px; padding: 0 7px; border-radius: 7px; flex: 0 0 auto;
  background: var(--signal-d); color: var(--signal-hi, var(--signal)); font-size: 10.5px; font-weight: 600;
}
.as-vp .flag { color: var(--danger); line-height: 0; flex: 0 0 auto; }
.as-vp .flag svg { display: block; }
.as-vp .tm { flex: 0 0 auto; min-width: 64px; text-align: right; font-size: 11.5px; color: var(--muted-2); }
.as-vfree-l {
  padding: 16px 16px 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted-2);
}
.as-vfree { display: flex; flex-direction: column; padding: 0 8px; }
.as-vf { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 2px 0 12px; }
.as-vf .as-vrico { background: var(--field); color: var(--muted-2); }
.as-vf .n { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- календарь: ряд пилюль дней недели + плотные плитки дней ---------- */
.as-cal { flex: 0 0 auto; display: flex; flex-direction: column; margin-top: 2px; }
.as-caltop { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; }
.as-caltop .m { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.as-caltop .c { font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-2); }
.as-wk { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; margin: 0 0 4px; }
.as-wk b {
  font-size: 8.5px; font-weight: 700; letter-spacing: .1em; text-align: center; text-transform: uppercase;
  color: var(--muted); background: var(--panel); border-radius: 8px; padding: 4px 0 3px;
}
.as-wk b.t { background: var(--danger); color: var(--on-signal); }   /* сегодня — красным (владелец 10.09) */
/* плитки: квадраты, плотно; дни соседнего месяца — пустая клетка без плитки, как в референсе */
.as-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }   /* высота — от aspect-ratio плиток */
/* Плитка снова КВАДРАТНАЯ (владелец 09.09, вторая итерация: «сделай календарь обратно с квадратными
   окошками дней»). Место под это забирает не барабан, а список дел: он опущен ниже. */
.as-d {
  aspect-ratio: 1 / 1; border-radius: 9px; background: var(--panel); position: relative;
  display: flex; flex-direction: column; justify-content: space-between; padding: 5px 5px 4px;
  border: 1.5px solid transparent; font-family: inherit; text-align: left;
}
.as-d.out { background: transparent; pointer-events: none; }
.as-d.out .n, .as-d.out .as-dots { visibility: hidden; }
.as-d .n { font-size: 11px; font-weight: 600; color: var(--ink-dim); line-height: 1; }
/* Сегодня — КРАСНЫМ выделением (владелец 10.09): рамка, число и точка в углу. Красные точки просрочки
   на сегодняшней плитке не встречаются по определению (просрочка = день раньше сегодня). */
.as-d.today { border-color: var(--danger); }
.as-d.today .n { color: var(--danger); font-weight: 800; }
.as-d.today::after {
  content: ""; position: absolute; top: 5px; right: 5px; width: 5px; height: 5px; border-radius: 50%;
  background: var(--danger);
}
.as-d.pick { border-color: var(--ink); }
.as-dots { display: flex; gap: 2px; height: 5px; align-self: flex-end; }
.as-dots i { width: 5px; height: 5px; border-radius: 2px; display: block; background: var(--signal); }
.as-dots i.late { background: var(--danger); }
.as-dots i.done { background: var(--muted-2); }
/* ---------- дела дня: плашки без цветных миниатюр — точка проекта, название, проект, срок справа ---------- */
/* Дела листаются НА МЕСТЕ: зона забирает остаток высоты, календарь остаётся на экране целиком.
   Скрытая полоса прокрутки + затухание нижнего края (класс .fade вешает JS, только когда есть что
   листать) — иначе обрезанная плашка читается как баг вёрстки, а не как «ниже ещё есть». */
.as-tasks {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; align-content: start;
  flex: 1 1 0; min-height: 92px; overflow-y: auto; overflow-x: hidden;
  scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 2px;
}
.as-tasks::-webkit-scrollbar { display: none; }
.as-tasks.fade {
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 22px), transparent);
          mask-image: linear-gradient(to bottom, #000 calc(100% - 22px), transparent);
}
.as-pl {
  /* крупнее (владелец 05.10: «окно задач на день чуть маловато»): 58px вместо 44, шрифт 14.5 вместо 13 */
  min-height: 58px; border-radius: 14px; background: var(--panel); padding: 8px 14px;
  display: flex; align-items: center; gap: 12px; width: 100%;
  border: 0; font-family: inherit; text-align: left; color: var(--ink);
}
/* Кружок готовности — тот же элемент, что в дневном списке задач (.tk-daychk в tasks-ui.js):
   пустое кольцо у открытого дела, залитый --ok с галочкой у закрытого, красное кольцо у просроченного.
   ПЕРЕКЛЮЧАТЕЛЬ (решение владельца 09.09): тап по кружку закрывает дело, тап по остальной плашке
   открывает карточку. Сам кружок 18px — для пальца мало, поэтому невидимая зона нажатия расширена
   псевдоэлементом; справа она уже, чтобы не воровать тап у названия задачи. */
.as-pchk {
  position: relative; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%;
  border: 2px solid var(--muted-2); background: transparent; cursor: pointer;
  display: grid; place-items: center; font-size: 13px; line-height: 1; color: transparent;
  transition: transform .12s cubic-bezier(.2,.7,.3,1);
}
.as-pchk::before { content: ""; position: absolute; inset: -10px -5px -10px -10px; }
.as-pchk:active { transform: scale(.88); }
@media (prefers-reduced-motion: reduce) { .as-pchk { transition: none; } }
.as-pchk.late { border-color: var(--danger); }
.as-pchk.on { background: var(--ok); border-color: var(--ok); color: var(--bg); }
.as-ptx { min-width: 0; flex: 1; }
/* межстрочный явно: высоту плашки задаёт не min-height, а именно эти две строки */
.as-pname { display: block; font-size: 14.5px; line-height: 1.25; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* точка цвета проекта в мете — единственное место, где цвет проекта остался в плашке */
.as-pproj i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; margin-right: 6px; vertical-align: middle; }
.as-pl.done .as-pname { color: var(--muted); text-decoration: line-through; }
.as-pproj { display: block; font-size: 11.5px; line-height: 1.25; color: var(--muted-2); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-pmeta { flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--muted-2); }
.as-pl.late .as-pmeta { color: var(--danger); }
.as-pl.add { background: none; border: 1.5px dashed var(--line); min-height: 52px; }
.as-pl.add .as-pname { color: var(--muted); }
.as-pl.more { background: none; min-height: 30px; padding: 0 14px; justify-content: center; }
.as-pl.more .as-pname { color: var(--muted-2); font-size: 11px; }
/* ---------- низ: одна кнопка «Меню», как было ---------- */
/* крупнее и выше (просьба владельца): палец на телефоне бьёт по 48px увереннее, чем по 40, а нижние
   16px у айфона занимает домашняя полоса */
.as-hub {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 26px;
  height: 48px; padding: 0 24px; border-radius: 999px; border: 0;
  background: var(--panel); display: flex; align-items: center; gap: 11px; font-family: inherit;
}
.as-hub .bars3 { display: grid; gap: 3px; }
.as-hub .bars3 i { width: 16px; height: 1.6px; border-radius: 2px; display: block; background: var(--ink); }
.as-hub .bars3 i:nth-child(2) { width: 10px; }
.as-hub .cap {
  font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-dim);
}
.as-hub .badge { width: 5px; height: 5px; border-radius: 50%; background: var(--signal); display: block; }
.as-hub .badge.off { display: none; }
/* ---------- шторки ---------- */
/* Контейнер шторок — фиксированный слой поверх приложения (панель z 9, модалки 6000+): меню
   открывается с любого экрана, не только со старта. Сам слой не ловит касания — только дети. */
#as-host { position: fixed; inset: 0; z-index: 85; pointer-events: none; }   /* выше плавающих виджетов (офис 60, прочие до 82), ниже тостов (90) и модалок (6000+) */
#as-host > * { pointer-events: auto; }
#as-host .as-scrim, #as-host .as-sheet { font-family: var(--font-mono); color: var(--ink); }
#as-host * { box-sizing: border-box; }
/* затемнение под шторкой чуть слабее: сквозь матовое стекло экран должен угадываться */
.as-scrim { position: absolute; inset: 0; background: rgba(6, 6, 8, .42); z-index: 3; }
/* МАТОВОЕ СТЕКЛО: полупрозрачная поверхность + размытие того, что под ней (токены --glass-* AVE).
   Тонкая светлая кромка сверху отделяет стекло от затемнения — без неё край шторки теряется. */
.as-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 4;
  border-radius: 22px 22px 0 0;
  background: color-mix(in srgb, var(--panel-2) 58%, transparent);
  -webkit-backdrop-filter: var(--glass-blur-strong);
          backdrop-filter: var(--glass-blur-strong);
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 10px 18px 18px; max-height: 88%; overflow-y: auto; -webkit-overflow-scrolling: touch;
  animation: as-up .22s cubic-bezier(.2, .7, .3, 1);
  touch-action: pan-y;   /* свайп вниз ведёт шторку (см. swipeToClose), вертикальная прокрутка внутри остаётся */
}
/* если браузер не умеет backdrop-filter — не оставляем полупрозрачную кашу, красим плотно */
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .as-sheet { background: var(--panel-2); }
}
@keyframes as-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .as-sheet { animation: none; } }
.as-grab { width: 38px; height: 4px; border-radius: 3px; background: var(--line); margin: 0 auto 14px; }
.as-shhead {
  display: flex; align-items: baseline; justify-content: space-between;
  padding-bottom: 13px; border-bottom: 1px solid var(--line-2);
}
.as-shhead .t { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.as-shhead .c { font-size: 10.5px; color: var(--muted); }
.as-sheet .as-lbl { margin-top: 16px; }
.as-sheet .as-lbl:first-of-type { margin-top: 15px; }
/* Заголовок-раскрывашка: шеврон + имя + число строк + сумма бейджей; тело группы скрыто, пока не раскрыли */
.as-sheet .as-lbl.tog { padding: 2px 0; margin-top: 8px; }   /* свёрнутые заголовки стоят плотнее, чем подписи с телом */
.as-tog {
  flex: 1; display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 34px;
  border: 0; background: none; padding: 0; font: inherit; color: inherit; text-align: left; letter-spacing: inherit; text-transform: inherit;
}
.as-tog .chev {
  width: 7px; height: 7px; flex: 0 0 7px; border-right: 1.6px solid var(--muted-2); border-bottom: 1.6px solid var(--muted-2);
  transform: rotate(-45deg); transition: transform .16s cubic-bezier(.2,.7,.3,1); margin-right: 2px;
}
.as-lbl.open .as-tog .chev { transform: rotate(45deg); }
.as-tog .n { color: var(--muted-2); font-weight: 600; }
.as-tog .n::before { content: "· "; }
.as-tog .cnt.hot { margin-left: 4px; font-size: 10px; font-weight: 800; color: var(--signal); letter-spacing: 0; }
@media (prefers-reduced-motion: reduce) { .as-tog .chev { transition: none; } }
/* «+» у подписи группы — как в боковой панели; показывается только тем, кому панель его показывала */
.as-sheet .as-lbl { display: flex; align-items: center; justify-content: space-between; }
.as-sheet .as-add {
  width: 26px; height: 26px; border-radius: 8px; border: 0; background: color-mix(in srgb, var(--panel) 70%, transparent);
  color: var(--muted); font: 700 15px/1 var(--font-mono); padding: 0 0 1px; margin: -6px 0;
}
/* иконка проекта в меню: скруглённый квадрат с эмодзи/картинкой проекта, подложка цвета проекта */
.as-pico { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 7px; display: grid; place-items: center; font-size: 12px; background: color-mix(in srgb, var(--panel) 80%, transparent); }
.as-pico img { width: 16px; height: 16px; border-radius: 4px; object-fit: cover; }
.as-pico canvas { display: block; }
.as-chrow.dim .nm { color: var(--muted); font-weight: 500; }
/* ⚙ у строки проекта/канала — как в панели; ставится последним, справа, не растягивает строку */
.as-gear {
  margin-left: 8px; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 9px; border: 0;
  background: transparent; color: var(--muted-2); display: grid; place-items: center; padding: 0;
}
.as-gear svg { width: 15px; height: 15px; }
.as-gear:active { background: color-mix(in srgb, var(--panel) 80%, transparent); color: var(--ink); }
/* профиль: аватар + имя — кнопка, сброс вида кнопки */
.as-mebtn { display: flex; align-items: center; gap: 12px; border: 0; background: none; padding: 0; font-family: inherit; color: var(--ink); text-align: left; min-width: 0; }

/* профиль в меню */
.as-me { display: flex; align-items: center; gap: 11px; padding-bottom: 14px; border-bottom: 1px solid var(--line-2); }
.as-me .nm { font-size: 14px; font-weight: 700; }
.as-me .rl { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--signal); margin-top: 2px; }
.as-cog {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center;
  border: 1px solid var(--line); background: none; margin-left: 7px;
}
.as-me .as-cog:nth-last-child(2) { margin-left: auto; }   /* колокольчик + шестерёнка («не беспокоить» удалён 04.10) */
.as-cog svg { width: 16px; height: 16px; }
.as-mgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; }
.as-mt {
  border-radius: 14px; background: var(--panel); padding: 12px 10px 11px;
  display: flex; flex-direction: column; gap: 9px; position: relative;
  border: 0; text-align: left; font-family: inherit;
}
.as-mt svg { width: 19px; height: 19px; }
.as-mt .lb { font-size: 10px; font-weight: 600; letter-spacing: .04em; color: var(--ink-dim); }
.as-mt .cnt { position: absolute; top: 9px; right: 10px; font-size: 9px; font-weight: 800; color: var(--signal); }
/* Каналы в меню — две ПЛАШКИ-группы («Текстовые», «Голосовые»), не один плоский список: владелец 10.09
   «перепутаны и не разделены». Слева — dot-глиф своего типа, у голосовых справа — кто сидит. */
.as-chgroup {
  margin-top: 8px; padding: 2px 12px; border-radius: 14px;
  background: color-mix(in srgb, var(--panel) 62%, transparent);
}
.as-chrow {
  display: flex; align-items: center; gap: 10px; padding: 10px 0; width: 100%; min-height: 44px;
  border: 0; border-bottom: 1px solid var(--line-2); background: none;
  font-family: inherit; text-align: left; color: var(--ink);
}
.as-chrow:last-child { border-bottom: 0; }
.as-chrow .nm { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 600; color: var(--ink-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* имя тянется — бейдж и ⚙ прижаты к правому краю одной линией */
.as-chgroup.text .as-chrow .nm::before { content: "# "; color: var(--ch-text); font-weight: 700; }
.as-chrow .rt { margin-left: auto; display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.as-chrow .cnt { margin-left: auto; font-size: 10px; color: var(--muted-2); }
.as-chrow .cnt.hot { color: var(--signal); font-weight: 700; }
.as-chrow .as-wico { flex: 0 0 auto; }
.as-dotv { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--ch-voice); display: block; }
.as-dotv.off { background: var(--muted-2); }
.as-dott { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 2px; background: var(--ch-text); display: block; }

/* строки дел в шторке дня */
.as-ico { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; display: grid; place-items: center; }
.as-ico svg { width: 14px; height: 14px; display: block; }
.as-pill {
  display: flex; align-items: center; gap: 12px; padding: 11px 14px 11px 11px;
  border-radius: 14px; background: var(--panel); margin-top: 8px; width: 100%;
  border: 0; font-family: inherit; text-align: left;
}
.as-pill .tx { min-width: 0; flex: 1; display: block; }
.as-pill .tt {
  display: block; font-size: 12.5px; font-weight: 600; color: var(--ink); line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.as-pill .mm { display: block; font-size: 10.5px; color: var(--muted); margin-top: 2px; }
.as-pill .rt { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; white-space: nowrap; color: var(--muted-2); }
.as-pill .rt.late { color: var(--danger); }
.as-pill .rt.sig { color: var(--signal); }
.as-pill.done { opacity: .62; }
.as-pill.done .tt { text-decoration: line-through; color: var(--muted); }
.as-addrow {
  display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%;
  margin-top: 9px; height: 46px; border-radius: 14px; background: none; font-family: inherit;
  border: 1px dashed var(--line); color: var(--muted); font-size: 11.5px; font-weight: 600;
}
.as-mk {
  margin-top: 14px; height: 46px; width: 100%; border-radius: 999px; border: 0; font-family: inherit;
  background: var(--signal); color: var(--on-signal);
  display: flex; align-items: center; justify-content: center; gap: 9px;
  font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
.as-mk[disabled] { opacity: .45; }

/* форма создания */
.as-fld { margin-top: 15px; }
.as-fld .k {
  font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted-2); margin-bottom: 8px;
}
.as-input {
  width: 100%; background: var(--field); border: 1px solid var(--line);
  border-radius: 12px; padding: 12px 14px; font-size: 16px; color: var(--ink);   /* 16px: меньше — iOS Safari зумит страницу при фокусе (владелец 10.09) */
  font-family: inherit; -webkit-appearance: none;
}
.as-input::placeholder { color: var(--muted-2); }
.as-input:focus { outline: 0; border-color: var(--signal); }
.as-chips { display: flex; gap: 7px; flex-wrap: wrap; }
/* ряд исполнителей: в одну строку, листается вбок (на бою десятки людей), правый край затухает */
.as-chips.row {
  flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  margin: 0 -18px; padding: 0 18px 2px;
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
          mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
}
.as-chips.row::-webkit-scrollbar { display: none; }
.as-chips.row .as-who { flex: 0 0 auto; }
.as-ch {
  font-size: 10.5px; font-weight: 600; padding: 8px 12px; border-radius: 999px;
  border: 1px solid var(--line); color: var(--muted);
  background: none; font-family: inherit; white-space: nowrap;
}
.as-ch.on { background: var(--signal); border-color: var(--signal); color: var(--on-signal); font-weight: 700; }
.as-who {
  display: flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px;
  border: 1px solid var(--line); background: none; font-family: inherit;
}
.as-who .nm { font-size: 11px; color: var(--muted); }
.as-who.on { border-color: var(--signal); background: color-mix(in srgb, var(--signal) 14%, transparent); }
.as-who.on .nm { color: var(--ink); }
.as-err { margin-top: 10px; font-size: 11px; color: var(--danger); }

/* корень проектов (владелец 13.09: плитка «Проекты» → список проектов, а не первый проект) */
.as-sheet.as-projects .as-lbl { margin-top: 6px; }
.as-sheet .as-empty { padding: 14px 4px; font-size: 13px; color: var(--muted-2); }