/* ============================================================
   FORMA — конструктор управляемых форм 1С

   Три зоны, три визуальных языка:

   1) Оболочка редактора (шапка, палитра, дерево, тулбар, модалки) —
      собственный стиль FORMA, красный акцент.

   2) Холст (.form-window и всё внутри) — воспроизводит форму в
      клиенте 1С: прямые углы, плотность 22 px на строку, шрифт 12 px,
      тонкие рамки #adadad, без теней-карточек и скруглений.

   3) Панель свойств (.right-panel) — воспроизводит палитру свойств
      Конфигуратора: кремовая шапка #f5f2dd, сетка строк по 21 px,
      колонка имён 56 % с вертикальным разделителем, редакторы
      значений во всю ячейку, синее выделение строки #4a5fc4.

   Размеры и цвета зон 2 и 3 сняты попиксельно со скриншотов
   реального 1С, а не подобраны на глаз.
   ============================================================ */

:root{
  --ink:#1f2328;
  --ink-2:#3a4048;
  --muted:#5b6472;
  --icon:#7a8391;
  --line:#e3e6ea;
  --line-soft:#edeff2;
  --bg:#f4f5f7;
  --panel:#fff;
  --panel-soft:#fafbfc;

  --brand:#2e5bd6;
  --brand-hover:#2449b3;
  --brand-wash:#ebf0fc;
  --brand-wash-line:#cbd8f7;

  --green:#188055;
  --green-wash:#e9f7f1;
  --danger:#c9331f;
  --warn:#9a5b0a;
  --warn-wash:#fdf1e0;

  /* --- клиент 1С («Такси»), значения сняты с референса --- */
  --x-text:#000;
  --x-band:#bfcddb;
  --x-win-border:#b3ac86;
  --x-win-outside:#fcfaeb;
  --x-link:#1c55ae;
  --x-btn-a:#f6f6f6;
  --x-btn-b:#ececec;
  --x-btn-border:#9b9b9b;
  --x-btn-shadow:#d2d2d2;
  --x-fld-border:#a0a0a0;
  --x-tab-bg:#ebebeb;
  --x-tab-line:#b3b3b3;
  --x-grid-head:#f2f2f2;
  --x-grid-border:#a0a0a0;
  --x-grid-line:#cccccc;

  /* --- Конфигуратор 1С, значения сняты с референса --- */
  --c-cream:#f5f2dd;
  --c-cream-2:#fcfaeb;
  --c-cream-3:#f1edcf;
  --c-border:#b3ac86;
  --c-soft:#dcd9c4;
  --c-combo:#efebd9;
  --c-select:#536ac2;
  --c-text:#000;
  --c-label-col:56%;

  --radius-sm:6px;
  --radius-md:8px;
  --radius-lg:12px;
  --shadow-sm:0 1px 2px rgba(31,35,40,.06);
  --shadow-brand:0 2px 10px rgba(46,91,214,.28);
}

*{box-sizing:border-box}

body{
  margin:0;color:var(--ink);background:var(--bg);
  font:13px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  min-width:1050px;-webkit-font-smoothing:antialiased;
}

::selection{background:var(--brand-wash);color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}

button{
  cursor:pointer;border:1px solid var(--line);border-radius:var(--radius-md);
  background:var(--panel);padding:8px 14px;white-space:nowrap;font-weight:500;color:var(--ink-2);
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .05s ease,color .15s ease;
}
button:hover{background:var(--bg);border-color:#cdd2d9}
button:active{transform:translateY(1px)}
button:disabled{opacity:.4;cursor:default;transform:none}
button:focus-visible,input:focus,select:focus,textarea:focus{outline:2px solid var(--brand);outline-offset:2px}
button.primary{background:linear-gradient(135deg,var(--brand),var(--brand-hover));border-color:var(--brand-hover);color:#fff;font-weight:600;box-shadow:var(--shadow-brand)}
button.primary:hover{filter:brightness(1.05);box-shadow:0 4px 16px rgba(214,58,36,.36)}

/* ---------- Шапка редактора ---------- */
.app-header{
  height:76px;background:var(--panel);border-bottom:1px solid var(--line);
  display:flex;align-items:center;padding:0 22px;gap:24px;
  box-shadow:0 1px 0 var(--line),0 6px 16px rgba(15,23,42,.03);position:relative;z-index:1;
}
.brand{display:flex;align-items:center;gap:12px;font-size:20px;letter-spacing:.2px;font-weight:800;width:225px;flex-shrink:0}
.brand small{display:block;font-size:8px;letter-spacing:1.8px;color:var(--muted);margin-top:3px;font-weight:600}
.brand-icon{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:linear-gradient(135deg,var(--brand),var(--brand-hover));
  color:#fff;font-size:19px;font-weight:800;box-shadow:var(--shadow-brand);
}
.brand-icon span{
  position:absolute;right:-3px;bottom:-3px;width:10px;height:10px;border-radius:50%;
  background:var(--ink);border:2px solid #fff;font-size:0;color:transparent;line-height:0;
}
.document-name{display:flex;align-items:center;gap:13px;font-weight:600;color:var(--ink-2)}
.badge{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:4px 8px;font-size:10px;font-weight:500;color:var(--muted)}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.header-actions .muted{font-size:11px;margin-right:8px}
.muted{color:var(--muted)}

/* ---------- Рабочая область ---------- */
.workspace{display:flex;height:100vh;min-height:660px}
.left-panel{width:250px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column}
.panel-title{font-weight:600;padding:22px 18px 16px;display:flex;justify-content:space-between;color:var(--ink-2)}
.panel-title .muted{font-size:11px;font-weight:400}

.palette{padding:0 13px 14px;flex:1;overflow:auto}
.palette-section{font-size:9px;font-weight:700;color:var(--icon);letter-spacing:1.2px;padding:10px 4px;text-transform:uppercase}
.palette-grid{display:flex;flex-wrap:wrap;gap:6px}
.palette-item{width:calc(50% - 3px);display:flex;align-items:center;gap:7px;border:1px solid var(--line-soft);text-align:left;white-space:normal;padding:9px 7px;min-height:43px;font-size:10px;border-radius:var(--radius-sm);line-height:1.3;color:var(--ink-2);font-weight:500}
.palette-item:hover{background:var(--bg);border-color:#d3d8de}
.palette-item.allowed{background:var(--brand-wash);border-color:var(--brand-wash-line)}
.palette-item.allowed .palette-icon{color:var(--brand-hover)}
.palette-item.allowed:hover{background:#fbe1dc;border-color:var(--brand)}
.palette-item.elsewhere{opacity:.55}
.palette-item.blocked{opacity:.32}
.palette-item.elsewhere:hover,.palette-item.blocked:hover{opacity:1}
.palette-icon{display:inline-flex;width:20px;height:23px;align-items:center;justify-content:center;color:var(--icon);font-size:16px;flex-shrink:0}

/* Структура формы — панель сверху: сворачивается по клику, высота тянется за уголок */
.structure{flex-shrink:0;background:var(--panel);border-bottom:1px solid var(--line)}
.structure-head{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:9px 16px;font-size:12px;font-weight:600;color:var(--ink-2);background:var(--panel-soft);border-bottom:1px solid var(--line)}
.structure-head::-webkit-details-marker{display:none}
.structure-head:hover{background:var(--bg)}
.structure-head:before{content:"\25be";font-size:10px;color:var(--muted);width:9px;flex-shrink:0}
.structure:not([open]) .structure-head:before{content:"\25b8"}
.structure:not([open]) .structure-head{border-bottom:0}
.structure-head .count{margin-left:auto}
.structure-body{height:168px;min-height:54px;max-height:55vh;width:100%;min-width:240px;max-width:100%;resize:both;overflow:hidden}
.structure-body .tree{height:100%;padding:4px 6px}
.count{background:var(--bg);border-radius:5px;color:var(--muted);font-size:10px;padding:2px 6px;font-weight:500}
.tree{overflow:auto;flex:1;padding:9px 8px}
.tree-node{width:100%;display:flex;align-items:center;gap:7px;text-align:left;border:1px solid transparent;background:none;padding:3px 8px;border-radius:3px;font-size:12px;min-height:22px;color:var(--ink-2);transition:background-color .12s ease}
.tree-node:hover{background:var(--bg)}
.tree-node span:last-child{overflow:hidden;text-overflow:ellipsis}
.tree-node.selected{background:var(--brand-wash);border-color:transparent;box-shadow:inset 3px 0 0 var(--brand);color:var(--ink);font-weight:600}
.tree-icon{color:var(--icon);font-size:14px;width:16px}
.tree-node.selected .tree-icon{color:var(--brand-hover)}

.tree-tools{padding:6px 12px;display:flex;gap:5px;border-top:1px solid var(--line)}
.tree-tools button{padding:6px 10px;font-size:12px}
.tree-tools button:last-child{margin-left:auto}
.tree-tools button:last-child:hover{background:var(--brand-wash);border-color:var(--brand-wash-line);color:var(--danger)}

main{display:flex;flex:1;flex-direction:column;min-width:0}
.main-toolbar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 23px;background:var(--panel-soft);border-bottom:1px solid var(--line);gap:10px}
.view-switch{display:flex;gap:3px;background:var(--bg);border:1px solid var(--line);padding:3px;border-radius:9px}
.view-switch button{background:none;border:0;color:var(--muted);font-size:11px;padding:7px 12px;border-radius:7px;font-weight:500}
.view-switch button.active{background:var(--panel);color:var(--ink);box-shadow:var(--shadow-sm);font-weight:600}
.tools{display:flex;align-items:center;gap:4px}
.tools button{border-color:transparent;background:transparent;padding:7px;font-size:13px;color:var(--muted)}
.tools button:hover{background:var(--bg);color:var(--ink)}
.tools button.active{background:var(--brand-wash);color:var(--brand-hover)}
.tools select{border:0;background:transparent;font-size:10px;width:64px;color:var(--muted)}
.separator{height:20px;width:1px;background:var(--line);margin:0 7px}

/* ============================================================
   ХОЛСТ: форма как в клиенте 1С — цвета сняты с референса
   ============================================================ */
.stage{display:flex;flex:1;min-height:0;overflow:hidden}
#design-pane{flex:1;min-width:0;overflow:auto;padding:24px;background-color:var(--bg);background-image:radial-gradient(#d7dce2 .7px,transparent .7px);background-size:14px 14px}

.form-window{
  background:#fff;border:1px solid var(--x-win-border);border-radius:0;
  box-shadow:0 0 0 3px var(--x-win-outside),0 2px 8px rgba(0,0,0,.16);
  min-height:420px;max-width:1100px;margin:auto;transform-origin:top left;
  font:12px/1.35 "Segoe UI",Tahoma,Arial,sans-serif;color:var(--x-text);
}
.form-titlebar{height:28px;padding:0 6px 0 8px;display:flex;gap:7px;align-items:center;background:var(--x-band);border-bottom:1px solid var(--x-win-border);font-size:12px;font-weight:600}
.canvas{padding:7px 8px 12px;min-height:360px}

.node{position:relative;padding:1px;border:1px solid transparent;border-radius:0;min-width:0;cursor:default}
.node:hover{border-color:#e7b3aa}
.node.selected{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.node.selected:after{content:attr(data-name);position:absolute;right:0;top:-15px;background:var(--brand);color:#fff;font-size:9px;line-height:1.3;padding:1px 5px;border-radius:2px;z-index:2;pointer-events:none;font-weight:600}
.node-content{min-width:0}
.layout{display:flex;flex-direction:column;gap:2px}
.layout.horizontal{flex-direction:row;align-items:flex-start;gap:14px}
.layout.horizontal>.node{flex:1}
.layout.wrap{flex-wrap:wrap}
.layout.wrap>.node{flex-basis:180px}
.group-caption{font-weight:600;font-size:12px;padding:0 0 3px;color:var(--x-text)}
.group-box{border:1px solid var(--x-fld-border);border-radius:0;padding:6px 7px;background:#fff}
.empty-drop{border:1px dashed var(--x-grid-line);border-radius:0;text-align:center;padding:14px 8px;color:#8a8a8a;font-size:11px;min-height:48px}

.field{display:flex;align-items:center;gap:4px;min-height:22px}
.field>label{width:auto;flex:0 0 auto;white-space:nowrap;font-size:12px;color:var(--x-text);line-height:1.2}
.field input,.field select,.field textarea{
  width:100%;min-width:24px;border:1px solid var(--x-fld-border);border-radius:0;
  background:#fff;padding:1px 4px;font:12px/1.3 "Segoe UI",Tahoma,Arial,sans-serif;height:24px;color:var(--x-text);
}
.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{flex:1 1 0}
.field select{
  appearance:none;-webkit-appearance:none;padding-right:20px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4'%3E%3Cpath d='M0 0h7L3.5 4z' fill='%23000'/%3E%3C/svg%3E"),linear-gradient(var(--x-fld-border),var(--x-fld-border)),linear-gradient(var(--x-btn-a),var(--x-btn-b));
  background-repeat:no-repeat;background-size:7px 4px,1px 100%,17px 100%;
  background-position:right 5px center,right 17px center,right center;
}
.field textarea{height:50px;resize:vertical;padding:2px 4px}
.field input[type=checkbox]{width:13px;height:13px;accent-color:#3d5573;margin:0}
.field input[type=radio]{width:13px;height:13px;accent-color:#278d70;margin:0}
.field .choices{display:flex;gap:14px;flex-wrap:wrap}
.choices label{display:flex;align-items:center;gap:4px}
.field.disabled{opacity:.5}
.field.top{flex-direction:column;align-items:stretch;gap:2px}
.field progress{appearance:none;-webkit-appearance:none;display:block;flex:0 1 320px;width:320px;max-width:100%;height:20px;margin:0;border:1px solid var(--x-fld-border);border-radius:0;background:#fff;overflow:hidden}
.field progress::-webkit-progress-bar{background:#fff}
.field progress::-webkit-progress-value{background:#f2c21e}
.field progress::-moz-progress-bar{background:#f2c21e}

.form-button{
  font:12px/1.2 "Segoe UI",Tahoma,Arial,sans-serif;padding:2px 12px;border-radius:2px;
  background:linear-gradient(180deg,var(--x-btn-a),var(--x-btn-b));border:1px solid var(--x-btn-border);
  box-shadow:0 1px 0 var(--x-btn-shadow);height:24px;min-height:24px;font-weight:400;color:var(--x-text);
}
.form-button:hover{background:linear-gradient(180deg,#fff,#e3edf8);border-color:#7f9db9}
.form-button.default{font-weight:700}
.commandbar{display:flex;flex-wrap:wrap;gap:3px;align-items:center}
.commandbar>.node{padding:1px}
.commandbar .form-button{white-space:normal}

.tabs-row{display:flex;gap:1px;border-bottom:1px solid var(--x-tab-line);margin-bottom:6px;padding-left:1px}
.tab-label{
  background:var(--x-tab-bg);border:1px solid var(--x-tab-line);border-bottom:none;border-radius:2px 2px 0 0;
  color:#1a1a1a;padding:3px 13px;font-size:12px;line-height:1.3;height:23px;
}
.tab-label.active{background:#fff;color:#000;font-weight:600;position:relative;top:1px;height:24px}

.table-wrap{overflow:auto;border:1px solid var(--x-grid-border);border-radius:0}
.table-commandbar{display:flex;align-items:center;gap:5px;min-height:25px;padding:2px 4px;background:var(--c-cream-2);border:1px solid var(--x-grid-border);border-bottom:0}
.table-search{display:flex;align-items:center;gap:6px;min-height:25px;padding:2px 6px;color:var(--x-text);font-size:12px;background:var(--c-cream);border:1px solid var(--x-grid-border);border-bottom:0}
.table-search input{width:190px;height:20px;padding:1px 5px;border:1px solid var(--x-fld-border);background:#fff;font:inherit}
.table-commandbar .table-search{flex:1;border:0;background:transparent;padding:0}
.table-commandbar .table-search input{flex:1;max-width:260px}
.table-search-control{width:24px;height:23px;border:1px solid var(--x-grid-border);background:var(--c-cream);color:var(--x-text);font-size:17px;line-height:18px;cursor:pointer}
.table-view-status{min-height:20px;padding:3px 6px;color:var(--muted);font-size:11px;background:var(--c-cream-2);border:1px solid var(--x-grid-border);border-top:0}
.preview-table{border-collapse:collapse;width:100%;font-size:12px}
.preview-table th{
  background:var(--x-grid-head);text-align:left;color:var(--x-text);font-weight:400;
  padding:4px 7px;height:28px;border-bottom:1px solid var(--x-grid-border);
  border-right:1px solid var(--x-grid-line);white-space:nowrap;
}
.preview-table td{padding:3px 7px;min-width:70px;border-bottom:1px solid var(--x-grid-line);border-right:1px solid var(--x-grid-line);height:22px;color:#9b9b9b}
.preview-table tr:last-child td{border-bottom:0}
.preview-table.no-vlines th,.preview-table.no-vlines td{border-right:0}
.preview-table.no-hlines tbody td{border-bottom:0}
.preview-table.alternating-rows tbody tr:nth-child(even) td{background:var(--c-cream-2)}
.picture{border:1px dashed var(--x-grid-line);background:#fafafa;min-height:56px;display:flex;align-items:center;justify-content:center;gap:8px;color:#9b9b9b;font-size:11px}
.picture span{font-size:20px}
.html-preview,.document-preview{display:block;flex:0 1 auto;min-width:120px;max-width:100%;min-height:54px;box-sizing:border-box;border:1px solid var(--x-fld-border);background:#fff}
.document-preview{overflow:auto;white-space:pre-wrap;font:12px/1.35 "Segoe UI",Tahoma,Arial,sans-serif;color:var(--x-text)}
.form-link{color:var(--x-link);text-decoration:underline}
.hidden-node{opacity:.4}
.preview-mode .node{border-color:transparent!important;box-shadow:none!important;background:transparent!important}
.preview-mode .node:after{display:none}
.preview-mode .hidden-node{display:none}
.drop-target{outline:2px dashed var(--brand)!important;outline-offset:-2px;background:var(--brand-wash)!important}

/* ============================================================
   ПАНЕЛЬ СВОЙСТВ: палитра Конфигуратора — цвета сняты с референса.
   Горизонтальных линий между строками в Конфигураторе нет:
   вертикальная линия — это левые рамки самих редакторов значений.
   ============================================================ */
.right-panel{width:292px;flex-shrink:0;border-left:1px solid var(--c-border);background:#fff;display:flex;flex-direction:column;font-size:11px}
.inspector-header{display:flex;align-items:baseline;gap:6px;padding:4px 8px;min-height:24px;background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.eyebrow{color:#6f684f;font-size:9px;letter-spacing:.6px;font-weight:600;text-transform:uppercase;flex-shrink:0}
.inspector-header h2{font-size:12px;font-weight:700;margin:0;overflow-wrap:anywhere;color:var(--c-text)}
.inspector{padding:0;overflow:auto;flex:1;background:#fff}

.section-label{font-size:11px;letter-spacing:0;color:var(--c-text);text-transform:none;font-weight:700;margin:0;padding:3px 6px;background:#fff;border-bottom:1px solid var(--c-soft)}
.section-label:first-child{border-top:0}
.section-label:before{content:"\25be  ";font-size:9px}
.section-label:after{content:":"}

.property{display:grid;grid-template-columns:var(--c-label-col) 1fr;align-items:center;gap:0;margin:0;padding:1px 0;border:0;border-radius:0;color:var(--c-text);font-size:11px;min-height:20px}
.property>span{display:flex;align-items:center;padding:1px 6px;overflow-wrap:anywhere;font-weight:400;line-height:1.2}
.property input,.property select,.property textarea{
  width:100%;border:1px solid var(--c-border);border-radius:0;background:#fff;
  padding:1px 4px;font-size:11px;color:var(--c-text);height:18px;min-height:18px;
}
.property select{
  appearance:none;-webkit-appearance:none;padding-right:19px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4'%3E%3Cpath d='M0 0h7L3.5 4z' fill='%23000'/%3E%3C/svg%3E"),linear-gradient(var(--c-border),var(--c-border)),linear-gradient(var(--c-combo),var(--c-combo));
  background-repeat:no-repeat;background-size:7px 4px,1px 100%,15px 100%;
  background-position:right 4px center,right 15px center,right center;
}
.property textarea{height:auto;min-height:38px;resize:vertical;font-family:Consolas,monospace;padding:2px 4px}
.property-multiline{align-items:start}
.property input:focus,.property select:focus,.property textarea:focus{outline:1px solid var(--c-select);outline-offset:-1px}
.property:hover{background:#faf9f3}
.property:focus-within{background:var(--c-select)}
.property:focus-within>span{color:#fff}
.property input[type=checkbox]{width:13px;height:13px;min-height:0;height:13px;border:0;justify-self:start;margin:0 0 0 4px;accent-color:var(--c-select)}

.check-property{display:grid;grid-template-columns:var(--c-label-col) 1fr;align-items:center;margin:0;padding:1px 0;border:0;border-radius:0;color:var(--c-text);font-size:11px;min-height:20px;line-height:1.2;text-indent:6px}
.check-property:hover{background:#faf9f3}
.check-property:focus-within{background:var(--c-select);color:#fff}
.check-property input[type=checkbox]{width:13px;height:13px;justify-self:start;margin:0;text-indent:0;accent-color:var(--c-select)}

.help{font-size:11px;color:#3d3a2c;line-height:1.45;padding:5px 7px;background:var(--c-cream-2);border-top:1px solid var(--c-soft);border-bottom:1px solid var(--c-soft)}
.inline-link{color:var(--x-link);background:none;border:0;border-radius:0;font-size:11px;padding:3px 7px;text-align:left;text-decoration:underline;white-space:normal;width:100%;margin:0;font-weight:400}
.inline-link:hover{background:#faf9f3;color:#0d3d85}
.fn-hint{font:10px/1.45 Consolas,monospace;color:#3d3a2c;padding:5px 7px;background:var(--c-cream-2);border:1px solid var(--c-border);border-radius:0;overflow-wrap:anywhere;margin:6px}
.inspector details{border-top:1px solid var(--c-soft);margin:0;padding:0}
.inspector summary{cursor:pointer;font-size:11px;color:var(--c-text);margin:0;padding:3px 7px;background:var(--c-cream);font-weight:400}
.inspector summary:hover{background:var(--c-cream-3)}

/* Нижняя полоса убрана. #status остаётся в DOM скрытым: в него пишет status() из app.js
   (11 вызовов), и он же озвучивает сообщения программам чтения с экрана. */
#status{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ---------- Код 1С ---------- */
#code-pane{display:flex;flex-direction:column;flex:1;min-width:0;background:var(--panel-soft)}
#code-pane[hidden],#design-pane[hidden],[hidden]{display:none!important}
.stage.split #design-pane{flex:1;padding:14px}
.stage.split #code-pane{flex:1;border-left:1px solid var(--line)}
.stage.split .canvas{padding:6px}
.stage.split .layout.horizontal{flex-wrap:wrap}
.code-toolbar{padding:12px;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--line);font-size:10px;flex-wrap:wrap}
.code-toolbar b{margin-right:auto;color:var(--ink-2)}
.code-toolbar button{font-size:10px;padding:7px 10px}
.code-notice{background:var(--green-wash);color:var(--green);font-size:10px;padding:8px 13px;font-weight:500}
.code-notice.dirty{background:var(--warn-wash);color:var(--warn)}
#code{flex:1;border:0;resize:none;padding:18px;outline:none;white-space:pre;overflow:auto;tab-size:4;background:var(--panel-soft);color:#3f5769;font:12px/1.8 Consolas,'Courier New',monospace}
#code-editor-host{display:flex;position:relative;flex:1;min-width:0;min-height:0;overflow:hidden;background:#fff}
#code-editor-host #code{width:100%;min-width:0;min-height:0}
.bsl-code-frame{display:block;flex:1;width:100%;height:100%;min-width:0;min-height:0;border:0;background:#fff}
.code-engine{font-size:10px;color:#707070;white-space:nowrap}
#code-engine-note{color:#7e4e16}

/* ---------- Модальные окна ---------- */
.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(24,38,53,.45);z-index:10;display:flex;align-items:center;justify-content:center;padding:30px}
.modal{width:820px;max-width:100%;max-height:90vh;border-radius:var(--radius-lg);background:var(--panel);box-shadow:0 24px 90px rgba(29,41,53,.32);display:flex;flex-direction:column}
.modal>header{padding:18px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.modal h2{font-size:17px;margin:0;color:var(--ink)}
.modal header button{border:0;background:none;font-size:20px;width:32px;height:32px;border-radius:var(--radius-sm);color:var(--muted);display:flex;align-items:center;justify-content:center;padding:0}
.modal header button:hover{background:var(--bg);color:var(--ink)}
.modal #modal-content{padding:22px 24px;overflow:auto}
.modal>footer{padding:15px 24px;background:var(--panel-soft);border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px;border-radius:0 0 var(--radius-lg) var(--radius-lg)}
.modal textarea{width:100%;min-height:310px;font:12px/1.6 Consolas,monospace;border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px;resize:vertical;white-space:pre}
.modal p{line-height:1.7;color:var(--muted);font-size:12px}
.modal-error,#modal-error{color:var(--danger);font-size:12px;padding:0 24px 12px}

.data-table{width:100%;border-collapse:collapse}
.data-table td,.data-table th{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line-soft);font-size:11px}
.data-table input,.data-table select{padding:7px 8px;border:1px solid var(--line);border-radius:5px;width:100%;font-size:11px}
.data-table th{color:var(--muted);font-weight:600}
.data-table button{padding:5px 9px}
.grid-properties{display:block}
.grid-properties>*{min-width:0}

/* ---------- Скроллбары ---------- */
.palette,.tree,#design-pane,.inspector,#code,.modal #modal-content,.modal textarea{scrollbar-width:thin;scrollbar-color:#c7cbd1 transparent}
.palette::-webkit-scrollbar,.tree::-webkit-scrollbar,#design-pane::-webkit-scrollbar,.inspector::-webkit-scrollbar,#code::-webkit-scrollbar,.modal #modal-content::-webkit-scrollbar{width:10px;height:10px}
.palette::-webkit-scrollbar-thumb,.tree::-webkit-scrollbar-thumb,#design-pane::-webkit-scrollbar-thumb,.inspector::-webkit-scrollbar-thumb,#code::-webkit-scrollbar-thumb,.modal #modal-content::-webkit-scrollbar-thumb{background:#c7cbd1;border-radius:20px;border:2px solid transparent;background-clip:padding-box}
.palette::-webkit-scrollbar-thumb:hover,.tree::-webkit-scrollbar-thumb:hover,#design-pane::-webkit-scrollbar-thumb:hover,.inspector::-webkit-scrollbar-thumb:hover,#code::-webkit-scrollbar-thumb:hover{background:#aeb3ba}

/* ---------- Адаптивность ---------- */
@media (max-width:1250px){
  .left-panel{width:220px}
  .right-panel{width:262px}
  .brand{width:193px}
  .header-actions .muted{display:none}
  .document-name{max-width:175px;font-size:11px}
  .app-header{gap:15px;padding:0 15px}
  .main-toolbar{padding:0 12px}
  .tools button{font-size:11px}
  #design-pane{padding:18px}
  .workspace{min-height:560px}
}

/* Embedded desktop HTML field: same design, bounded by the host's viewport. */
html{height:100%}
body.host-1c{height:100%;min-width:0;overflow:hidden;display:flex;flex-direction:column}
.host-1c .app-header{flex:0 0 54px;height:54px;padding:0 12px}
.host-1c .workspace{height:auto;min-height:0;flex:1 1 auto;overflow:hidden}
.host-1c main,.host-1c .left-panel,.host-1c .right-panel{min-height:0}
.host-1c .palette{max-height:none;flex:1;overflow:auto}
.host-1c .main-toolbar{flex-shrink:0;height:46px;padding:0 10px}
.host-1c .structure{flex-shrink:0}
.host-1c .structure-body{height:110px;max-height:25vh}
.host-1c [data-action="open"],.host-1c [data-action="save"],.host-1c [data-action="download-bsl"]{display:none}
.host-1c #design-pane{padding:12px}
.host-1c .modal-overlay{padding:14px}
.host-1c .modal textarea{min-height:150px}
.host-1c .form-window{min-height:250px}
#code-section{max-width:190px;border:1px solid var(--line);border-radius:4px;padding:6px;background:var(--panel);font-size:11px}
#preview-blocker{padding:14px;white-space:normal;overflow-wrap:break-word}
button:focus{outline:1px solid var(--brand)}
@media (max-width:1100px){
 .host-1c .brand{width:auto}.host-1c .brand small,.host-1c .document-name{display:none}
 .host-1c .left-panel{width:168px}.host-1c .right-panel{width:240px}
 .host-1c .view-switch button{padding:5px 6px}.host-1c .tools .separator{display:none}
 .host-1c .palette{padding:0 7px 8px}.host-1c .palette-item{font-size:10px;padding:6px 3px}
}
@media (max-width:800px){
 .host-1c .left-panel{width:130px}.host-1c .right-panel{width:215px}
 .host-1c .palette-item{width:100%}.host-1c .tools{flex-wrap:wrap}
 .host-1c .main-toolbar{height:auto;min-height:46px;flex-wrap:wrap;padding:5px}
 .host-1c .view-switch button{font-size:10px}.host-1c .form-window{min-width:300px}
 .host-1c .header-actions .muted{display:none}.host-1c .inspector{--c-label-col:100px}
}
/* Older embedded WebKit can support grid gap but not flex gap. */
.no-flex-gap .layout:not(.horizontal)>.node+.node{margin-top:2px}
.no-flex-gap .layout.horizontal>.node+.node{margin-left:14px}
.no-flex-gap .field>label{margin-right:4px}
.no-flex-gap .choices>label+label{margin-left:14px}
.no-flex-gap .palette-item{margin-right:3px;margin-bottom:6px}
.no-flex-gap .commandbar>.node+.node{margin-left:3px}
.no-flex-gap .header-actions>button+button,.no-flex-gap .tree-tools>button+button{margin-left:5px}
.no-flex-gap .brand-icon{margin-right:12px}

/* ============================================================
   Оболочка в стиле Конфигуратора 1С.
   Иконки — настоящие ресурсы 1С из dist/Картинки, нарезаны
   scripts/make-icons.py в src/icons.css (base64, без внешних файлов):
   полоса 00716 — сущности формы, 00919 — панель инструментов,
   02835 — переключатели представления, отдельные PNG — типы полей.
   ============================================================ */
.ic{vertical-align:-3px}
.tree-icon,.palette-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none;font-size:0}
.tree-node.selected .tree-icon{color:inherit}

/* --- верхняя панель инструментов --- */
.main-toolbar{height:29px;min-height:29px;padding:0 4px;background:var(--c-cream-2);border-bottom:1px solid var(--c-border);gap:0;justify-content:flex-start}
.main-toolbar .tools{gap:1px;width:100%}
.main-toolbar .tools button{width:24px;height:23px;min-height:0;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:0;background:none;color:var(--c-text)}
.main-toolbar .tools button:hover:not(:disabled){background:var(--c-cream-3);border-color:var(--c-border);color:var(--c-text)}
.main-toolbar .tools button.active{background:var(--c-combo);border-color:var(--c-border);color:var(--c-text);box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.main-toolbar .tools button:disabled{opacity:.35}
.main-toolbar .separator{height:17px;width:1px;margin:0 4px;background:var(--c-soft)}
.main-toolbar select{border:1px solid var(--c-border);background:#fff;border-radius:0;height:19px;font-size:11px;width:58px;color:var(--c-text);padding:0 2px}
.main-toolbar .badge{margin-left:auto;border-radius:0;border-color:var(--c-border);background:var(--c-cream);color:var(--c-text);padding:2px 6px}

/* --- дерево элементов: заголовок и собственная мини-панель --- */
.left-panel{width:238px;background:var(--c-cream-2);border-right:1px solid var(--c-border)}
.panel-title{padding:3px 7px;font-size:11px;font-weight:700;color:var(--c-text);background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.panel-title .muted{color:#6d6a5c}
.structure{border-bottom:1px solid var(--c-border);background:var(--c-cream-2)}
.structure-head{padding:3px 7px;font-size:11px;font-weight:700;color:var(--c-text);background:var(--c-cream);border-bottom:1px solid var(--c-border);gap:5px}
.structure-head:hover{background:var(--c-cream-3)}
.structure-head:before{color:#6d6a5c}
.tree-tools{display:flex;align-items:center;border-top:0;border-bottom:1px solid var(--c-border);background:var(--c-cream-2);padding:2px 4px;gap:1px}
.tree-tools button{width:24px;height:23px;min-height:0;padding:0;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent;border-radius:0;background:none;font-size:11px;color:var(--c-text)}
.tree-tools button:hover{background:var(--c-cream-3);border-color:var(--c-border);color:var(--c-text)}
.tree-tools button:last-child{margin-left:auto;width:auto;padding:0 6px}
.tree-tools button:last-child:hover{background:var(--c-cream-3);border-color:var(--c-border);color:var(--c-text)}
.structure-body{background:#fff;border-top:0}
.tree{padding:2px 0}
.tree-node{gap:5px;padding:0 7px;min-height:19px;height:19px;border-radius:0;border:0;font-size:11px;color:var(--c-text);transition:none}
.tree-node:hover{background:var(--c-cream-3)}
.tree-node.selected{background:var(--c-select);color:#fff;box-shadow:none;font-weight:400}

/* --- палитра: список строк 21 px, без заливок --- */
.palette{padding:0 0 8px}
.palette-grid{display:block}
.palette-section{font-size:11px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--c-text);background:var(--c-cream);border-top:1px solid var(--c-soft);border-bottom:1px solid var(--c-border);padding:2px 7px}
.palette-item{width:100%;display:flex;align-items:center;gap:6px;height:21px;min-height:21px;padding:0 7px;border:0;border-radius:0;font-size:11px;font-weight:400;line-height:21px;color:var(--c-text);background:none;white-space:nowrap;overflow:hidden}
.palette-item:hover,.palette-item.allowed:hover{background:var(--c-cream-3);border:0}
.palette-item.allowed{background:none;border:0}
.palette-item.elsewhere{opacity:1;color:#6d6a5c}
.palette-item.blocked{opacity:1;color:#9a968a}
.palette-item.elsewhere:hover,.palette-item.blocked:hover{opacity:1;background:var(--c-cream-3)}
.no-flex-gap .palette-item{margin:0}

/* --- нижние закладки «Форма» / «Модуль» --- */
.bottom-tabs{display:flex;align-items:flex-end;gap:2px;height:24px;min-height:24px;padding:0 8px;background:var(--c-cream-2);border-top:1px solid var(--c-border)}
.bottom-tabs button{display:inline-flex;align-items:center;gap:5px;height:20px;min-height:0;padding:0 10px;border:1px solid var(--c-border);border-bottom:0;border-radius:4px 4px 0 0;background:var(--c-cream);color:var(--c-text);font-size:11px;font-weight:400}
.bottom-tabs button:hover{background:var(--c-cream-3)}
.bottom-tabs button.active{background:#fff;height:23px;font-weight:600}
.inspector-header{align-items:center;gap:5px}
.inspector-header .eyebrow{font-size:11px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--c-text)}
.inspector-header h2{font-size:11px;font-weight:700}
button:focus{outline:0}
button:focus-visible{outline:1px dotted var(--c-text);outline-offset:-3px}
.palette-section{text-transform:none}

/* --- холст: фон рабочей области и выделение как в Конфигураторе --- */
#design-pane{background-color:#efedde;background-image:none;padding:16px}
.host-1c #design-pane,.stage.split #design-pane{padding:10px}
.node:hover{border-color:#a9b3e0}
.node.selected{border-color:var(--c-select);box-shadow:0 0 0 1px var(--c-select)}
.node.selected:after{background:var(--c-select);border-radius:0;font-weight:400;top:-14px}

/* ============================================================
   Этап 2: два дока в верхней части, как в Конфигураторе —
   слева дерево элементов, правее реквизиты и команды,
   предпросмотр формы под ними во всю ширину.
   ============================================================ */
.top-docks{display:flex;flex:none;height:214px;min-height:96px;max-height:60vh;overflow:hidden;resize:vertical;border-bottom:1px solid var(--c-border);background:var(--c-cream-2)}
.structure{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;border-bottom:0;border-right:1px solid var(--c-border)}
.structure-body{flex:1 1 auto;height:auto;min-height:0;max-height:none;width:auto;min-width:0;max-width:none;resize:none;overflow:hidden}
.structure:not([open]){flex:0 0 auto}
.tree{height:100%;overflow:auto}

.data-dock{flex:0 0 404px;min-width:0;display:flex;flex-direction:column;background:var(--c-cream-2)}
.dock-head{display:flex;align-items:center;gap:8px;padding:3px 7px;font-size:11px;font-weight:700;color:var(--c-text);background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.dock-head .count{margin-left:auto;font-weight:400;color:#6d6a5c}
.dock-head .count.dirty{color:#9a5b0a;font-weight:600}
.dock-tools{display:flex;align-items:center;gap:1px;padding:2px 4px;border-bottom:1px solid var(--c-border);background:var(--c-cream-2)}
.dock-tools button{width:24px;height:23px;min-height:0;padding:0;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent;border-radius:0;background:none;font-size:11px;color:var(--c-text)}
.dock-tools button:hover:not(:disabled){background:var(--c-cream-3);border-color:var(--c-border)}
.dock-tools button:disabled{opacity:.35}
.dock-body{flex:1 1 auto;min-height:0;overflow:auto;background:#fff}
.dock-table{width:100%;border-collapse:collapse;font-size:11px;table-layout:fixed}
.dock-table th{position:sticky;top:0;z-index:1;text-align:left;font-weight:400;color:var(--c-text);background:var(--c-cream);border-bottom:1px solid var(--c-border);border-right:1px solid var(--c-soft);padding:2px 6px;height:20px;white-space:nowrap}
.dock-table tr.current td{background:#eef0fb}
.dock-table tr.current input{background:transparent}
.dock-table td{border-right:1px solid var(--c-soft);padding:0;height:21px}
.dock-table tr:hover td{background:var(--c-cream-3)}
.dock-table input{width:100%;height:21px;border:0;border-radius:0;background:transparent;padding:0 6px;font-size:11px;color:var(--c-text);outline:0}
.dock-table input:focus{background:#fff;box-shadow:inset 0 0 0 1px var(--c-select)}
.dock-empty td{color:#6d6a5c;padding:6px 8px;height:auto;border-right:0}
.dock-error{min-height:0;color:var(--danger);font-size:11px;padding:0 7px}
.dock-error:not(:empty){padding:3px 7px;background:#fdeeec;border-top:1px solid #f7d4cd}
.dock-tabs{display:flex;align-items:flex-end;gap:2px;height:23px;min-height:23px;padding:0 6px;background:var(--c-cream-2);border-top:1px solid var(--c-border)}
.dock-tabs button{display:inline-flex;align-items:center;gap:5px;height:19px;min-height:0;padding:0 9px;border:1px solid var(--c-border);border-top:0;border-radius:0 0 4px 4px;background:var(--c-cream);color:var(--c-text);font-size:11px;font-weight:400}
.dock-tabs button:hover{background:var(--c-cream-3)}
.dock-tabs button.active{background:#fff;height:22px;font-weight:600}

@media (max-width:1250px){.data-dock{flex-basis:340px}}
.host-1c .top-docks{height:168px}
.host-1c .data-dock{flex-basis:300px}
@media (max-width:1100px){.host-1c .data-dock{flex-basis:250px}}
@media (max-width:800px){.host-1c .top-docks{height:140px}.host-1c .data-dock{flex-basis:210px}}
.data-dock{flex-basis:446px}
.dock-table th:nth-child(1),.dock-table td:nth-child(1){width:31%}
.dock-table th:nth-child(2),.dock-table td:nth-child(2){width:39%}
.dock-table input{text-overflow:ellipsis}

/* --- три модуля в нижних закладках --- */
.code-toolbar{padding:2px 6px;gap:6px;border-bottom:1px solid var(--c-border);background:var(--c-cream-2);font-size:11px;flex-wrap:nowrap;min-height:27px}
.code-toolbar b{margin-right:auto;font-size:11px;font-weight:700;color:var(--c-text)}
.code-toolbar button{font-size:11px;padding:0 8px;height:21px;min-height:0;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream);color:var(--c-text)}
.code-toolbar button:hover:not(:disabled){background:var(--c-cream-3)}
.bottom-tabs{padding:0 8px;gap:1px}
.bottom-tabs button{padding:0 9px}
@media (max-width:900px){.bottom-tabs button{padding:0 6px;gap:3px}}

/* --- разделители панелей: взаимное растягивание мышью --- */
.splitter{flex:0 0 5px;background:var(--c-cream-2);position:relative;z-index:2;align-self:stretch}
.splitter.v{width:5px;min-width:5px;cursor:col-resize}
.splitter.h{height:5px;min-height:5px;width:100%;cursor:row-resize}
.splitter:hover{background:var(--c-cream-3)}
.splitter.v:after{content:"";position:absolute;top:50%;left:1px;width:3px;height:26px;margin-top:-13px;border-left:1px solid var(--c-soft);border-right:1px solid var(--c-soft)}
.splitter.h:after{content:"";position:absolute;left:50%;top:1px;height:3px;width:26px;margin-left:-13px;border-top:1px solid var(--c-soft);border-bottom:1px solid var(--c-soft)}
.top-docks{resize:none}
body.splitting-x,body.splitting-x *{cursor:col-resize !important;-webkit-user-select:none;user-select:none}
body.splitting-y,body.splitting-y *{cursor:row-resize !important;-webkit-user-select:none;user-select:none}
.structure{min-width:190px}

/* --- поле с кнопкой выбора и окно «Выбор команды», как в Конфигураторе --- */
.value-pick{display:flex;align-items:stretch;min-width:0}
.value-pick input{flex:1 1 auto;min-width:0}
.pick-btn{flex:0 0 17px;width:17px;height:18px;min-height:18px;padding:0;border:1px solid var(--c-border);border-left:0;border-radius:0;background:var(--c-combo);color:var(--c-text);font-size:11px;line-height:1}
.pick-btn:hover{background:var(--c-cream-3)}
.property:focus-within .pick-btn{border-color:var(--c-select)}

.pick-modal .modal{width:420px;border-radius:0;border:1px solid var(--c-border);box-shadow:0 12px 40px rgba(29,41,53,.3)}
.pick-modal .modal>header{padding:3px 4px 3px 8px;background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.pick-modal .modal h2{font-size:11px;font-weight:700;color:var(--c-text)}
.pick-modal .modal header button{width:18px;height:18px;border-radius:0;font-size:13px}
.pick-modal .modal #modal-content{padding:6px 7px 0}
.pick-modal .modal>footer{padding:7px;background:var(--c-cream-2);border-top:0;border-radius:0;gap:5px}
.pick-modal .modal>footer button{height:21px;min-height:0;padding:0 14px;font-size:11px;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream);color:var(--c-text);font-weight:400}
.pick-modal .modal>footer button:hover{background:var(--c-cream-3)}
.pick-modal .modal>footer .primary{font-weight:700}
.pick-modal .modal>footer .pick-new{margin-right:auto}
.pick-tabs{display:flex;gap:2px}
.pick-tabs button{display:inline-flex;align-items:center;gap:5px;height:20px;min-height:0;padding:0 9px;font-size:11px;font-weight:400;color:var(--c-text);border:1px solid var(--c-border);border-bottom:0;border-radius:4px 4px 0 0;background:var(--c-cream)}
.pick-tabs button.active{background:#fff;font-weight:600}
.pick-list{height:262px;overflow:auto;border:1px solid var(--c-border);background:#fff;margin-top:-1px}
.pick-row{display:flex;align-items:center;gap:6px;width:100%;height:21px;min-height:0;padding:0 7px;border:0;border-radius:0;background:none;text-align:left;font-size:11px;color:var(--c-text)}
.pick-row:hover{background:var(--c-cream-3)}
.pick-row.active{background:var(--c-select);color:#fff}
.pick-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pick-row em{font-style:normal;margin-left:auto;padding-left:10px;color:#6d6a5c;white-space:nowrap}
.pick-row.active em{color:#dbe0f4}
.pick-empty{padding:9px;font-size:11px;color:#6d6a5c;line-height:1.5}
.modal-overlay.pick-modal{background:rgba(24,38,53,.2)}

/* --- компактный диалог «Выбор цвета» по образцу палитры Конфигуратора 1С --- */
.color-modal .modal{width:535px;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream-2);box-shadow:0 12px 40px rgba(29,41,53,.3)}
.color-modal .modal>header{padding:3px 5px 3px 8px;background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.color-modal .modal h2{font:700 11px Arial,sans-serif;color:var(--c-text)}
.color-modal .modal header button{width:18px;height:18px;min-height:0;border-radius:0;font-size:13px;color:var(--c-text)}
.color-modal .modal #modal-content{padding:9px 10px 7px;overflow:auto}
.color-modal .modal>footer{padding:6px 8px;background:var(--c-cream-2);border-top:1px solid var(--c-soft);border-radius:0;gap:5px}
.color-modal .modal>footer button{height:21px;min-height:0;min-width:68px;padding:0 13px;border:1px solid var(--c-border);border-radius:2px;background:linear-gradient(#fffef7,#e9e4c6);font:11px Arial,sans-serif;color:var(--c-text);box-shadow:none}
.color-modal .modal>footer .primary{font-weight:700}
.modal-overlay.color-modal{padding:14px;background:rgba(24,38,53,.2)}
.color-editor{display:grid;grid-template-columns:minmax(230px,1fr) 174px;gap:14px;color:var(--c-text);font:11px Arial,sans-serif}
.color-section-title,.color-rgb-title{font-weight:700;margin:1px 0 5px}
.color-swatch-grid{display:grid;grid-template-columns:repeat(8,20px);grid-auto-rows:20px;gap:3px;padding:4px;background:#fff;border:1px solid var(--c-border);width:max-content;max-width:100%}
.color-swatch{position:relative;width:18px;height:18px;min-width:0;min-height:0;padding:0;border:1px solid #777;border-radius:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.color-swatch:hover{outline:1px solid #000;outline-offset:1px;z-index:1}
.color-swatch.selected{outline:2px solid #000;outline-offset:1px;z-index:2}
.color-swatch.selected:after{content:"";position:absolute;inset:2px;border:1px dotted #fff;pointer-events:none}
.color-swatch.empty{display:block;border:1px solid #c9c6b5;background:repeating-conic-gradient(#fff 0 25%,#eee 0 50%) 0/8px 8px;box-shadow:none}
.color-custom-title{margin-top:10px}
.color-add{display:block;margin-top:6px;height:21px;min-height:0;padding:0 7px;border:1px solid var(--c-border);border-radius:2px;background:linear-gradient(#fffef7,#e9e4c6);font:11px Arial,sans-serif;color:var(--c-text)}
.color-added-message{display:inline-block;margin-left:7px;color:#47724c;font-size:10px}
.color-editor-values{padding-left:9px;border-left:1px solid var(--c-soft)}
.color-samples{display:flex;justify-content:space-between;gap:8px;margin:0 0 9px;padding-bottom:7px;border-bottom:1px solid var(--c-soft)}
.color-samples label{display:flex;align-items:center;gap:6px;white-space:nowrap}
.color-sample{display:inline-block;width:36px;height:20px;border:1px solid #777;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.color-sample.empty{background:repeating-conic-gradient(#fff 0 25%,#eee 0 50%) 0/8px 8px}
.color-value-row{display:grid;grid-template-columns:68px 1fr;align-items:center;gap:5px;margin:4px 0}
.color-value-row input{width:100%;height:20px;min-height:20px;padding:1px 4px;border:1px solid var(--c-border);border-radius:0;background:#fff;font:11px Arial,sans-serif;color:var(--c-text)}
.color-value-row input:focus{outline:1px solid var(--c-select);outline-offset:-1px}
.color-rgb-title{margin:10px 0 5px;padding-top:6px;border-top:1px solid var(--c-soft)}
.color-expression{margin-top:10px;padding-top:5px;border-top:1px solid var(--c-soft)}
.color-expression summary{cursor:pointer;color:#514d3e}
.color-expression input{width:100%;height:19px;margin-top:5px;padding:1px 4px;border:1px solid var(--c-border);border-radius:0;background:#fff;font:10px Consolas,monospace}
@media(max-width:620px){.color-editor{grid-template-columns:1fr}.color-editor-values{padding:8px 0 0;border-left:0;border-top:1px solid var(--c-soft)}}

/* --- окно «Редактирование типа данных» --- */
.type-modal .modal{width:440px}
.border-modal .modal{width:440px}
.border-modal .modal #modal-content{padding:9px 10px 7px}
.font-modal .modal{width:590px;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream-2);box-shadow:0 12px 40px rgba(29,41,53,.3)}
.font-modal .modal>header{padding:3px 5px 3px 8px;background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.font-modal .modal h2{font:700 11px Arial,sans-serif;color:var(--c-text)}
.font-modal .modal header button{width:18px;height:18px;min-height:0;border-radius:0;font-size:13px;color:var(--c-text)}
.font-modal .modal #modal-content{padding:9px 10px 7px;overflow:auto}
.font-modal .modal>footer{padding:6px 8px;background:var(--c-cream-2);border-top:1px solid var(--c-soft);border-radius:0;gap:5px}
.font-modal .modal>footer button{height:21px;min-height:0;min-width:68px;padding:0 13px;border:1px solid var(--c-border);border-radius:2px;background:linear-gradient(#fffef7,#e9e4c6);font:11px Arial,sans-serif;color:var(--c-text);box-shadow:none}
.font-modal .modal>footer .primary{font-weight:700}
.modal-overlay.font-modal{padding:14px;background:rgba(24,38,53,.2)}
.font-editor{color:var(--c-text);font:11px Arial,sans-serif}
.font-editor-columns{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(76px,.55fr) minmax(150px,.9fr);gap:9px;align-items:stretch}
.font-editor-columns section,.font-effects{min-width:0;margin:0}
.font-family-column,.font-size-column{display:flex;flex-direction:column;gap:4px}
.font-family-column>label,.font-size-column>label{font-weight:700}
.font-family-column>input,.font-size-column>input,.font-scale-label input{box-sizing:border-box;width:100%;height:21px;min-height:21px;padding:1px 4px;border:1px solid var(--c-border);border-radius:0;background:#fff;font:11px Arial,sans-serif;color:var(--c-text)}
.font-list{box-sizing:border-box;width:100%;height:160px;min-height:160px;padding:1px;border:1px solid var(--c-border);border-radius:0;background:#fff;color:var(--c-text);font:11px Arial,sans-serif}
.font-list option{padding:1px 3px}
.font-list option:checked{background:var(--c-select);color:#fff}
.font-effects{display:flex;flex-direction:column;gap:7px;padding:7px 8px;border:1px solid var(--c-border)}
.font-effects legend,.font-sample legend{padding:0 4px;font-weight:700}
.font-effects>label:not(.font-scale-label){display:flex;align-items:center;gap:5px;white-space:nowrap}
.font-effects input[type=checkbox]{width:13px;height:13px;min-height:13px;margin:0;accent-color:var(--c-select)}
.font-scale-label{display:flex;flex-direction:column;gap:4px;margin-top:auto;padding-top:5px;border-top:1px solid var(--c-soft)}
.font-scale-label input{height:20px;min-height:20px}
.font-sample{margin:9px 0 0;padding:5px 8px 8px;border:1px solid var(--c-border)}
.font-sample>div{display:flex;min-height:48px;align-items:center;justify-content:center;overflow:auto;background:#fff;border:1px solid var(--c-soft);color:#000;text-align:center;line-height:1.3;white-space:nowrap}
.font-expression{margin-top:8px;padding-top:5px;border-top:1px solid var(--c-soft)}
.font-expression summary{cursor:pointer;color:#514d3e;font:11px Arial,sans-serif}
.font-expression input{width:100%;margin-top:5px;font:10px Consolas,monospace}
.font-note{margin:6px 0 0;color:#514d3e;font:10px/1.4 Arial,sans-serif}
@media(max-width:570px){.font-editor-columns{grid-template-columns:minmax(150px,1.4fr) minmax(65px,.6fr)}.font-effects{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.font-scale-label{margin-top:0;padding-top:0;border-top:0}}
.border-expression{margin-top:8px;padding-top:5px;border-top:1px solid var(--c-soft)}
.border-expression summary{cursor:pointer;color:#514d3e;font:11px Arial,sans-serif}
.border-expression input{width:100%;font:10px Consolas,monospace}
.type-list{height:232px;margin-top:0}
.type-list .pick-row.active .ic{filter:none}
.type-params{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 1px 2px;font-size:11px;color:var(--c-text)}
.type-params label{display:flex;align-items:center;gap:5px}
.type-params label.type-wide{flex:1 1 100%}
.type-params input[type=text],.type-params input[type=number],.type-params select{height:19px;min-height:19px;border:1px solid var(--c-border);border-radius:0;background:#fff;padding:0 4px;font-size:11px;color:var(--c-text)}
.type-params input[type=number]{width:68px}
.type-params label.type-wide input{flex:1 1 auto;min-width:0}
.type-params input[type=checkbox]{width:13px;height:13px;min-height:0;accent-color:var(--c-select);margin:0}
.type-params input:disabled{background:var(--c-cream-2);color:#8a8672}
.type-params .type-note{color:#6d6a5c}
.type-preview{margin:6px 0 0;padding:4px 6px;background:var(--c-cream-2);border:1px solid var(--c-soft);font:11px/1.4 Consolas,monospace;color:var(--c-text);overflow-wrap:anywhere}
.type-value{cursor:default;background:#fff}
.type-preview{display:flex;align-items:baseline;gap:8px;font:11px/1.4 inherit}
.type-preview b{font-weight:700}
.type-preview span{margin-left:auto;font:10px/1.4 Consolas,monospace;color:#6d6a5c;overflow-wrap:anywhere}

/* --- окно «Выбор картинки» --- */
.pic-modal .modal{width:520px}
.pic-body{display:flex;gap:8px;margin-top:-1px}
.pic-side{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:6px}
.pic-search{height:19px;min-height:19px;border:1px solid var(--c-border);border-radius:0;background:#fff;padding:0 5px;font-size:11px;color:var(--c-text)}
.pic-search:focus{outline:1px solid var(--c-select);outline-offset:-1px}
.pic-list{flex:1 1 auto;height:238px;margin-top:0}
.pic-thumb{width:16px;height:16px;flex:none;background:center/contain no-repeat}
.pic-thumb.pic-none{background:var(--c-cream-2);box-shadow:inset 0 0 0 1px var(--c-soft)}
.pic-preview{flex:0 0 168px;display:flex;flex-direction:column;border:1px solid var(--c-border);background:var(--c-cream-2)}
.pic-canvas{flex:1 1 auto;min-height:150px;display:flex;align-items:center;justify-content:center}
.pic-canvas img{max-width:128px;max-height:128px;image-rendering:pixelated}
.pic-caption{text-align:center;padding:3px;font-size:11px;color:#6d6a5c;border-top:1px solid var(--c-soft)}
.pic-hint{margin:0;font-size:11px;line-height:1.5;color:#3d3a2c}
.pic-side input[type=file]{font-size:11px;color:var(--c-text)}
.pic-side label.type-wide{display:flex;align-items:center;gap:6px;font-size:11px}
.pic-side label.type-wide input{flex:1 1 auto;min-width:0;height:19px;min-height:19px;border:1px solid var(--c-border);border-radius:0;background:#fff;padding:0 4px;font-size:11px;color:var(--c-text)}
.picture.has-image{display:inline-flex;align-items:center;justify-content:flex-start;padding:0;border:0;background:none;min-height:0;max-width:100%;height:100%}
.picture.has-image img{display:block;max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated}
.picture.has-image.sized-h,.picture.has-image.sized-w{justify-content:center;flex:none}
.picture.has-image.sized-h img{height:100%;width:auto;max-width:100%;max-height:none}
.picture.has-image.sized-w img{width:100%;height:auto;max-height:100%;max-width:none}
.picture.has-image.sized-h.sized-w img{width:100%;height:100%;object-fit:contain}
.value-pick .pick-thumb{width:18px;height:18px;min-height:18px;flex:none;background:#fff center/contain no-repeat;background-origin:content-box;padding:1px;border:1px solid var(--c-border);border-right:0;box-sizing:border-box}

/* --- вид флажка: тумблер и выключатель как в клиенте 1С --- */
.form-toggle{display:inline-flex;align-items:center;gap:8px;width:auto;line-height:1}
.form-toggle input{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.segmented{display:inline-flex;flex:none}
.segmented .seg{display:inline-flex;position:relative}
.segmented .seg input{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.segmented .seg span{display:inline-flex;align-items:center;justify-content:center;min-width:54px;height:22px;padding:0 10px;border:1px solid var(--x-btn-border);background:linear-gradient(var(--x-btn-a),var(--x-btn-b));font-size:12px;color:var(--x-text)}
.segmented .seg+.seg span{border-left:0}
.segmented .seg input:checked+span{background:#dcdcdc;box-shadow:inset 0 1px 2px rgba(0,0,0,.22)}
.form-toggle .switch{position:relative;width:30px;height:15px;flex:none;border:1px solid var(--x-fld-border);border-radius:8px;background:#ededed}
.form-toggle .switch:after{content:"";position:absolute;top:1px;left:1px;width:11px;height:11px;border-radius:50%;background:#fff;border:1px solid #b0b0b0}
.form-toggle input:checked+.switch{background:#5b9bd5;border-color:#3d7ab5}
.form-toggle input:checked+.switch:after{left:16px;border-color:#3d7ab5}
.form-toggle input:focus-visible+.switch{outline:1px dotted var(--c-text);outline-offset:1px}

/* Поведение элементов; палитра и компоновка редактора остаются прежними. */
.form-button.button-link{background:transparent;border-color:transparent;box-shadow:none;color:#0645ad;text-decoration:underline;padding:2px 3px}
.button-picture{width:16px;height:16px;object-fit:contain;vertical-align:middle;margin-right:4px}
.decoration-label{padding:5px 0;white-space:pre-wrap}
.field.caption-right{flex-direction:row-reverse}
.field.caption-bottom{flex-direction:column-reverse;align-items:stretch}
.field.top>label,.field.caption-bottom>label{width:auto}
.resource-name{display:flex;align-items:center;min-width:0}
.resource-name input{min-width:0;flex:1}
.resource-grip{cursor:grab;flex:none;width:14px;color:#817b63;text-align:center;user-select:none}

.preview-table input[type=checkbox]{width:13px;height:13px;margin:0;vertical-align:middle}
.preview-table tfoot td{background:var(--c-cream-2);border-top:1px solid var(--c-border)}
.stage.split .layout.horizontal:not(.wrap){flex-wrap:nowrap}
.dock-table tr[draggable=true]{cursor:grab}
.handler-caption{margin:0 0 8px;font-weight:600}
.handler-list{height:145px}
.event-property>span:first-child{overflow-wrap:anywhere}
.value-pick input{min-width:0}
.preview-mode .empty-drop{display:none}
.preview-mode .node-content input:disabled,.preview-mode .node-content select:disabled{color:#777;background:#eee}

/* Общая палитра свойств по образцу Конфигуратора. */
.right-panel{background:var(--c-cream);padding-bottom:5px}
.inspector-header{background:#b2b2b2;min-height:19px;padding:1px 5px;gap:3px;border-bottom:0;align-items:center}
.inspector-header .eyebrow{color:#000;letter-spacing:0;text-transform:none;font-size:11px}
.inspector-header h2{font-size:11px}
.inspector-header #selection-icon{display:none}
.inspector-tools{display:flex;gap:2px;height:23px;padding:2px 5px;flex-shrink:0}
.inspector-tools button,.inspector-search button{border:1px solid transparent;border-radius:0;background:none;color:#54513f;padding:0;width:20px;min-height:17px;font-size:12px}
.inspector-tools button:hover,.inspector-search button:hover{border-color:var(--c-border);background:var(--c-cream-3)}
.inspector-search{display:flex;margin:0 4px 2px;border:1px solid var(--c-border);height:20px;flex-shrink:0;background:#fff}
.inspector-search input{flex:1;min-width:0;width:0;border:0;border-radius:0;padding:0 3px;font:11px Arial,sans-serif;outline:none;background:#fff}
.inspector-search input::-webkit-search-cancel-button{display:none}
.inspector-search button{width:17px;background:var(--c-cream)}
.inspector{margin:0 4px;min-height:0;border:1px solid var(--c-border);border-radius:2px;background:#fff}
.inspector .property,.inspector .check-property{min-height:19px;padding:0;grid-template-columns:minmax(0,var(--c-label-col)) minmax(0,1fr)}
.inspector .property>span:first-child,.inspector .check-property>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:1px 4px 1px 10px;line-height:17px;text-indent:0}
.inspector .property>span.value-pick{padding:0}
.inspector .property input,.inspector .property select{height:18px;min-height:18px;padding-top:0;padding-bottom:0;border-radius:2px}
.inspector .property textarea{font-family:Arial,sans-serif;min-height:38px;border-radius:2px}
.inspector .check-property{text-indent:0}
.inspector .grid-properties{display:block}
.property-group{margin:0;padding:0}
.property-group-title{display:block;width:100%;border:0;background:#fff;text-align:left;padding:1px 2px;border-radius:0;min-height:18px;font:bold 11px Arial,sans-serif;color:#000}
.property-group-title:before{content:'▾';display:inline-block;width:9px;font-size:9px}
.property-group-title[aria-expanded=false]:before{content:'▸'}
.property-group-title:hover{background:var(--c-cream-2)}
.property-group-title:focus-visible{outline:1px dotted var(--c-border);outline-offset:-1px}
.inspector .property-group-body>details{border:0}
.inspector .property-group-body>details>summary{padding:2px 10px;background:#fff;color:#625c45}
.property-help{margin:4px 4px 0;padding:5px 7px;min-height:50px;max-height:80px;overflow:auto;flex-shrink:0;border:1px solid var(--c-border);border-radius:2px;background:#fcfaeb;font:11px/1.35 Arial,sans-serif;color:#3d3a2c}

/* Табличный редактор списка выбора. */
.choice-modal .modal{width:420px;background:var(--c-cream-2);border:1px solid var(--c-border);border-radius:0}
.choice-modal .modal>header{padding:2px 5px;background:#b2b2b2;border-bottom:1px solid var(--c-border)}
.choice-modal .modal h2{font-size:12px;color:#000}
.choice-modal .modal header button{width:19px;height:18px;font-size:15px;min-height:0;border-radius:0;color:#000}
.choice-modal .modal #modal-content{padding:4px 7px 0;overflow:auto}
.choice-modal .modal>footer{padding:6px 7px;background:var(--c-cream-2);gap:6px;border:0;border-radius:0}
.choice-modal .modal>footer button{min-width:76px;padding:2px 12px;font-size:11px;min-height:21px;border:1px solid var(--c-border);border-radius:3px;background:linear-gradient(#fffef7,#e9e4c6);color:#333;box-shadow:none}
.choice-tools{display:flex;gap:2px;height:24px;align-items:center}
.choice-tools button{height:21px;width:21px;min-height:0;padding:1px;border:1px solid transparent;border-radius:0;background:none;display:inline-flex;align-items:center;justify-content:center}
.choice-tools button:hover:not(:disabled){border-color:var(--c-border);background:var(--c-cream-3)}
.choice-grid{height:230px;overflow:auto;border:1px solid var(--c-border);background:white}
.choice-table{width:100%;border-collapse:collapse;table-layout:fixed;color:#000;font:11px Arial,sans-serif}
.choice-table th{height:20px;background:var(--c-cream);position:sticky;top:0;font-weight:400;text-align:left;padding:1px 4px;border-right:1px solid var(--c-soft);border-bottom:1px solid var(--c-border)}
.choice-table th:nth-child(1){width:27%}.choice-table th:nth-child(2){width:48%}.choice-table th:nth-child(3){width:25%}
.choice-table td{height:20px;padding:0;border-right:1px solid var(--c-soft);border-bottom:1px solid #eee}
.choice-table .choice-number{width:90px;padding:1px 4px;text-align:right}
.choice-table th.choice-number{text-align:left}
.choice-table input,.choice-table select{width:100%;height:20px;min-height:0;border:0;border-radius:0;background:transparent;font:11px Arial,sans-serif;padding:1px 4px;color:inherit}
.choice-type{font:11px Arial,sans-serif;padding:3px 0 6px;color:#555}
.choice-table .current{background:#dce6f1}
.choice-table input:focus{outline:1px solid var(--c-select);outline-offset:-1px;background:#fff;color:#000}
.choice-picture-cell{display:flex;align-items:center;gap:2px;height:20px;padding:0 2px}.choice-picture-cell img{width:16px;height:16px;object-fit:contain;flex:0 0 16px}.choice-picture-cell button{height:18px;min-height:0;min-width:0;flex:1;padding:0 2px;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream);font:11px Arial,sans-serif}.choice-option-picture{width:16px;height:16px;object-fit:contain;vertical-align:middle;margin-right:4px}
.property-color{display:inline-block;width:14px;height:14px;flex:0 0 14px;border:1px solid #aaa;margin-right:2px}
.field-visible-hint{font-size:11px;color:#666;white-space:pre-wrap}
.field-clear,.field-hint-button{flex:none;min-width:20px;min-height:20px;padding:0 3px}
.field input.no-spin::-webkit-inner-spin-button,.field input.no-spin::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.field .mark-incomplete:invalid{border-bottom:2px dotted #c00000}
.field .vertical-progress{writing-mode:vertical-rl;transform:rotate(180deg);width:20px;height:110px;flex:none}
.field .choices[style*="grid"],.field .segmented[style*="grid"]{gap:3px 8px}
.field .seg{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}
.field{position:relative}
.field-action{flex:none;min-width:20px;min-height:20px;padding:0 3px}
.field-choice-popup{position:absolute;z-index:10;top:100%;right:0;min-width:100px;max-height:200px;overflow:auto;background:#fff;border:1px solid var(--c-border);box-shadow:1px 2px 4px #0002}
.field-choice-popup button{display:block;width:100%;text-align:left;border:0;border-radius:0;padding:3px 8px;background:white;white-space:nowrap}
.field-choice-popup button:hover,.field-choice-popup button:focus{background:var(--c-select);color:white}
.field .field-track{appearance:none;-webkit-appearance:none;flex:0 1 256px;max-width:100%;height:18px;padding:0;border:0;background:transparent;accent-color:#278d70}
.field .field-track::-webkit-slider-runnable-track{height:2px;border:0;background:#b8b8b8}
.field .field-track::-moz-range-track{height:2px;border:0;background:#b8b8b8}
.field .field-track::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-6px;border:1px solid #929292;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 3px #2eaa80}
.field .field-track::-moz-range-thumb{width:12px;height:12px;border:1px solid #929292;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 3px #2eaa80}
.field .vertical-track{writing-mode:vertical-lr;-webkit-appearance:slider-vertical;min-width:22px;width:22px;height:130px;flex:none}
.field-picture{display:flex;align-items:center;justify-content:center;flex:0 1 auto;min-width:120px;max-width:100%;box-sizing:border-box;border:1px solid var(--x-fld-border);background:#fff;overflow:hidden}
.field-picture img{display:block;width:100%;height:100%;object-fit:contain}
.field-picture.zoomable{overflow:auto;cursor:zoom-in}.field-picture.zoomable img{flex:none}.field-picture span{color:#777;font:12px Arial,sans-serif}.field-input-picture{display:inline-flex;align-items:center;gap:4px;min-width:0}.field-input-picture img{width:16px;height:16px;object-fit:contain}.copy-disabled{user-select:none;-webkit-user-select:none}

/* Поведение как в Конфигураторе (25.09.2026) */
/* Выделение на макете — только синяя рамка вокруг элемента вместе с подписью, без ярлычка с именем. */
.node.selected:after{content:none;display:none}
/* Пустая полоса автоматической командной панели формы под заголовком окна. */
.form-commandbar{height:24px;flex:none}
.stage.split .form-commandbar{height:20px}
/* Заглушки переключателя без списка выбора: «<Значение 1>» … */
.placeholder-choices span{color:#4d4d4d}
/* Диалог «Тип элемента». */
.elem-type-modal .modal{width:300px}
.elem-type-modal .pick-list{height:auto;max-height:230px;margin-top:0}
.elem-type-modal .pick-row{height:18px}
/* Контекстное меню дерева и макета. */
.context-menu{position:fixed;z-index:1000;min-width:230px;padding:2px;background:#fff;border:1px solid var(--c-border);box-shadow:2px 3px 8px rgba(0,0,0,.22);font-size:11px;color:var(--c-text);user-select:none;-webkit-user-select:none}
.context-menu hr{height:0;margin:2px 2px 2px 26px;border:0;border-top:1px solid var(--c-soft)}
.cm-item{position:relative;display:flex;align-items:center;gap:6px;width:100%;height:20px;min-height:0;padding:0 8px 0 4px;border:0;border-radius:0;background:none;text-align:left;font:inherit;color:inherit;cursor:default}
.cm-item .ic{flex:0 0 16px;width:16px;height:16px}
.cm-item span{flex:1 1 auto;white-space:nowrap}
.cm-item kbd{flex:none;min-width:14px;padding-left:18px;font:inherit;color:#555;text-align:right}
.cm-item:hover:not([disabled]),.cm-has-sub:focus-within{background:var(--c-select);color:#fff}
.cm-item:hover:not([disabled]) kbd{color:#fff}
.cm-item[disabled]{color:#a0a0a0}
.cm-item[disabled] .ic{opacity:.45}
.cm-submenu{display:none;position:absolute;left:100%;top:-3px;min-width:180px;max-height:60vh;overflow:auto;padding:2px;background:#fff;border:1px solid var(--c-border);box-shadow:2px 3px 8px rgba(0,0,0,.22);color:var(--c-text)}
.context-menu.flip-sub .cm-submenu{left:auto;right:100%}
.cm-has-sub:hover>.cm-submenu,.cm-has-sub:focus-within>.cm-submenu{display:block}
.cm-submenu .cm-item{color:var(--c-text)}
.cm-submenu .cm-item:hover{color:#fff}

/* ===== Палитра свойств пиксель в пиксель с Конфигуратором 8.5.1 (Arial 8 pt, 96 dpi) =====
   Замеры сняты с полноразмерных снимков экрана Конфигуратора: строка с полем 20 px (поле 19 px и зазор 1 px),
   строка с флажком или ссылкой 18 px, заголовок категории 18 px с чертой снизу, отступ имени 11 px. */
.right-panel{font:11px Arial,"Liberation Sans",sans-serif;background:#f5f2dd;padding:0 1px 5px 3px;box-sizing:border-box}
.right-panel .inspector-header{height:18px;min-height:18px;margin:0 -1px 0 -3px;padding:0 4px;background:#b2b2b2;gap:4px;align-items:center}
.right-panel .inspector-header .eyebrow,.right-panel .inspector-header h2{font:bold 11px/18px Arial,"Liberation Sans",sans-serif;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.right-panel .inspector-tools{height:24px;min-height:24px;padding:1px 0;margin:0;gap:1px;align-items:center;box-sizing:border-box}
.right-panel .inspector-tools button{width:22px;height:22px;min-height:22px;color:#54513f}
.right-panel .inspector-search{height:19px;margin:0;border:1px solid #b3ac86;border-radius:3px;overflow:hidden;box-sizing:border-box;background:#fff}
.right-panel .inspector-search input{height:17px;padding:0 2px;font:11px/17px Arial,"Liberation Sans",sans-serif;color:#000}
.right-panel .inspector-search input::placeholder{color:#a0a0a0;opacity:1}
.right-panel .inspector-search button{width:15px;min-height:17px;height:17px;border:0;border-left:1px solid #d3cca9;border-radius:0;background:linear-gradient(#f9f8f2,#eae6cd);color:#664c00;font:bold 12px/17px Arial,sans-serif}
#inspector.inspector{margin:1px 0 0;border:0;border-top:1px solid #b3ac86;border-radius:0;background:#fff;font:11px Arial,"Liberation Sans",sans-serif;color:#000;box-shadow:inset 0 1px 0 #fff}
#inspector::-webkit-scrollbar{width:16px}
#inspector::-webkit-scrollbar-track{background:#faf9f3;border-left:1px solid #bdb79b}
#inspector::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#f8f7ee,#f1edcf 55%,#e0d9b7);border:1px solid #bdb79b;border-radius:0;background-clip:border-box}
#inspector::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,#fbfaf3,#f4f1dd 55%,#e6e0c2)}
/* Категория: «▾ Основные:» полужирным, черта #dcd9c4 от 23 px до края полей. */
#inspector .property-group{margin:0;padding:0;border:0}
#inspector .property-group-title{position:relative;display:block;width:100%;height:18px;min-height:18px;margin:0;padding:0 0 0 11px;border:0;border-radius:0;background:#fff;font:bold 11px/17px Arial,"Liberation Sans",sans-serif;color:#000;text-align:left;box-sizing:border-box}
#inspector .property-group-title:before{content:'';position:absolute;left:2px;top:7px;width:0;height:0;border-style:solid;border-width:4px 3.5px 0 3.5px;border-color:#181818 transparent transparent transparent}
#inspector .property-group-title[aria-expanded=false]:before{left:4px;top:5px;border-width:3.5px 0 3.5px 4px;border-color:transparent transparent transparent #181818}
#inspector .property-group-title:after{content:'';position:absolute;left:11px;right:4px;bottom:0;height:1px;background:#dcd9c4}
#inspector .property-group-title:hover{background:#fff}
#inspector .property-group-body{padding:0;margin:0}
/* Строка свойства: имя слева, колонка по самому длинному имени блока. */
#inspector .property,#inspector .check-property{display:grid;grid-template-columns:var(--p1c-label,160px) minmax(0,1fr);align-items:center;min-height:0;height:20px;margin:0;padding:0 2px 0 0;border:0;background:#fff;font:11px Arial,"Liberation Sans",sans-serif;color:#000;box-sizing:border-box;text-indent:0}
#inspector .check-property{height:18px}
#inspector .property>span:first-child,#inspector .check-property>span:first-child{display:block;padding:0 0 0 11px;margin:0;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:clip;color:#000;font:inherit}
#inspector .property:focus-within>span:first-child,#inspector .check-property:focus-within>span:first-child{background:#536ac2;color:#fff}
#inspector .p1c-hidden{display:none!important}
#inspector .p1c-block{margin-top:13px;position:relative;overflow:visible}
#inspector .p1c-block:before{content:'';position:absolute;left:11px;right:4px;top:-7px;height:1px;background:#dcd9c4}
/* Поля значений: рамка #b3ac86, скругление 3 px, высота 19 px. */
#inspector .property>input,#inspector .property>select,#inspector .property>.value-pick{height:19px;min-height:19px;margin:0 0 1px;box-sizing:border-box}
#inspector .property input:not([type=checkbox]),#inspector .property select{height:19px;min-height:19px;padding:0 2px;border:1px solid #b3ac86;border-radius:3px;background-color:#fff;font:11px Arial,"Liberation Sans",sans-serif;color:#000;box-shadow:none;outline:none}
#inspector .property input::placeholder{color:#000;opacity:1}
#inspector .property select{-webkit-appearance:none;appearance:none;padding-right:17px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='3'%3E%3Cpath d='M0 0h6L3 3z' fill='%23664c00'/%3E%3C/svg%3E"),linear-gradient(#d3cca9,#d3cca9),linear-gradient(#f9f8f2,#eae6cd);background-repeat:no-repeat;background-position:right 5px center,right 14px top,right top;background-size:6px 3px,1px 100%,14px 100%}
#inspector .property .value-pick{display:flex;align-items:stretch;border:1px solid #b3ac86;border-radius:3px;overflow:hidden;background:#fff;padding:0}
#inspector .property .value-pick>input{flex:1 1 auto;min-width:0;height:17px;min-height:17px;border:0;border-radius:0;padding:0 2px}
#inspector .property .value-pick .pick-btn{flex:0 0 15px;width:15px;height:17px;min-height:17px;padding:0;margin:0;border:0;border-left:1px solid #d3cca9;border-radius:0;background:linear-gradient(#f9f8f2,#eae6cd);color:#664c00;font:bold 11px/15px Arial,sans-serif;text-align:center}
#inspector .property .value-pick .pick-btn[data-action^="clear"]{font:bold 12px/16px Arial,sans-serif}
#inspector .property .value-pick .property-color{flex:0 0 12px;width:12px;height:12px;margin:2px 0 0 2px;border:1px solid #808080;box-sizing:border-box}
#inspector .property:focus-within input:not([type=checkbox]),#inspector .property:focus-within select,#inspector .property:focus-within .value-pick{border-color:#b3ac86}
/* Флажок 13×13: рамка #99926b, скругление 2 px, галочка #333. */
#inspector .check-property input[type=checkbox],#inspector .property input[type=checkbox]{-webkit-appearance:none;appearance:none;width:13px;height:13px;min-height:13px;margin:0;padding:0;border:1px solid #99926b;border-radius:2px;background:#fff center/9px 7px no-repeat;box-sizing:border-box;justify-self:start}
#inspector .check-property input[type=checkbox]:checked,#inspector .property input[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='7'%3E%3Cpath d='M1 3.2l2.3 2.3L8 1' fill='none' stroke='%23333' stroke-width='1.6'/%3E%3C/svg%3E")}
/* Многострочные Заголовок и Подсказка — поле 38 px, имя прижато к верху. */
#inspector .p1c-multi{height:auto;align-items:start}
#inspector .p1c-multi>span:first-child{line-height:18px}
#inspector .p1c-multi textarea{height:38px;min-height:38px;margin:0 0 1px;padding:1px 2px;border:1px solid #b3ac86;border-radius:3px;resize:none;font:11px Arial,"Liberation Sans",sans-serif;color:#000;box-sizing:border-box}
/* Ширина и Высота в одной строке, как в Конфигураторе. */
#inspector .p1c-pair{display:flex;align-items:center;height:20px;padding:0 2px 0 11px;gap:0}
#inspector .p1c-pair label{display:flex;align-items:center;gap:6px;flex:1 1 50%;min-width:0;height:20px;font:11px Arial,"Liberation Sans",sans-serif;color:#000}
#inspector .p1c-pair label+label{justify-content:flex-end;padding-right:40%}
#inspector .p1c-pair input{width:48px;height:19px;padding:0 1px 0 2px;border:1px solid #b3ac86;border-radius:3px;font:11px Arial,"Liberation Sans",sans-serif;text-align:right;box-sizing:border-box}
/* Нижняя панель описания. */
.right-panel .property-help{margin:4px 0 0;padding:1px 3px;min-height:36px;border:1px solid #b3ac86;border-radius:0;background:#fff;font:11px/13px Arial,"Liberation Sans",sans-serif;color:#000}
#inspector .p1c-pair{display:flex;align-items:center;height:20px;padding:0 2px 0 0;gap:0}
#inspector .p1c-pair>.property{display:flex;align-items:center;gap:5px;height:20px;flex:0 0 50%;padding:0;grid-template-columns:none}
#inspector .p1c-pair>.property>span:first-child{flex:none;background:none!important;color:#000!important}
#inspector .p1c-pair>.property>input{width:66px;flex:none;text-align:right;padding:0 1px 0 2px}
#inspector .p1c-pair>.property+.property>span:first-child{padding-left:0}
#inspector .p1c-link .p1c-open{justify-self:start;height:16px;min-height:0;padding:0;margin:0;border:0;background:none;font:11px Arial,"Liberation Sans",sans-serif;color:#000;text-decoration:underline;cursor:pointer}
#inspector .property input.p1c-num{text-align:right;padding-right:15px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='17'%3E%3Crect width='13' height='17' fill='%23f3f0e2'/%3E%3Cpath d='M0 0v17M0 8.5h13' stroke='%23d3cca9'/%3E%3Cpath d='M4 6l2.5-3L9 6zM4 11l2.5 3L9 11z' fill='%23664c00'/%3E%3C/svg%3E") right top/13px 100% no-repeat}
#inspector .event-property .value-pick .pick-btn[data-action="pick-handler"]{font-size:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='3'%3E%3Cpath d='M0 0h6L3 3z' fill='%23664c00'/%3E%3C/svg%3E") center/6px 3px no-repeat,linear-gradient(#f9f8f2,#eae6cd)}
#inspector .property-group-body>details{margin-top:6px}
#inspector .p1c-pair label+label{justify-content:flex-start;padding-right:0}
#inspector input.p1c-num::-webkit-inner-spin-button,#inspector input.p1c-num::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#inspector input.p1c-num{-moz-appearance:textfield}
#inspector input.p1c-num::placeholder{color:#000}

/* ===== Макет формы пиксель в пиксель с Конфигуратором 8.5 («Такси», Arial 10 pt = 13 px) =====
   Окно: рамка 1 px #000 и тень 3 px, заголовок 23 px #bfcddb, полоса командной панели, отступы 12/20 px.
   Строка поля 25 px, между элементами 6 px, подписи #4d4d4d, начало значений выровнено по заголовкам. */
#design-pane{padding:4px;background:#fff}
#form-window.form-window{display:inline-block;vertical-align:top;width:max-content;min-width:250px;max-width:none;margin:0;border:1px solid #000;border-radius:0;box-shadow:1px 1px 0 #3f3f3f,2px 2px 0 #555555,3px 3px 0 #7f7f7f;background:#fff}
#form-window .form-titlebar{height:23px;min-height:23px;padding:0 8px;border:0;background:#bfcddb;font:bold 12px Arial,"Liberation Sans",sans-serif;color:#262626}
#form-window .form-commandbar{height:24px}
#canvas.canvas{min-height:40px;padding:12px 18px 5px 10px;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d}
#canvas .layout{gap:2px}
#canvas .node{padding:1px;border:1px solid transparent}
#canvas .node:hover{border-color:#9cc8f5}
#canvas .node.selected{border-color:#1e90ff;box-shadow:0 0 0 1px #1e90ff}
#canvas .field{min-height:25px;gap:4px;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d}
#canvas .field>label{font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d;line-height:15px}
#canvas .field input:not([type=checkbox]):not([type=radio]):not([type=range]),#canvas .field select,#canvas .field textarea{height:25px;min-height:25px;padding:0 3px;border:1px solid #a0a0a0;border-radius:2px;background-color:#fff;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d;box-sizing:border-box;box-shadow:none}
#canvas .field textarea{height:auto;min-height:50px;padding:3px}
#canvas .decoration-label{font:13px/25px Arial,"Liberation Sans",sans-serif;color:#4d4d4d}
#canvas .field-value{font:13px/25px Arial,"Liberation Sans",sans-serif;color:#4d4d4d}
/* Кнопка: 26 px, рамка #b2b2b2/#9c9c9c, скругление 2 px, градиент #fff→#ececec, тень 1 px #d2d2d2. */
#canvas .form-button{height:26px;min-height:26px;padding:0 13px;margin:0 0 1px;border:1px solid #c6c6c6;border-top-color:#b2b2b2;border-bottom-color:#9c9c9c;border-radius:2px;background:linear-gradient(#fff 0,#fff 50%,#ececec 100%);box-shadow:0 1px 0 #d2d2d2;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d;line-height:24px}
#canvas .form-button:hover{background:linear-gradient(#fff 0,#fff 50%,#ececec 100%);border-color:#c6c6c6;border-top-color:#b2b2b2;border-bottom-color:#9c9c9c}
#canvas .form-button.button-link{border-color:transparent;background:none;box-shadow:none;color:#1c55ae}
/* Переключатель: круг 15 px, рамка #a0a0a0, отметка 5 px #009646; между вариантами 12 px. */
#canvas .field .choices{gap:12px;align-items:center;min-height:25px}
#canvas .choices label{gap:6px;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d}
#canvas .field input[type=radio]{-webkit-appearance:none;appearance:none;width:15px;height:15px;margin:0;border:1px solid #a0a0a0;border-radius:50%;background:#fff;box-sizing:border-box;flex:none}
#canvas .field input[type=radio]:checked{background:radial-gradient(circle,#009646 0,#009646 2.5px,#fff 3px)}
#canvas .field input[type=radio]:disabled{opacity:1}
/* Выключатель: круг 19 px и дорожка #b1b1b1 13 px, всего 34 px. */
#canvas .form-toggle .switch{width:34px;height:19px;border:0;border-radius:0;background:none}
#canvas .form-toggle .switch:before{content:'';position:absolute;left:9px;right:0;top:3px;height:13px;border-radius:0 7px 7px 0;background:#b1b1b1}
#canvas .form-toggle .switch:after{top:0;left:0;width:19px;height:19px;border:1px solid #a6aaab;border-radius:50%;background:#fff;box-sizing:border-box}
#canvas .form-toggle input:checked+.switch:before{left:0;right:9px;border-radius:7px 0 0 7px;background:#5d9f3e}
#canvas .form-toggle input:checked+.switch:after{left:15px;border-color:#a6aaab}
#canvas .field input[type=checkbox]{width:15px;height:15px}
#form-window.form-window{height:auto;flex:none;align-self:flex-start}
#canvas .field input[type=radio]{flex:0 0 15px;min-width:15px;max-width:15px}
#form-window.form-window{min-height:0}
#canvas .layout,#canvas.canvas{gap:3px}
#canvas .form-button{margin-top:3px}
#canvas .form-toggle{position:relative;top:1px}
#canvas .layout,#canvas.canvas{gap:1px}
#canvas.canvas>.node+.node{margin-top:1px}
#canvas .form-button{margin-top:2px}
#canvas.canvas{padding-right:17px;padding-bottom:7px}
#canvas .picture.has-image img{position:relative;top:1px}
#canvas .choices label{gap:7px}
#tree .ic-tree-field{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAqUlEQVR4nGP8//8/AyWAiSLdg8IAFhTehMb/DBdOwbnvXr2Csz9//ABhGFowyE9ZzAgTZ0QOxHdepv+FolwYGBgYGP79+cPw7/cfhr+/fjP8/fGL4c+PXwx/f/xguDJrJYPty/9wA1Bc8PnjBwbu958Yfn39zvDr81eG35+/Mvz68o3h95fvDL+/fWf4+/M3AS8YWjCcapmG189Cbr4ofMbRdDBqAAMDAwBVD0kbHqrOgwAAAABJRU5ErkJggg==) center/16px 16px no-repeat!important}
#tree .ic-tree-decor{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACGUlEQVR4nJ2T0UtTcRTHP7/fvXduqW0WQyscUlJWrqB86kWnMyuTiz1UD/4j/Qv9Gb1GhnohKCOIikqzHmS0IDI1FC3J6djWvfd3elHbLBL8wnk7nw/nHDhKRAB4Mz0r0/klUIogMAgCIoShQWH45fsMdadJfsqRc12OPxgldWNY2QCFQkEevZvDjx5BRFgvlHAshTFCaAyhMXSdTO7Apyce8rGlnRRgA2itaYjVEdbHEBEsrblzM41jKRzHVsVSWYpPHpNzXdKex+HBQeXd96S7qxMNEIYhhxod2luiNCeiNEYC7o09Z3H5Oytr63/BAPPflmF7AhFh3SiKFUWoNRJPUCo7fF3zOfP+bQ3s+6GIpdnOlgASUU1jwgbAUjFS8QSts6/JuS6dnsfBgSvMzOal/UQbjji1Atu2aFJlmvUGltYcTTYRmfoDN/QPUKwEtLamqPgGx6JWADD24i5lWeHWxRHa5k7twLHsZfJfFng59QGA6wP91Ef/ITjgBJzv6OZSZAue8Ij09vNzs0LsYBN9vRkUUPIDhF0CEWFoeIQL80lyrsvZCQ87kyX3eYFXUzNbrQoQsn19hMbsvoFdA1s9WX5sVIjUx+npyVCdIDSYcJdgc3JyZ+f41UECA5G6OpqrwLBq7ljVEZWI8NS2JT06ynLHOfJzi8wvrbJXjiUT3L6WUTwDWR0fFxFhP6W2v3G/0Xu3/D+/AZS3HkBTPnt7AAAAAElFTkSuQmCC) center/16px 16px no-repeat!important}
#tree .ic-tree-cmdpanel{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA9UlEQVR4nO3SMUvDYBDG8X9KFkHp7FZHP0MIIX6DTO4uXdzjIJnyTdyEkK3ZDEGC7g2duolWzIsHQlAS5FyaYqDgUBfBF254f9w9w3GWqrLLG+00/RsBdlVVWhTFAH3fJ8/zgTmOQ1mWm3/XdbiuC3Ecq6ryvbZZFEVb+0Zd1wGwfGn0+naufToAVxcql6cD+2hnurg5U4CmabDbtsUYo7O7JQ+rZ06OD7W3A3nj6X7OpzFa1zXGGH1dpMhKMGuz67pGRPAmezA5QkTo7dGbgjdFRAAQEd7H5+yP2ZiVZZkmSTJYWBAEpGn6o4VhiPX3D+k/AL4A4MG3VKwWqfMAAAAASUVORK5CYII=) center/16px 16px no-repeat!important}
#tree .ic-tree-button{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABk0lEQVR4nOWRzYtSURiHn+P1414dvDBhBBUo2MembQ64KINgXCVtEsJgWvgviAMyxSzEzfwBrkpo2kotC7QmAgmCIAjUNMoypiAI/LraPS3ueB2dCvf94MA573ve57zv74jvnZZsvXnJjw9vcak+lpEvcJrghTWOB88JUXt0TwZ0H6FweKliCbxv1PnYanJlY1M4et8+WcWqH7yr/14uDaH6CZ85S/v1MwAcNlpbpbZXJZuKk03Fqe1VweMnm4pjCqeVu33dvm7gAsBpR0Y/KRcL3Ck9QXF7ySWjROI3AHj1/CnlYoG7D6pgDgAwEQsdHMijenF6tLlYuVggV6rgdrvt2ARlEWARJyaMh/05QCKdYftWDMMwDpkpFkZAkkhnyCWjdhFjq92Ll64CsHXzMvn7j+fgzvGwZ+0UD5HYOpHY+iz7yyD/sAIwy5ljpARjYloARdPpfO5y6uSiG3/WaNCn2aij6ceswb+238kXuzvsd7/Yzk5NkofOUwkk6orOtXSWE6HzQkgpl3v6Lzryjf8h4Dc9BX7np+QcHgAAAABJRU5ErkJggg==) center/16px 16px no-repeat!important}
#tree .ic-tree-form{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABd0lEQVR4nLWRzStEYRTGf3dcY+bOkI9bEqOYmCIrd8XC3j/AbkQ2Uv4DZWcp+dgoK4thY8VCkQ0LH2VKjXykRmgi35om9x6LMXcugxkLT731nvM+5znnPK8iIsxEVmRp/5qXZIpC0ddRz1BPt6ICxM7i6G936GrB9cTOlPRFRIis74mI8JczOjEnIoLds396VVIlZZR4/bg1/4+dHxOXWCdbNNfpALgyD6/nUYaNcgZbVS4Odwg3JAk3JHPuXRVPiENQEREWN/ZlLf6GWlqVd/fHxCXm8RahgM7YyIBirzDZa3D7Usgv1FLl62R8dh4g64EAR9FdHm4ThEIhm+6vCfJ8dWrHqsdHpa8+GzsFGtuMnH4WoNUEP+WcHtgCpmVxsL3Jw801hpEWkvIAAMp9PFtR7MXUvpnAMi0CLe0EgGQmmfrwRKtGcU5lWrkCmsdNU62Oy8l0wHTM7S36soK/GKYWlr+v/AEtTWlfFBHJQ/0drvyUfxZ4B4tFotrR26vCAAAAAElFTkSuQmCC) center/16px 16px no-repeat!important}
/* Дерево элементов: Arial 8 pt, строка 19 px, выделяется только текст (#536ac2), как в Конфигураторе. */
#tree .tree-node{height:19px;min-height:19px;font:11px Arial,"Liberation Sans",sans-serif;color:#000;background:none;gap:5px}
#tree .tree-node:hover{background:none}
#tree .tree-node>span:last-child{padding:0 2px;margin-left:-2px;line-height:19px}
#tree .tree-node.selected{background:none;color:#000}
#tree .tree-node.selected>span:last-child{background:#536ac2;color:#fff}
#tree .tree-node:focus{outline:none}
#tree .tree-node:focus>span:last-child{outline:1px dotted #000;outline-offset:-1px}
/* Старый WebKit встроенного браузера 1С: max-content с префиксом, отступы без flex-gap. */
#form-window.form-window{width:-webkit-max-content;width:max-content}
.no-flex-gap #canvas .layout:not(.horizontal)>.node+.node{margin-top:1px}
.no-flex-gap #canvas .choices>label+label{margin-left:12px}
.no-flex-gap #canvas .choices label input{margin-right:7px}
.no-flex-gap #tree .tree-icon{margin-right:5px}
.no-flex-gap #inspector .p1c-pair>.property>span:first-child{margin-right:5px}

/* ===== Закладки внизу панелей, как в Конфигураторе: висят от верхней черты, скругление снизу 4 px.
   Полоса 23 px (черта #b3ac86, закладка 21 px, нижняя линия #e3e3e3), между закладками 6 px, отступ 4 px.
   Неактивная #ebe6cc с рамкой #ccc6ad; активная сливается с панелью сверху (#fcfaeb), снизу акцент 2 px #fadfa3. */
.bottom-tabs,.dock-tabs{display:flex;align-items:flex-start;gap:6px;height:23px;min-height:23px;padding:0 4px;margin:0;background:#fcfaeb;border:0;border-top:1px solid #b3ac86;border-bottom:1px solid #e3e3e3;box-sizing:border-box}
.bottom-tabs button,.dock-tabs button{display:inline-flex;align-items:center;gap:2px;height:21px;min-height:0;margin:0;padding:0 9px 0 10px;border:1px solid #ccc6ad;border-top:0;border-radius:0 0 4px 4px;background:#ebe6cc;color:#000;font:11px Arial,"Liberation Sans",sans-serif;font-weight:400;box-shadow:none;box-sizing:border-box}
.bottom-tabs button:hover,.dock-tabs button:hover{background:#f1edd5}
.bottom-tabs button.active,.dock-tabs button.active{height:22px;margin-top:-1px;border-color:#b3ac86;background:#fcfaeb;box-shadow:inset 0 -2px 0 #fadfa3;font-weight:400}
.no-flex-gap .bottom-tabs button+button,.no-flex-gap .dock-tabs button+button{margin-left:6px}

/* ===== Обычная группа «Такси» (снимки Конфигуратора 8.5) ===== */
#canvas .g1c{position:relative;background:transparent}
#canvas .g1c-title{font:16px/18px Arial,"Liberation Sans",sans-serif;color:#009646;margin:0 0 1px;white-space:nowrap}
#canvas .g1c-title.small{font-size:13px;line-height:16px}
#canvas .g1c-title.link{color:#1c55ae;text-decoration:underline}
#canvas .g1c-arrow{display:inline-block;width:0;height:0;margin:0 5px 2px 1px;border-style:solid;border-width:5px 4px 0 4px;border-color:currentColor transparent transparent transparent;vertical-align:middle}
#canvas .g1c.disp-ОбычноеВыделение{margin-top:8px}
#canvas .g1c.disp-СильноеВыделение>.g1c-body{position:relative;padding-left:10px}
#canvas .g1c.disp-СильноеВыделение>.g1c-body:before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:#009646}
#canvas .g1c-popup{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px 0 13px;margin:2px 0 4px;border:1px solid #c6c6c6;border-top-color:#b2b2b2;border-bottom-color:#9c9c9c;border-radius:2px;background:linear-gradient(#fff 0,#fff 50%,#ececec 100%);box-shadow:0 1px 0 #d2d2d2;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d;box-sizing:border-box}
#canvas .g1c-popup i{width:0;height:0;border-style:solid;border-width:4px 3.5px 0 3.5px;border-color:#4d4d4d transparent transparent transparent}
#canvas .g1c.beh-Всплывающая>.g1c-body{opacity:.55}
#canvas .g1c.disp-ОбычноеВыделение{margin-top:0}
#canvas .g1c-title{margin-bottom:0}
#canvas .g1c-body>.layout{margin:-2px 0}
/* Вставленная форма: группа без отображения не съедает отступы строк полей — шаг строк как у полей вне группы
   (ФормаГрупповогоРедактирования…: строки «флажок + поле» в группах — 34 px, как у простых полей). */
.imported-form #canvas .g1c.disp-Нет>.g1c-body>.layout{margin:0}
/* ОтображениеСтраниц */
#canvas .tabs-1c.pages-ЗакладкиСнизу>.tabs-row{border-bottom:0;border-top:1px solid var(--x-tab-line);margin:6px 0 0}
#canvas .tabs-1c.pages-ЗакладкиСнизу .tab-label.active{top:-1px}
#canvas .tabs-1c.pages-ЗакладкиСлева,#canvas .tabs-1c.pages-ЗакладкиСправа{display:flex;align-items:flex-start;gap:6px}
#canvas .tabs-1c.pages-ЗакладкиСлева>.tabs-row,#canvas .tabs-1c.pages-ЗакладкиСправа>.tabs-row{flex-direction:column;border-bottom:0;margin:0}
#canvas .tabs-1c.pages-ЗакладкиСлева>.tabs-row{border-right:1px solid var(--x-tab-line)}
#canvas .tabs-1c.pages-ЗакладкиСправа>.tabs-row{border-left:1px solid var(--x-tab-line)}
#canvas .tabs-1c.pages-ЗакладкиСлева .tab-label.active,#canvas .tabs-1c.pages-ЗакладкиСправа .tab-label.active{top:0}
#canvas .tabs-1c>.tabs-body{flex:1;min-width:0}
/* ===== Макет формы 1С (Ctrl+V из Конфигуратора): только чтение ===== */
.tree-node.locked-1c .tree-icon{position:relative}
.tree-node.locked-1c .tree-icon::after{content:"";position:absolute;right:-3px;bottom:-1px;width:7px;height:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='8'%3E%3Cpath d='M1.5 3.5V2.5a2 2 0 0 1 4 0v1' fill='none' stroke='%23705a10'/%3E%3Crect x='.5' y='3.5' width='6' height='4' fill='%23f0cc4a' stroke='%23705a10'/%3E%3C/svg%3E") no-repeat}
.tree-node.placeholder-1c>span:last-child{color:#8c8c8c;font-style:italic}
#canvas .node.placeholder-1c{outline:1px dashed #c2bb98;outline-offset:1px}
#inspector .p1c-locked-note{padding:3px 6px 3px 18px;font:11px Arial,sans-serif;color:#5f5630;background:#fbf7e2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='8'%3E%3Cpath d='M1.5 3.5V2.5a2 2 0 0 1 4 0v1' fill='none' stroke='%23705a10'/%3E%3Crect x='.5' y='3.5' width='6' height='4' fill='%23f0cc4a' stroke='%23705a10'/%3E%3C/svg%3E") 6px center no-repeat;border-bottom:1px solid #e3ddc0}
#inspector.locked-1c input,#inspector.locked-1c textarea,#inspector.locked-1c select{color:#6d6d6d}
#dock-body tr.locked-1c td:first-child input{padding-left:13px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='8'%3E%3Cpath d='M1.5 3.5V2.5a2 2 0 0 1 4 0v1' fill='none' stroke='%23705a10'/%3E%3Crect x='.5' y='3.5' width='6' height='4' fill='%23f0cc4a' stroke='%23705a10'/%3E%3C/svg%3E") 3px center no-repeat}
.ic-onec{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAGVUlEQVR4nLWXa2xcRxXHf2fuvXvv7vqdl11nyctu2kQESpMaVJ5BRMKAGqKmEZUAQaQWKBIRNAp8ACsSQvAFEAgiEQS0IWpppBAJkUSlEVAgQCxQSmnixHVd5+HipHbitXf3vmaGD7YTO/amqjFHmg93zpk5/3PuOf+ZEbq6FHv3mnXb9zfZ+qbHLXY71qzCGgUICyMWUQZR/YIcikZf/84rhx4dpatLCUD7J5+42/VrDis3c5dJQ6zRC+R3pohyUK6PTpMzOhp/sPfAp8/Kup3PNBlrTzl+fk0ajiUiuCALFfktYq21pG5Q6+mo1KdE7lPamt1OJjfpXLz/n3MAERHx0nAscTK5Ndqa3S7Yh00a2onIp8zAWrvQrpnaUgTXpKEF+7ArSMEaLdPrLUoMvp+Z+FgAHCJCHMe4jtyYsUYjSMFlmmeRCecf2LCUnp7z9F64iu85/xOGNDW0LKnj3vV3cbLnGhn3ZiYAcacbW2MJfJ+BV19lQyFg146PUAkjZJ5lYa0lCDJ0nz7PiX/14AfLMTpherZnAgCUEgYGR3jwvZu4c/VyxsYrKDV/AH6QQYlw4EQfjctn27izp8DPuIyXQ8ZKFcZK4fwBYEm0oThewXPVnDZzAiiHKcuaamlZVEdjTYBScy9+QwDG4mVcwlKJak01A8BUnKPlmFWti1h9R9O8HN8qjk6q6ubMgIiQaoO1liRNcaZlQEQhSt7UIZGk1al9TgAAWIuIkPG8WSpjDJcHB0mS6pGJCGmqWb68FcdxqhLbnACstfi+z+DlS/z22HHyuRwAYRjS0dFBW1sb/f39tLW1YSeB3rpeRBgdvcp/XhvE9eurElpVACJCksQMDw8ThSEAlUqFSqUySasLQ9VzAlBKEYYhKzas56t79szSG2NYtWoV5XJ5VvQT3xbBks8FNDcv4/KVMZw304Y3N4JU61uKUFBKUSgU3ji8SUmSaxTHStS2CMYyoyWrF+GkOI4zq+K11vT19ZGm6U2w1uJlMqxc04bS4+jiGXQ8hpttpnnpSrZ3bub46UFyvodSN3/hnACMMQRBQF/vOX768yeorakBoFQq0dnZyaZNm7hy5Qrr1q2bXGGJ4xjPy2B6v0k0sJ+MvkCgINQKP/92fvLINzjc08meHx8HBCUTdVmVB7TW1Dc00tHRQTYIAIiiiJaWlhv6oaGhicg9j7b2dsy/P0Xp3AG8LPQNCa+NCO2thkX6n1z/3Va2fXAf0c5t7N53jIaaLNrY6gDiOGbxkqVsfeCBWXprLRs3bpzgAatRbkDU+y3icwewQYYgm/L0CcP+31h+9GXY+j6H2EDxD5/nEx96K0fetpa/vXie2lxAVZKfarUkTTHG3BhTLZrP52loaKChcRF1tS564AcoX4GdsPdcyGdBKTBaoxzBWoGL32fH+9tJtEHkNkVojJ2sVmH6+W3t1HXNgjUgClt8AVsZwipBrEVlwVGgNWRcUAHoksZxLOb1U6x/S0xNLk+qdXUiyud8lBKUcqrlCCYTqHURoyGbFX71nOW5f0CxBIvr4eCzcPiPsPOjcE8bmGScwInxXBedzgnAolyfY8+/QH1NDmPMDB6YCdSgHIcVDa0oT5Ekli33Ccf+bum9CMuaoLsHPtMJ71grlEtQ13AHw2GeSlghyDi4E7mczLEIaZKwqLnAvuOvsP/o2dve0pUI45WIX3/3c7yn5V1c7/8LjfUuP9yV8sXvQfdZ+MLHYdcOKIUuNomR1o/x/OmIMIrIB3kraz/71IBSbsGalOneHNfDmNvzvaNgtBSy+d61/OLRmOKz92MFams9zl/QHPkTfGWHkGhFUkkImgqE95xiy9e77bXxMo7iogIOihsIlnT65jqNsSa57UjThLqsx4lTL7H/zyup23IEz8sxOpJQaDI8/pChXNLEpYT84nb8d/+er/1ykMtXhtNsrlassQdl9SPP1Hup6Xb9mvb5Ps0EKIURj227n8c2V8hffxJGTkJchGwLLNnCJXcHe58etEf/eiZdvGSZF5eLPbGr3jn5OH3qbtfPzPtxKgAijI6XuXNFKx/uaGfDioAa33J1TOh+ucjRky8xUizT2NhAEkUvGqO3n/vZQ+dkIZ/njqOohBGlMMZzPZRySNMEY7Wty2dNJhP0J9oe0pVL33754JeKdHWp/wIitw5tXxEO4QAAAABJRU5ErkJggg==")}
/* Окно «Вставка формы из Конфигуратора» */
.onec-modal .modal{width:min(620px,calc(100vw - 32px));border-radius:0;border:1px solid var(--c-border)}.onec-modal #modal-content{padding:12px 14px;max-height:calc(100vh - 140px)}
.onec-setup{font:12px/1.45 Arial,sans-serif;color:#333}
.onec-setup p{margin:0 0 8px}
.onec-setup h4{margin:12px 0 4px;font-size:12px}
.onec-setup kbd{display:inline-block;padding:0 4px;border:1px solid #c8c2a6;border-bottom-width:2px;border-radius:3px;background:#fcfaeb;font:11px Arial,sans-serif}
.onec-setup code{font:11px Consolas,monospace;background:#f3f1e4;padding:0 3px}
.onec-steps{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.onec-step{border:1px solid #d9d3b5;background:#fffef8;padding:8px 10px}
.onec-step.ok{border-color:#b9d8b2;background:#f6fbf4}
.onec-step-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-bottom:4px}
.onec-state{font-size:11px;white-space:nowrap;color:#8a6d00}
.onec-step.ok .onec-state{color:#2e7d32}.onec-step.ok .onec-state::before{content:"✓ "}
.onec-step.bad .onec-state{color:#b3261e}
.onec-step.wait .onec-state{color:#777}
.onec-actions{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:flex-start}
.onec-actions details{flex-basis:100%;font-size:11px}
.onec-actions summary{cursor:pointer;color:#1c5fa8}
.onec-actions ol{margin:4px 0 0;padding-left:18px}
.onec-button{display:inline-block;padding:2px 12px;border:1px solid #b3ac86;background:#fcfaeb;color:#333;text-decoration:none;font-size:11px;line-height:17px}
.onec-button.primary{background:#fadf8f;border-color:#c9a53a;font-weight:bold}
.onec-button:hover{filter:brightness(.97)}
.onec-hint{font-size:11px;color:#777;margin:6px 0 0!important;flex-basis:100%}
.onec-modal{background:rgba(24,38,53,.2)}
.onec-modal .modal{box-shadow:0 12px 40px rgba(29,41,53,.3)}
.onec-modal .modal>header{padding:3px 4px 3px 8px;background:var(--c-cream);border-bottom:1px solid var(--c-border)}
.onec-modal .modal h2{font-size:11px;font-weight:700;color:var(--c-text)}
.onec-modal .modal header button{width:18px;height:18px;border-radius:0;font-size:13px}
.onec-modal .modal>footer{padding:7px;background:var(--c-cream-2);border-top:0;border-radius:0;gap:5px}
.onec-modal .modal>footer button{height:21px;min-height:0;padding:0 14px;font-size:11px;border:1px solid var(--c-border);border-radius:0;background:var(--c-cream);color:var(--c-text);font-weight:400;box-shadow:none}
.onec-modal .modal>footer button:hover{background:var(--c-cream-3)}
.onec-modal .modal>footer .primary{font-weight:700}
/* Clipboard layouts use intrinsic row widths, with auto fields filling the caption column. */
.imported-form>.form-commandbar{display:none}
.imported-form #canvas{display:flex;flex-direction:column;align-items:stretch}
.imported-form #canvas .layout.horizontal>.node{flex:0 1 auto;min-width:auto}
.imported-form #canvas .layout.horizontal{flex-wrap:nowrap;gap:6px}
.imported-form #canvas .node.transparent-group{padding:0;border-width:0}
.imported-form #canvas .form-button.default{background:linear-gradient(#fff15b,#ffdc00);border-color:#d2bd24;font-weight:bold}
.imported-form #canvas .form-button.picture-only{width:30px;padding:0 6px}
.imported-form #canvas .button-picture{margin-right:5px}.imported-form #canvas .picture-only>.button-picture{margin:0}
.imported-form #canvas .field.has-actions{gap:0}
.imported-form #canvas .field.has-actions>label{margin-right:4px}
.imported-form #canvas .field-action,.imported-form #canvas .field-clear{height:25px;min-height:25px;width:21px;margin-left:-1px;padding:0;border:1px solid #a0a0a0;border-radius:0;background:linear-gradient(#fff,#f5f5f5);color:#555;opacity:1}
#canvas .field-spin{display:flex;flex-direction:column;flex:0 0 21px;height:25px;margin-left:-1px;border:1px solid #a0a0a0;background:#fff;box-sizing:border-box}
#canvas .field-spin>button{height:12px;min-height:0;width:19px;margin:0;padding:0;border:0;background:linear-gradient(#fff,#f7f7f7);border-radius:0;font:9px/10px Arial;color:#666;opacity:1;box-shadow:none}
#canvas .field-spin>button+button{border-top:1px solid #ddd}
#canvas .table-view-status.onec-status{display:flex;gap:14px;align-items:center;min-height:31px;padding:1px 0 9px;border:0;background:white;font:13px Arial;color:#666}
#canvas .onec-status>span{display:inline-block;border:1px solid #d7d2b8;border-radius:2px;background:linear-gradient(#fffde5,#f6ebae);padding:2px 4px;white-space:nowrap}
#canvas .onec-status i{display:inline-block;width:12px;height:12px;border-radius:50%;background:#bcb69a;color:#fff;font:normal bold 12px/12px Arial;text-align:center}
/* Форматированная надпись: пробелы сохраняются («кассы   :»), строка 16 px (РедактированиеДополнительныхДанных). */
.imported-form #canvas .formatted-title{white-space:pre-wrap;line-height:16px}
.imported-form #canvas .layout.horizontal>.node.stretch-horizontal{flex:1 1 auto;min-width:auto;width:auto}

#canvas .field .segmented .seg input[type="radio"]{position:absolute;width:1px;min-width:0;height:1px;min-height:0;opacity:0;margin:0;padding:0;border:0}
#canvas .segmented .seg span{height:27px;font-size:13px;white-space:nowrap}

#canvas .field .segmented[style*="grid"]{gap:0}
#canvas .segmented .seg span{width:100%}
#canvas .tab-picture{width:16px;height:16px;object-fit:contain;vertical-align:middle;margin-right:6px}

#canvas .field-hint-button{background:none;border:0;box-shadow:none;color:#0080a8;border-radius:0;padding:0 2px;min-width:12px}
.commandbar .submenu-1c,.commandbar .more-1c{display:inline-flex;align-items:center;gap:6px}
.submenu-arrow{width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid currentColor;display:inline-block}
.commandbar .more-1c{margin-left:0}
#canvas .tabs-1c>.tabs-body{display:grid;grid-template-columns:minmax(0,1fr);align-items:start}
#canvas .tabs-1c>.tabs-body>*{grid-area:1/1}
/* Невидимые страницы задают группе ширину самой широкой страницы, но не высоту: высота — по текущей странице
   (Конфигуратор, ОсновнаяФорма без «Высоты»: «Загрузка из кассы» 572 px, «Помощь» 650 px). */
#canvas .page-ghost{visibility:hidden;pointer-events:none;overflow:hidden;height:0}
/* Вставленная форма 1С: при нехватке ширины как в Конфигураторе — сначала пропадает выравнивание заголовков
   (сжимаемый отступ --title-pad), затем сжимаются поля до минимума, и лишь потом переносятся заголовки. */
.imported-form #canvas .field>label{flex:0 1 auto;white-space:normal;padding-right:2px;margin-right:-2px}
.imported-form #canvas .field.has-actions>label,.imported-form #canvas .field.ref-field>label{margin-right:2px}
/* Коэффициенты сжатия: поле (1e5, задано в разметке) → отступ выравнивания (1000) → заголовок (1). Сумма ≥ 1, иначе flex раздаёт лишь долю нехватки.
   Запас 2px у заголовка не даёт ему переноситься от долей пикселя, доставшихся при пропорциональном сжатии. */
.imported-form #canvas .field>.title-pad-el{flex:0 1000 auto;max-width:100%;min-width:0;height:1px;margin-left:-4px}
.imported-form #canvas .field.has-actions>.title-pad-el,.imported-form #canvas .field.ref-field>.title-pad-el{margin-left:0}
/* Ссылочное поле: ▾ внутри рамки поля, ⧉ — отдельной кнопкой справа (Такси, Конфигуратор 8.5). */
#canvas .field.ref-field{gap:0}
#canvas .field.ref-field>label{margin-right:4px}
#canvas .field.ref-field>input,#canvas .field.ref-field>.ctl-1c>input{padding-right:19px}
#canvas .field>.ref-ddl{flex:none;position:relative;width:18px;height:23px;margin-left:-19px;background:no-repeat center/7px 4px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4'%3E%3Cpath d='M0 0h7L3.5 4z' fill='%23404040'/%3E%3C/svg%3E")}
#canvas .field>.ref-open{flex:none;width:23px;height:25px;margin-left:2px;box-sizing:border-box;border:1px solid #c8c8c8;border-radius:2px;background:#fff no-repeat center/11px 11px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11'%3E%3Crect x='.5' y='3.5' width='7' height='7' fill='none' stroke='%23808080'/%3E%3Cpath d='M3.5 3.5v-3h7v7h-3' fill='none' stroke='%23808080'/%3E%3C/svg%3E")}
#canvas .field.ref-field.disabled>.ref-ddl,#canvas .field.ref-field.disabled>.ref-open{opacity:.5}
/* Недоступная картинка-декорация в 1С рисуется бледной и серой (сверено: иконка PDF у «Приложить чек»). */
#canvas .picture.disabled img{filter:grayscale(1);opacity:.45}
/* Картинки-декорации в 1С не сжимаются вместе с группой. */
.imported-form #canvas .picture.has-image,.imported-form #canvas .picture.has-image img{max-width:none}
/* Обёртка поля вставленной формы: svg задаёт предпочтительную ширину, поле заполняет ячейку. */
#canvas .ctl-1c{display:grid;max-width:100%;align-items:center}
#canvas .ctl-1c>*{grid-area:1/1;min-width:0}
#canvas .ctl-1c>.ctl-size{max-width:100%;height:1px;visibility:hidden;pointer-events:none}
#canvas .ctl-1c>input,#canvas .ctl-1c>select,#canvas .ctl-1c>textarea{width:100%;contain:inline-size}
/* Группа кнопок в командной панели: кнопки встык. Строка поиска (дополнение таблицы) — у правого края панели. */
#canvas .button-group-1c{display:inline-flex;align-items:stretch}
#canvas .button-group-1c>.node{padding:0;border-width:0}
#canvas .button-group-1c>.node+.node{margin-left:-1px}
#canvas .button-group-1c>.node .form-button{border-radius:0}
#canvas .button-group-1c>.node:first-child .form-button{border-radius:2px 0 0 2px}
#canvas .button-group-1c>.node:last-child .form-button{border-radius:0 2px 2px 0}
#canvas .layout.horizontal>.node.addition-node,#canvas .commandbar>.node.addition-node{margin-left:auto}
#canvas .search-addition-1c input{width:180px;height:23px;box-sizing:border-box;padding:0 4px;border:1px solid #c8c8c8;border-radius:2px;font:13px Arial,"Liberation Sans",sans-serif;color:#4d4d4d;background:#fff}
#canvas .search-addition-1c input::placeholder{color:#b3b3b3}
/* Вертикальная группа колонок таблицы: строки заголовка/ячейки друг под другом, между ними тонкая линия. */
#canvas .preview-table th.stacked,#canvas .preview-table td.stacked{padding:0;vertical-align:top}
#canvas .preview-table th.stacked>div,#canvas .preview-table td.stacked>div{padding:4px 6px;white-space:nowrap}
#canvas .preview-table th.stacked>div+div,#canvas .preview-table td.stacked>div+div{border-top:1px solid #dcdcdc}
#canvas .commandbar.bar-right{justify-content:flex-end}
/* Командные панели 1С не переносят кнопки на вторую строку (лишнее уходит в «Еще»). */
.imported-form #canvas .commandbar{flex-wrap:nowrap}
/* Поле с «Растягивать по горизонтали» заполняет свою строку. */
.imported-form #canvas .node.stretch-horizontal>.node-content>.field>input,.imported-form #canvas .node.stretch-horizontal>.node-content>.field>select,.imported-form #canvas .node.stretch-horizontal>.node-content>.field>textarea{flex:1 1 auto;width:auto;min-width:61px}
.imported-form #canvas .form-button{white-space:nowrap}
.imported-form #canvas .commandbar>.node{flex-shrink:0}
#canvas .button-picture.unknown-picture{display:inline-block;width:14px;height:14px;box-sizing:border-box;border:1px dashed #b8b8b8;border-radius:2px;vertical-align:middle}
/* Кнопка-гиперссылка 1С без полей: текст начинается от края группы (сверено: «Множественный выбор»). */
.imported-form #canvas .form-button.button-link{padding-left:0;padding-right:0;min-width:0}
/* Командная панель таблицы вставленной формы. */
#canvas .table-bar-1c{display:flex;align-items:center;gap:6px;margin:0 0 4px;flex-wrap:nowrap}
#canvas .table-bar-1c .button-group-1c{display:inline-flex}
#canvas .table-bar-1c .button-group-1c>.form-button+.form-button{margin-left:-1px}
#canvas .table-bar-1c .button-group-1c>.form-button{border-radius:0}
#canvas .table-bar-1c .button-group-1c>.form-button:first-child{border-radius:2px 0 0 2px}
#canvas .table-bar-1c .button-group-1c>.form-button:last-child{border-radius:0 2px 2px 0}
#canvas .table-bar-1c .form-button.picture-only{padding:0 6px}
#canvas .bar-search-1c{margin-left:auto;display:inline-flex;align-items:stretch}
#canvas .bar-search-1c input{width:240px;height:23px;box-sizing:border-box;padding:0 4px;border:1px solid #c8c8c8;border-right:0;border-radius:2px 0 0 2px;font:13px Arial,"Liberation Sans",sans-serif;background:#fff}
#canvas .bar-search-1c input::placeholder{color:#b3b3b3}
#canvas .bar-search-1c .bar-search-clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:23px;box-sizing:border-box;border:1px solid #c8c8c8;border-radius:0 2px 2px 0;background:#fff;color:#777;font-size:11px}
/* «Еще» и «?» у правого края растянутой командной панели. */
.imported-form #canvas .commandbar:not(.bar-right)>.more-1c{margin-left:auto}
#canvas .form-button.help-1c{padding:0 8px;min-width:0}
/* Недоступная группа вставленной формы: подписи серые, как в Конфигураторе (сверено: ФормаАвтообмена «Настройки»). */
#canvas .node.disabled-1c .field>label,#canvas .node.disabled-1c .decoration-label,#canvas .node.disabled-1c .g1c-title,#canvas .node.disabled-1c.node .field-hint-button{color:#a3a3a3}
#canvas .field>input.check-1c{margin:0 2px;flex:none}
/* Надпись-гиперссылка 1С — синяя (сверено: «Внешняя обработка :»). */
#canvas .decoration-label.form-link{color:#1c55ae}
/* Кнопка календаря в поле даты вставленной формы. */
#canvas .field>.date-btn-1c{flex:none;position:relative;width:18px;height:23px;margin-left:-19px;background:no-repeat center/11px 11px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11'%3E%3Crect x='.5' y='1.5' width='10' height='9' fill='none' stroke='%23606060'/%3E%3Cpath d='M.5 4h10M3 1v2M8 1v2' stroke='%23606060'/%3E%3C/svg%3E")}
#canvas .field-value.label-value-1c{display:block;min-height:1px;flex:1 1 auto;min-width:0}
#canvas .label-value-1c>svg.lv-sizer{display:block;height:0;max-width:100%}
/* Гиперссылки командной панели идут через ~12 px, как в Конфигураторе (ОсновнаяФорма). */
.imported-form #canvas .commandbar .form-button.button-link{padding:0 4px}
/* Таблица вставленной формы не задаёт ширину формы (в 1С она прокручивается): ширина — от остального содержимого. */
.imported-form #canvas .table-wrap{contain:inline-size;min-width:240px}
#canvas .commandbar>.bar-clip{display:flex;align-items:center;gap:3px;overflow:hidden;min-width:0;flex:0 1 auto}
#canvas .commandbar>.bar-clip>.node{flex-shrink:0}
/* Поле табличного документа (предпросмотр): сетка 1С, колонки ~78 px, строки ~17 px. */
#canvas .spreadsheet-1c{flex:1 1 auto;width:100%;overflow:hidden;contain:inline-size;border:1px solid #c8c8c8;background:#fff;box-sizing:border-box}
#canvas .spreadsheet-1c table{border-collapse:collapse;table-layout:fixed;font:11px Arial,"Liberation Sans",sans-serif;color:#555}
#canvas .spreadsheet-1c th,#canvas .spreadsheet-1c td{height:16px;padding:0 3px;border:1px solid #e3e3e3;box-sizing:border-box}
#canvas .spreadsheet-1c thead th{width:78px;min-width:78px;background:#f6f6f6;font-weight:normal;text-align:center;border-color:#d6d6d6}
#canvas .spreadsheet-1c tbody th{width:28px;min-width:28px;background:#f6f6f6;font-weight:normal;text-align:center;border-color:#d6d6d6}
#canvas .spreadsheet-1c thead th.corner{width:28px;min-width:28px}
#canvas .spreadsheet-1c th.active{font-weight:bold;color:#333}
/* Командная панель формы первой строкой — сразу под заголовком (Конфигуратор: кнопки в 7 px от шапки). */
/* Первый элемент вставленной формы — в 10 px под шапкой (поле, картинка: Авторизация, ПроверкаСовместимости). */
.imported-form #canvas.canvas.field-first{padding-top:6px}
.imported-form #canvas.canvas.formbar-first{padding-top:1px}
/* Первой строкой группа с командной панелью (ФормаАвтообмена): кнопки в 32 px от верха окна. */
.imported-form #canvas.canvas.groupbar-first{padding-top:6px}
/* Колонки таблицы вставленной формы: Ширина × 10 + 20 px, текст с отступом 9 px (УправлениеКлючамиДоступа*). */
.imported-form #canvas .preview-table th,.imported-form #canvas .preview-table td{box-sizing:border-box;padding-left:9px}
/* Страницы вставленной формы (Конфигуратор 8.5, ПросмотрДокумента, ОбщиеНастройки): закладки 13 px обычным шрифтом,
   содержимое страницы в рамке, текущая закладка перекрывает верхнюю черту рамки. */
.imported-form #canvas .tab-label{font-size:13px;font-weight:normal;padding:3px 10px}
.imported-form #canvas .tab-label.active{font-weight:normal;z-index:1}
.imported-form #canvas .tab-picture{margin-right:6px;vertical-align:-3px}
.imported-form #canvas .tabs-1c.pages-ЗакладкиСверху>.tabs-row,.imported-form #canvas .tabs-1c.pages-Авто>.tabs-row{border-bottom:0;margin-bottom:0}
.imported-form #canvas .tabs-1c.pages-ЗакладкиСверху>.tabs-body,.imported-form #canvas .tabs-1c.pages-Авто>.tabs-body,.imported-form #canvas .tabs-1c.pages-ЗакладкиСнизу>.tabs-body{border:1px solid var(--x-tab-line);padding:9px 10px 10px}
.imported-form #canvas .tabs-1c.pages-ЗакладкиСнизу>.tabs-row{border-top:0;margin:0}
/* Надпись вставленной формы — строка текста 16 px (Конфигуратор: список «понедельник…воскресенье» с шагом 23 px,
   строки «Справка :» / «Оферта :» в горизонтальных группах — 26 px; ОсновнаяФорма, страница «Помощь»). */
.imported-form #canvas .decoration-label{line-height:16px;padding:1px 0}
.imported-form #canvas .layout.horizontal>.node>.node-content>.decoration-label{padding:2px 0}
/* Поле HTML с рамкой {4,3,{-1},3} — без рамки (ОсновнаяФорма «Диалог» на странице «Помощь»). */
.imported-form #canvas .html-preview.no-border{border-color:transparent}
.imported-form #canvas svg.table-sizer{display:block;height:0;max-width:100%}
/* «Горизонтальная, если возможно»: переносится целиком — столбиком (класс ставит stackWrappedGroups). */
.imported-form #canvas .layout.horizontal.wrap{flex-wrap:wrap}
.imported-form #canvas .layout.horizontal.wrap.stacked-1c{flex-direction:column;flex-wrap:nowrap;align-items:flex-start}
.imported-form #canvas svg.w-sizer{display:block;height:0;max-width:100%}
/* Поле надписи — строка 22 px (ПроверкаСовместимости: строки проверок с шагом 27 px, как и галочки Высота 1 = 25 px). */
.imported-form #canvas .field.label-field-1c{min-height:22px}
.imported-form #canvas .field.label-field-1c>label,.imported-form #canvas .field.label-field-1c>.field-value{line-height:22px;min-height:22px}
/* Строка поиска в панели прижата к «Еще» (ФормаПодменыНоменклатуры). */
.imported-form #canvas .commandbar>.addition-node~.more-1c,.imported-form #canvas .commandbar>.bar-search-1c~.more-1c{margin-left:6px}
.imported-form #canvas .preview-table th>.col-min{height:0;overflow:hidden}
/* Свертываемая группа в предпросмотре Конфигуратора — заголовок-гиперссылка без треугольника
   (РедактированиеДополнительныхДанных «Для разработчиков», ОсновнаяФорма «Пн-Пт : 09.00-19.00»). */
.imported-form #canvas .beh-Свертываемая>.g1c-title{text-decoration:underline}
.imported-form #canvas .beh-Свертываемая>.g1c-title>.g1c-arrow{display:none}
/* Строки полей ввода в Конфигураторе идут с шагом 35 px (поле 24–25 px + 10–11 px): ФормаАвторизацииЛогинПароль,
   ОбщиеНастройки «Входит в группу» / «Номенклатурная группа». Флажки и поля надписи — плотнее, их не трогаем. */
.imported-form #canvas .field.input-row-1c{margin:2px 0}
.imported-form #canvas .node.wrap-label-1c{width:0;min-width:100%;box-sizing:border-box}
/* Кнопки командной панели таблицы не задают минимальную ширину формы (панель формы — задаёт: ОсновнаяФорма 1153 px): не поместившиеся уходят за край (в 1С — в «Еще»),
   ФормаСозданияНовойНоменклатуры 993 px. Класс measure-min ставит sizeImportedForm на время замера min-content. */
#canvas .table-bar-1c>.table-bar-clip{position:relative;display:block;flex:0 1 auto;min-width:0;overflow:hidden}
#canvas .table-bar-clip>.bar-clip-in{position:absolute;left:0;top:0;display:flex;align-items:center;gap:3px;white-space:nowrap}
#canvas .table-bar-clip>.bar-sizer{display:block;height:1px;max-width:100%}
#canvas .table-bar-1c{min-width:0}
/* Таблица в горизонтальной группе сжимается ниже ширины своей панели — кнопки уходят за край. */
.imported-form #canvas .layout.horizontal>.node.table-node-1c{min-width:0}
.imported-form #canvas .table-node-1c .onec-status{overflow:hidden}
/* Строка поиска в панели сжимается первой (до 100 px), кнопки — потом (ФормаСозданияНовойНоменклатуры: поиск 195 px). */
/* Поиск в панели таблицы ширину таблицы не задаёт: растёт до 240 px поля (+×) в свободном месте, иначе сжимается
   (НастройкиСоответствияТиповНоменклатур: таблица 400, поиск 240 справа; ФормаНастройкиСпособаПоиска: со стрелками — 204). */
.imported-form #canvas .table-bar-1c>.bar-search-1c{flex:1 1000 auto;width:0;min-width:100px;max-width:260px;overflow:hidden}
.imported-form #canvas .table-bar-1c>.bar-search-1c>input{flex:1 1 auto;min-width:0}
.imported-form #canvas .table-bar-1c>.bar-search-1c>.bar-search-clear{flex:none}
.imported-form #canvas .th-picture-1c{width:16px;height:16px;vertical-align:middle;margin-right:4px}
.imported-form #canvas .th-picture-1c:last-child{margin-right:0}
/* Кнопки поля ввода внутри рамки (▾, ⧉, «…») — по 20 px с разделителем (ФормаГрупповогоРедактированияПараметровСоздаваемыхПозиций). */
.imported-form #canvas .ctl-1c>.ctl-btns-1c{justify-self:end;align-self:stretch;display:flex;margin:1px 1px 1px 0;pointer-events:none}
.imported-form #canvas .ctl-btn-1c{width:20px;border-left:1px solid #e3e3e3;background:no-repeat center}
.imported-form #canvas .ctl-btn-1c.btn-ddl{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4'%3E%3Cpath d='M0 0h7L3.5 4z' fill='%23404040'/%3E%3C/svg%3E");background-size:7px 4px}
.imported-form #canvas .ctl-btn-1c.btn-open{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11'%3E%3Crect x='.5' y='3.5' width='7' height='7' fill='none' stroke='%23808080'/%3E%3Cpath d='M3.5 3.5v-3h7v7h-3' fill='none' stroke='%23808080'/%3E%3C/svg%3E");background-size:11px 11px}
.imported-form #canvas .ctl-btn-1c.btn-choice{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='2'%3E%3Cpath d='M0 0h2v2H0zM3.5 0h2v2h-2zM7 0h2v2H7z' fill='%23606060'/%3E%3C/svg%3E");background-size:9px 2px;background-position:center 60%}
.imported-form #canvas .ctl-btn-1c.btn-choice.ro{opacity:.4}
.imported-form #canvas .ctl-1c.btns-1>input{padding-right:24px}
.imported-form #canvas .ctl-1c.btns-2>input{padding-right:45px}
.imported-form #canvas .layout.horizontal>.node.grow-1c{flex:1 1 auto}

/* Предпочтительная ширина текстовой колонки участвует в max-content, но допускает сжатие. */
.imported-form #canvas .preview-table th>svg.col-preferred{display:block;max-width:100%}

/* Растягиваемая декорация-картинка занимает высоту строки; без масштабирования значок остаётся натурального размера. */
.imported-form #canvas .image-stretch-1c{display:flex}
.imported-form #canvas .image-stretch-1c>.node-content{display:flex;align-items:center;justify-content:center;flex:1}
.imported-form #canvas .picture.native-size-1c img{width:auto;height:auto;max-width:100%;max-height:100%}

/* Импортированная форма может быть уже редакторского минимума 250 px. */
#form-window.form-window.imported-form{min-width:0}

/* Пустая надпись сохраняет одну строку; явный размер поля картинки не ограничивается минимумом редактора. */
.imported-form #canvas .decoration-label:empty{min-height:18px}
.imported-form #canvas .field-picture{min-width:0}
.imported-form #canvas .picture.has-image img{image-rendering:auto}

.imported-form #canvas .image-stretch-x-1c>.node-content{display:flex;justify-content:center}

/* Без закладок страницы не добавляют собственную рамку; их содержимое участвует в минимальной ширине группы. */
.imported-form #canvas .transparent-pages-1c{padding:0;border-width:0}
.imported-form #canvas .pages-Нет>.tabs-body{grid-template-columns:auto}
.imported-form #canvas .pages-Нет>.tabs-body>*{min-width:min-content}
.imported-form #canvas .pages-Нет>.tabs-body>.page-ghost{overflow:visible}

.imported-form #canvas .pages-Нет>.tabs-body>.page-ghost{height:auto}
.imported-form #canvas .beh-Всплывающая>.g1c-popup{height:auto;padding:0;border:0;box-shadow:none;background:none;color:#009646;font-size:16px;line-height:18px;text-decoration:underline;white-space:pre-line}
.imported-form #canvas .beh-Всплывающая>.g1c-popup i{display:none}


.imported-form #canvas .preview-table th{font-size:13px;vertical-align:top;padding-top:8px}
.imported-form #canvas .preview-table th.stacked{padding:0}
.imported-form #canvas .preview-table th.stacked>div{box-sizing:border-box;min-height:31px;line-height:15px;padding:8px 9px 7px}

.imported-form #canvas .button-with-hint-1c{display:inline-flex;align-items:center;gap:4px}

/* У картинки рамка относится к самому изображению, а выделение редактора не добавляет боковые отступы. */
.imported-form #canvas .node.imported-image-node{padding:1px 0;border-width:0}

/* Авто-цвет текста декорации в макете 1С темнее подписей полей. Явный цвет задается inline. */
.imported-form #canvas .decoration-label:not(.form-link){color:#333}

/* Всплывающая группа: самостоятельная панель над макетом, без изменения его размеров. */
#canvas{position:relative}
#canvas [data-group-popup]{cursor:pointer}
#canvas [data-group-popup]:focus{outline:1px dotted #777;outline-offset:2px}
#canvas .g1c-popup-panel{position:absolute;z-index:50;top:10px;left:10px;width:-webkit-max-content;width:max-content;box-sizing:border-box;padding:20px 40px 20px 20px;overflow:auto;border:1px solid #a0a0a0;background:#fff;box-shadow:1px 1px 3px rgba(0,0,0,.16);color:#333}
#canvas .g1c-popup-panel>.g1c-body{padding:0}
#canvas .g1c-popup-close{position:absolute;top:10px;right:10px;width:20px;height:20px;padding:0;border:0;background:none;box-shadow:none;color:#777;font:16px/20px Arial,sans-serif;cursor:pointer}
#canvas .g1c-popup-close:hover{color:#222;background:#eee}

/* Дерево элементов: шаг и круглые переключатели веток Конфигуратора. */
#tree .tree-toggle{position:relative;display:inline-block;flex:0 0 14px;width:14px;height:19px}
#tree .tree-toggle[data-tree-toggle]{cursor:pointer}
#tree .tree-toggle[data-tree-toggle]::before{content:"";position:absolute;left:3px;top:5px;width:9px;height:9px;box-sizing:border-box;border:1px solid #aaa;border-radius:50%;background:#fff}
#tree .tree-toggle[data-tree-toggle]::after{content:"";position:absolute;left:5px;top:9px;width:5px;height:1px;background:#888}
#tree .tree-toggle.collapsed::before{background:linear-gradient(#888,#888) center/1px 5px no-repeat,#fff}
#tree .tree-icon{flex:0 0 16px}
.no-flex-gap #tree .tree-toggle{margin-right:5px}

/* Ограничение редактирования остаётся в подсказке; значок совпадает с типом элемента 1С. */
#tree .tree-node.locked-1c .tree-icon::after{display:none}