html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Microsoft YaHei,sans-serif;font-size:12px;line-height:1.4;color:#333;background-color:#f0f0f0}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:#fff}.loading-spinner{width:40px;height:40px;border:3px solid #e0e0e0;border-top-color:#1976d2;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.app{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden}.menu-bar{display:flex;align-items:center;height:26px;background:linear-gradient(to bottom,#e8e8e8,#d0d0d0);border-bottom:1px solid #a0a0a0;padding:0 4px;font-size:12px}.menu-bar-item{padding:3px 10px;cursor:pointer;border-radius:2px;font-size:12px}.menu-bar-item:hover{background:silver}.tool-bar{display:flex;align-items:center;height:32px;background:linear-gradient(to bottom,#f5f5f5,#e0e0e0);border-bottom:1px solid #b0b0b0;padding:0 4px;gap:2px}.tool-bar-button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid transparent;border-radius:2px;background:transparent;cursor:pointer;font-size:12px}.tool-bar-button:hover{background:#d0d0d0;border-color:#a0a0a0}.tool-bar-separator{width:1px;height:20px;background:silver;margin:0 4px}.main-content{display:flex;flex:1;overflow:hidden}.left-side-container{display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}.left-panels{display:flex;flex:1;overflow:hidden}.hierarchy-panel,.signal-panel{background:#fff;display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}.right-panel{flex:1;display:flex;flex-direction:column;overflow:hidden;background:#fff}.panel-header{display:flex;align-items:center;height:22px;background:linear-gradient(to bottom,#e0e8f0,#c0d0e0);border-bottom:1px solid #a0b0c0;padding:0 6px;font-weight:600;font-size:11px;color:#333}.tab-panel{display:flex;flex-direction:column;height:100%}.tab-header{display:flex;background:linear-gradient(to bottom,#e8e8e8,#d0d0d0);border-bottom:1px solid #a0a0a0;padding:2px 4px 0;gap:2px}.tab-button{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 12px;background:linear-gradient(to bottom,#f0f0f0,#e0e0e0);border:1px solid #a0a0a0;border-bottom:none;border-radius:3px 3px 0 0;cursor:pointer;font-size:11px;font-weight:500;user-select:none}.tab-button:hover{background:linear-gradient(to bottom,#f8f8f8,#e8e8e8)}.tab-button.active{background:#fff;border-bottom:1px solid #fff;margin-bottom:-1px}.tab-label{flex:1}.tab-close{width:14px;height:14px;display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1;color:#666;border-radius:2px}.tab-close:hover{background:#d0d0d0;color:#333}.tab-rename-input{width:80px;padding:2px 4px;font-size:11px;border:1px solid #4080c0;border-radius:2px;outline:none}.tab-add-buttons{display:flex;gap:2px;margin-left:auto;padding-left:8px}.tab-add-btn{padding:2px 8px;background:linear-gradient(to bottom,#f8f8f8,#e0e0e0);border:1px solid #a0a0a0;border-radius:3px;cursor:pointer;font-size:10px;font-weight:500;color:#333}.tab-add-btn:hover{background:linear-gradient(to bottom,#fff,#e8e8e8)}.tab-content{flex:1;overflow:hidden;background:#fff}.tree-view{flex:1;overflow:auto;background:#fff}.tree-node{display:flex;align-items:center;height:20px;padding:0 4px;cursor:pointer;user-select:none;font-size:11px}.tree-node:hover{background:#e0f0ff}.tree-node.selected{background:#c0e0ff;color:#000}.tree-node-icon{width:14px;height:14px;margin-right:2px;display:flex;align-items:center;justify-content:center;font-size:10px}.tree-node-expand{width:14px;height:14px;margin-right:2px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:9px}.signal-list{flex:1;overflow:auto;background:#fff}.signal-item{display:flex;align-items:center;height:20px;padding:0 6px;cursor:pointer;user-select:none;font-size:11px;border-bottom:1px solid #f0f0f0}.signal-item:hover{background:#e0f0ff}.signal-item.selected{background:#c0e0ff}.signal-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.signal-type{font-size:9px;color:#666;margin-left:4px}.signal-value{font-size:10px;color:#06c;font-family:Consolas,monospace;margin-left:4px}.waveform-container{display:flex;height:100%;overflow:hidden}.waveform-signal-panel{position:relative;background:#f8f8f8;display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}.waveform-header{height:22px;background:linear-gradient(to bottom,#e0e8f0,#c0d0e0);border-bottom:1px solid #a0b0c0;display:flex;align-items:center;padding:0 6px;font-size:11px;font-weight:600;flex-shrink:0}.waveform-signal-list{flex:1;overflow:auto;scroll-snap-type:y mandatory}.waveform-signal-list>div{scroll-snap-align:start}.waveform-group-header{display:flex;align-items:center;height:24px;background:#e8e8e8;border-bottom:1px solid #d0d0d0;font-size:11px;font-weight:600;cursor:pointer;user-select:none}.waveform-group-header:hover{background:#d8d8d8}.waveform-group-header.selected{background:#c0d8f0}.waveform-signal-item{display:flex;align-items:center;height:24px;border-bottom:1px solid #e8e8e8;font-size:11px;cursor:pointer;user-select:none}.waveform-signal-item:hover{background:#e0f0ff}.waveform-signal-item.selected{background:#c0e0ff}.waveform-signal-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:4px}.waveform-signal-value{font-family:Consolas,monospace;font-size:10px;color:#06c;min-width:60px;text-align:right;border-left:1px solid #d0d0d0;padding-left:4px}.waveform-signal-remove{width:16px;height:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;font-size:12px;color:#666}.waveform-signal-item:hover .waveform-signal-remove{opacity:1}.waveform-signal-remove:hover{color:#c00}.waveform-bus-bits{background:#f0f0f0}.waveform-bus-bit{display:flex;align-items:center;height:24px;border-bottom:1px solid #e0e0e0;font-size:10px;color:#666}.waveform-canvas-container{flex:1;position:relative;overflow:hidden;background:#fff;display:flex;flex-direction:column}.waveform-canvas{flex:1;width:100%;cursor:crosshair}.panel-resizer,.panel-splitter{width:8px;cursor:col-resize;background:#e8e8e8;border-left:1px solid #c0c0c0;border-right:1px solid #c0c0c0;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}.panel-resizer:hover,.panel-splitter:hover{background:#d0d0d0}.panel-resizer:active,.panel-splitter:active{background:#b0b0b0}.panel-resizer-handle{width:3px;height:30px;background:#909090;border-radius:1.5px}.code-editor{height:100%;overflow:auto;font-family:Consolas,Monaco,Courier New,monospace;font-size:12px;line-height:1.5;background:#fff}.code-line{display:flex;min-height:18px}.code-line-number{width:45px;padding:0 6px;text-align:right;color:#999;background:#f5f5f5;border-right:1px solid #e0e0e0;user-select:none;font-size:11px}.code-line-content{flex:1;padding:0 6px;white-space:pre}.bottom-panel{min-height:60px;background:#fff;border-top:1px solid #b0b0b0;overflow:hidden;flex-shrink:0}.message-window{height:100%;overflow:auto;font-family:Consolas,Monaco,Courier New,monospace;font-size:11px;padding:4px;background:#fff}.message-item{padding:1px 0;border-bottom:1px solid #f0f0f0;color:#333}.dialog-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.dialog{background:#f0f0f0;border:1px solid #808080;border-radius:3px;box-shadow:0 4px 20px #0000004d;min-width:400px;max-width:600px}.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:linear-gradient(to bottom,#e0e8f0,#c0d0e0);border-bottom:1px solid #a0b0c0}.dialog-title{font-size:13px;font-weight:600}.dialog-close{background:none;border:none;font-size:16px;cursor:pointer;color:#666;padding:0 4px}.dialog-close:hover{color:#000}.dialog-body{padding:16px;background:#f8f8f8}.dialog-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;background:#f0f0f0;border-top:1px solid #d0d0d0}.form-group{margin-bottom:12px}.form-label{display:block;margin-bottom:3px;font-weight:500;color:#333;font-size:11px}.form-input{width:100%;padding:4px 8px;border:1px solid #a0a0a0;border-radius:2px;font-size:12px;background:#fff}.form-input:focus{outline:none;border-color:#4080c0}.btn{padding:4px 12px;border:1px solid #808080;border-radius:2px;background:linear-gradient(to bottom,#f0f0f0,#e0e0e0);cursor:pointer;font-size:11px}.btn:hover{background:linear-gradient(to bottom,#f8f8f8,#e8e8e8)}.btn-primary{background:linear-gradient(to bottom,#4080c0,#2060a0);color:#fff;border-color:#205080}.btn-primary:hover{background:linear-gradient(to bottom,#5090d0,#3070b0)}.status-indicator{display:inline-flex;align-items:center;gap:4px;font-size:11px}.status-dot{width:6px;height:6px;border-radius:50%}.status-dot.connected{background:#0a0}.status-dot.disconnected{background:#c00}::-webkit-scrollbar{width:14px;height:14px}::-webkit-scrollbar-track{background:#f0f0f0;border:1px solid #d0d0d0}::-webkit-scrollbar-thumb{background:silver;border:1px solid #a0a0a0}::-webkit-scrollbar-thumb:hover{background:#b0b0b0}::-webkit-scrollbar-corner{background:#f0f0f0}:root{--primary-color: #1976d2;--primary-dark: #1565c0;--success-color: #4caf50;--error-color: #f44336;--warning-color: #ff9800;--text-primary: #333;--text-secondary: #666;--bg-primary: #fff;--bg-secondary: #f5f5f5;--border-color: #d0d0d0}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-size:13px;line-height:1.5;color:var(--text-primary);background-color:var(--bg-secondary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%;width:100%}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}