/* Shared desktop finish. Loaded after feature CSS; no state, canvas-coordinate or customer-widget rules. */
:root {
 --desk-ink:#242c3c;--desk-body:#485161;--desk-muted:#818897;--desk-line:#e2e5ed;
 --desk-canvas:#f5f6fb;--desk-white:#fff;--desk-blue:#347fc1;--desk-blue-soft:#edf4fb;
 --desk-shadow:0 7px 24px #242c3c06,0 1px 3px #242c3c03;
 --ink:var(--desk-ink);--muted:var(--desk-muted);--line:var(--desk-line);--surface:var(--desk-canvas);
 --dark:var(--desk-blue);--accent:var(--desk-blue);--accent-soft:var(--desk-blue-soft);--radius:22px;
}
body { background:var(--desk-canvas); }
@media(min-width:601px) {
 html:has(#app:not([hidden])),body:has(#app:not([hidden])) { overflow:hidden; }
}
.app-layout { grid-template-columns:250px minmax(0,1fr);color:var(--desk-body); }
.app-layout .admin-main { background:var(--desk-canvas); }
.app-layout .page-heading h1 { color:var(--desk-ink);font-weight:720;letter-spacing:-.04em; }
.app-layout .page-heading .muted { color:var(--desk-muted); }
.app-layout .connection-state { color:#818b95; }
.app-layout .connection-state i { background:#5aaa87; }
.app-layout .connection-state.offline { color:#9a712f; }
.app-layout .connection-state.offline i { background:#c39444; }
.app-layout .heading-stat,.app-layout .stat-label { color:var(--desk-muted); }
.app-layout .heading-stat strong { color:#444d5d; }
.app-layout .stat-label .ui-svg { color:#98a3b2; }
.app-layout .admin-main:has(#dashboard-view:not([hidden])) .page-heading { width:calc(100% - 8px);max-width:1400px;min-height:110px;margin:0 auto 20px;border-bottom:1px solid var(--desk-line); }
.app-layout .admin-main:has(#dashboard-view:not([hidden])) .page-heading h1 { font-size:30px; }
.app-layout .admin-main:has(#dashboard-view:not([hidden])) .connection-state { top:40px; }
@media(max-width:1200px) {
 .app-layout .admin-main:has(#dashboard-view:not([hidden])) .page-heading h1 { font-size:26px; }
}
@media(max-width:600px) {
 .app-layout .admin-main:has(#dashboard-view:not([hidden])) .page-heading { min-height:100px;margin-bottom:16px; }
}

/* Navigation: neutral labels and small colored icon tiles, using the existing SVGs. */
.app-layout .sidebar { background:#fff;border-color:var(--desk-line);padding-inline:12px;scrollbar-color:#dce0e9 transparent; }
.app-layout .sidebar-logo { min-width:0;gap:8px;padding-inline:18px;min-height:84px;margin-inline:-12px;margin-bottom:22px;border-color:var(--desk-line);flex-wrap:wrap; }
.app-layout .sidebar-logo .wordmark { min-width:0;max-width:100%;color:var(--desk-ink);font-size:25px; }
.app-layout .wordmark span,.app-layout .wordmark .wordmark-text,.login-screen .wordmark span { color:var(--desk-ink); }
.app-layout .wordmark .wordmark-dot,.login-screen .wordmark .wordmark-dot { color:#5997ce; }
.app-layout .wordmark .brand-symbol,.login-screen .wordmark .brand-symbol { color:#6299cc; }
.app-layout .test-pill,.login-screen .test-pill { background:#f8f9fc;border-color:#e8eaf0;color:#959dac;border-radius:5px; }
.app-layout .sidebar-workspace { display:none;margin-bottom:23px;gap:10px; }
.app-layout .sidebar-workspace>div { min-width:0;flex:1; }
.app-layout .sidebar-workspace strong { color:#454e5e;font-weight:650; }
.app-layout .sidebar-workspace small { color:var(--desk-muted);white-space:normal;word-break:keep-all;overflow-wrap:anywhere; }
.app-layout .workspace-symbol { background:#f0f6f5;border-color:#e4eeeb;color:#73a496;border-radius:10px; }
.app-layout .nav-label { color:var(--desk-muted);letter-spacing:.01em; }
.app-layout .brand-filter,.app-layout .sidebar-action { color:#626977;border-radius:11px;min-height:44px;gap:10px; }
.app-layout .brand-filter { --nav-icon-bg:#eef4fc;--nav-icon-color:#6998cf; }
.app-layout .brand-filter[data-brand="all"] { --nav-icon-bg:#eaf2fd;--nav-icon-color:#5e92d0; }
.app-layout .brand-filter[data-brand="a"] { --nav-icon-bg:#edf7f2;--nav-icon-color:#66a18a; }
.app-layout .brand-filter[data-brand="b"] { --nav-icon-bg:#f3f0fb;--nav-icon-color:#9990c3; }
.app-layout .brand-filter[data-brand="c"] { --nav-icon-bg:#fdf5e8;--nav-icon-color:#c4a066; }
.app-layout .brand-filter[data-brand="d"] { --nav-icon-bg:#eef5fb;--nav-icon-color:#6e9cbf; }
.app-layout .sidebar-action { --nav-icon-bg:#f0f3f8;--nav-icon-color:#8b9cb2;position:relative;isolation:isolate; }
.app-layout .brand-filter:hover,.app-layout .sidebar-action:hover { background:#f6f8fc;color:#3c4d61; }
.app-layout .brand-filter.active,.app-layout .sidebar-action.active,.app-layout .sidebar-action[aria-current="page"] { background:#edf4fb;color:#3d648b;border-color:transparent;font-weight:650; }
.app-layout .brand-filter.active:after { background:#619bd1; }
.app-layout .brand-filter .nav-svg,.app-layout .sidebar-action .nav-svg { width:24px;height:24px;padding:4px;border-radius:7px;background:linear-gradient(145deg,#ffffff80,var(--nav-icon-bg));color:var(--nav-icon-color);box-shadow:inset 0 1px 0 #ffffffb3; }
.app-layout .sidebar-action:before { width:16px;height:16px;margin:4px;color:var(--nav-icon-color); }
.app-layout .sidebar-action:after { content:'';position:absolute;z-index:-1;left:11px;top:50%;width:24px;height:24px;transform:translateY(-50%);border-radius:7px;background:linear-gradient(145deg,#ffffff80,var(--nav-icon-bg));box-shadow:inset 0 1px 0 #ffffffb3;pointer-events:none; }
.app-layout .sidebar-action:has(.nav-svg):after { display:none; }
.app-layout #dashboard-menu-button { --nav-icon-bg:#eaf2fd;--nav-icon-color:#6398d1; }
.app-layout #statistics-menu-button { --nav-icon-bg:#fff5e7;--nav-icon-color:#c5a060; }
.app-layout #guide-menu-button { --nav-icon-bg:#f1effa;--nav-icon-color:#9a8bbd; }
.app-layout #routing-button { --nav-icon-bg:#edf6f4;--nav-icon-color:#70a597; }
.app-layout #sound-toggle-button { --nav-icon-bg:#fcf5e9;--nav-icon-color:#baa16d; }
.app-layout #customer-test-link { --nav-icon-bg:#eef4fb;--nav-icon-color:#7a9fc6; }
.app-layout #logout-button { --nav-icon-bg:#f1f3f7;--nav-icon-color:var(--desk-muted); }
.app-layout .sidebar-bottom .sidebar-action { min-height:38px; }
.app-layout .brand-count { background:#f0f2f7;color:var(--desk-muted);border-radius:6px; }
.app-layout .brand-filter.active .brand-count { background:#fff;color:#71859c; }
.app-layout .brand-unread,.app-layout .brand-filter.active .brand-unread { background:#6a9fd0;border-radius:6px; }
.app-layout .sidebar-divider { background:#eceef3; }
.app-layout .sidebar-footnote { color:var(--desk-muted); }

/* Common controls stay compact; only the primary action carries a solid accent. */
.app-layout .primary-button,.login-screen .primary-button,.app-layout .send-button { background:var(--desk-blue);border-color:var(--desk-blue);border-radius:10px;color:#fff;box-shadow:0 2px 5px #347fc112; }
.app-layout .primary-button:hover,.login-screen .primary-button:hover,.app-layout .send-button:hover { background:#2a70af;border-color:#2a70af; }
.app-layout .outline-button,.app-layout .link-action,.statistics-refresh-button { background:#fff;border-color:var(--desk-line);border-radius:10px;color:#677182; }
.app-layout .outline-button:hover,.app-layout .link-action:hover,.statistics-refresh-button:hover { background:#f8f9fc;border-color:#cdd7e5;color:#465d76; }
.app-layout button:focus-visible,.app-layout a:focus-visible,.login-screen button:focus-visible,.login-screen a:focus-visible { outline-color:#91b5db; }
.app-layout input,.app-layout textarea,.app-layout select,.login-screen input { border-color:var(--desk-line);color:var(--desk-ink); }
.app-layout input:focus,.app-layout textarea:focus,.app-layout select:focus,.login-screen input:focus { border-color:#9bb9d9;box-shadow:0 0 0 3px #347fc10c; }
.app-layout input::placeholder,.app-layout textarea::placeholder,.login-screen input::placeholder { color:#9ba3b0; }
.app-layout .error,.app-layout .app-error { border-color:#f0dede;background:#fff8f7;color:#ab6861;border-radius:11px; }

/* Inbox: keep the established split and conversation space, soften its frame. */
.app-layout .admin-main:has(#inbox-view:not([hidden])) { background:var(--desk-canvas); }
.app-layout .admin-main:has(#inbox-view:not([hidden])) .page-heading { background:#fff;border-color:var(--desk-line); }
.app-layout .workspace { margin:0 12px 10px;border:1px solid var(--desk-line);border-radius:20px;box-shadow:var(--desk-shadow); }
.app-layout .inbox { background:#fafbfe;border-color:#e8ebf2; }
.app-layout .inbox-title h2 { color:#3b4455; }
.app-layout .inbox-title h2 span { background:#edf1f8;color:#8595aa; }
.app-layout .conversation-search input { background:#fff;border-color:#e5e8f0;border-radius:11px;color:var(--desk-ink); }
.app-layout .conversation-search>.ui-svg { color:#9ca7b6; }
.app-layout .status-filters { border-color:#e6e9f0;border-radius:11px;background:#f0f2f8; }
.app-layout .status-filters button { color:var(--desk-muted); }
.app-layout .status-filters button.active { background:#fff;color:#546d8a;box-shadow:0 1px 4px #242c3c08; }
.app-layout .conversation-row { border-radius:12px; }
.app-layout .conversation-row:hover { background:#f3f5fa; }
.app-layout .conversation-row.selected { border-color:#dbe2ed;background:#fff;box-shadow:0 3px 10px #242c3c04; }
.app-layout .row-title { color:#323b4d; }
.app-layout .row-phone { color:var(--desk-muted); }
.app-layout .row-preview,.app-layout .row-brand,.app-layout .row-time { color:var(--desk-muted); }
.app-layout .brand-dot,.app-layout .row-title .new-dot { background:#8ba8c9; }
.app-layout .new-badge { background:#6a9fd0;color:#fff;border-radius:5px; }
.app-layout .row-status,.app-layout .status-chip { border-color:transparent;background:#f0f2f7;color:#969eab;border-radius:7px; }
.app-layout .row-status.active,.app-layout .status-chip.active { background:#edf6f0;color:#66947c; }
.app-layout .row-status.waiting,.app-layout .status-chip.waiting { background:#fcf5e8;color:#b39561; }
.app-layout .row-status.closed,.app-layout .status-chip.closed { background:#f0f2f6;color:#969eab; }
.app-layout .inbox-footnote { color:var(--desk-muted);border-color:#eceef4; }
.app-layout .conversation-heading { border-color:#eceef3; }
.app-layout .conversation-heading h2 { color:var(--desk-ink); }
.app-layout .conversation-heading p { color:var(--desk-muted); }
.app-layout .selected-avatar { border-color:#e8ecf3;background:#f1f4fa;color:#8ba0ba;border-radius:12px; }
.app-layout .selected-avatar[data-brand="a"] { background:#eff6f2;color:#8aad9b; }
.app-layout .customer-details { background:#fff;border-color:#eceef3; }
.app-layout .customer-panel-heading { border-color:#eceef3; }
.app-layout .customer-panel-heading h3,.app-layout .customer-section-title { color:#454e5e; }
.app-layout .customer-panel-heading .ui-svg,.app-layout .customer-section-title .ui-svg { color:#92a3bb; }
.app-layout .customer-panel-heading span,.app-layout .contact-label,.app-layout .contact-verification,.app-layout .conversation-link-hint { color:var(--desk-muted); }
.app-layout .customer-contact strong,.app-layout .customer-contact a { color:#465060; }
.app-layout .customer-section-title,.app-layout .conversation-link-tools { border-color:#eceef3; }
.app-layout .handoff-step { color:var(--desk-muted); }
.app-layout .handoff-step.done { color:#719a85; }
.app-layout .handoff-step:before { border-color:#e0e6ef; }
.app-layout .customer-presence { color:#b09b75; }
.app-layout .customer-presence.online { color:#6c9a82; }
.app-layout .context-bar { border-color:#eceef3;background:#fafbfe;color:var(--desk-muted); }
.app-layout .context-bar strong { color:#77869a; }
.app-layout .message-label,.app-layout .message-time { color:var(--desk-muted); }
.app-layout .message-bubble { border-color:#e8ebf2;border-radius:5px 16px 16px 16px;background:#fff;color:var(--desk-ink); }
.app-layout .staff .message-bubble { border-color:#e7eaf4;border-radius:16px 5px 16px 16px;background:#f1f4fb;color:var(--desk-ink); }
.app-layout .system .message-bubble { background:transparent;color:var(--desk-muted); }
.app-layout .profile-card { border-color:#e2e7ef;border-radius:15px;color:#485161; }
.app-layout .profile-title { color:#485161; }
.app-layout .profile-description { color:var(--desk-muted); }
.app-layout .profile-cta,.app-layout .message-link { background:#f1f5fb;color:#6b8eb4;border-color:#e3e9f2; }
.app-layout .composer { border-color:#e0e5ee;border-radius:15px;box-shadow:0 3px 12px #242c3c04; }
.app-layout .composer textarea { color:#3e4758; }
.app-layout .composer:focus-within { border-color:#aac0da;box-shadow:0 0 0 3px #347fc108; }
.app-layout .close-action,.app-layout .composer-hint,.app-layout .keyboard-hint kbd { color:var(--desk-muted); }
.app-layout .keyboard-hint kbd { border-color:#e6eaf0;background:#fafbfe; }
.app-layout .sms-config-note { color:#b09b75; }
.app-layout .closed-note { border-color:#eceef3;background:#fafbfe;color:var(--desk-muted); }
.app-layout .page-footnote { color:var(--desk-muted); }
.app-layout .admin-main:has(#inbox-view:not([hidden])) .page-footnote { border-color:transparent;background:var(--desk-canvas); }

/* Statistics and common sheets use the spacious white-card hierarchy in the reference. */
.app-layout .statistics-filter-card,.app-layout .statistics-table-card,.app-layout .statistics-summary article,.app-layout .statistics-summary article:first-child { border-color:var(--desk-line);border-radius:22px;background:#fff;box-shadow:var(--desk-shadow); }
.app-layout .statistics-summary { gap:16px; }
.app-layout .statistics-summary p,.app-layout .statistics-summary article:first-child p { color:var(--desk-muted); }
.app-layout .statistics-summary strong,.app-layout .statistics-summary article:first-child strong { color:var(--desk-ink);font-weight:700; }
.app-layout .metric-icon { background:#eef4fc;color:#7ba4d3;border-radius:11px; }
.app-layout .metric-icon.mint { background:#eff7f2;color:#87b39b; }
.app-layout .metric-icon.lavender { background:#f3f0fa;color:#a396c3; }
.app-layout .metric-icon.sand { background:#fdf5e8;color:#c8ae78; }
.app-layout .statistics-brand-field label,.app-layout .statistics-field-label,.app-layout .statistics-custom-dates label { color:var(--desk-muted); }
.app-layout .statistics-range-presets { border:1px solid #eceef4;border-radius:999px;padding:3px;background:#eff1f7;gap:3px; }
.app-layout .statistics-range-presets button { border-radius:999px;background:transparent;color:var(--desk-muted); }
.app-layout .statistics-range-presets button.active { background:#fff;color:#596779;box-shadow:0 2px 4px #242c3c09; }
.app-layout .statistics-range-caption,.app-layout .statistics-count-note { color:var(--desk-muted); }
.app-layout .statistics-table-card>header { border-color:#eceef3;background:#fcfcff; }
.app-layout .statistics-table-card h2 { color:#3b4455; }
.app-layout .statistics-table-card h2 .ui-svg { color:#91a5bd; }
.app-layout .statistics-table-card header p,.app-layout .statistics-table-card header>span { color:var(--desk-muted); }
.app-layout .statistics-table th { border-color:#eceef3;background:#fcfcff;color:var(--desk-muted); }
.app-layout .statistics-table td,.app-layout .statistics-brand-toggle { border-color:#eef0f5;color:var(--desk-body); }
.app-layout .statistics-outlet-table { border-color:#eceef3;background:#fafbfe; }
.app-layout .statistics-outlet-table th,.app-layout .statistics-outlet-table td { color:var(--desk-muted);border-color:#eceef3; }

/* Surface and ink overrides only: preserve every flow grid track, node coordinate and pointer target. */
.guide-view,.flow-preview-dialog,.flow-help-dialog {
 --flow-ink:#242c3c;--flow-body:#485161;--flow-muted:#818897;--flow-line:#e2e5ed;
 --flow-blue:#347fc1;--flow-blue-soft:#edf4fb;--flow-paper:#f5f6fb;
}
.guide-view .guide-toolbar,.guide-view .flow-map,.guide-view .guide-editor-card,.guide-view .flow-live-preview { border-color:var(--desk-line);border-radius:20px;background:#fff;box-shadow:var(--desk-shadow); }
.guide-view .guide-toolbar { border-radius:18px; }
.guide-view .guide-unsaved,.guide-view .guide-view-note { color:var(--desk-muted); }
.guide-view .guide-unsaved.dirty { color:#b0925e; }
.guide-view .flow-save { border-color:var(--desk-line);background:#fff;color:#6f7c8f;box-shadow:none; }
.guide-view .flow-publish { border-color:var(--desk-blue);background:var(--desk-blue); }
.guide-view .flow-map-toolbar,.guide-view .flow-map-hint,.guide-view .guide-editor-heading { border-color:#eceef3;background:#fff; }
.guide-view .flow-map-heading strong,.guide-view .guide-editor-heading h2 { color:#3d4657; }
.guide-view .flow-tool,.guide-view .flow-step-type select,.guide-view .flow-action-fields select { border-color:var(--desk-line);border-radius:9px;background:#fff;color:#636b79; }
.guide-view .flow-add,.guide-view .flow-test,.guide-view .flow-mode-toggle[aria-pressed="true"],.guide-view .flow-inspector-toggle[aria-expanded="true"] { border-color:#dce5f0;background:#f0f5fb;color:#7295bd; }
.guide-view .flow-tool:hover { border-color:#b9cbe0;background:#f7f9fc;color:#567a9f; }
.guide-view .flow-floating-tools { border-color:#e1e6ef;border-radius:14px;background:#fffffffa;box-shadow:0 5px 18px #242c3c0b; }
.guide-view .flow-floating-tools .flow-tool { border-color:transparent;background:transparent; }
.guide-view .flow-floating-tools .flow-mode-toggle[aria-pressed="true"] { background:#eef3f9;color:#7295bd; }
.guide-view .flow-node { border-color:#e3e6eb;border-radius:12px;background:#fff;box-shadow:0 2px 5px #242c3c04; }
.guide-view .flow-node.selected { border-color:#b6cbe2;box-shadow:0 0 0 2px #347fc108,0 2px 6px #242c3c05; }
.guide-view .flow-node-title { color:var(--desk-ink); }
.guide-view .flow-node-text { color:var(--desk-body); }
.guide-view .flow-node-type,.guide-view .flow-node-order,.guide-view .flow-map-hint,.guide-view .flow-map-heading span { color:var(--desk-muted); }
.guide-view .flow-node-mark { border-radius:5px;background:#edf3fc;color:#80a3ce; }
.guide-view .flow-node[data-type="message"] .flow-node-mark { background:#f3f0fb;color:#a696c4; }
.guide-view .flow-node[data-type="handoff"] .flow-node-mark { background:#eef7f3;color:#83aa9a; }
.guide-view .flow-node[data-type="end"] .flow-node-mark { background:#fdf6e9;color:#c3aa78; }
.guide-view .flow-node-actions button { border-color:#e6eaf1;border-radius:6px;color:var(--desk-muted); }
.guide-view .flow-node-actions .flow-add-choice { border-color:#dfe8f2;background:#f2f6fb;color:#7d9dc1; }
.guide-view .flow-choice-count { border-color:#e5eaf2;color:#9ca6b4; }
.guide-view .flow-node-outputs,.guide-view .flow-output-row { border-color:#edf0f5; }
.guide-view .flow-output-row { color:var(--desk-body); }
.guide-view .flow-edge { stroke:#d3d7dd; }.guide-view .flow-edge.selected { stroke:#b6c5d8; }.guide-view .flow-edges marker path { fill:#bec4cc; }
.guide-view .flow-port { background:transparent;color:#77818c;box-shadow:none; }
.guide-view .flow-port:hover,.guide-view .flow-port:focus-visible { background:#eef4fb;box-shadow:0 0 0 1px #d3deeb; }
.guide-view .flow-node-input { background:#c7d3e3;box-shadow:0 0 0 1px #e1e7f0; }
.guide-view .guide-fields>label,.guide-view .flow-step-type label,.guide-view .flow-action-fields label,.guide-view .guide-button-heading h3 { color:#626977; }
.guide-view .guide-field-hint,.guide-view .flow-type-description,.guide-view .flow-step-note,.guide-view .guide-button-heading p,.guide-view .guide-reachability { color:var(--desk-muted); }
.guide-view .guide-fields>input,.guide-view .guide-fields>textarea,.guide-view .guide-button-fields input,.guide-view .guide-button-fields select,.guide-view .guide-global-settings input,.guide-view .guide-global-settings textarea { border-color:var(--desk-line);border-radius:10px;background:#fff;color:var(--desk-body); }
.guide-view .flow-live-preview { --flp-ink:#242c3c;--flp-body:#485161;--flp-muted:#818897;--flp-line:#e2e5ed;--flp-blue:#347fc1; }
.guide-view .flp-modes { border-color:#e9ecf2;border-radius:10px;background:#f1f3f8; }
.guide-view .flp-modes button { color:var(--desk-muted); }.guide-view .flp-modes button[aria-pressed="true"] { border-color:#e1e6ee;background:#fff;color:#7395bb;box-shadow:0 1px 4px #242c3c05; }
.guide-view .flp-edit-current { border-color:#e6eaf1;border-radius:8px;background:#fff;color:var(--desk-muted); }
.guide-view .flp-phone { border-color:#e3e8f0;border-radius:21px; }
.guide-view .flp-chat-header,.guide-view .flp-chat-footer,.guide-view .flp-choices { border-color:#edf0f5; }
.guide-view .flp-avatar { border-color:#e8edf4;background:#f8fafd;color:#89a7ca; }
.guide-view .flp-chat-title { color:var(--desk-ink); }.guide-view .flp-chat-brand,.guide-view .flp-author { color:var(--desk-muted); }
.guide-view .flp-bubble { color:var(--desk-ink); }.guide-view .flp-message.customer .flp-bubble { background:#edf3fb;border-color:#e3eaf5;color:#536b86; }
.guide-view .flp-choice { border-color:#e3e9f1;border-radius:11px;background:#fff;color:var(--desk-body); }.guide-view .flp-choice:hover { border-color:#c6d6e8;background:#f6f9fc;color:#476585; }
.guide-view .flp-composer { border-color:#e5eaf1;border-radius:12px;background:#fafbfe; }.guide-view .flp-composer-text { color:#a7afbb; }.guide-view .flp-composer>button { background:#edf1f6;color:#a2adbb; }

.app-layout .no-conversation h2,.app-layout .list-empty strong { color:var(--desk-ink); }
.app-layout .no-conversation p,.app-layout .empty-guide,.app-layout .list-empty,.app-layout .environment-details summary,.app-layout .environment-details>p { color:var(--desk-muted); }
.app-layout .empty-guide .ui-svg,.app-layout .environment-label .ui-svg { color:#9ca7b7; }
/* Existing statistics CSS pins these colors; match only those declarations. */
.app-layout .statistics-number,.app-layout .statistics-outlet-table .statistics-number { color:var(--desk-ink)!important; }
.app-layout .statistics-date,.app-layout .statistics-table-placeholder,.app-layout .statistics-empty { color:var(--desk-muted)!important; }
.routing-dialog .field-label,.routing-dialog .enable-label,.routing-dialog .outlet-card label.field-label { color:#626977; }
.routing-dialog .routing-explanation { color:var(--desk-muted); }
.routing-dialog .routing-explanation p,.help-dialog .help-note { border-color:var(--desk-line);background:#fafbfe; }

/* Login and utility sheets belong to the same quiet visual system. */
.login-screen { background:var(--desk-canvas); }
.login-screen .login-card { border-color:var(--desk-line);border-radius:24px;background:#fff;box-shadow:0 16px 48px #242c3c08; }
.login-screen .login-heading h1 { color:#354052; }.login-screen .login-card>.muted,.login-screen .login-card label,.login-screen .test-account,.login-screen .test-account code,.login-screen .text-link { color:#8a95a5; }
.login-screen input { border-radius:11px;background:#fff; }
.routing-dialog,.help-dialog,.conversation-link-dialog,.flow-preview-dialog,.flow-help-dialog { border-color:var(--desk-line);border-radius:22px;background:#fff;color:#596576;box-shadow:0 20px 65px #242c3c16; }
.dialog-header h2,.flow-preview-heading,.flow-help-dialog h2 { color:#424d60; }
.dialog-description,.routing-help,.help-note,.help-steps p,.conversation-link-copy-help,.conversation-link-local-note,.help-counter-notes p { color:var(--desk-muted); }
.icon-button { background:#f4f6fa;color:#97a4b5;border-radius:9px; }
.outlet-card { border-color:#e5eaf2;border-radius:13px;background:#fafbfe; }
.outlet-card h3,.help-steps h3,.help-counter-notes h3 { color:#657387; }
.toast { border-radius:13px;background:#48566a;box-shadow:0 6px 24px #242c3c14; }

/* Sidebar widths leave the validated flow tracks and chat controls usable at1040px. */
@media(max-width:1399px) and (min-width:1000px) {
 .app-layout { grid-template-columns:220px minmax(0,1fr); }
 .app-layout .sidebar-logo { padding-inline:14px;min-height:78px; }
 .app-layout .sidebar-logo .wordmark { font-size:23px; }
 .app-layout .sidebar-logo .brand-symbol { width:26px;height:26px; }
 .app-layout .sidebar-logo .test-pill { font-size:8px;padding:2px 4px; }
}
@media(max-width:999px) and (min-width:801px) {
 .app-layout { grid-template-columns:180px minmax(0,1fr); }
 .app-layout .sidebar-logo { padding-inline:10px;min-height:76px;gap:5px; }
 .app-layout .sidebar-logo .wordmark { font-size:21px; }
 .app-layout .sidebar-logo .brand-symbol { width:23px;height:23px;margin-right:4px; }
 .app-layout .sidebar-logo .test-pill { font-size:8px;padding:2px 3px; }
 .app-layout .brand-filter,.app-layout .sidebar-action { gap:7px;padding-inline:9px;font-size:12px; }
 .app-layout .sidebar-action:after { left:9px; }
 .app-layout .sidebar-workspace { margin-inline:0;padding-inline:4px; }
 .app-layout .sidebar-workspace small { font-size:10px; }
}
@media(max-width:800px) and (min-width:601px) {
 .app-layout { grid-template-columns:160px minmax(0,1fr); }
 .app-layout .sidebar-logo { padding-inline:10px;min-height:76px;gap:5px; }
 .app-layout .sidebar-logo .wordmark { font-size:20px; }
 .app-layout .sidebar-logo .brand-symbol { width:23px;height:23px;margin-right:4px; }
 .app-layout .sidebar-logo .test-pill { margin-left:0; }
 .app-layout .brand-filter,.app-layout .sidebar-action { padding-inline:8px;font-size:12px;gap:7px; }
 .app-layout .sidebar-action:after { left:8px; }
}
@media(max-width:800px) {
 .app-layout .workspace { margin-inline:8px;margin-bottom:8px;border-radius:17px; }
 .app-layout .statistics-filter-card,.app-layout .statistics-table-card,.app-layout .statistics-summary article,.app-layout .statistics-summary article:first-child { border-radius:18px; }
 .guide-view .guide-toolbar,.guide-view .flow-map,.guide-view .guide-editor-card,.guide-view .flow-live-preview { border-radius:17px; }
}
@media(max-width:600px) {
 .app-layout { display:block;height:auto; }
 .app-layout .sidebar { padding:14px 12px 10px; }
 .app-layout .sidebar-logo { min-height:0;margin:0 0 12px;padding:0 2px;border:0; }
 .app-layout .sidebar-logo .wordmark { font-size:22px; }
 .app-layout .brand-filter,.app-layout .sidebar-action { min-height:34px;padding:6px 9px;gap:6px;font-size:11px; }
 .app-layout .brand-filter .nav-svg,.app-layout .sidebar-action .nav-svg { width:23px;height:23px;padding:4px;border-radius:7px; }
 .app-layout .sidebar-action:before { width:15px;height:15px;margin:4px; }
 .app-layout .sidebar-action:after { left:9px;width:23px;height:23px;border-radius:7px; }
 .app-layout .sidebar-bottom .sidebar-action { min-height:30px; }
 .app-layout .sidebar-bottom { gap:7px 10px; }
 .app-layout .workspace { border-radius:15px; }
 .app-layout .statistics-summary { gap:10px; }
 .login-screen .login-card { border-radius:21px; }
}
@media(prefers-reduced-motion:reduce) { .app-layout button,.app-layout a,.login-screen button,.login-screen a { transition:none; } }