/* Компоненты Carbon Design System для лаборатории.

   Каждый блок — реализация компонента Carbon на его же токенах: цвета из theme.css,
   отступы и типографика из layout.css, длительности и кривые из motion.css.
   Своих цветов, размеров и длительностей здесь нет ни одного — если понадобилось
   новое значение, оно берётся из токенов, а не придумывается.

   Правила Carbon, которые здесь закреплены:
   · углы всегда прямые (радиус только у тэгов — это часть их формы);
   · слои разделяются фоном (layer-01/02/accent), а не тенями;
   · на экране одна кнопка primary;
   · фокус виден всегда: рамка 2px цветом --cds-focus;
   · интерактивный элемент имеет hover, active, focus и disabled.
*/

/* ═══════════ основа страницы ═══════════ */

body {
  margin: 0;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: var(--cds-type-scale-02);
  line-height: 1.42857;
  letter-spacing: 0.16px;
  background: var(--cds-background);
  color: var(--cds-text-primary);
  -webkit-font-smoothing: antialiased;
}

/* Родные элементы браузера (значок календаря, полосы прокрутки) — в теме страницы: тема живёт
   в prefers-color-scheme, и без этого значок в поле даты оставался чёрным на тёмном поле. */
:root { color-scheme: light dark; }

*, *::before, *::after { box-sizing: border-box; }
button, input, select, textarea { font: inherit; letter-spacing: inherit; }

.cds-icon { width: 1rem; height: 1rem; fill: currentColor; flex: none; }
.cds-icon-20 { width: 1.25rem; height: 1.25rem; }
.cds-icon-24 { width: 1.5rem; height: 1.5rem; }

/* ═══════════ UI Shell ═══════════ */

.cds-header {
  position: sticky;
  top: 0;
  z-index: 8000;
  display: flex;
  align-items: center;
  height: var(--cds-size-lg);
  background: #161616;
  border-bottom: 1px solid #393939;
}

.cds-header__name {
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-03);
  height: 100%;
  padding: 0 var(--cds-spacing-05);
  color: #f4f4f4;
  font-size: var(--cds-type-scale-02);
  font-weight: 600;
  letter-spacing: 0.16px;
  text-decoration: none;
}
.cds-header__name em { font-style: normal; font-weight: 400; color: #c6c6c6; }

.cds-header__nav { display: flex; height: 100%; }

.cds-header__link {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 var(--cds-spacing-05);
  color: #c6c6c6;
  font-size: var(--cds-type-scale-02);
  letter-spacing: 0.16px;
  text-decoration: none;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive),
              color var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-header__link::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: var(--cds-border-interactive);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--cds-duration-moderate-01) var(--cds-motion-standard-productive);
}
.cds-header__link:hover { background: #353535; color: #f4f4f4; }
.cds-header__link[aria-current] { background: #262626; color: #f4f4f4; }
.cds-header__link[aria-current]::after { transform: scaleX(1); }
.cds-header__link:focus-visible { outline: 2px solid #ffffff; outline-offset: -2px; }

.cds-header__aside {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-03);
  padding: 0 var(--cds-spacing-05);
  color: #c6c6c6;
  font-size: var(--cds-type-scale-01);
  letter-spacing: 0.32px;
}

/* Второй aside (имя и выход) идёт сразу за первым, а не отжимается вправо ещё раз. */
.cds-header__aside + .cds-header__aside {
  margin-left: 0;
}

.cds-header__logout {
  background: none;
  border: 0;
  font: inherit;
  cursor: pointer;
}

/* Ссылка справа, рядом с именем: того же размера, что имя и «Выйти», а не как пункт меню. */
.cds-header__link--aside { font: inherit; }

/* тихий пульс: единственное непрерывное движение в системе */
.cds-pulse { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--cds-support-success); flex: none; }
.cds-pulse::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 50%;
  border: 1px solid var(--cds-support-success);
  animation: cds-ring 2.4s var(--cds-motion-entrance-productive) infinite;
}
@keyframes cds-ring { 0% { transform: scale(1); opacity: 0.9; } 100% { transform: scale(2.6); opacity: 0; } }

/* ═══════════ каркас страницы ═══════════ */

.cds-page { max-width: 82rem; margin: 0 auto; padding: var(--cds-spacing-07) var(--cds-spacing-05) var(--cds-spacing-10); }

.cds-page__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--cds-spacing-05);
  margin-bottom: var(--cds-spacing-06);
}
.cds-page__title { margin: 0; font-size: var(--cds-type-scale-07); line-height: 1.28572; font-weight: 400; letter-spacing: 0; }
.cds-page__crumb { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); margin-bottom: var(--cds-spacing-03); }
.cds-page__aside { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); text-align: right; line-height: 1.6; }
.cds-page__aside b { color: var(--cds-text-primary); font-weight: 600; }

/* ═══════════ Tile ═══════════ */

.cds-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 1px;
  background: var(--cds-border-subtle-01);
  margin-bottom: var(--cds-spacing-06);
}

.cds-tile {
  position: relative;
  overflow: hidden;
  display: block;
  width: 100%;
  min-height: 5.5rem;
  padding: var(--cds-spacing-05);
  text-align: left;
  border: none;
  background: var(--cds-layer-01);
  color: inherit;
  text-decoration: none;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-tile--clickable { cursor: pointer; }
.cds-tile--clickable:hover { background: var(--cds-layer-hover-01); }
.cds-tile--clickable:active { background: var(--cds-layer-active-01); }
.cds-tile:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }

/* полоса-индикатор слева вырастает снизу вверх */
.cds-tile--clickable::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--cds-interactive);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform var(--cds-duration-moderate-01) var(--cds-motion-entrance-productive);
}
.cds-tile--clickable:hover::before,
.cds-tile--selected::before { transform: scaleY(1); }

.cds-tile__label { display: flex; align-items: center; gap: var(--cds-spacing-03); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-tile__dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.cds-tile__value {
  display: flex;
  align-items: baseline;
  gap: var(--cds-spacing-04);
  margin-top: var(--cds-spacing-03);
  font-size: var(--cds-type-scale-08);
  line-height: 1.199;
  font-weight: 300;
  font-variant-numeric: tabular-nums;
}
.cds-tile__value em { font-style: normal; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-tile__value--urgent { color: var(--cds-text-error); }
.cds-tile__arrow {
  position: absolute;
  right: var(--cds-spacing-05);
  bottom: var(--cds-spacing-05);
  color: var(--cds-icon-primary);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity var(--cds-duration-fast-02) var(--cds-motion-entrance-productive),
              transform var(--cds-duration-fast-02) var(--cds-motion-entrance-productive);
}
.cds-tile--clickable:hover .cds-tile__arrow { opacity: 1; transform: none; }

/* число «подпрыгивает», когда изменилось */
.cds-bump { display: inline-block; animation: cds-bump var(--cds-duration-moderate-02) var(--cds-motion-standard-productive); }
@keyframes cds-bump { from { transform: translateY(-0.35em); opacity: 0; } to { transform: none; opacity: 1; } }

/* ═══════════ Button ═══════════ */

.cds-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cds-spacing-07);
  min-height: var(--cds-size-md);
  max-width: 20rem;
  padding: 0 var(--cds-spacing-05);
  border: 1px solid transparent;
  cursor: pointer;
  overflow: hidden;
  font-size: var(--cds-type-scale-02);
  letter-spacing: 0.16px;
  text-align: left;
  text-decoration: none;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive),
              border-color var(--cds-duration-fast-01) var(--cds-motion-standard-productive),
              color var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-btn:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -4px; }
/* На залитой кнопке синее кольцо сливалось с фоном (у primary тот же синий). Как в Carbon:
   рамка цвета фокуса по краю и кольцо цвета фона внутри. */
.cds-btn--primary:focus-visible,
.cds-btn--secondary:focus-visible,
.cds-btn--danger:focus-visible { border-color: var(--cds-focus); outline-color: var(--cds-focus-inset); }
.cds-btn:disabled { cursor: not-allowed; background: var(--cds-button-disabled); color: var(--cds-text-on-color-disabled); border-color: transparent; }

.cds-btn--primary { background: var(--cds-button-primary); color: var(--cds-text-on-color); }
.cds-btn--primary:hover:not(:disabled) { background: var(--cds-button-primary-hover); }
.cds-btn--primary:active:not(:disabled) { background: var(--cds-button-primary-active); }

.cds-btn--secondary { background: var(--cds-button-secondary); color: var(--cds-text-on-color); }
.cds-btn--secondary:hover:not(:disabled) { background: var(--cds-button-secondary-hover); }

.cds-btn--tertiary { background: transparent; color: var(--cds-button-tertiary); border-color: var(--cds-button-tertiary); }
.cds-btn--tertiary:hover:not(:disabled) { background: var(--cds-button-tertiary-hover); color: var(--cds-text-inverse); }

.cds-btn--ghost { background: transparent; color: var(--cds-link-primary); gap: var(--cds-spacing-03); min-height: var(--cds-size-sm); padding: 0 var(--cds-spacing-04); }
.cds-btn--ghost:hover:not(:disabled) { background: var(--cds-background-hover); }

.cds-btn--danger { background: var(--cds-button-danger-primary); color: var(--cds-text-on-color); }
.cds-btn--danger:hover:not(:disabled) { background: var(--cds-button-danger-hover); }

.cds-btn--sm { min-height: var(--cds-size-sm); }

/* подтверждение прямо в кнопке: галочка выезжает снизу */
.cds-btn__done {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--cds-support-success);
  color: var(--cds-text-on-color);
  transform: translateY(100%);
  transition: transform var(--cds-duration-moderate-01) var(--cds-motion-entrance-productive);
}
.cds-btn.is-done .cds-btn__done { transform: none; }

/* ═══════════ Link ═══════════ */

.cds-link {
  position: relative;
  color: var(--cds-link-primary);
  text-decoration: none;
  font-weight: 600;
}
.cds-link::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--cds-duration-fast-02) var(--cds-motion-standard-productive);
}
.cds-link:hover::after { transform: scaleX(1); }
.cds-link:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: 2px; }

/* ═══════════ Data table ═══════════ */

.cds-table-container { background: var(--cds-layer-01); }

.cds-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cds-spacing-05);
  min-height: var(--cds-size-lg);
  padding: var(--cds-spacing-03) var(--cds-spacing-03) var(--cds-spacing-03) var(--cds-spacing-05);
  border-bottom: 1px solid var(--cds-border-subtle-01);
}
.cds-table-toolbar__title { margin: 0; display: flex; align-items: center; gap: var(--cds-spacing-03); font-size: var(--cds-type-scale-02); font-weight: 600; letter-spacing: 0.16px; }
.cds-table-toolbar__count { font-weight: 400; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-table-toolbar__actions { display: flex; align-items: center; gap: var(--cds-spacing-02); }

.cds-table { width: 100%; border-collapse: collapse; }
.cds-table th {
  height: var(--cds-size-lg);
  padding: 0 var(--cds-spacing-05);
  text-align: left;
  white-space: nowrap;
  background: var(--cds-layer-accent-01);
  color: var(--cds-text-primary);
  font-size: var(--cds-type-scale-02);
  font-weight: 600;
  letter-spacing: 0.16px;
}
.cds-table td {
  /* 3.5rem — минимум всей ячейки (box-sizing: border-box): однострочная строка остаётся
     привычной, двухстрочная растёт на поля, а не прижимается к границам. */
  height: 3.5rem;
  padding: var(--cds-spacing-03) var(--cds-spacing-05);
  border-top: 1px solid var(--cds-border-subtle-01);
  /* По верху: первая строка каждой ячейки стоит на одной линии независимо от того,
     есть ли под ней оговорка. По середине число рядом с двухстрочной ячейкой уезжало. */
  vertical-align: top;
}
.cds-table tbody tr { transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive); }
.cds-table tbody tr:hover td { background: var(--cds-layer-hover-01); }
.cds-table tbody tr:focus-within td { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-table__num { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* И у заголовка, и у ячейки: `.cds-table th` перебивал одиночный модификатор
   по специфичности, и шапка числовой колонки оставалась слева от своих чисел. */
.cds-table th.cds-table__right,
.cds-table td.cds-table__right { text-align: right; font-variant-numeric: tabular-nums; }
.cds-table__sub { display: block; margin-top: var(--cds-spacing-01); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-table__right .cds-table__sub { white-space: nowrap; }

/* строка изменилась / появилась / ушла */
.cds-row-flash { animation: cds-flash var(--cds-duration-slow-02) var(--cds-motion-exit-productive); }
@keyframes cds-flash { from { background: var(--cds-highlight); } to { background: transparent; } }
.cds-row-in { animation: cds-row-in var(--cds-duration-moderate-02) var(--cds-motion-entrance-productive); }
@keyframes cds-row-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.cds-row-out { animation: cds-row-out var(--cds-duration-moderate-02) var(--cds-motion-exit-productive) forwards; }
@keyframes cds-row-out { to { opacity: 0; transform: translateX(-8px); } }

/* ═══════════ Tag ═══════════ */

.cds-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--cds-spacing-02);
  height: var(--cds-size-xs);
  padding: 0 var(--cds-spacing-03);
  border-radius: 0.75rem;
  font-size: var(--cds-type-scale-01);
  letter-spacing: 0.32px;
  white-space: nowrap;
  transition: background var(--cds-duration-moderate-01) var(--cds-motion-standard-productive),
              color var(--cds-duration-moderate-01) var(--cds-motion-standard-productive);
}
.cds-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.cds-tag--green { background: var(--cds-tag-background-green); color: var(--cds-tag-color-green); }
.cds-tag--magenta { background: var(--cds-tag-background-magenta); color: var(--cds-tag-color-magenta); }
.cds-tag--gray { background: var(--cds-tag-background-gray); color: var(--cds-tag-color-gray); }
.cds-tag--blue { background: var(--cds-tag-background-blue); color: var(--cds-tag-color-blue); }
.cds-tag--purple { background: var(--cds-tag-background-purple); color: var(--cds-tag-color-purple); }
.cds-tag--red { background: var(--cds-tag-background-red); color: var(--cds-tag-color-red); }
.cds-tag--warm-gray { background: var(--cds-tag-background-warm-gray); color: var(--cds-tag-color-warm-gray); }

/* ═══════════ Content switcher ═══════════ */

.cds-switcher {
  position: relative;
  display: flex;
  height: var(--cds-size-sm);
  border: 1px solid var(--cds-border-subtle-01);
  background: var(--cds-layer-02);
}
.cds-switcher__glider {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  background: var(--cds-layer-selected-inverse);
  transition: transform var(--cds-duration-moderate-01) var(--cds-motion-standard-productive),
              width var(--cds-duration-moderate-01) var(--cds-motion-standard-productive);
}
.cds-switcher__btn {
  position: relative;
  z-index: 1;
  padding: 0 var(--cds-spacing-04);
  border: none;
  background: transparent;
  color: var(--cds-text-secondary);
  cursor: pointer;
  font-size: var(--cds-type-scale-02);
  letter-spacing: 0.16px;
  white-space: nowrap;
  transition: color var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-switcher__btn:hover:not([aria-pressed="true"]) { color: var(--cds-text-primary); }
.cds-switcher__btn[aria-pressed="true"] { color: var(--cds-text-inverse); }
.cds-switcher__btn:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }

/* ═══════════ поля ввода ═══════════ */

.cds-field { display: flex; flex-direction: column; gap: var(--cds-spacing-02); }
/* Атрибут hidden слабее классового display: flex — без этого правила скрытое поле видно. */
[hidden] { display: none !important; }
.cds-field__label { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }

.cds-input, .cds-select {
  height: var(--cds-size-md);
  padding: 0 var(--cds-spacing-05);
  border: none;
  border-bottom: 1px solid var(--cds-border-strong-01);
  background: var(--cds-field-01);
  color: var(--cds-text-primary);
  font-size: var(--cds-type-scale-02);
  letter-spacing: 0.16px;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive),
              border-color var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-input:hover, .cds-select:hover { background: var(--cds-field-hover-01); }
.cds-input:focus, .cds-select:focus { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-input::placeholder { color: var(--cds-text-placeholder); }
.cds-input:disabled, .cds-select:disabled { background: var(--cds-field-01); color: var(--cds-text-disabled); border-bottom-color: transparent; cursor: not-allowed; }
.cds-input--invalid { border-bottom-color: var(--cds-support-error); }
.cds-field__error { display: flex; align-items: center; gap: var(--cds-spacing-02); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-error); }

/* ═══════════ уведомления ═══════════ */

.cds-notification {
  display: flex;
  align-items: flex-start;
  gap: var(--cds-spacing-04);
  padding: var(--cds-spacing-05);
  background: var(--cds-notification-background-info);
  border-left: 3px solid var(--cds-support-info);
  font-size: var(--cds-type-scale-02);
}
.cds-notification--success { background: var(--cds-notification-background-success); border-left-color: var(--cds-support-success); }
.cds-notification--warning { background: var(--cds-notification-background-warning); border-left-color: var(--cds-support-warning); }
.cds-notification--error { background: var(--cds-notification-background-error); border-left-color: var(--cds-support-error); }
.cds-notification__title { font-weight: 600; }

/* всплывающее — поднимается снизу, уходит быстрее, чем приходит */
.cds-toast {
  position: fixed;
  left: 50%;
  bottom: var(--cds-spacing-06);
  z-index: 9000;
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-04);
  min-width: 18rem;
  max-width: 90vw;
  padding: var(--cds-spacing-04) var(--cds-spacing-05);
  background: var(--cds-background-inverse);
  color: var(--cds-text-inverse);
  border-left: 3px solid var(--cds-support-success);
  font-size: var(--cds-type-scale-02);
  opacity: 0;
  transform: translate(-50%, calc(100% + var(--cds-spacing-07)));
  pointer-events: none;
  transition: transform var(--cds-duration-moderate-02) var(--cds-motion-exit-productive),
              opacity var(--cds-duration-moderate-02) var(--cds-motion-exit-productive);
}
.cds-toast.is-open {
  opacity: 1;
  transform: translate(-50%, 0);
  transition-timing-function: var(--cds-motion-entrance-productive);
}
.cds-toast__icon { color: var(--cds-support-success); }

/* ═══════════ загрузка ═══════════ */

.cds-skeleton {
  position: relative;
  overflow: hidden;
  background: var(--cds-skeleton-background);
  color: transparent !important;
}
.cds-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, var(--cds-skeleton-element), transparent);
  transform: translateX(-100%);
  animation: cds-shimmer 1.4s var(--cds-motion-standard-productive) infinite;
}
@keyframes cds-shimmer { to { transform: translateX(100%); } }

/* ═══════════ пустое состояние ═══════════ */

.cds-empty {
  padding: var(--cds-spacing-09) var(--cds-spacing-05);
  text-align: center;
  color: var(--cds-text-secondary);
  font-size: var(--cds-type-scale-02);
}
.cds-empty__icon { color: var(--cds-icon-secondary); margin-bottom: var(--cds-spacing-04); }
.cds-empty__title { display: block; margin-bottom: var(--cds-spacing-02); color: var(--cds-text-primary); font-size: var(--cds-type-scale-03); font-weight: 600; }

/* ═══════════ прочее ═══════════ */

/* иконка события в квадрате-слое */
.cds-event { display: flex; align-items: center; gap: var(--cds-spacing-04); }
.cds-event__icon {
  display: grid;
  place-items: center;
  width: var(--cds-size-sm);
  height: var(--cds-size-sm);
  flex: none;
  background: var(--cds-layer-02);
  color: var(--cds-icon-secondary);
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive),
              color var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-event--handover .cds-event__icon { background: var(--cds-tag-background-magenta); color: var(--cds-tag-color-magenta); }
.cds-event--done .cds-event__icon { background: var(--cds-tag-background-green); color: var(--cds-tag-color-green); }

/* шкала простоя: цифра сверху, полоса снизу */
.cds-idle { display: flex; flex-direction: column; align-items: flex-end; gap: var(--cds-spacing-02); }
.cds-idle__value { font-variant-numeric: tabular-nums; font-weight: 600; }
.cds-idle__value small { margin-left: var(--cds-spacing-02); font-weight: 400; font-size: var(--cds-type-scale-01); color: var(--cds-text-secondary); }
.cds-idle__meter { width: 5rem; height: 4px; background: var(--cds-layer-accent-01); overflow: hidden; }
.cds-idle__meter i {
  display: block;
  height: 100%;
  background: var(--cds-support-success);
  transform: scaleX(var(--fill, 0));
  transform-origin: left;
  transition: transform var(--cds-duration-slow-01) var(--cds-motion-entrance-productive),
              background var(--cds-duration-moderate-01) var(--cds-motion-standard-productive);
}
.cds-idle[data-level="warn"] .cds-idle__meter i { background: var(--cds-support-warning); }
.cds-idle[data-level="hot"] .cds-idle__meter i { background: var(--cds-support-error); }
.cds-idle[data-level="hot"] .cds-idle__value { color: var(--cds-text-error); }

/* лента событий */
.cds-feed { list-style: none; margin: 0; padding: var(--cds-spacing-03) 0; }
.cds-feed__item {
  display: grid;
  grid-template-columns: 3rem 1fr;
  gap: var(--cds-spacing-03);
  padding: var(--cds-spacing-03) var(--cds-spacing-05);
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-feed__item:hover { background: var(--cds-layer-hover-01); }
.cds-feed__time { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); font-variant-numeric: tabular-nums; }
.cds-feed__who { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }

/* ═══════════ доступность ═══════════ */

.cds-visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: reduce) {
  .cds-pulse::after, .cds-skeleton::after { animation: none; }
  .cds-pulse::after { display: none; }
}

/* ═══════════ доска работ ═══════════ */

/* Одна таблица на все группы: отдельные таблицы считали ширину колонок
   независимо, и колонки уезжали от группы к группе на сотню пикселей. */
.cds-table--fixed { table-layout: fixed; }
.cds-table--fixed td { overflow: hidden; text-overflow: ellipsis; }

/* Заголовок группы внимания: цветная полоса слева — что горит, видно до чтения. */
/* Селектор с .cds-table — иначе высоту перебивает общее правило `th` (48px). */
.cds-table .cds-group-head {
  height: var(--cds-size-sm);
  background: var(--cds-layer-accent-01);
  font-size: var(--cds-type-scale-01);
  letter-spacing: 0.32px;
  text-transform: uppercase;
  padding: 0 var(--cds-spacing-05);
  box-shadow: inset 3px 0 0 var(--cds-border-subtle-01);
  text-align: left;
  font-weight: 600;
}
.cds-group-rest td { padding: var(--cds-spacing-03) var(--cds-spacing-05); background: var(--cds-layer-01); }

/* Строка списка — компактная (40px, размер Carbon для плотных таблиц):
   на двадцати работах это экономит целый экран прокрутки. */
.cds-table--fixed tbody td { height: var(--cds-size-lg); }
.cds-event--quiet { gap: var(--cds-spacing-03); color: inherit; }
.cds-event--quiet > .cds-icon { color: var(--cds-icon-secondary); }
.cds-event__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cds-where { color: var(--cds-text-secondary); }
.cds-group-head--urgent { box-shadow: inset 3px 0 0 var(--cds-support-error); color: var(--cds-text-error); }
.cds-group-head--rework { box-shadow: inset 3px 0 0 var(--cds-support-warning); }
.cds-group-head--stuck { box-shadow: inset 3px 0 0 var(--cds-text-secondary); }
.cds-group-head__count { color: var(--cds-text-secondary); font-weight: 400; margin-left: var(--cds-spacing-03); }

/* Строка кликается целиком: номер — пометка, а не единственная точка входа. */
.cds-row-link { cursor: pointer; }
.cds-work-title { display: block; color: var(--cds-text-primary); text-decoration: none; font-weight: 600; }
.cds-row-link:hover .cds-work-title { color: var(--cds-link-primary); }
.cds-work-number {
  display: block;
  margin-top: var(--cds-spacing-01);
  font-size: var(--cds-type-scale-01);
  letter-spacing: 0.32px;
  color: var(--cds-text-secondary);
  font-variant-numeric: tabular-nums;
}

/* Срок: слово плюс цвет, как у статусов — смысл не кодируется одним цветом. */
.cds-due { font-size: var(--cds-type-scale-02); white-space: nowrap; }
.cds-due--overdue { color: var(--cds-text-error); font-weight: 600; }
.cds-due--soon { font-weight: 600; }
.cds-due--calm { color: var(--cds-text-secondary); }

/* ═══════════ формы прайса ═══════════ */

.cds-price-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: var(--cds-spacing-04);
  padding: var(--cds-spacing-05);
  background: var(--cds-layer-01);
  border-top: 1px solid var(--cds-border-subtle-01);
}
.cds-price-form .cds-field { flex: 1 1 12rem; }
.cds-price-form .cds-field:has(.cds-qty) { flex: 0 0 6rem; }
/* Правка расценки прямо в строке: цифра стоит в том же столбце, что и заголовок. */
.cds-rate { width: 7rem; text-align: right; padding-right: 0; }
.cds-qty { width: 5rem; text-align: right; }

/* чекбокс отбора в отчёт */
.cds-check { width: 1.05rem; height: 1.05rem; accent-color: var(--cds-interactive); cursor: pointer; }

/* ═══════════ форма приёма: блоки по порядку мыслей ═══════════ */

.cds-intake { padding: var(--cds-spacing-06); }
/* Три группы и кнопка обязаны влезать в экран ноутбука: между группами — шаг 06, не 07. */
.cds-intake .cds-fieldset { margin-bottom: var(--cds-spacing-06); }
.cds-field__req { color: var(--cds-text-helper); font-weight: 400; }
/* Форма слева, справа карточка формулы — она появляется только у изделий в единицах (зубах). */
/* Форма занимает свои 46rem, формула — весь остаток. Карточка формулы той же высоты, что форма:
   рисунок вписывается в остаток карточки, а не задаёт ей высоту. */
.cds-intake-grid { display: grid; grid-template-columns: minmax(0, 46rem) minmax(18rem, 1fr); gap: var(--cds-spacing-07); align-items: stretch; }
/* height: 0 + min-height: 100% — карточка не участвует в расчёте высоты строки, а занимает высоту формы. */
.cds-intake__teeth { padding: var(--cds-spacing-06); display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: var(--cds-spacing-03); height: 0; min-height: 100%; box-sizing: border-box; }
.cds-intake__teeth .cds-fieldset__legend { padding: 0; }
.cds-intake__teeth .cds-field__req { margin: 0; }
.cds-intake__teeth-head { display: flex; justify-content: space-between; align-items: center; gap: var(--cds-spacing-04); }
@media (max-width: 900px) {
  .cds-intake-grid { grid-template-columns: 1fr; }
  .cds-intake-grid__aside { position: static; }
}
.cds-fieldset { border: 0; padding: 0; margin: 0 0 var(--cds-spacing-07); }
.cds-fieldset__legend {
  padding: 0 0 var(--cds-spacing-04);
  font-size: var(--cds-type-scale-02);
  font-weight: 600;
  letter-spacing: 0.16px;
}
.cds-fieldset__grid { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-05); }
.cds-fieldset__grid .cds-field { flex: 1 1 12rem; }
.cds-fieldset__grid .cds-field--wide { flex: 1 1 100%; }
.cds-fieldset__grid .cds-field--full { flex: 1 1 100%; }
.cds-fieldset__grid .cds-field--narrow { flex: 0 1 7rem; }
/* Изделие, цвет и количество отвечают на один вопрос — «что делаем» — и стоят одной
   строкой. Уступчивая основа нужна против переноса: у поля в 12rem её хватает, чтобы
   вытеснить количество на вторую строку в полосе ширин, где карточка формулы сужает
   форму, и количество читается оторванным от изделия. */
.cds-fieldset__grid .cds-field--elastic,
.cds-price-form .cds-field--elastic { flex: 1 1 9rem; min-width: 0; }
/* Цвет и количество — данные в два-три знака. Без min-width поле распирает самый длинный
   вариант списка и стандартная ширина числового поля, а не то, что в них пишут: строку
   крадут у названия изделия, которому места как раз не хватает. Основа 8rem — чтобы
   «— нет —» со стрелкой списка помещался целиком, ужиматься полю нельзя. */
.cds-fieldset__grid .cds-field--tight,
.cds-price-form .cds-field--tight { flex: 0 0 8rem; min-width: 0; }
.cds-field--tight .cds-select,
.cds-field--tight .cds-input { min-width: 0; }

/* ═══════════ выбор оттенка плитками ═══════════ */
/* Поле — та же высота и нижняя черта, что у .cds-select: пользователь не должен заметить,
   что это кнопка. Панель — слой над формой без тени: слои разделяются фоном и рамкой. */
.cds-shade { position: relative; }
.cds-shade__field {
  display: flex; align-items: center; justify-content: space-between; gap: var(--cds-spacing-03);
  width: 100%; height: var(--cds-size-md); padding: 0 var(--cds-spacing-05);
  border: none; border-bottom: 1px solid var(--cds-border-strong-01);
  background: var(--cds-field-01); color: var(--cds-text-primary);
  font: inherit; text-align: left; cursor: pointer;
}
.cds-shade__field:hover { background: var(--cds-field-hover-01); }
.cds-shade__field:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-shade__field[aria-expanded="true"] { border-bottom: 2px solid var(--cds-interactive); }
.cds-shade__value:empty::before { content: attr(data-empty); color: var(--cds-text-placeholder); }
.cds-shade--invalid .cds-shade__field { border-bottom-color: var(--cds-support-error); }
.cds-shade__panel {
  position: absolute; top: calc(100% + var(--cds-spacing-02)); right: 0; z-index: 10;
  width: 24rem; max-width: calc(100vw - 2 * var(--cds-spacing-05));
  padding: var(--cds-spacing-04) var(--cds-spacing-05) var(--cds-spacing-05);
  background: var(--cds-layer-02); border: 1px solid var(--cds-border-subtle-01);
}
.cds-shade__row { display: grid; grid-template-columns: 2rem repeat(5, 1fr); gap: var(--cds-spacing-02) var(--cds-spacing-03); align-items: center; }
.cds-shade__row + .cds-shade__row { margin-top: var(--cds-spacing-02); }
.cds-shade__letter { font-size: var(--cds-type-scale-01); color: var(--cds-text-secondary); }
.cds-shade__tile {
  height: 2.25rem; border: none; background: var(--cds-layer-01); color: var(--cds-text-primary);
  font: inherit; cursor: pointer;
}
.cds-shade__tile:hover { background: var(--cds-layer-hover-01); }
.cds-shade__tile:focus-visible, .cds-shade__none:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-shade__tile[aria-selected="true"] { background: var(--cds-interactive); color: var(--cds-text-on-color); }
.cds-shade__foot { margin-top: var(--cds-spacing-04); padding-top: var(--cds-spacing-04); border-top: 1px solid var(--cds-border-subtle-01); display: flex; justify-content: flex-end; }
.cds-shade__none { border: none; background: none; color: var(--cds-link-primary); font: inherit; cursor: pointer; padding: 0; }
.cds-shade__none[aria-selected="true"] { text-decoration: underline; }
.cds-shade__error { margin-top: var(--cds-spacing-02); }
.cds-fieldset__hint {
  margin: var(--cds-spacing-03) 0 0;
  font-size: var(--cds-type-scale-01);
  letter-spacing: 0.32px;
  color: var(--cds-text-secondary);
}

/* редкие поля — за раскрывашкой, чтобы частый путь оставался коротким */
.cds-details { margin-bottom: var(--cds-spacing-05); background: var(--cds-layer-01); }
.cds-details__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cds-spacing-04);
  padding: var(--cds-spacing-04) var(--cds-spacing-05);
  font-size: var(--cds-type-scale-02);
  letter-spacing: 0.16px;
  cursor: pointer;
  list-style: none;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-details__summary::-webkit-details-marker { display: none; }
.cds-details__summary:hover { background: var(--cds-layer-hover-01); }
.cds-details__summary:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-details__summary .cds-icon { transition: transform var(--cds-duration-fast-02) var(--cds-motion-standard-productive); }
.cds-details[open] .cds-details__summary .cds-icon { transform: rotate(180deg); }
.cds-details > .cds-fieldset__grid,
.cds-details > .cds-fieldset__hint { padding: var(--cds-spacing-04) var(--cds-spacing-05) var(--cds-spacing-05); margin: 0; }
.cds-details > .cds-fieldset__hint { padding-top: 0; }

.cds-intake__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--cds-spacing-04);
  padding-top: var(--cds-spacing-05);
  border-top: 1px solid var(--cds-border-subtle-01);
}

/* ═══════════ зубная формула ═══════════ */
/* Единственная своя палитра вне токенов Carbon: цвет материала — доменный смысл, а не оформление.
   Значения взяты из @carbon/colors: yellow-30, purple-50/40, blue-60/40, red-60/40, green-50/40. */
:root {
  --lab-material-yellow: #ffe600;
  --lab-material-purple: #8a3ffc;
  --lab-material-blue: #0f62fe;
  --lab-material-red: #da1e28;
  --lab-material-green: #24a148;
}
@media (prefers-color-scheme: dark) {
  :root {
    --lab-material-purple: #a56eff;
    --lab-material-blue: #4589ff;
    --lab-material-red: #fa4d56;
    --lab-material-green: #42be65;
  }
}
.cds-teeth-wrap { position: relative; display: flex; flex-direction: column; min-height: 0; --mat: var(--lab-material-blue); }
.cds-teeth-wrap[data-color="yellow"] { --mat: var(--lab-material-yellow); }
.cds-teeth-wrap[data-color="purple"] { --mat: var(--lab-material-purple); }
.cds-teeth-wrap[data-color="blue"] { --mat: var(--lab-material-blue); }
.cds-teeth-wrap[data-color="red"] { --mat: var(--lab-material-red); }
.cds-teeth-wrap[data-color="green"] { --mat: var(--lab-material-green); }

.cds-teeth { width: 100%; flex: 1 1 auto; min-height: 0; display: block; margin: 0 auto; }
.cds-teeth__tooth:focus,
.cds-teeth__gap:focus { outline: none; }
.cds-teeth__tooth {
  fill: var(--cds-layer-02);
  stroke: none;
  stroke-width: 2;
  cursor: pointer;
  /* без transition на fill: Chrome не перерисовывает заливку, когда меняется только значение --mat */
  transition: stroke var(--cds-duration-fast-02) var(--cds-motion-standard-productive),
              stroke-width var(--cds-duration-fast-02) var(--cds-motion-standard-productive),
              filter var(--cds-duration-fast-02) var(--cds-motion-standard-productive);
}
.cds-teeth__tooth[data-on] {
  fill: var(--mat);
  fill-opacity: 0.4;
  filter: drop-shadow(0 2px 3px var(--cds-shadow));
}
.cds-teeth__tooth:focus-visible { stroke: var(--cds-focus); stroke-width: 5; }
.cds-teeth__tooth.is-peek { stroke: var(--cds-text-primary); stroke-width: 5; }
/* клик: зуб растёт из своего центра и садится обратно — граница идёт вместе с заливкой */
.cds-teeth__unit { transform-box: fill-box; transform-origin: center; }
.cds-teeth__unit:hover .cds-teeth__tooth:not([data-on]):not([data-layer]) {
  fill: var(--cds-layer-01);
  filter: drop-shadow(0 3px 4px var(--cds-shadow));
}
.cds-teeth__unit:hover .cds-teeth__tooth[data-on] { filter: drop-shadow(0 4px 6px var(--cds-shadow)); }
/* тон материала — отдельным слоем, чтобы при наведении менялась только прозрачность */
.cds-teeth__tint {
  fill: var(--mat);
  fill-opacity: 0;
  pointer-events: none;
  transition: fill-opacity var(--cds-duration-fast-02) var(--cds-motion-standard-productive);
}
.cds-teeth__tint.is-hot { fill-opacity: 0.18; }
.cds-teeth__ink { fill: var(--cds-text-primary); opacity: 0.7; pointer-events: none; }

@keyframes cds-teeth-pop {
  0% { transform: scale(1); }
  45% { transform: scale(var(--pop, 1.1)); }
  100% { transform: scale(1); }
}
.cds-teeth__unit.is-flash {
  animation: cds-teeth-pop var(--cds-duration-moderate-02) var(--cds-motion-standard-productive);
}

.cds-teeth__gap {
  display: none;
  fill: var(--cds-layer-01);
  stroke: var(--cds-border-strong-01);
  stroke-width: 2;
  stroke-dasharray: 6 5;
  cursor: pointer;
  transition: fill var(--cds-duration-fast-02) var(--cds-motion-standard-productive),
              stroke var(--cds-duration-fast-02) var(--cds-motion-standard-productive);
}
.cds-teeth.is-bridge .cds-teeth__gap { display: block; }
.cds-teeth__gap:hover { fill: var(--cds-layer-hover-01); stroke: var(--cds-text-primary); stroke-dasharray: none; }
.cds-teeth__gap:focus-visible { stroke: var(--cds-focus); stroke-width: 4; stroke-dasharray: none; }
.cds-teeth__gap[data-on] {
  display: block;
  fill: var(--mat);
  stroke: var(--cds-layer-01);
  stroke-width: 3;
  stroke-dasharray: none;
}
.cds-teeth.is-bridge .cds-teeth__tooth { cursor: default; }
/* Когда выбирают челюсть или изделие не выбрано, зубы и точки не откликаются даже подсветкой. */
.cds-teeth.is-jaw .cds-teeth__tooth,
.cds-teeth.is-jaw .cds-teeth__gap,
.cds-teeth.is-idle .cds-teeth__tooth,
.cds-teeth.is-idle .cds-teeth__gap { pointer-events: none; cursor: default; }
.cds-teeth-wrap[data-mode="view"] .cds-teeth__tooth,
.cds-teeth-wrap[data-mode="view"] .cds-teeth__gap { pointer-events: none; cursor: default; }

.cds-teeth__plate {
  fill: var(--cds-layer-02);
  fill-opacity: 0.9;
  stroke: var(--cds-border-strong-01);
  stroke-width: 3;
  stroke-dasharray: 10 10;
  cursor: pointer;
}
.cds-teeth__plate[data-on] {
  fill: var(--mat);
  fill-opacity: 0.4;
  stroke: var(--mat);
  stroke-dasharray: none;
}
.cds-teeth__plate:hover { fill-opacity: 0.6; }
.cds-teeth__plate:focus { outline: none; }
.cds-teeth__plate:focus-visible { stroke: var(--cds-focus); stroke-width: 5; stroke-dasharray: none; }
.cds-teeth-wrap[data-mode="view"] .cds-teeth__plate,
.cds-teeth:not(.is-jaw) .cds-teeth__plate { pointer-events: none; cursor: default; }
/* Пустая полоса нужна, только когда выбирают челюсть: у коронок пунктир внутри дуги
   сбивал бы взгляд с зубов. Отмеченная или уже набранная — видна всегда. */
.cds-teeth:not(.is-jaw) .cds-teeth__plate:not([data-on]):not([data-layer]) { visibility: hidden; }
/* Строки, уже набранные в наряд: бледнее текущей отметки, каждая цветом своего материала. */
.cds-teeth__tooth[data-layer]:not([data-on]) { fill: var(--mat); fill-opacity: 0.45; }
.cds-teeth__plate[data-layer]:not([data-on]) { fill: var(--mat); fill-opacity: 0.25; stroke-dasharray: none; }

/* Номер зуба под курсором — только цифры в плашке с рамкой: слово рядом с крупным
   номером ломало линию, а само по себе ничего не добавляло (выбор Konstantin 20.09). */
.cds-teeth__badge {
  position: absolute;
  right: 0;
  top: 0;
  font-size: var(--cds-type-scale-05);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  color: var(--cds-text-primary);
  background: var(--cds-layer-02);
  border: 1px solid var(--cds-border-strong-01);
  padding: var(--cds-spacing-02) var(--cds-spacing-04);
  opacity: 0;
  transition: opacity var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-teeth__badge.is-show { opacity: 1; }

/* Полоса меток — ровно две строки, лишнее прокручивается внутри: рисунок над ней не меняет масштаб. */
.cds-teeth__chips { display: flex; flex-wrap: wrap; align-content: flex-start; gap: var(--cds-spacing-02) var(--cds-spacing-03); flex: none; height: 3.25rem; overflow-y: auto; }
.cds-teeth__chips-empty { font-size: var(--cds-helper-text-01-font-size); color: var(--cds-text-helper); }
.cds-teeth__chip { font-variant-numeric: tabular-nums; }
.cds-teeth__chip::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mat);
  flex: none;
}
.cds-teeth__chip-x {
  border: 0;
  background: none;
  padding: 0 2px;
  font: inherit;
  color: var(--cds-text-helper);
  cursor: pointer;
}
.cds-teeth__chip-x:hover { color: var(--cds-text-primary); }
.cds-teeth__chip-x:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: 1px; }

/* ═══════════ набранные строки наряда ═══════════ */
/* Квадрат цвета материала — как у меток зубов: строка списка и её бледный слой на формуле связываются глазом. */
.cds-draft { display: flex; flex-direction: column; align-items: flex-start; gap: var(--cds-spacing-03); margin-top: var(--cds-spacing-05); }
.cds-draft__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--cds-spacing-02); align-self: stretch; }
.cds-draft__list:empty { display: none; }
.cds-draft__row {
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-03);
  background: var(--cds-layer-02);
  padding: var(--cds-spacing-03) var(--cds-spacing-05);
  font-size: var(--cds-type-scale-02);
  color: var(--cds-text-primary);
}
.cds-draft__row::before {
  content: "";
  width: 8px;
  height: 8px;
  background: var(--mat);
  flex: none;
}
.cds-draft__label { flex: 1 1 auto; min-width: 0; }
.cds-draft__drop {
  border: 0;
  background: none;
  padding: 0 2px;
  font: inherit;
  color: var(--cds-text-helper);
  cursor: pointer;
}
.cds-draft__drop:hover { color: var(--cds-text-primary); }
.cds-draft__drop:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: 1px; }

/* ═══════════ переключатель ═══════════ */
.cds-toggle {
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-04);
  cursor: pointer;
  user-select: none;
  position: relative;
}
.cds-toggle:has(input:disabled) { cursor: not-allowed; }
.cds-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cds-toggle__track {
  width: 48px;
  height: 24px;
  border-radius: 12px;
  background: var(--cds-toggle-off);
  position: relative;
  flex: none;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-toggle__track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: transform var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.cds-toggle input:checked + .cds-toggle__track { background: var(--cds-support-success); }
.cds-toggle input:checked + .cds-toggle__track::after { transform: translateX(24px); }
.cds-toggle input:disabled + .cds-toggle__track { background: var(--cds-button-disabled); }
.cds-toggle input:disabled ~ * { color: var(--cds-text-helper); }
.cds-toggle input:focus-visible + .cds-toggle__track { outline: 2px solid var(--cds-focus); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .cds-teeth__unit.is-flash { animation: none; }
  .cds-teeth__tooth,
  .cds-teeth__tint,
  .cds-teeth__gap,
  .cds-teeth__badge,
  .cds-toggle__track,
  .cds-toggle__track::after { transition: none; }
}

/* ═══════════ вход ═══════════ */
.cds-login { max-width: 24rem; margin: var(--cds-spacing-11) auto 0; display: flex; flex-direction: column; gap: var(--cds-spacing-06); }
.cds-login__form { display: flex; flex-direction: column; gap: var(--cds-spacing-05); }
.cds-login__brand, .cds-login__hint { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }

.cds-panel {
  background: var(--cds-layer-01);
  padding: var(--cds-spacing-06);
  margin-top: var(--cds-spacing-06);
  display: flex;
  flex-direction: column;
  gap: var(--cds-spacing-05);
}

.cds-panel__title {
  margin: 0;
  font-size: var(--cds-type-scale-04);
  font-weight: 400;
}

.cds-checks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: var(--cds-spacing-03) var(--cds-spacing-05);
}

.cds-checks label {
  display: flex;
  align-items: center;
  gap: var(--cds-spacing-03);
}

.cds-password {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: var(--cds-type-scale-05);
  letter-spacing: 0.08em;
  user-select: all;
}

.cds-row--off td {
  color: var(--cds-text-disabled);
}

.cds-issued {
  margin-top: var(--cds-spacing-03);
  display: flex;
  gap: var(--cds-spacing-05);
  align-items: baseline;
}

.cds-page__lead { margin: var(--cds-spacing-03) 0 0; font-size: var(--cds-type-scale-02); color: var(--cds-text-secondary); }
.cds-month { display: flex; align-items: center; gap: var(--cds-spacing-03); padding: var(--cds-spacing-03) var(--cds-spacing-05); background: var(--cds-layer-01); }
.cds-month__name { font-size: var(--cds-type-scale-03); min-width: 9rem; text-align: center; }

/* ═══════════ карточка работы: зоны ═══════════ */
/* Карточка объекта (kb «Раскладка экрана»): шапка — кто, где работа, срок; слева работа,
   справа формула. Прямые углы, без теней: слои разделяет фон. */
.cds-work-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--cds-spacing-03) var(--cds-spacing-05);
  margin-bottom: var(--cds-spacing-06);
}
.cds-work-head__title {
  margin: 0;
  font-size: var(--cds-type-scale-07);
  line-height: 1.28572;
  font-weight: 400;
  letter-spacing: 0;
  text-wrap: balance;
}
.cds-work-head__link { color: inherit; text-decoration: none; }
.cds-work-head__link:hover { text-decoration: underline; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
.cds-work-head__link:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: 2px; }
.cds-work-head__sub { margin: var(--cds-spacing-02) 0 0; color: var(--cds-text-secondary); }
.cds-work-head__number { color: var(--cds-text-primary); font-weight: 600; font-variant-numeric: tabular-nums; }
.cds-work-head__actions { align-self: start; display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--cds-spacing-03); }
/* Пока строка завершения открыта, кнопка в шапке прячется: повторный клик по ней свернул бы
   строку вместо того, чтобы завершить работу. Место она держит — иначе заголовок перетекал бы
   на него, и шапка прыгала бы при каждом открытии и «Отмене». */
.cds-work-head__complete[aria-expanded="true"] { visibility: hidden; }
.cds-work-notice { margin-bottom: var(--cds-spacing-06); }
/* На узком окне кнопки уходят под заголовок: в две колонки он сжимался до нескольких букв. */
@media (max-width: 42rem) {
  .cds-work-head { grid-template-columns: minmax(0, 1fr); }
}

/* ключевые факты — плитки той же породы, что на доске, только низкие */
.cds-work-facts {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 1px;
  margin: var(--cds-spacing-03) 0 0;
  background: var(--cds-border-subtle-01);
}
.cds-work-fact { display: flex; flex-direction: column; gap: var(--cds-spacing-02); padding: var(--cds-spacing-04) var(--cds-spacing-05); background: var(--cds-layer-01); }
.cds-work-fact dt { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-work-fact dd { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-02) var(--cds-spacing-03); }
.cds-work-fact dd .cds-btn { margin-left: auto; }
.cds-work-fact__sub { flex-basis: 100%; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }

/* перенос срока и завершение раскрываются строкой под фактами шапки */
.cds-work-due {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--cds-spacing-04);
  padding: var(--cds-spacing-05);
  background: var(--cds-layer-01);
  border-top: 1px solid var(--cds-border-subtle-01);
}
.cds-work-due__date { flex: 0 0 11rem; }
.cds-work-due__reason { flex: 1 1 16rem; }
.cds-work-due__actions { display: flex; gap: var(--cds-spacing-03); }
.cds-work-due__hint { flex-basis: 100%; margin: 0; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-helper); }

/* меню «ещё» (Carbon Overflow menu): опасное — последним, за чертой */
.cds-overflow { position: relative; }
.cds-overflow__trigger { width: var(--cds-size-md); min-height: var(--cds-size-md); justify-content: center; padding: 0; color: var(--cds-icon-primary); }
.cds-overflow__trigger[aria-expanded="true"] { background: var(--cds-layer-01); }
.cds-overflow__menu {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 100;
  min-width: 14rem;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--cds-layer-01);
  border: 1px solid var(--cds-border-subtle-01);
}
.cds-overflow__menu li + li { border-top: 1px solid var(--cds-border-subtle-01); }
.cds-overflow__item {
  display: block;
  width: 100%;
  min-height: var(--cds-size-lg);
  padding: 0 var(--cds-spacing-05);
  border: 0;
  background: none;
  color: var(--cds-text-primary);
  text-align: left;
  cursor: pointer;
}
.cds-overflow__item:hover { background: var(--cds-layer-hover-01); }
.cds-overflow__item:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-overflow__item--danger { color: var(--cds-text-error); }
.cds-overflow__item--danger:hover { background: var(--cds-button-danger-primary); color: var(--cds-text-on-color); }

/* две колонки: работа шире, формула 18–25rem и прилипает под шапкой приложения */
.cds-work { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 25rem); gap: var(--cds-spacing-06); align-items: start; }
.cds-work__main { display: flex; flex-direction: column; gap: var(--cds-spacing-06); min-width: 0; }
.cds-work__aside { position: sticky; top: calc(var(--cds-size-lg) + var(--cds-spacing-05)); }
@media (max-width: 64rem) {
  .cds-work { grid-template-columns: minmax(0, 1fr); }
  .cds-work__aside { position: static; order: -1; }
}

/* формула: высота по пропорции рисунка, потолок — окно */
.cds-work-chart { display: flex; flex-direction: column; gap: var(--cds-spacing-03); padding: var(--cds-spacing-05); background: var(--cds-layer-01); }
.cds-work-chart__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--cds-spacing-04); }
.cds-work-chart__title { margin: 0; font-size: var(--cds-type-scale-02); font-weight: 600; letter-spacing: 0.16px; }
.cds-work-chart__jaws,
.cds-work-chart__empty { margin: 0; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-work-chart .cds-teeth { width: 100%; height: auto; max-height: calc(100vh - 12rem); }
/* в одну колонку формула во всю ширину выросла бы на экран и увела изделия вниз */
@media (max-width: 64rem) {
  .cds-work-chart .cds-teeth { max-height: 26rem; }
}

/* «Что делаем»: квадрат цвета материала — легенда к формуле */
.cds-work-scroll { overflow-x: auto; }
.cds-work-items td { vertical-align: top; }
.cds-work-items__toggle { width: 2.5rem; padding-right: 0 !important; }
.cds-work-items__act { width: 3rem; }
.cds-work-item__name { display: inline-flex; align-items: center; gap: var(--cds-spacing-03); }
.cds-swatch { width: 0.75rem; height: 0.75rem; flex: none; background: color-mix(in srgb, var(--mat) 40%, transparent); border: 1px solid var(--mat); }
.cds-expand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin: -0.4rem 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--cds-icon-primary);
  cursor: pointer;
}
.cds-expand:hover { background: var(--cds-layer-hover-01); }
.cds-expand:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.cds-expand .cds-icon { transition: transform var(--cds-duration-fast-02) var(--cds-motion-standard-productive); }
.cds-expand[aria-expanded="true"] .cds-icon { transform: rotate(90deg); }
.cds-work-item__price td { padding-top: 0; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-work-item__price-label { display: block; margin-bottom: var(--cds-spacing-01); color: var(--cds-text-primary); }
.cds-work-items tfoot td { border-top: 1px solid var(--cds-border-subtle-01); }
.cds-work-item__qty { display: inline; }
.cds-qty--inline { display: inline-block; width: 4rem; min-height: var(--cds-size-sm); margin: -0.35rem 0; }
.cds-work-make__form { border-top: 0; border-bottom: 1px solid var(--cds-border-subtle-01); }

.cds-work-feed .cds-feed__item { grid-template-columns: 2rem 9.5rem minmax(0, 1fr); }
.cds-work-feed__tag { margin-left: var(--cds-spacing-03); }

/* подтверждение необратимого — Carbon danger modal на <dialog> */
.cds-modal { width: min(34rem, calc(100vw - 2 * var(--cds-spacing-05))); max-width: none; padding: 0; border: 0; background: var(--cds-layer-01); color: var(--cds-text-primary); }
.cds-modal::backdrop { background: var(--cds-overlay); }
.cds-modal__box { display: flex; flex-direction: column; margin: 0; }
.cds-modal__body { display: flex; flex-direction: column; gap: var(--cds-spacing-04); padding: var(--cds-spacing-05) var(--cds-spacing-05) var(--cds-spacing-07); }
.cds-modal__label { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-modal__title { margin: 0; font-size: var(--cds-type-scale-05); font-weight: 400; }
.cds-modal__text { margin: 0; }
.cds-modal__foot { display: grid; grid-template-columns: 1fr 1fr; }
.cds-modal__foot .cds-btn { max-width: none; min-height: 4rem; align-items: flex-start; padding-top: var(--cds-spacing-04); }

/* ═══════════════════════ наряд врача: оттиск и файлы (макет 1б) ═══════════════════════ */

/* ═══════════ выбор оттиска (Carbon Radio button) ═══════════ */
.lab-radios { display: flex; flex-direction: column; gap: var(--cds-spacing-04); }
.lab-radio { display: flex; align-items: flex-start; gap: var(--cds-spacing-03); cursor: pointer; }
.lab-radio input { width: 1.125rem; height: 1.125rem; margin: 0.0625rem 0 0; accent-color: var(--cds-icon-primary); flex: none; }
.lab-radio input:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: 1px; }
.lab-radio__hint { display: block; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-helper); }

/* ═══════════ загрузчик файлов (Carbon File uploader) ═══════════ */
.lab-uploader { display: flex; flex-direction: column; gap: var(--cds-spacing-03); }
.lab-drop {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--cds-spacing-03);
  min-height: 5rem;
  padding: var(--cds-spacing-05);
  border: 1px dashed var(--cds-border-strong-01);
  color: var(--cds-text-secondary);
  text-align: center;
  cursor: pointer;
  transition: background var(--cds-duration-fast-01) var(--cds-motion-standard-productive);
}
.lab-drop:hover { background: var(--cds-layer-hover-01); }
.lab-drop.is-over { background: var(--cds-layer-hover-01); border-style: solid; border-color: var(--cds-focus); }
.lab-drop:focus-within { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.lab-drop__pick { color: var(--cds-link-primary); text-decoration: underline; }
.lab-files { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--cds-spacing-02); }
.lab-files:empty { display: none; }
.lab-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 1rem 2rem;
  align-items: center;
  gap: var(--cds-spacing-02) var(--cds-spacing-04);
  min-height: 3rem;
  padding: var(--cds-spacing-03) var(--cds-spacing-03) var(--cds-spacing-03) var(--cds-spacing-05);
  background: var(--cds-layer-02);
}
.lab-file__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lab-file__size { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lab-file__ok { color: var(--cds-support-success); }
.lab-file__bad { color: var(--cds-support-error); }
.lab-file__spin {
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--cds-layer-accent-01);
  border-top-color: var(--cds-interactive);
  border-radius: 50%;
  animation: lab-spin 690ms linear infinite;
}
@keyframes lab-spin { to { transform: rotate(360deg); } }
.lab-file__remove {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 0;
  background: none;
  color: var(--cds-icon-primary);
  cursor: pointer;
}
.lab-file__remove:hover { background: var(--cds-layer-hover-02); }
.lab-file__remove:focus-visible { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.lab-file__bar { grid-column: 1 / -1; height: 0.25rem; background: var(--cds-layer-accent-01); }
.lab-file__bar > span { display: block; height: 100%; background: var(--cds-interactive); transition: width var(--cds-duration-fast-02) linear; }
.lab-file--error { outline: 2px solid var(--cds-support-error); outline-offset: -2px; }
.lab-file__error { grid-column: 1 / -1; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-error); }
@media (prefers-reduced-motion: reduce) {
  .lab-file__spin { animation-duration: 3s; }
  .lab-file__bar > span { transition: none; }
}

/* «Повторить» у строки, которую оборвала связь, — под словами ошибки, по своей ширине */
.lab-file__retry { grid-column: 1 / -1; justify-self: start; }

/* кнопка отправки и её объяснение — одной строкой справа */
.lab-submit { align-items: center; flex-wrap: wrap; }
.lab-submit__why { margin-right: auto; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-helper); }
.lab-submit__why:empty { display: none; }

/* ═══════════ шаги наряда (Carbon Progress indicator) ═══════════ */
.lab-steps { list-style: none; margin: 0 0 var(--cds-spacing-06); padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 14rem)); gap: var(--cds-spacing-02); }
.lab-steps__item { display: flex; align-items: center; gap: var(--cds-spacing-03); padding-top: var(--cds-spacing-03); border-top: 2px solid var(--cds-border-subtle-01); color: var(--cds-text-secondary); font-size: var(--cds-type-scale-02); }
.lab-steps__item.is-done, .lab-steps__item.is-current { border-top-color: var(--cds-interactive); color: var(--cds-text-primary); }
.lab-steps__item.is-done .cds-icon { color: var(--cds-interactive); }
.lab-steps__dot { width: 1rem; height: 1rem; border: 2px solid var(--cds-interactive); border-radius: 50%; display: grid; place-items: center; flex: none; }
.lab-steps__dot::after { content: ""; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--cds-interactive); }
.lab-steps a { color: inherit; text-decoration: none; }
.lab-steps a:hover { text-decoration: underline; }

/* знак шага — по состоянию: у пройденного галочка, у текущего точка (классы ставит order.js) */
.lab-steps__check, .lab-steps__dot { display: none; }
.lab-steps__item.is-done .lab-steps__check { display: block; }
.lab-steps__item.is-current .lab-steps__dot { display: grid; }

/* сводка наряда над файлами: о чём эти файлы */
.lab-summary { margin: 0 0 var(--cds-spacing-06); display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--cds-spacing-03) var(--cds-spacing-06); padding: var(--cds-spacing-05); }
.lab-summary__main { max-width: 72ch; }

/* ═══════════ места под файлы ═══════════ */
.lab-slots-form { display: flex; flex-direction: column; gap: var(--cds-spacing-05); }
.lab-drop--all { min-height: 6rem; background: var(--cds-layer-01); }
.lab-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cds-spacing-05); }
.lab-slot { display: flex; flex-direction: column; gap: var(--cds-spacing-03); padding: var(--cds-spacing-05); background: var(--cds-layer-01); min-width: 0; }
.lab-slot--wide { grid-column: span 3; }
.lab-slot__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--cds-spacing-02) var(--cds-spacing-04); }
.lab-slot__title { margin: 0; font-size: var(--cds-type-scale-02); font-weight: 600; }
.lab-slot__role { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.lab-slot__role--must { color: var(--cds-text-primary); }
.lab-slot.is-over { outline: 2px solid var(--cds-focus); outline-offset: -2px; }
.lab-drop--slot { min-height: 3rem; padding: var(--cds-spacing-04); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; }
.lab-slot .lab-file { background: var(--cds-layer-02); }
.lab-file__move { grid-column: 1 / -1; display: flex; align-items: center; gap: var(--cds-spacing-03); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.lab-file__move .cds-select { height: 1.5rem; padding-block: 0; padding-left: var(--cds-spacing-03); font-size: var(--cds-type-scale-01); width: auto; min-width: 8rem; }
.lab-file__note { color: var(--cds-text-helper); }
.lab-warning { margin: 0; }

/* ═══════════ файлы врача в карточке лаборатории ═══════════ */
.lab-file-cell { display: flex; align-items: center; gap: var(--cds-spacing-03); }
.lab-file-cell .cds-icon { color: var(--cds-icon-secondary); }
.lab-place { white-space: nowrap; }
.lab-place__role { display: block; font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }

@media (max-width: 56rem) {
  .lab-slots { grid-template-columns: 1fr; }
  .lab-slot--wide { grid-column: auto; }
}

@media (max-width: 42rem) {
  .lab-file { grid-template-columns: minmax(0, 1fr) auto 2rem; }
  /* знак состояния уходит, чтобы ✕ остался в строке; у файла в очереди знака нет — пустышка */
  .lab-file__ok, .lab-file__bad, .lab-file__spin, .lab-file__wait { display: none; }
  .lab-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ═══════════ клинические этапы (спека 2026-09-30-clinical-stages) ═══════════ */
/* Один словарь цвета состояния: синий — в работе у лаборатории, малиновый — ждём клинику,
   зелёный — можно забирать, красный — не успеваем. Пройденные шаги синие, как в Carbon. */
.cds-tone--work { --tone: var(--cds-interactive); }
.cds-tone--wait { --tone: var(--cds-tag-color-magenta); }
.cds-tone--ready { --tone: var(--cds-support-success); }
.cds-tone--late { --tone: var(--cds-support-error); }

/* полоса этапов — Carbon Progress indicator */
.cds-stages { display: flex; flex-direction: column; margin-bottom: var(--cds-spacing-06); background: var(--cds-layer-01); }
.cds-stages__track {
  display: flex;
  gap: var(--cds-spacing-02);
  margin: 0;
  padding: var(--cds-spacing-05) var(--cds-spacing-05) 0;
  list-style: none;
  overflow-x: auto;
}
.cds-stage {
  flex: 1 1 0;
  min-width: 9.5rem;
  display: grid;
  grid-template-columns: 1rem minmax(0, 1fr);
  align-content: start;
  column-gap: var(--cds-spacing-03);
  row-gap: var(--cds-spacing-01);
  padding: var(--cds-spacing-04) var(--cds-spacing-03) var(--cds-spacing-05) 0;
  border-top: 2px solid var(--cds-border-subtle-01);
}
.cds-stage__icon { grid-row: 1 / span 2; width: 1rem; height: 1rem; margin-top: 0.125rem; color: var(--cds-icon-secondary); }
.cds-stage__label { font-size: var(--cds-type-scale-02); line-height: 1.29; letter-spacing: 0.16px; }
.cds-stage__sub { font-size: var(--cds-type-scale-01); line-height: 1.34; letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-stage--done { border-top-color: var(--cds-border-interactive); }
.cds-stage--done .cds-stage__icon { color: var(--cds-interactive); }
.cds-stage--current { border-top-color: var(--tone); }
.cds-stage--current .cds-stage__icon { color: var(--tone); }
.cds-stage--current .cds-stage__label { font-weight: 600; }
.cds-stage--current.cds-tone--late .cds-stage__sub { color: var(--cds-text-error); }
.cds-stage--skipped .cds-stage__label { color: var(--cds-text-secondary); }

/* что сейчас с этапом: связан с текущим шагом цветом полосы слева */
.cds-stage-now {
  display: flex;
  flex-direction: column;
  gap: var(--cds-spacing-03);
  margin: 0 var(--cds-spacing-05) var(--cds-spacing-05);
  padding: var(--cds-spacing-04) var(--cds-spacing-05);
  background: var(--cds-layer-02);
  box-shadow: inset 3px 0 0 var(--tone);
}
.cds-stage-now__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--cds-spacing-02) var(--cds-spacing-04); }
.cds-stage-now__title { margin: 0; font-size: var(--cds-type-scale-03); font-weight: 600; }
.cds-stage-now__state { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-stage-now.cds-tone--late .cds-stage-now__state { color: var(--cds-text-error); font-weight: 600; }

/* прошлые примерки с замечаниями врача */
.cds-stage-redos { display: flex; flex-direction: column; gap: var(--cds-spacing-03); margin: 0; padding: 0; list-style: none; }
.cds-stage-redo { display: flex; flex-direction: column; gap: var(--cds-spacing-01); padding-top: var(--cds-spacing-03); border-top: 1px solid var(--cds-border-subtle-01); }
.cds-stage-redo__head, .cds-stage-redo__who { font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-secondary); }
.cds-stage-redo__head b { color: var(--cds-text-primary); font-weight: 600; }
.cds-stage-redos--plain { padding: var(--cds-spacing-03) var(--cds-spacing-05) var(--cds-spacing-05); }
.cds-stage-redos--plain .cds-stage-redo:first-child { border-top: 0; padding-top: 0; }

/* доска и кабинеты: значок и полоска этапа в строке */
.cds-event .cds-icon.cds-tone-icon { color: var(--tone); }
.cds-text-late { color: var(--cds-text-error); }
.cds-seg { display: inline-flex; gap: 2px; margin-left: var(--cds-spacing-03); vertical-align: middle; }
.cds-seg i { width: 0.875rem; height: 4px; background: var(--cds-layer-accent-01); }
.cds-seg i.done { background: var(--cds-interactive); }
.cds-seg i.now { background: var(--tone); }
.cds-seg i.skip { background: var(--cds-border-subtle-01); }

/* кабинет клиники: группа «Ждут вас», плитки-счётчики, счётчик у пункта меню */
/* С .cds-table, как общее правило заголовка группы: иначе его серая полоса перебивает эту. */
.cds-table .cds-group-head--you { box-shadow: inset 3px 0 0 var(--cds-tag-color-magenta); }
.cds-tile__dot.cds-tone--work, .cds-tile__dot.cds-tone--wait,
.cds-tile__dot.cds-tone--ready, .cds-tile__dot.cds-tone--late { background: var(--tone); }
.cds-cabinet-tiles { margin-bottom: var(--cds-spacing-06); }
.cds-cabinet td { vertical-align: top; }
.cds-cabinet__now { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-02) var(--cds-spacing-03); }
.cds-cabinet__stage, .cds-cabinet__now .cds-table__sub { flex-basis: 100%; }
/* Счётчик — тот же тэг, только круглый: радиус у тэгов разрешён. */
.cds-badge {
  display: inline-grid;
  place-items: center;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 var(--cds-spacing-02);
  margin-left: var(--cds-spacing-02);
  border-radius: 0.625rem;
  background: var(--cds-tag-background-magenta);
  color: var(--cds-tag-color-magenta);
  font-size: var(--cds-type-scale-01);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* сообщение на карточке у клиники: «не успевают», «можно забирать» */
.cds-banner { margin-bottom: var(--cds-spacing-06); }
.cds-banner > .cds-icon { flex: none; margin-top: 0.125rem; }
.cds-notification--error > .cds-icon { color: var(--cds-support-error); }
.cds-notification--success > .cds-icon { color: var(--cds-support-success); }
.cds-notification--warning > .cds-icon { color: var(--cds-icon-primary); }
.cds-banner__body { display: flex; flex-direction: column; gap: var(--cds-spacing-03); min-width: 0; }
.cds-banner__text { margin: 0; max-width: 70ch; }
.cds-banner__actions { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-03); }

/* итог примерки у врача и переспрос «раньше обычного срока» */
.cds-stage-result__set { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: var(--cds-spacing-02) var(--cds-spacing-05); margin: 0; padding: 0; border: 0; min-width: 0; }
.cds-stage-result__set legend { flex-basis: 100%; margin-bottom: var(--cds-spacing-02); }
.cds-stage-result__note { flex: 1 1 18rem; }
.cds-stage-result__later { align-self: center; display: inline-flex; gap: var(--cds-spacing-03); align-items: center; }
.cds-lead-warn { flex-basis: 100%; }

/* прайс: этапы изделия */
.cds-price-stages__n { width: 3rem; color: var(--cds-text-secondary); font-variant-numeric: tabular-nums; }
/* Поле и «Сохранить» в ячейке: на узком окне кнопка уходит под поле, а не распирает столбец. */
.cds-price-stages__days { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: var(--cds-spacing-03); }
.cds-price-stages__note { margin: 0; padding: var(--cds-spacing-04) var(--cds-spacing-05); font-size: var(--cds-type-scale-01); letter-spacing: 0.32px; color: var(--cds-text-helper); border-top: 1px solid var(--cds-border-subtle-01); }