:root,[data-theme=light]{--font-sans: "IBM Plex Sans", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 10px;--primary: #171d2b;--primary-hover: #2a3350;--primary-active: #0f1420;--primary-bg: #e6e9f0;--primary-light: #5c6b94;--accent: #c2202e;--accent-hover: #a51d29;--accent-active: #8f1722;--accent-bg: #f7e9ea;--secondary: #1e5f8a;--secondary-hover: #1a5276;--secondary-active: #17496b;--secondary-bg: #e4edf5;--success: #2e7d4f;--success-bg: #e7f2ec;--warning: #b57a1e;--warning-bg: #f5edd8;--error: #c2202e;--error-bg: #f7e9ea;--info: #1e5f8a;--info-bg: #e4edf5;--text-primary: #171d2b;--text-secondary: #5c6472;--text-muted: #9aa0ab;--text-disabled: #c0c5cd;--text-inverse: #ffffff;--bg-app: #eceef1;--bg-primary: #ffffff;--bg-secondary: #f4f5f7;--bg-tertiary: #f9fafb;--bg-hover: #eceef1;--border-light: #edeff2;--border-medium: #e3e6eb;--border-dark: #d6dae1;--border-focus: #171d2b;--table-header: #d8d8d8;--table-header-border: #bbbbbb;--table-row-even: #c8e6c9;--table-row-odd: #e8f5e9;--table-row-hover: #a5d6a7;--table-row-selected: #81c784;--table-row-selected-ring: #4caf50;--shadow-light: 0 1px 2px rgba(23,29,43,.06);--shadow-medium: 0 2px 6px rgba(23,29,43,.1);--shadow-focus: 0 0 0 2px rgba(23,29,43,.18);--chart-current: #f44336;--chart-voltage: #2196f3;--chart-impedance: #ffc107;--chart-frequency: #9c27b0;--chart-range-upper: rgba(46,125,79,.28);--chart-range-lower: rgba(46,125,79,.16);--chart-grid-line: rgba(92,100,114,.2);--chart-axis-line: rgba(23,29,43,.1);--state-standby: #1e5f8a;--state-running: #b57a1e;--state-success: #2e7d4f;--state-error: #c2202e;--state-init: #7a5b48;--state-noequip: #6b7280;--state-calibration: #9c27b0;--state-offline: #6b7280;--device-1: #c2202e;--device-2: #1e5f8a;--device-3: #2e7d4f;--device-4: #b57a1e;--device-5: #9c27b0;--device-6: #8a8f38;--led-active: #2e7d4f;--led-active-glow: rgba(46,125,79,.5);--led-active-border: #256842;--led-inactive: #9aa0ab;--led-inactive-border: #c0c5cd;--led-border: #5c6472;--led-text: #171d2b;--encoder-track: #d6dae1;--encoder-grid: #e3e6eb;--encoder-marker: #5c6472}[data-theme=dark]{--primary: #8fa2c8;--primary-hover: #a5b6d8;--primary-active: #7b8fb8;--primary-bg: #232c40;--primary-light: #aab6d0;--accent: #e05563;--accent-hover: #e8707c;--accent-active: #c94550;--accent-bg: #33212a;--secondary: #5b9bc9;--secondary-hover: #71acd5;--secondary-active: #4785b3;--secondary-bg: #1c2938;--success: #4ba976;--success-bg: #1c2e24;--warning: #d99a3d;--warning-bg: #33291a;--error: #e05563;--error-bg: #33212a;--info: #5b9bc9;--info-bg: #1c2938;--text-primary: #e6e8ee;--text-secondary: #a7aebc;--text-muted: #7c8494;--text-disabled: #4c5462;--text-inverse: #171d2b;--bg-app: #12151c;--bg-primary: #1a1e28;--bg-secondary: #212633;--bg-tertiary: #283040;--bg-hover: #2e3648;--border-light: #262c3a;--border-medium: #303748;--border-dark: #3c4558;--border-focus: #8fa2c8;--table-header: #3a3a3a;--table-header-border: #555555;--table-row-even: #2a3a2c;--table-row-odd: #2d2d2d;--table-row-hover: #3a4a3c;--table-row-selected: #3d6b41;--table-row-selected-ring: #4caf50;--shadow-light: 0 1px 2px rgba(0,0,0,.3);--shadow-medium: 0 2px 6px rgba(0,0,0,.4);--shadow-focus: 0 0 0 2px rgba(143,162,200,.35);--chart-range-upper: rgba(75,169,118,.3);--chart-range-lower: rgba(75,169,118,.18);--chart-grid-line: rgba(167,174,188,.2);--chart-axis-line: rgba(230,232,238,.1);--state-standby: #5b9bc9;--state-running: #d99a3d;--state-success: #4ba976;--state-error: #e05563;--state-init: #a37a63;--state-noequip: #8b93a3;--state-calibration: #b565d6;--state-offline: #8b93a3;--led-active: #4ba976;--led-active-glow: rgba(75,169,118,.55);--led-active-border: #5cba87;--led-inactive: #4c5462;--led-inactive-border: #3c4558;--led-border: #3c4558;--led-text: #12151c;--encoder-track: #283040;--encoder-grid: #303748;--encoder-marker: #7c8494}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{font-family:var(--font-sans);font-size:14px;color:var(--text-primary);background:var(--bg-app)}button,input,select,textarea{font:inherit;color:inherit}.topbar{display:flex;align-items:center;gap:24px;background:var(--primary);color:var(--text-inverse);padding:0 20px;height:52px;flex-shrink:0}[data-theme=dark] .topbar{background:var(--bg-primary);color:var(--text-primary);border-bottom:1px solid var(--border-medium)}.app-shell{display:flex;flex-direction:column;height:100%}.topbar-brand{font-weight:700;font-size:15px;white-space:nowrap}.accent{color:var(--accent)}.topbar-nav{display:flex;gap:4px;flex:1;overflow-x:auto;height:100%}.topbar-nav a{display:flex;align-items:center;padding:0 14px;color:inherit;opacity:.72;text-decoration:none;font-weight:500;border-bottom:3px solid transparent;border-top:3px solid transparent;white-space:nowrap}.topbar-nav a:hover{opacity:1}.topbar-nav a.active{opacity:1;border-bottom-color:var(--accent)}.topbar-user{display:flex;align-items:center;gap:10px;font-size:13px;white-space:nowrap}.topbar-user .role{font-size:11px;padding:2px 8px;border-radius:99px;background:color-mix(in srgb,currentColor 14%,transparent)}.topbar .btn{background:transparent;border-color:color-mix(in srgb,currentColor 35%,transparent);color:inherit}.topbar .btn:hover:not(:disabled){background:color-mix(in srgb,currentColor 12%,transparent)}.main{flex:1;overflow:hidden;padding:20px;display:flex;flex-direction:column;gap:16px}.panel{background:var(--bg-primary);border:1px solid var(--border-medium);border-radius:var(--radius-lg);box-shadow:var(--shadow-light);display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-header{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border-light);flex-wrap:wrap}.panel-header h2{margin:0 auto 0 0;font-size:15px;font-weight:600}.panel-body{padding:16px;overflow:auto}.panel-body.no-pad{padding:0}.table-wrap{overflow:auto}table.data{width:100%;border-collapse:collapse;font-size:13.5px}table.data th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);font-weight:600;padding:8px 12px;border-bottom:1px solid var(--border-dark);background:var(--bg-secondary);position:sticky;top:0}table.data th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}table.data th.sortable:hover{color:var(--text-secondary)}table.data th .sort-arrow{display:inline-block;width:1em;margin-left:2px;font-size:9px}table.data td{padding:8px 12px;border-bottom:1px solid var(--border-light);vertical-align:middle}table.data tbody tr.clickable{cursor:pointer}table.data tbody tr.clickable:hover{background:var(--bg-hover)}table.data tbody tr.selected{background:var(--primary-bg);box-shadow:inset 2px 0 0 var(--primary)}.split.side tbody tr.selected{box-shadow:inset -2px 0 0 var(--primary)}table.data td.num,table.data th.num{text-align:right;font-variant-numeric:tabular-nums}.mono{font-family:var(--font-mono);font-size:12.5px}.muted{color:var(--text-muted)}.secondary{color:var(--text-secondary)}.badge{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;border-radius:99px;white-space:nowrap}.badge.green{background:var(--success-bg);color:var(--success)}.badge.red{background:var(--error-bg);color:var(--error)}.badge.orange{background:var(--warning-bg);color:var(--warning)}.badge.gray{background:var(--bg-secondary);color:var(--text-secondary)}--device-* tokens are reserved in this project and the CI has no other purple — navy primary wash until a dedicated CI token exists. */ .badge.purple{background:var(--primary-bg);color:var(--primary)}.badge.blue{background:var(--info-bg);color:var(--info)}.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--radius-md);border:1px solid var(--border-dark);background:var(--bg-primary);font-weight:500;font-size:13px;cursor:pointer;white-space:nowrap}.btn:hover:not(:disabled){background:var(--bg-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--primary);border-color:var(--primary);color:var(--text-inverse)}.btn.primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover)}.btn.danger{color:var(--error);border-color:color-mix(in srgb,var(--error) 35%,transparent)}.btn.danger:hover:not(:disabled){background:var(--error-bg)}.btn.sm{padding:4px 10px;font-size:12.5px}.btn.icon{padding:4px 7px;line-height:0}.item-thumb{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-sm);background:var(--bg-secondary);border:1px solid var(--border-light);overflow:hidden}.item-thumb img{width:100%;height:100%;object-fit:contain}.item-thumb.placeholder{color:var(--text-muted)}td.thumb-cell{width:44px;padding-top:4px;padding-bottom:4px}input.field,select.field,textarea.field{padding:7px 10px;border:1px solid var(--border-dark);border-radius:var(--radius-md);background:var(--bg-primary);min-width:0}input.field:focus,select.field:focus,textarea.field:focus{outline:none;border-color:var(--border-focus);box-shadow:var(--shadow-focus)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 16px}.form-field{display:flex;flex-direction:column;gap:4px}.form-field>label{font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.form-field .check{display:flex;align-items:center;gap:8px;font-size:13.5px;min-height:33px;color:var(--text-primary);text-transform:none;letter-spacing:normal}.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}.tabs{display:flex;gap:2px;border-bottom:1px solid var(--border-medium);padding:0 12px;overflow-x:auto}.tabs button{border:none;background:none;padding:10px 14px;font-weight:500;color:var(--text-secondary);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;white-space:nowrap}.tabs button:hover{color:var(--text-primary)}.tabs button.active{color:var(--text-primary);border-bottom-color:var(--accent);font-weight:600}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px 16px;z-index:50}.modal{background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-medium);width:100%;max-width:560px;max-height:84vh;display:flex;flex-direction:column}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border-light)}.modal-header h3{margin:0;font-size:15px}.modal-header button{border:none;background:none;font-size:18px;cursor:pointer;color:var(--text-muted);line-height:1}.modal-body{padding:18px;overflow:auto}.login-page{height:100%;display:flex;align-items:center;justify-content:center;background:var(--primary)}[data-theme=dark] .login-page{background:var(--bg-app)}.login-card{background:var(--bg-primary);border-radius:var(--radius-lg);padding:32px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-medium)}.login-card .logo{display:block;margin:0 auto;max-width:200px;height:auto}.login-card h1{margin:0;font-size:17px;text-align:center}.error-box{background:var(--error-bg);color:var(--error);border:1px solid color-mix(in srgb,var(--error) 25%,transparent);border-radius:var(--radius-md);padding:10px 12px;font-size:13px}.empty-state{padding:32px;text-align:center;color:var(--text-muted)}.screen{display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}.toolbar-panel{flex:0 0 auto}.toolbar-panel .panel-header{border-bottom:none}.split{display:flex;flex-direction:column;gap:16px;min-height:0;flex:1;position:relative}.detail-connector{position:absolute;z-index:5;pointer-events:none}.detail-connector.sm{transform:translateY(-50%)}.detail-connector.sm path{fill:var(--primary-bg);stroke:var(--primary);stroke-width:1}.detail-connector.full .funnel-fill{fill:var(--primary-bg)}.detail-connector.full .funnel-edge{fill:none;stroke:var(--primary);stroke-width:1}.split>.panel{min-height:0}.split>.panel>.panel-body{flex:1;min-height:0}.split:not(.side)>.panel:not(.master){flex:1}.split.stacked .master .table-scroll{max-height:40vh}.split.side{flex-direction:row;align-items:stretch}.split.side>.panel.master{flex:0 0 44%;min-width:380px}.split.side>.panel:not(.master){flex:1;min-width:0}.split.side>.panel{max-height:100%}.split.side .master .table-scroll,.split.side>.panel>.panel-body{flex:1;max-height:none}@media (max-width: 1100px){.split.side{flex-direction:column}.split.side>.panel.master{flex:initial;min-width:0}.split.side .master .table-scroll{max-height:40vh}}.kv-list{display:grid;grid-template-columns:max-content 1fr;gap:6px 20px;font-size:13.5px}.kv-list dt{color:var(--text-muted);font-weight:500}.kv-list dd{margin:0}.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.spinner{padding:24px;text-align:center;color:var(--text-muted)}
