/* Shared presentation only. Role checks, process colours and SVG geometry stay in their modules. */
body.scada-workspace {
  --ui-text: #274154;
  --ui-muted: #526a7c;
  --ui-border: #d5dde6;
  --ui-surface: #f6f9fc;
  --ui-hover: #edf2f6;
  --ui-good: #256e39;
  --ui-warning: #835300;
  --ui-danger: #aa2430;
  --ui-info: #215d92;
  --ok: var(--ui-good);
  --warn: var(--ui-warning);
  --danger: var(--ui-danger);
  --accent-soft: var(--ui-info);
  --radius: 6px;
}

body.scada-workspace .content,
body.scada-workspace :is(.modal, .mfa-dialog, .session-reauth-dialog) {
  color: var(--ui-text);
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0;
}
body.scada-workspace .operator-title h1 { font-size: 21px; line-height: 1.25; }
body.scada-workspace .operator-title p { font-size: 12px; }
body.scada-workspace .clock-panel strong { font-size: 16px; }
body.scada-workspace :is(h1, h2, h3, h4, h5, th, .eyebrow) { letter-spacing: 0; }
body.scada-workspace :is(.content, .modal) h2 { font-size: 18px; line-height: 1.35; }
body.scada-workspace :is(.content, .modal) h3 { font-size: 16px; line-height: 1.4; }
body.scada-workspace .content :is(.section-heading, .subsection-head, .overview-list-head) :is(h2, h3) { font-size: 16px; }
body.scada-workspace.dashboard-exo .dashboard-summary-only .scada-section-head h2 { font-size: 16px; }
body.scada-workspace.dashboard-exo .dashboard-status-head h2 { font-size: 16px; }
body.scada-workspace.dashboard-exo .dashboard-alarm-summary th { padding: 3px 5px; }
body.scada-workspace.dashboard-exo .dashboard-alarm-summary tbody th small { line-height: 1.3; }
body.scada-workspace.dashboard-exo .dashboard-summary-devices h3 { font-size: 12px; }
body.scada-workspace.dashboard-exo :is(.dashboard-section-link button, .dashboard-healthy-summary, .dashboard-summary-footer .dashboard-communication-summary button, .dashboard-maintenance-alert) { min-height: 28px; padding: 3px 0; font-size: 12px; line-height: 1.4; background: transparent; border: 0; }
body.scada-workspace.dashboard-exo .dashboard-section-link { padding-top: 4px; }
body.scada-workspace.dashboard-exo .dashboard-summary-only .dashboard-section-link button { color: #00518a; min-height: 24px; padding: 2px 0; }
body.scada-workspace.dashboard-exo .dashboard-summary-footer .dashboard-communication-summary button { min-height: 24px; padding: 2px 0; font-size: 12px; }
body.scada-workspace.dashboard-exo .dashboard-summary-footer .dashboard-mark-reviewed { min-height: 32px; padding: 5px 8px; font-size: 12px; }
body.scada-workspace.dashboard-exo .dashboard-alarm-filters :is(button, input) { min-height: 34px; padding: 6px 8px; font-size: 12px; }
body.scada-workspace :is(.content, .modal) :is(small, .muted) { font-size: 12px; }
body.scada-workspace .content :is(.card, .metric) { border-radius: 6px; box-shadow: none; }
body.scada-workspace .content .panel { border-radius: 0; box-shadow: none; background: transparent; border: 0; border-top: 1px solid #dde5ef; padding: 16px 0; }
body.scada-workspace .content .object-section { border-radius: 0; box-shadow: none; }
body.scada-workspace :is(#viewRoot, .overview-page, .object-list, .object-section, .panel, .device-tab-content) { min-width: 0; max-width: 100%; }
body.scada-workspace .content :is(.object-header, .section-heading) { flex-wrap: wrap; }
body.scada-workspace .object-header > div { min-width: 0; max-width: 100%; }
body.scada-workspace :is(.content, .modal) :is(table, .table-wrapper) { border-radius: 0; }
body.scada-workspace :is(.content, .modal) th { font-size: 12px; letter-spacing: 0; }
body.scada-workspace :is(.content, .modal) td { font-size: 14px; }
body.scada-workspace .content :is(.metric, .status-value-grid) strong { font-variant-numeric: tabular-nums; }

/* Forms inside authenticated screens do not inherit the larger login form controls. */
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) :is(button, input, select, textarea) {
  font-family: inherit;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0;
  border-radius: 3px;
}
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) :is(input:not([type='checkbox']):not([type='radio']):not([type='color']):not([type='range']), select) {
  min-height: 38px;
  min-width: 0;
  max-width: 100%;
  padding: 8px 10px;
  box-sizing: border-box;
}
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) label { font-size: 12px; }
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) button { min-height: 38px; padding: 8px 10px; }
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) button:is(.secondary, .table-action) {
  color: var(--ui-text);
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  box-shadow: none;
}
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) button:is(.secondary, .table-action):not(:disabled):hover {
  color: var(--ui-text);
  background: var(--ui-hover);
  border-color: #b8c8d5;
}
body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) :is(button, input, select, textarea, summary):focus-visible {
  outline: 2px solid #00518a;
  outline-offset: 3px;
}
body.scada-workspace :is(.content, .modal) :is(.table-action, .device-log-ranges button, .trend-range button, .dashboard-alarm-actions button) {
  min-height: 32px;
  padding: 5px 9px;
  font-size: 12px;
}
body.scada-workspace :is(.content, .modal) :is(.icon-button, .icon-action) {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  display: inline-grid;
  place-items: center;
}
body.scada-workspace :is(.content, .modal) button:is([aria-pressed='true'], .active):not(.nav-item):not(.mobile-nav-item):not(.icon-button):not([role='tab']) {
  color: #fff;
  background: #00518a;
  border-color: #00518a;
}
body.scada-workspace :is(.content, .modal) .trend-range button { border-radius: 0; }
body.scada-workspace :is(.content, .modal) .trend-range button:first-child { border-radius: 3px 0 0 3px; }
body.scada-workspace :is(.content, .modal) .trend-range button:last-child { border-radius: 0 3px 3px 0; }

/* Navigation is distinct from a segmented choice of time range or operating mode. */
body.scada-workspace :is(.system-tabs, .device-tabs, .operational-alarm-tabs) {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 100%;
  width: 100%;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--ui-border);
  border-radius: 0;
  background: transparent;
}
body.scada-workspace :is(.system-tabs, .device-tabs, .operational-alarm-tabs) button,
body.scada-workspace :is(.system-tabs, .device-tabs, .operational-alarm-tabs) button:is(.active, [aria-selected='true']) {
  min-height: 38px;
  padding: 8px 12px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--ui-muted);
  font-size: 14px;
  font-weight: 400;
  box-shadow: none;
}
body.scada-workspace :is(.system-tabs, .device-tabs, .operational-alarm-tabs) button:is(.active, [aria-selected='true']) { color: #00518a; border-bottom-color: #00518a; font-weight: 600; }
body.scada-workspace :is(.system-tabs, .device-tabs, .operational-alarm-tabs) button:hover { background: var(--ui-hover); color: #00518a; }

body.scada-workspace .status { font-size: 12px; line-height: 1.4; font-weight: 700; padding: 3px 8px; border-radius: 3px; }
body.scada-workspace .status.ok { color: var(--ui-good); background: #e6f4e7; }
body.scada-workspace .status:is(.warn, .warning) { color: var(--ui-warning); background: #fff2d5; }
body.scada-workspace .status.danger { color: var(--ui-danger); background: #fbe8e9; }
body.scada-workspace .status.info { color: var(--ui-info); background: #e8f1fb; }
body.scada-workspace .status.neutral { color: var(--ui-muted); background: #edf1f4; }
body.scada-workspace #viewRoot .status.ok { color: var(--ui-good); background: #e6f4e7; }
body.scada-workspace #viewRoot .status:is(.warn, .warning) { color: var(--ui-warning); background: #fff2d5; }
body.scada-workspace #viewRoot .status.danger { color: var(--ui-danger); background: #fbe8e9; }
body.scada-workspace #viewRoot .status.info { color: var(--ui-info); background: #e8f1fb; }
body.scada-workspace #viewRoot .status.neutral { color: var(--ui-muted); background: #edf1f4; }
body.scada-workspace .status:not(:has(.operational-icon, .workspace-icon, svg))::before { content: ''; width: 14px; height: 14px; flex: 0 0 14px; background: currentColor; mask: var(--workspace-icon) center / contain no-repeat; }
body.scada-workspace .status.ok { --workspace-icon: url('/icons/lucide/circle-check.svg'); }
body.scada-workspace .status:is(.warn, .warning) { --workspace-icon: url('/icons/lucide/triangle-alert.svg'); }
body.scada-workspace .status.danger { --workspace-icon: url('/icons/lucide/circle-alert.svg'); }
body.scada-workspace .status:is(.info, .neutral) { --workspace-icon: url('/icons/lucide/circle-help.svg'); }
body.scada-workspace :is(.status-line, [data-object-trend-profile-message]):not(.error) { color: var(--ui-good); }

body.scada-workspace :is(.modal, .mfa-dialog, .session-reauth-dialog) { border-radius: 8px; }
body.scada-workspace .modal-header { padding: 16px; align-items: center; }
body.scada-workspace .modal-header h2 { margin: 0; font-size: 18px; }
body.scada-workspace .modal-body { padding: 16px; }
body:is(.scada-workspace, .auth-screen) .modal-backdrop { z-index: 2000; }
.modal.message-dialog { width: min(520px, calc(100vw - 32px)); padding: 0; }
.message-dialog::backdrop { background: rgb(5 8 12 / 55%); }
.message-dialog [data-message-content] { margin: 0 0 16px; white-space: pre-wrap; overflow-wrap: anywhere; }
.message-dialog .form-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.workspace-toast-stack { position: fixed; bottom: 16px; right: 16px; z-index: 2100; display: grid; gap: 8px; width: min(400px, calc(100vw - 32px)); max-height: 50dvh; overflow-y: auto; }
.workspace-toast { display: grid; grid-template-columns: 16px minmax(0, 1fr) 32px; align-items: start; gap: 8px; padding: 12px; border: 1px solid #d5dde6; border-left: 3px solid var(--toast-color); border-radius: 3px; background: #fff; color: #274154; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; box-shadow: 0 3px 12px rgb(20 40 60 / 12%); }
.workspace-toast.is-success { --toast-color: #256e39; --workspace-icon: url('/icons/lucide/circle-check.svg'); }
.workspace-toast.is-warning { --toast-color: #835300; --workspace-icon: url('/icons/lucide/triangle-alert.svg'); }
.workspace-toast.is-error { --toast-color: #aa2430; --workspace-icon: url('/icons/lucide/circle-alert.svg'); }
.workspace-toast.is-info { --toast-color: #215d92; --workspace-icon: url('/icons/lucide/circle-help.svg'); }
.workspace-toast-mark { width: 16px; height: 16px; margin-top: 3px; background: var(--toast-color); mask: var(--workspace-icon) center / contain no-repeat; }
.workspace-toast-close { width: 32px; height: 32px; min-height: 32px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 3px; color: #526a7c; background: transparent; }
.workspace-toast-close:hover { background: #edf2f6; color: #274154; border: 0; }
.workspace-toast-close:focus-visible { outline: 2px solid #00518a; outline-offset: 2px; }
body:has(.session-expiry-warning:not([hidden])) .workspace-toast-stack { bottom: 160px; }
body.scada-workspace .mfa-dialog h2 { font-size: 18px; }
body.scada-workspace .session-reauth-dialog h2 { font-size: 18px; }
body.scada-workspace .mfa-dialog [name='code'] { font-family: monospace; font-size: 18px; }
body.scada-workspace .modal-header .workspace-close { color: var(--ui-text); background: var(--ui-surface); border: 1px solid var(--ui-border); }
body.scada-workspace .modal-header .workspace-close:hover { color: var(--ui-text); background: var(--ui-hover); border-color: #b8c8d5; }

body.scada-workspace #notificationButton {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 38px; padding: 8px 10px; border-radius: 3px;
  font-size: 14px; line-height: 1.4; font-weight: 400;
  color: var(--ui-text); background: var(--ui-surface); border: 1px solid var(--ui-border);
}
body.scada-workspace #notificationButton:hover { background: var(--ui-hover); border-color: #b8c8d5; }
body.scada-workspace #notificationButton::before { content: ''; width: 16px; height: 16px; flex: 0 0 16px; background: currentColor; mask: url('/icons/lucide/bell.svg') center / contain no-repeat; }

.workspace-icon { display: inline-block; width: 16px; height: 16px; flex: 0 0 16px; background: currentColor; mask: var(--workspace-icon) center / contain no-repeat; }
.workspace-icon-refresh { --workspace-icon: url('/icons/lucide/refresh-cw.svg'); }
.workspace-icon-close { --workspace-icon: url('/icons/lucide/x.svg'); }
body.scada-workspace .icon-button:is([data-close-modal], [data-synoptic-panel-close], [data-synoptic-quick-close], [data-preview-close], [data-bulk-close]):not(:has(.workspace-icon)) { font-size: 0; }
body.scada-workspace .icon-button:is([data-close-modal], [data-synoptic-panel-close], [data-synoptic-quick-close], [data-preview-close], [data-bulk-close]):not(:has(.workspace-icon))::before { content: ''; width: 16px; height: 16px; background: currentColor; mask: url('/icons/lucide/x.svg') center / contain no-repeat; }
body.scada-workspace .icon-button:is([data-remove-rule-condition], [data-remove-state-rule], [data-remove-controller-period], [data-remove-controller-holiday], [data-remove-schedule-rule]) { font-size: 0; }
body.scada-workspace .icon-button:is([data-remove-rule-condition], [data-remove-state-rule], [data-remove-controller-period], [data-remove-controller-holiday], [data-remove-schedule-rule])::before { content: ''; width: 16px; height: 16px; background: currentColor; mask: url('/icons/lucide/trash-2.svg') center / contain no-repeat; }
body.scada-workspace .sidebar-v2 .nav-item { display: flex; align-items: center; gap: 8px; }
body.scada-workspace .sidebar-v2 .nav-item:not(:has(.operational-icon))::before { content: ''; width: 16px; height: 16px; flex: 0 0 16px; background: currentColor; mask: var(--workspace-icon) center / contain no-repeat; }
.sidebar-v2 [data-view='dashboard'] { --workspace-icon: url('/icons/lucide/layout-dashboard.svg'); }
.sidebar-v2 [data-view='objects'] { --workspace-icon: url('/icons/lucide/building-2.svg'); }
.sidebar-v2 [data-view='alarms'] { --workspace-icon: url('/icons/lucide/bell.svg'); }
.sidebar-v2 [data-view='configuration'] { --workspace-icon: url('/icons/lucide/settings.svg'); }
.sidebar-v2 [data-view='users'] { --workspace-icon: url('/icons/lucide/users.svg'); }
.sidebar-v2 [data-view='system'] { --workspace-icon: url('/icons/lucide/server.svg'); }
body.scada-workspace .sidebar-v2 :is(.sidebar-object-summary, .sidebar-tree-filters button, .sidebar-alarm-summary button, .user-role) { font-size: 12px; }
body.scada-workspace .sidebar-v2 .sidebar-alarm-summary button,
body.scada-workspace .sidebar-v2 .sidebar-alarm-summary button:hover { min-height: 30px; padding: 5px 6px; transform: none; line-height: 1.4; }

/* Common actions retain their text, accessible names and existing event handlers. */
body.scada-workspace :is(#backToDevices, #exportObjectTrends, #openUserModal, [data-edit-user], [data-object-trends]:not(.operational-icon-action), [data-object-alarm-history]:not(.operational-icon-action), [data-object-trend-expand]) { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
body.scada-workspace :is(#backToDevices, #exportObjectTrends, #openUserModal, [data-edit-user], [data-object-trends]:not(.operational-icon-action), [data-object-alarm-history]:not(.operational-icon-action), [data-object-trend-expand])::before { content: ''; width: 16px; height: 16px; flex: 0 0 16px; background: currentColor; mask: var(--workspace-icon) center / contain no-repeat; }
#backToDevices { --workspace-icon: url('/icons/lucide/arrow-left.svg'); }
#exportObjectTrends { --workspace-icon: url('/icons/lucide/download.svg'); }
#openUserModal { --workspace-icon: url('/icons/lucide/plus.svg'); }
[data-edit-user] { --workspace-icon: url('/icons/lucide/pencil.svg'); }
[data-object-trends] { --workspace-icon: url('/icons/lucide/chart-no-axes-combined.svg'); }
[data-object-alarm-history] { --workspace-icon: url('/icons/lucide/history.svg'); }
[data-object-trend-expand] { --workspace-icon: url('/icons/lucide/maximize-2.svg'); }

body.scada-workspace .object-trend-profile-bar { display: flex; align-items: end; flex-wrap: wrap; gap: 8px 12px; }
body.scada-workspace .object-trend-profile-bar > label { flex: 1 1 220px; max-width: 420px; font-size: 12px; font-weight: 400; }
body.scada-workspace .object-trend-profile-bar > span { flex: 1 0 100%; font-size: 12px; }
body.scada-workspace .trend-profile-settings { flex: 1 1 240px; min-width: 0; }
body.scada-workspace .trend-profile-settings > summary { min-height: 38px; padding: 8px; box-sizing: border-box; cursor: pointer; }
body.scada-workspace .trend-profile-fields { display: grid; grid-template-columns: repeat(3, minmax(140px, 1fr)); gap: 12px; padding: 12px 0; }
body.scada-workspace .trend-profile-fields label { display: grid; gap: 4px; min-width: 0; font-weight: 400; }
body.scada-workspace .trend-profile-fields .object-trend-profile-default { display: flex; }
body.scada-workspace .trend-profile-fields [hidden] { display: none; }
body.scada-workspace details.object-trend-axis-panel { padding: 8px 0; margin-bottom: 8px; }
body.scada-workspace .object-trend-axis-panel > summary { cursor: pointer; padding: 6px 0; font-size: 13px; }
body.scada-workspace .object-trend-axis-panel header { justify-content: flex-end; }
body.scada-workspace .object-trend-controls { align-items: end; gap: 8px; }
body.scada-workspace .object-trend-controls .trend-range { align-self: end; }
body.scada-workspace .object-trend-color-palette button { width: 22px; height: 22px; min-height: 22px; padding: 0; border-radius: 3px; }
body.scada-workspace .object-trend-series-tools select { min-height: 32px; padding: 5px; font-size: 12px; }
body.scada-workspace .operational-fan-pair > span { display: grid; align-content: start; gap: 3px; min-width: 0; }
body.scada-workspace .operational-device-status .operational-fan-table { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 700px; gap: 24px; }
body.scada-workspace .operational-device-status :is(.operational-supply-pair, .operational-fan-table > section) { border: 0; padding: 0; }

/* Authentication keeps 44px targets and 16px inputs, including mobile browsers. */
body.auth-screen {
  --ui-text: #274154; --ui-muted: #526a7c; --ui-border: #bbcbd7;
  --ui-surface: #f6f9fc; --ui-hover: #edf2f6;
}
body.auth-screen .login-form h1 { font-size: 21px; }
body.auth-screen .login-form :is(input, button) { border-radius: 3px; letter-spacing: 0; }
body.auth-screen .auth-theme-toggle { border-radius: 3px; }
body.auth-screen .auth-theme-toggle > span { font-size: 0; }
body.auth-screen .auth-theme-toggle > span::before { content: ''; display: block; width: 20px; height: 20px; background: currentColor; mask: var(--workspace-icon) center / contain no-repeat; }
body.auth-screen .auth-theme-moon { --workspace-icon: url('/icons/lucide/moon.svg'); }
body.auth-screen .auth-theme-sun { --workspace-icon: url('/icons/lucide/sun.svg'); }
body.auth-screen :is(.modal, .mfa-dialog) { font-size: 14px; line-height: 1.5; border-radius: 8px; }
body.auth-screen :is(.modal, .mfa-dialog) h2 { font-size: 18px; }
body.auth-screen :is(.modal, .mfa-dialog) label { font-size: 13px; }
body.auth-screen :is(.modal, .mfa-dialog) :is(input, select, button) { font-size: 16px; line-height: 1.4; border-radius: 3px; }
body.auth-screen :is(.modal, .mfa-dialog) :is(input:not([type='checkbox']):not([type='radio']), select, button) { min-height: 44px; box-sizing: border-box; max-width: 100%; }
body.auth-screen :is(.modal, .mfa-dialog) button { font-size: 14px; }
body.auth-screen :is(.modal, .mfa-dialog) button.secondary { color: var(--ui-text); background: var(--ui-surface); border-color: var(--ui-border); }
body.auth-screen :is(.modal, .mfa-dialog) button.secondary:not(:disabled):hover { color: var(--ui-text); background: var(--ui-hover); }
body.auth-screen .mfa-dialog [name='code'] { font-family: monospace; font-size: 18px; }
body.auth-screen :is(.modal, .mfa-dialog) :is(button, input, select, summary):focus-visible { outline: 2px solid #005b96; outline-offset: 3px; }
html[data-auth-theme='dark'] body.auth-screen { --ui-text: #e4edef; --ui-muted: #acbebf; --ui-border: #455658; --ui-surface: #10181b; --ui-hover: #233438; }
html[data-auth-theme='dark'] .auth-screen :is(.modal, .mfa-dialog, .modal-header) { background: #10181b; color: #e4edef; border-color: #455658; }
html[data-auth-theme='dark'] .auth-screen :is(.modal, .mfa-dialog) :is(input, select) { background: #10181b; color: #edf4f4; border-color: #455658; }
html[data-auth-theme='dark'] .auth-screen :is(.modal, .mfa-dialog) button:not(.secondary):not(.ghost) { background: #69cec1; border-color: #69cec1; color: #0b2020; }
html[data-auth-theme='dark'] .auth-screen :is(.modal, .mfa-dialog) button.ghost { color: #69cec1; background: transparent; }
html[data-auth-theme='dark'] .auth-screen :is(.modal, .mfa-dialog) :is(button, input, select, summary):focus-visible { outline-color: #69cec1; }

@media (max-width: 700px) {
  .workspace-toast-stack { bottom: 76px; }
  body.scada-workspace :is(.content, .modal, .mfa-dialog, .session-reauth-dialog) :is(input:not([type='checkbox']):not([type='radio']):not([type='color']):not([type='range']), select, textarea) { font-size: 16px; }
  body.scada-workspace .trend-profile-fields { grid-template-columns: minmax(0, 1fr); }
  body.scada-workspace .trend-profile-settings { flex-basis: 100%; }
  body.scada-workspace .object-trend-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
  body.scada-workspace .object-trend-controls > :is(.trend-range, .trend-custom-range) { grid-column: 1 / -1; }
  body.scada-workspace .object-trend-controls > :is(button, label) { width: 100%; min-width: 0; }
  body.scada-workspace .modal-backdrop { padding: 12px; }
  body.scada-workspace .modal { max-height: calc(100dvh - 24px); }
  body.scada-workspace .operational-device-status .operational-fan-table { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  body.scada-workspace:not(.operational-user) #viewRoot table { display: block; max-width: 100%; overflow-x: auto; }
  body.scada-workspace .mobile-nav-item { font-size: 13px; border-radius: 0; }
}
@media (max-width: 600px) {
  body.scada-workspace .mobile-nav:not([hidden]) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-x: visible; min-height: 44px; padding-left: 4px; padding-right: 4px; }
  body.scada-workspace .mobile-nav:has(button:nth-child(5)) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.scada-workspace .content .mobile-nav-item { min-width: 0; min-height: 44px; padding: 5px 4px; font-size: 13px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; }
  body.scada-workspace:has(.mobile-nav button:nth-child(3)) .app-panel:not(.hidden) { padding-bottom: calc(106px + env(safe-area-inset-bottom)); }
  body.scada-workspace:has(.mobile-nav button:nth-child(3)) .workspace-toast-stack { bottom: calc(104px + env(safe-area-inset-bottom)); }
}
@media (pointer: coarse) {
  body.scada-workspace :is(.content, .modal) :is(.icon-button, .icon-action) { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
}
