/* style-11-toasts-review.css — часть бывшего style.css (распил 22.10.2026): тосты, сводки аудита, сдачи по таску.
   Файлы style-NN-*.css — ОДИН каскад: index.html подключает их подряд и по номерам, порядок значим
   (правило ниже по каскаду перебивает равное выше). Стережёт tools/check.js. */
/* Тост сетевого/серверного провала (blox48 #9, core.js apiToast). Полоска у нижнего края,
   поверх всего (z-index выше любого слоя — сообщение о провале обязано пробить и модалку);
   тап закрывает (правило «всегда есть выход»), сама гаснет через 6 с. Тёмная заливка под
   белым текстом — роль --alert-strong (§11 lingo-ui). */
/* redesign 27.10 — ПОЛОСКА СТАЛА ПЛАШКОЙ. На ПК она тянулась во всю ширину монитора (1280px строки
   ради «Работа отправлена учителю») и читалась аварийной лентой. Теперь ширина — по чтению (до
   560px), по центру; на телефоне — как была, во всю ширину минус поля. Скругление на ступень
   выше (--r-md): это предмет поверх экрана, а не строка в нём. Низ учитывает полоску «домой»
   айфона (safe-area), как и прочие прибитые к низу вещи.
   ДВИЖЕНИЕ — спокойное: всплывает на --enter-shift и проявляется (--dur-panel, --ease-enter),
   уходит короче и вниз (--dur-panel-out, --ease-exit). Узел один и прячется атрибутом hidden
   (core.js toast) — поэтому уход возможен: display едет дискретно (allow-discrete) и держит
   плашку видимой, пока она гаснет. JS читает только сам атрибут, и он меняется сразу. */
.net-toast{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:70;
  max-width:560px;margin-inline:auto;box-sizing:border-box;
  background:var(--alert-strong);color:#fff;padding:12px 16px;border-radius:var(--r-md);
  font-size:var(--fs-md);line-height:1.35;box-shadow:0 6px 20px rgba(var(--sh-rgb),.28);cursor:pointer;
  overflow-wrap:anywhere;
  opacity:1;translate:none;
  transition:opacity var(--dur-panel) var(--ease-enter),translate var(--dur-panel) var(--ease-enter),
    background-color var(--dur-state) var(--ease-standard),display var(--dur-panel);
  transition-behavior:allow-discrete}
@starting-style{.net-toast{opacity:0;translate:0 var(--enter-shift)}}
.net-toast[hidden]{display:none;opacity:0;translate:0 var(--enter-shift);pointer-events:none;
  transition-duration:var(--dur-panel-out);transition-timing-function:var(--ease-exit)}
/* зелёный собрат (blox52 #9): «получилось». Тот же узел, тот же выход по тапу — меняется
   только заливка. --ok-solid, а не --ok: он и заведён как СПЛОШНАЯ зелёная под белым текстом
   и одинаков во всех четырёх схемах, ровно как --alert-strong у красного. */
.net-toast.ok{background:var(--ok-solid)}
/* нейтральный собрат (blox52 #18): «прими к сведению» — совет, не провал и не победа.
   Якорь схемы (--anchor) — та же сплошная тёмная заливка под белым текстом, что у двух
   других, но своего цвета: красный по §11 обязан значить настоящую тревогу, и подсказка
   «видео удобнее скачать с компьютера» в красном читалась бы как поломка. */
.net-toast.info{background:var(--anchor)}

/* Карточка «сессия закончилась» (core.js sessionGone). Не тост: тост гаснет, а этот тупик —
   навсегда, до входа заново. Поэтому подложка на весь экран (кликать под ней нечего: сервер
   ответит 401 на что угодно) и z-index выше всех рабочих слоёв — модалок (60), шторок (95/99)
   и самого тоста (70). Инспектор кода (2147483000+) намеренно остаётся выше: он про починку
   платформы, а не про работу в ней. */
.slost{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  padding:16px;background:var(--scrim);
  /* появление — общий механизм окон (style-08: --ov-in, ov-in): затемнение проявляется, карточка
     проявляется (как лист шторки, style-08). Без ухода: тупик снимается только перезагрузкой. */
  --ov-in:0;animation:ov-in var(--dur-panel) var(--ease-enter) backwards}
@media (prefers-reduced-motion:reduce){.slost{--motion-reduced:ov-in var(--dur-panel) linear backwards}}
.slost-card{background:var(--card);border-radius:var(--r-xl);
  box-shadow:var(--sheet-4);padding:22px 20px;max-width:420px;width:100%;text-align:center;
  opacity:calc(1 - var(--ov-in))}
.slost-card h2{margin:0 0 8px;font-size:var(--fs-lg);color:var(--ink-strong)}
.slost-card p{margin:0 0 18px;font-size:var(--fs-md);line-height:1.45;color:var(--muted)}

/* ── blox68 #1 — «Почта родителя» (public/parent-emails.js) и «Мои дети» (public/family.js) ── */
.pmail{margin:4px 0 0}
.pmail-h{font-weight:600;margin-bottom:2px}
.pmail-sub{color:var(--muted);font-size:var(--fs-sm);margin-bottom:8px}
.pmail-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0;border-bottom:1px solid var(--line-soft)}
.pmail-mail{font-weight:500;overflow-wrap:anywhere;min-width:0}
.pmail-who{color:var(--muted);font-size:var(--fs-sm);flex:1 1 auto}
.pmail-del{margin-left:auto}
.pmail-none{color:var(--muted);font-size:var(--fs-sm);padding:4px 0}
.pmail-add{display:flex;gap:8px;margin-top:10px}
.pmail-in{flex:1 1 auto;min-width:0;font-size:var(--fs-input)}
.fam-kid{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:14px 16px;margin:0 0 10px;
  background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-md);cursor:pointer;
  font:inherit;color:var(--ink);min-height:44px}
.fam-kid:hover{border-color:var(--primary)}
.fam-nick{font-weight:600;font-size:var(--fs-lg)}
.fam-grp{color:var(--muted);font-size:var(--fs-sm);margin-left:auto}

/* ── blox70 #2 — «СДАЧИ ПО ТАСКУ» (public/task-review.js) ─────────────────────────────────────
   Один таск глазами всей группы: шапка (сам таск + счётчики + «Принять всё» · Notes), окно заметок
   по группе, ниже — корзины учеников (на проверку · не сдали · возвращено · принято), в каждой
   карточки общего рисовальщика review-card.js (.srcard). На ПК экран стоит ВНУТРИ панели листа
   (.opane.tview), на телефоне — отдельным экраном (.tk-screen). */
.tk-view{display:flex;flex-direction:column;gap:12px;min-width:0}
.tk-head{display:flex;flex-direction:column;gap:6px;min-width:0}
.tk-head .tk-back{align-self:flex-start;width:auto;margin:0}
.tk-kicker{font-size:var(--fs-xs);font-weight:700;color:var(--muted)}
.tk-title{margin:0;font-size:var(--fs-xl);line-height:1.25;overflow-wrap:anywhere;white-space:pre-line;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
/* аудит blox70 #2 (#19): длинный текст задания — не больше трёх строк, тап раскрывает целиком */
.tk-title.open{display:block;-webkit-line-clamp:unset;overflow:visible}
.tk-title a{color:var(--accent-dark);overflow-wrap:anywhere}
/* ссылка задания — своей строкой и нажимается, как на плашке монитора (.oent-url) */
.tk-url{display:block;color:var(--accent-dark);font-weight:700;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;min-width:0}
/* предложение аудита №7 — «🤔 ждём: N» в сводке: факт без срочности, приглушённым */
.tk-sum .tk-waitn{color:var(--muted);font-weight:700}
.tk-sum .tk-ticked{color:var(--ok-ink);font-weight:700}   /* «отметили «сделал»» у книги без глав (blox78 #13) */
/* blox80 #3 — многофайловое задание: файлы в шапке по номерам (= номера клеток в карточке ученика) */
.tk-files{margin:6px 0 0;padding-left:22px;font-size:var(--fs-sm);font-weight:600;color:var(--muted)}
.tk-files li{padding-left:2px;margin:2px 0}
.tk-files li::marker{font-weight:800;font-variant-numeric:tabular-nums}
.tk-files svg{width:13px;height:13px;vertical-align:-2px}
.tk-files span{overflow-wrap:anywhere}
.tk-fhint{font-size:var(--fs-xs);font-weight:600;color:var(--muted)}
.tk-head .srsub{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:var(--fs-xs);
  font-weight:700;color:var(--muted)}
.tk-head .tk-sum{margin:4px 0 0}
.tk-bar{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.tk-bar>.btn,.tk-bar>.btn-ghost{width:auto;margin:0}
/* окно заметок: своя прокрутка и потолок высоты — длинный журнал не отталкивает список учеников
   вниз за экран (lingo-ui #3, «растущий ребёнок ограничен») */
.tk-notes{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sheet-1);padding:10px 14px}
.tk-notes[hidden]{display:none}
.tk-notes-h{font-weight:800;font-size:var(--fs-sm);color:var(--ink);display:flex;align-items:center;gap:6px;
  margin-bottom:6px}
.tk-notes-body{min-width:0}
/* аудит #11: потолок стоял на ВСЁМ окне (320px) и срезал кнопку «Добавить запись» — выглядело
   поломкой. Теперь форма журнала видна целиком, а прокручивается только лента записей. */
.tk-notes .djournal{max-height:220px;overflow-y:auto;overscroll-behavior:contain}
/* аудит #9: пока левая панель монитора — то же досье группы (режим Notes), второе окно заметок и
   его кнопка на экране таска не показываются */
.tk-nonotes .tk-notes,.tk-nonotes .tk-notes-btn{display:none}
.tk-list{display:flex;flex-direction:column;gap:16px}
.tk-sec{display:flex;flex-direction:column;gap:10px}
.tk-sec-h{font-weight:800;font-size:var(--fs-md);color:var(--ink);display:flex;align-items:center;gap:8px}
.tk-sec-h .tk-n{font-size:var(--fs-xs);font-weight:800;color:var(--muted);background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-lg);padding:1px 8px}
/* очередь работы учителя — той же краской, что «Check N» (якорь схемы), без тревоги */
.tk-sec.tk-pend>.tk-sec-h .tk-n{background:var(--anchor);color:var(--on-dark);border-color:var(--anchor)}
.srcard.tk-card .tk-name{font-size:var(--fs-lg)}
/* blox73 #10 — монитор книги: таблица «ученики × главы» и под ней окно проверки одной главы.
   Таблица шире телефона, когда глав больше ~12: листается вбок ВНУТРИ себя, столбец ников стоит. */
.tkb{display:flex;flex-direction:column;gap:12px;min-width:0}
.tkb-grid{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sheet-1);padding:8px 0;
  overflow-x:auto;overscroll-behavior-x:contain;max-width:100%}   /* шириной с карточку ученика, главы листаются внутри */
.tkb-t{width:auto;border-collapse:separate;border-spacing:0;font-size:var(--fs-xs);font-variant-numeric:tabular-nums}
.tkb-t th,.tkb-t td{padding:2px;text-align:center}
.tkb-t thead th{color:var(--muted);font-weight:700}
.tkb-t .tkb-nm{position:sticky;left:0;z-index:1;background:var(--card);text-align:left;padding:2px 6px 2px 10px}
.tkb-who{all:unset;box-sizing:border-box;cursor:pointer;min-height:24px;max-width:9em;display:block;
  font-size:var(--fs-sm);font-weight:700;color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tkb-who:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* выбранный ученик — две тонкие линии основного цвета схемы (--accent) над и под его строкой: от первой буквы ника (отступ ячейки ника
   10px) до начала правого скругления последнего квадратика (поле ячейки 2px + радиус --r-2xs). Рисуются
   фоном ячеек, а не рамкой: рамка добавила бы строке высоты, и таблица прыгала бы от выбора. */
.tkb-t tbody tr.cur>*{--ln:linear-gradient(var(--accent),var(--accent));
  background:var(--ln) 0 0/100% 1px no-repeat,var(--ln) 0 100%/100% 1px no-repeat}
.tkb-t tbody tr.cur>.tkb-nm{background:var(--ln) 10px 0/calc(100% - 10px) 1px no-repeat,
  var(--ln) 10px 100%/calc(100% - 10px) 1px no-repeat,var(--card)}
.tkb-t tbody tr.cur>td:last-child{background-size:calc(100% - 2px - var(--r-2xs)) 1px}
.tkb-t tr.cur .tkb-who{color:var(--ink);text-decoration:none}
.tkb-t .tkb-sum{display:block;font-size:var(--fs-xs);font-weight:800;color:var(--muted);line-height:1.1;padding-bottom:3px}
/* квадратик главы — тот же цвет, что чип статуса в карточке: принята / на проверке / на доработке */
.tkb-dot{all:unset;box-sizing:border-box;display:inline-block;width:22px;height:22px;border-radius:var(--r-2xs);vertical-align:middle;
  border:1px solid var(--line);background:var(--surface)}
button.tkb-dot{cursor:pointer}
button.tkb-dot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tkb-dot.a{background:var(--ok);border-color:var(--ok)}
.tkb-dot.p{background:var(--anchor);border-color:var(--anchor)}
.tkb-dot.r{background:var(--draft);border-color:var(--draft)}
.tkb-dot.o{background:var(--surface);border:2px dashed var(--draft-line)}
.tkb-dot.cur{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--ink)}
.tkb-legend{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:var(--fs-xs);color:var(--muted);padding:0 4px}
.tkb-legend span{display:inline-flex;align-items:center;gap:5px}
.tkb-legend .tkb-dot{width:14px;height:14px;border-radius:var(--r-2xs)}
.tkb-hint{font-size:var(--fs-sm);color:var(--muted);background:var(--surface);border-radius:var(--r-sm);padding:12px 14px;
  display:flex;align-items:center;gap:8px}
/* окно перешло к ДРУГОМУ ученику — ник коротко вспыхивает, чтобы «Approve» не нажали не тому */
@keyframes tkb-flash{0%{background:transparent}20%,45%{background:var(--alert-tint);box-shadow:0 0 0 4px var(--alert-tint)}100%{background:transparent}}
.srcard .tk-name.tkb-flash,.srcard .srch.tkb-flash{border-radius:var(--r-xs);animation:tkb-flash 1800ms var(--ease) both}
@media (prefers-reduced-motion:reduce){.srcard .tk-name.tkb-flash,.srcard .srch.tkb-flash{animation:none;background:var(--alert-tint)}}
/* ряд «🤔 жду»: кнопка того же вида, что реакции на сдачу, и подпись, что это увидит ребёнок */
.tk-wait{margin-top:8px}
.tk-wait-lbl{font-size:var(--fs-xs);font-weight:700;color:var(--muted)}
.opane.tview .otaskhost{padding:4px 2px 8px;min-width:0}
.tk-screen{padding-bottom:24px}
/* blox70 #3 — стрелки по плашкам листа: выход слева, «‹ N из M ›» справа, в одну строку */
.tk-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.tk-top .tk-back{width:auto;margin:0}
.tk-nav{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.tk-nav .btn-ghost{width:44px;height:44px;margin:0;padding:0;font-size:var(--fs-xl)}   /* палец (WCAG 2.5.5) */
.tk-pos{font-size:var(--fs-sm);font-weight:700;color:var(--muted);min-width:4.6em;text-align:center;white-space:nowrap}
/* blox70 #3 — «Слушать подряд»: оболочка — медиа-оверлей сдачи (.mediaov .mediabox, 92vh с прокруткой
   внутри), здесь только своё: имя крупно, плеер во всю ширину, ряд решений переносится целиком */
.mediaov .lq-box{max-width:min(560px,94vw)}   /* сильнее .mediaov .mediabox (900px): одна колонка плеера, без пустого поля справа */
.lq-h{display:flex;align-items:center;gap:6px;min-width:0}
.lq-pos{color:var(--muted);font-weight:700}
.lq-task{font-size:var(--fs-xs);font-weight:700;color:var(--muted);margin:-6px 0 8px;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.lq-body{display:flex;flex-direction:column;gap:10px;min-width:0}
.lq-name{font-size:var(--fs-xl);font-weight:800;color:var(--ink);overflow-wrap:anywhere}
.lq-player{width:100%;min-width:0}
.lq-act{display:flex;flex-wrap:wrap;gap:8px}
.lq-act>.btn,.lq-act>.btn-ghost{width:auto;margin:0}
.lq-cwrap{display:flex;flex-direction:column;gap:6px;margin:0}
.lq-cwrap[hidden]{display:none}
.lq-cwrap>.btn-ghost{width:auto;align-self:flex-start;margin:0}
.lq-line{font-size:var(--fs-md);color:var(--ink)}
.lq-n{font-weight:700}
.lq-sum{display:flex;flex-direction:column;gap:10px}

/* ── redesign 27.10 (агент 5) — ВИД И ДВИЖЕНИЕ «сдач по таску» и карточки проверки ─────────────────
   ОДНА ГРОМКАЯ ВЕЩЬ на экране — работа «на проверку»: только её карточки лежат листом с тенью и
   зовут плашкой Check. Возвращённая (ждёт ребёнка), несданная и сданная до правки лежат ВРОВЕНЬ —
   один обрезной край, как принятая (.srcard.acc) и как соседний лист монитора (агент 4). Громче
   не делаем ничего — тише делаем остальное. data-state ставит review-card.js, поэтому то же самое
   и в личке (близнец): возвращённый таск там тоже отступает. */
.srcard[data-state="returned"],.srcard[data-state="none"],.srcard[data-state="stale"]{box-shadow:var(--sheet-edge)}
/* возвращённая работа ждёт ребёнка: плашка сдачи — тихая база, как у принятой (кружок ▶ остаётся) */
.srcard[data-state="returned"] .fileent--check,.srcard[data-state="stale"] .fileent--check{
  background:var(--surface);border-color:var(--line)}
/* корзины: заголовок очереди учителя («На проверку») — чернилами, прочие — приглушённо; между
   корзинами шаг крупнее, чем между карточками внутри, — корзина читается группой */
.tk-list{gap:var(--sp-6)}
.tk-sec:not(.tk-pend)>.tk-sec-h{font-weight:700;color:var(--muted)}

/* ПОЛЯ «Approve» / «Decline» (.awrap/.cwrap в карточке, .lq-awrap/.lq-cwrap в «Слушать подряд»)
   открываются и закрываются плавно. Открыто/закрыто решает JS (display у карточки, hidden у
   очереди) — и решает СРАЗУ; CSS только проводит: вход с @starting-style (проявление + полшага
   сверху), уход — короче, с allow-discrete на display, чтобы поле успело погаснуть. Где браузер
   умеет переход к height:auto (interpolate-size), поле ещё и складывается/раскрывается по высоте —
   карточки ниже не прыгают на всю высоту поля разом; где не умеет (Safari) — только проявление. */
.lq-awrap[hidden]{display:none}   /* .field{display:flex} перебивал hidden — поле похвалы в очереди стояло открытым */
.srcard .field.awrap,.srcard .field.cwrap,.lq-awrap,.lq-cwrap{opacity:1;translate:none;
  transition:opacity var(--dur-panel) var(--ease-enter),translate var(--dur-panel) var(--ease-enter),
    display var(--dur-panel) allow-discrete;
  transition-behavior:allow-discrete}
@starting-style{.srcard .field.awrap,.srcard .field.cwrap,.lq-awrap,.lq-cwrap{opacity:0;translate:0 calc(var(--enter-shift) * -.5)}}
.srcard .field.awrap:not(.fld-open),.srcard .field.cwrap:not(.fld-open),.lq-awrap[hidden],.lq-cwrap[hidden]{
  opacity:0;translate:0 calc(var(--enter-shift) * -.5);
  transition-duration:var(--dur-panel-out);transition-timing-function:var(--ease-exit)}
@supports (interpolate-size:allow-keywords){
  .srcard .field.awrap,.srcard .field.cwrap,.lq-awrap,.lq-cwrap{interpolate-size:allow-keywords;
    height:auto;overflow:clip;overflow-clip-margin:6px;
    transition:opacity var(--dur-panel) var(--ease-enter),translate var(--dur-panel) var(--ease-enter),
      height var(--dur-panel) var(--ease-enter),display var(--dur-panel) allow-discrete}
  @starting-style{.srcard .field.awrap,.srcard .field.cwrap,.lq-awrap,.lq-cwrap{height:0}}
  .srcard .field.awrap:not(.fld-open),.srcard .field.cwrap:not(.fld-open),.lq-awrap[hidden],.lq-cwrap[hidden]{height:0}
}

/* РЯД ЗНАКОВ (👍⭐🔥👏🤔 и «🤔 жду» — кнопки .subreact-b есть только у учителя): нажатие сухое и
   короткое, отпускание — пружиной (грамматика агента 3), заливка поставленного проявляется. «Пшик»
   (pop из salute.js) у кнопки учителя — спокойный: на 8% больше и назад за --dur-panel, без
   отскока ниже единицы. Знак у ребёнка (.subreact-ro.pop) свой, его не трогаем. */
.subreact-b{transition:background-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),
  box-shadow var(--dur-state) var(--ease-standard),opacity var(--dur-state) var(--ease-standard),
  transform var(--dur-release) var(--ease-spring)}
.subreact-b:active{transform:scale(var(--press-scale-sm));transition-duration:var(--dur-press-in);
  transition-timing-function:var(--ease-standard)}
.subreact-b:focus-visible{outline:none;box-shadow:var(--ring)}
@keyframes subreact-ack{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}
.subreact-b.pop{animation:subreact-ack var(--dur-panel) var(--ease-standard)}
@media (prefers-reduced-motion:reduce){
  .subreact-b:active{transform:none}
  .subreact-b.pop{animation:none}
  /* под reduce — только проявление: ни сдвига, ни раскрытия по высоте (это тоже движение соседей) */
  .srcard .field.awrap,.srcard .field.cwrap,.lq-awrap,.lq-cwrap{translate:none;
    transition-property:opacity,display}
}

/* ── blox78 #13 · диаграмма минут книги без глав (public/listen-chart.js) ─────────────────────────
   Одна величина — минуты; тёмная часть столбика «в этом задании», светлая «в других заданиях» (тот же
   синий, шаг светлее), пунктир — длина книги. Сетка строки: имя 70 · столбик · цифра 56 (+ два зазора
   по 8), поэтому пунктир стоит на 78px + доля ширины столбика. */
.lc{--lc-here:#2f8fd0;--lc-prev:#a9d3ef;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-md);
  padding:14px 16px;display:flex;flex-direction:column;gap:8px;margin:8px 0}
.lc-h{font-weight:700}
.lc-sub{color:var(--muted);font-size:var(--fs-sm)}
.lc-leg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:var(--fs-sm);color:var(--muted)}
.lc-leg span{display:inline-flex;align-items:center;gap:6px}
.lc-sw{width:12px;height:12px;border-radius:var(--r-2xs)}
.lc-plot{--lc-line:0;position:relative;display:flex;flex-direction:column;gap:6px;padding-top:18px}
.lc-line{position:absolute;top:0;bottom:0;left:calc(78px + (100% - 142px) * var(--lc-line));border-left:1px dashed var(--muted)}
.lc-line-lbl{position:absolute;top:0;left:calc(78px + (100% - 142px) * var(--lc-line) - 40px);width:80px;text-align:center;
  font-size:var(--fs-xs);color:var(--muted)}
.lc-row{display:grid;grid-template-columns:70px minmax(0,1fr) 56px;column-gap:8px;align-items:center;min-height:28px}
.lc-name{font-weight:600;font-size:var(--fs-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lc-track{display:flex;align-items:center;height:16px;position:relative}
.lc-track i{display:block;height:16px}
.lc-here{background:var(--lc-here)}
.lc-prev{background:var(--lc-prev)}
.lc-end{border-radius:0 var(--r-2xs) var(--r-2xs) 0}
.lc-gap{margin-left:2px}
.lc-cut{width:10px;margin-left:-10px;background:repeating-linear-gradient(115deg,var(--card) 0 3px,var(--lc-here) 3px 6px)}
.lc-cut-prev{background:repeating-linear-gradient(115deg,var(--card) 0 3px,var(--lc-prev) 3px 6px)}
.lc-val{font-size:var(--fs-sm);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.lc-zero{color:var(--muted);font-weight:500}
.lc-ticks{display:flex;justify-content:space-between;padding:0 64px 0 78px;font-size:var(--fs-xs);color:var(--muted);font-variant-numeric:tabular-nums}

/* ═══ ПЕРЕРИСОВКА B (агент 2) ═══════════════════════════════════════════════════════════════
   ТОСТ — форма B: радиус карточки 16, тень легче (полоска над содержимым, а не парящий лист);
   цвета и смысл прежние (--alert-strong / .ok). */
.net-toast{border-radius:var(--r-card);box-shadow:0 4px 12px rgba(var(--sh-rgb),.18)}
/* «СДАЧИ ПО ТАСКУ» НА ПОЛОСЕ ГРУППЫ (телефон, .tk-screen). Верх экрана — .tk-band.gband
   (task-review.js): стрелки, группа, заголовок, сводка — белым по цвету группы. Кнопки
   (Approve all · Слушать подряд · Notes) стоят ниже, уже на столе. Раскладку и витринный
   шрифт заголовка и счёта доводит экран (агент 4); здесь — только то, без чего на полосе не
   читается: цвет текста и сводка без белой карточки. */
.tk-band{display:flex;flex-direction:column;gap:6px;min-width:0}
.tk-band.gband{padding-bottom:var(--sp-4)}
.gband :is(.tk-kicker,.tk-url,.tk-title,.tk-title a,.srsub,.srsub .otype,.ofile,.tk-fhint,.tk-waitn,.tk-ticked){color:var(--on-group)}
.gband .tk-sum{background:transparent;border:0;box-shadow:none;padding:0;color:var(--on-group)}
.gband .tk-sum .pend,.gband .tk-sum .pend.ret{color:var(--on-group);background:var(--on-group-fill);
  border-radius:var(--r-badge);padding:1px 6px}
.gband .tk-nav .tk-pos{color:var(--on-group)}
/* счётчик корзины «На проверку» — «ждёт учителя» = цвет группы (как «Check N» на ростере) */
.tk-sec.tk-pend>.tk-sec-h .tk-n{background:var(--group);color:var(--on-group);border-color:var(--group)}
.tk-sec-h .tk-n{border-radius:var(--r-badge)}

/* ═══ ПЕРЕРИСОВКА B — «СДАЧИ ПО ТАСКУ», КАРТОЧКА СДАЧИ, ЛИЧКА (агент 4, эскиз ReviewB) ═══════════
   Полоса: «группа · ДЗ к …» в одном ряду со стрелками, тип таска над заголовком, заголовок и число
   «сдали» — витринным шрифтом. Под полосой — ряд-счётчик корзин (НЕ вкладки: тап ведёт к корзине,
   все корзины на экране), ряд действий, белые карточки без тени. */
.tk-top .tk-kicker{flex:1 1 auto;min-width:0}
.tk-band .srsub{order:-1}                        /* тип таска — над заголовком (эскиз) */
.tk-band .tk-top{order:-2}
.tk-band>.tk-kicker{order:-1}                    /* ПК: «группа · ДЗ к …» под «‹ Лист ДЗ», над типом */
.tk-kicker{font-size:var(--fs-ctl);font-weight:500}
.tk-band.gband .tk-kicker{opacity:.92}
.tk-title{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-heading);line-height:1.3}
.tk-band .srsub{font-size:var(--fs-xs);font-weight:500}
.tk-cnt{display:inline-flex;align-items:baseline;gap:8px;font-size:var(--fs-md);font-weight:500;flex-wrap:wrap}
.tk-big{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-counter);line-height:1}
.tk-sum .sline{gap:8px 10px}
.gband .tk-sum{padding-top:4px}
/* ПК (в панели листа, без полосы): та же раскладка, чернилами по столу; сводка — без своей карточки */
.tk-inpane .tk-sum{background:transparent;box-shadow:none;border:0;padding:4px 0 0}
.tk-inpane .tk-big{color:var(--ink)}

/* ряд-счётчик: серая дорожка, сегмент = число + имя корзины. «На проверку» — цвет группы (ждёт
   учителя, как «Check N»), прочие — приглушённым. Пустая корзина: «0», не жмётся. */
.tk-segs{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;padding:4px;
  background:var(--btn-2-bg);border-radius:var(--r-btn)}
.tk-seg{all:unset;box-sizing:border-box;min-height:56px;border-radius:var(--r-xs);display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0 2px;text-align:center;
  color:var(--muted);cursor:pointer;
  transition:background-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard)}
.tk-seg-n{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-lg);line-height:1}
.tk-seg-l{font-size:var(--fs-2xs);font-weight:500;line-height:1.2;overflow-wrap:anywhere}
.tk-seg-pend:not(.zero){background:var(--group);color:var(--on-group)}
.tk-seg.zero{cursor:default;opacity:.6}
@media (hover:hover){.tk-seg:not(.zero):not(.tk-seg-pend):hover{background:var(--btn-2-bg-hover);color:var(--ink)}}
.tk-seg:focus-visible{outline:none;box-shadow:var(--ring)}
.tk-seg:not(.zero):active{transform:scale(var(--press-scale-sm))}
@media (prefers-reduced-motion:reduce){.tk-seg:not(.zero):active{transform:none}}

/* ряд действий: Approve all · Слушать подряд — поровну, Notes — по себе; переход к следующему
   таску (когда проверять нечего) — своей строкой */
.tk-bar{flex-wrap:wrap;gap:8px}
.tk-bar>#tk-acc-all{order:-2}
.tk-bar>.tk-listen{order:-1}
.tk-bar>:is(#tk-acc-all,.tk-listen,.tk-notes-btn){flex:1 1 auto;min-height:44px;white-space:nowrap}
.tk-bar>.tk-gonext{flex:1 1 100%;min-height:44px}
.tk-head{gap:12px}

/* корзины: заголовок остаётся (к нему ведёт сегмент) */
.tk-list{gap:var(--sp-5)}
.tk-sec{gap:12px;scroll-margin-top:calc(var(--hdr-h, 0px) + 8px)}

/* ── КАРТОЧКА СДАЧИ (review-card.js — одна на экран таска и личку) ───────────────────────────────
   Белая, без тени и без рельса (у обоих экранов все карточки — один тип таска: рельс не различал
   ничего), радиус карточки, поля 14, шаг 12. Принятая — по-прежнему зелёный тинт. */
.srcard{border-radius:var(--r-card);padding:14px;box-shadow:none;display:flex;flex-direction:column;gap:12px}
.srcard::before{display:none}
.srcard.acc,.srcard[data-state="returned"],.srcard[data-state="none"],.srcard[data-state="stale"]{box-shadow:none}
.srcard>*{margin-top:0;margin-bottom:0}
.srcard .srattach,.srcard .srbook,.srcard .srhist,.srcard .sractions,.srcard .tk-wait{margin:0}
.srcard .srstatus{margin-top:0}
.srcard .srtitle{padding-right:0}
.srcard:has(> .bdg) .srtitle{padding-right:28px}
/* «кто»: кружок 40 · имя 700 16 · под ним плашки фактов */
.tk-who{display:flex;align-items:center;gap:10px;min-width:0}
.tk-who-t{display:flex;flex-direction:column;gap:3px;flex:1 1 auto;min-width:0}
.srcard.tk-card .tk-name{font-size:var(--fs-md);font-weight:700;line-height:1.3}
.tk-who .srstatus{gap:4px}
/* плашки фактов — форма бейджа B */
.srcard .srind{padding:2px 6px;font-weight:600;line-height:1.3}
.srcard .srind.ls{background:var(--surface);color:var(--muted);font-weight:500}
/* плашка Check = плеер карточки: колодец --surface, без рамки, ▶ — кружок цвета группы 44 */
.srcard .fileent--check,.srcard .srch .fileent--check{background:var(--surface);border-color:transparent;box-shadow:none;
  border-radius:var(--r-btn);padding:8px 10px;min-height:calc(44px + 16px)}
.srcard .fileent--check .fileent-nm{color:var(--group-ink)}
.srcard .fileent--check .fileent-view,.srcard .fileent--check .pp-play{width:44px;height:44px;background:var(--group);
  color:var(--on-group);box-shadow:none}
.srcard .fileent--check.fileent--playing{padding:8px 10px}
.srcard .fileent--check .pp-skip,.srcard .fileent--check .pp-rate{border-color:transparent;background:var(--card);color:var(--group-ink)}
.srcard .fileent--check .pp-rate.on{background:var(--group);color:var(--on-group)}
.srcard .fileent--check .pp-range::-webkit-slider-runnable-track{background:var(--line)}
.srcard .fileent--check .pp-range::-moz-range-track{background:var(--line)}
.srcard .fileent--check .pp-range::-webkit-slider-thumb{background:var(--group)}
.srcard .fileent--check .pp-range::-moz-range-thumb{background:var(--group)}
.srcard .fileent-ico{color:var(--group-ink)}
@media (hover:hover){.srcard .fileent--check:hover{border-color:var(--line)}}
/* ряд из пяти знаков: 52×44, серые без рамки, во всю ширину карточки */
.srcard .srattach>.subreact:not(.locked){justify-content:space-between;gap:4px;margin-top:12px}
.srcard .subreact-b{width:52px;height:44px;border:0;border-radius:var(--r-btn);font-size:var(--fs-xl)}
.srcard .subreact-b:not(.on){background:var(--surface)}
.srcard .srattach>.subreact:not(.locked) .subreact-b{flex:0 1 52px;min-width:44px}
@media (hover:hover){.srcard .subreact-b:not(.on):hover{background:var(--btn-2-bg-hover)}}
/* «🤔 жду»: пунктирная строка-кнопка (эскиз), знак — без своей плашки */
.srcard .tk-wait{min-height:44px;box-sizing:border-box;border:1px dashed var(--line-strong);border-radius:var(--r-btn);
  padding:0 10px 0 0;gap:4px}
.srcard .tk-wait .subreact-b:not(.on){background:transparent}
.tk-wait-lbl{font-size:var(--fs-ctl);font-weight:500;color:var(--ink)}
/* Approve / Decline — две равные колонки, 48 */
.srcard .sractions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
.srcard .sractions>.btn,.srcard .sractions>.btn-ghost{width:100%;min-height:48px;margin:0;font-size:var(--fs-md)}
.srcard .sractions .ret{margin-left:0}
.srcard .srnote{border-radius:var(--r-badge)}
.srcard .srcom-edit{border-radius:var(--r-btn);box-shadow:none;border-color:var(--line-soft);min-height:44px}   /* касание 44 (было 40) */

/* ЛИЧКА: ученик — кружком в шапке */
.sr-who{display:flex;align-items:center;gap:12px;min-width:0}
.sr-who h2{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-heading);line-height:1.2}
/* личка: шапка карточки — название таска, подпись, факты — плотнее, чем блоки карточки */
.srcard:not(.tk-card)>:is(.srsub,.srstatus,.ofile){margin-top:-6px}
.sr-main>.summary{box-shadow:none}
.sr-split .sr-side{box-shadow:none}
/* принятая работа (и глава) — плашка стихает до карточки: звать некуда (blox82 #2), кружка ▶ нет */
.srcard.acc .fileent--check,.srcard .srch.acc .fileent--check{background:var(--card)}
.gband .tk-band .ofile-a,.gband.tk-band .ofile-a{color:var(--on-group)}   /* имя файла таска на полосе — белым */
.srcard .cmsg:empty{display:none}               /* пустая строка ошибки не берёт шаг карточки */

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   ПЕРЕРИСОВКА B — ДОМАШКА РЕБЁНКА (redraw-b, агент 5, эскиз HwB). Стоит в конце каскада
   (последний файл style-NN), поэтому перебивает старые правила листа порядком, а не весом. Классы, за которые берутся JS и автотесты, не тронуты — только вид.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
/* ПОЛОСА: «Homework» витринным шрифтом → «где я учусь» → чипы (порядок эскиза). Разметка прежняя
   (чипы в DOM первыми), порядок — через flex order: на DOM-порядок опирается только глаз. */
.hw-band{display:flex;flex-direction:column;gap:12px;padding-bottom:18px;margin-bottom:14px}
.hw-band>h2{order:1;margin:0;font-family:var(--font-display);font-weight:var(--fw-display);
  font-size:var(--fs-title);line-height:var(--lh-display);letter-spacing:0;color:var(--on-group)}
.hw-band>.swhere{order:2;margin:0;gap:2px 6px;font-size:var(--fs-sm);font-weight:500;line-height:1.4}
.hw-band .swhere-grp{font-weight:700}
.hw-band>.stbar{order:3;margin:0;gap:6px;flex-wrap:wrap}
.hw-band .stbar .btn-ghost{flex:0 0 auto;position:relative;height:40px;min-height:40px;padding:0 12px;
  border-radius:var(--r-chip);font-size:var(--fs-ctl);font-weight:600;white-space:nowrap}
/* чип 40px на вид, палец получает 44: невидимый вынос, как у чипов групп на полосе монитора */
@media (pointer:coarse){.hw-band .stbar .btn-ghost::before{content:"";position:absolute;inset:-2px 0;border-radius:inherit}}
/* переключатель ребёнка (и примерка роли у админа) в шапке над ЛЮБОЙ полосой — белым по цвету группы,
   с тонкой белой обводкой: это селект, он обязан выглядеть живым и в покое (lingo-ui §12) */
body:has(#view .gband) header select{background-color:transparent;color:var(--on-group);border:1px solid var(--on-group-line)}
body:has(#view .gband) header select option{color:var(--ink);background:var(--card)}

/* ОБЪЯВЛЕНИЕ — реплика учителя: его кружок-инициалы и облачко переписки (хвостик — левый нижний угол) */
.annc-row{display:flex;align-items:flex-end;gap:10px;margin:0 0 12px}
.annc-row>.ava{flex:none}
.annc.annc-bub{flex:1;min-width:0;margin:0;padding:10px 14px;border:0;box-shadow:none;background:var(--card);
  border-radius:var(--r-card) var(--r-card) var(--r-card) var(--r-2xs)}
/* подпись «Объявление» остаётся чтецу экрана; глазу её говорит кружок учителя */
.annc-bub .ah{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* ДВА БЛОКА (агент 7, решение владельца 28.10): полоса картинок — своим блоком над полем текста и с
   текстом не уезжает; без текста — без нижнего поля */
.annc-bub .annc-imgs{margin:0 0 10px}
.annc-bub .annc-imgs:last-child{margin-bottom:0}
/* ПОЛЕ ТЕКСТА — своя прокрутка, высота не больше 8½ строк (половина строки под угасанием — видно, что
   текст продолжается) и не больше 40% окна. Своя полоса прокрутки (.annc-bar) вместо системной:
   на iOS системная видна только во время движения — ровно та беда, что читалась «обрезано». */
.annc-text{position:relative}
.annc-bub .abody{font-size:var(--fs-md);font-weight:500;line-height:1.4;color:var(--ink);padding:0;
  max-height:min(calc(1.4em * 8.5),40vh);overflow-y:auto;overscroll-behavior:auto;scrollbar-width:none}
.annc-bub .abody::-webkit-scrollbar{display:none}
/* угасает тот край, за которым есть ещё текст (student.js fitAnnc ставит .more-down / .more-up) */
.annc-text.more-down .abody{-webkit-mask-image:linear-gradient(to bottom,var(--ink) calc(100% - 32px),transparent);
  mask-image:linear-gradient(to bottom,var(--ink) calc(100% - 32px),transparent)}
.annc-text.more-up .abody{-webkit-mask-image:linear-gradient(to bottom,transparent,var(--ink) 32px);
  mask-image:linear-gradient(to bottom,transparent,var(--ink) 32px)}
.annc-text.more-up.more-down .abody{-webkit-mask-image:linear-gradient(to bottom,transparent,var(--ink) 32px,var(--ink) calc(100% - 32px),transparent);
  mask-image:linear-gradient(to bottom,transparent,var(--ink) 32px,var(--ink) calc(100% - 32px),transparent)}
/* полоса-ползунок: в правом поле облачка (14px), не поверх букв; ползунок — доля видимого текста */
.annc-bar{display:none;position:absolute;top:2px;bottom:2px;right:-9px;width:4px;border-radius:var(--r-2xs);
  background:var(--line);pointer-events:none}
.annc-text.over .annc-bar{display:block}
.annc-bar>i{position:absolute;left:0;right:0;top:0;height:100%;border-radius:inherit;background:var(--muted)}
/* ПРЕДПРОСМОТР У УЧИТЕЛЯ «как увидит ученик» (агент 8): то же облачко, что у ребёнка (drawAnncBubble), на
   кусочке стола Домашки — белое облачко на белой карточке формы иначе не было бы видно */
.annc-prev{background:var(--bg);border-radius:var(--r-tile);padding:12px}
.annc-prev .annc-row{margin:0}
.annc-prev-empty{color:var(--muted);font-size:var(--fs-sm);text-align:center;padding:8px 4px}

/* КАРУСЕЛЬ ДНЕЙ — белая плашка 4px, стрелки 44 на сером столе внутри неё, дата витринным шрифтом */
#view .lcar{background:var(--card);border:0;border-radius:var(--r-tile);padding:4px;gap:4px;box-shadow:none;margin:0 0 12px}
#view .lcar-arr{border:0;border-radius:var(--r-sm);background:var(--bg);color:var(--ink);box-shadow:none}
@media (hover:hover){#view .lcar-arr:hover:not(:disabled){background:var(--btn-2-bg-hover)}}
#view .lcar-arr:disabled{background:transparent;color:var(--line)}
#view .lcar-date{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-ctl);
  letter-spacing:0;color:var(--ink)}

/* ПЛИТКА ПЛЕЙЛИСТА — тёмная, янтарная кнопка «играть» слева (фирменные --tile-dark / --amber) */
.poolbar{background:var(--tile-dark);color:var(--on-dark);border-radius:var(--r-sheet);padding:16px;gap:14px;
  box-shadow:none;margin-bottom:12px}
.poolbar::after{display:none}
@media (hover:hover){.poolbar:hover{box-shadow:var(--sh-2)}}
.poolbar .pbplay{order:-1;width:60px;height:60px;background:var(--amber);color:var(--tile-dark);box-shadow:none}
.poolbar .pbt{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-lg);letter-spacing:0}
.poolbar .pbm{color:var(--on-dark)}
.poolbar .pbweek{font-size:var(--fs-sm);font-weight:400;line-height:1.35;color:var(--on-dark);margin-top:4px;
  padding-top:0;border-top:0;max-width:none}

/* ТЕМЫ — разделы, а не скобки (как разделы листа на мониторе): имя темы слева витринным шрифтом.
   .tframe общий с личкой учителя — она получает тот же вид (правило двойников). */
.tframe{padding:0;margin:6px 0 0}
.tframe::before{display:none}
.tframe>.tfh{text-align:left;font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-md);
  letter-spacing:0;padding:4px 2px 10px;color:var(--ink)}
.hwlist>.sloose,.srlist>.sloose{margin-left:0;margin-right:0}

/* ЛИСТ — сетка в две колонки. В полширины встаёт только .rhalf (решает student.js, tileFits/
   pairTiles); всё остальное — рамки тем, заглушки, широкие карточки — во всю ширину. */
.hwlist,.hwlist .tfcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hwlist>:not(.rhalf),.hwlist .tfcards>:not(.rhalf){grid-column:1 / -1}

/* КАРТОЧКА-ПЛИТКА: белая, без рамки, рельса и тени; сделанная — зелёный тинт целиком */
.hwlist .rect{padding:12px;border:0;border-radius:var(--r-sheet);box-shadow:none}
.hwlist .rect::before{display:none}
@media (hover:hover){.hwlist .rect:hover{box-shadow:var(--sh-1)}}
.hwlist .rect.done{background:var(--ok-fill);border:0;box-shadow:none}
.hwlist .rect.chal,.hwlist .rect.chal.done{background:var(--gold-tint)}
.hwlist .rect .rbody{padding:0;gap:8px}
/* высота плитки — по содержимому (агент 6: min-height 196 эскиза оставлял пустоту между названием и
   круглой кнопкой); плитки ОДНОГО ряда равны — их тянет сетка (align-items: stretch), а кнопка
   прижата к низу margin-top:auto, поэтому в паре кнопки стоят на одной линии */
.hwlist .rect.rhalf .ractions{margin-top:auto}
/* ИМЯ ФАЙЛА: текст в своём <span> — у flex-строки .rfile голый текстовый узел резался посреди буквы,
   многоточие на нём не работает. Широкая карточка — одна строка с «…», плитка — две строки и «…»;
   полное имя — в title */
.hwlist .rect .rfile-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hwlist .rect.rhalf .rfile{align-items:flex-start;white-space:normal}
.hwlist .rect.rhalf .rfile>.ic{flex:none;margin-top:2px}
.hwlist .rect.rhalf .rfile-t{white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;
  -webkit-line-clamp:2;line-clamp:2}
/* тип задания — первой строкой (у карточки, где крупно стоит само задание, он в DOM вторым) */
.hwlist .rect .rsub{order:-1;margin-top:0;font-size:var(--fs-xs);font-weight:600;color:var(--muted)}
.hwlist .rect .rtitle:not(.rtitle-body){font-weight:600}   /* ярлык-тип; само задание держит книжный вес (blox52 #6) */
/* верхний ряд уступает место галочке в правом углу; книга/книга без глав — под обложкой целиком */
.hwlist .rect:not(.ctrltask) .rbody>:is(.rtitle:not(.rtitle-body),.rsub,.rf-top){margin-right:40px;min-height:32px}
.hwlist .rect:is(.rbook,.rflat) .rbody{padding-right:48px}

/* ГАЛОЧКА «сделал» — квадрат 32 со скруглением 10 в правом верхнем углу, зона нажатия 44 */
.hwlist .rect .rcheck{top:4px;right:4px;bottom:auto;width:44px;height:44px;border:0;border-radius:var(--r-btn)}
.hwlist .rect .rcheck.on{background:transparent}
.hwlist .rect .rcheck .circ{border-radius:var(--r-sm)}
/* свёрнутое принятое: стрелка «открыть» — в тот же угол, что галочка у полной плитки */
.hwlist .rect .rf-go{top:4px;right:4px;bottom:auto;width:44px;height:44px;border:0;background:transparent}

/* ДЕЙСТВИЯ: «▶ Слушать / Сделать» — круглая кнопка 48 цвета группы и подпись рядом (эскиз:
   круг + слово); остальное — серые кнопки B без рамки; громкая «Открыть …» — акцент, как была */
.hwlist .rect .ract{min-height:44px;padding:0 14px;border-color:transparent;background:var(--btn-2-bg);
  border-radius:var(--r-btn);font-size:var(--fs-ctl);font-weight:600;display:inline-flex;align-items:center;
  justify-content:center;gap:6px}
@media (hover:hover){.hwlist .rect .ract:hover{background:var(--btn-2-bg-hover);border-color:transparent}}
.hwlist .rect .ract.play{background:transparent;box-shadow:none;padding:0 6px 0 0;min-height:48px;gap:10px;
  color:var(--ink);--ripple-blend:inherit}
@media (hover:hover){.hwlist .rect .ract.play:hover{background:transparent;box-shadow:none}}
.hwlist .rect .ract.play>.ic{flex:none;box-sizing:border-box;width:48px;height:48px;padding:15px;border-radius:50%;
  background:var(--group);color:var(--on-group);--icw:2.4px;transition:background-color var(--dur-state) var(--ease-standard)}
.hwlist .rect.done .ract.play{border-color:transparent;color:var(--muted-strong)}
.hwlist .rect.done .ract.play>.ic{background:var(--btn-2-bg);color:var(--ink)}
.hwlist .rect.rhalf .ract{white-space:normal;text-align:left;line-height:1.25}
.hwlist .rect.rhalf .ract.open:not(.play){padding:6px 12px}
.hwlist .rect .ract.opened{background:transparent;border-color:var(--line-mid)}
/* чипы на полосе без значков и без точки у «Долги» (эскиз: красный тинт уже говорит «долг») —
   так три чипа встают в один ряд на 390 при Inter; у Andika буквы шире, «Долги» переносится вниз */
.hw-band .stbar .btn-ghost>.ic,.hw-band .stbar .sdebt-dot{display:none}


/* витрина челленджа на полосе (экран задания, экран книги) — белым, черта — белой долей */
.gband .rpeers{border-top-color:var(--on-group-line)}
.gband :is(.rpeers,.rp-count,.rp-did,.rp-did b,.rp-not){color:var(--on-group)}

/* ═══ ПЕРЕРИСОВКА B (агент 5) — плейлист РЕБЁНКА (renderPool, разметка в student.js, база в
   style-03): заголовок витринным шрифтом, кнопки шапки серые без рамки и тени, вкладки — серая
   дорожка с белым выбранным сегментом (как Notes | Tasks), карточки треков плоские, играющий —
   обведён цветом группы. Только вид; плеер, очередь и счёт прослушиваний не тронуты. ═══ */
.poolhead h2{font-family:var(--font-display);font-weight:var(--fw-display);font-size:var(--fs-2xl);letter-spacing:0}
.pool-dlall,.pool-tv{background:var(--btn-2-bg);border-color:transparent;box-shadow:none;color:var(--ink);
  --btn-ink:var(--ink);font-weight:600;font-size:var(--fs-ctl)}
@media (hover:hover){.pool-dlall:hover,.pool-tv:hover{background:var(--btn-2-bg-hover);border-color:transparent;box-shadow:none}}
.tabs.pool-tabs{background:var(--btn-2-bg);border-radius:var(--r-sm);padding:4px;gap:4px}
.tabs.pool-tabs button{border-radius:var(--r-xs);min-height:36px;font-weight:600}
.tabs.pool-tabs button.on{background:var(--seg-on);color:var(--ink);box-shadow:none}
.now{border-radius:var(--r-card);box-shadow:none}
.track{border-radius:var(--r-tile);box-shadow:none}
.track.playing{outline:2px solid var(--group-ink)}