/* public/raskroj/raskroj.css
   Стили раздела «Раскрой». Всё под корневым .rj, цвета — только переменные Сметрикса с запасными
   значениями, чтобы модуль одинаково выглядел в приложении (тёмная/светлая тема) и в dev.html.
   Холст чертежа — всегда «бумага», это задаёт svgkit.

   Общие классы для видов (view-*.js):
     .rj-split > .rj-side (левая панель 280px) + .rj-stage (холст, position:relative)
     .rj-hint — подсказка внизу холста; .rj-side-title, .rj-sec — заголовки в панели
     .rj-btn [.rj-btn-primary | .rj-btn-outline | .rj-btn-ghost | .rj-btn-danger] [.rj-btn-sm | .rj-btn-icon]
     .rj-inp (поле), .rj-num (узкое число), .rj-fld > .rj-cap + поле (подпись слева)
     .rj-row (строка с переносом), .rj-grid2, .rj-card, .rj-tbl, .rj-list > .rj-list-item(.is-active)
     .rj-badge [-ok | -warn | -err], .rj-alert [-warn | -err | -ok], .rj-muted, .rj-mono
     .rj-pop — всплывающее меню/поле поверх холста                                             */

.rj {
  --rj-radius: 10px;
  --rj-gap: 10px;
  color: var(--text, #edeae3);
  font-family: inherit;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  position: relative;
}
.rj *, .rj *::before, .rj *::after { box-sizing: border-box; }

.rj-app { display: flex; flex-direction: column; gap: var(--rj-gap); flex: 1; min-height: 0; min-width: 0; }

/* ── Поля ввода ───────────────────────────────────────────────────── */
.rj .rj-inp {
  width: auto;
  min-width: 0;
  height: 34px;
  background: var(--panel, #201d19);
  border: 1px solid var(--border, #35302a);
  border-radius: 7px;
  color: var(--text, #edeae3);
  padding: 0 10px;
  font-size: .86rem;
  font-family: inherit;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.rj .rj-inp:hover { border-color: color-mix(in srgb, var(--accent2, #dba273) 40%, var(--border, #35302a)); }
.rj .rj-inp:focus { border-color: var(--accent2, #dba273); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #c0733d) 18%, transparent); }
.rj select.rj-inp { padding-right: 28px; cursor: pointer; }
.rj .rj-num { width: 78px; text-align: right; font-variant-numeric: tabular-nums; padding: 0 8px; }
.rj .rj-num::-webkit-inner-spin-button { opacity: .35; }
.rj .rj-inp-sm { height: 28px; font-size: .8rem; }

.rj .rj-fld { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: .8rem; color: var(--muted, #9c958a); white-space: nowrap; }
.rj .rj-cap { color: var(--muted, #9c958a); font-size: .76rem; font-weight: 600; }
.rj .rj-unit { color: var(--muted, #9c958a); font-size: .76rem; }
.rj .rj-x { color: var(--muted, #9c958a); }

/* ── Кнопки (как .btn Сметрикса) ─────────────────────────────────── */
.rj .rj-btn {
  height: 34px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 7px;
  cursor: pointer;
  font-size: .84rem;
  font-weight: 600;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
  background: var(--card, #262320);
  color: var(--text, #edeae3);
  transition: background .15s, border-color .15s, color .15s, box-shadow .15s, filter .15s;
  user-select: none;
}
.rj .rj-btn:hover { border-color: var(--border, #35302a); filter: brightness(1.06); }
.rj .rj-btn:focus-visible { outline: 2px solid var(--accent2, #dba273); outline-offset: 2px; }
.rj .rj-btn:disabled { opacity: .4; cursor: not-allowed; filter: none; }
.rj .rj-btn-primary { background: linear-gradient(135deg, #a45f31, #8f5029); color: #fff; box-shadow: 0 2px 8px color-mix(in srgb, var(--accent, #c0733d) 22%, transparent); }
.rj .rj-btn-primary:hover:not(:disabled) { filter: brightness(1.1); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent, #c0733d) 35%, transparent); border-color: transparent; }
.rj .rj-btn-outline { background: transparent; color: var(--accent2, #dba273); border-color: var(--accent2, #dba273); }
.rj .rj-btn-outline:hover:not(:disabled) { background: var(--accent2, #dba273); color: #fff; filter: none; }
.rj .rj-btn-ghost { background: transparent; color: var(--muted, #9c958a); border-color: var(--border, #35302a); }
.rj .rj-btn-ghost:hover:not(:disabled) { color: var(--text, #edeae3); border-color: var(--muted, #9c958a); filter: none; }
.rj .rj-btn-danger { background: transparent; color: var(--red, #e09289); border-color: var(--red, #e09289); }
.rj .rj-btn-danger:hover:not(:disabled) { background: var(--red, #e09289); color: #fff; filter: none; }
.rj .rj-btn-sm { height: 28px; padding: 0 10px; font-size: .78rem; }
.rj .rj-btn-icon { width: 34px; padding: 0; }
.rj .rj-btn-sm.rj-btn-icon { width: 28px; }
.rj .rj-btn.is-active { background: color-mix(in srgb, var(--accent, #c0733d) 18%, transparent); border-color: var(--accent2, #dba273); color: var(--accent2, #dba273); }
.rj .rj-ico { display: inline-flex; }

/* ── Шапка ────────────────────────────────────────────────────────── */
.rj-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 8px 16px;
  padding: 10px 12px;
  background: var(--panel, #201d19);
  border: 1px solid var(--border, #35302a);
  border-radius: 12px;
  flex-shrink: 0;
}
.rj-head-main { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; min-width: 0; flex: 1 1 auto; }
.rj-head-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; margin-left: auto; }
.rj .rj-name { width: 220px; min-width: 150px; max-width: 280px; field-sizing: content; font-weight: 600; font-size: .92rem; background: transparent; border-color: transparent; padding-left: 8px; }
.rj .rj-name:hover { border-color: var(--border, #35302a); }
.rj .rj-name:focus { background: var(--panel, #201d19); }
.rj .rj-mat { width: 220px; text-overflow: ellipsis; }
.rj .rj-mat-box { position: relative; }
.rj .rj-mat-list {
  position: absolute; z-index: 50; top: calc(100% + 4px); left: 0;
  width: max(100%, 300px); max-height: 320px; overflow-y: auto;
  background: var(--panel, #201d19); border: 1px solid var(--border, #35302a);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.35); padding: 4px;
}
.rj .rj-mat-grp { padding: 6px 8px 2px; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; opacity: .55; }
.rj .rj-mat-opt { padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: .86rem; line-height: 1.25; }
.rj .rj-mat-opt:hover, .rj .rj-mat-opt.is-active { background: rgba(200,140,70,.22); }
.rj .rj-mat-none { opacity: .65; }
.rj .rj-mat-empty { padding: 10px 8px; font-size: .82rem; opacity: .65; }
.rj .rj-thick { width: 58px; }
.rj-sep { width: 1px; height: 22px; background: var(--border, #35302a); margin: 0 4px; }
.rj .rj-save.is-dirty::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #fff; opacity: .85; margin-left: 2px; }

/* Переключатель режима — сегменты */
.rj-seg { display: inline-flex; padding: 3px; gap: 2px; background: var(--card, #262320); border: 1px solid var(--border, #35302a); border-radius: 9px; }
.rj .rj-seg-btn {
  height: 28px; padding: 0 14px; border: none; border-radius: 6px; background: transparent;
  color: var(--muted, #9c958a); font-family: inherit; font-size: .82rem; font-weight: 600; cursor: pointer;
  transition: background .15s, color .15s;
}
.rj .rj-seg-btn:hover { color: var(--text, #edeae3); }
.rj .rj-seg-btn.is-active { background: linear-gradient(135deg, #a45f31, #8f5029); color: #fff; box-shadow: 0 1px 6px color-mix(in srgb, var(--accent, #c0733d) 30%, transparent); }
.rj .rj-seg-btn:focus-visible { outline: 2px solid var(--accent2, #dba273); outline-offset: 1px; }

/* ── Вкладки (как .tabs Сметрикса) ───────────────────────────────── */
.rj-tabs-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border, #35302a); flex-shrink: 0; }
.rj-tabs-side { display: flex; align-items: center; gap: 4px; padding-bottom: 5px; }
.rj-tabs-side .rj-btn { height: 30px; width: 30px; }
.rj-tabs-side .rj-status { padding: 0 8px 0 0; }
.rj-tabs { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; }
.rj .rj-tab {
  padding: 8px 18px; font-size: .86rem; font-weight: 600; font-family: inherit; cursor: pointer;
  color: var(--muted, #9c958a); background: none; border: none; border-bottom: 2px solid transparent;
  margin-bottom: -1px; white-space: nowrap; transition: color .15s, border-color .15s;
}
.rj .rj-tab:hover { color: var(--text, #edeae3); }
.rj .rj-tab.is-active { color: var(--accent2, #dba273); border-bottom-color: var(--accent2, #dba273); }
.rj .rj-tab:focus-visible { outline: 2px solid var(--accent2, #dba273); outline-offset: -2px; }
.rj-status { font-size: .76rem; color: var(--muted, #9c958a); padding-bottom: 8px; white-space: nowrap; }
.rj-status.is-dirty { color: var(--accent2, #dba273); }

/* ── Тело вкладки ─────────────────────────────────────────────────── */
.rj-body { flex: 1; min-height: 0; min-width: 0; display: flex; }
.rj-view { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: column; }

.rj-split { flex: 1; min-height: 0; display: flex; gap: var(--rj-gap); }
.rj-side {
  width: 280px; flex-shrink: 0; min-height: 0; overflow-y: auto;
  background: var(--panel, #201d19); border: 1px solid var(--border, #35302a); border-radius: 12px;
  padding: 12px; display: flex; flex-direction: column; gap: 10px;
}
.rj-side-title, .rj-sec {
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .7px;
  color: var(--accent2, #dba273); margin-top: 4px;
}
.rj-stage {
  flex: 1; min-width: 0; min-height: 0; position: relative; overflow: hidden;
  border: 1px solid var(--border, #35302a); border-radius: 12px; background: #fafaf7;
}
.rj-stage-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 24px; text-align: center; color: #8a8378; }
.rj-hint {
  position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 2;
  max-width: calc(100% - 24px); padding: 6px 12px; border-radius: 8px;
  background: #2b2723e0; color: #f3efe8; font-size: .78rem; line-height: 1.3; text-align: center;
  pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rj-hint.is-warn { background: #b0402fe6; color: #fff; }

/* Вьюпорт (svgkit) */
.rj .rj-vp { display: block; width: 100%; height: 100%; touch-action: none; user-select: none; -webkit-user-select: none; }
.rj .rj-vp.rj-vp-grab { cursor: grab; }
.rj .rj-vp.rj-vp-panning, .rj .rj-vp.rj-vp-panning * { cursor: grabbing !important; }
.rj .rj-vp-tools {
  position: absolute; top: 10px; right: 10px; z-index: 2; display: flex; flex-direction: column; gap: 4px;
  padding: 4px; background: #ffffffd9; border: 1px solid #e0dcd3; border-radius: 9px; box-shadow: 0 2px 10px #2b272314;
}
.rj .rj-vp-btn {
  width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center;
  border: none; border-radius: 6px; background: transparent; color: #2b2723; cursor: pointer;
}
.rj .rj-vp-btn:hover { background: #efe9df; color: #84491f; }
.rj .rj-vp-btn:focus-visible { outline: 2px solid #c0733d; outline-offset: 0; }

/* Кликабельные цели на чертеже */
.rj .rj-hit { cursor: pointer; }
.rj .rj-vp-grab .rj-hit { cursor: grab; }
.rj .rj-hit-edge:hover { stroke: #c0733d2e; }
.rj .rj-hit-corner:hover { fill: #c0733d33; }
.rj .rj-hit-seam:hover { stroke: #c0733d2e; }
.rj .rj-hit-dim:hover { fill: #c0733d1f; }
.rj .rj-dim:hover .rj-dim-t { font-weight: 700; }
.rj .rj-dim.is-selected .rj-dim-bg { fill: #f2e5d8; }
.rj .rj-hit-cutout:hover { stroke: #c0733d; }
.rj .rj-part-body { cursor: pointer; }
.rj .rj-t { font-family: 'Segoe UI', system-ui, sans-serif; paint-order: stroke; user-select: none; }
.rj .rj-dim-t { font-variant-numeric: tabular-nums; }

/* ── Списки, карточки, таблицы ────────────────────────────────────── */
.rj-card { background: var(--panel, #201d19); border: 1px solid var(--border, #35302a); border-radius: 12px; padding: 14px; }
.rj-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.rj-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.rj-muted { color: var(--muted, #9c958a); font-size: .8rem; }
.rj-mono { font-variant-numeric: tabular-nums; }
.rj-pad { padding: 6px 2px; }
.rj-r { text-align: right; }

.rj-list { display: flex; flex-direction: column; gap: 4px; }
.rj .rj-list-item {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left;
  padding: 8px 10px; min-height: 40px; border-radius: 8px; border: 1px solid transparent;
  background: var(--card, #262320); color: var(--text, #edeae3); font-family: inherit; font-size: .84rem; cursor: pointer;
}
.rj .rj-list-item:hover { border-color: var(--border, #35302a); }
.rj .rj-list-item.is-active { border-color: var(--accent2, #dba273); background: color-mix(in srgb, var(--accent, #c0733d) 12%, var(--card, #262320)); }
.rj-list-name { font-weight: 600; }

.rj-tbl-wrap { overflow-x: auto; }
.rj-tbl { width: 100%; border-collapse: collapse; font-size: .84rem; }
.rj-tbl th { text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--border, #35302a); color: var(--muted, #9c958a); font-weight: 600; font-size: .72rem; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; }
.rj-tbl th.rj-r { text-align: right; }
.rj-tbl td { padding: 8px 12px; border-bottom: 1px solid color-mix(in srgb, var(--border, #35302a) 70%, transparent); vertical-align: middle; }
.rj-tbl tbody tr:not(.rj-cat-row):hover td { background: color-mix(in srgb, var(--card, #262320) 70%, transparent); }
.rj-tbl .rj-cat-row td { padding: 12px 12px 6px; border-bottom: none; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; color: var(--accent2, #dba273); }
.rj-tbl tfoot td { padding: 12px; font-weight: 700; font-size: .95rem; border-bottom: none; border-top: 1px solid var(--border, #35302a); }

.rj-badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: .72rem; font-weight: 600; white-space: nowrap; background: var(--card, #262320); color: var(--muted, #9c958a); }
.rj-badge-ok { background: color-mix(in srgb, var(--green, #74b898) 16%, transparent); color: var(--green, #74b898); }
.rj-badge-warn { background: color-mix(in srgb, var(--accent2, #dba273) 16%, transparent); color: var(--accent2, #dba273); }
.rj-badge-err { background: color-mix(in srgb, var(--red, #e09289) 16%, transparent); color: var(--red, #e09289); }

.rj-alert { padding: 10px 12px; border-radius: 9px; font-size: .84rem; line-height: 1.4; border: 1px solid; }
.rj-alert-err { color: var(--red, #e09289); border-color: color-mix(in srgb, var(--red, #e09289) 45%, transparent); background: color-mix(in srgb, var(--red, #e09289) 10%, transparent); }
.rj-alert-warn { color: var(--accent2, #dba273); border-color: color-mix(in srgb, var(--accent2, #dba273) 45%, transparent); background: color-mix(in srgb, var(--accent2, #dba273) 10%, transparent); }
.rj-alert-ok { color: var(--green, #74b898); border-color: color-mix(in srgb, var(--green, #74b898) 45%, transparent); background: color-mix(in srgb, var(--green, #74b898) 10%, transparent); }

/* Всплывающее меню/поле над холстом */
.rj-pop {
  position: absolute; z-index: 5; min-width: 180px; padding: 6px;
  background: var(--panel, #201d19); color: var(--text, #edeae3);
  border: 1px solid var(--border, #35302a); border-radius: 10px; box-shadow: 0 8px 28px #0000004d;
}

/* ── Заглушка вида ───────────────────────────────────────────────── */
.rj-stub { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 18px 10px; }
.rj-stub-wide { margin: 40px auto; max-width: 440px; background: var(--panel, #201d19); border: 1px dashed var(--border, #35302a); border-radius: 12px; padding: 28px 24px; }
.rj-stub-ico { color: var(--accent2, #dba273); opacity: .8; }
.rj-stub-title { font-weight: 700; font-size: .95rem; }
.rj-stub-text { color: var(--muted, #9c958a); font-size: .82rem; line-height: 1.45; }

/* ── Смета ────────────────────────────────────────────────────────── */
.rj-smeta { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: var(--rj-gap); }
.rj-smeta-host { flex: 1; min-height: 0; overflow-y: auto; }
.rj-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rj-gap); }
.rj-stat { background: var(--panel, #201d19); border: 1px solid var(--border, #35302a); border-radius: 12px; padding: 12px 14px; }
.rj-stat-v { font-size: 1.2rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.rj-stat-l { font-size: .74rem; color: var(--muted, #9c958a); margin-top: 2px; }
.rj-smeta-card { padding: 4px 4px 0; }
.rj-empty { padding: 32px 16px; text-align: center; display: flex; flex-direction: column; gap: 6px; }
.rj-smeta-actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }

/* Запасной тост, если хост свой не дал */
.rj-toast {
  position: fixed; right: 24px; bottom: 24px; z-index: 9999; padding: 10px 18px; border-radius: 8px;
  background: var(--panel, #201d19); color: var(--green, #74b898); border: 1px solid var(--green, #74b898);
  font-size: .85rem; font-weight: 600; opacity: 0; transition: opacity .3s; pointer-events: none;
}
.rj-toast.is-on { opacity: 1; }

/* ── Адаптив ─────────────────────────────────────────────────────── */
@media (max-width: 1360px) {
  .rj .rj-mat { width: 190px; }
}
@media (max-width: 1180px) {
  .rj-side { width: 250px; }
  .rj .rj-num { width: 70px; }
  .rj .rj-btn-primary .rj-ico { display: none; }
}
/* Планшет: панель уже, подсказки переносятся; совсем узко — панель уходит наверх */
@media (max-width: 1024px) {
  .rj-side { width: 220px; padding: 10px; }
  .rj-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rj-hint { white-space: normal; }
  .rj-status { display: none; }
  .rj .rj-tab { padding: 8px 14px; }
}
@media (max-width: 860px) {
  .rj-split { flex-direction: column; }
  .rj-side { width: auto; max-height: 34vh; }
  .rj-stage { min-height: 320px; }
  .rj-head { flex-wrap: wrap; }
}
@media print {
  .rj-head, .rj-tabs-row, .rj-vp-tools, .rj-hint { display: none !important; }
}

/* ── view-layout / view-sheet ── */
/* Вкладки «Раскрой» (.rjl) и «Лист мастеру» (.rjs). [hidden] сильнее display из классов. */
.rjl [hidden], .rjs [hidden] { display: none !important; }
.rjl, .rjs { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }

/* Верхняя строка: кнопка, поля плиты, статистика */
.rjl-bar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; padding: 8px 12px;
  background: var(--panel, #201d19); border: 1px solid var(--border, #35302a); border-radius: 12px; flex-shrink: 0;
}
.rjl-fields { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.rj .rjl-num-s { width: 62px; }
.rjl-stats { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.rjl-stat {
  font-size: .8rem; color: var(--muted, #9c958a); padding: 4px 10px; border-radius: 20px;
  background: var(--card, #262320); white-space: nowrap;
}
.rjl-stat b { color: var(--text, #edeae3); font-variant-numeric: tabular-nums; }
.rjl-stat.is-warn b { color: var(--red, #e09289); }

/* Плиты-чипы */
.rjl-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; flex-shrink: 0; }
.rj .rjl-chip {
  height: 30px; padding: 0 12px; display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
  border-radius: 16px; border: 1px solid var(--border, #35302a); background: var(--panel, #201d19);
  color: var(--muted, #9c958a); font-family: inherit; font-size: .82rem; font-weight: 600; transition: color .15s, border-color .15s, background .15s;
}
.rj .rjl-chip:hover { color: var(--text, #edeae3); border-color: var(--muted, #9c958a); }
.rj .rjl-chip.is-active { color: var(--accent2, #dba273); border-color: var(--accent2, #dba273); background: color-mix(in srgb, var(--accent, #c0733d) 14%, var(--panel, #201d19)); }
.rj .rjl-chip:focus-visible { outline: 2px solid var(--accent2, #dba273); outline-offset: 1px; }
.rjl-chip-n { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--card, #262320); color: var(--muted, #9c958a); font-size: .7rem; display: inline-flex; align-items: center; justify-content: center; }
.rj .rjl-chip.is-bad { border-color: color-mix(in srgb, var(--red, #e09289) 60%, transparent); }
.rj .rjl-chip.is-bad::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--red, #e09289); }
.rj .rjl-chip-add { border-style: dashed; }

/* Плашки: «детали изменились», список проблем */
.rjl-msgs { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.rjl-msgs:empty { display: none; }
.rjl-msgs .rj-alert { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 8px 12px; }
.rjl-msgs .rj-alert > span { flex: 1 1 320px; }
.rjl-problems { flex-direction: column; align-items: stretch !important; max-height: 132px; overflow-y: auto; }
.rjl-problems-t { font-weight: 600; }
.rjl-problems ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 2px; }
.rj .rjl-link { background: none; border: none; padding: 0; color: inherit; font: inherit; cursor: pointer; text-align: left; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }
.rj .rjl-link:hover { text-decoration-style: solid; }

/* Боковая панель: куски и неразмещённые */
.rjl-item-top { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.rjl-item-top .rj-list-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rjl-num {
  flex-shrink: 0; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center;
  font-size: .74rem; font-weight: 700; color: #fff; background: var(--c, #3f7d62);
}
.rjl-item > .rj-muted { padding-left: 30px; }
.rj .rjl-item.is-bad { border-color: color-mix(in srgb, var(--red, #e09289) 55%, transparent); }
.rj .rjl-item.is-bad .rj-list-name { color: var(--red, #e09289); }
.rjl-unplaced-t { color: var(--red, #e09289); }
.rjl-unplaced { display: flex; flex-direction: column; gap: 6px; }
.rjl-unp {
  display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 8px 10px; border-radius: 8px; font-size: .84rem;
  border: 1px dashed color-mix(in srgb, var(--red, #e09289) 55%, transparent); background: color-mix(in srgb, var(--red, #e09289) 7%, transparent);
}
.rjl-unp .rj-btn { margin-top: 4px; }

/* Холст раскладки */
.rjl-stage .rjl-labels, .rjl-stage .rjl-dims, .rjl-stage .rjl-dims * { pointer-events: none; }
.rj .rjl-piece { cursor: grab; }
.rj .rjl-stage.is-dragging, .rj .rjl-stage.is-dragging .rjl-piece { cursor: grabbing; }
.rj .rjl-piece:hover .rjl-piece-body { fill-opacity: .4; }
.rj .rjl-piece.is-drag .rjl-piece-body { filter: drop-shadow(0 2px 3px #2b272340); }
.rjl-act {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; padding: 6px 8px; max-width: calc(100% - 70px);
  animation: rjl-pop .12s ease-out;
}
.rjl-act-t { font-size: .8rem; padding: 0 4px; white-space: nowrap; }
.rj .rjl-act-sel { width: auto; padding-right: 24px; }
@keyframes rjl-pop { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

/* Лист мастеру */
.rjs-count { margin-left: auto; }
.rjs .rj-seg.is-disabled { opacity: .45; pointer-events: none; }
.rjs-wrap { flex: 1; min-height: 0; border: 1px solid var(--border, #35302a); border-radius: 12px; overflow: hidden; background: #8d8880; }
.rjs-frame { display: block; width: 100%; height: 100%; border: 0; background: #8d8880; }

@media (max-width: 1024px) {
  .rjl-stats { margin-left: 0; }
  .rjl-act { max-width: calc(100% - 16px); }
}

/* ── view-pro ── */
/* Точный редактор: широкая панель с таблицами слева, размерный чертёж справа */
.rj .rj-pro-side { width: 440px; gap: 0; padding: 12px 12px 16px; }
.rj-pro-sec { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; border-top: 1px solid var(--border, #35302a); }
.rj-pro-sec:first-child { border-top: none; padding-top: 0; }
.rj-pro-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.rj-pro-sec .rj-sec { margin-top: 0; }
.rj-pro-help { line-height: 1.4; }
.rj .rj-pro-parts .rj-list-item { min-height: 36px; padding: 6px 10px; }

/* Поля детали и выреза: подпись над полем */
.rj-pro-fields { display: grid; grid-template-columns: minmax(0, 1fr) 60px 124px; gap: 6px; align-items: end; }
.rj .rj-pro-fld { display: flex; flex-direction: column; gap: 3px; min-width: 0; margin: 0; }
.rj .rj-pro-fld .rj-cap { font-size: .68rem; white-space: nowrap; }
.rj .rj-pro-fields .rj-inp { height: 30px; width: 100%; font-size: .82rem; }
.rj .rj-pro-fields .rj-num { width: 100%; }
.rj .rj-pro-fields select.rj-inp { padding: 0 4px 0 8px; }
.rj .rj-pro-side > .rj-pro-sec .rj-row > .rj-btn-sm { padding: 0 9px; }

/* Таблицы */
.rj .rj-pro-tbl { table-layout: fixed; font-size: .8rem; }
.rj .rj-pro-tbl th { padding: 4px 3px 5px; font-size: .62rem; letter-spacing: .2px; }
.rj .rj-pro-tbl td { padding: 3px; border-bottom-color: color-mix(in srgb, var(--border, #35302a) 55%, transparent); }
.rj .rj-pro-tbl .rj-inp { height: 28px; width: 100%; font-size: .8rem; padding: 0 6px; border-radius: 6px; }
.rj .rj-pro-tbl .rj-num { text-align: right; }
.rj .rj-pro-tbl select.rj-inp, .rj .rj-pro-cut select.rj-inp { padding: 0 2px 0 5px; text-overflow: ellipsis; }
.rj .rj-pro-tbl .rj-btn-icon { width: 28px; }
.rj .rj-pro-tbl tbody tr.is-hl td { background: color-mix(in srgb, var(--accent, #c0733d) 10%, transparent); }
.rj .rj-pro-tbl tbody tr.is-sel td { background: color-mix(in srgb, var(--accent, #c0733d) 17%, transparent); }
.rj .rj-pro-tbl tbody tr.is-bad td { background: color-mix(in srgb, var(--red, #e09289) 12%, transparent); }
.rj-pro-no {
  display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid var(--accent2, #dba273); color: var(--accent2, #dba273); font-size: .72rem; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.rj-pro-tbl tr.is-sel .rj-pro-no, .rj-pro-tbl tr.is-hl .rj-pro-no { background: var(--accent2, #dba273); color: var(--panel, #201d19); }
.rj-pro-no-seam { border-style: dashed; }
.rj-pro-corner { display: flex; gap: 3px; }
.rj .rj-pro-corner select.rj-inp { width: 58px; flex-shrink: 0; }
.rj .rj-pro-corner .rj-num { flex: 1; min-width: 0; }
.rj .rj-pro-corner .rj-num:disabled { opacity: .35; }

.rj-pro-info { display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: .8rem; color: var(--muted, #9c958a); }
.rj-pro-info b { color: var(--text, #edeae3); font-weight: 600; font-variant-numeric: tabular-nums; }

.rj-pro-err { color: var(--red, #e09289); font-size: .8rem; line-height: 1.4; font-weight: 600; }
.rj-pro-err:empty { display: none; }

/* Вырезы — карточки: первая строка — вид и размеры, вторая — привязка */
.rj-pro-cut {
  display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 9px;
  background: var(--card, #262320); border: 1px solid transparent;
}
.rj-pro-cut.is-sel { border-color: var(--accent2, #dba273); }
.rj-pro-cut-row { display: flex; align-items: flex-end; gap: 6px; flex-wrap: wrap; }
.rj .rj-pro-cut .rj-inp { height: 28px; font-size: .8rem; }
.rj .rj-pro-cut .rj-num { width: 62px; padding: 0 6px; }
.rj .rj-pro-kind { width: 150px; }
.rj .rj-pro-rot { width: 58px; }
.rj .rj-pro-mount { width: 112px; }
.rj .rj-pro-cut .rj-pro-cr { width: 48px; }
.rj-pro-wh { display: inline-flex; align-items: center; gap: 3px; }
.rj .rj-pro-delcut { margin-left: auto; }
.rj .rj-pro-bind { align-items: center; gap: 5px; flex-wrap: nowrap; }
.rj .rj-pro-bind .rj-cap { font-size: .7rem; font-weight: 600; white-space: nowrap; }
.rj .rj-pro-bind .rj-pro-bind-2 { margin-left: 6px; }
.rj .rj-pro-bside { width: 44px; }
.rj .rj-pro-addkind { width: 170px; height: 28px; font-size: .8rem; }

.rj-pro-seam-bar { justify-content: space-between; }
.rj-pro-pieces { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; font-size: .8rem; color: var(--muted, #9c958a); }
.rj-pro-pieces b { color: var(--text, #edeae3); }
.rj-pro-pieces-list { display: inline-flex; flex-wrap: wrap; gap: 2px 10px; font-variant-numeric: tabular-nums; }

.rj-pro-checks { display: flex; flex-direction: column; gap: 4px; }
.rj-pro-check { font-size: .8rem; line-height: 1.4; padding: 6px 9px; border-radius: 7px; border: 1px solid; }
.rj-pro-check.is-error { color: var(--red, #e09289); border-color: color-mix(in srgb, var(--red, #e09289) 40%, transparent); background: color-mix(in srgb, var(--red, #e09289) 9%, transparent); }
.rj-pro-check.is-warn { color: var(--accent2, #dba273); border-color: color-mix(in srgb, var(--accent2, #dba273) 40%, transparent); background: color-mix(in srgb, var(--accent2, #dba273) 9%, transparent); }
.rj-pro-check.is-ok { color: var(--green, #74b898); border-color: color-mix(in srgb, var(--green, #74b898) 40%, transparent); }
.rj-pro-check-lvl { font-weight: 700; }

/* Холст: инструменты и координаты (холст всегда «бумага», поэтому цвета фиксированные) */
.rj-pro-tools { position: absolute; top: 10px; left: 10px; z-index: 2; display: flex; align-items: center; gap: 6px; max-width: calc(100% - 70px); }
.rj .rj-pro-tbtn {
  height: 30px; padding: 0 11px; display: inline-flex; align-items: center; gap: 6px; border-radius: 7px; cursor: pointer;
  border: 1px solid #d9d3c8; background: #fffffff0; color: #2b2723; font-family: inherit; font-size: .8rem; font-weight: 600;
}
.rj .rj-pro-tbtn:hover { border-color: #b9ad9c; color: #84491f; }
.rj .rj-pro-tbtn.is-active { background: #84491f; border-color: #84491f; color: #fff; }
.rj .rj-pro-tbtn:focus-visible { outline: 2px solid #c0733d; outline-offset: 1px; }
.rj-pro-coord {
  height: 30px; display: inline-flex; align-items: center; padding: 0 10px; border-radius: 7px; white-space: nowrap;
  border: 1px solid #e0dcd3; background: #ffffffd9; color: #5b534a; font-size: .78rem; font-variant-numeric: tabular-nums; min-width: 190px;
}
.rj-pro-ruler-out {
  position: absolute; top: 48px; left: 10px; z-index: 2; padding: 6px 10px; border-radius: 7px; max-width: calc(100% - 70px);
  background: #84491f; color: #fff; font-size: .8rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.rj .rj-pro-stage.is-ruler .rj-vp, .rj .rj-pro-stage.is-ruler .rj-hit { cursor: crosshair; }
.rj .rj-pro-stage .rj-vp { cursor: crosshair; }
.rj .rj-pro-g-dim .rj-pro-sno, .rj .rj-pro-g-dim .rj-t, .rj .rj-pro-piece-lbl { pointer-events: none; }
/* номера кусков svgkit заменены подписями «кусок N» */
.rj .rj-pro-g-part .rj-piece-num-bg, .rj .rj-pro-g-part .rj-piece-num { display: none; }
.rj .rj-pro-sdim.is-hl .rj-dim-bg { fill: #f2e5d8; }
.rj .rj-pro-sdim.is-hl .rj-dim-t { font-weight: 700; }

@media (max-width: 1180px) {
  .rj .rj-pro-side { width: 400px; }
  .rj .rj-pro-coord { min-width: 0; }
}
@media (max-width: 860px) {
  .rj .rj-pro-side { width: auto; max-height: 48vh; }
}

/* ── view-manager ── */
/* Лёгкий редактор (режим «Менеджер»). [hidden] сильнее display из классов. */
.rj-mgr [hidden] { display: none !important; }
.rj-mgr-main { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.rj-mgr-main > .rj-stage { flex: 1; }
.rj .rj-mgr-side { gap: 8px; }
.rj-mgr-side > * { flex-shrink: 0; }
.rj-mgr-stage.is-tool .rj-vp:not(.rj-vp-grab) { cursor: crosshair; }
.rj-mgr-stage.is-tool .rj-hit { pointer-events: none; }
.rj .rj-mgr-menu .rj-num, .rj .rj-mgr-insp .rj-num { -moz-appearance: textfield; }
.rj .rj-mgr-menu .rj-num::-webkit-inner-spin-button, .rj .rj-mgr-menu .rj-num::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.rj-mgr-sub { color: var(--muted, #9c958a); font-size: .74rem; line-height: 1.35; }

/* Шаблоны форм */
.rj-mgr-tpls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.rj .rj-mgr-tpl {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  min-height: 66px; padding: 6px 3px 5px; border-radius: 9px; border: 1px solid var(--border, #35302a);
  background: var(--card, #262320); color: var(--text, #edeae3); font-family: inherit; font-size: .72rem;
  font-weight: 600; line-height: 1.15; text-align: center; cursor: pointer; transition: border-color .15s, background .15s;
}
.rj .rj-mgr-tpl:hover { border-color: var(--accent2, #dba273); background: color-mix(in srgb, var(--accent, #c0733d) 10%, var(--card, #262320)); }
.rj .rj-mgr-tpl:focus-visible { outline: 2px solid var(--accent2, #dba273); outline-offset: 1px; }
.rj-mgr-tpl-ico { display: flex; color: var(--accent2, #dba273); }
.rj .rj-mgr-drawbtn { width: 100%; height: 38px; }
.rj-mgr-drawopts {
  display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border-radius: 9px;
  background: color-mix(in srgb, var(--accent, #c0733d) 8%, var(--card, #262320));
  border: 1px dashed color-mix(in srgb, var(--accent2, #dba273) 45%, transparent);
}
.rj .rj-mgr-fld { justify-content: space-between; width: 100%; }
.rj .rj-mgr-fld .rj-seg-btn { height: 26px; padding: 0 10px; }

/* Техника */
.rj-mgr-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.rj .rj-mgr-tile {
  display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 8px; border-radius: 9px;
  border: 1px solid var(--border, #35302a); background: var(--card, #262320); color: var(--text, #edeae3);
  font-family: inherit; font-size: .8rem; font-weight: 600; cursor: grab; touch-action: none; user-select: none;
}
.rj .rj-mgr-tile:hover { border-color: var(--accent2, #dba273); }
.rj .rj-mgr-tile:active { cursor: grabbing; }
.rj-mgr-tile-ico { display: flex; color: var(--accent2, #dba273); flex-shrink: 0; }
.rj-mgr-ghost {
  position: fixed; z-index: 9999; pointer-events: none; display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; border-radius: 8px; font-size: .8rem; font-weight: 600;
  background: var(--panel, #201d19); color: var(--text, #edeae3); border: 1px dashed var(--muted, #9c958a);
  box-shadow: 0 6px 20px #0000004d; opacity: .92;
}
.rj-mgr-ghost.is-ok { border: 1px solid var(--green, #74b898); }

/* Список деталей */
.rj-mgr-parts { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.rj-mgr-part {
  display: flex; flex-direction: column; gap: 3px; padding: 5px 6px 6px; border-radius: 9px; cursor: pointer;
  background: var(--card, #262320); border: 1px solid transparent;
}
.rj-mgr-part:hover { border-color: var(--border, #35302a); }
.rj-mgr-part.is-active { border-color: var(--accent2, #dba273); background: color-mix(in srgb, var(--accent, #c0733d) 12%, var(--card, #262320)); }
.rj-mgr-part-top { display: flex; align-items: center; gap: 4px; min-width: 0; }
.rj .rj-mgr-part-name {
  flex: 1 1 0; width: 0; min-width: 0; height: 28px; padding: 0 6px; border-radius: 6px; border: 1px solid transparent;
  background: transparent; color: var(--text, #edeae3); font-family: inherit; font-size: .85rem; font-weight: 600; outline: none;
  text-overflow: ellipsis;
}
.rj .rj-mgr-part-name:hover { border-color: var(--border, #35302a); }
.rj .rj-mgr-part-name:focus { border-color: var(--accent2, #dba273); background: var(--panel, #201d19); }
.rj-mgr-badge { flex-shrink: 0; font-size: .66rem; padding: 1px 6px; }
.rj-mgr-part-meta { display: flex; align-items: center; gap: 5px; padding-left: 7px; font-size: .74rem; color: var(--muted, #9c958a); white-space: normal; min-width: 0; flex-wrap: wrap; row-gap: 2px; }
.rj-mgr-part-meta > span { white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rj-mgr-part { min-width: 0; }
.rj-mgr-dot { opacity: .6; }
.rj-mgr-qty { margin-left: auto; display: inline-flex; align-items: center; gap: 3px; }
.rj-mgr-qty-n { min-width: 14px; text-align: center; color: var(--text, #edeae3); font-weight: 600; }
.rj .rj-mgr-ibtn {
  width: 28px; height: 28px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0;
  border-radius: 6px; border: 1px solid transparent; background: transparent; color: var(--muted, #9c958a); cursor: pointer;
}
.rj .rj-mgr-ibtn:hover:not(:disabled) { color: var(--text, #edeae3); border-color: var(--border, #35302a); }
.rj .rj-mgr-ibtn:disabled { opacity: .35; cursor: default; }
.rj .rj-mgr-qty .rj-mgr-ibtn { width: 24px; height: 24px; }
.rj .rj-mgr-del:hover:not(:disabled) { color: var(--red, #e09289); border-color: var(--red, #e09289); }

/* Панель инструментов на холсте */
.rj-mgr-tools {
  position: absolute; top: 10px; left: 10px; z-index: 3; display: flex; gap: 4px; padding: 4px;
  background: #ffffffd9; border: 1px solid #e0dcd3; border-radius: 9px; box-shadow: 0 2px 10px #2b272314;
}
.rj .rj-mgr-tool {
  height: 30px; padding: 0 10px; display: inline-flex; align-items: center; gap: 6px; border: none; border-radius: 6px;
  background: transparent; color: #2b2723; font-family: inherit; font-size: .8rem; font-weight: 600; cursor: pointer;
}
.rj .rj-mgr-tool:hover:not(:disabled) { background: #efe9df; color: #84491f; }
.rj .rj-mgr-tool.is-active { background: #84491f; color: #fff; }
.rj .rj-mgr-tool:disabled { opacity: .4; cursor: default; }
.rj .rj-mgr-tool:focus-visible { outline: 2px solid #c0733d; outline-offset: 0; }

/* Меню выделенной детали над ней: повернуть, отразить (23.10.2026) */
.rj-mgr-pbar {
  position: absolute; z-index: 4; display: flex; align-items: center; gap: 2px; padding: 4px 6px; white-space: nowrap;
  background: #ffffffeb; border: 1px solid #e0dcd3; border-radius: 10px; box-shadow: 0 4px 16px #2b272326;
}
.rj-mgr-pbar[hidden] { display: none; }
.rj-mgr-pbar-cap { padding: 0 4px 0 6px; font-size: .8rem; font-weight: 600; color: #6b6358; }
.rj-mgr-pbar-sep { width: 1px; height: 22px; margin: 0 4px; background: #e0dcd3; }
.rj .rj-mgr-pbar-btn { width: 34px; padding: 0; justify-content: center; }
@media (max-width: 640px) { .rj-mgr-pbar-cap { display: none; } }

/* Карточка выделенного выреза/шва */
.rj-mgr-insp {
  position: absolute; top: 54px; left: 10px; z-index: 3; width: 240px; max-height: calc(100% - 110px); overflow-y: auto;
  padding: 10px 12px; display: flex; flex-direction: column; gap: 7px;
  background: var(--panel, #201d19); color: var(--text, #edeae3); border: 1px solid var(--border, #35302a);
  border-radius: 10px; box-shadow: 0 6px 22px #0000003d;
}
.rj-mgr-insp.is-right { left: auto; right: 58px; top: 10px; }
.rj-mgr-insp-title { font-weight: 700; font-size: .88rem; }
.rj .rj-mgr-insp .rj-num { width: 68px; height: 30px; -moz-appearance: textfield; }
.rj .rj-mgr-insp .rj-num::-webkit-inner-spin-button, .rj .rj-mgr-insp .rj-num::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.rj-mgr-seg-wide { display: flex; }
.rj .rj-mgr-seg-wide .rj-seg-btn { flex: 1; padding: 0 4px; font-size: .78rem; }
.rj-mgr-insp-acts { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; margin-top: 2px; }

/* Подсказка у курсора */
.rj-mgr-tip {
  position: absolute; z-index: 4; pointer-events: none; padding: 5px 9px; border-radius: 7px;
  background: #2b2723eb; color: #f3efe8; font-size: .8rem; font-weight: 600; line-height: 1.3;
  white-space: nowrap; box-shadow: 0 3px 12px #2b272333; font-variant-numeric: tabular-nums;
}
.rj-mgr-tip.is-err { white-space: normal; width: max-content; max-width: 320px; }
.rj-mgr-tip-err { margin-top: 4px; padding: 5px 7px; border-radius: 5px; background: #b0402f; color: #fff; font-weight: 500; font-size: .78rem; }

/* Пустой холст */
.rj-mgr-empty { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; padding: 24px; pointer-events: none; }
.rj-mgr-empty-card { max-width: 420px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; color: #2b2723; }
.rj-mgr-empty-ico { color: #84491f; margin-bottom: 4px; }
.rj-mgr-empty-title { font-size: 1.2rem; font-weight: 700; }
.rj-mgr-empty-text { font-size: .95rem; color: #6f685e; line-height: 1.45; }

/* Всплывающие меню */
.rj .rj-mgr-menu { min-width: 210px; max-width: 280px; overflow-y: auto; }
.rj-mgr-pop-title { padding: 3px 8px 6px; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--muted, #9c958a); white-space: nowrap; }
.rj .rj-mgr-mi {
  display: flex; align-items: center; gap: 9px; width: 100%; min-height: 32px; padding: 0 10px; border: none; border-radius: 7px;
  background: transparent; color: var(--text, #edeae3); font-family: inherit; font-size: .84rem; text-align: left; cursor: pointer;
}
.rj .rj-mgr-mi:hover { background: var(--card, #262320); }
.rj .rj-mgr-mi.is-active { color: var(--accent2, #dba273); font-weight: 700; }
.rj-mgr-mi-row { display: flex; align-items: center; gap: 6px; padding-right: 6px; }
.rj-mgr-mi-row .rj-mgr-mi { flex: 1; width: auto; }
.rj-mgr-mi-row .rj-num { width: 64px; }
.rj-mgr-sw { width: 20px; height: 5px; border-radius: 2px; flex-shrink: 0; }
.rj-mgr-sw-none { height: 6px; border: 1px dashed var(--muted, #9c958a); background: transparent; }
.rj-mgr-sw-wall { height: 8px; border-top: 2px solid #8a8378; background: repeating-linear-gradient(135deg, #8a8378 0 1.5px, transparent 1.5px 4px); border-radius: 0; }
.rj-mgr-mi-sep { height: 1px; margin: 4px 2px; background: var(--border, #35302a); }
.rj-mgr-check { display: flex; align-items: center; gap: 8px; padding: 5px 10px; font-size: .8rem; color: var(--muted, #9c958a); cursor: pointer; }
.rj-mgr-check input { accent-color: var(--accent, #c0733d); width: 15px; height: 15px; margin: 0; }
.rj .rj-mgr-dimpop { min-width: 0; width: 196px; padding: 8px 10px 9px; display: flex; flex-direction: column; gap: 6px; }
.rj .rj-mgr-dimpop .rj-mgr-pop-title { padding: 0; }
.rj .rj-mgr-dim-inp { width: 100%; height: 38px; font-size: 1.05rem; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.rj .rj-inp.is-err { border-color: var(--red, #e09289); box-shadow: 0 0 0 3px color-mix(in srgb, var(--red, #e09289) 20%, transparent); }
.rj-mgr-err { color: var(--red, #e09289); font-size: .76rem; line-height: 1.35; padding: 0 2px; }

/* Замечания под холстом */
.rj-mgr-alerts { display: flex; flex-direction: column; gap: 4px; max-height: 96px; overflow-y: auto; flex-shrink: 0; }
.rj-mgr-alerts:empty { display: none; }
.rj-mgr-alerts .rj-alert { padding: 5px 10px; font-size: .8rem; line-height: 1.35; }
.rj-mgr-alerts .rj-alert.is-link { cursor: pointer; }
.rj-mgr-alerts .rj-alert.is-link:hover { filter: brightness(1.12); }
.rj-mgr-ok { padding: 5px 10px; font-size: .8rem; color: var(--muted, #9c958a); border: 1px dashed var(--border, #35302a); border-radius: 9px; }

@media (max-width: 1180px) {
  .rj-mgr-tpls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rj-mgr-tiles { gap: 5px; }
  .rj .rj-mgr-tile { gap: 5px; padding: 0 5px; font-size: .74rem; }
  .rj-mgr-tile-ico svg { width: 20px; height: 20px; }
  .rj-mgr-part-meta { flex-wrap: wrap; row-gap: 0; }
}
@media (max-width: 1024px) {
  .rj-mgr-tiles { grid-template-columns: minmax(0, 1fr); }
  .rj .rj-mgr-tile { height: 34px; }
}
.rj-pro-sec-acts { display: flex; gap: 6px; }
.rj .rj-pro-sec-head { align-items: center; }
.rj .rj-pro-tbl th { white-space: normal; line-height: 1.2; vertical-align: bottom; }
/* линии размеров не перехватывают мышь — кликается сторона под ними; цифры кликаются через .rj-hit */
.rj .rj-pro-g-dim line, .rj .rj-pro-g-dim path { pointer-events: none; }

/* ── view-manager: размеры сторон в панели ── */
.rj .rj-mgr-sides { display: flex; flex-direction: column; gap: 4px; padding: 0 2px 6px; max-height: 210px; overflow-y: auto; }
.rj .rj-mgr-side { display: flex; align-items: center; gap: 6px; min-width: 0; }
.rj .rj-mgr-side .rj-unit { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rj .rj-mgr-side-n {
  width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%;
  border: 1px solid var(--border, #35302a); color: var(--muted, #9c958a);
  font-size: .72rem; display: flex; align-items: center; justify-content: center;
}
.rj .rj-mgr-side-inp { width: 76px; flex: 0 0 76px; }
.rj .rj-mgr-side-inp.is-err { border-color: var(--red, #e09289); }

/* Линейка, полезные остатки, фото плиты (view-layout) */
.rjl-tools { padding: 6px 12px; gap: 6px 10px; }
.rjl-sep { width: 1px; height: 22px; background: var(--border, #35302a); }
.rjl-photo-box { display: inline-flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; }
.rj .rjl-range { width: 110px; accent-color: var(--accent, #c0733d); cursor: pointer; }
.rj .rjl-grain { width: 152px; }
.rj .rjl-file { display: none; }
.rjl-stage.is-tool .rjl-piece { cursor: crosshair; }
.rjl-stage.is-tool .rj-vp { cursor: crosshair; }
.rjl-offcuts .rjl-offcut rect { cursor: pointer; }
.rjl-offcuts .rjl-offcut.is-active rect { stroke-width: 3.5; }
.rjl-offcuts .rjl-offcut.is-bad rect { stroke: #b0402f; }
.rjl-offcuts .rjl-found rect { cursor: pointer; }
.rjl-offcuts .rjl-found:hover rect { stroke-width: 3.5; }
.rjl-offcuts text, .rjl-ruler text, .rjl-grain-g text, .rjl-rubber text { pointer-events: none; }
.rjl-photo-g .rjl-photo-h { cursor: nwse-resize; }
.rjl-photo-g.is-edit .rjl-photo { cursor: move; }

.rjl-off-t { color: var(--green, #74b898); }
.rjl-offs { display: flex; flex-direction: column; gap: 4px; }
.rjl-off {
  display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 8px;
  border: 1px solid transparent; background: var(--card, #262320);
}
.rjl-off.is-active { border-color: var(--green, #74b898); }
.rjl-off.is-bad { border-color: color-mix(in srgb, var(--red, #e09289) 55%, transparent); }
.rj .rjl-off-main {
  flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  background: none; border: none; padding: 0; color: var(--text, #edeae3); font: inherit; font-size: .84rem; cursor: pointer; text-align: left;
}
.rjl-off-sum { font-size: .8rem; color: var(--muted, #9c958a); padding: 2px 2px 0; }

/* Печать фото на листе мастеру (view-sheet) */
.rjs-chk { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; color: var(--muted, #9c958a); cursor: pointer; white-space: nowrap; }
.rjs-chk input { accent-color: var(--accent, #c0733d); cursor: pointer; }

/* ── фото профиля в выборе кромки ── */
.rj .rj-mgr-mi-prof { display: flex; align-items: center; gap: 8px; }
.rj .rj-mgr-prof-n { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rj .rj-mgr-prof-img {
  flex: 0 0 auto; width: 54px; height: 34px; border-radius: 5px; object-fit: cover;
  background: var(--card, #262320); border: 1px solid var(--border, #35302a);
}
.rj .rj-mgr-prof-noimg {
  display: block; border-style: dashed;
  background: repeating-linear-gradient(45deg, transparent, transparent 5px, var(--border, #35302a) 5px, var(--border, #35302a) 6px);
}
.rj .rj-pro-edge-cell { display: flex; align-items: center; gap: 6px; min-width: 0; }
.rj .rj-pro-edge-cell .rj-pro-edge { flex: 1 1 auto; min-width: 0; }
.rj .rj-pro-edge-img {
  flex: 0 0 auto; width: 40px; height: 26px; border-radius: 4px; object-fit: cover;
  border: 1px solid var(--border, #35302a); background: var(--card, #262320); cursor: zoom-in;
}

/* Поворот детали */
.rj .rj-mgr-part-turn { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: .78rem; }
.rj .rj-mgr-turn { font-size: 1rem; line-height: 1; }
.rj .rj-mgr-turn-deg { width: 56px; height: 26px; font-size: .8rem; }
.rj .rj-pro-rotrow .rj-pro-wh { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.rj .rj-pro-rotrow .rj-num { width: 64px; }
