/* Дизайн-кит «Без барьеров» v1.0 + токены плотных интерфейсов (tokens-data.css).
   Правила кита: основной текст 18px, минимум 14px, #00ADC2 запрещён для текста,
   отступы только 4/8/12/16/24/32/48/64/96, высота интерактива ≥ 48px, клик-зона ≥ 44×44. */

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font:400 18px/28px Roboto,system-ui,sans-serif;
  color:#210F39;
  background:#F4F3F6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:#007E92;text-decoration:underline;text-underline-offset:3px}
a:hover{color:#04627C}
input::placeholder,textarea::placeholder{color:#A59EAF}
h1,h2,h3,h4{margin:0}
:focus-visible{outline:none;box-shadow:var(--st-focus-ring);border-radius:8px}
/* display у .btn/.modal перебивает атрибут hidden — возвращаем ему силу */
[hidden]{display:none !important}

/* ───────── верхняя панель ───────── */
.topbar{
  position:sticky;top:0;z-index:var(--z-head);
  background:#13002C;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:8px clamp(12px,3vw,32px);
}
.topbar__brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex:none;min-height:44px;padding:0 8px;border-radius:12px}
.topbar__brand:hover{background:rgba(255,255,255,.1)}
.topbar__brand-text{font:900 italic 16px/20px 'Roboto Condensed',sans-serif;text-transform:uppercase;color:#fff;white-space:nowrap}
.topbar__nav{flex:1;min-width:200px;display:flex;gap:4px;overflow-x:auto;padding:4px 0}
.topbar__link{
  display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:12px;
  text-decoration:none;white-space:nowrap;color:rgba(255,255,255,.76);font:400 16px/24px Roboto,sans-serif;
}
.topbar__link:hover{background:rgba(255,255,255,.1);color:#fff}
.topbar__link.is-active{background:rgba(255,255,255,.16);color:#fff;font-weight:500}
.topbar__user{display:flex;align-items:center;gap:8px;flex:none}
.topbar__user-name{font:400 16px/20px Roboto,sans-serif;color:rgba(255,255,255,.82);white-space:nowrap}
.topbar__logout{margin:0}
.topbar__logout-btn{
  min-height:44px;padding:0 12px;border:1px solid rgba(255,255,255,.28);border-radius:12px;
  background:transparent;color:rgba(255,255,255,.82);font:400 16px/24px Roboto,sans-serif;cursor:pointer;
}
.topbar__logout-btn:hover{background:rgba(255,255,255,.1);color:#fff}
.avatar{
  width:36px;height:36px;border-radius:999px;display:grid;place-items:center;flex:none;
  font:500 14px/1 Roboto,sans-serif;
}
.avatar--purple{background:#2B2171;color:#fff}
.avatar--quiet{background:#EAE9F1;color:#2B2171;width:44px;height:44px;font-size:16px}

/* ───────── каркас страницы ───────── */
.page{
  max-width:1280px;margin:0 auto;
  padding:clamp(16px,3vw,32px) clamp(12px,3vw,32px) 64px;
  display:flex;flex-direction:column;gap:clamp(12px,2vw,24px);
}
.breadcrumbs{font:400 16px/24px Roboto,sans-serif;color:#635774;display:flex;gap:8px;flex-wrap:wrap}
.breadcrumbs__sep{color:#A59EAF}
.breadcrumbs__current{color:#34244A}

.page-head{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}
.page-head__text{flex:1 1 320px;min-width:0}
.page-head h1{font:700 clamp(26px,3.4vw,40px)/1.2 Roboto,sans-serif;color:#210F39}
.page-head__sub{font:400 16px/24px Roboto,sans-serif;color:#635774;margin-top:8px}
.page-head__actions{display:flex;gap:12px;flex-wrap:wrap}
.page-note{font:400 15px/22px Roboto,sans-serif;color:#635774}

/* ───────── кнопки ───────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 18px;border-radius:12px;border:0;cursor:pointer;
  font:500 16px/24px Roboto,sans-serif;text-decoration:none;
}
.btn--primary{background:#2B2171;color:#fff}
.btn--primary:hover{background:#271B65;color:#fff}
.btn--secondary{background:#fff;color:#007E92;border:1px solid #007E92}
.btn--secondary:hover{background:#F0FAFB;color:#007E92}
.btn--quiet{background:#fff;color:#4C3D5F;border:1px solid #CBC7D1}
.btn--quiet:hover{border-color:#2B2171;color:#2B2171}
.btn--soft{background:#EAE9F1;color:#2B2171}
.btn--soft:hover{background:#DEDCEB;color:#2B2171}
.btn--danger{background:#C0362C;color:#fff}
.btn--danger:hover{background:#A62B22;color:#fff}
.btn--small{min-height:44px;padding:0 14px}
.btn--large{min-height:56px;padding:0 24px;font-size:18px;line-height:28px}
.btn[disabled],.btn.is-disabled{background:var(--st-disabled-bg);color:var(--st-disabled-fg);border-color:var(--st-disabled-bd);cursor:not-allowed}
.btn--link{background:transparent;border:0;color:#007E92;min-height:44px;padding:0 12px}
.btn--link:hover{background:#F0FAFB}

/* ───────── карточки, KPI ───────── */
.card{background:#fff;border:1px solid #E3E0E6;border-radius:16px;padding:clamp(16px,2.4vw,24px)}
.card--wide{border-radius:20px}
.card__title{font:700 clamp(20px,2.4vw,24px)/1.3 Roboto,sans-serif;color:#210F39}
.card__hint{font:400 15px/22px Roboto,sans-serif;color:#635774}

.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(12px,1.6vw,16px)}
.kpi{background:#fff;border:1px solid #E3E0E6;border-radius:16px;padding:16px}
.kpi__label{font:400 15px/22px Roboto,sans-serif;color:#635774}
.kpi__value{
  margin:4px 0;font:700 clamp(24px,2.6vw,30px)/1.2 Roboto,sans-serif;
  font-variant-numeric:tabular-nums;color:#210F39;
}
.kpi__value--bad{color:#C0362C}
.kpi__value--good{color:#0E7A4F}
.kpi__sub{font:400 15px/22px Roboto,sans-serif;color:#635774}
.kpi__head{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;margin:4px 0}

/* ───────── бейджи статусов (цвет + иконка + подпись) ───────── */
.badge{
  display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:4px 14px;
  border-radius:999px;font:500 16px/24px Roboto,sans-serif;white-space:nowrap;border:1px solid transparent;
}
.badge__icon{font:500 15px/1 Roboto,sans-serif}
.badge--done{background:var(--sem-done-bg);border-color:var(--sem-done-bd);color:var(--sem-done-fg)}
.badge--work{background:#EAE9F1;border-color:#CFCBE4;color:#2B2171}
.badge--late{background:var(--sem-late-bg);border-color:var(--sem-late-bd);color:var(--sem-late-fg)}
.badge--idle{background:var(--sem-idle-bg);border-color:var(--sem-idle-bd);color:var(--sem-idle-fg)}
.badge--cancelled{background:#F4F3F6;border-color:#CBC7D1;color:#635774}
.badge--risk{background:var(--sem-risk-bg);border-color:var(--sem-risk-bd);color:var(--sem-risk-fg)}
.badge--ahead{background:var(--sem-ahead-bg);border-color:var(--sem-ahead-bd);color:var(--sem-ahead-fg)}
.badge--sm{min-height:34px;padding:2px 12px;font-size:15px;line-height:22px}

/* ───────── прогресс-полоса ───────── */
.progress{height:10px;border-radius:999px;background:#E9E7EE;overflow:hidden;margin-top:8px}
.progress--thick{height:12px}
.progress__bar{height:100%;border-radius:999px;background:#2B2171}
.progress__bar--done{background:#0E7A4F}
.progress__bar--late{background:#C0362C}
.progress__bar--idle{background:#A59EAF}
.progress-head{display:flex;justify-content:space-between;gap:8px;font:400 15px/22px Roboto,sans-serif;color:#635774}
.progress-head__value{font:500 16px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39}

/* ───────── фильтры и чипы ───────── */
.filters{display:flex;flex-direction:column;gap:16px}
.filters__row{display:flex;gap:12px;flex-wrap:wrap}
.chip{
  display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;
  cursor:pointer;border:1px solid #CBC7D1;background:#fff;color:#4C3D5F;
  font:500 16px/24px Roboto,sans-serif;text-decoration:none;
}
.chip:hover{border-color:#2B2171;color:#2B2171}
.chip.is-active{background:#2B2171;border-color:#2B2171;color:#fff}
.chip.is-active:hover{color:#fff}
.chip__count{font:500 15px/20px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#635774}
.chip.is-active .chip__count{color:rgba(255,255,255,.72)}
.chip--remove{padding-right:12px}
.chip__x{font:400 18px/1 Roboto,sans-serif}

/* ───────── поля ───────── */
.field{display:block}
.field__label{display:block;font:400 15px/22px Roboto,sans-serif;color:#635774;margin-bottom:8px}
.field__control,
.input,.select,.textarea{
  width:100%;min-height:52px;padding:12px 16px;border:1px solid #CBC7D1;border-radius:12px;
  background:#fff;font:400 17px/26px Roboto,sans-serif;color:#210F39;outline:none;
}
.textarea{resize:vertical;min-height:64px}
.input:focus,.select:focus,.textarea:focus{border-color:var(--st-focus-bd);box-shadow:var(--st-focus-ring)}
.input.is-error,.select.is-error,.textarea.is-error{border-color:var(--st-error-bd);box-shadow:var(--st-error-ring)}
.field__error{margin-top:8px;font:400 15px/22px Roboto,sans-serif;color:#C0362C}
.field--wide{grid-column:1 / -1}
.input--num{font-variant-numeric:tabular-nums;text-align:center}

/* ───────── реестр проектов ───────── */
.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:clamp(12px,1.6vw,16px)}
.project-card{
  display:flex;flex-direction:column;background:#fff;border-radius:16px;
  padding:clamp(16px,2vw,24px);border:1px solid #E3E0E6;border-left:4px solid #CBC7D1;
}
.project-card--late{border-color:#F0C4BF;border-left-color:#C0362C}
.project-card--done{border-left-color:#0E7A4F}
.project-card--work{border-left-color:#2B2171}
.project-card--cancelled{opacity:.86}
.project-card__head{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.project-card__title{flex:1 1 180px;min-width:0}
.project-card__name{font:500 clamp(17px,1.7vw,20px)/1.35 Roboto,sans-serif;color:#210F39;text-wrap:pretty}
.project-card__type{font:400 15px/22px Roboto,sans-serif;color:#635774;margin-top:4px}
.project-card__facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin-top:16px}
.fact__label{font:400 15px/22px Roboto,sans-serif;color:#635774}
.fact__value{font:400 17px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#34244A}
.fact__value--bad{font-weight:500;color:#C0362C}
.project-card__current{margin-top:16px;padding-top:16px;border-top:1px solid #EDEBF1}
.project-card__comment{font:400 16px/24px Roboto,sans-serif;color:#4C3D5F;margin-top:8px;text-wrap:pretty}
.project-card__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.project-card__progress{margin-top:16px}

.empty{
  background:#fff;border:1px solid #E3E0E6;border-radius:16px;
  padding:clamp(32px,6vw,64px) clamp(16px,4vw,32px);
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;
}
.empty__icon{width:88px;height:88px;border-radius:999px;background:#FBF0E2;display:grid;place-items:center;font:400 36px/1 Roboto,sans-serif;color:#8F4E00}
.empty__title{font:700 clamp(20px,2.6vw,24px)/1.3 Roboto,sans-serif}
.empty__text{font:400 17px/26px Roboto,sans-serif;color:#635774;max-width:48ch}

/* ───────── карточка проекта ───────── */
.project-hero{display:flex;gap:clamp(16px,3vw,32px);flex-wrap:wrap;align-items:flex-start}
.project-hero__main{flex:1 1 340px;min-width:0}
.project-hero__title{font:700 clamp(24px,3.2vw,34px)/1.2 Roboto,sans-serif;color:#210F39;text-wrap:pretty}
.project-hero__meta{display:flex;gap:8px 16px;flex-wrap:wrap;margin-top:12px;font:400 16px/24px Roboto,sans-serif;color:#635774}
.project-hero__meta-sep{color:#CBC7D1}
.project-hero__badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.project-hero__side{flex:0 1 320px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.project-hero__actions{flex:1 1 160px;display:flex;flex-direction:column;gap:8px}
.ring{position:relative;width:104px;height:104px;flex:none}
.ring__label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.ring__value{font:700 26px/30px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39}
.ring__caption{font:400 14px/18px Roboto,sans-serif;color:#635774}

.tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid #E3E0E6}
.tab{
  min-height:48px;padding:0 16px;border:0;border-bottom:3px solid transparent;background:transparent;
  color:#635774;font:400 17px/26px Roboto,sans-serif;cursor:pointer;white-space:nowrap;text-decoration:none;
  display:inline-flex;align-items:center;
}
.tab:hover{color:#2B2171}
.tab.is-active{color:#2B2171;font-weight:500;border-bottom-color:#2B2171}
.tab-panel[hidden]{display:none}

/* строка этапа */
.stage{background:#fff;border:1px solid #E3E0E6;border-radius:16px;padding:clamp(16px,2vw,24px);border-left:4px solid #CBC7D1}
.stage--late{border-color:#F0C4BF;border-left-color:#C0362C}
.stage--done{border-left-color:#0E7A4F}
.stage--work{border-left-color:#2B2171}
.stage--cancelled{opacity:.8;border-left-color:#CBC7D1}
.stage__head{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;cursor:pointer;background:none;border:0;width:100%;text-align:left;padding:0;min-height:48px}
.stage__num{
  width:36px;height:36px;flex:none;border-radius:10px;display:grid;place-items:center;
  background:#F1F0F2;color:#4C3D5F;font:500 16px/1 Roboto,sans-serif;font-variant-numeric:tabular-nums;
}
.stage__title{flex:1 1 240px;min-width:0}
/* span внутри <button> наследует inline — задаём блочность явно */
.stage__name{display:block;font:500 clamp(17px,1.6vw,20px)/1.35 Roboto,sans-serif;color:#210F39;text-wrap:pretty}
.stage__dept{display:block;font:400 15px/22px Roboto,sans-serif;color:#635774;margin-top:4px}
.stage__chev{width:32px;flex:none;text-align:right;font:400 16px/28px Roboto,sans-serif;color:#635774}
.stage__facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px 24px;margin-top:16px}
.stage__body{margin-top:16px;padding-top:16px;border-top:1px solid #EDEBF1;display:flex;flex-direction:column;gap:24px}
.stage__body[hidden]{display:none}
.stage-list{display:flex;flex-direction:column;gap:12px}
.stage__alert{
  display:flex;gap:16px;flex-wrap:wrap;align-items:center;padding:16px;
  border-radius:12px;background:var(--sem-late-bg);border:1px solid var(--sem-late-bd);
}
.stage__alert-text{flex:1 1 260px;font:400 16px/24px Roboto,sans-serif;color:#34244A}
.stage__pct{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-end}
.stepper{display:flex;align-items:center;gap:8px;margin-top:8px}
.stepper__btn{width:48px;height:48px;border:1px solid #CBC7D1;border-radius:12px;background:#fff;color:#4C3D5F;font:400 20px/1 Roboto,sans-serif;cursor:pointer}
.stepper__btn:hover{border-color:#2B2171;color:#2B2171}
.stepper__input{width:96px;min-height:48px;text-align:center;font-variant-numeric:tabular-nums;border:1px solid #CBC7D1;border-radius:12px;font:400 17px/26px Roboto,sans-serif;color:#210F39;outline:none;padding:0 8px}
.stage__pct-note{flex:1 1 220px;font:400 15px/22px Roboto,sans-serif;color:#635774;padding-bottom:12px}
.stage__save{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.stage__save-note{font:400 15px/22px Roboto,sans-serif;color:#635774}
.group-tag{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;font:500 15px/28px Roboto,sans-serif;white-space:nowrap;color:#34244A}
.group-tag--prod{background:var(--grp-prod-soft)}
.group-tag--docs{background:var(--grp-docs-soft)}
.group-tag--perm{background:var(--grp-perm-soft)}
.excluded-block{margin-top:8px}
.excluded-block summary{cursor:pointer;min-height:48px;display:flex;align-items:center;font:500 17px/26px Roboto,sans-serif;color:#4C3D5F}

/* Гант */
.gantt{overflow-x:auto;margin-top:16px}
.gantt__inner{min-width:900px}
.gantt__ticks{display:flex;margin-left:260px;border-bottom:1px solid #E3E0E6}
.gantt__tick{flex:1;font:400 15px/22px Roboto,sans-serif;color:#635774;padding:8px 4px;text-align:center;border-left:1px solid #F1F0F2}
.gantt__row{display:flex;align-items:center;min-height:52px;border-bottom:1px solid #F8F7F9}
.gantt__name{width:260px;flex:none;padding-right:16px;display:flex;align-items:center;gap:8px}
.gantt__name-n{width:24px;font:400 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#635774}
.gantt__name-text{font:400 16px/22px Roboto,sans-serif;color:#34244A;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gantt__track{flex:1;position:relative;height:44px}
.gantt__plan{position:absolute;top:8px;height:12px;border-radius:999px;background:#E9E7EE;border:1px dashed #A59EAF}
.gantt__fact{position:absolute;top:24px;height:14px;border-radius:999px;background:#2B2171}
.gantt__fact--done{background:#0E7A4F}
.gantt__fact--late{background:#C0362C}
.gantt__today{position:absolute;top:0;bottom:0;width:2px;background:#C0362C}
.legend{display:flex;flex-wrap:wrap;gap:16px}
.legend__item{display:inline-flex;align-items:center;gap:8px;font:400 16px/24px Roboto,sans-serif;color:#34244A}
.legend__swatch{width:26px;height:14px;border-radius:999px;display:inline-block}

/* История и комментарии */
.history__item{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid #F1F0F2}
.history__text{font:400 17px/26px Roboto,sans-serif;color:#210F39;text-wrap:pretty}
.history__meta{font:400 15px/22px Roboto,sans-serif;color:#635774;font-variant-numeric:tabular-nums}

/* ───────── отчёт для собственников ───────── */
.traffic{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(12px,1.6vw,16px);margin-top:16px}
.traffic__tile{border-radius:14px;padding:16px;border:1px solid transparent}
.traffic__tile--ok{background:var(--sem-ontrack-bg);border-color:var(--sem-ontrack-bd);color:var(--sem-ontrack-fg)}
.traffic__tile--risk{background:var(--sem-risk-bg);border-color:var(--sem-risk-bd);color:var(--sem-risk-fg)}
.traffic__tile--late{background:var(--sem-late-bg);border-color:var(--sem-late-bd);color:var(--sem-late-fg)}
.traffic__head{display:flex;align-items:center;gap:12px}
.traffic__mark{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:#fff;font:500 18px/1 Roboto,sans-serif}
.traffic__label{font:500 17px/24px Roboto,sans-serif}
.traffic__count{font:700 clamp(30px,4vw,44px)/1.1 Roboto,sans-serif;font-variant-numeric:tabular-nums;margin-top:12px}
.traffic__note{font:400 15px/22px Roboto,sans-serif;margin-top:4px}
.caption{
  margin-top:16px;padding:12px 16px;border-radius:12px;background:#F8F7F9;
  font:400 16px/24px Roboto,sans-serif;color:#4C3D5F;
}

.bar-list{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.bar-row{
  display:block;width:100%;text-align:left;background:#fff;border:1px solid #E3E0E6;border-radius:12px;
  padding:12px 16px;cursor:pointer;min-height:48px;
}
.bar-row:hover{background:#F8F7F9}
.bar-row__head{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline}
.bar-row__name{flex:1 1 200px;min-width:0;font:400 17px/24px Roboto,sans-serif;color:#34244A;text-align:left}
.bar-row__type{font:400 15px/22px Roboto,sans-serif;color:#635774}
.bar-row__pct{font:500 17px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39;min-width:56px;text-align:right}
.delta{font:500 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.t3__cell--delta .delta{font-size:14px}
.delta--up{color:var(--sem-ahead-fg)}
.delta--down{color:var(--sem-late-fg)}
.delta--flat{color:#635774}

/* тепловая карта: цвет + знак */
.heat{overflow-x:auto;margin-top:16px}
.heat__inner{min-width:920px}
.heat__head{display:flex;align-items:flex-end;gap:4px}
.heat__head-spacer{width:250px;flex:none}
.heat__head-cell{flex:1;text-align:center;font:400 14px/20px Roboto,sans-serif;color:#635774;padding-bottom:4px}
.heat__rows{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.heat__row{display:flex;align-items:center;gap:4px}
.heat__name{
  width:250px;flex:none;display:flex;gap:8px;align-items:baseline;background:none;border:0;cursor:pointer;
  text-align:left;font:400 16px/24px Roboto,sans-serif;color:#34244A;min-height:44px;padding:0 8px 0 0;
}
.heat__name:hover{color:#2B2171}
.heat__name-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.heat__name-type{flex:none;font:400 14px/20px Roboto,sans-serif;color:#635774}
.heat__cell{
  flex:1;min-height:36px;border-radius:8px;display:grid;place-items:center;
  font:500 15px/1 Roboto,sans-serif;border:1px solid transparent;
}
.heat__cell--done{background:var(--sem-done-bg);border-color:var(--sem-done-bd);color:var(--sem-done-fg)}
.heat__cell--work{background:#EAE9F1;border-color:#CFCBE4;color:#2B2171}
.heat__cell--late{background:var(--sem-late-bg);border-color:var(--sem-late-bd);color:var(--sem-late-fg)}
.heat__cell--idle{background:var(--sem-idle-bg);border-color:var(--sem-idle-bd);color:var(--sem-idle-fg)}
.heat__cell--cancelled{background:#FAFAFB;border-color:#E3E0E6;color:#A59EAF}
.legend-marks{display:flex;gap:8px;flex-wrap:wrap}
.legend-mark{
  display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:4px 12px;border-radius:999px;
  font:400 15px/22px Roboto,sans-serif;border:1px solid #E3E0E6;background:#fff;color:#34244A;
}
.legend-mark__icon{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font:500 14px/1 Roboto,sans-serif}

.blockers{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(12px,1.6vw,16px);margin-top:16px}
.blocker{background:var(--sem-late-bg);border:1px solid var(--sem-late-bd);border-left:4px solid #C0362C;border-radius:14px;padding:16px}
.blocker__head{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.blocker__name{flex:1 1 160px;font:500 17px/24px Roboto,sans-serif;color:#210F39}
.blocker__count{font:700 20px/26px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#C0362C}
.blocker__type{font:400 15px/22px Roboto,sans-serif;color:#635774}
.blocker__stages{font:400 16px/24px Roboto,sans-serif;color:#34244A;margin-top:8px;text-wrap:pretty}

.type-row{display:flex;flex-direction:column;gap:8px}
.type-row__head{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline}
.type-row__label{flex:1 1 200px;font:400 17px/24px Roboto,sans-serif;color:#34244A}
.type-row__count{font:400 15px/22px Roboto,sans-serif;color:#635774}
.type-bar{display:flex;align-items:center;gap:12px}
.type-bar__label{width:56px;flex:none;font:400 15px/22px Roboto,sans-serif;color:#635774}
.type-bar__track{flex:1;height:12px;border-radius:999px;background:#E9E7EE;overflow:hidden}
.type-bar__value{width:56px;flex:none;text-align:right;font:400 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#4C3D5F}

/* выдвижная панель детализации */
.drawer{position:fixed;inset:0;z-index:var(--z-drawer);display:flex;justify-content:flex-end}
.drawer[hidden]{display:none}
.drawer__scrim{position:absolute;inset:0;background:rgba(19,0,44,.5);border:0;cursor:pointer}
.drawer__panel{
  position:relative;width:min(560px,100%);height:100%;overflow:auto;background:#fff;
  box-shadow:var(--sh-drawer);padding:clamp(16px,3vw,32px);display:flex;flex-direction:column;gap:24px;
}
.drawer__head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between}
.drawer__facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}

/* ───────── модалки ───────── */
.modal{position:fixed;inset:0;background:rgba(19,0,44,.5);z-index:var(--z-modal);display:grid;place-items:center;padding:clamp(12px,3vw,32px)}
.modal[hidden]{display:none}
.modal__box{width:100%;max-width:760px;max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:var(--sh-pop);padding:clamp(20px,3vw,32px)}
.modal__box--narrow{max-width:600px}
.modal__head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.modal__eyebrow{font:400 15px/22px Roboto,sans-serif;color:#635774}
.modal__title{font:700 clamp(22px,3vw,28px)/1.25 Roboto,sans-serif;color:#210F39}
.modal__text{font:400 17px/26px Roboto,sans-serif;color:#4C3D5F;margin-top:8px}
.modal__close{width:48px;height:48px;border:1px solid #E3E0E6;border-radius:12px;background:#fff;color:#4C3D5F;font:400 20px/1 Roboto,sans-serif;cursor:pointer}
.modal__close:hover{border-color:#2B2171;color:#2B2171}
.modal__footer{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:24px}
.modal__footer--right{justify-content:flex-end}
.modal__note{flex:1 1 160px;font:400 15px/22px Roboto,sans-serif;color:#635774}
.modal__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:24px}

.diff-row{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline;padding:12px 16px;border:1px solid #E3E0E6;border-radius:12px}
.diff-row__name{flex:1 1 200px;font:400 17px/24px Roboto,sans-serif;color:#210F39}
.diff-row__was{font:400 16px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#635774}
.diff-row__arrow{font:400 16px/24px Roboto,sans-serif;color:#A59EAF}
.diff-row__will{font:500 16px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39}
.diff-row__shift{font:500 16px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#C0362C}

/* мастер создания проекта */
.wizard-stage{
  display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 16px;border-radius:12px;
  border:1px solid #E3E0E6;background:#fff;text-align:left;cursor:pointer;
}
.wizard-stage:hover{border-color:#2B2171}
.wizard-stage.is-off{background:#FAFAFB}
.wizard-stage__box{
  width:24px;height:24px;min-width:24px;border-radius:6px;display:grid;place-items:center;
  border:2px solid #2B2171;background:#2B2171;color:#fff;font:500 14px/1 Roboto,sans-serif;
}
.wizard-stage.is-off .wizard-stage__box{border-color:#A59EAF;background:#fff;color:transparent}
.wizard-stage__n{width:28px;flex:none;font:400 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#635774}
.wizard-stage__name{flex:1;min-width:0;font:400 17px/24px Roboto,sans-serif;color:#210F39}
.wizard-stage.is-off .wizard-stage__name{color:#635774;text-decoration:line-through}
.wizard-summary{margin-top:16px;padding:16px;border-radius:12px;background:#F8F7F9;border:1px solid #E3E0E6}
.wizard-summary__value{font:700 clamp(22px,2.8vw,28px)/1.2 Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39;margin-top:4px}
.wizard-list{display:flex;flex-direction:column;gap:8px;margin-top:16px}

/* ───────── тосты ───────── */
.toast-stack{
  position:fixed;left:clamp(12px,3vw,32px);right:clamp(12px,3vw,32px);bottom:clamp(12px,3vw,32px);
  z-index:var(--z-toast);display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none;
}
.toast{
  display:flex;align-items:flex-start;gap:12px;width:100%;max-width:400px;padding:16px;
  border-radius:12px;background:#fff;border:1px solid #B7DFC8;border-left:4px solid #0E7A4F;
  box-shadow:var(--sh-pop);pointer-events:auto;
}
.toast--error{border-color:#F0C4BF;border-left-color:#C0362C}
.toast__icon{width:28px;height:28px;flex:none;border-radius:999px;background:#E6F4EC;color:#0E7A4F;display:grid;place-items:center;font:500 16px/1 Roboto,sans-serif}
.toast--error .toast__icon{background:#FBEAE8;color:#C0362C}
.toast__body{flex:1;min-width:0}
.toast__title{font:500 17px/24px Roboto,sans-serif;color:#210F39}
.toast__text{font:400 15px/22px Roboto,sans-serif;color:#4C3D5F}
.toast__close{width:44px;height:44px;border:0;background:transparent;color:#635774;font:400 18px/1 Roboto,sans-serif;cursor:pointer;border-radius:8px}
.toast__close:hover{background:#F1F0F2}

/* ───────── экран входа («сильный» регистр) ───────── */
.login{display:flex;min-height:100vh;background:linear-gradient(90deg,#13002C 0%,#2B2171 100%)}
.login__form{flex:0 0 58%;min-width:0;display:flex;align-items:center;padding:64px;overflow:auto}
.login__inner{width:100%;max-width:540px}
.login__brand{display:flex;align-items:center;gap:12px}
.login__brand-text{font:900 italic 26px/28px 'Roboto Condensed',sans-serif;text-transform:uppercase;color:#fff;letter-spacing:.01em;white-space:nowrap}
.login__title{font:900 italic 48px/50px 'Roboto Condensed',sans-serif;text-transform:uppercase;color:#fff;margin:48px 0 0;max-width:16ch;letter-spacing:.01em}
.login__lead{font:400 18px/28px Roboto,sans-serif;color:rgba(255,255,255,.78);margin:16px 0 0;max-width:44ch}
.login__fields{display:flex;flex-direction:column;gap:24px;margin-top:32px}
.login__label{display:block;font:400 16px/24px Roboto,sans-serif;color:rgba(255,255,255,.86);margin-bottom:8px}
.login__input{
  width:100%;height:56px;padding:0 16px;border-radius:8px;border:1px solid #fff;background:#fff;
  color:#210F39;font:400 18px/28px Roboto,sans-serif;outline:none;
}
.login__input.is-error{border-color:#C0362C;box-shadow:0 0 0 3px rgba(192,54,44,.32)}
.login__input:disabled{background:rgba(255,255,255,.55);color:#635774;cursor:not-allowed}
.login__pass-wrap{position:relative}
.login__pass-toggle{
  position:absolute;right:4px;top:4px;height:48px;padding:0 12px;border:0;border-radius:8px;
  background:transparent;color:#4C3D5F;font:400 16px/24px Roboto,sans-serif;cursor:pointer;
}
.login__pass-toggle:hover{background:#F1F0F2}
.login__error{display:flex;align-items:center;gap:8px;margin-top:8px;font:400 16px/24px Roboto,sans-serif;color:#FFC9C3}
.login__error-icon{width:22px;height:22px;min-width:22px;border-radius:6px;background:#FBEAE8;color:#C0362C;display:grid;place-items:center;font:500 13px/1 Roboto,sans-serif}
.login__alert{
  display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:12px;
  background:rgba(192,54,44,.16);border:1px solid #F0C4BF;
}
.login__alert--top{margin-top:32px}
.login__alert-icon{width:28px;height:28px;min-width:28px;border-radius:8px;background:#FBEAE8;color:#C0362C;display:grid;place-items:center;font:500 16px/1 Roboto,sans-serif}
.login__alert-title{font:500 18px/28px Roboto,sans-serif;color:#fff}
.login__alert-text{font:400 16px/24px Roboto,sans-serif;color:rgba(255,255,255,.78);margin-top:4px}
.login__row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.login__remember{display:inline-flex;align-items:center;gap:12px;min-height:48px;color:#fff;font:400 18px/28px Roboto,sans-serif;cursor:pointer}
.login__remember input{position:absolute;opacity:0;width:0;height:0}
.login__remember-box{
  width:24px;height:24px;min-width:24px;border-radius:6px;display:grid;place-items:center;
  border:2px solid rgba(255,255,255,.65);background:transparent;color:#13002C;font:700 14px/1 Roboto,sans-serif;
}
.login__remember input:checked + .login__remember-box{border-color:#00ADC2;background:#00ADC2}
.login__remember input:focus-visible + .login__remember-box{box-shadow:0 0 0 3px rgba(0,173,194,.5)}
.login__remember-tick{visibility:hidden}
.login__remember input:checked + .login__remember-box .login__remember-tick{visibility:visible}
.login__submit{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%;height:56px;
  border:0;border-radius:12px;cursor:pointer;background:#fff;color:#2B2171;
  font:500 18px/28px Roboto,sans-serif;box-shadow:0 12px 28px -20px rgba(19,0,44,.35);
}
.login__submit:hover{background:#F0FAFB}
.login__submit:disabled{background:rgba(255,255,255,.14);color:rgba(255,255,255,.55);cursor:not-allowed;box-shadow:none}
.login__support{font:400 16px/24px Roboto,sans-serif;color:rgba(255,255,255,.62)}
.login a{color:#B8E8EE}
.login a:hover{color:#fff}
.login__art{flex:1 1 auto;position:relative;overflow:hidden;background:linear-gradient(135deg,#2B2171 0%,#13002C 60%);min-width:0}
.login__art svg{position:absolute;inset:0;width:100%;height:100%}
.login__art-caption{
  position:absolute;left:0;right:0;bottom:0;padding:48px;
  background:linear-gradient(0deg,rgba(19,0,44,.72) 0%,rgba(19,0,44,.55) 62%,rgba(19,0,44,0) 100%);
}
.login__art-eyebrow{font:400 14px/20px Roboto,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#B8E8EE}
.login__art-title{font:900 italic 30px/34px 'Roboto Condensed',sans-serif;text-transform:uppercase;color:#fff;margin-top:8px}

/* ───────── страница ошибки ───────── */
.error-page{max-width:640px;margin:0 auto;padding:96px 24px;text-align:center}
.error-page__code{font:900 italic 64px/1 'Roboto Condensed',sans-serif;color:#2B2171}
.error-page__text{font:400 18px/28px Roboto,sans-serif;color:#635774;margin:16px 0 32px}

/* ───────── адаптив ───────── */
@media (max-width:1023px){
  .login{flex-direction:column}
  .login__form{flex:1 1 auto;order:2;padding:32px}
  .login__art{flex:0 0 200px;order:1}
  .login__title{font-size:34px;line-height:38px;margin-top:32px}
  .heat__name,.heat__head-spacer{width:180px}
  .gantt__name{width:180px}
  .gantt__ticks{margin-left:180px}
}
@media (min-width:1024px) and (max-width:1365px){
  .login__form{flex-basis:62%;padding:48px}
  .login__title{font-size:40px;line-height:44px;margin-top:32px}
}

/* ───────── метрики для руководителей ───────── */

/* таблица метрик: узкие места, разрезы по РП и продуктам */
.mtable{width:100%;border-collapse:collapse;margin-top:16px;font-variant-numeric:tabular-nums}
.mtable th{
  text-align:right;padding:8px 12px;font:500 14px/20px Roboto,sans-serif;color:#635774;
  border-bottom:1px solid #E3E0E6;white-space:nowrap;
}
.mtable th:first-child,.mtable td:first-child{text-align:left}
.mtable td{padding:10px 12px;font:400 16px/24px Roboto,sans-serif;color:#210F39;border-bottom:1px solid #F0EEF3;text-align:right}
.mtable tbody tr:last-child td{border-bottom:none}
.mtable tbody tr:hover{background:#FAF9FB}
.mtable__name{display:flex;align-items:baseline;gap:8px;min-width:0}
.mtable__num{
  flex:none;min-width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:8px;background:#F0EEF3;font:500 14px/1 Roboto,sans-serif;color:#635774;padding:0 6px;
}
.mtable__text{overflow-wrap:anywhere}
.mtable__bad{color:var(--sem-late-fg);font-weight:500}
.mtable__good{color:var(--sem-done-fg)}
.mtable__muted{color:#635774}
/* мини-полоса прогресса внутри ячейки таблицы */
.mtable__bar{display:flex;align-items:center;gap:8px;justify-content:flex-end}
/* span по умолчанию inline — width/height к нему не применяются, полоса схлопывалась в ноль */
.mtable__track{display:block;width:88px;height:8px;border-radius:999px;background:#EDEBF1;overflow:hidden;flex:none}
.mtable__fill{display:block;height:100%;border-radius:999px;background:#2B2171}
.mtable__fill--late{background:var(--sem-late-fg)}
.mtable__fill--done{background:var(--sem-done-fg)}
.mtable-wrap{overflow-x:auto}

/* фильтры и сортировка списка проектов */
.bar-filters{
  display:flex;align-items:center;gap:clamp(16px,2.4vw,32px);flex-wrap:wrap;
  margin:16px 0 4px;padding-bottom:16px;border-bottom:1px solid #F0EEF3;
}
.bar-filters__group{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bar-filters__label{font:400 15px/22px Roboto,sans-serif;color:#635774;white-space:nowrap}
.bar-filters__check{display:flex;align-items:center;gap:8px;cursor:pointer;font:400 15px/22px Roboto,sans-serif;color:#635774;white-space:nowrap}
.bar-filters__check input{width:16px;height:16px;accent-color:#2B2171;cursor:pointer}
.bar-filters__count{
  margin-left:auto;font:400 15px/22px Roboto,sans-serif;color:#635774;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
/* сегментированный переключатель */
.seg{display:inline-flex;background:#F0EEF3;border-radius:12px;padding:3px;gap:2px;flex-wrap:wrap}
.seg__btn{
  appearance:none;border:0;background:transparent;cursor:pointer;
  padding:7px 14px;border-radius:9px;white-space:nowrap;
  font:400 15px/22px Roboto,sans-serif;color:#635774;
  transition:background .12s ease,color .12s ease;
}
.seg__btn:hover{color:#210F39}
.seg__btn.is-active{background:#fff;color:#210F39;font-weight:500;box-shadow:0 1px 3px rgba(19,0,44,.12)}
.seg__btn:focus-visible{outline:2px solid #2B2171;outline-offset:2px}

/* топ-движения: три колонки — рост, падение, застой */
.moves{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:16px}
.moves__col{border:1px solid #E3E0E6;border-radius:16px;padding:16px;background:#fff}
.moves__title{font:500 16px/24px Roboto,sans-serif;color:#210F39;display:flex;align-items:center;gap:8px}
.moves__mark{
  width:24px;height:24px;flex:none;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  font:500 14px/1 Roboto,sans-serif;
}
.moves__col--up .moves__mark{background:var(--sem-ahead-bg);color:var(--sem-ahead-fg);border:1px solid var(--sem-ahead-bd)}
.moves__col--down .moves__mark{background:var(--sem-late-bg);color:var(--sem-late-fg);border:1px solid var(--sem-late-bd)}
.moves__col--flat .moves__mark{background:var(--sem-idle-bg);color:var(--sem-idle-fg);border:1px solid var(--sem-idle-bd)}
.moves__hint{font:400 14px/20px Roboto,sans-serif;color:#635774;margin-top:4px}
.moves__list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.moves__row{display:flex;align-items:baseline;gap:12px;justify-content:space-between}
.moves__name{font:400 15px/22px Roboto,sans-serif;color:#210F39;overflow-wrap:anywhere}
.moves__value{font:500 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.moves__value--up{color:var(--sem-ahead-fg)}
.moves__value--down{color:var(--sem-late-fg)}
.moves__value--flat{color:#635774}
.moves__empty{font:400 15px/22px Roboto,sans-serif;color:#635774;margin-top:12px}

/* прогноз: план против прогноза одной строкой */
.forecast{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:16px}
.forecast__cell{border:1px solid #E3E0E6;border-radius:16px;padding:16px;background:#fff}
.forecast__label{font:400 15px/22px Roboto,sans-serif;color:#635774}
.forecast__value{
  margin:4px 0;font:700 clamp(22px,2.2vw,28px)/1.2 Roboto,sans-serif;
  font-variant-numeric:tabular-nums;color:#210F39;
}
.forecast__value--bad{color:var(--sem-late-fg)}
.forecast__value--good{color:var(--sem-done-fg)}
.forecast__sub{font:400 14px/20px Roboto,sans-serif;color:#635774}

/* ───────── печать отчёта: A4 альбомная ───────── */
@media print{
  @page{size:A4 landscape;margin:12mm}
  body{background:#fff}
  .topbar,.page-head__actions,.toast-stack,.no-print,.bar-filters{display:none !important}
  /* фильтры на печати не нужны — показываем все строки, что бы ни было выбрано на экране */
  .bar-row[hidden]{display:block !important}
  /* свёрнутые на экране проекты на печати раскрываем: лист должен быть полным */
  .t3__toggle{display:none !important}
  .t3__group-rows[hidden]{display:block !important}
  .card,.kpi{break-inside:avoid;border-color:#CBC7D1}
  .print-page{break-after:page}
  .print-page:last-child{break-after:auto}
  .heat__inner{min-width:0}
  .moves__col,.forecast__cell,.mtable tr{break-inside:avoid;border-color:#CBC7D1}
  .mtable-wrap{overflow-x:visible}
  .mtable__track,.mtable__fill,.moves__mark{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ───────── отчёт-дашборд: сетки, фильтры, стеки, таблица трёх групп ───────── */

/* Две и три карточки в ряд; на узких экранах — в столбик */
.cards-3{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:clamp(12px,1.6vw,24px);align-items:start}
@media (max-width:1100px){.cards-3{grid-template-columns:1fr}}
.cards-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,24px);align-items:start}
@media (max-width:900px){.cards-2{grid-template-columns:1fr}}
/* Карточек две вместо трёх — они шире, поэтому холст ниже, чем у одиночного графика */
.cards-2 .chart--tall{height:340px}

/* Панель фильтров и пресетов */
.rfilters__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.rfilters__field{display:flex;flex-direction:column;gap:8px}
.rfilters__label{font:400 15px/22px Roboto,sans-serif;color:#635774}
.rfilters__presets{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin-top:24px;padding-top:24px;border-top:1px solid #F1F0F2;
}
.rfilters__count{margin-left:auto;font:400 16px/24px Roboto,sans-serif;color:#80758D;font-variant-numeric:tabular-nums}

/* Область графика Chart.js: холст тянется по контейнеру */
.chart{position:relative;height:260px;margin-top:16px}
.chart--tall{height:420px}

/* Стеки трёх групп: три сегмента, внутри каждого — своя заливка прогресса */
.stacks{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.stack{display:flex;align-items:center;gap:16px}
.stack__name{
  width:340px;flex:none;font:400 16px/22px Roboto,sans-serif;color:#34244A;
  /* Названия проектов длинные — переносим, а не обрезаем многоточием. */
  overflow-wrap:anywhere;
}
.stack__track{flex:1;display:flex;gap:2px;height:36px;border-radius:8px;overflow:hidden}
.stack__part{position:relative;flex:1 1 0;min-width:0;display:grid;place-items:center;overflow:hidden}
.stack__part--empty .stack__value{color:#A59EAF}
.stack__fill{position:absolute;inset:0 auto 0 0}
.stack__value{
  position:relative;font:500 14px/20px Roboto,sans-serif;font-variant-numeric:tabular-nums;
  color:#210F39;mix-blend-mode:luminosity;
}
@media (max-width:900px){
  .stack{flex-wrap:wrap}
  .stack__name{width:100%}
}


/* Таблица «портфель по трём группам» */
.t3-wrap{overflow-x:auto;margin-top:16px}
.t3{min-width:0}
.t3__head{display:flex;background:var(--tbl-head-bg);border-bottom:1px solid var(--tbl-head-bd);border-radius:8px 8px 0 0}
.t3__group{margin-top:16px}
.t3__group-head{display:flex;align-items:center;gap:12px;padding:0 4px 8px;flex-wrap:wrap}
/* Стрелка сворачивания: отдельная кнопка, потому что название — ссылка на проект */
.t3__toggle{
  width:26px;height:26px;flex:none;padding:0;cursor:pointer;
  background:none;border:1px solid var(--tbl-head-bd);border-radius:8px;
  color:#635774;font-size:13px;line-height:1;
}
.t3__toggle:hover{background:var(--tbl-head-bg);color:#210F39}
.t3__collapse-all{margin-left:8px}
.t3__group-name{font:500 19px/26px Roboto,sans-serif;color:#210F39}
.t3__group-total{margin-left:auto;display:flex;align-items:center;gap:14px;font:400 15px/22px Roboto,sans-serif;color:#635774;font-variant-numeric:tabular-nums}
.t3__group-avg{white-space:nowrap}
.t3__row{display:flex;align-items:center;min-height:var(--den-row-h);border-bottom:1px solid var(--tbl-row-bd)}
.t3__row:hover{background:var(--tbl-hover)}
.t3__cell{padding:var(--den-cell-py) 8px;font:400 15px/22px Roboto,sans-serif;color:#34244A}
.t3__cell--stage{flex:1 1 200px;min-width:0;display:flex;align-items:center;gap:8px}
.t3__cell--date{width:104px;flex:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.t3__cell--late{color:var(--sem-risk-fg);font-weight:500}
.t3__cell--state{width:110px;flex:none}
.t3__cell--delta{width:100px;flex:none;white-space:nowrap}
.t3__cell--prog{width:170px;flex:none;display:flex;align-items:center;gap:8px}
.t3__cell--prog .progress{flex:1;min-width:56px}
.t3__pct{width:48px;flex:none;text-align:right;font:500 15px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39;white-space:nowrap}
.t3__head .t3__cell{font:500 15px/22px Roboto,sans-serif;color:#4C3D5F}

@media print{
  .cards-3,.cards-2{grid-template-columns:1fr}
  .chart{height:300px}
  .cards-2 .chart--tall{height:300px}
  .stack__fill,.stack__part,.gantt__plan,.gantt__fact{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .t3-wrap{overflow-x:visible}
  .t3{min-width:0}
  .rfilters,.seg{display:none !important}
}

/* ───────── дашборд: кликабельные проекты, состояние в таблице трёх этапов ───────── */

/* Название проекта — ссылка на карточку; подчёркивание только по наведению */
.bar-row{display:block;padding:12px 0;border-bottom:1px solid var(--tbl-row-bd)}
.bar-row:last-child{border-bottom:0}
.bar-row__name{
  flex:1 1 200px;font:400 17px/24px Roboto,sans-serif;color:#210F39;
  text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.bar-row__name:hover{color:#2B2171;text-decoration:underline;text-underline-offset:3px}
.t3__group-name{
  font:500 19px/26px Roboto,sans-serif;color:#210F39;text-decoration:none;
}
.t3__group-name:hover{color:#2B2171;text-decoration:underline;text-underline-offset:3px}

/* Состояние в таблице — цветной текст, как в макете (не бейдж) */
.t3__state--done{color:var(--sem-done-fg);font-weight:500}
.t3__state--ahead{color:var(--sem-ahead-fg);font-weight:500}
.t3__state--risk{color:var(--sem-risk-fg);font-weight:500}
.t3__state--late{color:var(--sem-late-fg);font-weight:500}
.t3__state--idle{color:var(--sem-idle-fg);font-weight:500}
.t3__cell--risk{color:var(--sem-risk-fg);font-weight:500}
.t3__cell--empty{color:#A59EAF}

/* Зебра строк внутри проекта — как в макете */
.t3__row:nth-child(odd){background:var(--tbl-zebra)}
.t3__row:nth-child(odd):hover{background:var(--tbl-hover)}

.legend__swatch--sm{width:20px;height:12px;border-radius:6px}

/* ───────── объединённый блок: прогресс + прогноз одной строкой ───────── */
/* Колонки одни и те же в шапке и в строках, поэтому сетка вынесена в переменную */
.prow-head,
.prow{
  display:grid;
  grid-template-columns:minmax(180px,1fr) 130px 175px 95px 105px minmax(170px,220px);
  align-items:center;
  gap:12px;
}
.prow-head{
  padding:8px 12px;margin-top:16px;
  background:var(--tbl-head-bg);border:1px solid var(--tbl-head-bd);border-radius:12px;
  font:500 15px/22px Roboto,sans-serif;color:#4C3D5F;
}
.prow-head__dates,.prow-head__shift,.prow-head__delta,.prow-head__prog{text-align:left}
.prow{padding:12px;border-bottom:1px solid var(--tbl-row-bd)}
.prow:last-child{border-bottom:0}
.prow:hover{background:var(--tbl-hover)}
.prow__name{
  font:400 17px/24px Roboto,sans-serif;color:#210F39;text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
.prow__name:hover{color:#2B2171;text-decoration:underline;text-underline-offset:3px}
.prow__dates{display:flex;flex-direction:column;font-variant-numeric:tabular-nums;white-space:nowrap}
.prow__plan{font:400 15px/20px Roboto,sans-serif;color:#635774}
.prow__fc{font:500 16px/22px Roboto,sans-serif;color:#210F39}
.prow__delta{min-width:0;white-space:nowrap}
.prow__flat,.t3__flat{font:400 14px/20px Roboto,sans-serif;color:#A59EAF;white-space:nowrap}
.prow__prog{display:flex;align-items:center;gap:10px;min-width:0}
.prow__prog .progress{flex:1;min-width:60px}
.prow__pct{
  width:52px;flex:none;text-align:right;
  font:500 17px/24px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39;
}

/* Узкий экран: шапку прячем, строка складывается в две строки */
@media (max-width:1080px){
  .prow-head{display:none}
  .prow{grid-template-columns:1fr auto;gap:8px 12px}
  .prow__name{grid-column:1/2}
  .prow__state{grid-column:2/3;justify-self:end}
  .prow__dates{grid-column:1/2}
  .prow__shift{grid-column:2/3;justify-self:end}
  .prow__delta{grid-column:1/2}
  .prow__prog{grid-column:1/-1}
}
/* Трек и заливка внутри строки — span'ы, поэтому блочность задаём явно */
.prow__prog .progress{display:block;position:relative;overflow:hidden}
.prow__prog .progress__bar{display:block;height:100%}

/* ───────── карточка проекта: таблица этапов (макет «Карточкапроекта») ───────── */
.spark{display:flex;align-items:flex-end;gap:3px;height:34px;margin-top:10px}
.spark__bar{flex:1;min-width:2px;border-radius:3px;background:#2B2171;opacity:.85}
.spark__bar--empty{background:#E3E0E6;opacity:1}

.stage-table{padding:0;overflow:hidden}
.stage-table__scroll{overflow-x:auto}
.stage-table__inner{min-width:1120px}
.stage-table__head{display:flex;align-items:center;background:#F8F7F9;border-bottom:1px solid #CBC7D1;
  font:500 15px/22px Roboto,sans-serif;color:#635774}
.stage-table__head .stage-cell{padding:12px 8px}
.stage-table__empty{padding:24px;text-align:center;font:400 16px/24px Roboto,sans-serif;color:#635774}

.stage-cell{flex:none;padding:0 8px;min-width:0}
.stage-cell--num{width:56px;text-align:center;padding-left:0;padding-right:0}
.stage-cell--name{flex:1 1 320px;text-align:left}
.stage-cell--plan,.stage-cell--fact{width:200px}
.stage-cell--status{width:150px}
.stage-cell--prog{width:200px}
.stage-cell--chev{width:36px;text-align:center}

.stage-row{border-bottom:1px solid #F1F0F2;background:transparent}
.stage-row[hidden]{display:none}
.stage-row.is-open{background:#fff}
.stage-row--grp-prod.is-open{box-shadow:inset 3px 0 0 0 var(--grp-prod)}
.stage-row--grp-docs.is-open{box-shadow:inset 3px 0 0 0 var(--grp-docs)}
.stage-row--grp-perm.is-open{box-shadow:inset 3px 0 0 0 var(--grp-perm)}
.stage-row--late:not(.is-open) .stage-row__line{background:#FEF7F6}

.stage-row__line{display:flex;align-items:center;width:100%;min-height:60px;padding:6px 0;
  border:0;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit}
.stage-row__line:hover{background:#FAFAFC}
.stage-row__num{font:500 16px/22px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#635774}
.stage-row--grp-prod .stage-row__num{color:var(--grp-prod)}
.stage-row--grp-docs .stage-row__num{color:var(--grp-docs)}
.stage-row__name{display:flex;align-items:center;gap:10px}
.stage-row__dot{width:10px;height:28px;flex:none;border-radius:6px;background:#CBC7D1}
.stage-row--grp-prod .stage-row__dot{background:var(--grp-prod)}
.stage-row--grp-docs .stage-row__dot{background:var(--grp-docs)}
.stage-row--grp-perm .stage-row__dot{background:var(--grp-perm)}
.stage-row__text{min-width:0}
.stage-row__title{display:block;font:500 17px/24px Roboto,sans-serif;color:#210F39;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stage-row__dept{display:block;font:400 15px/20px Roboto,sans-serif;color:#80758D;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stage-row__dates{white-space:nowrap;font:400 16px/22px Roboto,sans-serif;
  font-variant-numeric:tabular-nums;color:#4C3D5F}
.stage-row__dates--late{font-weight:500;color:#C0362C}
.stage-row__dates--empty{color:#A59EAF}
.stage-row__prog{display:flex;align-items:center;gap:10px}
.stage-row__pct{width:58px;flex:none;text-align:right;font:500 16px/22px Roboto,sans-serif;
  font-variant-numeric:tabular-nums;color:#34244A}
.stage-row__chev{font:400 16px/24px Roboto,sans-serif;color:#80758D}
.stage-row.is-open .stage-row__chev{transform:rotate(90deg)}
.progress--inline{flex:1;margin-top:0;display:block;position:relative}
.progress--inline .progress__bar{display:block;height:100%}

.stage-row__body{padding:20px clamp(14px,2vw,24px) 24px;background:#FBFAFC;border-top:1px solid #EDEBF1;
  display:flex;flex-direction:column;gap:20px}
.stage-row__body[hidden]{display:none}

.stage-months__title{font:500 18px/26px Roboto,sans-serif;color:#210F39}
.stage-months__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,110px));gap:8px;margin-top:12px}
.stage-month{padding:8px 6px;border-radius:10px;text-align:center;background:#F3F2F6}
.stage-month--done{background:var(--sem-done-bg)}
.stage-month--work{background:#EAE9F1}
.stage-month--idle{background:#FAFAFB}
.stage-month--empty{background:#fff}
.stage-month__bar-box{height:64px;display:flex;align-items:flex-end}
.stage-month__bar{width:100%;border-radius:6px;background:#2B2171}
.stage-month--done .stage-month__bar{background:#0E7A4F}
.stage-month--empty .stage-month__bar,.stage-month--idle .stage-month__bar{background:#E3E0E6}
.stage-month__value{margin-top:6px;font:500 16px/22px Roboto,sans-serif;
  font-variant-numeric:tabular-nums;color:#4C3D5F}
.stage-month--done .stage-month__value{color:var(--sem-done-fg)}
.stage-month--work .stage-month__value{color:#2B2171}
.stage-month--empty .stage-month__value{color:#A59EAF}
.stage-month__label{font:400 15px/20px Roboto,sans-serif;color:#80758D;white-space:nowrap}
.stage-month__tag{font:500 14px/18px Roboto,sans-serif;color:#04627C;white-space:nowrap}

.stage-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px 24px}
.stage-fields__wide{grid-column:span 2}
.stage-fields__slices{font:400 17px/25px Roboto,sans-serif;font-variant-numeric:tabular-nums;color:#210F39}
.field__hint{margin-top:4px;min-height:20px;font:400 14px/20px Roboto,sans-serif;color:#80758D}

.comments{display:flex;flex-direction:column;gap:20px}
.comment{display:flex;gap:14px}
.comment__head{display:flex;gap:10px;flex-wrap:wrap;align-items:baseline}
.comment__who{font:500 17px/26px Roboto,sans-serif;color:#210F39}
.comment__when{font:400 15px/22px Roboto,sans-serif;color:#635774;font-variant-numeric:tabular-nums}
.comment__stage{font:400 15px/22px Roboto,sans-serif;color:#80758D}
.comment__text{font:400 17px/26px Roboto,sans-serif;color:#34244A;text-wrap:pretty}

/* ───────── переключатель «этап в ожидании» ───────── */
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;min-height:44px}
.switch__input{width:20px;height:20px;flex:none;accent-color:#2B2171;cursor:pointer}
.switch__text{font:400 17px/24px Roboto,sans-serif;color:#210F39}
.switch:hover .switch__text{color:#2B2171}
