:root {
  --bg: #f4f6fa; --panel: #ffffff; --border: #dde3ec; --text: #1c2333; --muted: #68738a;
  --accent: #2f6fed; --accent-h: #1f57c4; --danger: #d64545; --ok: #1f9d55;
  --radius: 10px; --shadow: 0 1px 3px rgba(20,30,60,.08), 0 4px 16px rgba(20,30,60,.06);
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font: 14px/1.45 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--bg); color: var(--text); }
button { font: inherit; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }

/* ---------- каркас ---------- */
.app { display: flex; height: 100vh; }
.sidebar { width: 230px; background: #1d2534; color: #cfd6e4; display: flex; flex-direction: column; flex-shrink: 0; }
.sidebar .logo { padding: 18px 16px; font-weight: 700; font-size: 16px; color: #fff; border-bottom: 1px solid #2c3648; }
.sidebar .logo span { color: #6ea0ff; }
.sidebar nav { flex: 1; overflow: auto; padding: 8px 0; }
.sidebar .nav-item { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; background: none; border: none; color: #cfd6e4;
  padding: 10px 16px; font-size: 14px; }
.sidebar .nav-item .nav-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar .nav-ico { width: 18px; height: 18px; flex-shrink: 0; opacity: .8; }
.sidebar .nav-item:hover .nav-ico, .sidebar .nav-item.active .nav-ico { opacity: 1; }
.sidebar .nav-item:hover { background: #263043; }
.sidebar .nav-item.active { background: #2f3b52; color: #fff; border-left: 3px solid var(--accent); padding-left: 13px; }
.sidebar .nav-sect { padding: 12px 16px 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .07em; color: #8a94a8; }
.sidebar .userbox { padding: 12px 16px; border-top: 1px solid #2c3648; font-size: 13px; }
.sidebar .userbox .roles { color: #8a94a8; font-size: 11px; }
.sidebar .userbox button { margin-top: 8px; background: #2c3648; border: none; color: #cfd6e4; padding: 5px 12px; border-radius: 6px; }

.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.tabbar { display: flex; gap: 2px; background: #e6eaf2; padding: 6px 8px 0; border-bottom: 1px solid var(--border); overflow-x: auto; }
.tab { display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: #d7dde9; border-radius: 8px 8px 0 0;
  border: 1px solid var(--border); border-bottom: none; cursor: pointer; white-space: nowrap; font-size: 13px; }
.tab.active { background: var(--panel); font-weight: 600; }
.tab .x { border: none; background: none; color: var(--muted); font-size: 14px; padding: 0 2px; }
.tab-ico { width: 15px; height: 15px; flex-shrink: 0; opacity: .65; }
.tab.active .tab-ico { opacity: 1; }

/* ---------- значки и пикер ---------- */
.ico { display: inline-block; vertical-align: middle; }
.icon-field { display: flex; align-items: center; gap: 10px; }
.icon-field .cur-ico { width: 24px; height: 24px; color: var(--accent); }
.icon-field button.pick { padding: 5px 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--panel); cursor: pointer; font-size: 13px; }
.icon-picker { border: 1px solid var(--border); border-radius: 8px; padding: 8px; background: var(--panel); margin-top: 8px; }
.icon-search { width: 100%; padding: 6px 9px; border: 1px solid var(--border); border-radius: 6px; margin-bottom: 8px; font-size: 13px; box-sizing: border-box; }
.icon-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; max-height: 220px; overflow: auto; }
.icon-cell { display: flex; align-items: center; justify-content: center; padding: 7px; border: 1px solid transparent;
  border-radius: 7px; background: none; cursor: pointer; color: var(--text); }
.icon-cell:hover { background: #eef2f8; border-color: var(--border); }
.icon-cell.sel { border-color: var(--accent); background: #eaf1ff; color: var(--accent); }
.dz-iconbtn { display: inline-flex; }
.icon-pick-btn { padding: 5px 8px; display: inline-flex; align-items: center; color: var(--accent); }
.icon-pop { position: fixed; z-index: 200; width: 320px; background: var(--panel); border: 1px solid var(--border);
  border-radius: 10px; box-shadow: 0 10px 34px rgba(20,30,50,.22); padding: 10px; }

/* ---------- редактор оболочки (меню/логин) ---------- */
.sh-editor .sh-field { display: flex; align-items: center; gap: 12px; margin: 12px 0; }
.sh-editor .sh-field > label { width: 150px; color: var(--muted); font-size: 13px; }
.sh-editor .sh-field input, .sh-editor .sh-field select { padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; }
.sh-editor .sh-check { display: flex; align-items: center; gap: 8px; margin: 14px 0; font-size: 14px; }
.sh-toolbar2 { display: flex; gap: 8px; margin: 14px 0 8px; }
.sh-note { padding: 12px 14px; background: #fff7e6; border: 1px solid #ffe0a3; border-radius: 8px; color: #7a5b13; font-size: 13px; }
.menu-items { display: flex; flex-direction: column; gap: 6px; }
.menu-row { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border: 1px solid var(--border);
  border-radius: 9px; background: var(--panel); }
.menu-row.section { background: #f1f4f9; }
.menu-row .tag { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 2px 6px; }
.menu-row input, .menu-row select { padding: 6px 9px; border: 1px solid var(--border); border-radius: 7px; font-size: 13px; }
.menu-target { display: flex; gap: 6px; }
.menu-target .url-inp { width: 150px; }
.menu-row .roles-inp { width: 120px; }
.menu-ctrls { display: flex; gap: 3px; margin-left: auto; }
.btn.tiny { padding: 3px 8px; font-size: 12px; line-height: 1; }
.btn.tiny.danger { color: var(--danger); }
.auth-note { font-size: 12px; color: var(--accent); margin-top: 6px; }

/* ---------- режим показа (демо-тур) ---------- */
.tour-opt { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 13px; color: var(--muted); cursor: pointer; }
.tour-opt input { width: auto; margin: 0; }
.tour-overlay { position: fixed; inset: 0; z-index: 9998; }
.tour-overlay.solid { background: rgba(12, 17, 30, 0.78); }
.tour-spot { position: fixed; z-index: 9999; border-radius: 10px; pointer-events: none;
  box-shadow: 0 0 0 9999px rgba(12, 17, 30, 0.78), 0 0 0 3px var(--accent), 0 0 22px 4px rgba(110, 160, 255, 0.55);
  transition: left .35s ease, top .35s ease, width .35s ease, height .35s ease; }
.tour-caption { position: fixed; z-index: 10000; width: 380px; max-width: calc(100vw - 24px);
  background: #fff; color: #1d2534; border-radius: 14px; padding: 18px 20px;
  box-shadow: 0 18px 50px rgba(8, 14, 30, 0.45); transition: left .3s ease, top .3s ease; }
.tour-caption.center { left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); width: 460px; text-align: center; }
.tour-caption .tour-num { font-size: 12px; color: #8a94a8; letter-spacing: .06em; margin-bottom: 8px; }
.tour-caption .tour-text { font-size: 20px; line-height: 1.4; font-weight: 600; }
.tour-caption .tour-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.tour-caption .tour-exit { background: none; border: none; color: #8a94a8; font-size: 13px; cursor: pointer; }
.tour-caption .tour-next { background: var(--accent); color: #fff; border: none; border-radius: 9px;
  padding: 10px 22px; font-size: 15px; font-weight: 600; cursor: pointer; }
.tour-caption.busy .tour-next { opacity: .5; pointer-events: none; }
.tour-choices { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.tour-choice { background: #eef2f8; color: #1d2534; border: 1px solid var(--border); border-radius: 9px;
  padding: 11px 16px; font-size: 15px; font-weight: 600; cursor: pointer; text-align: left; }
.tour-choice:hover { background: #e2e9f5; border-color: var(--accent); }
@media (prefers-color-scheme: dark) { .tour-choice { background: #2c3648; color: #eef2f8; border-color: #3a465c; } }
.tour-caption.wide { width: 560px; }
.tour-caption.wide.center { width: 560px; }
.tour-arch .tour-title { font-size: 22px; font-weight: 700; line-height: 1.3; }
.tour-arch .tour-lead { font-size: 15px; color: var(--muted); margin-top: 8px; line-height: 1.5; }
.tour-arch .tour-metric { display: flex; align-items: baseline; gap: 10px; margin: 14px 0 6px; }
.tour-arch .tour-metric .m-val { font-size: 40px; font-weight: 800; color: var(--accent); line-height: 1; }
.tour-arch .tour-metric .m-lbl { font-size: 13px; color: var(--muted); }
.tour-arch .tour-bullets { margin: 12px 0 0; padding-left: 20px; text-align: left; }
.tour-arch .tour-bullets li { font-size: 14.5px; line-height: 1.55; margin-bottom: 8px; }
@media (prefers-color-scheme: dark) { .tour-arch .tour-lead, .tour-arch .tour-metric .m-lbl { color: #9aa6bd; } }
@media (prefers-color-scheme: dark) {
  .tour-caption { background: #1d2534; color: #eef2f8; }
}
.tab .x:hover { color: var(--danger); }
.workspace { flex: 1; overflow: auto; padding: 18px; }

/* ---------- форма (runtime) ---------- */
.form-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 20px; max-width: 1200px; }
.form-title { font-size: 19px; font-weight: 700; margin: 0 0 16px; }
.form-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 10px; }
.wgt { min-width: 0; }
.wgt label.wl { display: block; font-size: 12px; color: var(--muted); margin-bottom: 3px; }
.wgt input[type=text], .wgt input[type=number], .wgt input[type=date], .wgt select, .wgt textarea {
  width: 100%; padding: 7px 10px; border: 1px solid var(--border); border-radius: 7px; background: #fff; }
.wgt input:focus, .wgt select:focus, .wgt textarea:focus { outline: 2px solid #bcd2ff; border-color: var(--accent); }
.wgt input:disabled, .wgt select:disabled, .wgt textarea:disabled { background: #f0f2f7; color: var(--muted); }
.wgt textarea { resize: vertical; min-height: 64px; }
.wgt .req { color: var(--danger); }
.wgt .wl-err { color: var(--danger); font-size: 11.5px; line-height: 1.35; margin-top: 3px; min-height: 0; }
.wgt input.invalid, .wgt textarea.invalid, .wgt select.invalid {
  border-color: var(--danger); background: #fdf3f3; }
.wgt-label-h1 { font-size: 20px; font-weight: 700; align-self: center; }
.wgt-label-val { padding: 7px 0; font-weight: 600; }
.wgt-stat { background: #f4f7ff; border: 1px solid #dce6fb; border-radius: var(--radius); padding: 12px 16px; }
.wgt-stat .v { font-size: 24px; font-weight: 800; color: var(--accent); }
.wgt-stat .l { font-size: 12px; color: var(--muted); }
.btn { background: #e8ecf4; color: var(--text); border: 1px solid var(--border); border-radius: 7px; padding: 8px 14px; width: 100%; }
.btn:hover { background: #dde3ef; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.btn.primary:hover { background: var(--accent-h); }
.btn:disabled { opacity: .5; cursor: default; }
.btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; font-weight: 600; }
.btn.danger:hover { filter: brightness(.92); }

/* Диалог подтверждения (on_click.confirm) */
.confirm-card { max-width: 440px; padding: 20px; }
.confirm-msg { margin-bottom: 16px; white-space: pre-line; }
.confirm-actions { display: flex; gap: 10px; justify-content: flex-end; }
.confirm-actions .btn { width: auto; }

/* ---------- грид ---------- */
.grid-box { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.grid-box .gtitle { padding: 8px 12px; font-weight: 600; font-size: 13px; background: #f7f9fc; border-bottom: 1px solid var(--border); }
.grid-tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.grid-tbl th { text-align: left; padding: 7px 10px; background: #f7f9fc; border-bottom: 1px solid var(--border);
  font-weight: 600; cursor: pointer; user-select: none; white-space: nowrap; }
.grid-tbl th .dir { color: var(--accent); }
.grid-tbl td { padding: 6px 10px; border-bottom: 1px solid #eef1f6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 260px; }
.grid-tbl tr:hover td { background: #f2f6ff; }
.grid-tbl tr.sel td { background: #e3edff; }
.gpager { display: flex; align-items: center; gap: 10px; padding: 7px 12px; font-size: 12px; color: var(--muted); background: #fafbfd; }
.gpager button { border: 1px solid var(--border); background: #fff; border-radius: 6px; padding: 3px 10px; }
.gpager button:disabled { opacity: .4; }

/* ---------- login ---------- */
.login-wrap { height: 100vh; display: flex; align-items: center; justify-content: center; }
.login-card { background: var(--panel); padding: 34px; border-radius: 14px; box-shadow: var(--shadow); width: 340px; }
.login-card h1 { margin: 0 0 4px; font-size: 22px; } .login-card h1 span { color: var(--accent); }
.login-card .brand-h1 { margin: 0 0 4px; font-size: 26px; font-weight: 800; letter-spacing: -.5px; }
.login-card .brand-h1 span { color: var(--accent); }
.login-card .sub { color: var(--muted); font-size: 13px; margin-bottom: 18px; }
.login-card .login-lang { margin-top: 14px; text-align: right; }
.lang-switch { padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 12px;
  background: var(--panel); color: var(--text); cursor: pointer; }
.sidebar .userbox-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.sidebar .userbox-row button { margin-top: 0; flex: 1; }
.sidebar .userbox-row .lang-switch { background: #2c3648; border-color: #3a465c; color: #cfd6e4; }
.login-card input { width: 100%; margin-bottom: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px; }
.login-card .hint { font-size: 12px; color: var(--muted); margin-top: 12px; line-height: 1.7; }
.login-card .err { color: var(--danger); font-size: 13px; min-height: 18px; }

/* ---------- toast ---------- */
#toasts { position: fixed; right: 18px; bottom: 18px; display: flex; flex-direction: column; gap: 8px; z-index: 99; }
.toast { background: #263043; color: #fff; padding: 11px 16px; border-radius: 9px; box-shadow: var(--shadow);
  max-width: 420px; font-size: 13px; animation: tin .18s ease-out; }
.toast.error { background: var(--danger); } .toast.ok { background: var(--ok); }
.toast { display: flex; align-items: center; gap: 12px; }
.toast-act { background: rgba(255,255,255,.14); color: #fff; border: 1px solid rgba(255,255,255,.4);
  border-radius: 7px; padding: 5px 12px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.toast-act:hover { background: rgba(255,255,255,.26); }
@keyframes tin { from { transform: translateY(8px); opacity: 0; } }

/* Клавиатурный фокус: строка грида, по которой ходят стрелки */
.grid-tbl tbody tr:focus { outline: 2px solid var(--accent, #4f7cf7); outline-offset: -2px; }

/* ---------- designer ---------- */
.dz { display: flex; height: 100%; gap: 0; min-height: 0; }
.dz-palette { width: 170px; flex-shrink: 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 10px; margin-right: 12px; align-self: flex-start; }
.dz-palette h3, .dz-props h3 { margin: 4px 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.pal-item { border: 1px dashed #b9c4d8; border-radius: 8px; padding: 7px 10px; margin-bottom: 6px; background: #f8fafd;
  cursor: grab; font-size: 13px; user-select: none; }
.pal-item:hover { border-color: var(--accent); color: var(--accent); }
.dz-canvas-wrap { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dz-toolbar { display: flex; gap: 8px; margin-bottom: 10px; align-items: center; flex-wrap: wrap; }
.dz-toolbar .sp { flex: 1; }
.dz-toolbar input, .dz-toolbar select { padding: 6px 9px; border: 1px solid var(--border); border-radius: 7px; }
.dz-toolbar .btn { width: auto; }
.dz-canvas { position: relative; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  min-height: 560px; overflow: hidden;
  background-image: linear-gradient(#f0f3f9 1px, transparent 1px), linear-gradient(90deg, #f0f3f9 1px, transparent 1px); }
.dz-canvas.drag-over { outline: 2px dashed var(--accent); outline-offset: -2px; }
.dw { position: absolute; border: 1px solid #c3cede; border-radius: 7px; background: #fbfcfe; padding: 4px 8px;
  font-size: 12px; overflow: hidden; cursor: move; user-select: none; }
.dw .t { color: var(--muted); font-size: 10px; }
.dw .b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw.sel { border: 2px solid var(--accent); background: #eef4ff; }
.dw .rsz { position: absolute; right: 0; bottom: 0; width: 12px; height: 12px; cursor: nwse-resize;
  background: linear-gradient(135deg, transparent 50%, #9db4dd 50%); border-radius: 0 0 6px 0; }
.dw-grid { background: repeating-linear-gradient(0deg, #f2f5fa, #f2f5fa 12px, #fff 12px, #fff 24px); }
.dz-props { width: 300px; flex-shrink: 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 12px; margin-left: 12px; overflow: auto; align-self: stretch; max-height: calc(100vh - 130px);}
.dz-props .pr { margin-bottom: 9px; }
.dz-props .pr label { display: block; font-size: 11px; color: var(--muted); margin-bottom: 2px; }
.dz-props .pr input[type=text], .dz-props .pr input[type=number], .dz-props .pr select, .dz-props .pr textarea {
  width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 13px; }
.dz-props .pr textarea { font-family: ui-monospace, Consolas, monospace; font-size: 12px; }
.dz-props .del { color: var(--danger); background: #fdeeee; border: 1px solid #f3cccc; width: 100%; margin-top: 8px;
  border-radius: 7px; padding: 7px; }
.dz-tabs { display: flex; gap: 4px; margin-bottom: 10px; }
.dz-tabs button { border: 1px solid var(--border); background: #eef1f7; border-radius: 7px 7px 0 0; padding: 7px 14px; font-size: 13px; }
.dz-tabs button.active { background: var(--panel); font-weight: 600; border-bottom-color: var(--panel); }
.code-ed { width: 100%; min-height: 380px; font-family: ui-monospace, Consolas, monospace; font-size: 13px;
  border: 1px solid var(--border); border-radius: 8px; padding: 12px; background: #fbfcff; tab-size: 4; }

/* ---------- проверка формы / прогон скриптов ---------- */
.chk-panel { margin-top: 8px; }
.chk-ctx { width: 100%; font-family: ui-monospace, Consolas, monospace; font-size: 12px;
  border: 1px solid var(--border); border-radius: 6px; padding: 6px 8px; }
.chk-result { font-size: 12.5px; white-space: pre-wrap; flex: 1; }
.chk-ok  { color: #1f7a32; }
.chk-bad { color: var(--danger); }
.chk-warn { color: #7a5b12; }
.chk-list { margin-top: 10px; }
.chk-item { padding: 7px 10px; border-radius: 6px; font-size: 13px; border: 1px solid transparent; }
.chk-item.error { background: #fdeeee; border-color: #f3cccc; }
.chk-item.warn { background: #fff7e6; border-color: #f0dcb0; }
.chk-item.link { cursor: pointer; }
.chk-item.link:hover { filter: brightness(.97); }
.modal .chk-ok, .modal .chk-bad, .modal .chk-warn { padding: 8px 10px; border-radius: 7px; font-weight: 600; }
.modal .chk-ok { background: #f2f8f2; } .modal .chk-bad { background: #fdeeee; } .modal .chk-warn { background: #fff7e6; }

/* ---------- автокомплит привязок / полей БД ---------- */
.ac-pop { position: fixed; z-index: 200; background: var(--panel); border: 1px solid var(--border);
  border-radius: 8px; box-shadow: var(--shadow); max-height: 260px; overflow: auto; padding: 4px; }
.ac-item { display: flex; align-items: baseline; gap: 10px; padding: 5px 9px; border-radius: 6px;
  cursor: pointer; font-size: 13px; }
.ac-item.active { background: var(--accent); }
.ac-item.active .ac-t, .ac-item.active .ac-h { color: #fff; }
.ac-item .ac-t { font-family: ui-monospace, Consolas, monospace; color: var(--text); }
.ac-item .ac-h { margin-left: auto; font-size: 11px; color: var(--muted); }

/* ---------- редактор кода с подсветкой ---------- */
/* Общая типографика для textarea и слоя подсветки — метрики должны совпадать
   до пикселя, иначе текст «поплывёт» относительно подсветки. */
.code-wrap { position: relative; height: 380px; border: 1px solid var(--border); border-radius: 8px;
  overflow: hidden; background: #fbfcff; }
.code-wrap.code-tall { height: 60vh; }
.code-wrap .code-ed, .code-wrap .code-hl {
  margin: 0; position: absolute; inset: 0; box-sizing: border-box; padding: 12px;
  font-family: ui-monospace, Consolas, monospace; font-size: 13px; line-height: 1.5;
  tab-size: 4; white-space: pre; overflow: auto; }
.code-wrap .code-ed { border: 0; border-radius: 0; background: transparent; resize: none; min-height: 0;
  color: transparent; caret-color: #16233a; z-index: 2; }
.code-wrap .code-hl { overflow: hidden; pointer-events: none; z-index: 1; color: #16233a; }
.code-wrap .code-hl code { font: inherit; }
.tk-cmt { color: #7d8a99; font-style: italic; }
.tk-str { color: #1f883d; }
.tk-kw  { color: #6f42c1; font-weight: 600; }
.tk-bi  { color: #0a7ea4; }
.tk-num { color: #b5561a; }
.tk-dec { color: #a626a4; }
.list-tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.list-tbl th, .list-tbl td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #eef1f6; }
.list-tbl tr:hover td { background: #f2f6ff; cursor: pointer; }
.pill { display: inline-block; padding: 1px 9px; border-radius: 20px; font-size: 11px; background: #e8eefb; color: var(--accent); }
.muted { color: var(--muted); }
.row2 { display: flex; gap: 8px; } .row2 > * { flex: 1; }
/* ---------- дерево ---------- */
.tree { font-size: 13px; padding: 0; }
.tnode { display: flex; align-items: center; gap: 8px; padding: 5px 10px; cursor: default; white-space: nowrap; border-bottom: 1px solid #f0f2f6; }
.tnode.odd { background: #fafbfd; }
.tnode:hover, .tnode.odd:hover { background: #f2f6ff; }
.tnode.sel, .tnode.odd.sel { background: #e3ecfd; }
.tnode .tw { width: 14px; flex-shrink: 0; color: var(--muted); cursor: pointer; user-select: none; }
.tnode .tlbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.tnode .tcol { color: #334; font-size: 12px; flex-shrink: 0; padding: 0 6px; box-sizing: border-box; }
.tnode .tcol.num { text-align: right; font-variant-numeric: tabular-nums; }
.tree .thead { position: sticky; top: 0; z-index: 2; background: #eef2f8; font-weight: 600; border-bottom: 2px solid var(--border); }
.tree .thead:hover { background: #eef2f8; }
.tree .thead .tcol, .tree .thead .tlbl { color: #2a3550; font-size: 12px; }
.pos { color: #0a7d33; }
.neg { color: #c0392b; }
.wgt-stat .v.pos { color: #0a7d33; }
.wgt-stat .v.neg { color: #c0392b; }

/* выбор скрипта/запроса + кнопка перехода к его коду */
.ref-row { display: flex; gap: 6px; align-items: stretch; }
.ref-row > select { flex: 1; min-width: 0; }
.btn-code { width: auto; flex-shrink: 0; padding: 6px 10px; line-height: 1; }
.warn-note { margin-top: 8px; padding: 8px 10px; border-radius: 7px; font-size: 12px;
  background: #fff7e6; border: 1px solid #f0dcb0; color: #7a5b12; }

.modal-bg { position: fixed; inset: 0; background: rgba(20,26,40,.45); display: flex; align-items: center; justify-content: center; z-index: 50; }
.modal { background: var(--panel); border-radius: 12px; box-shadow: var(--shadow); padding: 20px; width: 640px; max-height: 84vh; overflow: auto; }
.modal.wide { width: min(1000px, 94vw); }
.modal.trans-modal { width: min(560px, 94vw); }

/* ---------- словарь локализации ---------- */
.dict-tbl th { background: #f4f7fc; font-size: 12px; }
.dict-tbl td { vertical-align: middle; }
.dict-tbl .pill { font-family: ui-monospace, Consolas, monospace; }
.dict-cell { width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 13px; }
.dict-cell:focus { border-color: var(--accent); outline: none; }

/* ---------- встроенная документация ---------- */
.modal.help-modal { width: min(1180px, 96vw); max-height: 88vh; }
.btn-help { width: auto; flex-shrink: 0; padding: 6px 12px; font-weight: 700; color: var(--accent); }
.doc-hintbar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding: 8px 10px;
  background: #f2f6ff; border: 1px solid #dbe5fa; border-radius: 8px; font-size: 12px; color: var(--muted); }
.doc-wrap { display: flex; gap: 16px; align-items: flex-start; }
.doc-toc { width: 230px; flex-shrink: 0; position: sticky; top: 0; max-height: 72vh; overflow: auto; }
.doc-toc-g { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted);
  margin: 12px 0 4px; }
.doc-toc a { display: block; padding: 5px 9px; border-radius: 6px; font-size: 13px; cursor: pointer;
  color: var(--text); text-decoration: none; }
.doc-toc a:hover { background: #eef2fb; }
.doc-toc a.active { background: var(--accent); color: #fff; }
/* без scroll-behavior: smooth — по клику в оглавлении нужно оказаться на разделе
   сразу, а не смотреть анимацию прокрутки через десяток разделов */
.doc-body { flex: 1; min-width: 0; max-height: 72vh; overflow: auto; padding-right: 6px; }
.doc-sec { padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid #eef1f6; }
.doc-sec:last-child { border-bottom: 0; }
.doc-sec h3 { margin: 0 0 10px; font-size: 17px; }
.doc-sec h4 { margin: 14px 0 6px; font-size: 13px; color: var(--accent); }
.doc-sec p { margin: 8px 0; line-height: 1.6; font-size: 13.5px; }
.doc-sec code { background: #f1f4fa; border-radius: 4px; padding: 1px 5px;
  font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }
.doc-code { background: #fbfcff; border: 1px solid var(--border); border-radius: 8px; padding: 11px 13px;
  font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; line-height: 1.55;
  overflow-x: auto; white-space: pre; margin: 10px 0; }
.doc-code .c { color: #8a94a6; }
.doc-tbl { width: 100%; border-collapse: collapse; font-size: 13px; margin: 10px 0; }
.doc-tbl th { text-align: left; background: #f4f7fc; padding: 7px 10px; border-bottom: 2px solid var(--border); }
.doc-tbl td { padding: 7px 10px; border-bottom: 1px solid #eef1f6; vertical-align: top; line-height: 1.5; }
.doc-steps { margin: 10px 0; padding-left: 22px; }
.doc-steps li { margin-bottom: 7px; line-height: 1.6; font-size: 13.5px; }
.doc-list { margin: 10px 0; padding-left: 20px; }
.doc-list li { margin-bottom: 7px; line-height: 1.6; font-size: 13.5px; }
.doc-note { background: #f2f8f2; border: 1px solid #cfe6cf; border-radius: 8px; padding: 9px 12px;
  font-size: 13px; color: #2f5d33; }
.doc-warn { background: #fff7e6; border: 1px solid #f0dcb0; border-radius: 8px; padding: 9px 12px;
  font-size: 13px; color: #7a5b12; }
.modal.wide .code-ed { min-height: 320px; }
.modal.wide .code-wrap { height: 46vh; }
.modal h2 { margin: 0 0 14px; font-size: 17px; }

/* ── CRM-виджеты: kanban / timeline / chart ── */
.wgt-board-wrap{width:100%;overflow-x:auto}
.wgt-board{display:flex;gap:10px;align-items:flex-start;min-height:120px}
.kb-col{background:#f4f6fa;border-radius:8px;min-width:220px;max-width:260px;flex:0 0 auto;display:flex;flex-direction:column}
.kb-col.kb-over{outline:2px dashed #4f7cff}
.kb-col-h{padding:8px 10px;font-weight:600;border-bottom:1px solid #e3e8f0}
.kb-cnt{color:#8a94a6;font-weight:400}
.kb-col-body{padding:8px;display:flex;flex-direction:column;gap:8px;min-height:60px}
.kb-card{background:#fff;border:1px solid #e3e8f0;border-radius:6px;padding:8px 10px;cursor:grab;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.kb-card:active{cursor:grabbing}
.kb-card-t{font-weight:500}
.kb-card-s{font-size:12px;margin-top:2px}
.wgt-timeline{width:100%}
.tl-item{display:flex;gap:10px;padding:6px 0}
.tl-dot{width:10px;height:10px;border-radius:50%;background:#4f7cff;margin-top:5px;flex:0 0 auto}
.tl-body{flex:1;border-left:2px solid #e3e8f0;padding-left:10px;margin-left:-6px}
.tl-meta{color:#8a94a6;font-size:12px}
.tl-text{margin-top:2px;white-space:pre-wrap}
.wgt-chart{width:100%}
.wgt-chart svg{max-width:100%}
@media (prefers-color-scheme: dark){
  .kb-col{background:#1c2230}.kb-col-h{border-color:#2b3345}
  .kb-card{background:#232a3a;border-color:#2b3345}
  .tl-body{border-color:#2b3345}
}

/* ── расписание (schedule): ресурсы по колонкам, время по вертикали ── */
.wgt-sched-wrap{width:100%;display:flex;flex-direction:column;gap:10px;min-height:0}
.sch-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sch-nav-box{display:flex;align-items:center;gap:6px}
.sch-nav{padding:4px 12px;font-size:16px;line-height:1}
.sch-date{padding:6px 9px;border:1px solid var(--border);border-radius:8px;font-size:13px;background:var(--panel);color:var(--text)}
.sch-cap{font-weight:600;font-size:15px}
.sch-sum{font-size:12px}
.sch-legend{display:flex;gap:12px;flex-wrap:wrap;margin-left:auto;color:var(--muted);font-size:12px}
.sch-leg{display:inline-flex;align-items:center;gap:5px}
.sch-dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:0 0 auto}

.sch{display:flex;gap:0;overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel)}
.sch-scale{flex:0 0 58px;position:sticky;left:0;z-index:3;background:var(--panel);border-right:1px solid var(--border)}
.sch-corner{height:38px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--panel);z-index:4}
.sch-tick{font-size:11px;color:var(--muted);padding:0 8px;box-sizing:border-box;text-align:right;
  border-bottom:1px dashed transparent;display:flex;align-items:flex-start;justify-content:flex-end}
.sch-tick-h{border-bottom-color:transparent;color:var(--text);font-weight:600}

.sch-cols{display:flex;flex:1 1 auto;min-width:0}
.sch-col{flex:1 1 190px;min-width:170px;border-right:1px solid var(--border);display:flex;flex-direction:column}
.sch-col:last-child{border-right:none}
.sch-col-h{height:38px;box-sizing:border-box;display:flex;align-items:center;gap:7px;padding:0 10px;
  font-weight:600;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--panel);z-index:2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sch-col-note{color:var(--muted);font-weight:400;font-size:12px}
.sch-body{position:relative}
.sch-slot{box-sizing:border-box;border-bottom:1px solid #eef1f6;cursor:pointer}
.sch-slot-h{border-top:1px solid var(--border)}
.sch-slot:hover{background:#eaf1ff}
.sch-slot.sch-over{background:#dbe7ff;outline:2px dashed var(--accent);outline-offset:-2px}

.sch-off{background:repeating-linear-gradient(135deg,#f7f8fb,#f7f8fb 6px,#eef1f6 6px,#eef1f6 12px)}
.sch-off:hover{background:#e7edf9}
.sch-now{position:absolute;left:0;right:0;height:0;border-top:2px solid var(--danger);z-index:1;pointer-events:none}
.sch-now::before{content:'';position:absolute;left:-4px;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--danger)}
.sch-block{position:absolute;left:0;right:2px;box-sizing:border-box;z-index:0;cursor:pointer;
  border:1px dashed #b9c2d4;border-radius:6px;color:#5b6577;font-size:11px;
  display:flex;align-items:flex-start;justify-content:center;padding-top:2px;text-align:center;
  background:repeating-linear-gradient(135deg,#e9edf5,#e9edf5 5px,#dfe5f0 5px,#dfe5f0 10px)}
.sch-block:hover{border-color:#8f9bb3;filter:brightness(.98)}
.sch-block span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sch-item{position:absolute;z-index:1;box-sizing:border-box;border-radius:7px;padding:3px 7px;color:#fff;
  cursor:grab;overflow:hidden;box-shadow:0 1px 3px rgba(20,30,60,.18);border:1px solid rgba(255,255,255,.35)}
.sch-item:active{cursor:grabbing}
.sch-item:hover{filter:brightness(1.06)}
.sch-item-t{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sch-item-s{font-size:11px;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sch-empty{padding:20px}

@media (prefers-color-scheme: dark){
  .sch{background:#1c2230;border-color:#2b3345}
  .sch-scale,.sch-corner,.sch-col-h{background:#1c2230;border-color:#2b3345}
  .sch-col{border-color:#2b3345}
  .sch-slot{border-bottom-color:#232a3a}
  .sch-slot-h{border-top-color:#2b3345}
  .sch-slot:hover{background:#232c40}
  .sch-slot.sch-over{background:#26365a}
  .sch-off{background:repeating-linear-gradient(135deg,#1a2030,#1a2030 6px,#161b28 6px,#161b28 12px)}
  .sch-off:hover{background:#222b40}
  .sch-block{border-color:#39435a;color:#98a2b7;
    background:repeating-linear-gradient(135deg,#212938,#212938 5px,#1b2230 5px,#1b2230 10px)}
  .sch-date{background:#232a3a;border-color:#2b3345}
}

/* ── multiselect (теги) и file (вложения) ── */
.ms{display:flex;flex-wrap:wrap;gap:6px 14px;padding:4px 0}
.ms-item{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.wgt-file{width:100%}
.file-list{display:flex;flex-direction:column;gap:4px;margin-bottom:6px}
.file-item{color:#4f7cff;text-decoration:none}
.file-item:hover{text-decoration:underline}
.file-up{display:flex;gap:8px;align-items:center}


/* multiselect variant:"tags" — добавляемые лейблы, растут вниз */
.mstags { display: flex; flex-direction: column; gap: 6px; }
.mstags-list { display: flex; flex-wrap: wrap; gap: 6px; align-content: flex-start; }
.mstag { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 10px;
         background: #eef2ff; color: #33406b; border: 1px solid #c7d2fe; border-radius: 14px;
         font-size: 13px; line-height: 1.4; }
.mstag-x { border: none; background: transparent; cursor: pointer; font-size: 16px; line-height: 1;
           color: #8891b5; padding: 0 4px; border-radius: 10px; }
.mstag-x:hover { color: #d7504b; background: #fff; }
.mstags-add { align-self: flex-start; max-width: 100%; padding: 5px 8px; border: 1px dashed #c7d2fe;
              border-radius: 8px; background: #fff; color: #33406b; cursor: pointer; }
.mstags-add:disabled { opacity: .5; cursor: default; }


/* BPM визуальный дизайнер */
.bpm { display: flex; flex-direction: column; gap: 8px; }
.bpm-pal { display: flex; flex-wrap: wrap; gap: 6px; }
.bpm-pal-btn { padding: 4px 10px; border: 1px solid #d5dae5; border-left: 3px solid #888; border-radius: 6px;
               background: #fff; cursor: pointer; font-size: 12px; }
.bpm-pal-btn:hover { background: #f2f5ff; }
.bpm-main { display: flex; gap: 10px; align-items: stretch; }
.bpm-scroll { flex: 1; overflow: auto; border: 1px solid #e2e6ee; border-radius: 8px; background:
   linear-gradient(#f7f9fc 1px, transparent 1px) 0 0/22px 22px,
   linear-gradient(90deg, #f7f9fc 1px, transparent 1px) 0 0/22px 22px, #fff; max-height: 460px; }
.bpm-canvas { position: relative; min-width: 420px; min-height: 260px; }
.bpm-edges { position: absolute; left: 0; top: 0; overflow: visible; }
.bpm-edge { fill: none; stroke: #8891a5; stroke-width: 2; cursor: pointer; }
.bpm-edge:hover { stroke: #4f7cff; }
.bpm-edge.sel { stroke: #4f7cff; stroke-width: 3; }
.bpm-elabel { fill: #5a6478; font-size: 11px; text-anchor: middle; paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.bpm-node { position: absolute; background: #fff; border: 1px solid #d5dae5; border-top: 3px solid #888;
            border-radius: 8px; padding: 6px 8px; box-shadow: 0 1px 4px rgba(20,30,60,.08); cursor: move; user-select: none; }
.bpm-node.sel { box-shadow: 0 0 0 2px #4f7cff; }
.bpm-node.cur { box-shadow: 0 0 0 2px #22a06b; background: #f0fbf5; }
.bpm-node.done { opacity: .75; }
.bpm-node-t { font-size: 11px; color: #6a7488; font-weight: 600; }
.bpm-node-l { font-size: 13px; color: #1e2637; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bpm-ic { font-weight: 700; }
.bpm-handle { position: absolute; right: -7px; top: 50%; width: 13px; height: 13px; margin-top: -6px;
              background: #4f7cff; border: 2px solid #fff; border-radius: 50%; cursor: crosshair; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.bpm-canvas.connecting { cursor: crosshair; }
.bpm-insp { width: 260px; flex-shrink: 0; border: 1px solid #e2e6ee; border-radius: 8px; padding: 10px; background: #fbfcfe; max-height: 460px; overflow: auto; }
.bpm-insp-h { font-weight: 600; margin-bottom: 8px; color: #1e2637; }
.bpm-hint { font-size: 12px; color: #8891a5; line-height: 1.5; }
.bpm-f { display: flex; flex-direction: column; gap: 3px; margin-bottom: 8px; }
.bpm-f label { font-size: 11px; color: #6a7488; }
.bpm-f input, .bpm-f select, .bpm-f textarea { padding: 5px 7px; border: 1px solid #d5dae5; border-radius: 6px; font: inherit; font-size: 12px; width: 100%; box-sizing: border-box; }
.bpm-del { margin-top: 6px; padding: 5px 10px; border: 1px solid #f0c4c1; border-radius: 6px; background: #fff5f5; color: #c0392b; cursor: pointer; font-size: 12px; }
.bpm-del:hover { background: #ffe9e9; }


/* Визуальный конструктор BC */
.bcb { display: flex; flex-direction: column; gap: 8px; }
.bcb-top, .bcb-adv { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.bcb-adv { padding: 6px 0; border-top: 1px dashed #e2e6ee; }
.bcb-tl { font-size: 12px; color: #5a6478; display: inline-flex; align-items: center; gap: 4px; }
.bcb-in { padding: 4px 7px; border: 1px solid #d5dae5; border-radius: 6px; font: inherit; font-size: 12px; }
.bcb-in.sm { width: 54px; }
.bcb-base { padding: 4px 7px; border: 1px solid #d5dae5; border-radius: 6px; font-size: 12px; }
.bcb-btn { padding: 4px 10px; border: 1px solid #c7d2fe; border-radius: 6px; background: #f2f5ff; color: #33406b; cursor: pointer; font-size: 12px; }
.bcb-btn:hover { background: #e6ecff; }
.bcb-status { font-weight: 700; }
.bcb-main { display: flex; gap: 12px; align-items: flex-start; }
.bcb-schema { width: 320px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; max-height: 520px; overflow: auto; }
.bcb-tbl { border: 1px solid #d5dae5; border-radius: 8px; background: #fff; }
.bcb-tbl.base { border-color: #4f7cff; }
.bcb-tbl.join { border-color: #8a63d2; }
.bcb-tbl-h { padding: 5px 8px; font-weight: 600; font-size: 12px; background: #f6f8fc; border-bottom: 1px solid #e2e6ee; border-radius: 8px 8px 0 0; display: flex; gap: 4px; align-items: center; }
.bcb-cols { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; }
.bcb-col { padding: 2px 7px; background: #eef2ff; border: 1px solid #d7ddf2; border-radius: 10px; font-size: 11px; cursor: grab; }
.bcb-col:hover { background: #dde6ff; }
.bcb-x { margin-left: auto; border: none; background: transparent; color: #c0392b; cursor: pointer; font-size: 15px; }
.bcb-fields { flex: 1; min-width: 0; }
.bcb-h { font-weight: 600; font-size: 13px; margin-bottom: 6px; }
.bcb-drop { border: 2px dashed #d5dae5; border-radius: 8px; padding: 8px; min-height: 120px; display: flex; flex-direction: column; gap: 4px; }
.bcb-drop.over { border-color: #4f7cff; background: #f5f8ff; }
.bcb-field { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border: 1px solid #e2e6ee; border-radius: 6px; background: #fff; }
.bcb-field.sel { border-color: #4f7cff; box-shadow: 0 0 0 1px #4f7cff; }
.bcb-fn { font-weight: 600; font-size: 13px; min-width: 120px; }
.bcb-fsrc { color: #6a7488; font-size: 12px; font-family: monospace; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bcb-badges { font-size: 10px; color: #8a63d2; background: #f3eefe; padding: 1px 6px; border-radius: 8px; }
.bcb-mini { border: 1px solid #e2e6ee; background: #fff; border-radius: 5px; cursor: pointer; width: 24px; height: 24px; font-size: 12px; }
.bcb-mini:hover { background: #f2f5ff; }
.bcb-insp { margin-top: 8px; border: 1px solid #e2e6ee; border-radius: 8px; padding: 10px; background: #fbfcfe; }
.bcb-insp-h { font-weight: 600; margin-bottom: 8px; }
.bcb-frow { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.bcb-frow label { font-size: 12px; color: #5a6478; min-width: 130px; }
.bcb-frow input[type=text], .bcb-frow select { flex: 1; padding: 4px 7px; border: 1px solid #d5dae5; border-radius: 6px; font-size: 12px; }
.bcb-out { margin-top: 4px; }
.bcb-ok { color: #157347; font-size: 12px; }
.bcb-err { color: #c0392b; font-size: 12px; white-space: pre-wrap; font-family: monospace; }
.bcb-prev-wrap { overflow: auto; max-height: 260px; border: 1px solid #e2e6ee; border-radius: 6px; }
.bcb-prev { border-collapse: collapse; font-size: 12px; }
.bcb-prev th, .bcb-prev td { border: 1px solid #eef1f6; padding: 3px 8px; text-align: left; white-space: nowrap; }
.bcb-prev th { background: #f6f8fc; position: sticky; top: 0; }
.bcb-hint { font-size: 12px; color: #8891a5; }


/* BPM designer v2 */
.bpm-tools { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 4px; }
.bpm-tbtn { padding: 3px 9px; border: 1px solid #c7d2fe; border-radius: 6px; background: #f2f5ff; color: #33406b; cursor: pointer; font-size: 12px; }
.bpm-tbtn:hover { background: #e6ecff; }
.bpm-tin { width: 90px; padding: 3px 7px; border: 1px solid #d5dae5; border-radius: 6px; font-size: 12px; }
.bpm-tsep { font-size: 12px; color: #5a6478; margin-left: 6px; }
.bpm-tstatus { font-size: 12px; color: #157347; margin-left: 6px; }
.bpm-tstatus.bad { color: #c0392b; }
.bpm-issues { display: flex; flex-direction: column; gap: 3px; margin-top: 4px; }
.bpm-issue { font-size: 12px; color: #b45309; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 6px; padding: 3px 8px; }
.bpm-node.bad { box-shadow: 0 0 0 2px #e2a03f; }
.bpm-node.sim { box-shadow: 0 0 0 2px #0ea5e9; }
.bpm-node.simpause { box-shadow: 0 0 0 3px #db2777; }
.bpm-edge.sim { stroke: #0ea5e9; stroke-width: 3; }
.bpm-cond { border: 1px dashed #d5dae5; border-radius: 6px; padding: 6px; margin-bottom: 8px; }
.bpm-condrow { display: flex; gap: 4px; }
.bpm-condrow select, .bpm-condrow input { padding: 4px 6px; border: 1px solid #d5dae5; border-radius: 6px; font-size: 12px; min-width: 0; }
.bpm-condrow select:first-child { flex: 1; }
.bpm-condrow input { flex: 1; }
.bpm-chint { font-size: 11px; color: #8891a5; margin-top: 4px; font-family: monospace; }


/* BPM: дорожки + heatmap */
.bpm-lane { position: absolute; left: 0; background: #f7f9fc; border-top: 1px dashed #cdd5e3; box-sizing: border-box; z-index: 0; }
.bpm-lane.alt { background: #eceff6; }
.bpm-lane-lbl { position: sticky; left: 0; padding: 3px 8px; font-size: 11px; font-weight: 600; color: #5a6478; background: rgba(255,255,255,.75); display: inline-block; border-bottom-right-radius: 6px; }
.bpm-canvas .bpm-node { z-index: 1; }
.bpm-edges { z-index: 0; }
.bpm-heat { position: absolute; top: -9px; right: -9px; min-width: 20px; height: 20px; padding: 0 5px; background: #d7504b; color: #fff; border-radius: 10px; font-size: 11px; font-weight: 700; text-align: center; line-height: 20px; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.bpm-node.heat { box-shadow: 0 0 0 2px #d7504b; }


/* Фильтрация таблиц */
.gtools { display: flex; gap: 6px; margin-bottom: 4px; }
.gfbtn { padding: 2px 9px; border: 1px solid #d5dae5; border-radius: 6px; background: #fff; cursor: pointer; font-size: 12px; }
.gfbtn:hover { background: #f5f7fc; }
.gfbtn.on { background: #eef2ff; border-color: #c7d2fe; color: #33406b; }
tr.gfilter th { padding: 2px 4px; background: #f2f5fb; border-bottom: 1px solid #dbe1ee; }
tr.gfilter input { width: 100%; box-sizing: border-box; padding: 3px 6px; border: 1px solid #d5dae5; border-radius: 5px; font-size: 12px; }
tr.gfilter input:focus { outline: none; border-color: #4f7cff; }


/* Фильтр таблиц: оператор + значение */
.gfcell { display: flex; gap: 2px; }
.gfop { width: 40px; padding: 3px 2px; border: 1px solid #d5dae5; border-radius: 5px; font-size: 12px; background: #fff; }
.gfcell input { flex: 1; min-width: 0; }


/* BPM: триггер на старте + переходы/условия в инспекторе */
.bpm-node-sub { font-size: 10px; color: #6a7488; margin-top: 1px; }
.bpm-sub-h { font-weight: 600; font-size: 12px; color: #33406b; margin: 10px 0 6px; border-top: 1px solid #e2e6ee; padding-top: 8px; }
.bpm-tr { border: 1px solid #e2e6ee; border-radius: 6px; padding: 6px; margin-bottom: 6px; background: #fbfcfe; }
.bpm-tr-h { font-size: 12px; font-weight: 600; color: #1e2637; margin-bottom: 4px; }
.bpm-trdel { margin-top: 4px; padding: 3px 8px; border: 1px solid #f0c4c1; border-radius: 6px; background: #fff5f5; color: #c0392b; cursor: pointer; font-size: 11px; }
.bpm-trdel:hover { background: #ffe9e9; }

/* testrunner (UI E2E) */
.trun{display:flex;flex-direction:column;gap:8px}
.trun-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.trun-src{width:100%;min-height:170px;resize:vertical;font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;padding:10px;border:1px solid var(--border,#d0d5dd);border-radius:8px;background:var(--card,#fff);color:inherit}
.trun-src.bad{border-color:#e5484d}
.trun-status{color:#e5484d;font-size:13px}
.btn.rec{background:#e5484d;color:#fff;border-color:#e5484d}
.trun-sum{padding:9px 12px;border-radius:8px;font-weight:600}
.trun-sum.ok{background:rgba(46,160,67,.15);color:#2ea043}
.trun-sum.bad{background:rgba(229,72,77,.15);color:#e5484d}
.trun-step{display:flex;gap:10px;align-items:baseline;padding:6px 10px;border-bottom:1px solid var(--border,#eee);font-size:13px}
.trun-ic{width:16px;flex:0 0 auto}
.trun-step.ok .trun-ic{color:#2ea043}.trun-step.bad .trun-ic{color:#e5484d}
.trun-step.bad{background:rgba(229,72,77,.06)}
.trun-msg{color:#8a8a8a}

/* модальное окно формы (drill-in карточка) */
.modal-overlay{position:fixed;inset:0;background:rgba(10,15,30,.5);display:flex;align-items:flex-start;justify-content:center;z-index:1000;padding:6vh 16px;overflow:auto}
.modal-card{background:var(--card,#fff);color:inherit;border:1px solid var(--border,#e2e6ef);border-radius:14px;max-width:760px;width:100%;max-height:88vh;overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 20px;border-bottom:1px solid var(--border,#eee);position:sticky;top:0;background:var(--card,#fff);z-index:1}
.modal-head h3{margin:0;font-size:16px}
.modal-x{background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted,#8a8a8a);line-height:1}
.modal-body{padding:8px 16px 18px}
.modal-body .form-card{border:0;box-shadow:none;padding:6px 2px;background:none}
.modal-body .form-title{display:none}


/* ---------- Мессенджер (виджет chat) ---------- */
.chat-wrap { display:flex; border:1px solid var(--border); border-radius:10px; overflow:hidden; background:#fff; min-height:420px; }
.chat-left { width:290px; border-right:1px solid var(--border); display:flex; flex-direction:column; background:#fbfcfe; }
.chat-lhead { display:flex; align-items:center; justify-content:space-between; padding:10px 12px; font-weight:600; border-bottom:1px solid var(--border); }
.chat-new { border:none; background:#eef3fb; width:28px; height:28px; border-radius:7px; cursor:pointer; font-size:15px; }
.chat-new:hover { background:#dfe8f7; }
.chat-list { flex:1; overflow-y:auto; }
.chat-empty { padding:16px; color:var(--muted); font-size:13px; }
.chat-litem { display:flex; gap:10px; padding:9px 12px; cursor:pointer; border-bottom:1px solid #f2f4f8; align-items:center; }
.chat-litem:hover { background:#f2f6ff; }
.chat-litem.on { background:#e7effd; }
.chat-litem-mid { flex:1; min-width:0; }
.chat-litem-title { font-weight:600; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-litem-last { color:var(--muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-litem-right { text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.chat-litem-time { color:var(--muted); font-size:11px; }
.chat-badge { background:#2f6bff; color:#fff; border-radius:10px; font-size:11px; padding:1px 6px; min-width:18px; text-align:center; }
.chat-av { position:relative; width:38px; height:38px; border-radius:50%; background:#c9d6ef; color:#33447a; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.chat-av.grp { background:#ffe0b3; color:#8a5a10; }
.chat-av.onl { box-shadow:0 0 0 2px #2ecc71; }
.chat-dot { position:absolute; right:-1px; bottom:-1px; width:10px; height:10px; border-radius:50%; background:#2ecc71; border:2px solid #fff; }
.chat-right { flex:1; display:flex; flex-direction:column; min-width:0; }
.chat-rhead { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; border-bottom:1px solid var(--border); font-weight:600; }
.chat-rtitle { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-callbtn { border:none; background:#eef3fb; width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:15px; }
.chat-callbtn:hover { background:#dfe8f7; }
.chat-msgs { flex:1; overflow-y:auto; padding:14px; background:#f7f9fc; display:flex; flex-direction:column; gap:4px; }
.chat-loading { color:var(--muted); text-align:center; padding:20px; }
.chat-sys { align-self:center; color:var(--muted); font-size:12px; background:#eef1f6; padding:3px 10px; border-radius:10px; margin:4px 0; }
.chat-msg { max-width:72%; align-self:flex-start; }
.chat-msg.mine { align-self:flex-end; }
.chat-msg-author { font-size:11px; color:#2f6bff; font-weight:600; margin:0 0 1px 8px; }
.chat-bubble { background:#fff; border:1px solid #e6eaf1; padding:7px 11px; border-radius:12px; font-size:13px; white-space:pre-wrap; word-break:break-word; }
.chat-msg.mine .chat-bubble { background:#2f6bff; color:#fff; border-color:#2f6bff; }
.chat-msg-time { font-size:10px; color:var(--muted); margin:1px 8px 0; text-align:right; }
.chat-composer { display:flex; gap:8px; padding:10px 12px; border-top:1px solid var(--border); align-items:flex-end; }
.chat-input { flex:1; resize:none; border:1px solid var(--border); border-radius:9px; padding:8px 11px; font:inherit; font-size:13px; max-height:120px; }
.chat-send { border:none; background:#2f6bff; color:#fff; width:38px; height:38px; border-radius:9px; cursor:pointer; font-size:15px; flex-shrink:0; }
.chat-send:hover { background:#1f57e0; }
.chat-ov { position:fixed; inset:0; background:rgba(20,28,45,.4); display:flex; align-items:center; justify-content:center; z-index:1000; }
.chat-ov-card { background:#fff; border-radius:12px; width:400px; max-width:92vw; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 12px 40px rgba(0,0,0,.25); }
.chat-ov-h { padding:14px 16px; font-weight:700; border-bottom:1px solid var(--border); }
.chat-ov-btn { margin:10px 16px 0; padding:7px 12px; border:1px solid var(--border); background:#f4f6fa; border-radius:8px; cursor:pointer; align-self:flex-start; }
.chat-ov-btn.primary { background:#2f6bff; color:#fff; border-color:#2f6bff; }
.chat-gtitle { margin:10px 16px 0; padding:8px 11px; border:1px solid var(--border); border-radius:8px; font:inherit; }
.chat-ulist { overflow-y:auto; padding:8px 8px 12px; margin-top:8px; }
.chat-urow { display:flex; gap:10px; align-items:center; padding:7px 10px; border-radius:8px; cursor:pointer; }
.chat-urow:hover { background:#f2f6ff; }
.chat-urow.sel { background:#e7effd; }
.chat-urow-mid { flex:1; min-width:0; }
.chat-urow-dep { font-size:12px; color:var(--muted); }
.chat-chk { font-size:16px; }
nav .nav-item { position:relative; }
.nav-badge { position:absolute; right:12px; top:50%; transform:translateY(-50%); background:#ff4d4f; color:#fff; border-radius:10px; font-size:11px; padding:0 6px; min-width:18px; height:18px; line-height:18px; text-align:center; }


/* ---------- Якори (ссылки на сущности) ---------- */
.form-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.anchor-copy { border:1px solid var(--border); background:#f4f6fa; border-radius:8px; padding:5px 11px; cursor:pointer; font-size:13px; white-space:nowrap; }
.anchor-copy:hover { background:#e9eef7; }
.anchor-chip { display:inline-block; padding:1px 8px; border-radius:8px; background:#eef3fb; border:1px solid #dce6f5; font-size:12px; line-height:1.7; vertical-align:baseline; }
.anchor-chip.ok { cursor:pointer; color:#1f57e0; background:#e7effd; }
.anchor-chip.ok:hover { background:#d7e5fd; }
.anchor-chip.bad { color:#a33; background:#fbeaea; border-color:#f0d0d0; }
.anchor-chip.loading { color:var(--muted); }
.chat-msg.mine .anchor-chip { background:#eaf0ff; }

/* read receipts */
.chat-tick { font-size:11px; opacity:.75; margin-left:3px; }
.chat-tick.read { color:#2f6bff; opacity:1; }

/* message edit */
.chat-edited { opacity:.75; font-style:italic; }
.chat-edit-btn { border:none; background:none; cursor:pointer; opacity:0; font-size:12px; margin-left:6px; color:inherit; padding:0; }
.chat-msg:hover .chat-edit-btn { opacity:.55; }
.chat-edit-btn:hover { opacity:1; }
.chat-msg.mine .chat-edit-btn { color:#5a7bd6; }
.chat-edit { display:flex; flex-direction:column; gap:6px; min-width:220px; }
.chat-edit-ta { border:1px solid var(--border); border-radius:9px; padding:7px 10px; font:inherit; font-size:13px; resize:none; }
.chat-edit-row { display:flex; gap:6px; justify-content:flex-end; }
.chat-edit-save, .chat-edit-cancel { border:none; border-radius:7px; padding:4px 11px; cursor:pointer; font-size:12px; }
.chat-edit-save { background:#2f6bff; color:#fff; }
.chat-edit-cancel { background:#eef1f6; }

/* attachments + forward */
.chat-attach { border:none; background:#eef3fb; width:38px; height:38px; border-radius:9px; cursor:pointer; font-size:16px; flex-shrink:0; }
.chat-attach:hover { background:#dfe8f7; }
.chat-img { max-width:240px; max-height:240px; border-radius:8px; display:block; cursor:pointer; margin:2px 0; }
.chat-file { display:inline-block; padding:6px 10px; background:rgba(0,0,0,.05); border-radius:8px; text-decoration:none; color:inherit; font-size:13px; margin:2px 0; }
.chat-msg.mine .chat-file { background:rgba(255,255,255,.2); color:#fff; }
.chat-fwd { font-size:11px; color:#2f6bff; margin-bottom:3px; opacity:.95; font-weight:600; }
.chat-msg.mine .chat-fwd { color:#dbe6ff; }
.chat-fwd-btn { border:none; background:none; cursor:pointer; opacity:0; font-size:13px; margin-left:5px; color:inherit; padding:0; }
.chat-msg:hover .chat-fwd-btn { opacity:.55; }
.chat-fwd-btn:hover { opacity:1; }
.chat-fwd-preview { padding:8px 16px; color:var(--muted); font-size:13px; border-bottom:1px solid var(--border); max-height:60px; overflow:hidden; text-overflow:ellipsis; }

/* ---------- ER-диаграмма (виджет erd) ---------- */
.erd-wrap { display:flex; border:1px solid var(--border); border-radius:10px; overflow:hidden; background:#fff; min-height:460px; }
.erd-side { width:230px; border-right:1px solid var(--border); display:flex; flex-direction:column; background:#fbfcfe; }
.erd-side-h { padding:9px 12px; font-weight:600; border-bottom:1px solid var(--border); }
.erd-search { margin:8px; padding:6px 9px; border:1px solid var(--border); border-radius:8px; font:inherit; font-size:13px; }
.erd-tlist { flex:1; overflow-y:auto; }
.erd-titem { display:flex; align-items:center; gap:8px; padding:5px 12px; cursor:pointer; font-size:12px; border-bottom:1px solid #f2f4f8; }
.erd-titem:hover { background:#f2f6ff; }
.erd-titem.on { background:#e7effd; font-weight:600; }
.erd-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.erd-tname { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.erd-tcount { color:var(--muted); font-size:11px; }
.erd-right { flex:1; display:flex; flex-direction:column; min-width:0; }
.erd-toolbar { display:flex; align-items:center; gap:6px; padding:8px 10px; border-bottom:1px solid var(--border); }
.erd-btn { border:1px solid var(--border); background:#f4f6fa; border-radius:7px; padding:4px 10px; cursor:pointer; font-size:13px; }
.erd-btn:hover { background:#e9eef7; }
.erd-tbhint { color:var(--muted); font-size:12px; margin-left:6px; }
.erd-canvas { flex:1; overflow:auto; position:relative; background:#f7f9fc; background-image:radial-gradient(#e2e8f2 1px, transparent 1px); background-size:22px 22px; }
.erd-world { position:relative; transform-origin:0 0; }
.erd-svg { position:absolute; left:0; top:0; pointer-events:none; overflow:visible; }
.erd-edge { fill:none; stroke:#5a7bd6; stroke-width:1.6; opacity:.75; }
.erd-nodes { position:absolute; left:0; top:0; }
.erd-node { position:absolute; width:220px; background:#fff; border:1px solid #cdd6e6; border-radius:9px; box-shadow:0 2px 8px rgba(30,50,90,.08); font-size:12px; }
.erd-node-h { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:6px 10px; background:#2f6bff; color:#fff; border-radius:8px 8px 0 0; font-weight:600; cursor:move; user-select:none; }
.erd-node-x { border:none; background:transparent; color:#fff; opacity:.7; cursor:pointer; font-size:12px; }
.erd-node-x:hover { opacity:1; }
.erd-col { display:flex; align-items:center; gap:6px; padding:2px 10px; border-top:1px solid #f0f2f6; }
.erd-col.pk { background:#fffbe9; }
.erd-col.fk { background:#f0f6ff; }
.erd-col-k { width:14px; flex-shrink:0; font-size:10px; }
.erd-col-n { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.erd-col.pk .erd-col-n { font-weight:600; }
.erd-col-t { color:var(--muted); font-size:10px; }

.erd-bolt { color:#e0a800; margin:0 2px; }
.erd-node-h.hastr { background:linear-gradient(90deg,#7a3ff0,#2f6bff); }

.gridlink{color:#2563eb;cursor:pointer;text-decoration:underline;font-weight:600}
.gridlink:hover{opacity:.75}

/* ===== Режим демонстрации (виджет demo) ===== */
.demo-wrap{max-width:1020px;margin:0 auto;padding:6px 4px 48px;display:flex;flex-direction:column;gap:10px}
.demo-legend{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:12.5px;color:#64748b;padding:4px 2px 12px;border-bottom:1px solid #dbe3ee}
.demo-sec{display:flex;align-items:baseline;gap:12px;margin:22px 0 4px;border-bottom:2px solid #2f6fb0;padding-bottom:8px}
.demo-sec-l{font-family:ui-monospace,monospace;font-weight:700;color:#fff;background:#2f6fb0;width:26px;height:26px;border-radius:7px;display:grid;place-items:center;font-size:14px;flex:0 0 auto}
.demo-sec h3{margin:0;font-size:17px}
.demo-step{display:grid;grid-template-columns:54px 1fr;gap:14px;background:#fff;border:1px solid #dbe3ee;border-radius:12px;padding:14px 16px;box-shadow:0 1px 2px rgba(20,32,46,.05)}
.demo-num{font-family:ui-monospace,monospace;font-variant-numeric:tabular-nums;font-size:21px;font-weight:700;color:#2f6fb0;text-align:right;border-right:1px solid #dbe3ee;padding-right:12px;line-height:1.4}
.demo-body h4{margin:2px 0 8px;font-size:15.5px;color:#14202e}
.demo-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.demo-chip{font-family:ui-monospace,monospace;font-size:11px;padding:3px 8px;border-radius:7px;border:1px solid #dbe3ee;color:#475569;background:#f7f9fc}
.demo-chip.tz{color:#1e4e80;background:#e8f0f9;border-color:transparent}
.demo-chip.real{color:#2c7a56;background:#e4f2ea;border-color:#bfe0cd}
.demo-chip.mdl{color:#a9701a;background:#f8efdb;border-color:#ecd9ad}
.demo-badge{font-family:ui-monospace,monospace;font-size:11px;font-weight:600;padding:3px 8px;border-radius:999px;border:1px solid #bfe0cd;color:#2c7a56;background:#e4f2ea}
.demo-body p{margin:5px 0;font-size:14px;color:#33465d;line-height:1.5}
.demo-body p b{color:#14202e}
.demo-note{margin-top:9px;background:rgba(47,111,176,.06);border-left:3px solid #2f6fb0;border-radius:0 8px 8px 0;padding:8px 12px;font-size:13px;color:#33465d}
.demo-note b{color:#14202e}
.demo-open{margin-top:11px;font-size:13px;font-weight:600;color:#fff;background:#2f6fb0;border:none;border-radius:8px;padding:7px 15px;cursor:pointer}
.demo-open:hover{filter:brightness(1.08)}
.demo-empty{padding:22px;color:#64748b}
@media (max-width:560px){.demo-step{grid-template-columns:38px 1fr;gap:10px;padding:12px}.demo-num{font-size:17px;padding-right:8px}}

/* Встраивание рантайма (iframe вкладок BPM/ERD в дизайнере): без сайдбара */
.app.embedded .sidebar { display: none; }
.dz-embed { width: 100%; height: calc(100vh - 24px); border: 0; display: block; background: transparent; }

/* Уведомления: колокольчик в сайдбаре и всплывающий список */
.notif-bell { position: relative; display: flex; align-items: center; gap: 8px; width: 100%;
  background: none; border: 0; color: #cfd6e4; padding: 8px 14px; cursor: pointer; text-align: left; }
.notif-bell:hover { background: rgba(255,255,255,.06); }
.notif-bell.has-unread { color: #fff; }
.notif-count { margin-left: auto; background: #e14b4b; color: #fff; border-radius: 10px;
  font-size: 11px; line-height: 1; padding: 3px 6px; min-width: 18px; text-align: center; }
.notif-pop { position: fixed; z-index: 9999; width: 360px; max-height: 60vh; overflow: auto;
  background: var(--panel, #fff); color: var(--text, #1a1f2b); border: 1px solid var(--border, #dfe3ea);
  border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.notif-head { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--border, #dfe3ea); }
.notif-item { padding: 8px 10px; border-bottom: 1px solid var(--border, #eef1f5); cursor: pointer; }
.notif-item:hover { background: var(--panel2, #f6f8fb); }
.notif-item.unread { border-left: 3px solid #4f7cff; }
.notif-text { font-size: 13px; }
.notif-meta { font-size: 11px; margin-top: 2px; }
.notif-empty { padding: 14px; font-size: 12px; }

/* ---- конструктор печатных форм ---- */
.pf-card { padding: 10px 12px; margin: 8px 0; }
.pf-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0; }
.pf-row.pf-el { border-left: 2px solid var(--line, #d7dbe3); padding-left: 8px; }
.pf-sub { font-size: 11px; color: var(--muted, #6b7280); text-transform: none; }
.pf-hint { font-size: 11px; }
.pf-chk { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; white-space: nowrap; }
.pf-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 4px 0; }
.pf-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 11px;
           background: var(--chip-bg, #eef1f5); border-radius: 10px; padding: 2px 6px 2px 9px; }
.pf-chip .pf-x { border: none; background: none; cursor: pointer; color: var(--muted, #6b7280);
                 font-size: 13px; line-height: 1; padding: 0 2px; }
.pf-param { gap: 4px; }
.pf-prev { width: 100%; height: 620px; border: 1px solid var(--line, #d7dbe3);
           border-radius: 8px; background: #fff; }

/* --- дизайнер: сервисные разделы и переносы настроек --- */
.svc-wrap{display:flex;flex-direction:column;height:100%}
.svc-wrap .dz-embed{flex:1;min-height:60vh}
.tx-overlay{position:fixed;inset:0;background:rgba(10,14,25,.55);display:flex;align-items:center;justify-content:center;z-index:300}
.tx-card{background:var(--panel,#fff);color:inherit;border:1px solid rgba(128,128,128,.25);border-radius:14px;padding:20px 22px;width:min(720px,94vw);max-height:86vh;overflow:auto;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.tx-card input[type=text]{width:100%;margin-bottom:8px;padding:8px 10px;border-radius:8px;border:1px solid rgba(128,128,128,.35);background:transparent;color:inherit}
.tx-list{max-height:44vh;overflow:auto;border:1px solid rgba(128,128,128,.25);border-radius:8px;padding:4px}
.tx-row{display:flex;gap:8px;align-items:center;padding:4px 8px;border-radius:6px;cursor:pointer}
.tx-row:hover{background:rgba(128,128,128,.12)}
.tx-kind{font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid rgba(128,128,128,.4);opacity:.8;min-width:52px;text-align:center}
.tx-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.tx-hist{width:100%;border-collapse:collapse;font-size:13.5px}
.tx-hist th,.tx-hist td{text-align:left;padding:7px 10px;border-bottom:1px solid rgba(128,128,128,.18)}
.tx-hist th{opacity:.65;font-weight:600;font-size:12px}

/* Галерея картинок товара (виджет gallery) */
.wgt-gallery .gal-strip{display:flex;flex-wrap:wrap;gap:10px;padding:6px 2px;overflow-x:auto}
.gal-img{height:96px;max-width:180px;object-fit:cover;border-radius:8px;cursor:zoom-in;
  border:1px solid rgba(128,128,128,.25);background:rgba(128,128,128,.06);transition:transform .12s}
.gal-img:hover{transform:scale(1.04)}

/* кнопка действия в строке дерева (on_row_action) */
.tnode .tact-btn { margin-left: 8px; padding: 1px 9px; border: 1px solid #d5dae5; border-radius: 6px;
  background: #fff; color: var(--text); font-size: 12px; white-space: nowrap; opacity: .65; }
.tnode:hover .tact-btn { opacity: 1; }
.tnode .tact-btn:hover { background: #eef2ff; border-color: #c7d2fe; }
.thead .tcol.tact { width: 60px; }