:root{--color-slate-900: #0f172a;--color-gray-800: #1e293b;--color-gray-700: #374151;--color-gray-400: #9ca3af;--color-gray-300: #d1d5db;--color-blue-600: #2563eb;--color-blue-700: #1d4ed8;--color-blue-500: #3b82f6;--color-blue-400: #60a5fa;--color-blue-300: #93c5fd;--color-white: white;--bg-primary: #f5f7fa;--bg-secondary: #ffffff;--bg-tertiary: #f8fafc;--bg-form: #f8fafc;--bg-breadcrumb: #edf2f7;--bg-sidebar: #f8f9fa;--bg-hover: #f1f5f9;--text-primary: #222222;--text-secondary: #6c757d;--text-muted: #9ca3af;--text-on-color: #ffffff;--border-color: #dee2e6;--border-light: #e5e7eb;--accent-primary: #0d6efd;--accent-primary-alpha: rgba(13, 110, 253, .1);--accent-hover: #155a9c;--sidebar-active-bg: #e7f1ff;--error-color: #ef4444;--error-color-rgb: 239, 68, 68;--error-color-alpha-10: rgba(239, 68, 68, .1);--error-color-alpha-15: rgba(239, 68, 68, .15);--error-color-alpha-20: rgba(239, 68, 68, .2);--danger-color: var(--error-color);--success-color: #22c55e;--success-color-rgb: 34, 197, 94;--success-hover: #16a34a;--warning-color: #f59e0b;--warning-color-rgb: 245, 158, 11;--warning-color-alpha: rgba(245, 158, 11, .25);--warning-color-alpha-light: rgba(245, 158, 11, .15);--info-color: #3b82f6;--info-color-rgb: 59, 130, 246;--error-hover: #dc2626;--placeholder-text: #999999;--link-color: #0d6efd;--link-hover-color: #155a9c;--scrollbar-thumb: #cbd5e0;--scrollbar-thumb-hover: #9ca3af;--modal-backdrop: rgba(0, 0, 0, .75);--primary-color: var(--accent-primary);--primary-color-alpha: rgba(13, 110, 253, .1);--primary-color-alpha-15: rgba(13, 110, 253, .15);--primary-color-alpha-20: rgba(13, 110, 253, .2);--text-placeholder: var(--placeholder-text);--kbd-bg: rgba(128, 128, 128, .2);--error-bg: rgba(239, 68, 68, .1);--auto-detect-color: var(--error-color);--user-tag-color: var(--warning-color);--shadow-color: rgba(0, 0, 0, .12);--shadow-color-medium: rgba(0, 0, 0, .2);--shadow-color-heavy: rgba(0, 0, 0, .4);--badge-info: #60a5fa;--badge-info-text: #ffffff;--badge-info-rgb: 96, 165, 250;--badge-low: #64748b;--badge-low-text: #ffffff;--badge-low-rgb: 100, 116, 139;--badge-medium: #f97316;--badge-medium-text: #ffffff;--badge-medium-rgb: 249, 115, 22;--badge-high: #ef4444;--badge-high-text: #ffffff;--badge-high-rgb: 239, 68, 68;--badge-code: #6b7280;--badge-code-text: #ffffff;--badge-cel: var(--badge-medium);--badge-cel-text: var(--badge-medium-text);--protocol-request: #3b82f6;--protocol-request-bg: rgba(59, 130, 246, .1);--protocol-response: #22c55e;--protocol-response-bg: rgba(34, 197, 94, .1);--protocol-meta: #9ca3af;--protocol-meta-bg: rgba(156, 163, 175, .1);--protocol-status: #f59e0b;--protocol-status-bg: rgba(245, 158, 11, .1);--protocol-poweron: #8b5cf6;--protocol-poweron-bg: rgba(139, 92, 246, .1);--protocol-command: #06b6d4;--protocol-command-bg: rgba(6, 182, 212, .1);--protocol-error: #ef4444;--protocol-error-bg: rgba(239, 68, 68, .1);--packet-viewer-hex: #fb923c;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: .75rem;--spacing-lg: 1rem;--spacing-xl: 1.5rem;--spacing-2xl: 2rem;--spacing-3xl: 3rem;--spacing-4xl: 4rem;--spacing-5xl: 5rem;--text-h1: 2.25rem;--text-h2: 1.875rem;--text-h3: 1.5rem;--text-h4: 1.25rem;--text-h5: 1.125rem;--text-h6: 1rem;--text-base: .875rem;--text-lg: 1rem;--text-sm: .8rem;--text-xs: .75rem;--text-xl: 1.125rem;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.6;--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0;--letter-spacing-wide: .025em;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .15);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .25);--shadow-accent-sm: 0 2px 8px rgba(13, 110, 253, .15);--shadow-accent-md: 0 4px 12px rgba(13, 110, 253, .2);--shadow-accent-lg: 0 8px 20px rgba(13, 110, 253, .3);--shadow-accent-xl: 0 12px 24px rgba(13, 110, 253, .4);--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 9999px;--breakpoint-xs: 0px;--breakpoint-sm: 576px;--breakpoint-md: 768px;--breakpoint-lg: 992px;--breakpoint-xl: 1200px;--breakpoint-xxl: 1400px;--breakpoint-sm-max: 575.98px;--breakpoint-md-max: 767.98px;--breakpoint-lg-max: 991.98px;--breakpoint-xl-max: 1199.98px;--breakpoint-xxl-max: 1399.98px;--bs-body-bg: var(--bg-primary);--bs-body-color: var(--text-primary);--bs-border-color: var(--border-color);--bs-border-color-translucent: var(--border-light);--bs-primary: var(--accent-primary);--bs-primary-rgb: 13, 110, 253;--bs-secondary: var(--text-secondary);--bs-secondary-color: var(--placeholder-text);--bs-success: var(--success-color);--bs-danger: var(--error-color);--bs-warning: var(--warning-color);--bs-link-color: var(--link-color);--bs-link-hover-color: var(--link-hover-color);--bs-link-color-rgb: 13, 110, 253;--bs-link-opacity: 1;--bs-tertiary-bg: rgba(0, 0, 0, .05);--bs-info-text-emphasis: var(--accent-primary);--bs-info-bg-subtle: rgba(13, 110, 253, .1);--bs-info-border-subtle: rgba(13, 110, 253, .25);--bs-success-text-emphasis: var(--success-color);--bs-success-bg-subtle: rgba(34, 197, 94, .1);--bs-success-border-subtle: rgba(34, 197, 94, .25);--bs-warning-text-emphasis: var(--warning-color);--bs-warning-bg-subtle: rgba(245, 158, 11, .1);--bs-warning-border-subtle: rgba(245, 158, 11, .25);--bs-danger-text-emphasis: var(--error-color);--bs-danger-bg-subtle: rgba(239, 68, 68, .1);--bs-danger-border-subtle: rgba(239, 68, 68, .25)}[data-theme=dark]{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-form: #334155;--bg-tertiary: #283548;--bg-sidebar: #1a202c;--bg-hover: #334155;--text-primary: #e2e8f0;--text-secondary: #cbd5e0;--text-muted: #a0aec0;--text-on-color: #ffffff;--border-color: #2d3748;--border-light: #374151;--accent-primary: #60a5fa;--accent-hover: #93c5fd;--sidebar-active-bg: #2d3748;--error-color: #ef4444;--error-color-rgb: 239, 68, 68;--error-color-alpha-10: rgba(239, 68, 68, .1);--error-color-alpha-15: rgba(239, 68, 68, .15);--error-color-alpha-20: rgba(239, 68, 68, .2);--error-hover: #dc2626;--danger-color: var(--error-color);--success-color: #22c55e;--success-color-rgb: 34, 197, 94;--success-hover: #16a34a;--warning-color: #f59e0b;--warning-color-rgb: 245, 158, 11;--placeholder-text: #718096;--bg-breadcrumb: #1a202c;--link-color: #7dd3fc;--link-hover-color: #38bdf8;--scrollbar-thumb: #4a5568;--scrollbar-thumb-hover: #718096;--primary-color: var(--accent-primary);--primary-color-alpha: rgba(96, 165, 250, .15);--primary-color-alpha-15: rgba(96, 165, 250, .2);--primary-color-alpha-20: rgba(96, 165, 250, .25);--text-placeholder: var(--placeholder-text);--kbd-bg: rgba(255, 255, 255, .1);--error-bg: rgba(239, 68, 68, .15);--auto-detect-color: var(--error-color);--user-tag-color: var(--warning-color);--shadow-color: rgba(0, 0, 0, .25);--shadow-color-medium: rgba(0, 0, 0, .4);--shadow-color-heavy: rgba(0, 0, 0, .6);--badge-info: #60a5fa;--badge-info-text: #ffffff;--badge-info-rgb: 96, 165, 250;--badge-low: #64748b;--badge-low-text: #ffffff;--badge-low-rgb: 100, 116, 139;--badge-medium: #f97316;--badge-medium-text: #ffffff;--badge-medium-rgb: 249, 115, 22;--badge-high: #ef4444;--badge-high-text: #ffffff;--badge-high-rgb: 239, 68, 68;--badge-code: #6b7280;--badge-code-text: #ffffff;--badge-cel: var(--badge-medium);--badge-cel-text: var(--badge-medium-text);--protocol-request: #60a5fa;--protocol-request-bg: rgba(96, 165, 250, .15);--protocol-response: #34d399;--protocol-response-bg: rgba(52, 211, 153, .15);--protocol-meta: #9ca3af;--protocol-meta-bg: rgba(156, 163, 175, .15);--protocol-status: #fbbf24;--protocol-status-bg: rgba(251, 191, 36, .15);--protocol-poweron: #a78bfa;--protocol-poweron-bg: rgba(167, 139, 250, .15);--protocol-command: #22d3ee;--protocol-command-bg: rgba(34, 211, 238, .15);--protocol-error: #f87171;--protocol-error-bg: rgba(248, 113, 113, .15);--packet-viewer-hex: #fdba74;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .3);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .6);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .8);--shadow-accent-sm: 0 2px 8px rgba(96, 165, 250, .2);--shadow-accent-md: 0 4px 12px rgba(96, 165, 250, .25);--shadow-accent-lg: 0 8px 20px rgba(96, 165, 250, .35);--shadow-accent-xl: 0 12px 24px rgba(96, 165, 250, .45);--bs-body-bg: var(--bg-primary);--bs-body-color: var(--text-primary);--bs-border-color: var(--border-color);--bs-border-color-translucent: var(--border-light);--bs-primary: var(--accent-primary);--bs-primary-rgb: 96, 165, 250;--bs-secondary: var(--text-secondary);--bs-secondary-color: var(--placeholder-text);--bs-success: var(--success-color);--bs-danger: var(--error-color);--bs-warning: var(--warning-color);--bs-link-color: var(--link-color);--bs-link-hover-color: var(--link-hover-color);--bs-link-color-rgb: 125, 211, 252;--bs-link-opacity: 1;--bs-tertiary-bg: rgba(255, 255, 255, .05);--bs-info-text-emphasis: var(--accent-primary);--bs-info-bg-subtle: rgba(96, 165, 250, .15);--bs-info-border-subtle: rgba(96, 165, 250, .3);--bs-success-text-emphasis: var(--success-color);--bs-success-bg-subtle: rgba(34, 197, 94, .15);--bs-success-border-subtle: rgba(34, 197, 94, .3);--bs-warning-text-emphasis: var(--warning-color);--bs-warning-bg-subtle: rgba(245, 158, 11, .15);--bs-warning-border-subtle: rgba(245, 158, 11, .3);--bs-danger-text-emphasis: var(--error-color);--bs-danger-bg-subtle: rgba(239, 68, 68, .15);--bs-danger-border-subtle: rgba(239, 68, 68, .3)}[data-theme=dark] .form-check-input{background-color:var(--bg-form);border-color:var(--border-color)}[data-theme=dark] .form-check-input:checked{background-color:var(--accent-primary);border-color:var(--accent-primary)}[data-theme=dark] .form-check-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 .25rem var(--primary-color-alpha)}[data-theme=dark] .form-check-label{color:var(--text-primary)}[data-theme=dark] .form-range::-webkit-slider-runnable-track{background-color:var(--bg-form)}[data-theme=dark] .form-range::-moz-range-track{background-color:var(--bg-form)}[data-theme=dark] .form-range::-webkit-slider-thumb{background-color:var(--accent-primary);border-color:var(--accent-primary)}[data-theme=dark] .form-range::-moz-range-thumb{background-color:var(--accent-primary);border-color:var(--accent-primary)}.device-link{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--link-color)}.device-link:hover{color:var(--link-hover-color);text-decoration:none}.car-link{text-decoration:none;color:var(--link-color)}.car-link:hover{color:var(--link-hover-color);text-decoration:none}.toggleable-section-header{background-color:var(--bg-secondary);border-radius:8px;cursor:pointer;transition:background-color .2s ease}.toggleable-section-header:hover{background-color:var(--sidebar-active-bg)}.rich-text-value-badge{display:inline-block;padding:.15em .4em;border-radius:var(--radius-sm);font-family:monospace;font-size:.95em;font-weight:var(--font-weight-medium);background-color:var(--bg-form);white-space:nowrap;vertical-align:baseline;line-height:1;box-shadow:var(--shadow-xs)}.modal-content{background-color:var(--bg-secondary);color:var(--text-primary);border-color:var(--border-color)}.modal-header{border-bottom-color:var(--border-color)}.modal-footer{border-top-color:var(--border-color)}.modal-title{color:var(--text-primary)}.btn-close{filter:var(--bs-btn-close-filter, invert(1) grayscale(100%) brightness(200%))}[data-theme=dark] .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}.form-control,.form-select{background-color:var(--bg-form);border-color:var(--border-color);color:var(--text-primary)}.form-control:focus,.form-select:focus{background-color:var(--bg-form);border-color:var(--accent-primary);color:var(--text-primary);box-shadow:0 0 0 .25rem var(--primary-color-alpha)}.form-control::placeholder{color:var(--text-placeholder)}.form-label{color:var(--text-primary)}.form-text{color:var(--text-muted)}.nav-tabs{border-bottom-color:var(--border-color)}.nav-tabs .nav-link{color:var(--text-secondary)}.nav-tabs .nav-link:hover,.nav-tabs .nav-link:focus{border-color:var(--border-light) var(--border-light) var(--border-color);color:var(--text-primary)}.nav-tabs .nav-link.active{background-color:var(--bg-secondary);border-color:var(--border-color) var(--border-color) var(--bg-secondary);color:var(--text-primary)}.btn-outline-secondary{background-color:var(--bg-secondary)!important;border-color:var(--border-color)!important;color:var(--text-secondary)!important}.btn-outline-secondary:hover{background-color:var(--bg-primary)!important;border-color:var(--accent-primary)!important;color:var(--accent-primary)!important}.btn-outline-info{background-color:var(--bg-secondary)!important;border-color:var(--info-color)!important;color:var(--info-color)!important}.btn-outline-info:hover{background-color:var(--info-color)!important;border-color:var(--info-color)!important;color:var(--color-white)!important}.tooltip{--bs-tooltip-bg: var(--bg-secondary);--bs-tooltip-color: var(--text-primary);--bs-tooltip-opacity: 1;z-index:1070}.tooltip .tooltip-inner{background-color:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 .125rem .25rem #0000001a;font-size:.75rem;max-width:200px;padding:.375rem .75rem}.tooltip .tooltip-arrow:before{border-color:transparent}.tooltip.bs-tooltip-top .tooltip-arrow:before,.tooltip.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow:before{border-top-color:var(--bg-secondary)}.tooltip.bs-tooltip-end .tooltip-arrow:before,.tooltip.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow:before{border-right-color:var(--bg-secondary)}.tooltip.bs-tooltip-bottom .tooltip-arrow:before,.tooltip.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow:before{border-bottom-color:var(--bg-secondary)}.tooltip.bs-tooltip-start .tooltip-arrow:before,.tooltip.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow:before{border-left-color:var(--bg-secondary)}@keyframes breathing-glow-high{0%,to{box-shadow:0 0 4px rgba(var(--badge-high-rgb),.15),0 0 8px rgba(var(--badge-high-rgb),.08),inset 0 0 4px rgba(var(--badge-high-rgb),.1)}50%{box-shadow:0 0 8px rgba(var(--badge-high-rgb),.15),0 0 12px rgba(var(--badge-high-rgb),.08),inset 0 0 8px rgba(var(--badge-high-rgb),.15)}}@keyframes border-beam{0%{background-position:200% 0%}to{background-position:-200% 0%}}.breathing-glow-high{position:relative;animation:breathing-glow-high 3s ease-in-out infinite}.breathing-glow-high:before{content:"";position:absolute;inset:-2px;border-radius:12px;background:linear-gradient(90deg,transparent 0%,transparent 45%,rgba(var(--badge-high-rgb),.3) 50%,transparent 55%,transparent 100%);background-size:200% 100%;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;padding:2px;animation:border-beam 8s linear infinite;animation-delay:calc(var(--beam-delay, 0) * -1s);pointer-events:none}.breathing-glow-high:hover{animation:none}.breathing-glow-high:hover:before{animation:none;opacity:0}.modal-content[data-modal-border-laptop-only][data-severity=High]{box-shadow:0 0 20px rgba(var(--badge-high-rgb),.4),0 0 40px rgba(var(--badge-high-rgb),.2)}.modal-content[data-modal-border-laptop-only][data-severity=Medium]{box-shadow:0 0 20px rgba(var(--badge-medium-rgb),.4),0 0 40px rgba(var(--badge-medium-rgb),.2)}.modal-content[data-modal-border-laptop-only][data-severity=Low]{box-shadow:0 0 20px rgba(var(--badge-low-rgb),.4),0 0 40px rgba(var(--badge-low-rgb),.2)}.modal-content[data-modal-border-laptop-only][data-severity=Info]{box-shadow:0 0 20px rgba(var(--badge-info-rgb),.4),0 0 40px rgba(var(--badge-info-rgb),.2)}@media(max-width:991.98px){.modal-content[data-modal-border-laptop-only]{box-shadow:none}}.dot-pattern-bg{position:relative}.dot-pattern-bg:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,var(--border-light) 1.5px,transparent 1.5px);background-size:32px 32px;background-position:0 0;opacity:.4;pointer-events:none;border-radius:inherit;z-index:0}.dot-pattern-bg>*{position:relative;z-index:1}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.gradient-text{background:linear-gradient(-45deg,var(--color-blue-600),var(--color-blue-300));background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:900;animation:gradientShift 20s ease infinite;line-height:1.2}.modern-tagline{font-weight:300;letter-spacing:.025em;line-height:1.5}@media(max-width:575.98px){.gradient-text{letter-spacing:-.01em}}html.theme-transitioning,html.theme-transitioning *,html.theme-transitioning *:before,html.theme-transitioning *:after{transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease!important}@keyframes skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--border-light) 25%,var(--bg-primary) 50%,var(--border-light) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.8s ease-in-out infinite;border-radius:4px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--spacing-4xl) var(--spacing-xl);min-height:300px}.empty-state-icon{width:80px;height:80px;border-radius:50%;background:var(--accent-primary-alpha);display:flex;align-items:center;justify-content:center;color:var(--accent-primary);margin-bottom:var(--spacing-xl)}.empty-state-title{font-size:var(--text-h4);font-weight:600;color:var(--text-primary);margin:0 0 var(--spacing-sm) 0}.empty-state-description{font-size:var(--text-base);color:var(--text-secondary);max-width:400px;margin:0 0 var(--spacing-xl) 0;line-height:var(--line-height-relaxed)}.hex-ascii-input-container{width:100%}.hex-ascii-input-container input{transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}.hex-ascii-input-container input:focus{outline:none;border-color:var(--accent-primary)!important;box-shadow:0 0 0 2px var(--primary-color-alpha)!important}.hex-ascii-input-container input::placeholder{color:var(--text-placeholder);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.hex-ascii-input-container input.hex-mode{font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace!important;letter-spacing:.08em!important;font-weight:var(--font-weight-medium)!important;border-color:var(--bs-warning)!important;background-color:var(--bs-warning-bg-subtle)!important;text-transform:uppercase!important;color:var(--packet-viewer-hex)!important}.hex-ascii-input-container input.ascii-mode{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif!important;background-color:var(--bs-info-bg-subtle)!important;border-color:var(--packet-viewer-hex)!important;color:var(--text-primary)!important}.hex-response-container{background-color:var(--background-color-alt);border:1px solid var(--border-color);border-radius:4px;padding:8px;font-family:Courier New,monospace}.list-group-item{border-color:var(--border-color)}.list-group-item:hover{background-color:var(--background-color-alt)}.skunkworks-conn-selector{display:flex;gap:4px}.skunkworks-conn-selector .btn{font-size:12px;padding:2px 8px}.live-page{display:flex;flex-direction:column;height:100%;padding:1rem 1.25rem;gap:.75rem}.live-page-header{flex-shrink:0}.live-page-title-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.live-page-title{margin:0;font-size:1.375rem;font-weight:600;color:var(--color-text-primary, #111827)}.live-page-actions{display:flex;align-items:center;gap:.375rem}.live-action-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border:1px solid var(--color-border, #e5e7eb);border-radius:6px;background:var(--color-bg-primary, #fff);color:var(--color-text-primary, #111827);font-size:.8125rem;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.live-action-btn:hover{background:var(--color-bg-secondary, #f9fafb);border-color:var(--color-border-hover, #d1d5db)}.live-action-btn.active{background:var(--primary-color-alpha-10, rgba(59, 130, 246, .08));border-color:var(--primary-color, #3b82f6);color:var(--primary-color, #3b82f6)}.live-action-btn.primary{background:var(--primary-color, #3b82f6);border-color:var(--primary-color, #3b82f6);color:#fff}.live-action-btn.primary:hover{opacity:.9}.live-action-btn.large{padding:.625rem 1.25rem;font-size:.9375rem;border-radius:8px}.live-action-btn:disabled{opacity:.45;pointer-events:none}.live-status-bar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--color-border, #e5e7eb);font-size:.8125rem}.live-status-left{display:flex;align-items:center;gap:6px}.live-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.live-status-icon{flex-shrink:0;color:var(--color-text-secondary, #6b7280)}.live-status-icon.spinning{animation:spin 1.5s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.live-status-label{font-weight:500;color:var(--color-text-primary, #111827)}.live-status-right{display:flex;align-items:center;gap:4px}.live-status-meta{color:var(--color-text-secondary, #6b7280)}.live-status-sep{color:var(--color-text-muted, #9ca3af)}.live-error{background:var(--color-error-bg, #fef2f2);color:var(--color-error, #ef4444);padding:.75rem 1rem;border-radius:8px;font-size:.875rem}.live-warning{background:var(--color-warning-bg, #fffbeb);color:var(--color-warning-text, #92400e);padding:.75rem 1rem;border-radius:8px;font-size:.875rem}.live-page-body{flex:1;min-height:0;overflow-y:auto}.live-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 1rem;gap:.75rem;text-align:center}.live-empty-icon{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--color-bg-secondary, #f1f5f9);color:var(--color-text-secondary, #6b7280);margin-bottom:.5rem}.live-empty h3{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text-primary, #111827)}.live-empty p{margin:0;color:var(--color-text-secondary, #6b7280);font-size:.875rem;max-width:28rem}.live-widget-grid{padding-bottom:1rem}.live-widget-card{height:100%;display:flex;flex-direction:column;border-radius:10px;border:1px solid var(--color-border, #e5e7eb);background:var(--color-bg-primary, #fff);overflow:hidden;transition:box-shadow .15s,border-color .15s}.live-widget-card:hover{box-shadow:0 1px 4px #0000000f}.live-widget-card.edit-mode{cursor:pointer;border-style:dashed}.live-widget-card.selected{border-color:var(--primary-color, #3b82f6);box-shadow:0 0 0 2px var(--primary-color-alpha-15, rgba(59, 130, 246, .12))}.live-widget-header{display:flex;align-items:center;justify-content:space-between;padding:.375rem .625rem;min-height:28px;gap:.375rem}.live-widget-label{font-size:.6875rem;font-weight:500;color:var(--color-text-secondary, #6b7280);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.live-widget-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.live-widget-action{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:none;border-radius:4px;background:transparent;color:var(--color-text-secondary, #6b7280);cursor:pointer;transition:all .1s}.live-widget-action:hover{background:var(--color-bg-secondary, #f1f5f9);color:var(--color-text-primary, #111827)}.live-widget-action.danger:hover{background:var(--color-error-bg, #fef2f2);color:var(--color-error, #ef4444)}.live-widget-body{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:.25rem .5rem .5rem;overflow:hidden}.live-dialog-overlay{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.live-dialog{background:var(--color-bg-primary, #fff);border-radius:12px;box-shadow:0 20px 60px #00000026;width:100%;max-width:480px;max-height:85vh;overflow-y:auto;padding:1.5rem}.live-dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.375rem}.live-dialog-header h3{margin:0;font-size:1.125rem;font-weight:600}.live-dialog-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:6px;background:transparent;color:var(--color-text-secondary, #6b7280);cursor:pointer}.live-dialog-close:hover{background:var(--color-bg-secondary, #f1f5f9)}.live-dialog-subtitle{color:var(--color-text-secondary, #6b7280);font-size:.8125rem;margin:0 0 1rem;line-height:1.4}.live-dialog-section{margin-bottom:1rem}.live-dialog-label{display:block;font-size:.8125rem;font-weight:600;color:var(--color-text-primary, #111827);margin-bottom:.5rem}.live-dialog-primary-btn{display:block;width:100%;padding:.75rem;border:none;border-radius:8px;background:var(--primary-color, #3b82f6);color:#fff;font-size:.9375rem;font-weight:600;cursor:pointer;transition:opacity .15s;margin-top:.5rem}.live-dialog-primary-btn:hover{opacity:.9}.live-dialog-primary-btn:disabled{opacity:.45;cursor:default}.live-config-field{margin-bottom:.75rem}.live-config-field label{display:block;font-size:.75rem;font-weight:500;color:var(--color-text-secondary, #6b7280);margin-bottom:.25rem}.live-config-field input{width:100%;padding:.5rem .625rem;border:1px solid var(--color-border, #e5e7eb);border-radius:6px;font-size:.875rem;background:var(--color-bg-primary, #fff);color:var(--color-text-primary, #111827);outline:none;transition:border-color .15s;box-sizing:border-box}.live-config-field input:focus{border-color:var(--primary-color, #3b82f6);box-shadow:0 0 0 2px var(--primary-color-alpha, rgba(59, 130, 246, .1))}.live-config-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.live-config-row .live-config-field{margin-bottom:0}.live-widget-type-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.live-widget-type-card{display:flex;flex-direction:column;gap:.25rem;padding:.75rem;border:1px solid var(--color-border, #e5e7eb);border-radius:8px;background:var(--color-bg-primary, #fff);color:var(--color-text-secondary, #6b7280);cursor:pointer;transition:all .15s;text-align:left}.live-widget-type-card:hover{border-color:var(--color-border-hover, #d1d5db);background:var(--color-bg-secondary, #f9fafb)}.live-widget-type-card.active{border-color:var(--primary-color, #3b82f6);background:var(--primary-color-alpha-10, rgba(59, 130, 246, .06));color:var(--primary-color, #3b82f6)}.live-widget-type-card.disabled{opacity:.45;pointer-events:none}.live-widget-type-label{font-size:.8125rem;font-weight:600;color:var(--color-text-primary, #111827)}.live-widget-type-card.active .live-widget-type-label{color:var(--primary-color, #3b82f6)}.live-widget-type-desc{font-size:.6875rem;line-height:1.3}.live-widget-type-chips{display:flex;flex-wrap:wrap;gap:.375rem}.live-widget-type-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.375rem .625rem;border:1px solid var(--color-border, #e5e7eb);border-radius:6px;background:var(--color-bg-primary, #fff);color:var(--color-text-primary, #111827);font-size:.75rem;font-weight:500;cursor:pointer;transition:all .15s}.live-widget-type-chip.active{background:var(--primary-color, #3b82f6);border-color:var(--primary-color, #3b82f6);color:#fff}.live-sensor-picker{border:1px solid var(--color-border, #e5e7eb);border-radius:8px;overflow:hidden}.live-sensor-search{display:flex;align-items:center;gap:.5rem;padding:.5rem .625rem;border-bottom:1px solid var(--color-border, #e5e7eb);color:var(--color-text-secondary, #6b7280)}.live-sensor-search input{border:none;outline:none;background:transparent;font-size:.8125rem;color:var(--color-text-primary, #111827);flex:1;min-width:0}.live-sensor-search input::placeholder{color:var(--color-text-muted, #9ca3af)}.live-sensor-list{max-height:220px;overflow-y:auto}.live-sensor-group-header{position:sticky;top:0;padding:.375rem .625rem;font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--color-text-secondary, #6b7280);background:var(--color-bg-secondary, #f9fafb)}.live-sensor-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.5rem .625rem;border:none;background:transparent;color:var(--color-text-primary, #111827);font-size:.8125rem;cursor:pointer;text-align:left;transition:background .1s}.live-sensor-item:hover{background:var(--color-bg-secondary, #f9fafb)}.live-sensor-item.selected{background:var(--primary-color-alpha-10, rgba(59, 130, 246, .08))}.live-sensor-item.dimmed{opacity:.5}.live-sensor-item-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-sensor-item-preview{flex-shrink:0;font-size:.75rem;font-weight:500;font-variant-numeric:tabular-nums;color:var(--color-text-secondary, #6b7280);margin-left:.5rem}.live-sensor-empty{padding:1.5rem;text-align:center;color:var(--color-text-secondary, #6b7280);font-size:.8125rem}.live-template-panel{background:var(--color-bg-secondary, #f9fafb);border:1px solid var(--color-border, #e5e7eb);border-radius:8px;padding:.75rem}.live-template-save{display:flex;gap:.5rem;margin-bottom:.5rem}.live-template-save input{flex:1;padding:.375rem .625rem;border:1px solid var(--color-border, #e5e7eb);border-radius:6px;font-size:.8125rem;background:var(--color-bg-primary, #fff);color:var(--color-text-primary, #111827);outline:none}.live-template-save input:focus{border-color:var(--primary-color, #3b82f6)}.live-template-list{display:flex;flex-direction:column;gap:2px}.live-template-item{display:flex;align-items:center;gap:.25rem}.live-template-load{flex:1;padding:.375rem .5rem;border:none;border-radius:4px;background:transparent;color:var(--color-text-primary, #111827);font-size:.8125rem;text-align:left;cursor:pointer}.live-template-load:hover{background:var(--color-bg-primary, #fff)}.live-template-delete{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:4px;background:transparent;color:var(--color-text-muted, #9ca3af);cursor:pointer}.live-template-delete:hover{color:var(--color-error, #ef4444);background:var(--color-error-bg, #fef2f2)}@media(max-width:768px){.live-page{padding:.75rem}.live-page-title{font-size:1.125rem}.live-widget-grid{grid-template-columns:repeat(2,1fr)!important}}@media(max-width:480px){.live-widget-grid{grid-template-columns:1fr!important}}