:root {
  --bg: #171c26;
  --panel: #1f2633;
  --panel2: #242d3d;
  --field: #12171f;
  --border: #313b4d;
  --text: #d7dee9;
  --muted: #8a94a6;
  --accent: #4f8cff;
  --accent-dim: #35548c;
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body { font: 13px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif;
       display: flex; flex-direction: column;
       color: var(--text); background: var(--bg); }

/* ---------- панели управления ---------- */
.bar { padding: 6px 10px; display: flex; align-items: center; gap: 7px;
       background: var(--panel); border-bottom: 1px solid var(--border);
       flex-wrap: wrap; }
button { padding: 4px 12px; background: #2a3346; color: var(--text);
         border: 1px solid var(--border); border-radius: 6px; cursor: pointer;
         font: inherit; transition: background .12s, border-color .12s; }
button:hover { background: #354160; border-color: #45536e; }
button:disabled { opacity: .45; cursor: default; }
#btnPlay, #btnRecalc, #btnStep, #btnRunEnd {
  background: var(--accent-dim); border-color: #41669f; }
#btnPlay:hover, #btnRecalc:hover, #btnStep:hover, #btnRunEnd:hover {
  background: #40659f; }
input, select { background: var(--field); color: var(--text);
                border: 1px solid var(--border); border-radius: 6px;
                padding: 4px 7px; font: inherit; }
input:focus, select:focus, textarea:focus { outline: 1px solid var(--accent); }
.bar input:not([type]) { width: 56px; }
input[type=checkbox] { accent-color: var(--accent); }
input[type=range] { accent-color: var(--accent); }
.sep { border-left: 1px solid var(--border); align-self: stretch; margin: 0 4px; }
.grp { color: var(--muted); }
label { color: var(--text); }

/* ---------- основная область ---------- */
#main { flex: 1; display: flex; min-height: 0; }
#left { width: 34%; min-width: 280px; display: flex; flex-direction: column;
        background: var(--panel); border-right: 1px solid var(--border); }

/* закладки */
#tabs { display: flex; border-bottom: 1px solid var(--border); }
.tab { flex: none; background: none; border: none; border-radius: 0;
       padding: 8px 16px; color: var(--muted); border-bottom: 2px solid transparent; }
.tab:hover { background: var(--panel2); }
.tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.tabBody { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.tabBody[hidden] { display: none; }

/* закладка «Программы» */
#progSave { display: flex; gap: 6px; padding: 10px; align-items: center;
            border-bottom: 1px solid var(--border); }
#progSave input { flex: 1; }
#progScroll { flex: 1; overflow: auto; }
#progTable { width: 100%; border-collapse: collapse; font-size: 12px; }
#progTable thead th { position: sticky; top: 0; background: var(--panel);
                      color: var(--muted); font-weight: 500; text-align: left;
                      padding: 7px 10px; border-bottom: 1px solid var(--border);
                      white-space: nowrap; }
#progTable td { padding: 7px 10px; border-bottom: 1px solid var(--border);
                vertical-align: middle; }
#progItems tr { cursor: pointer; }
#progItems tr:hover { background: var(--panel2); }
#progItems .pname { font-size: 13px; }
#progItems .pctrl { color: var(--muted); white-space: nowrap; }
#progItems .pnt { color: var(--muted); text-align: center; }
#progItems .pdate { color: var(--muted); font-size: 11px; white-space: nowrap; }
#progItems .pdxf { color: #e6b800; border: 1px solid #6b5a10; border-radius: 4px;
                   font-size: 10px; padding: 0 4px; margin-left: 8px;
                   vertical-align: 1px; }
#progItems .pacts { white-space: nowrap; }
#progItems .pdel, #progItems .pren, #progItems .pdl, #progItems .phist {
  padding: 1px 6px; background: none; border: none; color: var(--muted); }
#progItems .pdel { color: #d05a52; }
#progItems .pdel:hover { color: #ff8177; }
#progItems .pren:hover { color: var(--accent); }
#progItems .pdl:hover { color: var(--accent); }
#progItems .phist:hover { color: var(--accent); }
#progEmpty { color: var(--muted); padding: 16px; text-align: center;
             cursor: default; }

/* закладка «Код»: textarea с прозрачным текстом поверх цветной подложки —
   подложка красит выполненные строки серым, текущую — зелёным */
#edWrap { flex: 1; position: relative; min-height: 0; }
#editor, #editorHl { position: absolute; inset: 0 0 0 46px; margin: 0;
                     border: 0; padding: 8px 10px; white-space: pre;
                     font: 12px/1.5 ui-monospace, Menlo, Consolas, monospace; }
/* колонка номеров строк: не редактируется, скролл синхронизирован */
#edGutter { position: absolute; left: 0; top: 0; bottom: 0; width: 46px;
            overflow: hidden; background: var(--panel2);
            border-right: 1px solid var(--border);
            color: #5d6878; text-align: right; padding: 8px 7px 8px 0;
            font: 12px/1.5 ui-monospace, Menlo, Consolas, monospace;
            white-space: pre; user-select: none; pointer-events: none;
            z-index: 2; }
#editor { resize: none; outline: none; background: transparent;
          color: transparent; caret-color: #dfe6f0; z-index: 1; }
#editor::selection { background: rgba(79, 140, 255, .35); color: transparent; }
#editorHl { background: var(--field); color: #dfe6f0; overflow: hidden;
            pointer-events: none; }
#editorHl .hlDone { color: #66707f; }
#editorHl .hlCur { color: #4ade80; font-weight: 600; }
#msgs { height: 130px; overflow: auto; border-top: 1px solid var(--border);
        background: var(--panel2); font-size: 12px; padding: 5px 8px; }
#msgs .err { color: #ff8177; cursor: pointer; }
#msgs .warn { color: #e6c25c; cursor: pointer; }

/* ---------- предпросмотр (единственная белая область) ---------- */
#right { flex: 1; display: flex; flex-direction: column; min-width: 0;
         padding: 10px; gap: 8px; }
#progTitle { font-size: 14px; font-weight: 600; padding: 0 4px;
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#viewBar { display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
           padding: 0 2px 2px; }
#viewWrap { flex: 1; display: flex; gap: 8px; min-height: 0; }
#cv { flex: 1; width: 100%; min-width: 0; min-height: 0; display: block;
      cursor: grab; background: #fff; border-radius: 10px;
      box-shadow: 0 2px 12px rgba(0,0,0,.35); }
#cv[hidden] { display: none; }
/* токарный 3D обёрнут ради HTML-легенды инструментов поверх WebGL —
   как solidWrap во фрезерном режиме */
#turn3dWrap { flex: 1; position: relative; min-width: 0; min-height: 0; }
#turn3dWrap[hidden] { display: none; }
#turn3dWrap #cv3d { position: absolute; inset: 0; width: 100%; height: 100%;
                    display: block; background: #fff; border-radius: 10px;
                    box-shadow: 0 2px 12px rgba(0,0,0,.35); }
#turnToolLegend { position: absolute; left: 10px; top: 8px;
                  font: 12px sans-serif; color: #333;
                  pointer-events: none; user-select: none; }
#turnToolLegend .slSw { display: inline-block; width: 10px; height: 10px;
                        border-radius: 2px; vertical-align: -1px; }
#playbar { display: flex; align-items: center; gap: 10px; padding: 2px 4px; }
#playbar input[type=range] { flex: 1; }
#stepLabel { min-width: 260px; font-size: 12px; color: var(--muted);
             font-family: ui-monospace, Menlo, monospace; }
#status { background: var(--panel); border-top: 1px solid var(--border);
          padding: 4px 10px; font-size: 12px; color: var(--muted);
          white-space: nowrap; overflow: hidden; }

/* ---------- диалог инструмента ---------- */
.dlg { position: fixed; inset: 0; background: rgba(8, 11, 18, .55);
       display: flex; align-items: center; justify-content: center;
       z-index: 10; }
.dlg[hidden] { display: none; }
.dlgBody { background: var(--panel); border: 1px solid var(--border);
           border-radius: 10px; padding: 16px 20px; color: var(--text);
           box-shadow: 0 12px 40px rgba(0,0,0,.5); }
.dlgBody h3 { margin: 0 0 12px; font-size: 15px; }
.dlgCols { display: flex; gap: 16px; }
.dlgForm { display: flex; flex-direction: column; gap: 7px; min-width: 250px; }
[hidden] { display: none !important; }   /* атрибут сильнее display у классов */
.dlgForm label { display: flex; justify-content: space-between; gap: 8px;
                 align-items: center; }
.dlgForm select { min-width: 150px; }
/* информационные блоки диалогов: длинные описания переносятся по словам
   и не распирают колонку (#cyCode со своим стилем кода — исключение) */
#gtInfo, #etInfo, #ptInfo, #manInfo, #ptCycCode {
  background: var(--field); border: 1px solid var(--border);
  border-radius: 6px; padding: 7px; font-size: 12px; margin: 0;
  color: var(--text); white-space: pre-wrap; overflow-wrap: break-word;
  max-width: 100%; min-width: 0; }
#gtInfo, #ptInfo, #manInfo { min-height: 56px; }
#gtCv, #gtCv3, #etCv, #etCv3, #manCv, #ptCv, #ptCv3 {
  background: #fff; border-radius: 8px; display: block;
  margin-bottom: 8px; max-width: 100%; }

/* пользователь: прижат к правому краю и при переносе строки */
#userBox { display: inline-flex; align-items: center; gap: 8px;
           margin-left: auto; }

/* диалог циклов */
#cyDesc { color: var(--muted); font-size: 12px; }
#cyNote { color: #e6c25c; font-size: 12px; border: 1px solid #6b5a10;
          border-radius: 6px; padding: 5px 8px; }
#cyParams { display: flex; flex-direction: column; gap: 2px; overflow: auto;
            max-height: 46vh; padding-right: 4px; }
.cyP { display: flex; justify-content: space-between; align-items: center;
       gap: 8px; }
.pdesc { color: var(--muted); font-size: 11px; margin: 0 0 5px; }
#cyCode { background: var(--field); border: 1px solid var(--border);
          border-radius: 6px; padding: 8px 10px; min-width: 276px;
          min-height: 200px; margin: 0; font-size: 12px; color: var(--text);
          white-space: pre; }
#cyCode.cyErr { color: #ff8177; white-space: pre-wrap; max-width: 312px; }

/* ---------- окно выбора стойки ЧПУ ---------- */
#ctrlDlg .hint { color: var(--muted); font-size: 12px; margin: 0 0 10px; }
#ctrlDlg code { color: var(--text); background: var(--field);
                padding: 1px 5px; border-radius: 4px; }
.ctrlCard { display: flex; gap: 14px; align-items: flex-start;
            border: 1px solid var(--border); border-radius: 8px;
            padding: 10px; margin-bottom: 10px; background: var(--panel2); }
.ctrlCard.active { border-color: var(--accent);
                   outline: 1px solid var(--accent); }
.ctrlCard img { width: 150px; height: 150px; border-radius: 6px;
                flex: none; background: #fff; object-fit: contain; }
.ctrlName { font-weight: 600; margin-bottom: 4px; }
.ctrlDesc { color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.ctrlBtns { display: flex; gap: 6px; flex-wrap: wrap; }
.ctrlBtns button { font-size: 12px; padding: 3px 9px; }

/* ---------- кнопки транспорта у шкалы кадров ---------- */
#pbBtns { display: flex; gap: 3px; }
#pbBtns button { padding: 2px 8px; font-size: 12px; line-height: 1.4; }
#pbBtns #pbPlay { background: var(--accent-dim); border-color: #41669f; }

/* ---------- окно программы (переименование + DXF) ---------- */
.pdRow { display: flex; gap: 10px; align-items: center; min-height: 24px; }
.pdDl { color: var(--accent); text-decoration: none; border: 1px solid var(--border);
        border-radius: 6px; padding: 2px 10px; background: #2a3346; }
.pdDl:hover { background: #354160; }
#pdErr { color: #ff8177; font-size: 12px; }

option
/* ---------- форма инструмента: фиксированная ширина ---------- */
/* ширина не зависит от длины маркировок и текста справки */
#toolDlg .dlgForm { width: 430px; max-width: 430px; flex: none; }
#toolDlg #tEdit { width: 265px; }
#toolDlg #tShape, #toolDlg #tOrient { width: 265px; }
#toolDlg #tMark, #toolDlg #tHolder { width: 230px; }

/* ---------- панель оформления кода ---------- */
#codeTools { display: flex; flex-wrap: wrap; gap: 4px; padding: 5px 8px;
             border-top: 1px solid var(--border); background: var(--panel2); }
#codeTools button { padding: 2px 9px; font-size: 12px; }
#renumDlg .hint { color: var(--muted); font-size: 12px; }

/* ---------- версии программы и diff ---------- */
#saveBar { display: flex; gap: 6px; align-items: center; padding: 6px 8px;
           border-bottom: 1px solid var(--border); background: var(--panel2);
           flex-wrap: wrap; }
#saveSp { flex: 1; }
/* индикатор live-сохранения и undo/redo */
#saveState { font-size: 12px; }
#saveState.ssOk { color: #4ade80; }
#saveState.ssDirty { color: #e6b800; font-size: 15px; }
#saveState.ssBusy { color: var(--muted); }
#saveState.ssDraft { color: var(--muted); }
#saveState.ssErr { color: #ff8177; font-weight: 600; cursor: pointer; }
#btnUndo, #btnRedo { padding: 4px 9px; font-size: 14px; line-height: 1.2; }
#verTable { border-collapse: collapse; font-size: 12px; width: 100%; }
#verTable th, #verTable td { padding: 4px 7px; text-align: left;
  border-bottom: 1px solid var(--border); }
#verTable th { color: var(--muted); font-weight: 500; }
#verItems .vopen { padding: 1px 7px; font-size: 12px; }
#verDiffPane { max-width: 46vw; }
#verDiff { background: var(--field); border: 1px solid var(--border);
           border-radius: 6px; margin: 0; font-size: 12px;
           max-height: 62vh; overflow: auto; min-width: 520px;
           font-family: ui-monospace, Menlo, Consolas, monospace;
           display: grid; grid-template-columns: 1fr 1fr;
           align-content: start; }
#verDiff .dhead { position: sticky; top: 0; background: var(--panel2);
                  color: var(--muted); font-weight: 600; padding: 4px 8px;
                  border-bottom: 1px solid var(--border); z-index: 1; }
#verDiff .dcell { padding: 0 8px; white-space: pre; min-height: 18px;
                  line-height: 18px; }
#verDiff .dcell:nth-child(odd) { border-right: 1px solid var(--border); }
#verDiff .dctx { color: var(--muted); }
#verDiff .ddel { color: #ff8177; background: rgba(255, 129, 119, .13); }
#verDiff .dadd { color: #4ade80; background: rgba(74, 222, 128, .13); }
#verDiff .dempty { background: rgba(138, 148, 166, .07); }
#progItems .pver { color: var(--muted); text-align: center; white-space: nowrap; }

/* ---------- сплиттер ширины панелей ---------- */
#splitter { flex: none; width: 5px; cursor: col-resize;
            background: var(--border); }
#splitter:hover, #splitter.drag { background: var(--accent); }

/* ---------- окружения, участники, конфликт правок ---------- */
#envSel { max-width: 190px; }
#roleBadge { font-size: 11px; border: 1px solid var(--border);
             border-radius: 4px; padding: 1px 6px; }
#envUsersTable, #invTable { border-collapse: collapse; width: 100%;
                            font-size: 12px; }
#envUsersTable th, #envUsersTable td, #invTable th, #invTable td {
  padding: 4px 8px; text-align: left; border-bottom: 1px solid var(--border); }
#envUsersTable th, #invTable th { color: var(--muted); font-weight: 500; }
#envUsersTable tr.blockedRow td { color: var(--muted); }
.eqTable tr.hiddenRow td { color: var(--muted); }
.listFlt { display: flex; gap: 12px; align-items: center;
           margin: 0 0 6px; }
.listFlt input[type="text"], .listFlt input:not([type]) { flex: 0 1 260px; }
.listPager { display: flex; gap: 10px; align-items: center;
             margin-top: 6px; }
.listPager button { padding: 2px 12px; }
.opChip { display: inline-flex; align-items: center; gap: 4px;
          border: 1px solid var(--border); border-radius: 12px;
          padding: 1px 4px 1px 10px; margin-right: 6px; font-size: 12px; }
.opChip button { border: none; background: none; padding: 0 4px;
                 cursor: pointer; color: var(--muted); }
.opChip button:hover { color: var(--text); }
#envDlg .hint { color: var(--muted); font-size: 12px; }
#confDlg .hint { color: var(--text); font-size: 13px; }
#confDiff { background: var(--field); border: 1px solid var(--border);
            border-radius: 6px; font-size: 12px; max-height: 50vh;
            overflow: auto; display: grid; grid-template-columns: 1fr 1fr;
            align-content: start;
            font-family: ui-monospace, Menlo, Consolas, monospace; }
#confDiff .dcell { padding: 0 8px; white-space: pre; min-height: 18px;
                   line-height: 18px; }
#confDiff .dctx { color: var(--muted); }
#confDiff .ddel { color: #ff8177; background: rgba(255,129,119,.13); }
#confDiff .dadd { color: #4ade80; background: rgba(74,222,128,.13); }
#confDiff .dempty { background: rgba(138,148,166,.07); }
body.viewer #saveState, body.viewer #btnCreateProg, body.viewer #btnNewVer,
body.viewer #btnUndo, body.viewer #btnRedo,
body.viewer #codeTools, body.viewer .pren,
body.viewer .pdel, body.viewer 
/* ---------- админка окружения ---------- */
.admSec { border: 1px solid var(--border); border-radius: 8px;
          padding: 10px 12px; margin-bottom: 10px; }
.admCap { color: var(--muted); font-size: 12px; font-weight: 600;
          margin-bottom: 8px; text-transform: uppercase;
          letter-spacing: .04em; }

/* ---------- папки программ ---------- */
#progItems tr.pfold { background: var(--panel2); cursor: pointer; }
#progItems tr.pfold td { padding: 4px 10px; }
#progItems tr.pfold .ftri { color: var(--muted); display: inline-block;
                            width: 14px; }
#progItems tr.pfold .fname { font-weight: 600; }
#progItems tr.pfold .fcnt { color: var(--muted); font-size: 11px;
                            margin-left: 8px; }
#progItems tr.pfold .fren, #progItems tr.pfold .fdel {
  padding: 0 5px; background: none; border: none; color: var(--muted);
  margin-left: 4px; }
#progItems tr.pfold .fren { margin-left: 10px; }
#progItems tr.pfold .fren:hover { color: var(--accent); }
#progItems tr.pfold .fdel { color: #d05a52; }
#progItems tr.pfold .fdel:hover { color: #ff8177; }
#progItems tr.proot { cursor: default; }
#progItems tr.proot td { color: var(--muted); font-size: 11px;
                         text-transform: uppercase; letter-spacing: .04em; }
#btnNewFolder, #btnNewProg { white-space: nowrap; }
body.viewer #btnNewFolder, body.viewer #btnNewProg,
body.viewer .fren, body.viewer .fdel {
  display: none !important; }

/* доступ к папкам (админка): кнопка + раскрывающийся список чекбоксов */
.accWrap { position: relative; display: inline-block; }
.accWrap > button { font-size: 12px; padding: 2px 8px; }
.accBox { position: absolute; left: 0; top: 100%; z-index: 5;
          background: var(--panel2); border: 1px solid var(--border);
          border-radius: 6px; padding: 8px 10px; min-width: 210px;
          box-shadow: 0 8px 24px rgba(0,0,0,.45);
          display: flex; flex-direction: column; gap: 4px; }
.accBox[hidden] { display: none; }
.accBox label { display: flex; gap: 6px; align-items: center;
                justify-content: flex-start; font-size: 12px;
                white-space: nowrap; }
.accAll { color: var(--muted); }

/* ---------- окно «Команды» (справочник G/M выбранной стойки) ---------- */
#cmdList { width: 340px; flex: none; background: var(--field);
           border: 1px solid var(--border); border-radius: 8px;
           max-height: 62vh; overflow: auto; padding: 4px 0; }
#cmdList .cmdGrp { color: var(--muted); font-size: 11px;
                   text-transform: uppercase; letter-spacing: .05em;
                   padding: 8px 12px 3px; }
#cmdList .cmdIt { padding: 4px 12px; cursor: pointer; display: flex;
                  gap: 8px; }
#cmdList .cmdIt:hover { background: var(--panel2); }
#cmdList .cmdIt.active { background: #2a3d63; }
#cmdList .cmdIt b { font-family: ui-monospace, Menlo, monospace;
                    width: 104px; flex: none; font-weight: 600; }
#cmdList .cmdIt span { color: var(--muted); font-size: 12px;
                       white-space: nowrap; overflow: hidden;
                       text-overflow: ellipsis; }
#cmdDet { flex: 1; min-width: 460px; max-width: 640px; }
#cmdFmt { background: var(--field); border: 1px solid var(--border);
          border-radius: 6px; padding: 8px 12px; margin-bottom: 8px;
          font: 13px ui-monospace, Menlo, monospace; }
#cmdDesc { margin: 6px 0 10px; }
#cmdDesc .cmdRef { color: var(--muted); font-size: 12px; }
.cmdBadge { display: inline-block; font-size: 11px; border-radius: 4px;
            padding: 1px 8px; margin-left: 8px; vertical-align: 1px;
            white-space: nowrap; }
.cmdBadge.bSim { background: rgba(74,222,128,.15); color: #4ade80;
                 border: 1px solid #2c5e40; }
.cmdBadge.bIgn { background: rgba(230,194,92,.12); color: #e6c25c;
                 border: 1px solid #6b5a10; }
.cmdBadge.bNo  { background: rgba(255,129,119,.12); color: #ff8177;
                 border: 1px solid #6e3a36; }
#cmdParamsT { border-collapse: collapse; width: 100%; font-size: 12px; }
#cmdParamsT th, #cmdParamsT td { text-align: left; padding: 4px 8px;
  border-bottom: 1px solid var(--border); }
#cmdParamsT th { color: var(--muted); font-weight: 500; }
#cmdParamsT td.cAdr { font-family: ui-monospace, Menlo, monospace;
                      font-weight: 600; white-space: nowrap; }
#cmdParamsT td.cNote { color: var(--muted); }
#cmdDlg .hint { color: var(--muted); font-size: 12px; }
body.viewer #cmdInsert, body.viewer #cmdHint { display: none !important; }

/* ---------- оборудование: станки и флешки ---------- */
#eqTabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border);
          margin-bottom: 10px; }
.eqTab { background: none; border: none; border-radius: 0;
         padding: 6px 14px; color: var(--muted);
         border-bottom: 2px solid transparent; }
.eqTab:hover { background: var(--panel2); }
.eqTab.active { color: var(--accent); border-bottom-color: var(--accent); }
.eqTable { border-collapse: collapse; width: 100%; font-size: 12px; }
.eqTable th, .eqTable td { text-align: left; padding: 5px 8px;
  border-bottom: 1px solid var(--border); vertical-align: top; }
.eqTable th { color: var(--muted); font-weight: 500; }
.eqTable .eqSer { font-family: ui-monospace, Menlo, monospace; }
.eqTable .eqActs { white-space: nowrap; }
.eqTable .eqActs button { padding: 1px 6px; background: none; border: none;
                          color: var(--muted); }
.eqTable .eqActs button:hover { color: var(--accent); }
.eqEmpty { color: var(--muted); text-align: center; padding: 14px; }
.eqDot { display: inline-block; width: 9px; height: 9px; border-radius: 50%;
         margin-right: 6px; vertical-align: -1px; }
.eqDot.on { background: #4ade80; }
.eqDot.off { background: #5d6878; }
.eqCmd.done { color: #4ade80; }
.eqCmd.error, .eqCmd.expired { color: #ff8177; }
.eqCmd.queued, .eqCmd.sent { color: #e6c25c; }
.eqForm { border: 1px solid var(--border); border-radius: 8px;
          padding: 10px 12px; margin-top: 10px; }
.eqFRow { display: flex; gap: 12px; flex-wrap: wrap; }
.eqForm label { display: flex; flex-direction: column; gap: 3px;
                color: var(--muted); font-size: 12px; }
.eqForm input, .eqForm select { min-width: 150px; }
.eqFWide { margin-top: 8px; }
.eqFWide textarea { width: 100%; resize: vertical; background: var(--field);
                    color: var(--text); border: 1px solid var(--border);
                    border-radius: 6px; padding: 4px 7px; font: inherit; }
.eqFBtns { display: flex; gap: 8px; margin-top: 10px; }
.eqFoot { margin-top: 10px; }
#devToken { color: #e6c25c; border: 1px solid #6b5a10; border-radius: 6px;
            padding: 6px 10px; margin-top: 8px; word-break: break-all;
            font-size: 12px; }
#eqDlg .hint { color: var(--muted); font-size: 11px; }
.devSt { margin-top: 2px; white-space: nowrap; }

/* иконка «редактировать» ✏ — крупнее и заметнее, без роста строк */
#progItems .pren, #progItems tr.pfold .fren,
.eqTable .eqActs button {
  font-size: 15px; line-height: 1; }
#progItems .pren, #progItems tr.pfold .fren { color: #aab6c8; }
.eqTable .eqActs button { color: #aab6c8; }
.eqTable .eqActs button:last-child { color: #d05a52; }
.eqTable .eqActs button:last-child:hover { color: #ff8177; }
#progItems .pren svg, #progItems tr.pfold .fren svg,
.eqTable .eqActs button svg { vertical-align: -2px; }

/* ---------- задания ---------- */
.jobSt.idle, .jobSt.loading { color: var(--muted); }
.jobSt.loaded { color: #4ade80; font-weight: 600; }
/* статус работы: создано — нейтрально, в работе — акцент, выполнено —
   зелёное, отменено — приглушённое зачёркнутое */
.jobWsLine { display: flex; gap: 6px; align-items: baseline; }
.jobWs { font-weight: 600; }
.jobWs.new { color: var(--text); font-weight: 500; }
.jobWs.work { color: #facc15; }
.jobWs.done { color: #4ade80; }
.jobWs.canceled { color: var(--muted); text-decoration: line-through; }
.jobPcs { color: var(--muted); font-size: 11px; white-space: nowrap; }
/* действия: очередной шаг — кнопкой, остальное — в меню «⋯» */
.jobActs { display: flex; gap: 4px; align-items: center;
           margin-top: 4px; position: relative; }
.jobActs button { padding: 2px 8px; }
.jobMore { padding: 2px 7px; line-height: 1; }
.jobMenu { position: absolute; top: calc(100% + 3px); left: 0; z-index: 30;
           background: var(--field); border: 1px solid var(--border);
           border-radius: 6px; padding: 3px; min-width: 160px;
           box-shadow: 0 8px 20px rgba(0, 0, 0, .45); }
.jobMenu button { display: block; width: 100%; text-align: left;
                  background: none; border: none; color: var(--text);
                  padding: 5px 8px; border-radius: 4px;
                  white-space: nowrap; }
.jobMenu.up { top: auto; bottom: calc(100% + 3px); }
.jobMenu button:hover { background: var(--border); }
.jobParts { width: 72px; margin: 2px 4px 2px 0; }
.jobHist { color: var(--muted); font-size: 11px; line-height: 16px; }
.jobHistBox { max-height: 80px; /* 5 строк, дальше — прокрутка */
              overflow-y: auto; }
#jobFilters { display: flex; gap: 14px; align-items: center;
              margin-bottom: 10px; flex-wrap: wrap; }
#jobFilters label { display: flex; gap: 6px; align-items: center;
                    color: var(--muted); font-size: 12px; }
/* «Только мои» — главный фильтр смены: крупнее прочих и заметно
   подсвечен, когда включён */
#jobFilters label.fltMine { font-size: 14px; font-weight: 600;
                            color: var(--text); cursor: pointer;
                            padding: 5px 12px; border-radius: 16px;
                            border: 1px solid var(--border); }
#jobFilters label.fltMine:hover { border-color: var(--accent); }
#jobFilters label.fltMine.on { background: var(--accent); color: #fff;
                               border-color: var(--accent); }
.fltMine input { width: 15px; height: 15px; accent-color: var(--accent); }
.fltMine.on input { accent-color: #fff; }
.fltSep { width: 1px; align-self: stretch; background: var(--border); }
/* минимум 10 заданий видно без прокрутки диалога; ширина колонок
   фиксирована — появление кнопок «Загрузить»/«Удалить файл» и длинные
   записи истории не меняют ширину окна и не дают горизонтальный скролл */
#jobScroll { min-height: 560px; max-height: 66vh;
             overflow-y: auto; overflow-x: hidden; }
#jobScroll .eqTable { table-layout: fixed; }
#jobScroll .eqTable th:nth-child(1) { width: 130px; } /* станок */
#jobScroll .eqTable th:nth-child(2) { width: 110px; } /* оператор */
#jobScroll .eqTable th:nth-child(3) { width: 150px; } /* программа */
#jobScroll .eqTable th:nth-child(4) { width: 180px; } /* файл + загрузка */
#jobScroll .eqTable th:nth-child(5) { width: 160px; } /* работа */
#jobScroll .eqTable th:nth-child(7) { width: 60px; }  /* действия */
/* комментарий технолога исполнителю: виден в задании и на телефоне */
.jobNote { color: var(--muted); font-size: 11px; margin-top: 3px;
           display: flex; gap: 4px; align-items: baseline;
           overflow-wrap: anywhere; }
.jobNoteEdit { padding: 0 4px; background: none; border: none;
               color: var(--muted); line-height: 1; }
.jobNoteEdit:hover { background: none; color: var(--accent); }
.jobNoteInp { width: 100%; font-size: 11px; }
.jobFname { font-family: ui-monospace, Menlo, monospace;
            overflow-wrap: anywhere; margin-bottom: 2px; }
/* история — вся оставшаяся ширина (~450px при полной ширине окна) */
#jobScroll .eqTable td { overflow-wrap: break-word; }
#jobPager { display: flex; gap: 10px; align-items: center;
            justify-content: center; margin-top: 8px; }
#jobPager button { padding: 2px 12px; }
#devLogBox { border: 1px solid var(--border); border-radius: 8px;
             padding: 8px 12px; margin-top: 10px; }
#devLogItems { max-height: 200px; overflow-y: auto; font-size: 12px;
               color: var(--text); }
#devLogItems div { padding: 1px 0; border-bottom: 1px dotted #2a3346; }
#devLogPager { display: flex; gap: 10px; align-items: center;
               justify-content: center; margin-top: 6px; font-size: 12px; }
#devLogPager button { padding: 1px 10px; }
#jcText { background: var(--field); border: 1px solid var(--border);
          border-radius: 6px; padding: 8px 12px; margin: 0;
          font: 12px/1.5 ui-monospace, Menlo, Consolas, monospace;
          max-height: 62vh; overflow: auto; min-width: 300px;
          color: var(--text); }
#jcDiff { background: var(--field); border: 1px solid var(--border);
          border-radius: 6px; font-size: 12px; max-height: 62vh;
          overflow: auto; display: grid; grid-template-columns: 1fr 1fr;
          align-content: start; min-width: 420px;
          font-family: ui-monospace, Menlo, Consolas, monospace; }
#jcDiff .dcell { padding: 0 8px; white-space: pre; min-height: 18px;
                 line-height: 18px; }
#jcDiff .dctx { color: var(--muted); }
#jcDiff .ddel { color: #ff8177; background: rgba(255,129,119,.13); }
#jcDiff .dadd { color: #4ade80; background: rgba(74,222,128,.13); }
#jcDiff .dempty { background: rgba(138,148,166,.07); }
.verJob { margin-left: 8px; font-size: 10px; color: #4f8cff;
          border: 1px solid #35548c; border-radius: 4px; padding: 0 5px;
          vertical-align: 1px; white-space: nowrap; }
.jobBtns { display: flex; gap: 6px; margin-top: 5px; flex-wrap: wrap; }
.jobBtns button { padding: 2px 10px; font-size: 12px; }

/* ---------- отчёты по заданиям ---------- */
#repTabs { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
#repFilters { display: flex; gap: 14px; align-items: center;
              margin-bottom: 10px; flex-wrap: wrap; }
#repFilters label, #rfDates { display: flex; gap: 6px; align-items: center;
                              color: var(--muted); font-size: 12px; }
#rfDates { gap: 12px; }
#repFilters input[type=date] { color-scheme: dark; }
/* высота окна не скачет при смене вкладки: у всех отчётов одна рамка */
#repBody { min-height: 460px; max-height: 66vh; overflow: auto; }
#repFoot { display: flex; gap: 8px; align-items: center;
           justify-content: flex-end; margin-top: 10px; }
#repHint { margin-right: auto; text-align: left; }
#repDlg .hint { color: var(--muted); font-size: 11px; }

/* сводка: плитки показателей, главные цифры — крупно */
.repTiles { display: grid; gap: 10px; grid-template-columns: repeat(4, 1fr); }
.repTile { background: var(--panel2); border: 1px solid var(--border);
           border-radius: 8px; padding: 10px 12px; }
.repTile .rtVal { font-size: 22px; line-height: 1.2; color: var(--text); }
.repTile .rtCap { font-size: 11px; color: var(--muted); margin-top: 2px; }
.repTile.rtWide { grid-column: span 2; }
.repTile.rtKey { border-color: var(--accent-dim); }
.repTile.rtKey .rtVal { color: var(--accent); }
.repSect { margin: 14px 0 6px; font-size: 12px; color: var(--muted); }

/* таблицы отчётов: цифры вправо, первая колонка — подпись строки */
.repTable td.num, .repTable th.num { text-align: right;
  font-variant-numeric: tabular-nums; }
.repTable td.rname { color: var(--text); }
.repTable tr.repTot td { border-top: 1px solid var(--border);
                         color: var(--text); font-weight: 600; }
.repTable td.dim { color: var(--muted); }
/* динамика: столбик прямо в строке таблицы — график без библиотек */
.repBar { display: block; height: 10px; border-radius: 3px;
          background: var(--accent); min-width: 2px; }
.repBarCell { width: 220px; }
.repBarWrap { background: var(--field); border-radius: 3px; }

/* ---------- фрезерный режим: два 3D-окна ---------- */
.barGrp { display: contents; }
.barGrp[hidden] { display: none; }
#cvSolid, #cvPath { flex: 1; min-width: 0; min-height: 0; display: block;
                    background: #fff; border-radius: 10px;
                    box-shadow: 0 2px 12px rgba(0,0,0,.35); }
#cvSolid[hidden] { display: none; }
/* окно твердотельной симуляции обёрнуто в solidWrap ради панели
   «шпиндель/СОЖ» поверх WebGL (как machinePanel токарной 2D-канвы) */
#solidWrap { flex: 1; position: relative; min-width: 0; min-height: 0; }
#solidWrap[hidden] { display: none; }
#solidWrap #cvSolid { position: absolute; inset: 0; width: 100%; height: 100%; }
#millMachine { position: absolute; right: 10px; top: 8px; text-align: right;
               font: 13px sans-serif; pointer-events: none; user-select: none; }
#millMachine #mmSpin { display: block; color: #333; }
#millMachine #mmSpin.stop { color: #888; }
#millMachine #mmCool { display: inline-block; margin-top: 3px; }
#millMachine #mmCool svg { fill: currentColor; vertical-align: -2px; }
#millMachine #mmCool.on { color: #2e86d4; }
#millMachine #mmCool.off { color: #9aa2ad; text-decoration: line-through;
                           text-decoration-color: #7d8a99; }
#btnOrigin.picking { background: var(--accent-dim); border-color: #41669f; }
/* легенда «цветов резания» в твердотельном окне */
#solidLegend { position: absolute; left: 10px; top: 8px; font: 12px sans-serif;
               color: #333; pointer-events: none; user-select: none; }
#solidLegend .slSw { display: inline-block; width: 10px; height: 10px;
                     border-radius: 2px; vertical-align: -1px; }
/* окно траектории обёрнуто в pathWrap ради HTML-легенды поверх WebGL */
#pathWrap { flex: 1; position: relative; min-width: 0; min-height: 0; }
#pathWrap[hidden] { display: none; }
#pathWrap #cvPath { position: absolute; inset: 0; width: 100%; height: 100%; }
#pathLegend { position: absolute; left: 10px; top: 8px; font: 12px sans-serif;
              line-height: 16px; pointer-events: none; user-select: none; }
#pathLegend .plRapid { color: #d04040; }
#pathLegend .plFeed { color: #1a5ad8; }
#pathLegend .plStock { color: #7d8a99; }
#millView .grp { font-size: 12px; }
#millStock input { width: 52px; }

/* ---------- база инструмента окружения ---------- */
#etTabs { display: flex; gap: 4px; margin-bottom: 8px; }
#etTabs .tab { padding: 5px 14px; }
#etCols { display: flex; gap: 14px; }
#etScroll { min-height: 260px; max-height: 56vh; overflow-y: auto; flex: 1; }
#etSide { width: 284px; flex: none; }
#etSide pre { max-height: 140px; overflow-y: auto; }
.viewTabs { display: flex; gap: 4px; margin-bottom: 6px; }
.viewTabs .tab { padding: 3px 12px; }
#gtList { width: 100%; }
#globalDlg .dlgCols > div:last-child { min-width: 0; }
#gtCount { color: var(--muted); margin-top: 4px; }
#gtParams { border-top: 1px solid var(--border); margin-top: 6px;
            padding-top: 6px; }
#gtParams label { display: flex; justify-content: space-between; gap: 8px;
                  align-items: center; margin: 4px 0; }
#gtParams input, #gtParams select { width: 96px; }
#etEmpty { color: var(--muted); padding: 18px; text-align: center; }
#etItems tr { cursor: pointer; }
#etItems tr:hover { background: var(--panel2); }
#etItems tr.sel { background: var(--accent-dim); }
#manParams label { display: flex; justify-content: space-between; gap: 8px;
                   align-items: center; margin: 4px 0; }
#manParams input { width: 72px; }
#ptEmpty { color: var(--muted); margin: 6px 0; }
#ptDrill { border-top: 1px solid var(--line, #444); margin-top: 6px;
           padding-top: 6px; }
#ptCycForm label { display: flex; justify-content: space-between; gap: 8px;
                   align-items: center; margin: 4px 0; }
#ptCycForm input { width: 64px; }
#ptCycCode { max-height: 150px; overflow-y: auto; }