/* V3.3.64: operational density, using the existing light/dark theme tokens. */
#appView #page-cnc-devices,
#appView #page-cnc-programs { min-width: 0; gap: 12px; }
#appView #page-cnc-devices[hidden],
#appView #page-cnc-programs[hidden] { display: none; }

#appView #page-cnc-devices .cnc-device-metrics {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
}
#appView #page-cnc-devices .cnc-device-metrics > div {
  min-width: 0;
  min-height: 86px;
  padding: 12px;
  gap: 5px;
  box-shadow: none;
}
#appView #page-cnc-devices .cnc-device-metrics span { font-size: 11px; line-height: 1.4; }
#appView #page-cnc-devices .cnc-device-metrics strong {
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}
#appView #page-cnc-devices .cnc-device-metrics small {
  min-width: 0;
  font-size: 10px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
#appView #page-cnc-devices .cnc-category-summary-panel { padding: 10px 14px; }
#appView #page-cnc-devices .cnc-category-summary-panel > .section-heading {
  min-height: 30px;
  margin: 0;
  gap: 10px;
}
#appView #page-cnc-devices .cnc-category-summary-panel h3 { font-size: 13px; }
#appView #page-cnc-devices #cncCategorySummaryCount { margin-left: auto; font-size: 11px; }
#appView #page-cnc-devices .cnc-category-summary { margin-top: 10px; gap: 8px; }
#appView #page-cnc-devices .cnc-category-summary article {
  min-height: 56px;
  padding: 9px 11px;
  border: 1px solid var(--line);
}
#appView #page-cnc-devices.pdl-categories-collapsed #cncCategorySummary { display: none; }
.pdl-layout-button {
  display: inline-flex;
  min-width: 32px;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--muted);
  background: var(--surface);
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  white-space: nowrap;
}
.pdl-layout-button svg { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pdl-layout-button:hover { color: var(--ink); background: var(--surface-soft); border-color: var(--line-strong); }
.pdl-layout-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pdl-layout-button[aria-pressed="true"] { color: var(--ink); border-color: var(--line-strong); background: var(--surface-soft); }
.pdl-layout-button .pdl-filter-count {
  display: inline-grid;
  min-width: 18px;
  min-height: 18px;
  padding: 1px 4px;
  place-items: center;
  border-radius: 4px;
  background: var(--surface-soft);
  color: var(--ink);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}
.pdl-layout-button .pdl-filter-count[hidden] { display: none; }
#appView #page-cnc-devices .cnc-device-filterbar {
  grid-template-columns: minmax(230px, 1fr) minmax(120px, 170px) minmax(120px, 170px) auto;
  align-items: center;
  gap: 8px;
  padding: 10px;
}
#appView #page-cnc-devices .cnc-device-filterbar > .search-input { grid-column: auto; }
#appView #page-cnc-devices .cnc-device-filterbar > .pdl-layout-button { height: 36px; }
#appView #page-cnc-devices .pdl-more-filters {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 220px));
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
#appView #page-cnc-devices .pdl-more-filters[hidden] { display: none; }
#appView #page-cnc-devices .pdl-more-filters label { min-width: 0; display: grid; gap: 5px; }
#appView #page-cnc-devices .pdl-more-filters label > span { color: var(--muted); font-size: 11px; }
#appView #page-cnc-devices .cnc-device-table-panel { min-width: 0; max-width: 100%; }
#appView #page-cnc-devices .cnc-device-table-panel .table-scroll {
  max-width: 100%;
  max-height: min(680px, calc(100dvh - 300px));
  min-height: 100px;
  overflow: auto;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
  padding-bottom: 3px;
}
#appView #page-cnc-devices .cnc-device-table-panel table { min-width: 1320px; border-collapse: separate; border-spacing: 0; }
#appView #page-cnc-devices .cnc-device-table-panel th,
#appView #page-cnc-devices .cnc-device-table-panel td { padding: 11px 13px; }
#appView #page-cnc-devices .cnc-device-table-panel thead th { position: sticky; top: 0; z-index: 3; background: var(--surface-soft); }
#appView #page-cnc-devices .cnc-device-table-panel th:first-child,
#appView #page-cnc-devices .cnc-device-table-panel td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 190px;
  min-width: 190px;
  max-width: 190px;
  background: var(--surface-solid, var(--surface));
  box-shadow: 1px 0 0 var(--line);
}
#appView #page-cnc-devices .cnc-device-identity { min-width: 0; gap: 4px; }
#appView #page-cnc-devices .cnc-device-identity strong { max-width: 164px; }
#appView #page-cnc-devices .cnc-device-table-panel .actions-column {
  position: sticky;
  right: 0;
  z-index: 2;
  width: 126px;
  min-width: 126px;
  max-width: 126px;
  padding: 8px;
  background: var(--surface-solid, var(--surface));
  box-shadow: -1px 0 0 var(--line);
}
#appView #page-cnc-devices .cnc-device-table-panel thead th:first-child,
#appView #page-cnc-devices .cnc-device-table-panel thead .actions-column { z-index: 4; background: var(--surface-soft); }
#appView #page-cnc-devices .cnc-device-table-panel thead th { background: var(--surface-solid, var(--surface)); }
#appView #page-cnc-devices .cnc-device-table-panel .table-action-group { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: 3px; }
#appView #page-cnc-devices .cnc-device-table-panel .table-action { width: 32px; height: 32px; min-width: 32px; padding: 6px; margin: 0; }
#appView #page-cnc-devices .cnc-device-table-panel tr:hover td:first-child,
#appView #page-cnc-devices .cnc-device-table-panel tr:hover td.actions-column { background: var(--surface-soft); }

#appView #page-cnc-programs .cnc-program-toolbar { gap: 12px; flex-wrap: wrap; }
#appView #page-cnc-programs .cnc-program-toolbar .toolbar-controls { flex-wrap: wrap; gap: 7px; }
#appView #page-cnc-programs .pdl-program-layout-tools { display: inline-flex; gap: 4px; align-items: center; }
#appView #page-cnc-programs .pdl-program-layout-tools .pdl-layout-button { min-height: 34px; }
#appView #page-cnc-programs .cnc-program-workspace {
  height: min(var(--cnc-workspace-height, var(--pdl-program-height, 600px)), var(--pdl-program-height, 600px));
  min-height: 0;
  grid-template-columns: minmax(175px, 210px) minmax(0, 1fr) minmax(235px, 285px);
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  gap: 10px;
}
#appView #page-cnc-programs .cnc-program-workspace > * { min-width: 0; min-height: 0; grid-column: auto; }
#appView #page-cnc-programs.pdl-library-collapsed .cnc-program-library,
#appView #page-cnc-programs.pdl-machine-collapsed .cnc-program-machine { display: none; }
#appView #page-cnc-programs.pdl-library-collapsed .cnc-program-workspace { grid-template-columns: minmax(0, 1fr) minmax(235px, 285px); }
#appView #page-cnc-programs.pdl-machine-collapsed .cnc-program-workspace { grid-template-columns: minmax(175px, 210px) minmax(0, 1fr); }
#appView #page-cnc-programs.pdl-library-collapsed.pdl-machine-collapsed .cnc-program-workspace { grid-template-columns: minmax(0, 1fr); }
#appView #page-cnc-programs .cnc-program-library,
#appView #page-cnc-programs .cnc-program-machine { padding: 10px; gap: 8px; }
#appView #page-cnc-programs .cnc-program-pane-heading,
#appView #page-cnc-programs .cnc-program-machine-heading { min-height: 30px; flex-shrink: 0; }
#appView #page-cnc-programs .cnc-program-library > input,
#appView #page-cnc-programs .cnc-program-device-select,
#appView #page-cnc-programs .cnc-program-batch-picker,
#appView #page-cnc-programs .cnc-program-device-facts,
#appView #page-cnc-programs .cnc-program-transfer { flex-shrink: 0; }
#appView #page-cnc-programs .cnc-program-library .cnc-program-list { min-height: 0; }
#appView #page-cnc-programs .cnc-program-editor-panel { height: auto; grid-template-rows: auto minmax(0, 1fr) auto 18px; }
#appView #page-cnc-programs .cnc-program-editor-meta { padding: 10px 12px; grid-template-columns: minmax(115px, .65fr) minmax(120px, 1fr) 32px; gap: 8px; }
#appView #page-cnc-programs .cnc-program-editor-meta .icon-button { width: 32px; min-width: 32px; }
#appView #page-cnc-programs .cnc-program-editor-footer { flex-wrap: wrap; min-height: 38px; padding: 5px 12px; gap: 6px 12px; }
#appView #page-cnc-programs .cnc-program-editor-footer > span { font-variant-numeric: tabular-nums; }
#appView #page-cnc-programs .cnc-code-editor { min-height: 90px; }
#appView #page-cnc-programs .cnc-program-machine { overflow-y: auto; scrollbar-width: thin; }
#appView #page-cnc-programs .cnc-program-machine .cnc-program-device-facts { min-height: 48px; padding: 8px; }
#appView #page-cnc-programs .cnc-program-machine .cnc-program-remote-list { flex: 1 1 auto; min-height: 40px; }
#appView #page-cnc-programs .cnc-program-machine .cnc-program-pane-empty { padding: 16px 8px; flex: 1 0 auto; }
#appView #page-cnc-programs .cnc-program-machine-actions {
  position: sticky;
  bottom: -10px;
  z-index: 3;
  flex-shrink: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 8px 0 2px;
  margin-top: auto;
  background: var(--surface-solid, var(--surface));
}
#appView #page-cnc-programs .cnc-program-machine-actions .button { min-height: 34px; line-height: 1.3; white-space: normal; }
#appView #page-cnc-programs #sendCncProgramBatchButton { grid-column: 1 / -1; }
#appView #page-cnc-programs.pdl-program-expanded {
  position: fixed;
  inset: 76px 12px 12px;
  z-index: 90;
  padding: 14px;
  overflow: auto;
  align-content: start;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
body.pdl-program-focus { overflow: hidden; }

@media (max-width: 1279px) {
  #appView #page-cnc-devices .cnc-device-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  #appView #page-cnc-devices .cnc-device-metrics > div { min-height: 76px; padding: 10px 12px; }
  #appView #page-cnc-programs .cnc-program-workspace { grid-template-columns: 175px minmax(0, 1fr) 235px; }
}
@media (max-width: 1000px) {
  #appView #page-cnc-devices .cnc-device-filterbar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  #appView #page-cnc-devices .cnc-device-filterbar > .search-input { grid-column: 1 / -1; }
  #appView #page-cnc-programs .cnc-program-toolbar > div:first-child { width: 100%; }
  #appView #page-cnc-programs .cnc-program-toolbar .toolbar-controls { width: 100%; }
}
@media (max-width: 840px) {
  #appView #page-cnc-programs .cnc-program-workspace { display: flex; flex-direction: column; height: auto; min-height: 0; }
  #appView #page-cnc-programs .cnc-program-editor-panel {
    flex: 0 0 auto;
    min-height: 320px;
    height: min(var(--cnc-mobile-editor-height, var(--pdl-mobile-height, 520px)), var(--pdl-mobile-height, 520px));
  }
  #appView #page-cnc-programs .cnc-program-library { max-height: 280px; flex: 0 0 auto; }
  #appView #page-cnc-programs .cnc-program-machine { min-height: 340px; max-height: 560px; flex: 0 0 auto; }
  #appView #page-cnc-programs .cnc-program-machine .cnc-program-remote-list { min-height: 80px; }
  #appView #page-cnc-programs.pdl-program-expanded { inset: 68px 8px 8px; padding: 10px; }
}
@media (max-width: 620px) {
  #appView #page-cnc-programs .cnc-program-toolbar .toolbar-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #appView #page-cnc-programs .cnc-program-toolbar .toolbar-controls > .button { width: 100%; min-width: 0; }
  #appView #page-cnc-devices .cnc-device-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #appView #page-cnc-devices .cnc-device-metrics > div { min-height: 77px; }
  #appView #page-cnc-devices .cnc-device-metrics strong { font-size: 22px; }
  #appView #page-cnc-devices .pdl-more-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #appView #page-cnc-devices .cnc-device-filterbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #appView #page-cnc-devices .cnc-device-filterbar > .pdl-layout-button { grid-column: 1 / -1; }
  #appView #page-cnc-devices .cnc-device-table-panel .table-scroll { max-height: 520px; }
  #appView #page-cnc-devices .cnc-device-table-panel th:first-child,
  #appView #page-cnc-devices .cnc-device-table-panel td:first-child { width: 156px; min-width: 156px; max-width: 156px; padding: 9px; }
  #appView #page-cnc-devices .cnc-device-identity strong { max-width: 137px; }
  #appView #page-cnc-devices .cnc-device-table-panel .actions-column { width: 116px; min-width: 116px; max-width: 116px; padding: 6px; }
  #appView #page-cnc-programs .pdl-program-layout-tools { grid-column: 1 / -1; width: 100%; }
  #appView #page-cnc-programs .pdl-program-layout-tools .pdl-layout-button { min-height: 40px; flex: 1; }
  #appView #page-cnc-programs .cnc-program-editor-meta { grid-template-columns: minmax(95px, .75fr) minmax(105px, 1fr) 28px; padding: 8px; gap: 6px; }
  #appView #page-cnc-programs .cnc-program-editor-meta .icon-button { width: 28px; min-width: 28px; }
  #appView #page-cnc-programs .cnc-program-editor-footer { gap: 5px 9px; padding: 6px 8px; }
  #appView #page-cnc-programs .cnc-editor-font-controls button { min-height: 32px; }
}