:root{--bg-primary: #0f0f0f;--bg-secondary: #1a1a1a;--bg-tertiary: #252525;--bg-hover: #2a2a2a;--border-color: #333;--text-primary: #e5e5e5;--text-secondary: #999;--text-muted: #666;--accent-synth: #4ade80;--accent-sequencer: #60a5fa;--accent-effects: #a78bfa;--accent-controller: #fbbf24;--accent-interface: #f472b6;--accent-computer: #94a3b8;--accent-clock: #22d3d1;--accent-primary: #3b82f6;--accent-danger: #ef4444;--audio-code-bg: #1e293b}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.5;min-height:100vh}#root{min-height:100vh}button{cursor:pointer;border:none;background:var(--bg-tertiary);color:var(--text-primary);padding:8px 16px;border-radius:4px;font-size:14px;transition:background .2s}button:hover{background:var(--bg-hover)}button.primary{background:var(--accent-primary);color:#fff}button.primary:hover{background:#2563eb}button.danger{background:var(--accent-danger);color:#fff}button.danger:hover{background:#dc2626}input,select,textarea{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);padding:8px 12px;border-radius:4px;font-size:14px;width:100%}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-primary)}textarea{resize:vertical;min-height:80px}.mono{font-family:SF Mono,Fira Code,Consolas,monospace}.audio-code{font-family:SF Mono,Fira Code,Consolas,monospace;background:var(--audio-code-bg);padding:4px 8px;border-radius:4px;font-size:13px;display:inline-block}.device-type-badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500;text-transform:uppercase}.device-type-badge.synthesizer{background:var(--accent-synth);color:#000}.device-type-badge.sequencer{background:var(--accent-sequencer);color:#000}.device-type-badge.effects{background:var(--accent-effects);color:#000}.device-type-badge.controller{background:var(--accent-controller);color:#000}.device-type-badge.interface{background:var(--accent-interface);color:#000}.device-type-badge.computer{background:var(--accent-computer);color:#000}.device-type-badge.clock{background:var(--accent-clock);color:#000}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--border-color)}th{font-weight:600;color:var(--text-secondary);font-size:12px;text-transform:uppercase;letter-spacing:.5px}tr:hover{background:var(--bg-hover)}.card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:20px}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;font-size:14px;color:var(--text-secondary)}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.flex{display:flex}.flex-between{display:flex;justify-content:space-between;align-items:center}.gap-2{gap:8px}.gap-4{gap:16px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}.mt-4{margin-top:16px}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.scrollable{overflow-x:auto}.app{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--bg-secondary);border-right:1px solid var(--border-color);padding:20px;display:flex;flex-direction:column}.sidebar-header{margin-bottom:24px}.sidebar-header h1{font-size:18px;font-weight:600;color:var(--text-primary)}.sidebar-header p{font-size:12px;color:var(--text-muted)}.nav-list{list-style:none;flex:1}.nav-item{margin-bottom:4px}.nav-item button{width:100%;text-align:left;padding:10px 12px;border-radius:6px;background:transparent;color:var(--text-secondary);display:flex;align-items:center;gap:10px;font-size:14px}.nav-item button:hover{background:var(--bg-tertiary);color:var(--text-primary)}.nav-item button.active{background:var(--accent-primary);color:#fff}.sidebar-footer{padding-top:16px;border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:8px}.sidebar-footer button{width:100%;text-align:left;padding:8px 12px;font-size:13px;display:flex;align-items:center;gap:8px}.main-content{flex:1;padding:24px;overflow-y:auto}.page-header{margin-bottom:24px}.page-header h2{font-size:24px;font-weight:600}.page-header p{color:var(--text-secondary);margin-top:4px}.toolbar{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap;align-items:center}.toolbar input[type=text]{width:250px}.toolbar select{width:180px}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;width:90%;max-width:700px;max-height:90vh;overflow-y:auto;padding:24px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h3{font-size:20px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-color)}.channel-matrix{display:grid;grid-template-columns:180px repeat(16,1fr);gap:2px;font-size:12px}.channel-matrix .header{background:var(--bg-tertiary);padding:8px;text-align:center;font-weight:600;color:var(--text-secondary)}.channel-matrix .interface-row{display:contents}.channel-matrix .interface-name{background:var(--bg-secondary);padding:8px;display:flex;align-items:center;border-bottom:1px solid var(--border-color)}.channel-matrix .cell{background:var(--bg-secondary);padding:4px;min-height:40px;border-bottom:1px solid var(--border-color);display:flex;flex-direction:column;gap:2px}.channel-matrix .device-chip{background:var(--bg-tertiary);padding:2px 6px;border-radius:3px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-matrix .device-chip.conflict{background:var(--accent-danger);color:#fff}.routing-tree{display:flex;flex-direction:column;gap:16px}.routing-group{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:16px}.routing-group h4{margin-bottom:12px;color:var(--text-secondary);font-size:14px;text-transform:uppercase;letter-spacing:.5px}.routing-device{padding:8px 12px;background:var(--bg-tertiary);border-radius:6px;margin-bottom:8px;display:flex;align-items:center;gap:12px}.routing-device .arrow{color:var(--text-muted)}.audio-routing-section{margin-bottom:24px}.audio-routing-section h3{margin-bottom:12px;display:flex;align-items:center;gap:8px}.audio-channel-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.audio-channel-item{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:12px}.audio-channel-item .channel-label{font-family:SF Mono,Fira Code,Consolas,monospace;font-size:13px;color:var(--text-secondary);margin-bottom:6px}.audio-channel-item .device-name{font-weight:500}.audio-channel-item.empty{opacity:.5}.equipment-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.equipment-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:16px}.equipment-card h4{margin-bottom:8px}.equipment-card .code{font-family:SF Mono,Fira Code,Consolas,monospace;color:var(--accent-primary);font-size:13px}.custom-settings-list{margin-top:16px}.custom-settings-list .setting-row{display:grid;grid-template-columns:1fr 2fr auto;gap:8px;margin-bottom:8px;align-items:center}.custom-settings-list .setting-row input{font-family:SF Mono,Fira Code,Consolas,monospace;font-size:13px}.audio-routing-builder{background:var(--bg-tertiary);border-radius:8px;padding:16px;margin-top:8px}.audio-routing-builder .stage{margin-bottom:16px}.audio-routing-builder .stage-label{font-size:12px;color:var(--text-secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.audio-routing-builder .stage-row{display:grid;grid-template-columns:1fr 100px;gap:8px}.audio-routing-builder .preview{margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color)}.audio-routing-builder .preview-label{font-size:12px;color:var(--text-secondary);margin-bottom:6px}.audio-routing-builder .preview-code{font-family:SF Mono,Fira Code,Consolas,monospace;font-size:16px;color:var(--accent-primary);background:var(--audio-code-bg);padding:8px 12px;border-radius:4px;display:inline-block}.midi-channels-selector{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.midi-channels-selector button{width:36px;height:32px;padding:0;font-size:12px;border-radius:4px}.midi-channels-selector button.selected{background:var(--accent-primary);color:#fff}.omni-button{width:auto!important;padding:0 12px!important}