:root{--bg-app:#1e1e1e;--bg-panel:#2a2a2a;--bg-display:#0d0d0d;--bg-control:#333;--bg-hover:#3d3d3d;--border:#484848;--text-primary:#d4d4d4;--text-secondary:#909090;--text-label:#b0b0b0;--accent-blue:#4a9eff;--accent-orange:#f0a030;--ch1-color:#f0a030;--trigger-color:#dd4;--ch2-color:#9b59b6;--grid-color:#2a2a2a;--noise-color:#f44;--theory-color:#4d8}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-app);color:var(--text-primary);height:100vh;font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:13px;overflow:hidden}#root{flex-direction:column;height:100vh;display:flex}select,input[type=text],input[type=number]{background:var(--bg-control);color:var(--text-primary);border:1px solid var(--border);border-radius:3px;width:100%;padding:3px 6px;font-size:12px}select:focus,input:focus{outline:1px solid var(--accent-blue);outline-offset:-1px}button{background:var(--bg-control);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;border-radius:3px;padding:4px 12px;font-size:12px;transition:background .1s}button:hover{background:var(--bg-hover)}button.active{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}button.run-btn{color:#afa;background:#2d6a2d;border-color:#3a8a3a}button.run-btn.active{background:#1a8a1a;border-color:#2a2}button.stop-btn{color:#faa;background:#6a2d2d;border-color:#8a3a3a}input[type=range]{width:100%;accent-color:var(--accent-blue)}label{color:var(--text-label);margin-bottom:2px;font-size:11px;display:block}.control-row{flex-direction:column;gap:2px;margin-bottom:8px;display:flex}.control-row-inline{align-items:center;gap:8px;margin-bottom:6px;display:flex}.control-row-inline label{flex-shrink:0;min-width:80px;margin:0}.section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);border-bottom:1px solid var(--border);margin-top:12px;margin-bottom:8px;padding-bottom:4px;font-size:10px}.section-title:first-child{margin-top:0}.value-badge{color:var(--accent-orange);text-align:right;min-width:52px;font-family:Courier New,monospace;font-size:11px}:root{--node-color:#6cf;--wire-color:#8a8;--ch2-color:#40c0e0}.instrument-panel{flex:1;min-width:0;height:100vh;display:flex;overflow:hidden}.stacked-pane{flex:1;min-height:0;display:flex;overflow:hidden}.stacked-pane .instrument-panel{height:100%}.board-layout-bar{background:var(--bg-panel);border-bottom:1px solid var(--border);flex:none;align-items:center;gap:8px;padding:4px 8px;display:flex}.board-layout-label{color:var(--text-secondary);margin-right:4px;font-size:11px}.board-orient-btn{background:var(--bg-display);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;border-radius:3px;padding:2px 8px;font-size:11px}.board-orient-btn:hover{border-color:var(--accent-blue);color:var(--accent-blue)}.board-splitter{background:var(--border);touch-action:none;flex:0 0 6px;transition:background .12s}.board-splitter:hover{background:var(--accent-blue)}.board-splitter.horizontal{cursor:row-resize}.board-splitter.vertical{cursor:col-resize}.display-area{background:var(--bg-display);border-right:1px solid var(--border);flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.display-header{background:var(--bg-panel);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:6px 12px;display:flex}.display-title{color:var(--text-primary);letter-spacing:.03em;font-size:12px;font-weight:600}.display-controls{align-items:center;gap:8px;display:flex}.plotly-display{flex:1;min-height:0}.display-overlay{color:var(--text-secondary);pointer-events:none;letter-spacing:.05em;background:#0d0d0dbf;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;inset:40px 0 0}.settings-panel{background:var(--bg-panel);border-left:1px solid var(--border);flex-direction:column;flex-shrink:0;width:220px;padding:12px;display:flex;overflow-y:auto}.wave-selector{flex-wrap:wrap;gap:4px;display:flex}.wave-selector button{text-align:center;flex:1 0 calc(50% - 4px);min-width:0;padding:5px 4px;font-size:11px}.wave-selector button.active{background:var(--accent-orange);border-color:var(--accent-orange);color:#111}.bit-depth-selector{gap:4px;display:flex}.bit-depth-selector button{text-align:center;flex:1;padding:4px;font-size:11px}.bit-depth-selector button.active{color:#111;background:#f84;border-color:#f84}.run-btn{font-weight:600;transition:background .1s;color:#8d8!important;background:#204020!important;border-color:#363!important;padding:4px 14px!important;font-size:11px!important}.run-btn:hover{background:#2a5a2a!important}.run-btn.active{color:#afa!important;background:#186618!important;border-color:#2a2!important}.marker-table{border:1px solid var(--border);pointer-events:none;background:#141414d9;border-radius:3px;padding:4px 8px;font-family:Courier New,monospace;font-size:11px;position:absolute;bottom:10px;left:10px}.marker-row{align-items:center;gap:12px;display:flex}.marker-id{color:var(--accent-blue);min-width:18px;font-weight:700}.marker-freq{color:var(--ch1-color);min-width:80px}.marker-amp{color:var(--text-primary);min-width:70px}.marker-type{color:var(--text-secondary);font-size:10px}.learning-title{color:#4d8!important;border-bottom-color:#2a5a3a!important}.app-shell{background:var(--bg-app);height:100vh;display:flex}.nav-panel{border-right:1px solid var(--border);box-sizing:border-box;background:#141414;flex-direction:column;flex-shrink:0;align-items:center;gap:4px;width:72px;min-height:0;padding:8px 0;display:flex;overflow-y:auto}.nav-logo{color:var(--accent-blue);letter-spacing:.1em;border-bottom:1px solid var(--border);text-align:center;width:100%;padding:6px 0 12px;font-size:11px;font-weight:700}.nav-btn{cursor:pointer;width:58px;min-height:52px;color:var(--text-secondary);background:0 0;border:1px solid #0000;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:6px 4px;transition:all .1s;display:flex}.nav-btn:hover{background:var(--bg-panel);color:var(--text-primary)}.nav-btn.nav-active{background:var(--bg-panel);border-color:var(--accent-blue);color:var(--accent-blue)}.nav-btn.nav-hint{color:#ffbf00;background:#ffbf001f;border-color:#ffbf00;animation:1.8s ease-in-out infinite nav-hint-pulse}@keyframes nav-hint-pulse{0%,to{box-shadow:0 0 #ffbf0000}50%{box-shadow:0 0 10px 1px #ffbf0073}}@media (prefers-reduced-motion:reduce){.nav-btn.nav-hint{animation:none}}.nav-icon{font-size:18px;line-height:1}.nav-label{text-align:center;text-transform:uppercase;letter-spacing:.04em;font-size:9px;line-height:1.3}.instrument-area{flex:1;min-width:0;display:flex}.instrument-area.split>*{flex:1;min-width:0}.instrument-area.split>*+*{border-left:2px solid #222}.instrument-area.arrange-row>*,.instrument-area.arrange-single>*{flex:1;min-width:0}.instrument-area.arrange-row>*+*{border-left:2px solid #222}.instrument-area.arrange-grid{grid-template-columns:1fr 1fr;grid-auto-rows:minmax(0,1fr);display:grid}.instrument-area.arrange-grid>*{border:1px solid #222;min-width:0;min-height:0}.nav-sep{text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary,#888);text-align:center;opacity:.7;margin:8px 0 2px;font-size:9px}.nav-layouts{background:var(--bg-panel,#2a2a2a);width:100%;color:var(--text-primary,#eee);cursor:pointer;border:1px solid #333;border-radius:4px;margin:2px 0 4px;padding:4px 6px;font-size:11px}.nav-layouts.nav-active{border-color:var(--accent-blue,#4a9eff);color:var(--accent-blue,#4a9eff)}.license-badge{z-index:50;color:var(--text-secondary);opacity:.45;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:10px;position:fixed;bottom:6px;right:12px}.license-badge a{color:inherit;pointer-events:auto;text-decoration:none}.license-badge:hover{opacity:.95}.license-badge a:hover{text-decoration:underline}
