:root{--bg-panel:#0a0f1ad9;--bg-panel-border:#ffffff1a;--text-primary:#fff;--text-secondary:#8b9bb4;--accent-blue:#3b82f6;--accent-blue-hover:#2563eb;--bg-input:#1e293b;--bg-button:#1e293b;--bg-button-hover:#334155;--radius:8px;--font-family:"Inter", system-ui, sans-serif}html,body{font-family:var(--font-family);color:var(--text-primary);background:#000;margin:0;padding:0;font-size:14px;overflow:hidden}#app{width:100vw;height:100vh;display:block}#ui-layer{pointer-events:none;flex-direction:column;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.panel{background:var(--bg-panel);-webkit-backdrop-filter:blur(12px);border:1px solid var(--bg-panel-border);border-radius:var(--radius);pointer-events:auto;box-shadow:0 8px 32px #00000080}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600}p{color:var(--text-secondary);margin:4px 0}#top-bar{border-radius:12px;justify-content:space-between;align-items:center;margin:16px;padding:12px 24px;display:flex}.logo{flex-direction:column;display:flex}.logo .tsunami{letter-spacing:1px;font-size:20px;font-weight:700}.logo .lab{color:var(--accent-blue);letter-spacing:1px;font-size:20px;font-weight:700}.logo .subtitle{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-top:2px;font-size:10px}.playback-controls{gap:8px;display:flex}.slider-group{flex-direction:column;min-width:180px;display:flex}.slider-group label{color:var(--text-secondary);justify-content:space-between;margin-bottom:4px;font-size:11px;display:flex}.slider-group label span{color:var(--text-primary);font-weight:600}#left-sidebar{flex-direction:column;gap:16px;width:280px;display:flex;position:absolute;top:90px;left:16px}#right-sidebar{flex-direction:column;gap:16px;width:280px;display:flex;position:absolute;top:90px;right:16px}.section{padding:16px}.section-header{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:12px;font-weight:600;display:flex}.control-row{margin-bottom:16px}.control-row:last-child{margin-bottom:0}.control-row>label{color:var(--text-secondary);margin-bottom:8px;font-size:11px;display:block}.slider-header{color:var(--text-secondary);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:11px;display:flex}.slider-header span{color:var(--text-primary);font-weight:600}button{background:var(--bg-button);color:var(--text-primary);border:1px solid var(--bg-panel-border);font-family:var(--font-family);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .2s;display:flex}button:hover{background:var(--bg-button-hover)}button.active{background:var(--accent-blue);border-color:var(--accent-blue)}button.active:hover{background:var(--accent-blue-hover)}.button-group{gap:8px;display:flex}.button-group button{flex:1}input[type=range]{-webkit-appearance:none;background:var(--bg-input);border-radius:2px;outline:none;width:100%;height:4px;margin:8px 0}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent-blue);cursor:pointer;border:2px solid #fff;border-radius:50%;width:14px;height:14px;transition:transform .1s;box-shadow:0 0 4px #00000080}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-with-labels{align-items:center;gap:8px;display:flex}.slider-labels{color:var(--text-secondary);justify-content:space-between;font-size:10px;display:flex}.label-min,.label-max{color:var(--text-secondary);font-size:10px}.legend-panel{padding:16px}.legend-header{color:var(--text-secondary);text-transform:uppercase;margin-bottom:12px;font-size:11px;font-weight:600}.legend-gradient-container{align-items:stretch;gap:12px;height:200px;display:flex}.legend-gradient{background:linear-gradient(red 0%,#ff6a00 12.5%,#ff0 25%,#0f0 37.5%,#0ff 50%,#0080ff 62.5%,#00f 75%,#8000ff 87.5%,indigo 100%);border-radius:6px;width:12px;box-shadow:inset 0 0 4px #00000080}.legend-labels-y{color:var(--text-primary);flex-direction:column;justify-content:space-between;font-size:11px;display:flex}#eq-callout{pointer-events:none;z-index:10;flex-direction:column;align-items:center;transition:opacity .3s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-100%)}#eq-callout.hidden{opacity:0}.callout-panel{background:#0a0f1ae6;border:1px solid #fff3;border-radius:6px;min-width:140px;padding:12px;box-shadow:0 4px 16px #00000080}.callout-header{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:10px}.callout-row{justify-content:space-between;margin-bottom:4px;font-size:12px;display:flex}.callout-row span:first-child{color:var(--text-secondary)}.callout-line{background:#ffffff80;width:1px;height:40px}.callout-target{background:#fff;border-radius:50%;width:10px;height:10px;position:relative;box-shadow:0 0 8px #fff}.pulse-ring{border:1px solid #fff;border-radius:50%;width:100%;height:100%;animation:2s cubic-bezier(.215,.61,.355,1) infinite pulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.delay-1{animation-delay:.6s}.delay-2{animation-delay:1.2s}@keyframes pulse{0%{opacity:1;width:10px;height:10px}to{opacity:0;width:60px;height:60px}}#bottom-bar{gap:16px;display:flex;position:absolute;bottom:16px;left:16px}.instructions{max-width:300px;padding:12px 16px;font-size:11px}.instructions .header{color:var(--accent-blue);text-transform:uppercase;align-items:center;gap:6px;margin-bottom:6px;font-weight:600;display:flex}#status{background:#00000080;border-radius:4px;padding:4px 8px;font-size:12px;position:absolute;bottom:16px;right:16px}.disabled{opacity:.5;pointer-events:none}.coming-soon-overlay{letter-spacing:1px;text-transform:uppercase;color:#fff;border-radius:inherit;z-index:2;background:#0000004d;justify-content:center;align-items:center;font-weight:600;display:flex;position:absolute;inset:0}