:root{--bg: #f6f8fc;--surface: #ffffff;--surface-2: #f0f4fa;--surface-hover: #e8eef8;--border: #dce3ee;--border-strong: #c4cfdf;--text: #172033;--text-muted: #61708a;--text-dim: #95a1b4;--accent: #2563eb;--accent-strong: #1d4ed8;--accent-soft: #e5edff;--accent-line: #bfd2ff;--green: #1f9d72;--green-soft: #e3f4ec;--amber: #d98a2b;--amber-soft: #f9eedb;--red: #d65745;--red-soft: #fae6e2;--lime: #6fae3a;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);--shadow-md: 0 8px 22px rgba(15, 23, 42, .08);--shadow-card: 0 1px 3px rgba(15, 23, 42, .05), 0 10px 30px -12px rgba(15, 23, 42, .12);--header-h: 68px;--radius: 12px;--radius-lg: 16px;--shell-max: 1380px;--shell-pad: 28px;font-size:14px;color-scheme:light}:root[data-theme=dark]{--bg: #111827;--surface: #182235;--surface-2: #202c40;--surface-hover: #293850;--border: #334155;--border-strong: #475569;--text: #eef4ff;--text-muted: #a9b6c9;--text-dim: #708096;--accent: #70a5ff;--accent-strong: #9bc2ff;--accent-soft: #1e3a66;--accent-line: #315789;--green-soft: #173d35;--amber-soft: #493719;--red-soft: #48252b;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .22);--shadow-md: 0 12px 28px rgba(0, 0, 0, .28);--shadow-card: 0 1px 3px rgba(0, 0, 0, .3), 0 10px 30px -12px rgba(0, 0, 0, .5);color-scheme:dark}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:Segoe UI Variable,Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}code,.mono{font-family:SF Mono,Fira Code,Cascadia Code,ui-monospace,monospace}.app{display:flex;flex-direction:column;height:100vh}.header{height:var(--header-h);min-height:var(--header-h);display:flex;align-items:center;gap:28px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;box-shadow:var(--shadow-sm)}.brand{display:flex;align-items:center;gap:12px}.brand-title{font-size:15px;font-weight:650;letter-spacing:-.2px}.brand-sub{font-size:10.5px;color:var(--text-muted);letter-spacing:.4px;margin-top:1px}.header-stats{display:flex;gap:26px;margin-left:8px}.hstat{display:flex;flex-direction:column;align-items:flex-start;gap:1px}.hstat-val{font-size:20px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.5px}.hstat-label{font-size:9.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted)}.header-conn{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:7px}.theme-toggle{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:8px;padding:6px 10px;background:var(--surface-2);color:var(--text-muted);font-size:11px;font-weight:650;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.theme-toggle:hover{background:var(--surface-hover);border-color:var(--border-strong);color:var(--text)}.theme-toggle span{font-size:14px;line-height:1}.conn-status{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:550;color:var(--text-muted);padding:3px 10px 3px 9px;border-radius:20px;background:var(--surface-2);border:1px solid var(--border)}.conn-dot{width:7px;height:7px;border-radius:50%;background:var(--text-dim)}.conn-status.connected{color:var(--green);background:var(--green-soft);border-color:transparent}.conn-status.connected .conn-dot{background:var(--green);box-shadow:0 0 0 3px #1f9d722e;animation:pulse 2.4s ease-in-out infinite}.conn-status.error{color:var(--red);background:var(--red-soft);border-color:transparent}.conn-status.error .conn-dot{background:var(--red)}.conn-meta{font-size:10px;color:var(--text-muted);font-family:SF Mono,ui-monospace,monospace;max-width:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.conn-input-row{display:flex;gap:6px}.conn-input{background:var(--surface-2);border:1px solid var(--border-strong);border-radius:8px;color:var(--text);font-size:11.5px;font-family:SF Mono,ui-monospace,monospace;padding:6px 10px;width:210px;outline:none;transition:border-color .15s,box-shadow .15s}.conn-input::placeholder{color:var(--text-dim)}.conn-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}.conn-btn{background:var(--accent);border:1px solid var(--accent-strong);border-radius:8px;color:#fff;cursor:pointer;font-size:11.5px;font-weight:600;padding:6px 16px;white-space:nowrap;transition:background .15s,transform .05s}.conn-btn:hover{background:var(--accent-strong)}.conn-btn:active{transform:translateY(1px)}.conn-btn:disabled{opacity:.55;cursor:default;transform:none}.tabs{height:46px;min-height:46px;display:flex;align-items:center;gap:4px;padding:0 20px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.tab-btn{height:28px;min-width:0;padding:0 12px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text-muted);cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.01em}.tab-btn:hover{color:var(--text);background:var(--surface-2)}.tab-btn.active{color:var(--accent-strong);background:var(--accent-soft);border-color:var(--accent-line)}.main{flex:1;display:grid;grid-template-columns:1fr auto auto;grid-template-rows:1fr;overflow:hidden}.resize-divider{width:4px;background:var(--border);cursor:col-resize;transition:background .15s;flex-shrink:0}.resize-divider:hover{background:var(--accent-line)}.device-col{grid-column:1}.stream-log{grid-column:3}.device-col{overflow-y:auto;padding:22px;display:flex;flex-direction:column;gap:18px}.device-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}.device-col::-webkit-scrollbar,.stream-body::-webkit-scrollbar{width:8px}.device-col::-webkit-scrollbar-thumb,.stream-body::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px;border:2px solid var(--bg)}.device-col::-webkit-scrollbar-track{background:transparent}.device-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow .2s,opacity .3s}.device-card:hover{box-shadow:var(--shadow-md)}.device-card.stale{opacity:.62}.device-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px}.device-id{display:flex;align-items:center;gap:11px;min-width:0}.device-avatar{width:34px;height:34px;border-radius:9px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px}.device-name{font-size:14px;font-weight:650;letter-spacing:-.2px}.device-addr{font-size:10.5px;color:var(--text-muted);font-family:SF Mono,ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.device-live{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap;flex-shrink:0}.device-live.on{color:var(--green);background:var(--green-soft)}.device-live.off{color:var(--text-muted);background:var(--surface-2)}.live-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.device-live.on .live-dot{box-shadow:0 0 0 3px #1f9d7233;animation:pulse 1.8s ease-in-out infinite}.device-metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border);background:var(--surface-2)}.metric{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 4px}.metric+.metric{border-left:1px solid var(--border)}.metric-val{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.3px}.metric-label{font-size:9px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted)}.categories{padding:14px 16px 16px;display:flex;flex-direction:column;gap:14px}.category-head{display:flex;align-items:center;gap:7px;margin-bottom:8px}.category-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.category-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--text)}.category-rate{margin-left:auto;font-size:9.5px;font-weight:600;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);padding:1px 7px;border-radius:10px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px}.field{display:flex;justify-content:space-between;align-items:baseline;padding:5px 9px;background:var(--surface-2);border:1px solid var(--border);border-radius:7px}.field-label{font-size:10.5px;color:var(--text-muted)}.field-value{font-size:12px;font-family:SF Mono,ui-monospace,monospace;font-variant-numeric:tabular-nums;font-weight:550;display:flex;align-items:baseline;gap:3px}.field-unit{font-size:9px;color:var(--text-dim);font-family:inherit}.no-fields{font-size:11.5px;color:var(--text-muted);padding:8px 0;text-align:center}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.panel-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted)}.panel-note{font-size:10px;color:var(--text-dim);line-height:1.5;margin-top:10px}.sync-panel{padding:16px 18px}.sync-rows{display:flex;flex-direction:column;gap:8px;margin-top:12px}.sync-row{display:flex;align-items:center;gap:12px}.sync-pair{font-size:12px;color:var(--text);flex:1}.sync-delta{font-family:SF Mono,ui-monospace,monospace;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;min-width:56px;text-align:right}.sync-delta.excellent{color:var(--green)}.sync-delta.good{color:var(--lime)}.sync-delta.fair{color:var(--amber)}.sync-delta.poor{color:var(--red)}.badge{font-size:9px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.5px;min-width:64px;text-align:center}.badge.excellent{background:var(--green-soft);color:var(--green)}.badge.good{background:#eef6e3;color:var(--lime)}.badge.fair{background:var(--amber-soft);color:var(--amber)}.badge.poor{background:var(--red-soft);color:var(--red)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:80px 24px;text-align:center;margin:auto 0}.empty-icon{width:56px;height:56px;border-radius:16px;background:var(--accent-soft);border:1.5px dashed var(--accent-line);position:relative}.empty-icon:after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2.5px solid var(--accent);border-right-color:transparent;animation:spin 1.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-title{font-size:16px;font-weight:650;color:var(--text)}.empty-body{font-size:12.5px;color:var(--text-muted);max-width:420px;line-height:1.65}.empty-hint{font-size:11.5px;color:var(--accent-strong);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:8px;padding:7px 14px}.stream-log{background:var(--surface);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}.stream-head{display:flex;align-items:center;gap:8px;height:48px;padding:0 18px;flex-shrink:0;border-bottom:1px solid var(--border)}.stream-count{margin-left:auto;font-size:10px;font-weight:700;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);padding:1px 8px;border-radius:10px;letter-spacing:0}.stream-body{flex:1;overflow-y:auto;padding:6px 0}.stream-empty{font-size:11.5px;color:var(--text-dim);text-align:center;padding:32px 0}.log-entry{display:grid;grid-template-columns:78px 52px 64px 1fr;gap:8px;align-items:baseline;padding:4px 18px;font-size:10.5px;border-bottom:1px solid transparent}.log-entry:hover{background:var(--surface-hover)}.log-time{color:var(--text-dim);font-family:SF Mono,ui-monospace,monospace}.log-device{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log-type{color:var(--text-muted);white-space:nowrap;font-weight:550}.log-summary{color:var(--text-muted);font-family:SF Mono,ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:880px){.main{grid-template-columns:1fr}.stream-log,.header-stats{display:none}}.settings-view{flex:1;overflow-y:auto;padding:22px}.settings-panel{max-width:760px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:20px}.settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-bottom:16px;border-bottom:1px solid var(--border)}.settings-title{font-size:15px;font-weight:700;color:var(--text)}.settings-subtitle{margin-top:4px;font-size:12px;color:var(--text-muted);line-height:1.5}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.settings-field{grid-column:1 / -1;display:flex;flex-direction:column;gap:7px;color:var(--text-muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px}.settings-input-row{display:flex;gap:8px;align-items:center}.settings-input{width:min(100%,360px)}.settings-detail{display:flex;flex-direction:column;gap:6px;padding:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px}.settings-detail span{font-size:10px;color:var(--text-muted);font-weight:700;letter-spacing:.6px;text-transform:uppercase}.settings-detail code{color:var(--text);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-error{margin-top:14px;padding:10px 12px;background:var(--red-soft);color:var(--red);border-radius:8px;font-size:12px}.db-panel{max-width:1180px}.db-controls{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px;margin-top:16px}.db-field{grid-column:auto}.db-overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:16px}.db-section{margin-top:18px}.db-table-wrap{margin-top:10px;max-height:420px;overflow:auto;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.db-table{width:100%;border-collapse:collapse;font-size:11px}.db-table th{position:sticky;top:0;z-index:1;background:var(--surface-2);color:var(--text-muted);font-size:10px;letter-spacing:.5px;text-transform:uppercase;text-align:left}.db-table th,.db-table td{padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:top;white-space:nowrap}.db-table td code{display:block;max-width:360px;overflow:hidden;text-overflow:ellipsis}.history-list{display:grid;gap:10px;margin-top:16px}.history-card{border:1px solid var(--border);border-radius:9px;overflow:hidden;background:var(--surface)}.history-summary{width:100%;display:grid;grid-template-columns:20px minmax(220px,1fr) minmax(130px,.6fr) 90px 150px;gap:12px;align-items:center;padding:12px 14px;border:0;background:var(--surface-2);color:var(--text-muted);text-align:left;cursor:pointer;font:inherit}.history-summary:hover{background:var(--surface-hover)}.history-name{color:var(--text);font-weight:700}.history-chevron{color:var(--brand);font-size:15px}.history-detail{padding:2px 14px 16px}.evidence-table{max-height:300px}.ml-actions{display:flex;gap:8px;margin-top:14px}.embedding-preview{margin-top:12px;padding:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px}.embedding-preview code{display:block;margin-top:8px;color:var(--text);font-size:11px;line-height:1.6;white-space:normal;word-break:break-word}@media(max-width:880px){.settings-grid{grid-template-columns:1fr}.settings-head{flex-direction:column}.db-controls{grid-template-columns:1fr}.ml-actions{flex-direction:column;align-items:flex-start}.history-summary{grid-template-columns:20px 1fr}.history-summary span:nth-child(n+3){display:none}}.shell{width:100%;max-width:var(--shell-max);margin-inline:auto;padding-inline:var(--shell-pad);display:flex;align-items:center;gap:24px}.header{gap:0;padding:0;background:color-mix(in srgb,var(--surface) 82%,transparent);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border);box-shadow:none}.brand{gap:11px}.brand-mark{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(140deg,var(--accent),var(--accent-strong));color:#fff;font-size:15px;font-weight:700;letter-spacing:-.4px;box-shadow:0 2px 8px -2px color-mix(in srgb,var(--accent) 60%,transparent);flex-shrink:0}.brand-title{font-size:15.5px;font-weight:640;letter-spacing:-.25px}.brand-sub{font-size:10.5px;color:var(--text-dim);letter-spacing:.5px;text-transform:uppercase;margin-top:1px}.header-stats{gap:0;margin-left:14px;display:flex;align-items:stretch}.hstat{padding:0 18px;border-left:1px solid var(--border);justify-content:center}.hstat:first-child{border-left:0;padding-left:4px}.hstat-val{font-size:19px;font-weight:680}.hstat-label{font-size:9px;letter-spacing:.8px;color:var(--text-dim)}.header-right{margin-left:auto;display:flex;align-items:center;gap:10px}.conn-status{height:28px;display:inline-flex;align-items:center;gap:7px;padding:0 11px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);font-size:11.5px;font-weight:560;white-space:nowrap;max-width:230px;overflow:hidden;text-overflow:ellipsis}.conn-status .conn-dot{width:7px;height:7px;border-radius:50%;background:var(--text-dim);flex-shrink:0}.theme-toggle{height:30px;border-radius:999px;padding:0 12px;gap:7px}.tabs{height:50px;min-height:50px;gap:0;padding:0;background:var(--surface);border-bottom:1px solid var(--border)}.tabs>.shell{gap:3px;height:100%}.tab-btn{height:32px;padding:0 15px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.005em;transition:background .14s ease,color .14s ease}.tab-btn.active{background:var(--accent-soft);color:var(--accent-strong);border-color:transparent}.settings-view,.db-view{max-width:var(--shell-max);margin-inline:auto;padding-inline:var(--shell-pad);width:100%}.settings-panel{border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.settings-title{font-size:14.5px;letter-spacing:-.15px}.auth-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);padding:16px}.auth-card.signed-in{background:var(--green-soft);border-color:transparent}.auth-row{display:flex;align-items:center;gap:12px}.auth-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,var(--accent),var(--accent-strong));color:#fff;font-size:15px;font-weight:700;flex-shrink:0}.auth-identity{min-width:0}.auth-name{font-size:13.5px;font-weight:640;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-meta{font-size:11.5px;color:var(--text-muted);margin-top:2px}.auth-role{display:inline-block;padding:1px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent-strong);font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;margin-left:6px}.auth-fields{display:flex;flex-direction:column;gap:8px;margin-top:12px}.auth-actions{display:flex;gap:8px;margin-top:12px}.auth-error{margin-top:10px;padding:8px 11px;border-radius:8px;background:var(--red-soft);color:var(--red);font-size:11.5px}.auth-hint{font-size:11.5px;color:var(--text-muted);margin-top:8px;line-height:1.5}.btn-primary{background:var(--accent);border-color:transparent;color:#fff;font-weight:620}.btn-primary:hover:not(:disabled){background:var(--accent-strong)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}@media(max-width:900px){.header-stats{display:none}.shell{padding-inline:16px;gap:14px}.settings-view,.db-view{padding-inline:16px}}.auth-card,.auth-card *{text-transform:none;letter-spacing:normal}.auth-card{font-weight:400;font-size:13px;color:var(--text)}.auth-hint{font-weight:400}.auth-name{font-weight:640}.auth-role{text-transform:uppercase;letter-spacing:.4px;font-weight:700}.auth-card .conn-btn{font-weight:600;font-size:12px}.settings-panel{max-width:880px;margin-inline:auto;padding:24px}.settings-view{padding-block:26px}.auth-card .conn-input{width:100%;max-width:none}.auth-fields .conn-input{height:34px}.studies-panel{display:flex;flex-direction:column;gap:4px}.studies-panel .history-card{border-radius:var(--radius)}.studies-panel .settings-field{margin-bottom:4px}.studies-panel .conn-input{width:100%;max-width:none}.account-menu{position:relative}.account-trigger{cursor:pointer;font-family:inherit;max-width:260px}.account-trigger:hover{border-color:var(--border-strong)}.account-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}.account-caret{font-size:9px;opacity:.6;margin-left:1px}.account-popover{position:absolute;top:calc(100% + 8px);right:0;z-index:60;width:320px;padding:16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-md);text-transform:none;letter-spacing:normal;font-weight:400;font-size:13px;color:var(--text);animation:account-pop .12s ease-out}@keyframes account-pop{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.account-section-label{font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--text-dim);margin-bottom:9px}.account-popover .conn-input{width:100%;height:34px}.account-studies{margin-top:14px}.account-study{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--border);font-size:12.5px}.account-study-role{color:var(--text-dim);font-size:11px}.main{width:100%;max-width:var(--shell-max);margin-inline:auto;padding-inline:var(--shell-pad);gap:0}@media(max-width:900px){.main{padding-inline:16px}}:root{--bar-inset: 14px;--bar-h: 58px;--nav-h: 54px;--grid-line: rgba(37, 99, 235, .07)}:root[data-theme=dark]{--grid-line: rgba(126, 165, 255, .07)}html,body,#root{overflow:hidden}.app{position:relative;background:var(--bg)}.grid-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.grid-bg-dots{position:absolute;inset:-12%;background-image:radial-gradient(var(--grid-line) 1.4px,transparent 1.4px);background-size:30px 30px;animation:grid-warp 28s ease-in-out infinite;-webkit-mask-image:radial-gradient(ellipse 110% 85% at 50% 42%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 110% 85% at 50% 42%,#000 30%,transparent 100%)}@keyframes grid-warp{0%{transform:translateZ(0) scale(1) skewY(0)}25%{transform:translate3d(14px,-10px,0) scale(1.03) skewY(.5deg)}50%{transform:translate3d(28px,12px,0) scale(1.01) skewY(-.4deg)}75%{transform:translate3d(10px,20px,0) scale(1.04) skewY(.3deg)}to{transform:translateZ(0) scale(1) skewY(0)}}.grid-bg-glow{position:absolute;left:0;top:0;width:620px;height:620px;margin-left:-310px;margin-top:-310px;transform:translate3d(var(--gx, 50vw),var(--gy, 40vh),0);background:radial-gradient(circle,color-mix(in srgb,var(--accent) 22%,transparent) 0%,color-mix(in srgb,var(--accent) 9%,transparent) 38%,transparent 70%);opacity:0;transition:opacity .5s ease;will-change:transform}:root[data-theme=dark] .grid-bg-glow{background:radial-gradient(circle,color-mix(in srgb,var(--accent) 26%,transparent) 0%,color-mix(in srgb,var(--accent) 10%,transparent) 38%,transparent 70%)}@media(prefers-reduced-motion:reduce){.grid-bg-dots{animation:none}.grid-bg-glow{display:none}}.header{position:fixed;top:var(--bar-inset);left:50%;transform:translate(-50%);z-index:40;width:min(calc(100% - var(--bar-inset) * 2),var(--shell-max));height:var(--bar-h);min-height:var(--bar-h);border:1px solid var(--border);border-radius:16px;background:color-mix(in srgb,var(--surface) 88%,transparent);-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);box-shadow:var(--shadow-card)}.header>.shell{padding-inline:18px;max-width:none}.tabs{position:fixed;left:50%;bottom:var(--bar-inset);transform:translate(-50%);z-index:40;width:auto;height:var(--nav-h);min-height:var(--nav-h);border:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface) 88%,transparent);-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);box-shadow:var(--shadow-card);padding:0}.tabs>.shell{width:auto;max-width:none;padding-inline:8px;gap:2px}.tab-btn{height:36px;padding:0 17px}.main,.settings-view,.db-view{position:relative;z-index:1;padding-top:calc(var(--bar-inset) + var(--bar-h) + 18px);padding-bottom:calc(var(--bar-inset) + var(--nav-h) + 18px)}.main{padding-top:calc(var(--bar-inset) + var(--bar-h) + 14px)}.signin-screen{position:relative;z-index:1;height:100vh;display:grid;place-items:center;padding:24px;overflow-y:auto}.signin-card{width:100%;max-width:400px;padding:34px 32px 28px;border:1px solid var(--border);border-radius:22px;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);box-shadow:var(--shadow-card);animation:signin-rise .32s cubic-bezier(.22,1,.36,1)}@keyframes signin-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.signin-card{animation:none}}.signin-head{text-align:center;margin-bottom:26px}.signin-head .brand-svg{margin-bottom:14px}.signin-title{font-size:21px;font-weight:660;letter-spacing:-.4px}.signin-sub{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.9px;margin-top:5px}.signin-label{font-size:11px;font-weight:640;color:var(--text-muted);letter-spacing:.3px}.signin-input{width:100%;height:40px;font-size:13px}.signin-submit{width:100%;height:42px;margin-top:20px;border:0;border-radius:11px;background:linear-gradient(140deg,var(--accent),var(--accent-strong));color:#fff;font-size:13.5px;font-weight:640;font-family:inherit;cursor:pointer;transition:filter .15s ease,transform .08s ease}.signin-submit:hover:not(:disabled){filter:brightness(1.07)}.signin-submit:active:not(:disabled){transform:translateY(1px)}.signin-submit:disabled{opacity:.45;cursor:not-allowed}.signin-note{margin-top:16px;padding:11px 13px;border-radius:10px;background:var(--surface-2);color:var(--text-muted);font-size:12px;line-height:1.55}.signin-note code{font-size:11px;background:var(--surface-hover);padding:1px 5px;border-radius:4px}.signin-foot{margin-top:20px;padding-top:16px;border-top:1px solid var(--border);font-size:11.5px;color:var(--text-dim);line-height:1.6;text-align:center}@media(max-width:900px){.tabs>.shell{padding-inline:5px}.tab-btn{padding:0 12px;font-size:11.5px}}.device-card{border-radius:var(--radius-lg);box-shadow:var(--shadow-card);transition:box-shadow .15s ease}.device-head{width:100%;border:0;background:transparent;font-family:inherit;text-align:left;cursor:pointer;border-radius:var(--radius-lg) var(--radius-lg) 0 0;transition:background .14s ease}.device-head:hover{background:var(--surface-2)}.device-head-right{display:flex;align-items:center;gap:10px}.device-chevron{font-size:10px;color:var(--text-dim)}.device-card.collapsed .device-metrics{border-bottom:0}.device-collapsed-hint{width:100%;padding:9px 14px 12px;border:0;background:transparent;color:var(--text-dim);font-family:inherit;font-size:11.5px;cursor:pointer;text-align:center}.device-collapsed-hint:hover{color:var(--accent)}.stream-log{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-card);overflow:hidden;margin-left:14px}.stream-head{border-bottom:1px solid var(--border);background:var(--surface-2);padding:12px 14px}.stream-row{padding:5px 14px;border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent);transition:background .1s ease}.stream-row:hover{background:var(--surface-2)}.stream-row:last-child{border-bottom:0}.hierarchy{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;padding:18px;margin-bottom:20px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);text-transform:none;letter-spacing:normal;font-weight:400;font-size:12.5px;color:var(--text)}.hierarchy-heading{font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--text-dim);margin-bottom:12px}.hierarchy-roles{list-style:none;display:flex;flex-direction:column;gap:12px}.hierarchy-roles li{display:flex;flex-direction:column;gap:2px}.hierarchy-role{font-weight:660;font-size:12.5px}.hierarchy-desc{color:var(--text-muted);font-size:11.5px;line-height:1.5}.hierarchy-tree,.hierarchy-tree ul{list-style:none}.hierarchy-tree ul{margin-left:9px;padding-left:13px;border-left:1px solid var(--border-strong)}.hierarchy-tree li{padding:3px 0}.hierarchy-node{font-weight:640;font-size:12px;background:var(--accent-soft);color:var(--accent-strong);padding:1px 7px;border-radius:5px;margin-right:7px}.hierarchy-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);font-size:11.5px;color:var(--text-muted);line-height:1.55}.db-view .settings-panel{max-width:var(--shell-max)}.history-list{display:flex;flex-direction:column;gap:8px}.history-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden;transition:border-color .14s ease}.history-card:hover{border-color:var(--border-strong)}.history-summary{width:100%;display:grid;grid-template-columns:18px minmax(0,2.2fr) minmax(0,1.2fr) 110px 150px;align-items:center;gap:12px;padding:11px 14px;border:0;background:transparent;font-family:inherit;font-size:12.5px;color:var(--text);cursor:pointer;text-align:left}.history-summary:hover{background:var(--surface-2)}.history-summary>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-name{font-weight:620}.history-chevron{color:var(--text-dim);font-size:10px}.history-detail{padding:14px;border-top:1px solid var(--border);background:var(--surface-2)}.settings-grid,.db-panel .settings-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}.settings-detail{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);font-size:12px}@media(max-width:1100px){.history-summary{grid-template-columns:18px minmax(0,1fr) 100px}.history-summary>span:nth-child(3),.history-summary>span:nth-child(4){display:none}}.grid-bg-dots{background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:46px 46px;animation:grid-warp 16s ease-in-out infinite}@keyframes grid-warp{0%{transform:translateZ(0) scale(1) skewY(0)}25%{transform:translate3d(-26px,18px,0) scale(1.05) skewY(.7deg)}50%{transform:translate3d(22px,30px,0) scale(1.02) skewY(-.6deg)}75%{transform:translate3d(28px,-16px,0) scale(1.06) skewY(.5deg)}to{transform:translateZ(0) scale(1) skewY(0)}}:root{--grid-line: rgba(37, 99, 235, .1)}:root[data-theme=dark]{--grid-line: rgba(126, 165, 255, .1)}.grid-bg-glow{width:460px;height:460px;margin-left:-230px;margin-top:-230px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 9%,transparent) 0%,color-mix(in srgb,var(--accent) 4%,transparent) 40%,transparent 70%)}:root[data-theme=dark] .grid-bg-glow{background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%,transparent) 0%,color-mix(in srgb,var(--accent) 5%,transparent) 40%,transparent 70%)}.header{width:max-content;max-width:calc(100% - var(--bar-inset) * 2);height:52px;min-height:52px;border-radius:999px}.header>.shell{padding-inline:8px 8px;gap:18px;width:auto}.brand{padding-left:8px}.brand-title{font-size:14px}.brand-sub{display:none}.header-right{gap:8px}.settings-panel,.device-card,.stream-log,.history-card,.account-popover,.signin-card,.header,.tabs{background:color-mix(in srgb,var(--surface) 62%,transparent);backdrop-filter:saturate(170%) blur(20px);-webkit-backdrop-filter:saturate(170%) blur(20px);border-color:color-mix(in srgb,var(--border) 80%,transparent)}.history-detail,.stream-head,.hierarchy,.auth-card,.settings-detail{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}.device-head:hover,.history-summary:hover,.stream-row:hover{background:color-mix(in srgb,var(--surface-2) 70%,transparent)}:root[data-theme=dark] .settings-panel,:root[data-theme=dark] .device-card,:root[data-theme=dark] .stream-log,:root[data-theme=dark] .history-card,:root[data-theme=dark] .account-popover,:root[data-theme=dark] .signin-card,:root[data-theme=dark] .header,:root[data-theme=dark] .tabs{background:color-mix(in srgb,var(--surface) 78%,transparent)}.device-grid{align-items:start}.device-fold{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.22,1,.36,1)}.device-fold.open{grid-template-rows:1fr}.device-fold-inner{overflow:hidden;min-height:0}.chevron{transition:transform .28s cubic-bezier(.22,1,.36,1)}.chevron.open{transform:rotate(180deg)}.device-chevron{display:inline-flex;color:var(--text-dim)}.history-chevron{display:inline-flex;align-items:center}@media(prefers-reduced-motion:reduce){.device-fold,.chevron{transition:none}}.hierarchy{grid-template-columns:1fr;padding:22px 24px}.hierarchy-tree li{padding:5px 0}.hierarchy-node{font-size:13.5px;padding:3px 10px;border-radius:7px}.hierarchy-desc{font-size:12.5px}.hierarchy-tree ul{margin-left:12px;padding-left:18px}.hierarchy-note{border-top:0;padding-top:4px;margin-top:16px}.settings-panel,.device-card,.stream-log,.history-card,.signin-card{background:color-mix(in srgb,var(--surface) 46%,transparent);backdrop-filter:saturate(200%) blur(28px);-webkit-backdrop-filter:saturate(200%) blur(28px);border-color:color-mix(in srgb,var(--border) 70%,transparent)}:root[data-theme=dark] .settings-panel,:root[data-theme=dark] .device-card,:root[data-theme=dark] .stream-log,:root[data-theme=dark] .history-card,:root[data-theme=dark] .signin-card{background:color-mix(in srgb,var(--surface) 66%,transparent)}.header,.tabs{background:color-mix(in srgb,var(--surface) 58%,transparent);backdrop-filter:saturate(200%) blur(26px);-webkit-backdrop-filter:saturate(200%) blur(26px)}.account-popover{background:var(--surface);backdrop-filter:saturate(180%) blur(30px);-webkit-backdrop-filter:saturate(180%) blur(30px);border-color:var(--border);box-shadow:0 18px 48px -12px #0f172a47;z-index:200}:root[data-theme=dark] .account-popover{background:color-mix(in srgb,var(--surface) 97%,transparent);box-shadow:0 18px 48px -12px #000000a6}.header{z-index:120}.device-card.stale{opacity:1}.device-grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}.device-head{padding:11px 13px;gap:10px}.device-avatar{width:30px;height:30px;font-size:12px}.device-name{font-size:13.5px;font-weight:640}.device-state{display:flex;align-items:center;gap:6px;margin-top:2px;font-size:11.5px;font-weight:560}.device-state.on{color:var(--green)}.device-state.off{color:var(--red)}.device-state .live-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0}.device-state.on .live-dot{box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 20%,transparent);animation:pulse 2.4s ease-in-out infinite}.device-card.stale{border-color:color-mix(in srgb,var(--red) 34%,transparent)}.device-card.stale .device-avatar{filter:grayscale(.55)}.device-addr{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;color:var(--text-dim);opacity:.75;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-metrics{padding:8px 13px}.device-metrics .metric-val{font-size:15px}.device-metrics .metric-label{font-size:8.5px}.tabs{display:none}.header{width:min(calc(100% - var(--bar-inset) * 2),var(--shell-max));border-radius:16px}.header>.shell{padding-inline:14px;gap:14px;justify-content:space-between}.header-nav{display:flex;align-items:center;gap:2px;margin-inline:auto}.main,.settings-view,.db-view{padding-bottom:26px;padding-top:calc(var(--bar-inset) + 52px + 16px)}@media(max-width:1080px){.header-nav{display:none}}.account-popover{animation:menu-open .16s cubic-bezier(.22,1,.36,1)}@keyframes menu-open{0%{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}select.conn-input,.conn-input,.conn-btn,.tab-btn{transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,color .16s ease}select.conn-input:focus,.conn-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}@media(prefers-reduced-motion:reduce){.account-popover{animation:none}}.flow{list-style:none;display:flex;align-items:stretch;gap:0;flex-wrap:wrap}.flow-step{display:flex;align-items:center;flex:1 1 190px;min-width:0}.flow-card{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding:14px 13px;border:1px solid var(--accent-line);border-radius:13px;background:color-mix(in srgb,var(--accent-soft) 60%,transparent);position:relative}.flow-index{position:absolute;top:9px;right:11px;font-size:10px;font-weight:700;color:var(--accent-strong);opacity:.5}.flow-label{font-size:13.5px;font-weight:680;color:var(--accent-strong)}.flow-detail{font-size:12px;color:var(--text)}.flow-sub{font-size:11px;color:var(--text-muted);line-height:1.45;margin-top:2px}.flow-arrow{flex:0 0 26px;display:grid;place-items:center;color:var(--accent-line)}.flow-arrow svg{width:22px;height:11px}@media(max-width:860px){.flow-arrow{display:none}.flow-step{flex-basis:100%}.flow-card{margin-bottom:8px}}.settings-sub{font-size:11.5px;color:var(--text-muted);margin-top:3px;font-weight:400;text-transform:none;letter-spacing:normal}.db-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0 4px;padding:13px 15px;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface-2) 55%,transparent)}.db-actions-hint{font-size:11.5px;color:var(--text-muted);margin-left:auto}.header{width:max-content;max-width:calc(100% - var(--bar-inset) * 2);border-radius:999px}.header>.shell{width:auto;max-width:none;padding-inline:6px;gap:0;justify-content:flex-start}.brand{padding:0 14px 0 6px;gap:9px}.header-nav{margin-inline:0;padding:0 12px;gap:2px;border-left:1px solid var(--border);border-right:1px solid var(--border)}.header-right{margin-left:0;padding:0 6px 0 12px;gap:7px}.tab-btn{height:30px;padding:0 13px}.resize-divider{width:10px;background:transparent;border:0}.resize-divider:after{content:"";display:block;width:2px;height:100%;margin:0 auto;border-radius:2px;background:transparent;transition:background .15s ease}.resize-divider:hover:after{background:var(--accent-line)}.stream-log{border-left:1px solid color-mix(in srgb,var(--border) 70%,transparent);margin:0 0 0 2px}.stream-body{padding:4px 0}.stream-body::-webkit-scrollbar{width:8px}.stream-body::-webkit-scrollbar-track{background:transparent}.stream-body::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-dim) 30%,transparent);border-radius:999px}.stream-body::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--text-dim) 50%,transparent)}.stream-head{background:transparent;border-bottom:1px solid color-mix(in srgb,var(--border) 70%,transparent)}.log-entry{padding:4px 14px;border-bottom:1px solid color-mix(in srgb,var(--border) 30%,transparent)}.log-entry:hover{background:color-mix(in srgb,var(--surface-2) 60%,transparent)}.device-state{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.device-id-text{min-width:0}.device-addr{font-size:9.5px;opacity:.45;max-width:96px;letter-spacing:-.2px}.device-head:hover .device-addr{opacity:.8}.studies-panel .hierarchy{margin-top:4px}.db-view .settings-head,.settings-view .settings-head{margin-bottom:20px}.flow-step{align-items:stretch}.flow-arrow{align-self:center}.flow-card{justify-content:flex-start}.main.monitor-stack{display:flex;flex-direction:column;gap:14px;overflow:hidden}.monitor-stack .device-col{flex:0 0 auto;max-height:58vh;padding:0;gap:12px}.monitor-stack .stream-log{flex:1 1 auto;min-height:190px;margin:0;border-left:1px solid color-mix(in srgb,var(--border) 70%,transparent);grid-column:auto}.monitor-stack .device-grid{grid-template-columns:repeat(auto-fill,minmax(268px,1fr))}.monitor-stack .empty-state{padding:26px 0}.monitor-stack .log-entry{grid-template-columns:92px 64px 96px 1fr}.signin-tabs{display:flex;gap:3px;padding:3px;margin-bottom:18px;border-radius:10px;background:var(--surface-2)}.signin-tab{flex:1;height:32px;border:0;border-radius:8px;background:transparent;color:var(--text-muted);font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s ease,color .15s ease}.signin-tab.active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}.signin-links{margin-top:14px;text-align:center}.link-btn{border:0;background:transparent;color:var(--accent);font-family:inherit;font-size:12px;cursor:pointer;padding:4px}.link-btn:hover{text-decoration:underline}.signin-success{margin-top:14px;padding:10px 12px;border-radius:9px;background:var(--green-soft);color:var(--green);font-size:12px;line-height:1.5}.main.devices-view,.main.stream-view{display:flex;flex-direction:column;overflow:hidden}.devices-view .device-col{flex:1 1 auto;padding:0;gap:12px;overflow-y:auto}.devices-view .device-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.stream-view .stream-log{flex:1 1 auto;margin:0;border-left:0;grid-column:auto}.stream-view .log-entry{grid-template-columns:96px 70px 104px 1fr;font-size:11px}.stream-view .log-entry .log-summary{white-space:normal}.history-summary{grid-template-columns:18px minmax(0,1.9fr) minmax(0,1.1fr) minmax(0,1fr) 96px 132px}.history-owner{color:var(--text);font-weight:560}.history-study{color:var(--text-muted)}@media(max-width:1200px){.history-summary{grid-template-columns:18px minmax(0,1.6fr) minmax(0,1fr) 96px}.history-summary>span:nth-child(4){display:none}}@media(max-width:900px){.history-summary{grid-template-columns:18px minmax(0,1fr) 96px}.history-summary>span:nth-child(3){display:none}}.devices-view .device-col{align-items:center}.devices-view .device-grid{grid-template-columns:repeat(auto-fit,minmax(290px,360px));justify-content:center;width:100%}.devices-view .empty-state{margin:auto}.live-block{border-top:1px solid var(--border)}.live-metrics{display:grid;grid-template-columns:repeat(3,1fr)}.live-metrics .metric+.metric{border-left:1px solid var(--border)}.live-metrics .metric-val{text-transform:capitalize}.live-quality.good{color:var(--green)}.live-quality.fair{color:var(--amber)}.live-quality.poor{color:var(--red)}.live-traces{display:flex;flex-direction:column;gap:8px;padding:8px 12px 10px;border-top:1px solid var(--border)}.trace-head{display:flex;justify-content:space-between;font-size:11px;color:var(--text-muted);margin-bottom:2px}.trace-unit{color:var(--text-dim)}.trace-svg{width:100%;height:56px;background:var(--surface-2);border-radius:6px;display:block}.trace-empty{fill:var(--text-dim);font-size:11px}.live-alerts{list-style:none;margin:0;padding:0 12px 10px;display:flex;flex-direction:column;gap:6px}.live-alert{display:flex;align-items:center;gap:8px;font-size:12px;padding:6px 10px;border-radius:8px;background:var(--surface-2);color:var(--text)}.live-alert-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--text-dim)}.live-alert.critical{background:var(--red-soft)}.live-alert.critical .live-alert-dot{background:var(--red)}.live-alert.warning{background:var(--amber-soft)}.live-alert.warning .live-alert-dot{background:var(--amber)}.live-alert.info .live-alert-dot{background:var(--accent)}.live-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:8px;border-radius:9px;font-size:10.5px;font-weight:700;color:#fff;vertical-align:middle;background:var(--accent)}.live-badge.critical{background:var(--red)}.live-badge.warning{background:var(--amber)}.live-streams{width:100%;border-collapse:collapse;font-size:11.5px;font-variant-numeric:tabular-nums}.live-streams th{text-align:left;font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);padding:4px 6px 4px 0}.live-streams td{padding:4px 6px 4px 0;border-top:1px solid var(--border)}.live-ok{color:var(--green)}.live-bad{color:var(--amber)}.live-feed{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-card)}.live-feed ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}.live-feed .live-alert.cleared{opacity:.55}.live-feed-message{flex:1;min-width:0}.live-feed-state{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted)}.glasses-hero{align-self:stretch;width:100%;position:relative;margin-bottom:20px;padding:18px 20px 20px;border-radius:24px;background:radial-gradient(900px 260px at 85% -20%,rgba(61,255,122,.1),transparent 60%),#050a07;border:1px solid #14381f;box-shadow:0 0 0 1px #3dff7a0d,0 24px 48px -28px #000000b3;color:#3dff7a}.glasses-hero-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px}.glasses-hero-title{font-size:11.5px;font-weight:800;letter-spacing:.22em}.glasses-hero-caption{font-size:12px;color:#6fa07c}.glasses-screen{position:relative;border-radius:14px;overflow:hidden;background:#020604;border:1px solid #0f2a18;max-width:920px;margin:0 auto}.glasses-screen:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(0,0,0,.22) 0 1px,transparent 1px 3px),repeating-linear-gradient(to right,rgba(0,0,0,.16) 0 1px,transparent 1px 3px)}.glasses-svg{display:block;width:100%;height:auto;color:#3dff7a;filter:drop-shadow(0 0 5px rgba(61,255,122,.55))}.glasses-svg.idle{color:#2c9e52;filter:none;opacity:.8}:root[data-theme=dark]{--bg: #05090e;--surface: #0a1119;--surface-2: #0f1822;--surface-hover: #15212e;--border: #172433;--border-strong: #24374a;--text: #e8f3ff;--text-muted: #93a8bd;--text-dim: #5d7388;--accent: #35e0ff;--accent-strong: #7aeaff;--accent-soft: #0e2f3b;--accent-line: #17566a;--green: #3dff9a;--green-soft: #0d2f20;--amber-soft: #3a2b10;--red-soft: #3a1a20}:root[data-theme=dark] body{background:radial-gradient(1100px 520px at 88% -8%,rgba(53,224,255,.08),transparent 62%),radial-gradient(900px 480px at -4% 6%,rgba(61,255,154,.06),transparent 60%),linear-gradient(rgba(53,224,255,.025) 1px,transparent 1px) 0 0 / 100% 36px,linear-gradient(90deg,rgba(53,224,255,.025) 1px,transparent 1px) 0 0 / 36px 100%,var(--bg)}.header{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}:root[data-theme=dark] .header{background:#0a1119c7;border-bottom:1px solid transparent;border-image:linear-gradient(90deg,#35e0ff00,#35e0ff66,#3dff9a4d,#35e0ff00) 1}:root[data-theme=dark] .brand-title{letter-spacing:.04em;text-transform:uppercase;font-size:13.5px}.device-card{border-radius:20px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}:root[data-theme=dark] .device-card{background:linear-gradient(180deg,#111c28eb,#0a1119eb);box-shadow:0 0 0 1px #35e0ff0a,0 22px 44px -26px #000000e6}:root[data-theme=dark] .device-card.live:hover{border-color:var(--accent-line);box-shadow:0 0 0 1px #35e0ff2e,0 0 28px -8px #35e0ff59;transform:translateY(-1px)}:root[data-theme=dark] .live-dot{box-shadow:0 0 0 3px #3dff9a2e,0 0 10px #3dff9ab3}:root[data-theme=dark] .conn-status.connected .conn-dot{box-shadow:0 0 0 3px #3dff9a33,0 0 10px #3dff9ab3;background:var(--green)}:root[data-theme=dark] .metric-val{text-shadow:0 0 14px rgba(53,224,255,.25)}:root[data-theme=dark] .trace-svg{background:#08121a}.device-col.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(150px,auto);gap:16px;align-content:start}.device-col.bento>.glasses-hero{grid-column:span 8;grid-row:span 2;margin:0;display:flex;flex-direction:column}.device-col.bento .glasses-screen{margin:auto;width:100%}.device-col.bento .device-grid{display:contents}.device-col.bento .device-card{grid-column:span 4;align-self:start}.device-col.bento>.live-feed,.device-col.bento>.empty-state{grid-column:span 4}.device-col.bento>.empty-state{grid-column:1 / -1}.device-col.bento>.live-feed{grid-row:span 2;max-height:460px;overflow:auto}.tile{grid-column:span 4;display:flex;flex-direction:column;gap:10px;padding:16px 18px;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-card);min-width:0}.tile-label{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.tile-big{display:flex;align-items:baseline;gap:8px}.tile-heart-icon{color:var(--red);font-size:22px}.tile-num{font-size:52px;font-weight:750;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.tile-unit{font-size:14px;color:var(--text-muted)}.tile-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tile-chip{font-size:11.5px;font-weight:650;padding:3px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-muted)}.tile-chip.good{color:var(--green);background:var(--green-soft);border-color:transparent}.tile-chip.fair{color:var(--amber);background:var(--amber-soft);border-color:transparent}.tile-chip.poor{color:var(--red);background:var(--red-soft);border-color:transparent}.tile-dim{font-size:11.5px;color:var(--text-dim)}.tile-spark{width:100%;height:44px;color:var(--accent);margin-top:auto}.tile-empty{margin-top:auto;font-size:12px;color:var(--text-dim)}.tile-list{display:flex;flex-direction:column;gap:0;margin:0}.tile-list-row{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--border)}.tile-list-row:last-child{border-bottom:0}.tile-list-row dt{font-size:12.5px;color:var(--text-muted)}.tile-list-row dd{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums;text-transform:capitalize}:root[data-theme=dark] .tile{background:linear-gradient(180deg,#111c28eb,#0a1119eb);box-shadow:0 0 0 1px #35e0ff0a,0 22px 44px -26px #000000e6}:root[data-theme=dark] .tile-num{text-shadow:0 0 18px rgba(53,224,255,.3)}@media(max-width:1180px){.device-col.bento>.glasses-hero{grid-column:span 12;grid-row:span 1}.tile,.device-col.bento .device-card,.device-col.bento>.live-feed{grid-column:span 6}.device-col.bento>.live-feed{grid-row:span 1}}@media(max-width:720px){.tile,.device-col.bento .device-card,.device-col.bento>.live-feed{grid-column:span 12}}.device-col.bento .glasses-screen{flex:none}.device-col.bento>.glasses-hero{min-height:0}.device-avatar{display:inline-flex;align-items:center;justify-content:center;color:#fff}.device-avatar svg{width:20px;height:20px}.pixel-field{position:fixed;inset:0;z-index:0;pointer-events:none}:root{--radius: 6px;--radius-lg: 8px;--lime: #b6ff3b;--pixel-font: "Cascadia Mono", "SF Mono", "Fira Code", ui-monospace, monospace}.brand-title,.hstat-label,.metric-label,.tile-label,.panel-title,.conn-status,.theme-toggle,.device-name,.tile-chip,.glasses-hero-title,.live-feed-state,.tab-btn,.stream-count{font-family:var(--pixel-font)}.tile-num,.metric-val,.hstat-val{font-family:var(--pixel-font);letter-spacing:-.02em}.header,.shell-bar,.bar{border-radius:8px}.tab-btn{border-radius:4px;border:2px solid var(--border);background:var(--surface);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700}.tab-btn:hover{border-color:var(--border-strong)}.tab-btn.active{background:var(--accent);color:var(--bg);border-color:var(--accent-strong);box-shadow:3px 3px 0 var(--border-strong)}:root[data-theme=dark] .tab-btn.active{color:#031018;box-shadow:3px 3px #b6ff3b59}.device-card,.tile,.live-feed,.stream-log,.panel,.conn-status,.theme-toggle{border-radius:8px}.glasses-hero{border-radius:12px}.glasses-screen{border-radius:6px}.device-card,.tile{box-shadow:4px 4px 0 var(--border)}:root[data-theme=dark] .device-card,:root[data-theme=dark] .tile{box-shadow:4px 4px #b6ff3b1a;border-color:var(--border-strong)}:root[data-theme=dark] .device-card.live:hover{box-shadow:4px 4px #b6ff3b52;transform:translate(-1px,-1px)}.tile-chip,.live-badge,.stream-count{border-radius:4px}.device-avatar{border-radius:6px}.pixel-field{inset:-12px;animation:pixel-float 26s ease-in-out infinite alternate}@keyframes pixel-float{0%{transform:translate(-6px,-4px)}to{transform:translate(6px,5px)}}@media(prefers-reduced-motion:reduce){.pixel-field{animation:none}}.glasses-screen{aspect-ratio:576 / 136}.glasses-screen .glasses-svg{height:100%}.glasses-screen{aspect-ratio:auto;height:0;padding-bottom:23.611%;max-width:none;position:relative}.glasses-screen .glasses-svg{position:absolute;inset:0;width:100%;height:100%}.tile{min-height:150px}.device-col.bento>.tile{align-self:stretch}.device-col,.stream-body,.live-feed,.devices-view .device-col{scrollbar-width:none;-ms-overflow-style:none}.device-col::-webkit-scrollbar,.stream-body::-webkit-scrollbar,.live-feed::-webkit-scrollbar{width:0;height:0;display:none}.tile-reason,.live-reason{color:var(--amber, #ffb84d);font-size:12px;margin:4px 0}:root[data-theme=dark]{--bg: #000000;--surface: #0a0a0a;--surface-2: #111111;--surface-hover: #171717;--border: #1e2a14;--border-strong: #2c3a1e;--text: #eef3e6;--text-muted: #9aa58c;--text-dim: #66705a;--accent: #5fd022;--accent-strong: #86e050;--accent-soft: #12260a;--accent-line: #2f5a12;--green: #5fd022;--green-soft: #12260a}:root:not([data-theme=dark]){--accent: #3b8a12;--accent-strong: #2f7410;--accent-soft: #e6f3da;--green: #3b8a12}:root[data-theme=dark] body{background:var(--bg)}:root[data-theme=dark] .header{background:var(--bg);border-bottom:1px solid var(--border);border-image:none;-webkit-backdrop-filter:none;backdrop-filter:none}.device-card,.tile,.live-feed,.stream-log,.panel,.conn-status,.theme-toggle,.glasses-hero,.glasses-screen,.tile-chip,.live-badge,.stream-count,.device-avatar{border-radius:2px}.device-card,.tile,:root[data-theme=dark] .device-card,:root[data-theme=dark] .tile{box-shadow:none;background:var(--surface);border:1px solid var(--border-strong)}:root[data-theme=dark] .device-card.live:hover,.device-card.live:hover{transform:none;box-shadow:none;border-color:var(--accent-line)}:root[data-theme=dark] .live-dot,:root[data-theme=dark] .conn-status.connected .conn-dot,.device-live.on .live-dot,.conn-status.connected .conn-dot{box-shadow:none;border-radius:0;background:var(--green)}.tab-btn{border-radius:2px;box-shadow:none}:root[data-theme=dark] .tab-btn.active{color:#031000;box-shadow:none;background:var(--accent);border-color:var(--accent)}.tab-btn:hover{transform:none}@keyframes pixel-blink{0%,49%{opacity:1}50%,to{opacity:.25}}.conn-status.connected .conn-dot,.device-live.on .live-dot{animation:pixel-blink 1.6s steps(1,end) infinite}.tile-heart-icon{animation:pixel-blink 1.2s steps(1,end) infinite;color:var(--accent)}.pixel-field{inset:0;animation:none}.tile-chip.good{color:var(--accent);background:var(--accent-soft)}.brand-title{letter-spacing:.06em}:root[data-theme=dark] .tab-btn{background:var(--surface);color:var(--text-muted);border-color:var(--border-strong)}:root[data-theme=dark] .tab-btn:hover{background:var(--surface-2);color:var(--text)}:root[data-theme=dark] .theme-toggle,:root[data-theme=dark] .conn-status{background:var(--surface);color:var(--text-muted);border-color:var(--border-strong)}.glasses-svg{color:var(--accent);filter:none}.glasses-svg.idle{color:var(--text-dim)}.glasses-hero{color:var(--accent)}.glasses-hero{background:#000;border:1px solid var(--border-strong);box-shadow:none;border-radius:2px}.glasses-hero-caption{color:var(--text-muted)}.tab-btn,.theme-toggle,.conn-status{border-radius:2px}.devices-layout{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px}.devices-layout>.device-col{width:100%;max-width:1040px;justify-self:center;min-height:0}.devices-view .devices-layout:not(:has(.alerts-panel)){grid-template-columns:minmax(0,1fr)}.alerts-panel{min-height:0;overflow-y:auto;scrollbar-width:none}.alerts-panel::-webkit-scrollbar{display:none}.alerts-panel .live-feed{max-height:none;margin:0}.device-col.bento .device-grid{display:grid;grid-column:1 / -1;grid-template-columns:repeat(auto-fit,minmax(300px,380px));justify-content:center;gap:16px}.device-col.bento .device-card{grid-column:auto}@media(max-width:1100px){.devices-layout{grid-template-columns:minmax(0,1fr);overflow-y:auto}.alerts-panel{overflow:visible}}.devices-view .devices-layout>.device-col{max-width:1280px}.device-col.bento{grid-auto-rows:auto;gap:12px;padding:4px 0 16px}.device-col.bento>.glasses-hero{grid-column:span 7;grid-row:auto;max-height:300px;padding:14px 18px}.device-col.bento>.glasses-hero .glasses-screen{max-height:220px}.device-col.bento>.bento-alerts{grid-column:span 5;max-height:300px;overflow-y:auto;min-width:0}.device-col.bento>.bento-alerts .live-feed{margin:0;height:100%;box-sizing:border-box}.device-col.bento>.tile-device{grid-column:span 4;gap:6px;padding:12px 14px}.tile-device .tile-num{font-size:40px}.tile-device-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.tile-status{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px}.tile-status.online{color:var(--green);background:var(--green-soft)}.tile-status.delayed{color:var(--amber);background:var(--amber-soft)}.tile-status.offline{color:var(--red);background:var(--red-soft)}.tile-device.offline{opacity:.7}.tile-device .tile-spark{height:34px}@media(max-width:1100px){.device-col.bento>.glasses-hero,.device-col.bento>.bento-alerts{grid-column:1 / -1}.device-col.bento>.tile-device{grid-column:span 6}}@media(max-width:700px){.device-col.bento>.tile-device{grid-column:1 / -1}}.tile-expand{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);cursor:pointer;margin-left:auto;margin-right:6px}.tile-expand:hover{color:var(--accent);border-color:var(--accent)}.tile-traces{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tile-trace-label{font-size:10.5px;color:var(--text-muted)}.device-col.bento>.bento-expanded{grid-column:1 / -1;display:flex;flex-direction:column;gap:8px}.bento-expanded-head{display:flex;align-items:center;gap:8px}.bento-expanded .device-card{width:100%;max-width:none}.device-col.bento{grid-auto-rows:max-content}.device-col.bento>*{min-height:min-content}
