.header{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1.5rem;background:var(--bg-card);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-left{display:flex;align-items:center;gap:1.5rem}.logo{display:flex;align-items:center;gap:.625rem}.logo-icon{width:28px;height:28px;color:var(--accent-primary);filter:drop-shadow(0 0 8px var(--accent-primary))}.logo-text{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.logo-accent{font-weight:400}.connection-badge{display:flex;align-items:center;gap:.5rem;padding:.375rem .875rem;border-radius:20px;font-size:.8rem;font-weight:500;transition:all .3s ease}.connection-badge.connected{background:#00dcb426;color:var(--accent-primary);border:1px solid var(--accent-primary)}.connection-badge.disconnected{background:var(--bg-secondary);color:var(--text-muted);border:1px solid var(--border-color)}.status-dot{width:8px;height:8px;border-radius:50%;transition:all .3s ease}.connected .status-dot{background:var(--accent-primary);box-shadow:0 0 10px var(--accent-primary);animation:pulse 2s infinite}.disconnected .status-dot{background:var(--text-muted)}.header-right{display:flex;align-items:center;gap:.5rem}.settings-toggle,.theme-toggle{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-secondary);transition:all .2s ease}.settings-toggle:hover,.theme-toggle:hover{color:var(--accent-primary);border-color:var(--accent-primary);box-shadow:var(--shadow-glow)}.settings-toggle.active{color:var(--accent-danger);border-color:var(--accent-danger);background:#e74c3c1a}.settings-toggle.active:hover{color:#fff;background:var(--accent-danger);box-shadow:0 0 15px #e74c3c66}.settings-toggle{display:none}@media(max-width:1027px){.settings-toggle{display:flex}}@media(max-width:768px){.header{padding:.75rem 1rem}.logo-text{font-size:1.15rem}.connection-badge{padding:.25rem .625rem;font-size:.75rem}.settings-toggle,.theme-toggle{width:38px;height:38px}}@media(max-width:480px){.header-left{gap:.75rem}.logo-icon{width:24px;height:24px}.logo-text{display:none}}.connection-panel{animation:slideDown .4s ease-out;display:flex;flex-direction:column;max-height:100%;overflow:hidden}.connection-panel .card-body{overflow-y:auto;flex:1;min-height:0}.card-header.clickable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s ease}.card-header.clickable:hover{background:var(--bg-hover)}.expand-icon{color:var(--text-muted);transition:transform .3s ease}.expand-icon.expanded{transform:rotate(180deg)}.connection-type-selector{display:flex;gap:.5rem;margin-bottom:1rem;padding:.25rem;background:var(--bg-secondary);border-radius:var(--radius-md)}.type-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.375rem;padding:.5rem .75rem;border-radius:var(--radius-sm);font-size:.8rem;font-weight:500;color:var(--text-muted);transition:all .2s ease}.type-btn:hover:not(:disabled){color:var(--text-secondary);background:var(--bg-hover)}.type-btn.active{color:var(--accent-primary);background:var(--bg-card);box-shadow:var(--shadow-sm)}.type-btn.disabled{opacity:.4;cursor:not-allowed}.config-input{width:100%;padding:.625rem .875rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:.85rem;transition:all .2s ease}.config-input:hover:not(:disabled){border-color:var(--accent-primary)}.config-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #00dcb426}.config-input:disabled{opacity:.6;cursor:not-allowed}.config-hint{grid-column:1 / -1;font-size:.75rem;color:var(--text-muted);padding:.5rem;background:var(--bg-tertiary);border-radius:var(--radius-sm)}.config-section-label{grid-column:1 / -1;font-size:.75rem;color:var(--text-muted);font-weight:500;padding-top:.5rem;border-top:1px solid var(--border-color);margin-top:.25rem}.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.25rem}.config-item{display:flex;flex-direction:column;gap:.375rem}.config-item.full-width{grid-column:1 / -1}.config-item label{font-size:.8rem;color:var(--text-secondary);font-weight:500}.config-item select{padding:.625rem 2rem .625rem .875rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:.9rem;cursor:pointer;transition:all .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a8fa8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center}.config-item select:hover:not(:disabled){border-color:var(--accent-primary)}.config-item select:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #00dcb426}.config-item select:disabled{opacity:.6;cursor:not-allowed}.connect-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.875rem 1.25rem;border-radius:var(--radius-md);font-weight:600;font-size:.95rem;transition:all .3s ease;position:relative;overflow:hidden}.connect-btn.connect{background:var(--gradient-accent);color:#fff;box-shadow:0 4px 15px #00b89459}.connect-btn.connect:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #00b89473}.connect-btn.disconnect{background:var(--bg-secondary);color:var(--accent-danger);border:1px solid var(--accent-danger)}.connect-btn.disconnect:hover:not(:disabled){background:#e74c3c1a}.connect-btn:disabled{cursor:not-allowed;opacity:.7}.connect-btn.loading{pointer-events:none}.spinner{width:18px;height:18px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.connection-panel .card-body{padding:.75rem}.connection-type-selector{flex-wrap:wrap}.type-btn{min-width:calc(50% - .25rem);padding:.5rem .375rem}.config-grid{gap:.5rem;margin-bottom:.75rem}.config-hint{padding:.375rem;font-size:.7rem}.config-section-label{padding-top:.375rem;margin-top:.125rem}}@media(max-width:480px){.connection-panel .card-body{padding:.5rem}.config-grid{grid-template-columns:1fr 1fr;gap:.375rem;margin-bottom:.5rem}.config-item.full-width{grid-column:1 / -1}.config-item{gap:.2rem}.config-item label{font-size:.7rem}.config-item select,.config-input{padding:.375rem .5rem;font-size:.75rem}.connection-type-selector{gap:.25rem;margin-bottom:.5rem;padding:.15rem}.type-btn{font-size:.65rem;padding:.35rem .2rem;gap:.15rem}.type-btn svg{width:11px;height:11px}.connect-btn{padding:.5rem .625rem;font-size:.8rem}.config-hint{padding:.2rem .3rem;font-size:.6rem}.config-section-label{font-size:.65rem;padding-top:.2rem;margin-top:0}}.console{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.console-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.625rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);gap:1rem;flex-wrap:wrap;flex-shrink:0}.toolbar-left{display:flex;align-items:center;gap:1rem}.log-count{font-size:.8rem;color:var(--text-muted);font-family:var(--font-mono)}.toolbar-right{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.toggle-option{display:flex;align-items:center;gap:.375rem;font-size:.8rem;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-option input{width:14px;height:14px;accent-color:var(--accent-primary);cursor:pointer}.display-toggle{display:flex;background:var(--bg-tertiary);border-radius:var(--radius-sm);padding:2px;gap:2px}.toggle-btn{display:flex;align-items:center;justify-content:center;padding:.375rem .5rem;border-radius:4px;color:var(--text-muted);transition:all .2s ease}.toggle-btn:hover{color:var(--text-secondary)}.toggle-btn.active{background:var(--bg-card);color:var(--accent-primary);box-shadow:var(--shadow-sm)}.console-output{flex:1;overflow-y:auto;overflow-x:hidden;padding:.75rem 1rem;background:var(--bg-primary);font-family:var(--font-mono);font-size:.85rem;line-height:1.7;min-height:0;max-height:100%}.console-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:200px;color:var(--text-muted);text-align:center;gap:.5rem}.empty-icon{font-size:3rem;margin-bottom:.5rem;opacity:.6}.empty-hint{font-size:.8rem;opacity:.7}.log-entry{display:flex;gap:.75rem;padding:.25rem 0;animation:fadeIn .2s ease-out}.log-entry:hover{background:var(--bg-hover);margin:0 -.5rem;padding:.25rem .5rem;border-radius:var(--radius-sm)}.log-time{color:var(--text-muted);flex-shrink:0;font-size:.75rem}.log-direction{flex-shrink:0;font-weight:600;font-size:.75rem;min-width:50px}.log-entry.sent .log-direction{color:var(--accent-secondary)}.log-entry.received .log-direction{color:var(--accent-primary)}.log-entry.info .log-direction{color:var(--text-muted)}.log-entry.error .log-direction{color:var(--accent-danger)}.log-data{word-break:break-all;flex:1;color:var(--text-primary);white-space:pre-wrap}.log-data span{white-space:pre-wrap}.log-entry.error .log-data{color:var(--accent-danger)}.log-entry.info .log-data{color:var(--text-secondary);font-style:italic}@media(max-width:768px){.console-toolbar{padding:.5rem .75rem}.toolbar-right{gap:.5rem}.log-entry{flex-wrap:wrap}.log-time{width:100%;margin-bottom:.125rem}}@media(max-width:480px){.console-output{font-size:.8rem;padding:.5rem .75rem}}.terminal{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;background:var(--bg-primary);cursor:text}.terminal-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);gap:1rem;flex-wrap:wrap;flex-shrink:0}.terminal-toolbar .toolbar-left{display:flex;align-items:center;gap:.5rem;color:var(--accent-primary)}.terminal-title{font-weight:600;font-size:.85rem;color:var(--text-primary)}.offline-badge{font-size:.7rem;padding:.125rem .375rem;background:var(--accent-danger);color:#fff;border-radius:4px;margin-left:.5rem}.terminal-toolbar .toolbar-right{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.terminal-option{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;padding:.25rem .5rem;border-radius:var(--radius-sm);transition:background .2s}.terminal-option:hover{background:var(--bg-hover)}.terminal-option input{width:12px;height:12px;accent-color:var(--accent-primary);cursor:pointer}.terminal-output{flex:1;overflow-y:auto;overflow-x:hidden;padding:.75rem 1rem;font-family:var(--font-mono);font-size:.85rem;line-height:1.6;min-height:0;position:relative;background:var(--bg-primary)}.terminal-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:var(--text-muted);text-align:center;gap:.25rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.terminal-welcome p{margin:0}.terminal-welcome .hint{font-size:.75rem;opacity:.7}.terminal-line{white-space:pre-wrap;word-break:break-all;padding:.125rem 0;line-height:1.5}.terminal-line.input{color:var(--accent-secondary)}.terminal-line.input:before{content:"> ";color:var(--accent-primary);font-weight:600}.terminal-line.output{color:var(--text-primary)}.terminal-line.error{color:var(--accent-danger)}.terminal-line.info{color:var(--text-muted);font-style:italic}.terminal-input-line{display:flex;align-items:center;gap:.5rem;padding:.125rem 0;line-height:1.5;min-height:1.5em}.prompt{color:var(--accent-primary);font-family:var(--font-mono);font-weight:600;font-size:inherit;flex-shrink:0;-webkit-user-select:none;user-select:none}.terminal-input-wrapper{flex:1;position:relative;display:flex;align-items:center;min-width:0}.terminal-input-mirror{color:var(--text-primary);font-family:var(--font-mono);font-size:inherit;white-space:pre;pointer-events:none}.terminal-inline-input{position:absolute;left:0;top:0;width:100%;height:100%;background:transparent;border:none;color:transparent;font-family:var(--font-mono);font-size:inherit;line-height:inherit;padding:0;margin:0;outline:none;caret-color:transparent}.terminal-inline-input:disabled{cursor:not-allowed}.terminal-inline-input:disabled+.terminal-input-mirror,.terminal-input-wrapper:has(.terminal-inline-input:disabled) .terminal-input-mirror{opacity:.5}.terminal-input-wrapper:has(.terminal-inline-input.hex-mode) .terminal-input-mirror{color:var(--accent-secondary)}.terminal-inline-input::placeholder{color:var(--text-muted);font-style:italic}.cursor-blink{color:var(--accent-primary);animation:blink 1s step-end infinite;font-weight:400}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.terminal .clear-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);transition:all .2s}.terminal .clear-btn:hover{color:var(--accent-danger);background:#e74c3c1a}@media(max-width:768px){.terminal-toolbar{padding:.375rem .75rem}.terminal-option span{display:none}.terminal-option{padding:.25rem}.terminal-output{font-size:.8rem;padding:.5rem .75rem}}@media(max-width:480px){.terminal-title{display:none}}.quick-commands{flex:1;display:flex;flex-direction:column;min-height:200px;animation:slideDown .4s ease-out;animation-delay:.1s;animation-fill-mode:backwards}.quick-commands .card-body{flex:1;display:flex;flex-direction:column;padding:.75rem;overflow:hidden}.header-actions{display:flex;align-items:center;gap:.5rem}.add-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);color:var(--text-secondary);transition:all .2s ease}.add-btn:hover{background:var(--accent-primary);color:#fff}.commands-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.empty-commands{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;color:var(--text-muted);font-size:.85rem}.empty-commands button{padding:.5rem 1rem;border-radius:var(--radius-md);background:var(--bg-secondary);color:var(--accent-primary);font-size:.8rem;transition:all .2s ease}.empty-commands button:hover{background:var(--accent-primary);color:#fff}.command-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.625rem .75rem;background:var(--bg-secondary);border-radius:var(--radius-md);transition:all .2s ease}.command-item:hover{background:var(--bg-tertiary)}.command-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.command-name{font-weight:500;font-size:.85rem;color:var(--text-primary)}.command-data{font-size:.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hex-badge{display:inline-block;padding:.125rem .375rem;background:var(--accent-secondary);color:#fff;font-size:.65rem;font-weight:600;border-radius:4px;margin-top:.25rem;width:fit-content}.command-actions{display:flex;align-items:center;gap:.25rem}.command-actions button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);color:var(--text-muted);transition:all .2s ease}.edit-btn:hover{background:var(--bg-hover);color:var(--accent-primary)}.delete-btn:hover{background:#e74c3c1a;color:var(--accent-danger)}.send-btn{background:var(--accent-primary);color:#fff!important}.send-btn:hover:not(:disabled){box-shadow:0 0 15px var(--accent-primary)}.send-btn:disabled{opacity:.4;cursor:not-allowed}.command-form{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--bg-secondary);border-radius:var(--radius-md);margin-bottom:.75rem;animation:slideDown .2s ease-out}.command-form.inline{flex:1;margin-bottom:0;padding:0;background:none}.command-form input[type=text]{width:100%;padding:.5rem .75rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.85rem;transition:all .2s ease}.command-form input[type=text]:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #00dcb426}.form-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.hex-toggle{display:flex;align-items:center;gap:.375rem;font-size:.8rem;color:var(--text-secondary);cursor:pointer}.hex-toggle input{accent-color:var(--accent-primary)}.form-actions{display:flex;gap:.375rem}.form-actions button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);transition:all .2s ease}.cancel-btn{color:var(--text-muted)}.cancel-btn:hover{background:#e74c3c1a;color:var(--accent-danger)}.save-btn{background:var(--accent-primary);color:#fff}.save-btn:hover{box-shadow:0 0 10px var(--accent-primary)}@media(max-width:768px){.quick-commands{min-height:auto;flex:0 0 auto}.quick-commands .card-body{max-height:none;overflow-y:visible;padding:.75rem}.commands-list{max-height:280px;overflow-y:auto;gap:.5rem}.command-item{padding:.75rem;gap:.75rem}.command-name{font-size:.9rem}.command-data{font-size:.8rem}.command-actions button,.add-btn{width:32px;height:32px}}@media(max-width:480px){.quick-commands .card-body{padding:.625rem}.commands-list{max-height:240px;gap:.375rem}.command-item{padding:.625rem;gap:.5rem}.command-name{font-size:.85rem}.command-data{font-size:.75rem}.command-actions button{width:28px;height:28px}.command-form{padding:.625rem;gap:.5rem}.command-form input[type=text]{padding:.5rem .625rem;font-size:.85rem}.hex-toggle{font-size:.8rem}.add-btn{width:28px;height:28px}.hex-badge{font-size:.7rem;padding:.15rem .4rem}}.waveform-chart{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.chart-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.625rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);gap:1rem;flex-wrap:wrap;flex-shrink:0}.channel-toggles{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.no-channels{font-size:.8rem;color:var(--text-muted);font-style:italic}.channel-toggle{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);font-size:.8rem;transition:all .2s ease;border:1px solid transparent}.channel-toggle:hover{color:var(--text-secondary)}.channel-toggle.active{color:var(--channel-color);border-color:var(--channel-color);background:color-mix(in srgb,var(--channel-color) 10%,transparent)}.chart-actions{display:flex;align-items:center;gap:.5rem}.reset-zoom-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);transition:all .2s ease}.reset-zoom-btn:hover{color:var(--accent-warning);background:#fdcb6e26;border-color:var(--accent-warning)}.points-info{font-size:.75rem;color:var(--text-muted);font-family:var(--font-mono);padding:.25rem .5rem;background:var(--bg-tertiary);border-radius:var(--radius-sm)}.settings-btn,.api-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-muted);transition:all .2s ease}.settings-btn:hover{color:var(--accent-primary);background:#00dcb41a}.api-btn:hover{color:var(--accent-secondary);background:#6c5ce71a}.clear-btn{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-secondary);font-size:.8rem;transition:all .2s ease}.clear-btn:hover{color:var(--accent-danger);background:#e74c3c1a}.settings-panel{padding:1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);animation:slideDown .3s ease-out}.settings-panel h4{margin-bottom:.75rem;color:var(--text-primary);font-size:.9rem}.setting-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.setting-row label{font-size:.85rem;color:var(--text-secondary);min-width:100px}.setting-row input[type=number]{width:100px;padding:.5rem .75rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.85rem;text-align:center}.setting-row input[type=number]:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #00dcb426}.setting-hint{font-size:.75rem;color:var(--text-muted)}.setting-actions{display:flex;gap:.5rem;justify-content:flex-end}.setting-actions .cancel-btn,.setting-actions .save-btn{padding:.375rem .75rem;border-radius:var(--radius-sm);font-size:.8rem;transition:all .2s ease}.setting-actions .cancel-btn{background:var(--bg-tertiary);color:var(--text-secondary)}.setting-actions .cancel-btn:hover{background:var(--bg-hover)}.setting-actions .save-btn{background:var(--accent-primary);color:#fff}.setting-actions .save-btn:hover{box-shadow:0 0 10px var(--accent-primary)}.api-help{flex:1;display:flex;flex-direction:column;padding:1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);animation:slideDown .3s ease-out;overflow-y:auto}.api-help-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;flex-wrap:wrap;gap:.5rem}.api-help-header h4{margin:0;color:var(--text-primary);font-size:.9rem}.api-help-actions{display:flex;gap:.5rem}.reset-btn,.apply-btn{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border-radius:var(--radius-sm);font-size:.8rem;transition:all .2s ease}.reset-btn{background:var(--bg-tertiary);color:var(--text-secondary)}.reset-btn:hover{color:var(--accent-warning);background:#fdcb6e1a}.apply-btn{background:var(--accent-primary);color:#fff}.apply-btn:hover{box-shadow:0 0 10px var(--accent-primary)}.apply-btn.success{background:var(--accent-success)}.code-error{padding:.625rem .875rem;background:#e74c3c1a;border:1px solid var(--accent-danger);border-radius:var(--radius-sm);color:var(--accent-danger);font-size:.8rem;margin-bottom:.75rem}.code-editor{flex:1;width:100%;min-height:150px;padding:1rem;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.8rem;line-height:1.6;color:var(--text-primary);resize:none;margin-bottom:.75rem;-moz-tab-size:2;tab-size:2}.code-editor:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #00dcb426}.api-console-hint{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.625rem .875rem;background:var(--bg-tertiary);border-radius:var(--radius-sm);margin-bottom:.75rem}.api-console-hint p{margin:0;font-size:.8rem;color:var(--text-secondary)}.api-console-hint code{padding:.25rem .5rem;background:var(--bg-primary);border-radius:4px;color:var(--accent-primary);font-size:.75rem}.close-help{padding:.375rem .75rem;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-secondary);font-size:.8rem;transition:all .2s ease}.close-help:hover{background:var(--bg-hover);color:var(--text-primary)}.chart-container{flex:1;padding:1rem;min-height:300px;position:relative}.zoom-drag-box{position:absolute;background:#00dcb426;border:2px dashed rgba(0,220,180,.6);border-radius:4px;pointer-events:none;z-index:10;display:none}[data-theme=light] .zoom-drag-box{background:#00b89426;border-color:#00b89499}.chart-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:250px;color:var(--text-muted);text-align:center;gap:.5rem}.chart-empty .empty-icon{font-size:3rem;margin-bottom:.5rem;opacity:.6}.chart-empty p{margin:0}.chart-empty .empty-hint{font-size:.8rem;opacity:.7}.chart-empty code{padding:.125rem .375rem;background:var(--bg-secondary);border-radius:4px;color:var(--accent-primary)}@media(max-width:768px){.chart-toolbar{padding:.5rem .75rem}.channel-toggles{width:100%;justify-content:flex-start}.channel-toggle{padding:.25rem .5rem;font-size:.75rem}.chart-container{padding:.75rem;min-height:250px}.code-editor{min-height:200px;font-size:.75rem}.setting-row{flex-wrap:wrap}.setting-row label{width:100%;min-width:auto}.points-info{display:none}.reset-zoom-btn{width:32px;height:32px}}@media(max-width:480px){.channel-toggle span:not(.channel-toggle svg){display:none}.channel-toggle{width:32px;height:32px;justify-content:center;padding:0}.channel-toggle svg{margin:0}.api-help-header{flex-direction:column;align-items:flex-start}.api-help-actions{width:100%;justify-content:flex-end}}.send-panel{padding:1rem;background:var(--bg-secondary);border-top:1px solid var(--border-color);flex-shrink:0}.send-options{display:flex;align-items:center;gap:1rem;margin-bottom:.75rem;flex-wrap:wrap}.option-toggle{display:flex;align-items:center;gap:.375rem;font-size:.8rem;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;padding:.375rem .625rem;border-radius:var(--radius-sm);transition:all .2s ease}.option-toggle:hover{background:var(--bg-hover)}.option-toggle input{width:14px;height:14px;accent-color:var(--accent-primary);cursor:pointer}.option-toggle input:checked+svg{color:var(--accent-primary)}.options-divider{width:1px;height:20px;background:var(--border-color);margin:0 .25rem}.timer-config{display:flex;align-items:center;gap:.375rem}.timer-input{width:70px;padding:.375rem .5rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.8rem;text-align:center;transition:all .2s ease}.timer-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #00dcb426}.timer-input:disabled{opacity:.6;cursor:not-allowed}.timer-unit{font-size:.75rem;color:var(--text-muted)}.timer-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);transition:all .2s ease}.timer-btn.start{background:var(--accent-primary);color:#fff}.timer-btn.start:hover:not(:disabled){box-shadow:0 0 12px var(--accent-primary)}.timer-btn.stop{background:var(--accent-danger);color:#fff;animation:pulse 1s infinite}.timer-btn.stop:hover:not(:disabled){box-shadow:0 0 12px var(--accent-danger)}.timer-btn:disabled{opacity:.4;cursor:not-allowed}.send-count{font-size:.75rem;color:var(--accent-primary);background:#00dcb41a;padding:.25rem .5rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease;font-family:var(--font-mono)}.send-count:hover{background:#00dcb433}.send-input-container{display:flex;gap:.75rem;align-items:stretch}.send-input{flex:1;padding:.75rem 1rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.9rem;resize:none;transition:all .2s ease;line-height:1.5}.send-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #00dcb426}.send-input:disabled{opacity:.5;cursor:not-allowed}.send-button{display:flex;align-items:center;justify-content:center;width:56px;background:var(--gradient-accent);border-radius:var(--radius-md);color:#fff;transition:all .3s ease;box-shadow:0 4px 15px #00b89459}.send-button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 6px 25px #00b89480}.send-button:active:not(:disabled){transform:scale(.98)}.send-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.spinner.small{width:18px;height:18px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.send-hint{margin-top:.5rem;font-size:.75rem;color:var(--text-muted);text-align:center}@media(max-width:768px){.send-panel{padding:.75rem}.send-options{gap:.5rem}.send-input{padding:.625rem .875rem;font-size:.85rem}.send-button{width:48px}.timer-config{width:100%;margin-top:.25rem}.options-divider{display:none}}@media(max-width:480px){.timer-input{width:60px}.send-count{font-size:.7rem;padding:.2rem .4rem}}.app{height:100vh;max-height:100vh;display:flex;flex-direction:column;background:var(--bg-primary);position:relative;overflow:hidden}.app:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:var(--gradient-glow);pointer-events:none;z-index:0}.main-content{flex:1;display:grid;grid-template-columns:320px 1fr;gap:1.25rem;padding:1.25rem;max-width:1920px;margin:0 auto;width:100%;position:relative;z-index:1;min-height:0;overflow:hidden}.sidebar{display:flex;flex-direction:column;gap:1.25rem;min-width:0;min-height:0;overflow-y:auto}.mobile-sidebar-overlay{display:none}.content-area{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-md);overflow:hidden}.tab-header{display:flex;gap:.25rem;padding:.75rem 1rem 0;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);flex-shrink:0}.tab-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-secondary);font-weight:500;transition:all .2s ease;position:relative;background:transparent}.tab-btn:hover{color:var(--text-primary);background:var(--bg-hover)}.tab-btn.active{color:var(--accent-primary);background:var(--bg-card);border:1px solid var(--border-color);border-bottom-color:var(--bg-card);margin-bottom:-1px}.tab-icon{font-size:1.1em}.tab-content{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.unsupported-message{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem;gap:1rem}.unsupported-icon{font-size:4rem;margin-bottom:1rem}.unsupported-message h2{color:var(--accent-danger);font-size:1.75rem}.unsupported-message p{color:var(--text-secondary);font-size:1.1rem}.card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);overflow:hidden}.card-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;background:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.card-title{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem;color:var(--text-primary)}.card-title svg{color:var(--accent-primary)}.card-body{padding:1.25rem}@media(max-width:1024px){.main-content{grid-template-columns:280px 1fr;gap:1rem;padding:1rem}}@media(max-width:1027px){.main-content{display:flex;flex-direction:column;padding:.75rem;gap:.75rem;overflow:hidden;height:calc(100vh - var(--header-height));position:relative}.mobile-sidebar-overlay{display:block;position:fixed;top:var(--header-height);left:0;right:0;bottom:0;background:#00000080;z-index:200;animation:fadeIn .2s ease;cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sidebar{position:fixed;top:var(--header-height);right:-100%;width:85%;max-width:360px;height:calc(100vh - var(--header-height));height:calc(100dvh - var(--header-height));background:var(--bg-primary);z-index:300;padding:.75rem;overflow-y:auto;transition:right .3s ease;box-shadow:-5px 0 30px #0003;display:flex;flex-direction:column;gap:.75rem}.sidebar.mobile-open{right:0}.sidebar>.card{flex-shrink:0}.content-area{flex:1;min-height:0;max-height:none}.tab-header{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;padding:.5rem .75rem 0;scrollbar-width:none;-ms-overflow-style:none}.tab-header::-webkit-scrollbar{display:none}.tab-btn{white-space:nowrap;flex-shrink:0}}@media(max-width:480px){.main-content{padding:.5rem;gap:.5rem}.tab-btn{padding:.5rem .75rem;font-size:.85rem}.tab-icon{font-size:1em}.sidebar{width:100%;max-width:none;padding:.75rem}}:root{--bg-primary: #f8fafb;--bg-secondary: #eef3f6;--bg-tertiary: #e4ecf0;--bg-card: #ffffff;--bg-hover: rgba(0, 220, 180, .08);--text-primary: #0a1628;--text-secondary: #4a5e75;--text-muted: #7a8fa8;--text-accent: #00b894;--border-color: #d0dce5;--border-focus: #00b894;--accent-primary: #00b894;--accent-secondary: #6c5ce7;--accent-tertiary: #fd79a8;--accent-warning: #fdcb6e;--accent-danger: #e74c3c;--accent-success: #00cec9;--gradient-primary: linear-gradient(135deg, #00b894 0%, #00cec9 50%, #6c5ce7 100%);--gradient-accent: linear-gradient(90deg, #00b894, #6c5ce7);--gradient-glow: radial-gradient(ellipse at center, rgba(0, 184, 148, .15) 0%, transparent 70%);--shadow-sm: 0 2px 8px rgba(10, 22, 40, .06);--shadow-md: 0 4px 20px rgba(10, 22, 40, .1);--shadow-lg: 0 8px 40px rgba(10, 22, 40, .15);--shadow-glow: 0 0 30px rgba(0, 184, 148, .2);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--font-sans: "Noto Sans SC", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--header-height: 60px;--chart-line-1: #00b894;--chart-line-2: #6c5ce7;--chart-line-3: #fd79a8;--chart-line-4: #fdcb6e;--chart-grid: rgba(0, 0, 0, .06)}[data-theme=dark]{--bg-primary: #0a0f14;--bg-secondary: #111820;--bg-tertiary: #1a232e;--bg-card: #151c26;--bg-hover: rgba(0, 220, 180, .1);--text-primary: #e8f0f8;--text-secondary: #94a8be;--text-muted: #5a6e82;--text-accent: #00dcb4;--border-color: #2a3544;--border-focus: #00dcb4;--accent-primary: #00dcb4;--accent-secondary: #a29bfe;--accent-tertiary: #ff85a2;--accent-warning: #ffeaa7;--accent-danger: #ff6b6b;--accent-success: #00fff5;--gradient-primary: linear-gradient(135deg, #00dcb4 0%, #00fff5 50%, #a29bfe 100%);--gradient-accent: linear-gradient(90deg, #00dcb4, #a29bfe);--gradient-glow: radial-gradient(ellipse at center, rgba(0, 220, 180, .2) 0%, transparent 70%);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 20px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);--shadow-glow: 0 0 40px rgba(0, 220, 180, .3);--chart-line-1: #00dcb4;--chart-line-2: #a29bfe;--chart-line-3: #ff85a2;--chart-line-4: #ffeaa7;--chart-grid: rgba(255, 255, 255, .06)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;height:100%;overflow:hidden}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;height:100%;transition:background .3s ease,color .3s ease;overflow:hidden}#root{height:100%;display:flex;flex-direction:column;overflow:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px;transition:background .2s}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}::selection{background:var(--accent-primary);color:var(--bg-primary)}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit}input,textarea,select{font-family:inherit;font-size:inherit;border:none;background:none;color:inherit}input::placeholder,textarea::placeholder{color:var(--text-muted)}code,.mono{font-family:var(--font-mono)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes glow{0%,to{box-shadow:0 0 5px var(--accent-primary),0 0 10px var(--accent-primary)}50%{box-shadow:0 0 20px var(--accent-primary),0 0 30px var(--accent-primary)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fadeIn{animation:fadeIn .3s ease-out}.animate-slideUp{animation:slideUp .4s ease-out}.animate-slideDown{animation:slideDown .4s ease-out}.animate-pulse{animation:pulse 2s infinite}.animate-glow{animation:glow 2s infinite}@media(max-width:768px){html{font-size:14px}}@media(max-width:480px){html{font-size:13px}}