/* ═══════════════════════════════════════════════════════════════════════════
   VM-Agents: наши экраны на визуале платформы VM GEO.

   Основа — platform.css (копия из «VM Geo Platform New», не править: правила —
   ВИЗУАЛ.md владельца от 24.09.2026). Этот файл только надевает те же цвета,
   размеры и детали на разметку наших экранов. Своих цветов нет: только
   rgb(var(--vm-*)). Размеры — шкала платформы (4…32), скругления 11/12/18/22.

   Одно отступление, по регламенту UI_RULES (UI-17): на телефоне кнопки и поля
   не ниже 44 px — палец не компьютерная мышь. На компьютере — как в платформе.
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/inter-cyrillic-400.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/inter-latin-400.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/inter-cyrillic-500.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/inter-latin-500.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/inter-cyrillic-600.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/inter-latin-600.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/inter-cyrillic-700.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/inter-latin-700.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;
  src:url('/static/fonts/inter-cyrillic-800.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;
  src:url('/static/fonts/inter-latin-800.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Oswald (заголовки) — со своего сервера, как Inter: адрес посетителя не уходит Google (P10 L4b). Лицензия OFL — fonts/OFL-oswald.txt. */
@font-face{font-family:'Oswald';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/oswald-cyrillic-500.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Oswald';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/oswald-latin-500.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Oswald';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/oswald-cyrillic-600.woff2') format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Oswald';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/oswald-latin-600.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ── Служебное ── */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap; border:0}
.skip-link{position:absolute; left:12px; top:-60px; z-index:60; padding:8px 16px;
  border-radius:var(--r-btn); background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text))}
.skip-link:focus{top:12px}
:focus-visible{outline:2px solid rgb(var(--vm-accent)); outline-offset:2px}
main:focus{outline:none}
[hidden]{display:none !important}

/* ── Текст наших экранов ── */
.page h1, .cand h1{font-family:var(--font-display); text-transform:uppercase; letter-spacing:.04em;
  font-weight:600; font-size:30px; line-height:36px; color:rgb(var(--vm-text-strong))}
@media(min-width:640px){ .page h1{font-size:36px; line-height:40px} }
.cand h1{font-size:24px; line-height:32px}
h2{font-size:16px; line-height:24px; font-weight:600; color:rgb(var(--vm-text-strong))}
h3{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text))}
p, li, dd, td{font-size:14px; line-height:24px}
.muted{color:rgb(var(--vm-muted))}
.small, .small p{font-size:12px; line-height:16px}
.ink{color:rgb(var(--vm-text-strong))}
.lead{color:rgb(var(--vm-muted))}
.pre-wrap{white-space:pre-wrap}
.empty{color:rgb(var(--vm-muted)); font-size:14px}
ul.tight, ol.tight{margin:0; padding-left:20px}
ul.tight li, ol.tight li{line-height:24px}
a:not([class]){color:rgb(var(--vm-accent)); font-weight:500}
a:not([class]):hover{text-decoration:underline}
.quiet-link{color:rgb(var(--vm-muted)); font-size:14px}
.quiet-link:hover{color:rgb(var(--vm-accent))}
.back-link{display:inline-flex; align-items:center; gap:6px}
.arrow{width:16px; height:16px; flex:none}
code{font-size:13px; padding:2px 6px; border-radius:6px; background:rgb(var(--vm-surface))}

/* ── Карточка: наша .panel = .card платформы ── */
.panel{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel));
  padding:24px; box-shadow:var(--vm-shadow-card)}
@media(max-width:639px){ .panel{padding:20px} }
/* Ритм внутри: платформа обнуляет поля, поэтому интервалы задаём здесь. */
.panel.panel > * + *{margin-top:16px}
.panel.panel > h2 + *, .panel.panel > h3 + *{margin-top:8px}
.panel.panel > * + h3{margin-top:24px}
/* ПРАВИЛО ВЫРАВНИВАНИЯ (владелец 24.09.2026, «плашки то выше, то ниже»):
   скрытые служебные поля формы (csrf_token, ключи) — не соседи в раскладке.
   Отступ сверху получает только видимый элемент, перед которым есть другой
   видимый. Иначе кнопка в форме из одних скрытых полей и кнопки опускалась на
   12 px ниже соседней ссылки в той же строке. Проверяется tools/check_layout.py. */
form > :where(:not(input[type=hidden])) ~ :where(:not(input[type=hidden])){margin-top:12px}
form > label + :is(input, select, textarea){margin-top:4px}
form > .field-row + label, form > fieldset + *{margin-top:16px}
details.details > * + *, details > * + *{margin-top:12px}

/* ── Поля: наши голые элементы = .lbl / .inp платформы ── */
label{display:block; font-size:14px; line-height:20px; font-weight:500; color:rgb(var(--vm-text-soft))}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]), select, textarea{
  display:block; width:100%; border-radius:var(--r-field); border:1px solid var(--vm-line);
  background:rgb(var(--vm-panel)); padding:8px 12px; font-size:14px; line-height:20px;
  color:rgb(var(--vm-text)); outline:none; transition:border-color .15s}
input:focus, select:focus, textarea:focus{border-color:rgb(var(--vm-accent))}
input::placeholder, textarea::placeholder{color:rgb(var(--vm-faint))}
textarea{min-height:96px; resize:vertical; line-height:24px}
input[type=file]{display:block; width:100%; font-size:12px; padding:6px 8px;
  border-radius:var(--r-field); border:1px solid var(--vm-line); background:rgb(var(--vm-panel))}
input[type=checkbox], input[type=radio]{accent-color:rgb(var(--vm-accent)); width:16px; height:16px; margin:2px 0 0; flex:none}
label.check, .check{display:flex; align-items:flex-start; gap:8px; font-size:14px; line-height:20px;
  font-weight:400; color:rgb(var(--vm-text-soft)); cursor:pointer}
fieldset{border:0; padding:0; margin-left:0; margin-right:0; margin-bottom:0; min-width:0}
fieldset > * + *{margin-top:8px}
legend{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text)); padding:0; margin-bottom:8px}
.field-row{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.field-row > div{min-width:0}
.field-row label + *{margin-top:4px}
.field-meta{display:flex; justify-content:space-between; gap:12px; font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.form-feedback{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.form-feedback.error{color:rgb(var(--vm-bad))}
.form-feedback:empty{display:none}
@media(max-width:639px){ .field-row{grid-template-columns:1fr} }

/* ── Кнопки: наши button / .btn = .btn-primary, .secondary = .btn-outline ── */
button:where(:not(.side-link):not(.icon-btn):not(.switch-b):not(.chip):not(.linkbtn):not(.text-button)),
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:var(--r-btn); border:1px solid transparent; padding:8px 16px;
  font-size:14px; line-height:20px; font-weight:600; cursor:pointer; text-align:center;
  background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text));
  transition:background-color .15s, border-color .15s, color .15s}
button:where(:not(.side-link):not(.icon-btn):not(.switch-b):not(.chip):not(.linkbtn):not(.text-button)):hover,
.btn:hover{background:rgb(var(--vm-accent-strong))}
button.secondary, .btn.secondary, .btn.btn-outline{border-color:var(--vm-line-strong);
  background:rgb(var(--vm-panel)); color:rgb(var(--vm-text-soft))}
button.secondary:hover, .btn.secondary:hover, .btn.btn-outline:hover{border-color:var(--vm-line-strongest);
  background:rgb(var(--vm-panel))}
.btn.btn-soft{border-color:var(--vm-accent-line); background:var(--vm-accent-bg); color:rgb(var(--vm-accent-strong))}
.btn.ghost{background:none; border-color:transparent; color:rgb(var(--vm-accent))}
.btn.btn-sm{padding:6px 12px; font-weight:500}
button:disabled:not(.chip), .btn[disabled]{cursor:not-allowed; background:var(--vm-disabled) !important;
  color:rgb(var(--vm-faint)) !important; border-color:transparent !important}
.text-button, .linkbtn{border:0; background:none; padding:0; cursor:pointer; font-size:14px;
  line-height:20px; font-weight:500; color:rgb(var(--vm-accent))}
.full-width{display:flex; width:100%}
.actions{display:flex; flex-wrap:wrap; align-items:center; gap:8px}
.actions form{margin:0; display:flex}
.actions > *{margin-top:0 !important}
.actions > form + form{margin-top:0}
.inline-form{display:inline}

/* На телефоне — область нажатия не меньше 44 px (UI-17). */
@media(max-width:767px){
  button:where(:not(.side-link):not(.icon-btn):not(.switch-b):not(.text-button)), .btn,
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select{min-height:44px}
  .actions > button, .actions > .btn, .actions > form, .actions > form > button{flex:1 1 auto}
  label.check{min-height:44px; align-items:center}
  summary{min-height:44px}
}

/* ── Метки и сообщения ── */
.badge:not(.good):not(.bad):not(.warn):not(.accent):not(.ok):not(.demo){background:rgb(var(--vm-panel-soft)); color:rgb(var(--vm-muted))}
.badge.ok{background:var(--vm-good-bg); color:rgb(var(--vm-good))}
.badge.demo{background:var(--vm-warn-bg); color:rgb(var(--vm-warn))}
.notice{border-radius:var(--r-card); border:1px solid var(--vm-warn-line); background:var(--vm-warn-bg);
  color:rgb(var(--vm-warn)); padding:12px 20px; font-size:14px; line-height:20px}
.notice.ok{border-color:var(--vm-good-line); background:var(--vm-good-bg); color:rgb(var(--vm-good))}
.notice.bad{border-color:var(--vm-bad-line); background:var(--vm-bad-bg); color:rgb(var(--vm-bad))}
.notice > * + *{margin-top:8px}
.notice ul{margin:8px 0 0; padding-left:20px}
.count{display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px;
  padding:0 6px; border-radius:999px; background:rgb(var(--vm-panel-soft)); color:rgb(var(--vm-muted));
  font-size:12px; font-weight:600}

/* ── Раскрывающиеся блоки ── */
summary{display:flex; align-items:center; gap:8px; cursor:pointer; font-size:14px; line-height:20px;
  font-weight:600; color:rgb(var(--vm-accent)); list-style:none}
summary::-webkit-details-marker{display:none}
summary::before{content:""; width:6px; height:6px; border-right:2px solid currentColor;
  border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .15s; flex:none}
details[open] > summary::before{transform:rotate(45deg)}

/* ── Таблицы ── */
table{width:100%; border-collapse:collapse; font-size:14px; line-height:20px}
th{text-align:left; font-size:12px; line-height:16px; font-weight:600; text-transform:uppercase;
  letter-spacing:.05em; color:rgb(var(--vm-muted)); padding:8px 12px; border-bottom:1px solid var(--vm-line)}
td{padding:12px; border-bottom:1px solid var(--vm-line); vertical-align:top; color:rgb(var(--vm-text))}
tr:last-child td{border-bottom:0}
.table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
.table-wrap:focus-visible{outline-offset:4px}
@media(max-width:639px){
  table.stack-on-phone, .stack-on-phone tbody, .stack-on-phone tr, .stack-on-phone td{display:block; width:100%}
  .stack-on-phone thead{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%)}
  .stack-on-phone tr{padding:12px 0; border-bottom:1px solid var(--vm-line)}
  .stack-on-phone td{border:0; padding:4px 0; display:flex; justify-content:space-between; gap:12px}
  .stack-on-phone td[data-label]::before{content:attr(data-label); color:rgb(var(--vm-muted)); font-size:12px}
}

/* ── Переписка ── */
.chat{display:flex; flex-direction:column; gap:8px}
.msg{max-width:85%; border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface));
  padding:12px 16px; font-size:14px; line-height:20px; white-space:pre-wrap; overflow-wrap:anywhere}
.msg.me{align-self:flex-end; border-color:var(--vm-accent-line); background:var(--vm-accent-bg)}
.msg.lesson{border-color:var(--vm-good-line); background:var(--vm-good-bg)}
.msg .who{display:block; margin-bottom:4px; font-size:12px; line-height:16px; font-weight:600; color:rgb(var(--vm-muted))}

/* ── Диалог подтверждения ── */
dialog.card{max-width:440px; width:calc(100vw - 32px); padding:24px; color:rgb(var(--vm-text))}
dialog::backdrop{background:var(--vm-scrim)}
dialog form > :where(:not(input[type=hidden])) ~ :where(:not(input[type=hidden])){margin-top:12px}
dialog .actions{margin-top:20px}

/* ═══════════════════ Кабинет команды ═══════════════════ */
.page-in > .notice, .page-in > .banner{margin:0}
.page-head .row{flex:none}
@media(max-width:639px){ .page-head{flex-direction:column; align-items:flex-start} }
.page-in > .back-link{margin-bottom:-20px}
.page-head .eyebrow{margin-bottom:8px}

/* Очередь кандидатов (список как «Профили в работе» платформы) */
.queue-filters{display:flex; flex-direction:column; gap:12px}
.queue-filters > * + *{margin-top:0}
.queue-search{display:flex; gap:8px}
.queue-search input{flex:1}
.queue-search button{flex:none}
.queue-more-body{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 16px; align-items:end;
  margin-top:12px; border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface)); padding:16px 20px}
.queue-more-body label + *{margin-top:4px}
.queue-more-body .filter-checks{display:flex; flex-direction:column; gap:4px}
.queue-more-body .actions{grid-column:1/-1}
@media(max-width:767px){ .queue-more-body{grid-template-columns:1fr} }
.queue-group{display:flex; flex-direction:column; gap:12px}
.group-title{display:flex; align-items:center; gap:8px; font-size:14px; line-height:20px; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
details.queue-group > summary.group-title{color:rgb(var(--vm-muted))}
.group-hint{margin:0}
.group-empty{border-radius:var(--r-card); border:1px dashed var(--vm-line-strong); padding:16px 20px; margin:0}
.person-list{display:flex; flex-direction:column; gap:8px}
.person-row{display:grid; grid-template-columns:40px minmax(160px,1.2fr) minmax(0,2fr) auto 16px; gap:16px; align-items:center;
  border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel));
  padding:16px 20px; color:rgb(var(--vm-text)); transition:border-color .15s}
.person-row:hover{border-color:var(--vm-line-strong)}
.person-row.is-ours{border-color:var(--vm-accent-line)}
.person-row.is-closed{opacity:.75}
.avatar{display:flex; width:40px; height:40px; flex:none; align-items:center; justify-content:center;
  border-radius:var(--r-btn); background:var(--vm-accent-bg); color:rgb(var(--vm-accent)); font-weight:600}
.person-main{display:flex; min-width:0; flex-direction:column; gap:2px}
.person-main strong{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text-strong));
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.person-main small{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.person-state{display:flex; flex-wrap:wrap; gap:4px; min-width:0}
.person-when{font-size:12px; line-height:16px; color:rgb(var(--vm-muted)); white-space:nowrap; text-align:right}
.person-go{color:rgb(var(--vm-faint-soft))}
.action-needed{font-size:12px; color:rgb(var(--vm-bad))}
.queue-more-rows{display:flex; flex-direction:column; align-items:center; gap:8px}
@media(max-width:639px){
  .person-row{grid-template-columns:40px minmax(0,1fr) auto; gap:8px 12px; padding:12px 16px}
  .person-row .avatar{grid-row:1/3}
  .person-state{grid-column:2/4}
  .person-when{grid-column:3; grid-row:1}
  .person-go{display:none}
}

/* Карточка кандидата */
.card-head{display:flex; align-items:center; gap:16px}
.avatar-lg{width:56px; height:56px; border-radius:var(--r-card); font-size:24px}
.card-head h1{margin-bottom:8px}
.card-head-meta{display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; font-size:14px; line-height:20px; color:rgb(var(--vm-muted))}
.dup-notice summary{color:inherit}
.dup-list{margin:8px 0 0; padding-left:20px}
.card-layout{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; align-items:start}
.card-side{grid-column:2; grid-row:1; position:sticky; top:calc(var(--vm-header-h) + 24px); display:flex; flex-direction:column; gap:16px}
.card-main{grid-column:1; grid-row:1; min-width:0; display:flex; flex-direction:column; gap:16px}
.next-step{border-radius:var(--r-panel); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); padding:20px 24px; box-shadow:var(--vm-shadow-card)}
.next-step.is-ours{border-color:var(--vm-accent-line); background:var(--vm-accent-bg)}
.next-step h2{margin:8px 0 4px}
.next-step p{font-size:14px; line-height:20px; color:rgb(var(--vm-muted))}
.next-step .btn{margin-top:16px; width:100%}
.side-facts{margin:0; border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); padding:4px 20px}
.side-facts > div{padding:12px 0; border-top:1px solid var(--vm-line)}
.side-facts > div:first-child{border-top:0}
.side-facts dt{font-size:12px; line-height:16px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.side-facts dd{margin:4px 0 0; font-size:14px; line-height:20px; overflow-wrap:anywhere}
.side-note{display:block; margin-top:4px; font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.side-block{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); padding:16px 20px}
.side-block h3{font-size:12px; line-height:16px; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
.chip-form{display:inline; margin:0}
.chips > form + form{margin-top:0}
button.chip{display:inline-flex; align-items:center; gap:4px; border-radius:999px; border:1px solid var(--vm-line);
  background:rgb(var(--vm-panel)); padding:4px 12px; font-size:12px; line-height:16px; font-weight:500;
  color:rgb(var(--vm-text-mid)); cursor:pointer; transition:border-color .15s}
button.chip:hover{border-color:var(--vm-line-strong)}
button.chip.is-on{border-color:var(--vm-accent-line); background:var(--vm-accent-bg); color:rgb(var(--vm-accent-strong))}
@media(max-width:767px){ button.chip{min-height:36px; padding:8px 12px} }
.ctabs{display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; border-bottom:1px solid var(--vm-line)}
.ctabs::-webkit-scrollbar{display:none}
.ctabs .tab{display:inline-flex; align-items:center; gap:6px}
.tab-panel{display:flex; flex-direction:column; gap:16px}
.tab-panel[hidden]{display:none}
@media(max-width:1023px){
  .card-layout{grid-template-columns:1fr}
  .card-side{grid-column:1; grid-row:1; position:static}
  .card-main{grid-column:1; grid-row:2}
}
.block-note{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface)); padding:16px 20px}
.block-note > * + *{margin-top:8px}
.block-note-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px}
.answer-quote{margin:0; border-left:2px solid var(--vm-accent-line); padding-left:12px; font-size:14px; line-height:20px; color:rgb(var(--vm-text-mid))}
.offer-copy{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface)); padding:16px 20px; font-size:14px; line-height:24px}
.meeting-card{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface)); padding:16px 20px}
.meeting-card > * + *{margin-top:8px}
.meeting-card p{font-size:14px; line-height:20px}
.meeting-card .actions{margin-top:12px}
.meeting-past{padding:16px 0; border-top:1px solid var(--vm-line)}
.meeting-past > * + *{margin-top:8px}
.recording{display:block; width:100%; max-height:420px; border-radius:var(--r-field); background:#000}
.meeting-answer fieldset{margin-top:16px}
.meeting-other{margin-top:16px}
.template-form{padding-top:20px; border-top:1px solid var(--vm-line)}
.template-form:first-of-type{border-top:0; padding-top:0}
.copy-line{display:inline-block; max-width:100%; overflow-wrap:anywhere; user-select:all}

/* Метрики */
.period-switch{display:flex; align-items:center; gap:12px}
.period-switch > * + *{margin-top:0}
.period-switch select{width:auto}
.funnel{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.funnel-head{display:flex; justify-content:space-between; gap:12px; font-size:14px; line-height:20px}
.funnel-bar{margin-top:4px; height:8px; border-radius:999px; background:rgb(var(--vm-surface)); overflow:hidden}
.funnel-bar span{display:block; height:100%; border-radius:inherit; background:rgb(var(--vm-accent))}

/* Журнал */
.log-day > * + *{margin-top:8px}
.log-day-title{font-size:14px; line-height:20px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.log-list{list-style:none; margin:0; padding:0}
.log-list li{display:grid; grid-template-columns:48px 1fr auto; gap:12px; align-items:baseline; padding:8px 0; border-top:1px solid var(--vm-line)}
.log-list li:first-child{border-top:0}
.log-list time{font-size:12px; color:rgb(var(--vm-faint)); font-variant-numeric:tabular-nums}
.log-list .is-routine{color:rgb(var(--vm-muted))}
.log-list .is-routine strong{font-weight:500}
.log-link{font-size:14px; color:rgb(var(--vm-accent)); white-space:nowrap}
@media(max-width:639px){ .log-list li{grid-template-columns:40px 1fr} .log-link{grid-column:2} }

/* Настройки: плитки разделов */
.nav-tiles{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.nav-tile{position:relative; display:flex; flex-direction:column; gap:4px; padding-right:56px}
.nav-tile strong{font-size:16px; line-height:24px; font-weight:600; color:rgb(var(--vm-text-strong))}
.nav-tile span{font-size:14px; line-height:20px; color:rgb(var(--vm-muted))}
.nav-tile-go{position:absolute; right:24px; top:50%; transform:translateY(-50%); color:rgb(var(--vm-faint-soft))}
@media(max-width:767px){ .nav-tiles{grid-template-columns:1fr} }

/* ═══════════════════ Путь кандидата (окно входа платформы) ═══════════════════ */
.cand-theme{position:fixed; top:12px; right:16px; z-index:30}
.cand{justify-content:flex-start; padding-top:48px; gap:24px}
.cand-demo{width:100%; max-width:560px; text-align:center; font-size:12px; padding:8px 16px}
.cand-col{width:100%; max-width:560px; display:flex; flex-direction:column; gap:16px}
/* «Выйти» у кандидата: тихая ссылка под шагом; область нажатия 44 px (UI-17). */
.cand-out .text-button{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 12px; color:rgb(var(--vm-muted))}
.cand-out .text-button:hover{color:rgb(var(--vm-accent))}
.cand .panel{background:rgb(var(--vm-panel) / .9); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); padding:32px 28px}
@media(max-width:639px){ .cand{padding:64px 16px 32px} .cand .panel{padding:24px 20px} }
.cand .page-head{padding-bottom:20px}
.cand .page-head h1{font-size:24px; line-height:32px}
.journey{width:100%; max-width:560px}
.journey-list{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.journey-list li{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center}
.journey-list .stage-mark{display:flex; width:32px; height:32px; align-items:center; justify-content:center;
  border-radius:999px; font-size:14px; font-weight:600; border:1px solid var(--vm-line-strong);
  color:rgb(var(--vm-faint)); background:rgb(var(--vm-panel))}
.journey-list .current .stage-mark{border-color:transparent; background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text))}
.journey-list .done .stage-mark{border-color:var(--vm-good-line); background:var(--vm-good-bg); color:rgb(var(--vm-good))}
.journey-name{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.journey-list .current .journey-name{font-weight:600; color:rgb(var(--vm-text))}

/* Приветствие */
.start-steps{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.start-steps li{display:flex; align-items:center; gap:12px}
.start-num{display:flex; width:32px; height:32px; flex:none; align-items:center; justify-content:center;
  border-radius:999px; border:1px solid var(--vm-accent-line); background:var(--vm-accent-bg);
  color:rgb(var(--vm-accent)); font-size:14px; font-weight:600}
.start-text{font-size:14px; line-height:20px; color:rgb(var(--vm-text))}
.start-note{font-size:14px; line-height:20px; color:rgb(var(--vm-muted))}

/* Вход */
.auth-options{display:flex; flex-direction:column; gap:8px}
.auth-options form{margin:0}
.auth-option{width:100%; justify-content:flex-start !important; gap:12px}
.auth-option .arrow{margin-left:auto}
.auth-icon{display:flex; width:28px; height:28px; flex:none; align-items:center; justify-content:center; border-radius:8px}
.auth-icon svg{width:18px; height:18px}
.auth-icon-yandex{background:#FC3F1D; color:#fff; font-weight:700}
.auth-option.secondary .auth-icon-yandex{box-shadow:none}
.staff-entry{text-align:center; font-size:12px; line-height:16px}
.staff-entry a{color:rgb(var(--vm-muted))}
.demo-code{font-family:var(--font-display); font-size:32px; line-height:40px; letter-spacing:.2em; text-align:center;
  border-radius:var(--r-card); border:1px dashed var(--vm-accent-line); background:var(--vm-accent-bg); color:rgb(var(--vm-accent-strong)); padding:12px}
.login-layout{display:flex; flex-direction:column; gap:16px}
.login-layout .page-head{padding-bottom:0; border:0}

/* Соглашения */
.consent-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px}
.consent-list li{display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-surface)); padding:12px 16px}
.consent-list .check em{display:inline-block; margin-left:8px; font-style:normal; font-size:12px; color:rgb(var(--vm-faint))}
.doc-link{flex:none; font-size:14px; color:rgb(var(--vm-accent))}
.read-note{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.document-copy{white-space:pre-wrap; font-size:14px; line-height:24px}

/* Анкета-мастер */
.wizard-step > * + *{margin-top:4px}
.wizard-step > label{margin-top:16px}
.wizard-step > legend + label{margin-top:0}
.wizard-nav{display:flex; flex-direction:column; gap:8px}

/* Интервью */
.section-top{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; font-size:12px}
.progress-track{height:6px; border-radius:999px; background:rgb(var(--vm-surface)); overflow:hidden}
.progress-fill{height:100%; border-radius:inherit; background:rgb(var(--vm-accent)); transition:width .3s}
.current-question > * + *{margin-top:8px}
.current-question h2{font-size:18px; line-height:28px}
.question-copy{font-size:14px; line-height:24px; color:rgb(var(--vm-text-soft))}
.completion{text-align:center; align-items:center}
.completion-mark{display:inline-flex; width:48px; height:48px; align-items:center; justify-content:center; border-radius:999px;
  background:var(--vm-good-bg); color:rgb(var(--vm-good)); font-size:24px}
.transcript{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); padding:16px 20px}
.step-card > * + *{margin-top:16px}
@media(prefers-reduced-motion:reduce){ *{transition:none !important; animation:none !important} }
.empty-state{text-align:center}
.empty-state > * + *{margin-top:8px}

/* Вход сотрудника — компактная карточка, как окно входа платформы (384 px). */
.cand .panel.login-compact{width:100%; max-width:384px; margin:0 auto}

/* Календарь встреч на месяц. На широком экране в клетке — время и кандидат,
   на телефоне — число и точки, подробности списком ниже. */
.btn.btn-ic{width:34px; height:34px; padding:0}
@media(max-width:767px){ .btn.btn-ic{width:44px; height:44px} }
.cal-bar{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px}
.cal-title{min-width:160px; text-align:center; font-family:var(--font-display); font-size:20px; line-height:28px;
  font-weight:600; text-transform:uppercase; letter-spacing:.04em}
.cal{border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); overflow:hidden;
  box-shadow:var(--vm-shadow-card)}
.cal-head, .cal-week{display:grid; grid-template-columns:repeat(7,minmax(0,1fr))}
.cal-head span{padding:8px 12px; font-size:12px; line-height:16px; font-weight:600; text-transform:uppercase;
  letter-spacing:.05em; color:rgb(var(--vm-muted)); border-bottom:1px solid var(--vm-line)}
.cal-day{display:flex; flex-direction:column; gap:4px; min-width:0; min-height:112px; padding:8px;
  border-right:1px solid var(--vm-line); border-bottom:1px solid var(--vm-line)}
.cal-week > .cal-day:last-child{border-right:0}
.cal-week:last-child > .cal-day{border-bottom:0}
.cal-day.is-out{background:rgb(var(--vm-surface))}
.cal-day.is-out .cal-num{color:rgb(var(--vm-faint-soft))}
.cal-num{display:inline-flex; align-self:flex-start; align-items:center; justify-content:center; min-width:24px; height:24px;
  padding:0 4px; border-radius:999px; font-size:12px; font-weight:600; color:rgb(var(--vm-text-soft))}
.cal-day.is-today .cal-num{background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text))}
.cal-items{display:flex; flex-direction:column; gap:4px}
.cal-item{display:flex; gap:6px; align-items:baseline; min-width:0; padding:4px 8px; border-radius:8px;
  font-size:12px; line-height:16px; background:var(--vm-accent-bg); color:rgb(var(--vm-text))}
.cal-item b{flex:none; font-weight:600}
.cal-item span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cal-item.good{background:var(--vm-good-bg)}
.cal-item.bad{background:var(--vm-bad-bg)}
.cal-item.muted{background:rgb(var(--vm-panel-soft)); color:rgb(var(--vm-muted)); text-decoration:line-through}
.cal-item:hover{outline:1px solid var(--vm-line-strong)}
.cal-dots{display:none; flex-wrap:wrap; gap:3px}
.dot{display:inline-block; width:6px; height:6px; border-radius:999px; background:rgb(var(--vm-accent))}
.dot.good{background:rgb(var(--vm-good))} .dot.bad{background:rgb(var(--vm-bad))} .dot.muted{background:rgb(var(--vm-faint-soft))}
.cal-legend{display:flex; flex-wrap:wrap; gap:8px 16px}
.cal-legend span{display:inline-flex; align-items:center; gap:6px}
.agenda{display:none; flex-direction:column; gap:16px}
.agenda-day{display:flex; flex-direction:column; gap:8px}
.meet{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px;
  border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); padding:12px 16px;
  color:rgb(var(--vm-text)); transition:border-color .15s}
.meet:hover{border-color:var(--vm-line-strong)}
.meet-time{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text-strong))}
.meet-t{display:flex; flex-direction:column; min-width:0}
.meet-t b{font-size:14px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.meet-t span{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
@media(max-width:1023px){
  .cal-day{min-height:56px; align-items:center; padding:6px 2px}
  .cal-num{align-self:center}
  .cal-items{display:none}
  .cal-dots{display:flex; justify-content:center}
  .cal-head span{padding:8px 0; text-align:center}
  .agenda{display:flex}
}
.cand:has(.login-compact) .cand-demo{max-width:384px}

/* ═══════════════════ Staff: кабинет новичка ═══════════════════ */
.split{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:start}
@media(max-width:1023px){ .split{grid-template-columns:1fr} }
/* Несколько карточек одной колонкой внутри .split (профиль: «О себе» и «Рабочие контакты»). */
.col-stack{display:grid; gap:16px; align-content:start; min-width:0}
.step-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column}
.step-row{display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 0; border-top:1px solid var(--vm-line)}
.step-row:first-child{border-top:0}
.step-mark{display:flex; width:32px; height:32px; align-items:center; justify-content:center; border-radius:999px;
  border:1px solid var(--vm-line-strong); color:rgb(var(--vm-faint)); background:rgb(var(--vm-panel))}
.step-done .step-mark{border-color:var(--vm-good-line); background:var(--vm-good-bg); color:rgb(var(--vm-good))}
.step-todo .step-mark{border-color:transparent; background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text))}
.step-wait .step-mark{border-color:var(--vm-warn-line); background:var(--vm-warn-bg); color:rgb(var(--vm-warn))}
.step-problem .step-mark{border-color:var(--vm-bad-line); background:var(--vm-bad-bg); color:rgb(var(--vm-bad))}
.step-t{display:flex; min-width:0; flex-direction:column; gap:2px}
.step-t b{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text-strong))}
.step-t span{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.step-t .step-owner{color:rgb(var(--vm-faint))}
.step-side{display:flex; flex-direction:column; align-items:flex-end; gap:8px}
@media(max-width:639px){
  .step-row{grid-template-columns:32px minmax(0,1fr)}
  .step-side{grid-column:2; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between}
}
.person-card{display:flex; align-items:center; gap:12px}
.person-card > div{display:flex; flex-direction:column; min-width:0}
.person-card b{font-size:16px; line-height:24px; font-weight:600; color:rgb(var(--vm-text-strong)); overflow-wrap:anywhere}
.narrow-panel{max-width:640px}
.day-picks{display:flex; flex-wrap:wrap; gap:8px}
.day-pick{align-items:center; border-radius:var(--r-field); border:1px solid var(--vm-line); padding:8px 12px; background:rgb(var(--vm-panel))}
.day-pick:has(input:checked){border-color:var(--vm-accent-line); background:var(--vm-accent-bg); color:rgb(var(--vm-accent-strong))}
.field-row.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:639px){ .field-row.two{grid-template-columns:1fr} }
.colleague-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px}
/* «Написать» прижата к низу карточки: в одном ряду кнопки на одной линии (UI-55). */
.panel.colleague{display:flex; flex-direction:column; gap:16px}
.panel.colleague > *{margin:0}
.panel.colleague > .write-form{margin-top:auto}
.newcomer-head{display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:12px; align-items:center}
@media(max-width:639px){ .newcomer-head{grid-template-columns:40px minmax(0,1fr)} .newcomer-head .badge{grid-column:2; justify-self:start} }
.facts dd .badge{vertical-align:middle}
/* Длинные метки в строках задач и фактах переносятся, а не выталкивают страницу вбок. */
.step-side .badge, .facts dd .badge, .newcomer-head .badge{white-space:normal; text-align:left; max-width:100%}
@media(max-width:639px){ .facts{grid-template-columns:1fr; gap:4px 0} .facts dd{margin-bottom:8px} }

/* ═══════════════════ Staff: команды ═══════════════════ */
.pause-row{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; padding:12px 0; border-top:1px solid var(--vm-line)}
.pause-row:first-of-type{border-top:0}
.pause-row > div{display:flex; flex-direction:column; min-width:0}
.pause-row b{font-size:14px; line-height:20px}
.pause-row a{color:inherit}
.pause-row .actions{margin:0}
.team-tile{display:flex; flex-direction:column; gap:8px; color:rgb(var(--vm-text))}
.team-tile > *{margin:0 !important}
.seat-bar{height:6px; border-radius:999px; background:rgb(var(--vm-surface)); overflow:hidden}
.seat-bar span{display:block; height:100%; border-radius:inherit; background:rgb(var(--vm-accent))}
.seat-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.seat-card > *{margin:0 !important}
.seat-card{display:flex; flex-direction:column; gap:4px}
.seat-num{font-size:14px; color:rgb(var(--vm-muted))}
.seat-num b{font-family:var(--font-display); font-size:30px; line-height:36px; color:rgb(var(--vm-text-strong))}
@media(max-width:639px){ .seat-grid{grid-template-columns:1fr} }
/* Колонки общие для всех строк: метки и «Написать» стоят ровно, даже если в строке
   кнопки нет (своя строка). На телефоне метка и кнопка уходят под имя. */
.member-list{display:grid; grid-template-columns:40px minmax(0,1fr) auto auto; column-gap:12px}
.member{grid-column:1 / -1; display:grid; grid-template-columns:subgrid; gap:4px 12px; align-items:center; padding:12px 0; border-top:1px solid var(--vm-line)}
.member-side{display:contents}
.member-state{justify-self:end}
@media(max-width:639px){
  .member-list{grid-template-columns:40px minmax(0,1fr)}
  .member-side{grid-column:2; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px}
}
.member:first-child{border-top:0}
.member .person-main a{color:inherit}
.member-actions{grid-column:2 / -1}
.member-actions[open]{padding:12px 0 4px}
.member-actions form + form{margin-top:16px}

/* ═══════════════════ Мессенджер (P09) ═══════════════════ */
.messenger{display:grid; grid-template-columns:320px minmax(0,1fr); height:calc(100vh - var(--vm-header-h) - 160px);
  min-height:520px; border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel));
  box-shadow:var(--vm-shadow-card); overflow:hidden}
.chat-list{display:flex; flex-direction:column; border-right:1px solid var(--vm-line); overflow-y:auto; min-height:0}
.chat-list-head{position:sticky; top:0; z-index:1; display:flex; flex-direction:column; gap:8px; padding:16px;
  background:rgb(var(--vm-panel)); border-bottom:1px solid var(--vm-line)}
.chat-list-head h1{font-size:20px; line-height:28px}
.new-chat-form{display:flex; gap:8px; margin-top:8px}
.new-chat-form select{flex:1; min-width:0}
.chat-item{display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 16px;
  color:rgb(var(--vm-text)); border-bottom:1px solid var(--vm-line-soft); transition:background-color .15s}
.chat-item:hover{background:rgb(var(--vm-panel-soft))}
.chat-item.on{background:var(--vm-accent-bg)}
.chat-item-t{display:flex; flex-direction:column; min-width:0}
.chat-item-top{display:flex; justify-content:space-between; gap:8px}
.chat-item-top b{font-size:14px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-item-top time{flex:none; font-size:12px; color:rgb(var(--vm-faint))}
.chat-item-sub{font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.chat-item-prev{font-size:13px; line-height:18px; color:rgb(var(--vm-muted)); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-list-empty{padding:16px}
.unread-dot{display:inline-flex; min-width:20px; height:20px; padding:0 6px; align-items:center; justify-content:center;
  border-radius:999px; background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text)); font-size:12px; font-weight:600}
.cavatar{display:flex; width:36px; height:36px; flex:none; align-items:center; justify-content:center; border-radius:999px;
  background:var(--vm-accent-bg); color:rgb(var(--vm-accent)); font-size:14px; font-weight:600}
.chat-item .cavatar{width:40px; height:40px}
.cavatar.team{background:var(--vm-good-bg); color:rgb(var(--vm-good))}
.chat-pane{display:flex; flex-direction:column; min-width:0; min-height:0}
.chat-head{display:flex; align-items:center; gap:12px; padding:12px 20px; border-bottom:1px solid var(--vm-line)}
.chat-head > div{display:flex; flex-direction:column; min-width:0}
.chat-head b{font-size:16px; line-height:24px; font-weight:600}
.chat-head span{font-size:12px; line-height:16px; color:rgb(var(--vm-muted))}
.chat-back{display:none}
.chat-placeholder{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:rgb(var(--vm-faint))}
.cthread{flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:8px; padding:20px;
  background:rgb(var(--vm-bg) / .5); scroll-behavior:smooth}
.cempty{margin:auto; font-size:14px; color:rgb(var(--vm-faint))}
.cday{display:flex; justify-content:center; margin:8px 0}
.cday span{padding:2px 12px; border-radius:999px; background:rgb(var(--vm-panel-soft)); font-size:12px; color:rgb(var(--vm-muted))}
.cmsg{display:flex; align-items:flex-end; gap:8px; max-width:78%}
.cmsg.me{align-self:flex-end; flex-direction:row-reverse}
.cbubble{display:flex; flex-direction:column; gap:4px; min-width:0; padding:8px 12px; border-radius:18px 18px 18px 6px;
  background:rgb(var(--vm-panel)); border:1px solid var(--vm-line)}
.cmsg.me .cbubble{border-radius:18px 18px 6px 18px; background:rgb(var(--vm-accent)); border-color:transparent;
  color:rgb(var(--vm-invert-text))}
.cmeta{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; font-size:12px; line-height:16px}
.cmeta b{font-weight:600; color:rgb(var(--vm-accent))}
.cmeta span{color:rgb(var(--vm-faint))}
.ctext{font-size:14px; line-height:20px; white-space:pre-wrap; overflow-wrap:anywhere}
.ctime{align-self:flex-end; font-size:11px; line-height:14px; opacity:.7}
.cfiles{display:flex; flex-direction:column; gap:4px}
.cimg{display:block; border-radius:12px; overflow:hidden; max-width:320px}
.cimg img{display:block; width:100%; height:auto; background:rgb(var(--vm-panel-soft))}
.cvideo{display:block; width:100%; max-width:360px; border-radius:12px; background:#000}
.cdoc{display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; background:rgb(var(--vm-panel-soft));
  color:rgb(var(--vm-text)); min-width:0}
.cmsg.me .cdoc{background:rgb(var(--vm-invert-text) / .15); color:inherit}
.cdoc span{display:flex; flex-direction:column; min-width:0}
.cdoc b{font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cdoc small{font-size:12px; opacity:.75}
.composer{display:flex; flex-direction:column; gap:8px; padding:12px 16px; border-top:1px solid var(--vm-line); background:rgb(var(--vm-panel))}
.composer > *{margin-top:0 !important}
.composer-row{display:flex; align-items:flex-end; gap:8px}
.composer-row textarea{flex:1; min-height:40px; max-height:160px; resize:none; border-radius:20px; padding:9px 16px; line-height:20px}
.composer-attach{position:relative; width:40px; height:40px; border-radius:999px; cursor:pointer}
.composer-attach input{position:absolute; inset:0; opacity:0; cursor:pointer; width:100%}
button.composer-send{width:40px; height:40px; padding:0; border-radius:999px; flex:none}
.composer-files{display:flex; flex-wrap:wrap; gap:8px}
.composer-files span{display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:999px;
  background:rgb(var(--vm-panel-soft)); font-size:12px; color:rgb(var(--vm-text-mid))}
.composer-note{padding:0 16px 12px; font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.composer .composer-note{padding:0}
.composer-chips{margin:0}
.chat-embed{display:flex; flex-direction:column; border-radius:var(--r-card); border:1px solid var(--vm-line); overflow:hidden}
.chat-embed .cthread{max-height:480px; min-height:200px}
.nav-badge{margin-left:auto}
@media(max-width:1023px){
  .messenger{grid-template-columns:1fr; height:calc(100vh - var(--vm-header-h) - 96px)}
  .messenger:not(.has-active) .chat-pane{display:none}
  .messenger.has-active .chat-list{display:none}
  .chat-back{display:flex}
  .cmsg{max-width:90%}
}
@media(max-width:767px){
  button.composer-send, .composer-attach{width:44px; height:44px}
  .composer-row textarea{min-height:44px}
}

/* ── Мессенджер-кнопка в правом нижнем углу ── */
.mw{position:fixed; right:24px; bottom:24px; z-index:45}
.mw-fab{position:relative; display:flex; width:56px; height:56px; align-items:center; justify-content:center;
  border:0; border-radius:999px; cursor:pointer; background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text));
  box-shadow:0 12px 30px rgb(var(--vm-accent) / .35); transition:transform .15s, background-color .15s}
.mw-fab:hover{background:rgb(var(--vm-accent-strong)); transform:translateY(-1px)}
.mw.open .mw-fab{transform:none}
.mw-badge{position:absolute; top:-4px; right:-4px; min-width:22px; height:22px; padding:0 6px; display:inline-flex;
  align-items:center; justify-content:center; border-radius:999px; border:2px solid rgb(var(--vm-bg));
  background:rgb(var(--vm-bad)); color:#fff; font-size:12px; font-weight:700}
.mw-badge[hidden]{display:none}
.mw-panel{position:absolute; right:0; bottom:72px; width:380px; height:min(600px, calc(100vh - 120px));
  display:flex; flex-direction:column; overflow:hidden; border-radius:var(--r-panel); border:1px solid var(--vm-line);
  background:rgb(var(--vm-panel)); box-shadow:var(--vm-shadow-card), 0 30px 60px rgb(var(--vm-invert) / .12)}
.mw-panel[hidden]{display:none}
.mw-head{display:flex; align-items:center; gap:8px; padding:12px 12px 12px 16px; border-bottom:1px solid var(--vm-line)}
.mw-head > b{flex:1; font-family:var(--font-display); font-size:18px; letter-spacing:.04em; text-transform:uppercase}
.mw-head .icon-btn{width:32px; height:32px}
.mw-title{flex:1; display:flex; flex-direction:column; min-width:0}
.mw-title b{font-size:14px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mw-title span{font-size:12px; line-height:16px; color:rgb(var(--vm-muted)); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mw-tabs{display:flex; gap:4px; padding:0 12px; border-bottom:1px solid var(--vm-line)}
.mw-body{flex:1; min-height:0; overflow-y:auto}
.mw-body > .notice{margin:12px}
.mw-empty{display:flex; flex-direction:column; align-items:center; gap:12px; padding:32px 16px; text-align:center;
  font-size:14px; color:rgb(var(--vm-muted))}
.mw-search{margin:12px 16px 4px; width:calc(100% - 32px) !important}
.mw-group{padding:8px 0}
.mw-group[hidden], .mw-target[hidden], .mw-target-form[hidden]{display:none}
.mw-group h3{padding:0 16px; font-size:12px; line-height:16px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.mw-hint{padding:0 16px 4px; font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.mw-target-form{margin:0}
button.mw-target, .mw-target{display:grid; grid-template-columns:36px minmax(0,1fr) 16px; gap:12px; align-items:center;
  width:100%; padding:8px 16px; border:0; border-radius:0; background:transparent; color:rgb(var(--vm-text));
  text-align:left; font:inherit; cursor:pointer; min-height:52px}
button.mw-target:hover, .mw-target:hover{background:rgb(var(--vm-panel-soft))}
.mw-target .chat-item-t b{font-size:14px; line-height:20px; font-weight:600}
.mw-target .i-sm{color:rgb(var(--vm-faint-soft))}
.mw-panel .cthread{padding:16px}
.mw-panel .cmsg{max-width:88%}
.mw-panel .composer{padding:10px 12px}
.mw-panel .composer-note{display:none}
.mw-error{margin:8px 12px}
@media(max-width:767px){
  .mw{right:16px; bottom:16px}
  .mw.open{inset:0; right:0; bottom:0}
  .mw.open .mw-fab{display:none}
  .mw-panel{position:fixed; inset:0; width:auto; height:auto; border-radius:0; border:0}
}
@media print{ .mw{display:none} }

/* «Написать»: от частого к редкому — плитки, кружки, поиск. */
.mw-pick{display:flex; flex-direction:column; gap:4px; padding:8px 0 16px}
.mw-sec{display:flex; flex-direction:column; gap:8px; padding:8px 16px}
.mw-sec > h3{font-size:12px; line-height:16px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.mw-quick{display:grid; grid-template-columns:1fr; gap:8px}
.mw-quick > form{display:flex; margin:0}
button.mw-tile, .mw-tile{display:grid; grid-template-columns:40px minmax(0,1fr); grid-template-rows:auto auto;
  column-gap:12px; align-items:center; width:100%; min-height:60px; padding:10px 12px; border-radius:var(--r-card); border:1px solid var(--vm-line); background:rgb(var(--vm-panel));
  color:rgb(var(--vm-text)); text-align:left; font:inherit; cursor:pointer; transition:border-color .15s, background-color .15s}
button.mw-tile:hover, .mw-tile:hover{border-color:var(--vm-accent-line); background:var(--vm-accent-bg)}
.mw-tile-ic{grid-row:1 / 3; display:flex; width:40px; height:40px; align-items:center; justify-content:center;
  border-radius:12px; background:var(--vm-accent-bg); color:rgb(var(--vm-accent))}
.mw-tile b{font-size:14px; line-height:20px; font-weight:600}
.mw-tile b{align-self:end}
.mw-tile span:last-child{align-self:start; font-size:12px; line-height:16px; color:rgb(var(--vm-muted));
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mw-avatars{display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; margin:0 -16px; padding:0 12px}
.mw-avatars::-webkit-scrollbar{display:none}
.mw-avatars > form{display:flex; margin:0; flex:none}
button.mw-ava{display:flex; flex-direction:column; align-items:center; gap:4px; width:84px; padding:6px 4px; border:0;
  border-radius:var(--r-field); background:transparent; color:rgb(var(--vm-text)); font:inherit; cursor:pointer}
button.mw-ava:hover{background:rgb(var(--vm-panel-soft))}
.mw-ava .cavatar{width:44px; height:44px; font-size:16px}
.mw-ava-name{max-width:76px; font-size:12px; line-height:16px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mw-ava-role{max-width:64px; font-size:10px; line-height:12px; color:rgb(var(--vm-faint)); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mw-find .mw-search{margin:0; width:100% !important}
.mw-results{display:none; flex-direction:column; margin:0 -16px}
.mw-find.searching .mw-results{display:flex}
.mw-results > form{margin:0}
.mw-results > form[hidden]{display:none}
.mw-nothing{padding:8px 16px}

/* Аватары, группы, фото профиля */
.cavatar{overflow:hidden}
.cavatar img{display:block; width:100%; height:100%; object-fit:cover}
.cavatar.small{width:28px; height:28px; font-size:12px}
.cavatar.big{width:56px; height:56px; font-size:22px}
.cavatar.huge{width:96px; height:96px; font-size:36px; flex:none}
.avatar-img{overflow:hidden; padding:0}
.avatar-img img{display:block; width:100%; height:100%; object-fit:cover}
.csys{display:flex; justify-content:center; margin:4px 0}
.csys span{max-width:90%; padding:4px 12px; border-radius:999px; background:rgb(var(--vm-panel-soft));
  font-size:12px; line-height:16px; color:rgb(var(--vm-muted)); text-align:center}
.mw-pad{padding:12px 16px 16px}
.mw-pad > * + *{margin-top:12px}
.group-form > * + *{margin-top:12px}
.icon-pick{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px}
.icon-opt{position:relative; display:flex; cursor:pointer}
.icon-opt input{position:absolute; opacity:0; inset:0; margin:0; cursor:pointer}
.icon-opt span{display:flex; width:100%; aspect-ratio:1; align-items:center; justify-content:center; border-radius:12px;
  border:1px solid var(--vm-line); background:rgb(var(--vm-panel)); color:rgb(var(--vm-text-soft)); transition:border-color .15s, background-color .15s}
.icon-opt:hover span{border-color:var(--vm-line-strong)}
.icon-opt input:checked + span{border-color:rgb(var(--vm-accent)); background:var(--vm-accent-bg); color:rgb(var(--vm-accent))}
.icon-opt input:focus-visible + span{outline:2px solid rgb(var(--vm-accent)); outline-offset:2px}
.upload-line{display:flex; flex-direction:column; gap:4px; margin-top:12px; font-weight:400; font-size:12px; color:rgb(var(--vm-muted))}
.member-pick{display:flex; flex-direction:column; max-height:280px; overflow-y:auto; margin-top:8px;
  border-radius:var(--r-field); border:1px solid var(--vm-line)}
.member-opt{display:grid; grid-template-columns:18px 36px minmax(0,1fr); gap:10px; align-items:center; padding:8px 12px;
  border-bottom:1px solid var(--vm-line-soft); cursor:pointer; font-weight:400}
.member-opt:last-child{border-bottom:0}
.member-opt[hidden]{display:none}
.member-opt:has(input:checked){background:var(--vm-accent-bg)}
.member-opt .chat-item-t b, .member-row .chat-item-t b{font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text))}
.group-card{display:flex; align-items:center; gap:12px}
.group-card > div{display:flex; flex-direction:column; min-width:0}
.group-card b{font-size:16px; line-height:24px}
.group-sec{padding-top:12px; border-top:1px solid var(--vm-line)}
.group-sec > h3{margin-bottom:8px; font-size:12px; line-height:16px; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--vm-muted))}
.group-sec form > * + *{margin-top:12px}
.member-row{display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:10px; align-items:center; padding:6px 0}
.member-row form{margin:0}
.member-row .icon-btn{width:32px; height:32px}
.group-page > * + *{margin-top:16px}
.photo-row{display:flex; align-items:center; gap:20px; flex-wrap:wrap}
.photo-form{flex:1; min-width:220px}
.side-me-link{display:flex; align-items:center; gap:8px; padding:6px 12px; border-radius:var(--r-btn); color:inherit}
.side-me-link:hover, .side-me-link.on{background:rgb(var(--vm-panel-soft))}
.side-me-link .side-me{padding:0}
.chat-head .cavatar{width:40px; height:40px}
.mw-head .cavatar{width:32px; height:32px; font-size:13px}
.chat-settings{margin-left:auto}

/* Путь кандидата в стиле интервью v2 (P11, макет принят владельцем 28.09.2026):
   сообщения помощника, карточки выбора, карта пути. Только токены платформы. */
.v2-card{display:flex; flex-direction:column; gap:16px}
.panel.v2-card > *, .v2-form > *{margin:0}
.v2-path{display:grid; grid-template-columns:repeat(10, minmax(0, 1fr)); gap:4px; justify-items:center; margin:0; padding:0; list-style:none}
.v2-dot{display:inline-flex; width:24px; height:24px; align-items:center; justify-content:center; border-radius:999px;
  font-size:12px; font-weight:600; border:1px solid var(--vm-line); color:rgb(var(--vm-faint)); background:rgb(var(--vm-panel))}
.v2-dot.done{background:var(--vm-good-bg); color:rgb(var(--vm-good)); border-color:transparent}
.v2-dot.now{background:rgb(var(--vm-accent)); color:rgb(var(--vm-invert-text)); border-color:transparent;
  box-shadow:0 0 0 4px var(--vm-accent-bg)}
.v2-step{display:flex; align-items:center; gap:12px; font-size:14px; line-height:20px; color:rgb(var(--vm-muted))}
.v2-step h1, .v2-step h2{margin:0; font-family:inherit; font-size:16px; line-height:24px; font-weight:600;
  text-transform:none; letter-spacing:0; color:rgb(var(--vm-text-strong))}
.v2-badge{display:inline-flex; flex:none; width:44px; height:44px; align-items:center; justify-content:center; border-radius:14px;
  background:var(--vm-accent-bg); color:rgb(var(--vm-accent))}
.v2-card .cmsg{max-width:100%}
.v2-card .cmsg.me{max-width:90%}
.v2-opts{display:flex; flex-direction:column; gap:8px; margin:0; padding:0; border:0; min-width:0}
.v2-opts legend{margin-bottom:8px; font-size:14px; line-height:20px; font-weight:600; color:rgb(var(--vm-text-strong))}
.v2-opt{display:flex; align-items:center; gap:12px; min-height:52px; padding:12px 16px; border:1px solid var(--vm-line);
  border-radius:var(--r-field); background:rgb(var(--vm-panel)); cursor:pointer; font-size:15px; line-height:22px; font-weight:400;
  color:rgb(var(--vm-text)); transition:border-color .15s, background-color .15s}
.v2-opt:hover{border-color:var(--vm-line-strong)}
.v2-opt input{flex:none; width:18px; height:18px; margin:0; accent-color:rgb(var(--vm-accent))}
.v2-opt:has(input:checked){border-color:var(--vm-accent-line); background:var(--vm-accent-bg); color:rgb(var(--vm-text-strong))}
.v2-opt:has(input:disabled){cursor:default}
.v2-opt:has(input:focus-visible){outline:2px solid rgb(var(--vm-accent)); outline-offset:2px}
.v2-opt-ic{display:inline-flex; flex:none; color:rgb(var(--vm-accent))}
.v2-opt-t{display:flex; flex-direction:column; gap:2px; min-width:0}
.v2-tag{font-size:12px; line-height:16px; color:rgb(var(--vm-faint))}
.v2-doc{display:flex; align-items:stretch; gap:8px}
.v2-doc .v2-opt{flex:1; min-width:0}
.v2-read{display:inline-flex; flex:none; align-items:center; justify-content:center; gap:6px; min-width:44px; padding:0 12px;
  border:1px solid var(--vm-line); border-radius:var(--r-field); font-size:14px; color:rgb(var(--vm-accent)); background:rgb(var(--vm-panel))}
.v2-read:hover{border-color:var(--vm-line-strong)}
.v2-reads{display:flex; flex-direction:column; gap:8px; margin:0; padding:0; list-style:none}
.v2-reads a{display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 12px; border-radius:var(--r-field);
  background:rgb(var(--vm-panel-soft)); color:rgb(var(--vm-text)); font-size:14px; line-height:20px}
.v2-reads a .i-sm{flex:none; color:rgb(var(--vm-accent))}
.v2-form{display:flex; flex-direction:column; gap:12px}
.v2-extra{display:flex; flex-direction:column; gap:8px}
@supports selector(:has(*)){
  .v2-form .v2-extra{display:none}
  .v2-form:has(input[data-needs-text]:checked) .v2-extra{display:flex}
}
.v2-calm{display:flex; align-items:center; gap:8px; font-size:13px; line-height:18px; color:rgb(var(--vm-muted))}
.v2-calm .i-sm{flex:none; color:rgb(var(--vm-good))}
.v2-in{animation:v2in .22s ease-out both}
@keyframes v2in{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
.v2-dots{display:inline-flex; gap:4px; margin-right:6px; vertical-align:middle}
.v2-dots i{display:inline-block; width:6px; height:6px; border-radius:999px; background:rgb(var(--vm-accent));
  animation:v2blink 1.2s ease-in-out infinite}
.v2-dots i:nth-child(2){animation-delay:.2s} .v2-dots i:nth-child(3){animation-delay:.4s}
@keyframes v2blink{0%,100%{opacity:.25} 50%{opacity:1}}
.v2-saved{align-self:flex-end; display:flex; align-items:center; gap:6px; font-size:12px; line-height:16px; color:rgb(var(--vm-good))}
.v2-thinking[hidden]{display:none}
.v2-lesson{display:flex; flex-direction:column; gap:8px; padding:16px; border-radius:var(--r-field); background:var(--vm-good-bg)}
.v2-lesson > *{margin:0}
.v2-lesson b{display:flex; align-items:center; gap:8px; font-size:14px; line-height:20px; color:rgb(var(--vm-text-strong))}
.v2-lesson .ctext{color:rgb(var(--vm-text))}
.v2-done{display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center}
.v2-done > *{margin:0}
.v2-done .v2-badge{width:56px; height:56px; border-radius:999px; background:var(--vm-good-bg); color:rgb(var(--vm-good))}
@media (max-width:767px){ .v2-read{min-height:44px} }
@media (prefers-reduced-motion: reduce){ .v2-in, .v2-dots i{animation:none} }