*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0a0a0f;--surface: rgba(15, 15, 25, .85);--border: rgba(0, 212, 255, .15);--text: #c8d8e8;--text-dim: #6b7a8d;--cyan: #00d4ff;--purple: #8b5cf6;--amber: #f59e0b;--font: system-ui, -apple-system, sans-serif}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:var(--font)}.app-root{display:flex;flex-direction:column;height:100vh;overflow:hidden}.app-header{padding:.6rem 1.2rem;border-bottom:1px solid var(--border);background:var(--surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-shrink:0}.app-title{font-size:1.4rem;font-weight:700;letter-spacing:.15em;color:var(--cyan);text-shadow:0 0 12px rgba(0,212,255,.5)}.app-subtitle{font-size:.75rem;color:var(--text-dim);letter-spacing:.05em}.mode-selector{display:flex;gap:.5rem;padding:.5rem 1.2rem;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.mode-btn{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:.35rem .9rem;border-radius:4px;cursor:pointer;font-size:.82rem;letter-spacing:.04em;transition:all .2s}.mode-btn:hover{border-color:var(--accent, var(--cyan));color:var(--accent, var(--cyan));box-shadow:0 0 8px #00d4ff33}.mode-btn.active{border-color:var(--accent, var(--cyan));color:var(--accent, var(--cyan));background:#00d4ff14;box-shadow:0 0 12px #00d4ff4d}.scene-wrapper{flex:1;position:relative;overflow:hidden}.scene-wrapper canvas{display:block;width:100%!important;height:100%!important}.control-panel{background:var(--surface);border-top:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-shrink:0;overflow-y:auto;max-height:230px;display:flex;flex-direction:row;flex-wrap:wrap;gap:.6rem 1.8rem;padding:.6rem 1.5rem;justify-content:center;align-items:flex-start}.control-panel h4{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.5rem}.slider-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem}.slider-row label{font-size:.78rem;color:var(--text);width:130px;flex-shrink:0}.slider-row input[type=range]{flex:1;min-width:0;max-width:max(110px,20vw);accent-color:var(--cyan);cursor:pointer}.slider-row select{flex:1;background:#1a1a2e;color:var(--text);border:1px solid var(--border);border-radius:3px;padding:.2rem .4rem;font-size:.78rem}.slider-row span{font-size:.72rem;color:var(--cyan);width:40px;text-align:right;font-variant-numeric:tabular-nums}.info-overlay{position:absolute;top:1rem;right:1rem;max-width:280px;background:var(--surface);border:1px solid var(--border);border-radius:6px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overflow:hidden;transition:all .2s}.info-overlay.open{padding:.8rem}.info-toggle{position:absolute;top:.5rem;right:.5rem;background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-size:.9rem;line-height:1;padding:.2rem}.info-overlay.closed{padding:.5rem;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.info-overlay.closed .info-toggle{position:static;color:var(--cyan)}.info-content h3{font-size:.85rem;color:var(--cyan);margin-bottom:.4rem;padding-right:1.5rem;text-shadow:0 0 8px rgba(0,212,255,.4)}.info-aha{font-size:.72rem;color:var(--amber);line-height:1.55;margin-bottom:.7rem;padding-bottom:.5rem;border-bottom:1px solid rgba(245,158,11,.2);font-style:italic}.info-basis{font-size:.72rem;color:var(--cyan);font-style:italic;margin-bottom:.45rem;opacity:.8}.info-components{margin-top:.6rem;padding:.4rem .55rem;background:#00d4ff0d;border-left:2px solid rgba(0,212,255,.25);border-radius:0 3px 3px 0}.info-components-label{font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);display:block;margin-bottom:.3rem}.info-components ul{list-style:none;padding:0;margin:0}.info-components li{font-size:.72rem;color:var(--text);padding:.08rem 0;opacity:.85;display:flex;align-items:baseline;gap:0}.info-components li:before{content:"·  ";color:var(--cyan);opacity:.6;flex-shrink:0}.info-expand-btn{display:block;margin-top:.55rem;background:transparent;border:none;color:var(--text-dim);font-size:.7rem;cursor:pointer;padding:0;letter-spacing:.04em;transition:color .15s}.info-expand-btn:hover{color:var(--cyan)}.info-transform{margin-top:.45rem;font-size:.72rem;color:var(--text);line-height:1.55;padding:.4rem .5rem;background:#8b5cf612;border-left:2px solid rgba(139,92,246,.35);border-radius:0 3px 3px 0;font-style:italic}.info-content p{font-size:.75rem;color:var(--text);line-height:1.5}.status-strip{position:absolute;bottom:.6rem;left:50%;transform:translate(-50%);display:flex;gap:1.2rem;padding:.3rem 1rem;background:#0a0a14bf;border:1px solid var(--border);border-radius:4px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;white-space:nowrap}.status-item{display:flex;flex-direction:column;align-items:center;gap:.1rem}.status-label{font-size:.6rem;color:var(--text-dim);letter-spacing:.06em;text-transform:uppercase}.status-value{font-size:.72rem;color:var(--cyan);font-variant-numeric:tabular-nums}.status-mode{color:var(--amber);font-weight:600;letter-spacing:.08em}.toggle-btn{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:.25rem .7rem;border-radius:4px;cursor:pointer;font-size:.78rem;transition:all .2s;flex:1}.toggle-btn:hover{border-color:var(--cyan);color:var(--cyan)}.toggle-btn.active{border-color:var(--cyan);color:var(--cyan);background:#00d4ff1a;box-shadow:0 0 8px #00d4ff40}.app-header-left{display:flex;flex-direction:column}.preset-bar{display:flex;align-items:center;gap:.8rem;padding:.4rem 1.2rem;background:#0a0a14eb;border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap}.preset-bar-label{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);flex-shrink:0;margin-right:.2rem}.preset-group{display:flex;align-items:center;gap:.4rem}.preset-group-label{font-size:.62rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-right:.1rem}.preset-divider{width:1px;height:1.2rem;background:var(--border);flex-shrink:0}.preset-btn{background:transparent;border:1px solid rgba(0,212,255,.2);color:var(--text-dim);padding:.22rem .65rem;border-radius:3px;cursor:pointer;font-size:.75rem;letter-spacing:.03em;transition:all .18s}.preset-btn:hover{border-color:var(--cyan);color:var(--cyan);background:#00d4ff12}.sweep-btn{background:transparent;border:1px solid rgba(245,158,11,.25);color:var(--text-dim);padding:.22rem .7rem;border-radius:3px;cursor:pointer;font-size:.75rem;letter-spacing:.03em;transition:all .18s}.sweep-btn:hover{border-color:var(--amber);color:var(--amber);background:#f59e0b12}.sweep-btn.active{border-color:var(--amber);color:var(--amber);background:#f59e0b1f;box-shadow:0 0 8px #f59e0b40}.control-section{width:280px;flex-shrink:0;margin-bottom:.5rem;padding-bottom:.4rem;border-bottom:1px solid rgba(0,212,255,.07)}.control-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.slider-row.disabled{opacity:.35;pointer-events:none}.status-sweep{color:var(--amber);font-size:.65rem;letter-spacing:.06em}.spectrum-panel{position:absolute;bottom:3.2rem;left:1rem;width:260px;background:#0a0a16e0;border:1px solid rgba(0,212,255,.15);border-radius:6px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:.55rem .7rem .5rem;pointer-events:none;-webkit-user-select:none;user-select:none}.pipeline-header{display:flex;align-items:center;gap:0;margin-bottom:.45rem;flex-wrap:nowrap}.pipeline-stage-group{display:flex;align-items:center;gap:0;flex:1;min-width:0}.pipeline-stage{font-size:.55rem;letter-spacing:.03em;color:var(--text-dim);white-space:nowrap;padding:.1rem .22rem;border-radius:3px;transition:color .3s,background .3s;overflow:hidden;text-overflow:ellipsis}.pipeline-stage.active{color:var(--cyan);background:#00d4ff1a;border:1px solid rgba(0,212,255,.2);flex-shrink:0}.pipeline-arrow{font-size:.52rem;color:var(--text-dim);opacity:.4;padding:0 .08rem;flex-shrink:0}.spectrum-header{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.5rem}.spectrum-title{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim)}.spectrum-mode-label{font-size:.66rem;color:var(--cyan);opacity:.75;letter-spacing:.03em}.spectrum-bars{display:flex;align-items:flex-end;gap:.5rem;height:72px}.spectrum-bar-group{display:flex;flex-direction:column;align-items:center;gap:.2rem;flex:1}.spectrum-bar-track{flex:1;width:100%;background:#ffffff0a;border-radius:2px;display:flex;align-items:flex-end;min-height:48px;overflow:hidden}.spectrum-bar-fill{width:100%;border-radius:2px 2px 0 0;transition:height .05s linear;min-height:2px}.spectrum-bar-label{font-size:.58rem;letter-spacing:.03em;text-align:center;line-height:1.2;margin-top:.15rem}.spectrum-bar-value{font-size:.58rem;color:var(--text-dim);font-variant-numeric:tabular-nums}.spectrum-note{margin-top:.45rem;font-size:.62rem;color:var(--text-dim);font-style:italic;letter-spacing:.02em;text-align:center;border-top:1px solid rgba(255,255,255,.06);padding-top:.35rem}.pipeline-fill{margin-left:auto;font-size:.5rem;color:var(--text-dim);opacity:.55;white-space:nowrap}.spectrum-collecting{width:100%;height:4px;background:#ffffff0d;border-radius:2px;overflow:hidden;margin:auto 0}.spectrum-collecting-bar{height:100%;background:var(--cyan);border-radius:2px;opacity:.45;transition:width .2s linear}.spectrum-buffer-track{margin-top:.25rem;height:2px;background:#ffffff0a;border-radius:1px;overflow:hidden}.spectrum-buffer-fill{height:100%;background:var(--cyan);opacity:.25;transition:width .3s linear}.info-comp-label{font-weight:600;margin-right:.35rem;color:var(--cyan);opacity:.85}.info-comp-note{color:var(--text-dim);font-size:.68rem}@keyframes spectrumPulse{0%{box-shadow:0 0 6px #00d4ff73}to{box-shadow:none}}.spectrum-flash{border-radius:2px;animation:spectrumPulse .09s ease-out forwards}.info-pipeline{margin-top:.6rem;padding:.4rem .55rem;background:#00d4ff0a;border-left:2px solid rgba(0,212,255,.3);border-radius:0 3px 3px 0}.info-pipeline-label{display:block;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.25rem}.info-pipeline-flow{font-size:.74rem;color:var(--cyan);font-weight:600;letter-spacing:.04em;margin-bottom:.3rem}.info-pipeline-note{font-size:.7rem;color:var(--text);line-height:1.5;font-style:italic;opacity:.85}.info-pipeline-coupling{margin-top:.4rem;font-size:.68rem;color:var(--text-dim);line-height:1.5;opacity:.8}.reception-meter{position:absolute;bottom:3.8rem;right:.9rem;display:flex;flex-direction:column;align-items:flex-end;gap:.28rem;pointer-events:none;-webkit-user-select:none;user-select:none}.reception-meter-label{font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);opacity:.75}.reception-meter-bar-track{width:88px;height:5px;background:#ffffff0f;border-radius:3px;overflow:hidden}.reception-meter-bar-fill{height:100%;border-radius:3px;transition:width .08s linear,background-color .15s ease}.reception-meter-readout{display:flex;align-items:baseline;gap:.35rem}.reception-meter-value{font-size:.76rem;font-weight:700;transition:color .15s ease;font-variant-numeric:tabular-nums}.reception-meter-qual{font-size:.62rem;font-weight:500;opacity:.8;transition:color .15s ease}.reception-meter-mode{font-size:.56rem;letter-spacing:.08em;color:var(--text-dim);opacity:.6}