/* >>> loading.css (tools-bundle-loading.sh) */
/* «Команда» — загрузочный экран v2: объёмная монета «$» (CSS 3D) + полоса прогресса 0→100 %. Требует tokens.css.
   Без внешних файлов и картинок; CSP-safe (отдельный файл, без inline-стилей). Проценты и этапы — loading.js (window.TeamLoading).
   3D: .ld-coin с transform-style: preserve-3d — лицевая и обратная стороны (translateZ ±4px) + 13 слоёв-дисков ребра между ними + полоса .ld-rim (ребро при повороте на 90°)
   (толщина 8 px видна, когда монета повёрнута ребром), блик проходит по граням, тень под монетой сжимается в такт повороту.
   prefers-reduced-motion — монета статична (повёрнута на −28°, объём виден), полоса без анимации, проценты обновляются. */
.ld{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-4,16px);
  background:radial-gradient(120% 60% at 50% 38%,rgb(76 141 255 / .08),transparent 60%),var(--bg,#0E1116);color:var(--text-2,#9AA7B4);
  padding:env(safe-area-inset-top) 24px env(safe-area-inset-bottom);transition:opacity .28s ease}
.ld[hidden]{display:none}
.ld.ld-out{opacity:0;pointer-events:none}
.ld-stage{position:relative;width:112px;height:132px;perspective:520px;display:grid;justify-items:center}
.ld-coin{position:relative;width:96px;height:96px;margin-top:4px;transform-style:preserve-3d;animation:ld-spin 2.4s linear infinite;will-change:transform}
.ld-coin>*{position:absolute;inset:0;border-radius:50%}
/* ребро: слои-диски одинакового радиуса, металлический градиент */
.ld-layer,.ld-edge{background:linear-gradient(90deg,#2a5bb3,var(--accent-press,#3A72D6) 45%,#7aa6ff 52%,var(--accent-press,#3A72D6) 60%,#2a5bb3)}
.ld-coin>i.ld-layer:nth-of-type(1){transform:translateZ(-4.00px)}
.ld-coin>i.ld-layer:nth-of-type(2){transform:translateZ(-3.33px)}
.ld-coin>i.ld-layer:nth-of-type(3){transform:translateZ(-2.67px)}
.ld-coin>i.ld-layer:nth-of-type(4){transform:translateZ(-2.00px)}
.ld-coin>i.ld-layer:nth-of-type(5){transform:translateZ(-1.33px)}
.ld-coin>i.ld-layer:nth-of-type(6){transform:translateZ(-0.67px)}
.ld-coin>i.ld-layer:nth-of-type(7){transform:translateZ(0.00px)}
.ld-coin>i.ld-layer:nth-of-type(8){transform:translateZ(0.67px)}
.ld-coin>i.ld-layer:nth-of-type(9){transform:translateZ(1.33px)}
.ld-coin>i.ld-layer:nth-of-type(10){transform:translateZ(2.00px)}
.ld-coin>i.ld-layer:nth-of-type(11){transform:translateZ(2.67px)}
.ld-coin>i.ld-layer:nth-of-type(12){transform:translateZ(3.33px)}
.ld-coin>i.ld-layer:nth-of-type(13){transform:translateZ(4.00px)}
.ld-edge{transform:translateZ(0)}
.ld-coin>.ld-rim{inset:0 auto;left:calc(50% - 4px);width:8px;border-radius:4px;transform:rotateY(90deg);
  background:linear-gradient(180deg,#2a5bb3,#7aa6ff 30%,var(--accent-press,#3A72D6) 55%,#2a5bb3)}   /* ребро «ребром»: при 90° закрывает зазоры между слоями */
.ld-face{display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;
  background:radial-gradient(circle at 34% 28%,#8fb6ff 0%,var(--accent,#4C8DFF) 38%,var(--accent-press,#3A72D6) 78%,#2a5bb3 100%);
  box-shadow:inset 0 0 0 3px rgb(255 255 255 / .22),inset 0 0 0 9px rgb(14 17 22 / .18),inset 0 0 0 10px rgb(255 255 255 / .18),inset 0 -6px 14px rgb(14 17 22 / .35);
  color:#FFFFFF;font:800 52px/1 var(--font-sans,system-ui,sans-serif)}
.ld-face.front{transform:translateZ(4px)}
.ld-face.back{transform:rotateY(180deg) translateZ(4px)}
.ld-face::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 38%,rgb(255 255 255 / .38) 48%,transparent 58%);
  transform:translateX(-60%);animation:ld-shine 2.4s linear infinite}
.ld-sym{position:relative;text-shadow:0 1px 0 rgb(255 255 255 / .35),0 -1px 0 rgb(14 17 22 / .45),0 3px 6px rgb(14 17 22 / .35)}   /* тиснение */
.ld-shadow{position:absolute;bottom:0;left:50%;width:80px;height:12px;margin-left:-40px;border-radius:50%;
  background:radial-gradient(closest-side,rgb(0 0 0 / .55),transparent);animation:ld-shadow 1.2s linear infinite}
.ld-label{margin:0;display:flex;gap:6px;align-items:baseline;font:500 var(--fs-body,15px)/var(--lh-body,22px) var(--font-sans,system-ui,sans-serif);color:var(--text,#E6EDF3)}
.ld-pct{min-width:4ch;font-variant-numeric:tabular-nums;font-weight:600}
.ld-bar{position:relative;width:min(240px,70vw);height:6px;border-radius:999px;background:var(--surface-2,#1F2630);overflow:hidden;box-shadow:inset 0 0 0 1px var(--border,#2A323D)}
.ld-fill{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--accent-press,#3A72D6),var(--accent,#4C8DFF));
  transform-origin:left center;transform:scaleX(var(--ld-p,0));transition:transform .25s ease-out}
.ld-step{margin:0;min-height:18px;font:400 var(--fs-caption,13px)/var(--lh-caption,18px) var(--font-sans,system-ui,sans-serif);color:var(--text-2,#9AA7B4)}
@keyframes ld-spin{from{transform:rotateY(0)}to{transform:rotateY(360deg)}}
@keyframes ld-shine{0%,8%{transform:translateX(-60%)}42%,100%{transform:translateX(60%)}}
@keyframes ld-shadow{0%,100%{transform:scaleX(1);opacity:1}50%{transform:scaleX(.42);opacity:.7}}   /* 1,2 с = пол-оборота: ребром тень уже */
@media (prefers-reduced-motion:reduce){
  .ld-coin{animation:none;transform:rotateY(-28deg)}
  .ld-face::after,.ld-shadow{animation:none}
  .ld-fill{transition:none}
}
.no-anim .ld-coin{animation:none;transform:rotateY(-28deg)}   /* только для скриншотов (?shot=1) */
.no-anim .ld-face::after,.no-anim .ld-shadow{animation:none}
.no-anim .ld-fill{transition:none}
/* v3: 3D-знак «$» + фон (.ta-bg3d / .ta-logo3d из components.css, рисует logo3d.js). Старые классы монеты .ld-coin оставлены для совместимости. */
.ld{overflow:hidden}
.ld>.ta-bg3d{position:absolute;inset:0}
.ld>*:not(.ta-bg3d){position:relative;z-index:1}
.ld-stage.ld-stage-3d{width:180px;height:180px;perspective:none;display:grid;place-items:center;margin-bottom:-4px}
.ld-fill{background:linear-gradient(90deg,#14a65c,var(--brand,#2BD47F))}
.ld-bar{background:rgb(255 255 255 / .06)}
/* <<< loading.css */
/* Поверх design/tokens.css + design/components.css: только то, чего нет у дизайнера, и принудительная тёмная тема. */
html{background-color:#0A0D12!important}html,body{color:#E8EEF4!important;color-scheme:dark}body:not(.ta-bg-grad){background-color:#0A0D12!important}   /* u24/u25b: v3 --bg/--text; при .ta-bg-grad body прозрачный — градиент рисует body::before (components.css) */
:root{--on-accent:#0A0D12}
/* Тёмный текст на цветных заливках — всегда (решение Директора) */
.btn-primary,.btn-danger,.composer .send,.count:not(.neutral){color:#0A0D12!important}
.filter[aria-pressed="true"] .count.neutral{background:#0A0D12;color:#E8EEF4}
.hidden{display:none!important}
.mb-3{margin-bottom:var(--sp-3)} .mb-4{margin-bottom:var(--sp-4)} .ml-auto{margin-left:auto}
.gap-6{gap:6px} .items-start{align-items:flex-start} .fw-semibold{font-weight:var(--fw-semibold)}
.nick{font-size:12px} .sub.visible{overflow:visible}
.lead-msg{margin:var(--sp-2) 0 0}
.bind-link{padding:0;margin:-12px 0}
.wrap-text{white-space:pre-wrap;word-break:break-word}
.composer .send[disabled]{background:var(--surface-2);color:var(--text-3)!important}
.agent .avatar{font-weight:var(--fw-semibold)}
.thread{min-height:120px}
.msg .body-text{white-space:pre-wrap;word-break:break-word}
.seg-gap{margin-bottom:var(--sp-4)}
.textarea.sm{min-height:72px}
.icon-btn.tight{margin-left:-8px}
.filters-wrap{margin-top:var(--sp-3)}
.form-err{min-height:16px}

/* Скролл/переполнение — правила в design/components.css (блок «Скролл и защита от горизонтального переполнения», v2.1) */



/* u4: загрузка внутри вкладок — тот же .ld Дизайнера, но в потоке (таббар виден) */
.ld.ld-inline{position:relative;inset:auto;min-height:60vh;background:transparent;padding:0}

/* u4 п.6: статус «готовится» — мягкий пульс */
.ta-dotpulse{flex:none;width:10px;height:10px;margin:6px 4px 0 2px;border-radius:50%;background:var(--accent);animation:ta-pulse 1.4s ease-in-out infinite}
@keyframes ta-pulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
@media (prefers-reduced-motion:reduce){.ta-dotpulse{animation:none}}
.ta-kpi .v{white-space:nowrap}
.filters.ta-wrap{flex-wrap:wrap;overflow-x:visible}
.title.sug-v{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}

/* u7: карточка, открытая кнопкой из Telegram (?conv=) */
.msg.ta-deeplink { box-shadow: 0 0 0 2px var(--accent); scroll-margin-top: 12px; }
.ta-lead.ta-deeplink { box-shadow: 0 0 0 2px var(--accent); scroll-margin-top: 12px; }

/* u11: перенесено из design/components.css (Подбор сотрудника, строки 676–797) — боевая suggestForm() */
/* ---------- Подбор сотрудника: .ta-sg / .ta-cand / .ta-fr / .ta-mini / .ta-bind (admin-suggest.html, docs/employee-suggest-card.md) ---------- */
.ta-sg-under{opacity:.35;pointer-events:none}
.app>.ta-sg{max-width:none}
.ta-sg{flex:1;margin:0 calc(-1 * (var(--page-x) + var(--safe-right))) 0 calc(-1 * (var(--page-x) + var(--safe-left)));
  padding:var(--sp-2) calc(var(--page-x) + var(--safe-right)) var(--sp-6) calc(var(--page-x) + var(--safe-left));
  background:var(--surface-2);border:1px solid var(--border);border-bottom:0;border-radius:20px 20px 0 0;box-shadow:var(--shadow-3)}
.ta-sg .grabber{width:36px;height:4px;border-radius:2px;background:var(--border);margin:0 auto var(--sp-4)}
.ta-sg-search{display:flex;gap:var(--sp-2);margin-top:var(--sp-3)}
.ta-sg-search .input{flex:1;min-width:0}
.ta-sg-search .btn{flex:none}
.ta-sg-hint{margin-top:6px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-sg-res{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-4)}
.ta-sg-res:empty{display:none}
.ta-sg-foot{display:flex;justify-content:center;margin-top:var(--sp-3)}
.ta-sg-sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-src-note{display:flex;align-items:center;gap:6px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-src-note .i{width:16px;height:16px}
/* Карточка кандидата */
.ta-cand{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-4) var(--sp-3);min-width:0}
.ta-cand-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px var(--sp-2)}
.ta-cand-name{flex:1 1 auto;min-width:0;font-size:17px;line-height:22px;font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.ta-conf{flex:none}
.ta-cand-cols{display:flex;justify-content:space-between;gap:var(--sp-2);margin-top:var(--sp-3);padding-bottom:6px;
  color:var(--text-2);font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.04em}
.ta-cand .banner{margin-top:var(--sp-3)}
/* Строка поля */
.ta-fr{display:flex;align-items:center;gap:var(--sp-3);min-height:52px;padding:6px 0;border-top:1px solid var(--border)}
.ta-fr .ico{width:32px;height:32px;flex:none;border-radius:var(--r-sm);display:grid;place-items:center;background:var(--surface-2);color:var(--text-2)}
.ta-fr .ico .i{width:18px;height:18px}
.ta-fr.found .ico{background:var(--accent-tint);color:var(--accent)}
.ta-fr.bad .ico{background:var(--danger-tint);color:var(--danger)}
.ta-fr .bd{flex:1;min-width:0}
.ta-fr .k{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-fr .v{overflow-wrap:anywhere}
.ta-fr .v .mono{font-size:13px}
.ta-fr .m{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-fr.miss .v{color:var(--text-2)}
.ta-fr-err{display:flex;align-items:flex-start;gap:6px;margin:0 0 6px 44px;font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--text)}
.ta-fr-err .i{width:16px;height:16px;color:var(--danger)}
/* Переключатель «Использовать» (role=switch), зона нажатия 44×44 */
.ta-use{flex:none;display:inline-grid;place-items:center;width:var(--tap);height:var(--tap);margin-right:-4px;border-radius:var(--r-md)}
.ta-use .sw{position:relative;width:36px;height:22px;border-radius:var(--r-pill);background:var(--border);transition:background var(--dur) var(--ease)}
.ta-use .sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--text);transition:transform var(--dur) var(--ease)}
.ta-use[aria-checked="true"] .sw{background:var(--accent)}
.ta-use[aria-checked="true"] .sw::after{transform:translateX(14px);background:var(--bg)}
.ta-use[aria-disabled="true"]{opacity:.5;pointer-events:none}
.ta-keep{flex:none;display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 6px;border-radius:6px;border:1px dashed var(--border);
  color:var(--text-2);font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);white-space:nowrap}
.ta-keep .i{width:12px;height:12px}
/* Предупреждения: максимум 2 видимых, остальное «Ещё N» */
.ta-warns{margin-top:var(--sp-2);padding:6px var(--sp-3);border-radius:var(--r-md);background:var(--warning-tint);border:1px solid rgb(245 165 36 / .35)}
.ta-warn{display:flex;align-items:flex-start;gap:var(--sp-2);padding:3px 0;font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-warn .i{width:16px;height:16px;color:var(--warning)}
.ta-warn-more{position:relative;display:inline-flex;align-items:center;gap:4px;min-height:28px;padding-left:24px;color:var(--text);font-size:var(--fs-caption);font-weight:var(--fw-semibold)}
.ta-warn-more::after{content:"";position:absolute;inset:-8px 0}
.ta-warn-more .i{width:16px;height:16px;transition:transform var(--dur) var(--ease)}
.ta-warn-more[aria-expanded="true"] .i{transform:rotate(180deg)}
.ta-cand-actions{display:flex;gap:var(--sp-2);margin-top:var(--sp-3)}
.ta-cand-actions>.btn{flex:1;min-width:0}
/* Несколько кандидатов: компактная строка, выбранная раскрывается */
.ta-cand.is-mini{padding:0;overflow:hidden}
.ta-mini{display:flex;align-items:center;gap:var(--sp-3);width:100%;min-height:64px;padding:var(--sp-3) var(--sp-4);text-align:left;color:inherit}
.ta-mini:active{background:var(--surface-2)}
.ta-mini .avatar{width:36px;height:36px}
.ta-mini .bd{flex:1;min-width:0}
.ta-mini .nm{font-weight:var(--fw-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ta-mini .meta{display:flex;align-items:center;gap:6px;margin-top:2px;min-width:0}
.ta-mini .meta .sub{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-mini .srcs{display:flex;gap:4px;flex:none}
.ta-mini .srcs .i{width:16px;height:16px;color:var(--text-3)}
.ta-mini .srcs .i.on{color:var(--accent)}
.ta-mini .chev{flex:none;color:var(--text-2);transition:transform var(--dur) var(--ease)}
.ta-mini[aria-expanded="true"] .chev{transform:rotate(180deg)}
.ta-mini[aria-expanded="true"]{border-bottom:1px solid var(--border)}
.ta-cand-body{padding:0 var(--sp-4) var(--sp-3)}
.ta-cand.is-mini.open{border-color:rgb(76 141 255 / .55)}
/* Скелетон карточки */
.ta-sk{display:flex;flex-direction:column;gap:var(--sp-3)}
.ta-sk-row{display:flex;align-items:center;gap:var(--sp-3)}
.ta-sk-row .skel-tile{width:32px;height:32px;border-radius:var(--r-sm)}
.ta-sk-w30{width:30%} .ta-sk-w45{width:45%} .ta-sk-w60{width:60%} .ta-sk-w80{width:80%}
.ta-sk-btns{display:flex;gap:var(--sp-2)} .ta-sk-btns .skel{flex:1;height:44px;border-radius:var(--r-md)}
/* Источники подбора */
.ta-srcs{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:0 var(--sp-3)}
.ta-src{display:flex;align-items:center;gap:var(--sp-2);min-height:40px;font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-src+.ta-src{border-top:1px solid var(--border)}
.ta-src .nm{flex:1;min-width:0;overflow-wrap:anywhere} .ta-src .nm .mono{color:var(--text-2);font-size:12px}
.ta-src .st{flex:none;color:var(--text-2)}
.ta-sg-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-2);padding:var(--sp-6) var(--sp-4)}
.ta-sg-state .glyph{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);color:var(--text-2)}
.ta-sg-state p{margin:0;color:var(--text-2);max-width:300px}
/* Ожидают привязки (владелец) */
.ta-bind{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4)}
.ta-bind+.ta-bind{margin-top:var(--sp-3)}
.ta-bind-head{display:flex;align-items:center;gap:var(--sp-3)}
.ta-bind-head .bd{flex:1;min-width:0}
.ta-bind-head .nm{font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.ta-bind-head .sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-bind-head .badge{flex:none}
.ta-bind-reason{display:flex;align-items:flex-start;gap:6px;margin-top:var(--sp-3);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-bind-reason .i{width:16px;height:16px;color:var(--info)}
.ta-bind-q{margin-top:var(--sp-3);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-medium)}
.ta-picks{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:6px}
.ta-pick{display:flex;align-items:center;gap:var(--sp-3);width:100%;min-height:56px;padding:var(--sp-2) var(--sp-3);text-align:left;color:inherit;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);transition:border-color var(--dur-fast),background var(--dur-fast)}
.ta-pick .rad{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--text-3);display:grid;place-items:center}
.ta-pick .bd{flex:1;min-width:0}
.ta-pick .nm{font-weight:var(--fw-medium);overflow-wrap:anywhere}
.ta-pick .sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-pick .sub .mono{font-size:12px}
.ta-pick[aria-pressed="true"]{border-color:var(--accent)}
.ta-pick[aria-pressed="true"] .rad{border-color:var(--accent)}
.ta-pick[aria-pressed="true"] .rad::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent)}
.ta-bind-actions{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-3)}
.ta-row-act{flex:none}
/* Сотрудник: «Ожидает привязки» */
.ta-pb-who{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-1);padding:6px 10px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--border);
  color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pb-who .i{width:16px;height:16px}
.ta-pb-checked{margin-top:var(--sp-1);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-sg-view{flex:1;display:flex;flex-direction:column}
.ta-pick .sub .mono,.ta-fr .v .mono{white-space:nowrap}

/* u17: перенесено из design/components.css (Голосовой ввод .ta-vi, строки 799–872) и design/icons.css (i-mic, i-mic-off, i-stop, i-keyboard) — боевой голосовой ввод */
.i-mic{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%229%22 y=%222%22 width=%226%22 height=%2212%22 rx=%223%22/%3E%3Cpath d=%22M19 10v1a7 7 0 0 1-14 0v-1M12 18v4M8 22h8%22/%3E%3C/svg%3E")}
.i-mic-off{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M2 2l20 20M15 9.34V5a3 3 0 0 0-5.68-1.33M9 9v2a3 3 0 0 0 5.12 2.12M19 10v1a7 7 0 0 1-.11 1.23M16.95 16.95A7 7 0 0 1 5 11v-1M12 18v4M8 22h8%22/%3E%3C/svg%3E")}
.i-stop{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%226%22 y=%226%22 width=%2212%22 height=%2212%22 rx=%222%22/%3E%3C/svg%3E")}
.i-keyboard{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222%22 y=%225%22 width=%2220%22 height=%2214%22 rx=%222%22/%3E%3Cpath d=%22M6 9h.01M10 9h.01M14 9h.01M18 9h.01M6 13h.01M18 13h.01M10 13h4M7 16h10%22/%3E%3C/svg%3E")}
/* ---------- Голосовой ввод: .ta-vi (voice-input.html, docs/voice-input-design.md, 31.10.2026) ----------
   Одно состояние = один атрибут на контейнере: <div class="ta-vi" data-state="ready|recording|transcribing|done|err-denied|err-short|err-failed|unavailable">.
   Панели .ta-vi-p[data-for] показываются только для своего состояния. Анимаций нет, кроме спиннера (при reduced-motion — статичен). */
.ta-vi{min-width:0}
.ta-vi-row{display:flex;align-items:stretch;gap:var(--sp-2);min-width:0}
.ta-vi-multi .ta-vi-row{align-items:flex-end}
.ta-vi-field{position:relative;flex:1;min-width:0;display:flex}
.ta-vi-field>.input,.ta-vi-field>.textarea{flex:1;min-width:0}
.ta-vi-row>.btn{flex:none}
/* Кнопка микрофона: 44×44, toggle (aria-pressed) */
.ta-vi-mic{position:relative;flex:none;display:inline-grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:var(--r-md);
  background:var(--surface);border:1px solid var(--border);color:var(--text-2)}
.ta-vi-mic:active{background:var(--border);color:var(--text)}
.ta-vi-mic .i{width:22px;height:22px}
.ta-vi-mic .i-mic-off,.ta-vi-mic .spinner{display:none}
.ta-vi-mic[aria-pressed="true"]{background:var(--accent-tint);border-color:var(--accent);color:var(--accent)}
.ta-vi-mic[aria-disabled="true"]{pointer-events:none;color:var(--text-2)}
.ta-vi[data-state="transcribing"] .ta-vi-mic .i-mic{display:none}
.ta-vi[data-state="transcribing"] .ta-vi-mic .spinner{display:inline-block;width:18px;height:18px;color:var(--accent)}
.ta-vi[data-state="err-denied"] .ta-vi-mic .i-mic{display:none}
.ta-vi[data-state="err-denied"] .ta-vi-mic .i-mic-off{display:inline-block}
.ta-vi[data-state="unavailable"] .ta-vi-mic{display:none}
/* Поле: запись — подсветка рамки; расшифровка — скелетон поверх; done — поле обычное, редактируемое */
.ta-vi[data-state="recording"] .ta-vi-field>.input,.ta-vi[data-state="recording"] .ta-vi-field>.textarea{border-color:rgb(76 141 255 / .55)}
.ta-vi-skel{display:none;position:absolute;inset:1px;align-items:center;padding:0 14px;border-radius:calc(var(--r-md) - 1px);background:var(--surface);pointer-events:none}
.ta-vi-multi .ta-vi-skel{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:14px}
.ta-vi-skel .skel-line{width:62%}
.ta-vi-skel .skel-line+.skel-line{width:40%}
.ta-vi[data-state="transcribing"] .ta-vi-skel{display:flex}
/* Панель статуса под полем */
.ta-vi-status{margin-top:var(--sp-2);min-width:0}
.ta-vi-p{display:none;min-width:0}
.ta-vi[data-state="recording"] .ta-vi-p[data-for="recording"],
.ta-vi[data-state="transcribing"] .ta-vi-p[data-for="transcribing"],
.ta-vi[data-state="done"] .ta-vi-p[data-for="done"],
.ta-vi[data-state="err-denied"] .ta-vi-p[data-for="err-denied"],
.ta-vi[data-state="err-short"] .ta-vi-p[data-for="err-short"],
.ta-vi[data-state="err-failed"] .ta-vi-p[data-for="err-failed"],
.ta-vi[data-state="unavailable"] .ta-vi-p[data-for="unavailable"]{display:flex}
/* Строка-плашка: запись / расшифровка / короткая запись */
.ta-vi-bar{align-items:center;gap:var(--sp-2);min-height:46px;padding:4px 0 4px var(--sp-3);border-radius:var(--r-md);background:var(--surface);border:1px solid var(--border)}
.ta-vi-bar .ta-vi-txt{flex:1 1 auto;min-width:0;font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-vi-bar>.btn{position:relative;flex:none;margin-left:auto;margin-right:4px;min-height:36px;border-radius:var(--r-sm)}
.ta-vi-bar>.btn::after{content:"";position:absolute;inset:-4px -4px}            /* видимо 36 px, зона нажатия 44 px */
.ta-vi-bar>.i{width:18px;height:18px;color:var(--text-2)}
.ta-vi-bar .spinner{width:16px;height:16px;color:var(--accent)}
.ta-vi-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--danger)}                      /* статичная точка записи, без пульсации */
.ta-vi-time{flex:none;font-variant-numeric:tabular-nums;font-weight:var(--fw-semibold);font-size:var(--fs-body)}
/* Индикатор уровня: 5 столбиков фиксированной высоты, data-level="0…5" подсвечивает N; без transition/animation */
.ta-vi-level{flex:none;display:inline-flex;align-items:center;gap:3px;height:16px;margin-left:var(--sp-1)}
.ta-vi-level i{display:block;width:3px;border-radius:2px;background:var(--border)}
.ta-vi-level i:nth-child(1),.ta-vi-level i:nth-child(5){height:6px}
.ta-vi-level i:nth-child(2),.ta-vi-level i:nth-child(4){height:10px}
.ta-vi-level i:nth-child(3){height:14px}
.ta-vi-level[data-level="1"] i:nth-child(-n+1),.ta-vi-level[data-level="2"] i:nth-child(-n+2),.ta-vi-level[data-level="3"] i:nth-child(-n+3),
.ta-vi-level[data-level="4"] i:nth-child(-n+4),.ta-vi-level[data-level="5"] i{background:var(--accent)}
/* Подпись под полем: done / unavailable */
.ta-vi-note{align-items:flex-start;gap:6px;padding:2px var(--sp-1);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-vi-note .i{width:16px;height:16px;flex:none}
/* Ошибки denied / failed: нейтральная плашка (без красного) */
.ta-vi-err{flex-direction:column;gap:var(--sp-2)}
.ta-vi-err .banner{margin:0}
.ta-vi-err .banner b{display:block}
.ta-vi-err .banner p{margin:2px 0 0;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-vi-steps{margin:6px 0 0;padding-left:18px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-vi-steps li+li{margin-top:2px}
.ta-vi-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.ta-vi-actions>.btn{flex:1 1 140px;min-width:0}
/* reduced-motion и режим скриншотов: уровень «заморожен» (без мерцания), спиннер статичен */
@media (prefers-reduced-motion: reduce){
  .ta-vi-level i,.ta-vi-level[data-level] i{background:var(--text-3)!important}
  .ta-vi .spinner{animation:none;border-right-color:currentColor;opacity:.7}
}
.no-anim .ta-vi .spinner{animation:none}
/* u17: проверка 360 px в боевой карточке «Ответы лидам» (поле уже, чем в макете): «Идёт запись» переносилось посреди слова.
   В узком контейнере — без индикатора уровня, слова не рвём, кнопка компактнее. Горизонтального переполнения нет ни в одном состоянии. */
.ta-vi{container-type:inline-size}
.ta-vi-bar .ta-vi-txt{overflow-wrap:normal}
@container (max-width: 340px){
  .ta-vi-bar{gap:6px;padding-left:10px}
  .ta-vi-bar .ta-vi-level{display:none}
  .ta-vi-bar>.btn{padding-left:10px;padding-right:10px}
}

/* ---------- u22b «Покупки» v3: перенесено из design/ (tokens.css, icons.css, components.css .ta-pu-*/.ta-cal-*/.ta-nav5) ----------
   frontend/design/*.css целиком не синхронизируем (там другие незавершённые правки Дизайна). Кольцо фокуса приведено к var(--focus-ring) как в остальных компонентах. */
:root{
  --brand: #2BD47F;
  --brand-tint: rgb(43 212 127 / .12);
  --border-strong: #33404D;
  --hairline: rgb(255 255 255 / .06);
  --card-grad: linear-gradient(180deg, rgb(255 255 255 / .028), rgb(255 255 255 / 0) 64%);
  --accent-hover: #5E9AFF;
  --ls-caps: .06em;
}
.i-bag{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 7h12l1.2 12.2A2 2 0 0 1 17.2 21H6.8a2 2 0 0 1-2-1.8L6 7z%22/%3E%3Cpath d=%22M9 10V6a3 3 0 0 1 6 0v4%22/%3E%3C/svg%3E")}
.i-calendar{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%224%22 width=%2218%22 height=%2217%22 rx=%222%22/%3E%3Cpath d=%22M16 2v4M8 2v4M3 10h18%22/%3E%3C/svg%3E")}
.i-chevron-left{--i:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.75%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m15 18-6-6 6-6%22/%3E%3C/svg%3E")}
/* ---------- Покупки за сутки: .ta-pu-* (purchases.html, docs/purchases-design.md, 31.10.2026) ---------- */
.ta-pu-meta{display:flex;align-items:center;gap:6px;margin:-8px 0 var(--sp-3);padding:0 var(--sp-1);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-meta .i{flex:none}
.ta-pu-stale{margin-bottom:var(--sp-3)}
.ta-pu-stale p{margin:2px 0 0;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-stale b{display:block}
.ta-pu-teams{margin-bottom:var(--sp-4)}
.ta-pu-body{display:flex;flex-direction:column;min-width:0}
/* Сумма: табличные (моноширинные) цифры, разделитель тысяч — неразрывный пробел (Intl ru-RU), подпись USDT */
.ta-pu-amt{flex:none;display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:var(--fw-semibold);color:var(--text)}
.ta-pu-amt .cur{font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);color:var(--text-2);letter-spacing:.02em}
.ta-pu-amt.lg .v{font-size:var(--fs-display);line-height:var(--lh-display);letter-spacing:-.01em}
.ta-pu-amt.lg .cur{font-size:var(--fs-caption)}
/* Итог по команде */
.ta-pu-total{display:flex;flex-direction:column;gap:6px;padding:var(--sp-4);border-radius:var(--r-lg);background:linear-gradient(160deg,var(--surface-2),var(--surface) 70%);border:1px solid var(--border);box-shadow:var(--shadow-1);min-width:0}
.ta-pu-total .lbl{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-medium)}
.ta-pu-total .sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-total .ta-pu-amt{flex-wrap:wrap;white-space:normal}
.ta-pu-st{margin-top:var(--sp-5)}
.ta-pu-st .btn{margin:-10px -8px -10px 0}
/* Карточка менеджера (details/summary) */
.ta-pu-list{display:flex;flex-direction:column;gap:var(--sp-2)}
.ta-pu-mgr{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);min-width:0;overflow:hidden}
.ta-pu-mgr>summary{list-style:none;display:flex;align-items:center;gap:var(--sp-3);min-height:64px;padding:var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-4);cursor:pointer;transition:background var(--dur-fast)}
.ta-pu-mgr>summary::-webkit-details-marker{display:none}
.ta-pu-mgr>summary:active{background:var(--surface-2)}
.ta-pu-mgr>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--accent);border-radius:var(--r-lg)}
.ta-pu-mgr .avatar{width:36px;height:36px;font-size:12px}
.ta-pu-mgr .bd{flex:1;min-width:0;display:flex;flex-direction:column}
.ta-pu-mgr .nm{font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.ta-pu-mgr .sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-mgr .chev{flex:none;color:var(--text-2);transition:transform var(--dur) var(--ease)}
.ta-pu-mgr[open] .chev{transform:rotate(180deg)}
.ta-pu-mgr[open]>summary{border-bottom:1px solid var(--border)}
/* Строка лида */
.ta-pu-leads{list-style:none;margin:0;padding:0 var(--sp-4)}
.ta-pu-lead{display:flex;align-items:flex-start;gap:var(--sp-3);padding:10px 0;border-top:1px solid var(--border)}
.ta-pu-lead:first-child{border-top:0}
.ta-pu-lead .bd{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ta-pu-lead .u{font-weight:var(--fw-medium);overflow-wrap:anywhere}
.ta-pu-lead .n{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);overflow-wrap:anywhere}
.ta-pu-lead .t{display:inline-flex;align-items:center;gap:4px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);font-variant-numeric:tabular-nums}
.ta-pu-lead .t .i{width:12px;height:12px}
.ta-pu-lead>.ta-pu-amt{padding-top:1px}
/* Скелетон, состояния */
.ta-pu-sk{display:flex;align-items:center;gap:var(--sp-3);min-height:64px;padding:var(--sp-3) var(--sp-4);margin-top:var(--sp-2)}
.ta-pu-sk .skel-circle{width:36px;height:36px}
.ta-pu-sk .bd{gap:8px}
.ta-pu-sk-amt{width:84px;flex:none}
.ta-pu-total .skel-line{display:block}
.ta-pu-state{padding:var(--sp-8) var(--sp-4)}
.ta-pu-state p{margin:0;max-width:300px}
/* «Не распознано» — только владелец */
.ta-pu-unk{margin-top:var(--sp-6)}
.ta-pu-unk .section-title .badge{flex:none}
.ta-pu-unk-av{background:var(--surface-2);color:var(--text-2)}
.ta-pu-unk-note{display:flex;align-items:flex-start;gap:6px;margin:0;padding:var(--sp-3) var(--sp-4) 2px;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-unk-note .i{flex:none;margin-top:1px}
.ta-pu-more{border-top:1px solid var(--border);border-radius:0}
@media (prefers-reduced-motion: reduce){.ta-pu-mgr .chev,.ta-pu-mgr>summary{transition:none}}
.ta-pu-mine .ta-pu-leads{padding-top:2px;padding-bottom:2px}
/* Покупки как третья вкладка «Лидов» (purchases-in-nav.html): шапка .lh без фильтров Лидов */
.ta-pu-lh{padding-bottom:var(--sp-2)}
.ta-pu-lh+.ta-pu-meta{margin-top:0}
/* ---------- Покупки v3: отдельный раздел меню, выбор дня, период, менеджер, «С начала учёта», ник и «Диалог» (31.10.2026) ---------- */
.ta-pu-since{margin:0 0 var(--sp-4);padding:var(--sp-3) var(--sp-4);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);background-image:var(--card-grad)}
.ta-pu-since-h{display:flex;align-items:center;gap:6px;margin:0 0 var(--sp-2);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-semibold);color:var(--text-2);letter-spacing:var(--ls-caps);text-transform:uppercase}
.ta-pu-since-h .t3{color:var(--text-2);font-weight:var(--fw-medium);text-transform:none;letter-spacing:0}
.ta-pu-sgrid{display:flex;flex-direction:column}
.ta-pu-sr{display:flex;align-items:baseline;gap:var(--sp-2);min-height:32px;padding:6px 0;border-top:1px solid var(--hairline)}
.ta-pu-sr:first-child{border-top:0}
.ta-pu-sr .lbl{flex:1;min-width:0;color:var(--text);font-weight:var(--fw-medium)}
.ta-pu-sr .sub{flex:none;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-sr .ta-pu-amt{min-width:0}
.ta-pu-sr.main{border-top-color:var(--border-strong)}
.ta-pu-sr.main .lbl,.ta-pu-sr.main .v{font-weight:var(--fw-semibold);color:var(--brand)}
.ta-pu-sgrid .ta-pu-sr.main:only-child .lbl{color:var(--text)}

.ta-pu-days{display:flex;gap:var(--sp-2);overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;margin:0 calc(-1 * var(--page-x)) var(--sp-3);padding:2px var(--page-x)}
.ta-pu-days::-webkit-scrollbar{display:none}
.ta-pu-chip{flex:none;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--tap);min-width:var(--tap);padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-medium);white-space:nowrap;transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.ta-pu-chip>.i{display:none}
.ta-pu-chip[data-day="cal"]{flex-direction:row;gap:6px}
.ta-pu-chip[data-day="cal"]>.i{display:inline-block}
.ta-pu-chip .nd{font-size:var(--fs-micro);line-height:var(--lh-micro);color:var(--text-2);font-weight:var(--fw-medium)}
.ta-pu-chip.is-nd .l{color:var(--text-2)}
.ta-pu-chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.ta-pu-chip[aria-pressed="true"] .l,.ta-pu-chip[aria-pressed="true"] .nd{color:var(--on-accent)}
.ta-pu-chip:focus-visible{outline:none;box-shadow:var(--focus-ring)}
@media (hover:hover){.ta-pu-chip:not([aria-pressed="true"]):hover{border-color:var(--border-strong);background:var(--surface-2)}}

.ta-pu-ctl{display:flex;flex-direction:column;gap:var(--sp-2);margin-bottom:var(--sp-4)}
.ta-pu-ctl .ta-pu-teams{margin:0}
.ta-pu-ctl[hidden],.ta-pu-mgrbtn[hidden]{display:none}
.ta-pu-mgrbtn{display:flex;align-items:center;gap:var(--sp-2);min-height:var(--tap);padding:0 var(--sp-3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text-2);font-size:var(--fs-caption);font-weight:var(--fw-medium);text-align:left;transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.ta-pu-mgrbtn .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.ta-pu-mgrbtn.is-set{border-color:var(--accent);color:var(--accent-hover)}
.ta-pu-mgrbtn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.ta-pu-mgrlist{display:flex;flex-direction:column;max-height:56vh;overflow-y:auto;margin:var(--sp-2) calc(-1 * var(--sp-2)) 0}
.ta-pu-mopt{display:flex;align-items:center;gap:var(--sp-3);min-height:56px;padding:var(--sp-2);border-radius:var(--r-md);text-align:left;color:var(--text)}
.ta-pu-mopt .avatar{width:32px;height:32px;font-size:12px;flex:none}
.ta-pu-mopt .nm{flex:1;min-width:0;display:flex;flex-direction:column;font-weight:var(--fw-medium);overflow-wrap:anywhere}
.ta-pu-mopt .sub{color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:400}
.ta-pu-mopt[aria-selected="true"]{background:var(--accent-tint);box-shadow:inset 0 0 0 1px var(--accent)}
.ta-pu-mopt:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent)}

/* Календарь: 7 колонок по ≥44 px */
.ta-cal-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);margin:0 calc(-1 * var(--sp-2)) var(--sp-2)}
.ta-cal-head .h2{margin:0}
.ta-cal-head .icon-btn:disabled{opacity:.35}
.ta-cal{display:flex;flex-direction:column;gap:2px}
.ta-cal-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.ta-cal-wd span{display:grid;place-items:center;height:24px;color:var(--text-2);font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold)}
.ta-cal-d{position:relative;display:grid;place-items:center;width:100%;min-width:var(--tap);height:var(--tap);border-radius:var(--r-md);color:var(--text);font-variant-numeric:tabular-nums;font-weight:var(--fw-medium);transition:background-color var(--dur-fast) var(--ease)}
.ta-cal-d.empty{min-width:0}
.ta-cal-d.data::after{content:"";position:absolute;bottom:6px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--brand)}
.ta-cal-d.no_data{color:var(--text-2);background:repeating-linear-gradient(135deg,transparent 0 5px,rgb(255 255 255 / .035) 5px 7px)}
.ta-cal-d.today{box-shadow:inset 0 0 0 1px var(--border-strong);color:var(--text-2)}
.ta-cal-d.future,.ta-cal-d.before{color:var(--text-3);opacity:.6}
.ta-cal-d[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.ta-cal-d[aria-pressed="true"]::after{background:var(--on-accent)}
.ta-cal-d:focus-visible{outline:none;box-shadow:var(--focus-ring)}
@media (hover:hover){.ta-cal-d:not(:disabled):not([aria-pressed="true"]):hover{background:var(--surface-2)}}
.ta-cal-legend{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);list-style:none;margin:var(--sp-3) 0 0;padding:0;color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-cal-legend li{display:inline-flex;align-items:center;gap:6px}
.ta-cal-key{width:14px;height:14px;border-radius:4px;flex:none;position:relative}
.ta-cal-key.data::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--brand)}
.ta-cal-key.nodata{background:repeating-linear-gradient(135deg,transparent 0 3px,rgb(255 255 255 / .18) 3px 4px);box-shadow:inset 0 0 0 1px var(--border)}
.ta-cal-key.today{box-shadow:inset 0 0 0 1px var(--border-strong)}
.ta-pu-calsheet .actions{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-4)}

/* Лид: ник моноширинным (копирование), справа сумма и «Диалог» */
.ta-pu-lead .rt{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px;max-width:50%}
.ta-pu-nick{position:relative;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;max-width:100%;min-height:28px;margin:-2px 0 0 -6px;padding:2px 6px;border-radius:var(--r-sm);color:var(--text);text-align:left;font-weight:var(--fw-medium);transition:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.ta-pu-nick::after{content:"";position:absolute;inset:-8px 0}
.ta-pu-nick .nk{min-width:0;overflow-wrap:anywhere;word-break:break-all}
.ta-pu-nick .cp{flex:none;color:var(--text-2)}
.ta-pu-nick:active{background:var(--surface-2)}
.ta-pu-nick:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.ta-pu-nick.is-copied{background:var(--brand-tint);color:var(--brand)}
.ta-pu-nick.is-copied .cp{color:var(--brand)}
@media (hover:hover){.ta-pu-nick:hover{background:var(--surface-2)}}
.ta-pu-dlg{position:relative;display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 2px;color:var(--accent-hover);font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-medium);text-decoration:none;border-radius:var(--r-sm)}
.ta-pu-dlg::after{content:"";position:absolute;inset:-8px -6px}
.ta-pu-dlg:focus-visible{outline:none;box-shadow:var(--focus-ring)}
@media (hover:hover){.ta-pu-dlg:hover{text-decoration:underline}}
.ta-pu-dh{padding:var(--sp-3) var(--sp-4) 0;color:var(--text-2);font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);letter-spacing:var(--ls-caps);text-transform:uppercase}
.ta-pu-dh+.ta-pu-leads .ta-pu-lead:first-child{padding-top:6px}
/* Пять пунктов меню (Лиды · Покупки · Агенты · Кошельки · Админ): ≥ 72 px на 360 */
.ta-nav5 .tab{min-width:0;padding:0 2px}
.ta-nav5 .tab>span:last-child{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (prefers-reduced-motion: reduce){.ta-pu-chip,.ta-pu-mgrbtn,.ta-cal-d,.ta-pu-nick{transition:none}}
/* Ряд дней: «Сегодня · Вчера · Позавчера» (3 равных) + «Другой день · Весь период» (2 равных) — всё видно на 360 без прокрутки */
.ta-pu-days{flex-direction:column;overflow:visible;margin:0 0 var(--sp-3);padding:0}
.ta-pu-days .r3,.ta-pu-days .r2{display:grid;gap:var(--sp-2)}
.ta-pu-days .r3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ta-pu-days .r2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ta-pu-days .ta-pu-chip{min-width:0;padding:0 8px;border-radius:var(--r-md)}
.ta-pu-days .ta-pu-chip .l{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ta-pu-meta{margin:0 0 var(--sp-3)}
/* day_note — мелкая подпись под пометкой периода */
.ta-pu-note{margin:-8px 0 var(--sp-3);padding:0 var(--sp-1);color:var(--text-2);font-size:var(--fs-micro);line-height:var(--lh-micro)}
/* ---------- u37 (31.10.2026): «Покупки» = макет v3 (design/components.css). Блок u22b выше перебивал золото/рамку/блик итогов. ---------- */
.ta-pu-since{border-color:var(--gold-line);background-image:linear-gradient(105deg,transparent 42%,var(--shimmer-hi) 50%,transparent 58%),var(--card-grad);background-size:260% 100%,100% 100%;background-repeat:no-repeat}
.ta-pu-total{border-color:var(--gold-line);background-color:var(--surface);background-image:linear-gradient(105deg,transparent 42%,var(--shimmer-hi) 50%,transparent 58%),radial-gradient(120% 90% at 100% 0%,var(--gold-tint),transparent 60%),linear-gradient(160deg,var(--surface-2),var(--surface) 70%);background-size:260% 100%,100% 100%,100% 100%;background-repeat:no-repeat}
.ta-pu-total,.ta-pu-since{box-shadow:inset 0 1px 0 var(--hl-top),var(--shadow-card);background-position:130% 0,0 0,0 0}
.ta-pu-total .lbl{color:var(--gold)}
.ta-pu-sr.main .lbl,.ta-pu-sr.main .v{color:var(--gold-hi)}
.ta-pu-sr.main .cur{color:var(--gold)}
.ta-pu-sgrid .ta-pu-sr.main:only-child .lbl{color:var(--text)}
/* u53: «Последние 7 дней» — третий ряд на всю ширину; кнопка «Скачать за 7 дней» под строкой периода; лист выгрузки */
.ta-pu-days .r1{display:grid;grid-template-columns:minmax(0,1fr)}
.ta-pu-export{margin:0 0 var(--sp-3)}
.ta-pu-exp-w{margin:-4px 0 var(--sp-3);color:var(--text-2);font-size:var(--fs-caption);line-height:var(--lh-caption)}
.ta-pu-dlopt .badge{flex:none;margin-left:auto}
.ta-pu-dlopt[disabled]{opacity:.55}
/* u81: метка проверки ответа — маленькая нейтральная (не баннер, не блокирует) */
.ta-rv{display:inline-flex;align-items:center;margin-left:6px;padding:1px 6px;border-radius:999px;font-size:var(--fs-micro,11px);line-height:var(--lh-micro,16px);
  font-weight:500;border:1px solid var(--border,#2A323C);color:var(--text-2,#9AA7B4);background:transparent;white-space:nowrap}
.ta-rv-disputed{color:var(--warning);border-color:rgb(245 165 36 / .45)}   /* u83: золото только для денег (v5 Дизайна) */
.ta-rv-verified{color:#3FB57A;border-color:rgb(63 181 122 / .45)}
.ta-rv-corrected{color:#4C8DFF;border-color:rgb(76 141 255 / .45)}
.ta-rv-edited{color:#4C8DFF;border-color:rgb(76 141 255 / .45)}
.ta-edit summary{cursor:pointer;list-style:none}
/* ===== u82→u83: карточки «Ответы лидам» / «Неотвеченные». Цвет лида (data-ci), номер (CSS-счётчик), полоса, рамка, шапка, подписи, кнопки «Сохранить»
   и спиннер — в v5 Дизайна (frontend/design/leads-v5.css, вшит в конец файла tools-bundle-leads-v5.sh). Здесь — только то, чего в v5 нет:
   метка проверки в шапке, шапки блоков u82 с языком/версией, свёрнутый перевод, ряд кнопок «Скопировать/Править», панель правки, ошибки/успех. ===== */
.ta-rv-slot{display:inline-flex;flex-wrap:wrap;gap:4px;margin-left:auto;min-width:0} .ta-rv-slot:empty{display:none} .ta-rv-slot .ta-rv{margin-left:0}
/* шапки блоков «Вопрос лида» / «Ответ» (язык, версия) */
.ta-blk-h{display:flex;align-items:center;gap:6px;min-height:28px;padding:4px var(--sp-3) 0}
.ta-blk-l{font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--text-2)}
.ta-ans .ta-blk-l{color:var(--brand,#2BD47F)}
/* u83b: оригинал (EN/DE…) свёрнут — <details class="ta-tr ta-v5-orig">, summary с видом переключателя v5 (.ta-v5-en-toggle) */
.ta-tr{border-top:1px solid var(--border)}
.ta-ans .ta-tr{border-top-color:rgb(43 212 127 / .2)}
.ta-tr>summary{list-style:none;cursor:pointer;border-top:0}
.ta-tr>summary::-webkit-details-marker{display:none}
.ta-tr .chev{transition:transform var(--dur) var(--ease)} .ta-tr[open]>summary .chev{transform:rotate(180deg)}
/* ряд кнопок: «Скопировать и перейти» (primary) + «Править ответ» (secondary), тач ≥ 44 px */
.ta-acts{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:stretch}
.ta-acts .btn.ta-act{margin-top:0;min-width:0;min-height:44px;flex:1 1 150px;padding:6px var(--sp-3);font-size:14px;line-height:18px;white-space:normal;text-align:center;justify-content:center;gap:6px}
.ta-acts .btn.ta-act-2{flex:0 0 auto}
.ta-acts .btn-secondary[aria-expanded="true"]{border-color:var(--accent);color:var(--accent)}
/* панель правки (u82: кнопка-переключатель, а не <details>) */
.ta-edit{display:flex;flex-direction:column;gap:6px;padding:var(--sp-2) var(--sp-3) var(--sp-3);border:1px solid rgb(76 141 255 / .45);border-radius:var(--r-md);background:var(--accent-tint)}
.ta-edit[hidden]{display:none}
.ta-edit-err{margin:0;font-size:var(--fs-caption);line-height:var(--lh-caption);color:#FF8A8A}
.ta-edit-ok{display:flex;align-items:center;gap:4px;margin:6px 0 0;font-size:var(--fs-caption);color:var(--success)}
.ta-lead .btn-block.mt-3{margin-top:var(--sp-2)}
@media (max-width:360px){.ta-acts .btn.ta-act-2{flex:1 1 auto}}   /* узкий экран: второй ряд — кнопка на всю ширину */
/* >>> frame-v4.css (tools-bundle-frame-v4.sh, u47c) */
/* frame-v4.css — «v3 · Этап 4: каркас», СТИЛЬ C «крупные плитки» (выбор Metrics 31.10, 19:56). Основа — menu-styles.css блок .ta-ms-c.
   Подключение: <link rel="stylesheet" href="frame-v4.css"> ПОСЛЕ components.css (без @import). Включение: класс .ta-s4 на <body>.
   Только расширение: ни один класс не переименован, все правила под body.ta-s4. Откат — убрать класс .ta-s4 или <link>.
   Без filter/blur/backdrop-filter; движение — только transform/opacity ≤ 200 мс; reduced-motion и .ta-bg-lite — без анимаций. Золото — только деньги/итоги.
   Язык: крупные скруглённые плитки и карточки (радиус 20–24), крупная иконка-плитка, крупные заголовки 30 px, сегменты-пилюли 44 px, кнопки 52 px, листы снизу. */

body.ta-s4{--s4-bar-h:76px;--s4-bar-off:calc(var(--s4-bar-h) + var(--safe-bottom));--s4-r:20px;--s4-r-lg:24px;--s4-btn:52px;
  --s4-tile:var(--surface);--s4-tile-2:#1F2733;--s4-line:rgb(255 255 255 / .07)}

/* ---------- 1. Нижнее меню C: иконки-плитки 44×36, подпись под плиткой, фон-растушёвка ---------- */
body.ta-s4 .tabbar{height:calc(var(--s4-bar-h) + var(--safe-bottom));gap:var(--sp-1);border-top:0;box-shadow:none;
  padding:8px calc(8px + var(--safe-right)) calc(8px + var(--safe-bottom)) calc(8px + var(--safe-left));
  background:linear-gradient(180deg,rgb(10 13 18 / 0),var(--bg) 28%);-webkit-backdrop-filter:none;backdrop-filter:none}
body.ta-s4 .tabbar::after{display:none}                                 /* золотая линия убрана: золото — только деньги */
body.ta-s4 .tab{justify-content:flex-end;gap:4px;padding-bottom:2px;border-radius:var(--r-lg);color:var(--text-2);font-size:var(--fs-micro);font-weight:var(--fw-semibold)}
body.ta-s4 .tab::before{content:"";display:block;position:absolute;top:2px;left:50%;right:auto;width:44px;height:36px;margin-left:-22px;border-radius:var(--r-md);
  background:var(--s4-tile);border:1px solid var(--border);box-shadow:none;transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
body.ta-s4 .tab>.i{position:absolute;top:10px;left:50%;margin-left:-10px;width:20px;height:20px;transform:none}
body.ta-s4 .tab[aria-current="page"]{color:var(--text)}
body.ta-s4 .tab[aria-current="page"]::before{left:50%;right:auto;background:var(--brand-tint);border-color:rgb(var(--glow-green) / .45);box-shadow:none}
body.ta-s4 .tab[aria-current="page"] .i{color:var(--brand);transform:none}
body.ta-s4 .tab:active::before{background:var(--surface-2);border-color:var(--border-strong)}
body.ta-s4 .tab:focus-visible{outline:none;box-shadow:var(--focus-ring)}
body.ta-s4 .tab .count{top:-2px;left:calc(50% + 12px);z-index:1}
body.ta-s4 .tab>span:not(.i):not(.count){max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.ta-s4 .app.has-tabbar{padding-bottom:calc(var(--s4-bar-off) + var(--sp-6))}
body.ta-s4 .dock{bottom:calc(var(--s4-bar-off) + var(--sp-1))}
body.ta-s4 .ag-dock{bottom:var(--s4-bar-off)}

/* ---------- 2. Шапка: крупный заголовок 30 px, знак в плитке, бейдж роли; компактная при прокрутке (.ta-s4-compact, frame-v4.js) ---------- */
body.ta-s4 .page-head{position:sticky;top:0;z-index:18;min-height:64px;gap:var(--sp-3);
  margin:0 calc(-1 * (var(--page-x) + var(--safe-right))) var(--sp-4) calc(-1 * (var(--page-x) + var(--safe-left)));
  padding:calc(var(--safe-top) + var(--sp-3)) calc(var(--page-x) + var(--safe-right)) var(--sp-3) calc(var(--page-x) + var(--safe-left));
  background:rgb(10 13 18 / 0);border-bottom:1px solid transparent;transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
body.ta-s4 .page-head>.ta-logo3d--header{width:44px;height:44px;padding:6px;margin:0;border-radius:var(--r-md);background:var(--s4-tile);border:1px solid var(--border)}
body.ta-s4 .page-head>.ta-logo3d--header>img{inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
body.ta-s4 .page-head .h1{font-size:30px;line-height:36px;letter-spacing:-.02em;transform-origin:left center;transition:transform var(--dur) var(--ease)}
body.ta-s4 .page-head .badge{height:28px;padding:0 10px;border-radius:var(--r-pill);font-size:var(--fs-caption)}
body.ta-s4.ta-s4-compact .page-head:not(.ta-s4-head){background:var(--bg);border-bottom-color:var(--border)}
body.ta-s4.ta-s4-compact .page-head:not(.ta-s4-head) .h1{transform:scale(.7)}
body.ta-s4 .page-head.ta-s4-head{position:relative;top:auto;margin-bottom:var(--sp-1)}   /* в Лидах липкая — полоса фильтров .lh */
body.ta-s4 .badge.ta-s4-role:empty{display:none}
body.ta-s4 .lh{background:var(--bg);border-bottom-color:var(--border);gap:var(--sp-2);padding-bottom:var(--sp-2)}
body.ta-s4 .section-title{font-size:13px;letter-spacing:.06em;margin-top:var(--sp-2)}

/* ---------- 3. Сегменты-пилюли 44 px (единый вид: .segmented, .lh-tabs, .lh-team, чипы агентов/дней) ---------- */
body.ta-s4 .segmented,body.ta-s4 .lh-tabs,body.ta-s4 .lh-team{min-height:var(--tap);padding:4px;gap:4px;border-radius:var(--r-pill);background:var(--s4-tile);border:1px solid var(--border)}
body.ta-s4 .segmented button,body.ta-s4 .lh-tab,body.ta-s4 .lh-team button{min-height:36px;border-radius:var(--r-pill);font-size:var(--fs-caption);font-weight:var(--fw-semibold)}
body.ta-s4 .segmented button[aria-pressed="true"],body.ta-s4 .lh-tab[aria-current="page"],body.ta-s4 .lh-team button[aria-pressed="true"]{background:var(--text);color:var(--bg);box-shadow:none}
body.ta-s4 .lh-tab[aria-current="page"] .count.neutral{background:var(--bg);color:var(--text)}
body.ta-s4 .ag-chip,body.ta-s4 .lh-chip{min-height:40px;border-radius:var(--r-pill)}
body.ta-s4 .ag-chip:not([aria-pressed="true"]),body.ta-s4 .lh-chip:not([aria-pressed="true"]):not(.on){background:var(--s4-tile)}
body.ta-s4 .ta-pu-chip{border-radius:var(--s4-r);min-height:52px}

/* ---------- 4. Карточки и плитки: радиус 20, крупнее отступы, чёткая рамка ---------- */
body.ta-s4 .card,body.ta-s4 .ta-person,body.ta-s4 .ta-cand,body.ta-s4 .ta-bind,body.ta-s4 .ta-pu-mgr,body.ta-s4 .ta-pu-since,body.ta-s4 .ta-section{border-radius:var(--s4-r)}
body.ta-s4 .card{padding:var(--sp-4) var(--sp-4) calc(var(--sp-4) + 2px)}
body.ta-s4 .card-hero,body.ta-s4 .ta-pu-total,body.ta-s4 .ta-salary-hero{border-radius:var(--s4-r-lg)}
body.ta-s4 .ta-kpi,body.ta-s4 .stat,body.ta-s4 .metric{border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}
body.ta-s4 .banner{border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);gap:var(--sp-3)}
body.ta-s4 .banner>.i{width:20px;height:20px;flex:none}
body.ta-s4 .avatar{width:44px;height:44px;border-radius:14px}
body.ta-s4 .ag-chip .av,body.ta-s4 .lh-chip .av{border-radius:10px}
body.ta-s4 .badge{height:22px;padding:0 8px;border-radius:var(--r-pill)}
body.ta-s4 .msg{border-radius:20px}
body.ta-s4 .ta-section-head .i,body.ta-s4 .group-head>.i{width:20px;height:20px}

/* ---------- 5. Списки: каждая строка — плитка (зазор 8 px), 2 строки, справа цифра/время ---------- */
body.ta-s4 .list{background:none;background-image:none;border:0;box-shadow:none;overflow:visible;display:flex;flex-direction:column;gap:var(--sp-2)}
body.ta-s4 .list-item{min-height:64px;padding:var(--sp-3) var(--sp-4);gap:var(--sp-3);border-radius:var(--r-lg);background:var(--s4-tile);border:1px solid var(--border)}
body.ta-s4 .list-item+.list-item::before{display:none}
body.ta-s4 .list-item .title{font-weight:var(--fw-semibold);line-height:20px}
body.ta-s4 .list-item .sub{margin-top:2px;line-height:16px}
body.ta-s4 .list-item .trail{font-variant-numeric:tabular-nums;color:var(--text-2);font-size:var(--fs-caption);gap:4px}
body.ta-s4 .list-item:active{background:var(--surface-2);border-color:var(--border-strong)}

/* ---------- 6. Кнопки 52 px, поля 52 px ---------- */
body.ta-s4 .btn{min-height:var(--s4-btn);border-radius:var(--r-lg);font-weight:var(--fw-semibold);padding:0 var(--sp-5)}
body.ta-s4 .btn-sm{min-height:var(--tap);border-radius:var(--r-md);padding:0 var(--sp-3)}
body.ta-s4 .icon-btn{border-radius:var(--r-md)}
body.ta-s4 .input,body.ta-s4 .input-group,body.ta-s4 .search{min-height:var(--s4-btn);border-radius:var(--r-lg)}

/* ---------- 7. Пустые и ошибочные состояния: крупная плитка-иконка 88 px, заголовок 20 px, одно действие 52 px ---------- */
body.ta-s4 .state{padding:var(--sp-8) var(--sp-5);gap:var(--sp-2);margin:var(--sp-2) 0;border-radius:var(--s4-r-lg);background:var(--s4-tile);border:1px solid var(--border)}
body.ta-s4 .state .glyph{width:88px;height:88px;border-radius:28px;margin-bottom:var(--sp-3);background:var(--s4-tile-2);border:1px solid var(--border-strong)}
body.ta-s4 .state .glyph .i{width:40px;height:40px}
body.ta-s4 .state .h2{font-size:20px;line-height:26px}
body.ta-s4 .state p{max-width:320px}
body.ta-s4 .state .btn{width:100%;max-width:320px;min-height:var(--s4-btn);margin-top:var(--sp-4)}
body.ta-s4 .state .btn~.btn{display:none}                                 /* одно действие */
body.ta-s4 .state-inline{padding:var(--sp-6) var(--sp-4)}

/* ---------- 8. Скелетоны по форме плиток ---------- */
body.ta-s4 .skel{background:rgb(255 255 255 / .05);border-radius:var(--r-md)}
body.ta-s4 .skel-line{border-radius:var(--r-pill)}
body.ta-s4 .skel-circle,body.ta-s4 .skel-tile{border-radius:14px;width:44px;height:44px}
body.ta-s4 .skel::after{background:linear-gradient(90deg,transparent,rgb(230 237 243 / .05),transparent);animation-duration:1.6s}
body.ta-s4.ta-bg-lite .skel::after{animation:none}

/* ---------- 9. Тосты: плитка над меню ---------- */
body.ta-s4 .toast-region,body.ta-s4 .has-tabbar .toast-region,body.ta-s4 .toast-region.above-tabbar{bottom:calc(var(--s4-bar-off) + var(--sp-2))}
body.ta-s4 .toast{min-height:56px;border-radius:var(--s4-r);background:var(--surface-2);border-color:var(--border-strong);padding:var(--sp-2) var(--sp-2) var(--sp-2) var(--sp-4)}

/* ---------- 10. Листы и модалки C: всё — лист снизу (радиус 24 сверху), ручка, кнопки 52 px столбцом, градиент за листом ---------- */
body.ta-s4 .sheet-backdrop{background:rgb(5 7 10 / .66);overflow:hidden}
body.ta-s4 .sheet-backdrop::before{content:"";position:absolute;left:-25%;top:-25%;width:150%;height:150%;pointer-events:none;z-index:0;
  background:radial-gradient(42% 32% at 30% 30%,rgb(var(--glow-green) / .24),rgb(var(--glow-green) / 0) 70%),radial-gradient(38% 30% at 74% 62%,rgb(var(--glow-blue) / .24),rgb(var(--glow-blue) / 0) 70%);
  transform:translate3d(-6%,-4%,0);animation:ta-s4-drift 16s ease-in-out infinite alternate;animation-play-state:paused}
body.ta-s4 .sheet-backdrop.open::before,body.ta-s4 .sheet-backdrop:target::before{animation-play-state:running;will-change:transform}
@keyframes ta-s4-drift{from{transform:translate3d(-6%,-4%,0)}to{transform:translate3d(6%,5%,0)}}
body.ta-s4 .sheet{position:relative;z-index:1;border-radius:var(--s4-r-lg) var(--s4-r-lg) 0 0;background:var(--surface-2);background-image:none;border:1px solid var(--border);border-bottom:0}
body.ta-s4 .sheet .grabber{width:40px;height:4px;background:var(--border-strong);margin-bottom:var(--sp-3)}
body.ta-s4 .sheet .h2{font-size:20px;line-height:26px}
body.ta-s4 .sheet .actions{position:sticky;bottom:calc(-1 * (var(--sp-4) + var(--safe-bottom)));flex-direction:column;gap:var(--sp-2);
  margin:var(--sp-5) calc(-1 * (var(--page-x) + var(--safe-right))) calc(-1 * (var(--sp-4) + var(--safe-bottom))) calc(-1 * (var(--page-x) + var(--safe-left)));
  padding:var(--sp-3) calc(var(--page-x) + var(--safe-right)) calc(var(--sp-4) + var(--safe-bottom)) calc(var(--page-x) + var(--safe-left));background:linear-gradient(180deg,rgb(26 33 43 / 0),var(--surface-2) 28%)}
body.ta-s4 .sheet .actions .btn{width:100%}
body.ta-s4 .ta-pu-dlg{border-radius:var(--s4-r-lg) var(--s4-r-lg) 0 0}

/* ---------- 11. «Ещё» сеткой 3×N (nav-v3 #more и будущие листы): пункты-плитки ---------- */
body.ta-s4 .sheet .ta-s4-more,body.ta-s4 .sheet .ta-nv-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2);margin-top:var(--sp-3)}
body.ta-s4 .ta-s4-more>a,body.ta-s4 .sheet .ta-nv-items>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-2);min-height:92px;padding:var(--sp-2);
  border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);color:var(--text);font-size:var(--fs-caption);text-align:center}

/* ---------- 12. Загрузка ---------- */
body.ta-s4 .ld-bar{height:8px;border-radius:var(--r-pill)}
body.ta-s4 .ld-label{font-size:var(--fs-body);font-weight:var(--fw-semibold)}

/* ---------- 13. Лёгкий режим и reduced-motion ---------- */
body.ta-s4.ta-bg-lite .sheet-backdrop::before{animation:none;will-change:auto;transform:none}
.no-anim body.ta-s4 .sheet-backdrop::before{animation:none}
@media (prefers-reduced-motion: reduce){
  body.ta-s4 .sheet-backdrop::before{animation:none!important;will-change:auto!important;transform:none}
  body.ta-s4 .tab::before,body.ta-s4 .page-head,body.ta-s4 .page-head .h1{transition:none}
}
/* фикс 20:05: заголовок не рвётся по слогам рядом с бейджем на 360 */
body.ta-s4 .page-head .h1{font-size:clamp(24px,7.4vw,30px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal}
body.ta-s4 .page-head .badge{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.ta-s4 .page-head .h1{flex:0 0 auto;max-width:70%}  body.ta-s4 .page-head .h1+.badge,body.ta-s4 .page-head .badge:last-child{margin-left:auto}
body.ta-s4 .page-head .badge{padding:0 8px;font-size:12px;gap:4px}
@media (max-width:380px){body.ta-s4 .page-head .badge .i{display:none}body.ta-s4 .page-head .h1{font-size:26px}}
@media (max-width:380px){body.ta-s4 .page-head{gap:var(--sp-2)}body.ta-s4 .page-head>.ta-logo3d--header{width:40px;height:40px;padding:5px}}
@media (max-width:380px){body.ta-s4 .page-head .badge{padding:0 6px}}
/* <<< frame-v4.css */
/* >>> leads-v5.css (tools-bundle-leads-v5.sh, u83) */
/* leads-v5.css — «v3 · Лиды: акцент, номера, кнопки, компактная раскладка» (02.11.2026). Подключение: <link> ПОСЛЕ components.css и frame-v4.css, без @import.
   Работает на реальной разметке frontend/app.js (cardUnanswered / cardReply / answerBody / editBlock / leadMsg) — классы не переименованы, только добавлены.
   Акцент: data-ci="0…9" на article.ta-lead (ставит leads-v5.js из id: index = id mod 10). Номер — CSS counter по видимым карточкам. Золото не используется. */

/* ---------- 1. Акцент лида: полоса слева, рамка, подкрашенный заголовок ---------- */
.ta-lead{--lc:var(--m,var(--border-strong));--lc-bg:rgb(255 255 255 / .03);--lc-line:var(--border)}
.ta-lead[data-ci="0"]{--lc:var(--lead-c0);--lc-bg:var(--lead-c0-bg);--lc-line:var(--lead-c0-line)}
.ta-lead[data-ci="1"]{--lc:var(--lead-c1);--lc-bg:var(--lead-c1-bg);--lc-line:var(--lead-c1-line)}
.ta-lead[data-ci="2"]{--lc:var(--lead-c2);--lc-bg:var(--lead-c2-bg);--lc-line:var(--lead-c2-line)}
.ta-lead[data-ci="3"]{--lc:var(--lead-c3);--lc-bg:var(--lead-c3-bg);--lc-line:var(--lead-c3-line)}
.ta-lead[data-ci="4"]{--lc:var(--lead-c4);--lc-bg:var(--lead-c4-bg);--lc-line:var(--lead-c4-line)}
.ta-lead[data-ci="5"]{--lc:var(--lead-c5);--lc-bg:var(--lead-c5-bg);--lc-line:var(--lead-c5-line)}
.ta-lead[data-ci="6"]{--lc:var(--lead-c6);--lc-bg:var(--lead-c6-bg);--lc-line:var(--lead-c6-line)}
.ta-lead[data-ci="7"]{--lc:var(--lead-c7);--lc-bg:var(--lead-c7-bg);--lc-line:var(--lead-c7-line)}
.ta-lead[data-ci="8"]{--lc:var(--lead-c8);--lc-bg:var(--lead-c8-bg);--lc-line:var(--lead-c8-line)}
.ta-lead[data-ci="9"]{--lc:var(--lead-c9);--lc-bg:var(--lead-c9-bg);--lc-line:var(--lead-c9-line)}
/* классы-синонимы .ta-lead-c0…c9 (если Dev2 удобнее класс, а не data-атрибут) */
.ta-lead.ta-lead-c0{--lc:var(--lead-c0);--lc-bg:var(--lead-c0-bg);--lc-line:var(--lead-c0-line)} .ta-lead.ta-lead-c1{--lc:var(--lead-c1);--lc-bg:var(--lead-c1-bg);--lc-line:var(--lead-c1-line)}
.ta-lead.ta-lead-c2{--lc:var(--lead-c2);--lc-bg:var(--lead-c2-bg);--lc-line:var(--lead-c2-line)} .ta-lead.ta-lead-c3{--lc:var(--lead-c3);--lc-bg:var(--lead-c3-bg);--lc-line:var(--lead-c3-line)}
.ta-lead.ta-lead-c4{--lc:var(--lead-c4);--lc-bg:var(--lead-c4-bg);--lc-line:var(--lead-c4-line)} .ta-lead.ta-lead-c5{--lc:var(--lead-c5);--lc-bg:var(--lead-c5-bg);--lc-line:var(--lead-c5-line)}
.ta-lead.ta-lead-c6{--lc:var(--lead-c6);--lc-bg:var(--lead-c6-bg);--lc-line:var(--lead-c6-line)} .ta-lead.ta-lead-c7{--lc:var(--lead-c7);--lc-bg:var(--lead-c7-bg);--lc-line:var(--lead-c7-line)}
.ta-lead.ta-lead-c8{--lc:var(--lead-c8);--lc-bg:var(--lead-c8-bg);--lc-line:var(--lead-c8-line)} .ta-lead.ta-lead-c9{--lc:var(--lead-c9);--lc-bg:var(--lead-c9-bg);--lc-line:var(--lead-c9-line)}

.lh-list .card.ta-lead{border-color:var(--lc-line);padding-top:0;overflow:hidden}
.lh-list .ta-lead::before{top:0;bottom:0;width:4px;border-radius:0;background:var(--lc);z-index:1}
.lh-list .ta-lead-top{margin:0 calc(-1 * var(--sp-4)) 0 calc(-1 * (var(--sp-4) + 3px));padding:10px var(--sp-4) 10px calc(var(--sp-4) + 3px);
  background:var(--lc-bg);border-bottom:1px solid var(--lc-line);gap:var(--sp-2)}
.lh-list .ta-lead-top>.ta-manager{margin-right:auto}

/* ---------- 2. Номер карточки 1, 2, 3… по видимым (display:none не считается) + форма значка как вторичный признак цвета ---------- */
.lh-list{counter-reset:ta-lead}
.lh-list .ta-lead{counter-increment:ta-lead}
.lh-list .ta-lead-top::before{content:counter(ta-lead);order:-1;flex:none;display:grid;place-items:center;min-width:30px;height:30px;padding:0 6px;
  border-radius:50%;background:var(--lc);color:var(--bg);font-weight:var(--fw-bold,700);font-size:14px;line-height:1;font-variant-numeric:tabular-nums}
.lh-list .ta-lead[data-n] .ta-lead-top::before{content:attr(data-n)}      /* если Dev2 отдаёт номер атрибутом */
.lh-list .ta-lead[data-ci="1"] .ta-lead-top::before,.lh-list .ta-lead[data-ci="4"] .ta-lead-top::before,.lh-list .ta-lead[data-ci="7"] .ta-lead-top::before{border-radius:8px}          /* квадрат */
.lh-list .ta-lead[data-ci="2"] .ta-lead-top::before,.lh-list .ta-lead[data-ci="5"] .ta-lead-top::before,.lh-list .ta-lead[data-ci="8"] .ta-lead-top::before{border-radius:15px 4px 15px 4px} /* лист */
.lh-list .ta-lead[hidden]{display:none}

/* ---------- 3. Подписи блоков «Вопрос» / «Ответ», RU сверху, EN-оригинал свёрнут (.ta-v5-en-closed — leads-v5.js) ---------- */
.lh-list .ta-msg{display:flex;flex-direction:column;border-radius:var(--r-lg)}
.lh-list .ta-msg::before,.lh-list .ta-reply::before{content:attr(data-cap);display:block;padding:8px var(--sp-3) 0;font-size:var(--fs-micro);line-height:var(--lh-micro);
  font-weight:var(--fw-semibold);letter-spacing:var(--ls-caps,.04em);text-transform:uppercase;color:var(--text-2)}
.lh-list .ta-msg:not([data-cap])::before{content:"Вопрос лида"}
.lh-list .ta-reply:not([data-cap])::before{content:"Ответ"}
.lh-list .ta-reply:has(>.ta-reply-head)::before{display:none}              /* в «Ответах лидам» подпись уже в шапке блока */
.lh-list .ta-msg .ru{order:-1;background:var(--surface-2);color:var(--text);border-top:0}
.lh-list .ta-msg .ru p{font-size:var(--fs-body);line-height:21px}
.lh-list .ta-msg .orig{background:var(--bg);border-top:1px solid var(--border)}
.lh-list .ta-msg:not(:has(.ru)) .orig{border-top:0;background:var(--surface-2)}
.lh-list .ta-msg .orig p{font-size:var(--fs-caption);line-height:18px;color:var(--text-2)}
.lh-list .ta-reply{display:flex;flex-direction:column;border-radius:var(--r-lg)}
.lh-list .ta-reply .ru{order:0;border-top:0;padding-top:var(--sp-2)}
.lh-list .ta-reply .ru p{font-size:var(--fs-body);line-height:21px;color:var(--text)}
.lh-list .ta-reply .en{order:1;border-top:1px solid rgb(43 212 127 / .2);padding-top:var(--sp-2)}
.lh-list .ta-reply .en p{font-size:var(--fs-caption);line-height:19px;color:var(--text-2)}
.lh-list .ta-reply>p.caption{order:2;padding:0 var(--sp-3) var(--sp-2)}
.ta-v5-en-toggle{order:1;display:flex;align-items:center;gap:6px;width:100%;min-height:var(--tap);padding:0 var(--sp-3);border-top:1px solid var(--border);
  color:var(--text-2);font-size:var(--fs-caption);font-weight:var(--fw-medium);text-align:left}
.ta-v5-en-toggle .i{width:16px;height:16px;transition:transform var(--dur) var(--ease)}
.ta-v5-en-toggle[aria-expanded="true"] .i{transform:rotate(180deg)}
.ta-v5-en-toggle:hover{color:var(--text)}
.ta-v5-en-toggle:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent)}
.ta-reply>.ta-v5-en-toggle{border-top-color:rgb(43 212 127 / .2)}
.ta-v5-en-closed>.orig,.ta-v5-en-closed>.en{display:none}
.ta-msg .ta-v5-en-toggle{order:0}

/* ---------- 4. Метки проверки (как во frontend/styles.css; «спорный» — не золото, а warning) ---------- */
.ta-rv{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--r-pill);border:1px solid var(--border-strong);
  font-size:var(--fs-micro);line-height:var(--lh-micro);font-weight:var(--fw-semibold);color:var(--text-2);background:rgb(255 255 255 / .03)}
.ta-rv-unchecked{color:var(--text-2)}
.ta-rv-disputed{color:var(--warning);border-color:rgb(245 165 36 / .45)}
.ta-rv-verified{color:var(--success);border-color:rgb(47 191 113 / .45)}
.ta-rv-corrected,.ta-rv-edited{color:#7FB0FF;border-color:rgb(76 141 255 / .45)}

/* ---------- 5. «Править ответ» (вторичная) и «Сохранить правку» (главная, зелёная): 48 px, рамка, hover, :active, :focus-visible, disabled, «сохраняется» ---------- */
.ta-edit{margin-top:var(--sp-3)}
.ta-edit>summary{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:48px;padding:0 var(--sp-4);border-radius:var(--r-lg);
  border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);font-size:var(--fs-body);font-weight:var(--fw-semibold);cursor:pointer;list-style:none;
  transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}
.ta-edit>summary::-webkit-details-marker{display:none}
.ta-edit>summary.caption,.ta-edit>summary.t2{font-size:var(--fs-body);color:var(--text)}
.ta-edit>summary .i{width:18px;height:18px;color:var(--text-2)}
.ta-edit>summary:hover{background:#222B37;border-color:#435263}
.ta-edit>summary:active{transform:scale(.98);background:var(--surface)}
.ta-edit>summary:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.ta-edit[open]>summary{border-color:var(--accent);background:var(--accent-tint)}
.ta-edit[open]>summary .i{color:var(--accent)}
.ta-edit .textarea{min-height:132px;border-radius:var(--r-lg);font-size:var(--fs-body);line-height:21px}
.ta-edit [data-edit]{min-height:48px;border-radius:var(--r-lg);border:1px solid #23B26A;background:var(--brand);color:#06120B;font-weight:var(--fw-bold,700);
  box-shadow:0 1px 0 rgb(255 255 255 / .25) inset,0 4px 14px rgb(43 212 127 / .18)}
.ta-edit [data-edit] .i{color:#06120B}
.ta-edit [data-edit]:hover{background:#45E094}
.ta-edit [data-edit]:active{transform:scale(.98);background:#22BF71}
.ta-edit [data-edit]:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.ta-edit [data-edit]:disabled,.ta-edit [data-edit][aria-disabled="true"]{background:var(--surface-2);border-color:var(--border);color:var(--text-2);box-shadow:none;cursor:not-allowed}
.ta-edit [data-edit]:disabled .i{color:var(--text-2)}
.ta-edit [data-edit][aria-busy="true"],.ta-edit [data-edit]:disabled.is-saving{background:rgb(43 212 127 / .22);border-color:rgb(43 212 127 / .5);color:var(--text);cursor:progress}
.ta-edit [data-edit][aria-busy="true"]>.i{display:none}
.ta-edit [data-edit][aria-busy="true"]::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid rgb(230 237 243 / .35);border-top-color:var(--text);animation:ta-v5-spin .8s linear infinite}
@keyframes ta-v5-spin{to{transform:rotate(360deg)}}

/* ---------- 6. Компактность: меньше воздуха, удобно листать ---------- */
.lh-list .ta-lead-meta{margin-top:var(--sp-2)}
.lh-list .ta-msg,.lh-list .ta-reply{margin-top:var(--sp-2)}
.lh-list .ta-answer{margin-top:var(--sp-2)}
.lh-list .ta-answer-in{padding:0 var(--sp-2) var(--sp-2)}
.lh-list .ta-lead [data-go]{min-height:52px;border-radius:var(--r-lg)}   /* «Скопировать ответ» — главная */
.lh-list .ta-lead .field.mt-3{margin-top:var(--sp-3)}

@media (prefers-reduced-motion: reduce){.ta-edit>summary,.ta-v5-en-toggle .i{transition:none}.ta-edit [data-edit][aria-busy="true"]::before{animation:none}.ta-edit>summary:active,.ta-edit [data-edit]:active{transform:none}}
.ta-bg-lite .ta-edit [data-edit]{box-shadow:none}
.no-anim .ta-edit [data-edit][aria-busy="true"]::before{animation:none}
.lh-list .ta-msg::before,.lh-list .ta-reply::before{order:-2}   /* подпись над RU (RU — order:-1) */
/* leads-u83.css — Dev2, u83/u83b: стык v5 Дизайна (leads-v5.css) с разметкой frontend/app.js. Вшивается СРАЗУ ПОСЛЕ leads-v5.css (tools-bundle-leads-v5.sh).
   u83b: порядок как в макете — RU сверху, оригинал свёрнут в родном <details class="ta-tr ta-v5-orig"> (summary = вид .ta-v5-en-toggle).
   У блоков своя шапка .ta-blk-h (подпись + язык/версия) — подпись v5 (::before) не дублируем. Откат — убрать этот файл из бандла. */
.lh-list .ta-msg.ta-capped::before,.lh-list .ta-reply.ta-capped::before{content:none;display:none}
.lh-list .ta-msg.ta-q{background:var(--surface-2);border-color:var(--border)}
.lh-list .ta-msg.ta-q>.ru,.lh-list .ta-reply.ta-ans>.ru{order:0;background:transparent;border-top:0;padding:2px var(--sp-3) var(--sp-2)}
.lh-list .ta-msg.ta-q>.orig{padding:2px var(--sp-3) var(--sp-2);background:transparent;border-top:0}   /* без перевода: оригинал как есть, основной текст */
.lh-list .ta-msg.ta-q>.orig p{font-size:var(--fs-body);line-height:21px;color:var(--text)}
.lh-list .ta-tr>summary.ta-v5-en-toggle{border-top:0;order:0}
.lh-list .ta-tr .orig{display:flex;gap:var(--sp-2);padding:0 var(--sp-3) var(--sp-3);background:transparent;border-top:0}
.lh-list .ta-tr .orig p{margin:0;flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
/* «Ответ»: без перевода EN — основной текст; свёрнутый EN (то, что уходит лиду) — мельче, но с кнопкой копирования */
.lh-list .ta-reply.ta-ans>.en{order:0;border-top:0;padding:2px var(--sp-1) var(--sp-2) var(--sp-3)}
.lh-list .ta-reply.ta-ans>.en p{margin:0;font-size:var(--fs-body);line-height:21px;color:var(--text)}
.lh-list .ta-tr .en{display:flex;gap:var(--sp-2);align-items:flex-start;border-top:0;padding:0 var(--sp-1) var(--sp-2) var(--sp-3)}
.lh-list .ta-tr .en p{margin:0;flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.lh-list .ta-reply.ta-ans>.ta-tr{order:1}
.lh-list .ta-reply.ta-ans>.ta-note{order:2;margin:0;padding:0 var(--sp-3) var(--sp-2)}
/* u84: «Написать свой ответ», «Перевод готовится», вложения лида */
.lh-list .ta-attach{display:flex;align-items:center;gap:6px;margin:0;padding:0 var(--sp-3) var(--sp-2);order:3}
.lh-list .ta-mt .field{display:flex;flex-direction:column;gap:var(--sp-2)}
.lh-list .ta-mt .ta-mt-hint{margin:0;display:flex;align-items:center;gap:6px}
.lh-list .ta-mt textarea{min-height:96px}
.lh-list .ta-mt-wait b{display:inline-block;margin-bottom:2px}
.lh-list .ta-acts .ta-act[data-card-refresh]{flex:1 1 100%}
/* u86: «Перевести» — подсказка «Лиду ничего не отправляется» под кнопкой */
.ta-mt .ta-mt-note { margin: 8px 0 0; display: flex; gap: 6px; align-items: flex-start; }
.ta-mt .ta-mt-note .i { flex: none; margin-top: 2px; }
/* u88: «Неотвеченные» — категория (select + цветной бейдж), «Получить ответ», подсветка карточки после перехода в «Ответы лидам» */
.lh-cat { display: flex; align-items: center; gap: 8px; margin-top: var(--sp-2); min-width: 0; }
.lh-cat-l { flex: none; font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--text-2); }
.lh-cat .lh-cat-sel { flex: 1 1 auto; min-width: 0; width: auto; max-width: 100%; min-height: 40px; padding: 8px 12px; text-overflow: ellipsis; }
.ta-cat { flex: none; font-weight: var(--fw-semibold); }
.ta-cat-purchase { background: var(--success-tint); color: var(--success); border-color: rgb(47 191 113 / .40); }
.ta-cat-royalty { background: rgb(167 123 255 / .14); color: #B794FF; border-color: rgb(167 123 255 / .45); }   /* u89: «Роялти» — фиолетовая, отлична от покупки/скама/базового/«Есть ответ» */
.ta-cat-scam { background: var(--danger-tint); color: var(--danger); border-color: rgb(240 74 74 / .45); }
.ta-cat-basic { background: var(--surface-2, var(--surface)); color: var(--text-2); border-color: var(--border, rgb(127 127 127 / .3)); }
.lh-list .ta-get-ans { min-height: 44px; }
.lh-list .ta-lead.ta-focus { scroll-margin-top: 12px; animation: ta-focus-pulse 2.6s var(--ease, ease) 1; box-shadow: 0 0 0 2px var(--brand); }
@keyframes ta-focus-pulse { 0%, 60% { box-shadow: 0 0 0 3px var(--brand), 0 0 0 8px rgb(43 212 127 / .22); } 100% { box-shadow: 0 0 0 2px var(--brand); } }
@media (prefers-reduced-motion: reduce) { .lh-list .ta-lead.ta-focus { animation: none; } }
@media (max-width: 380px) { .lh-cat-l { display: none; } .ta-cat { max-width: 46%; } }
/* u90: «Вопрос лида» без перевода (перевод ещё готовится) — оригинал виден сразу, пометка в шапке блока; порядок блоков не меняется */
.ta-q .ta-tr-wait { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-size: var(--fs-caption, 12px); color: var(--warning); white-space: nowrap; }
.ta-q .ta-tr-wait .i { width: 12px; height: 12px; }
@media (max-width: 380px) { .ta-q .ta-tr-wait { font-size: 11px; } }
/* <<< leads-v5.css */