/**
 * @license
 * SPDX-License-Identifier: Apache-2.0
*/:root{--background-color: #121212;--panel-color: #242424;--knob-color: #3d3d3d;--knob-border-color: #555;--text-color: #e0e0e0;--accent-color: #ff8a00;--button-hover-color: #4f4f4f}html,body{margin:0;padding:0;height:100%;width:100%;background-color:var(--background-color);font-family:Inter,sans-serif;overflow:hidden;-webkit-user-select:none;user-select:none}#fluid-container{position:relative;height:100%;width:100%;background:var(--background-color);overflow:hidden}.ascii-art{font-family:Courier New,monospace;font-size:.5rem;line-height:.8;color:var(--knob-border-color);white-space:pre;text-align:center;opacity:.8;letter-spacing:.1px;margin:0;padding:0;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;display:flex;align-items:center;justify-content:center}#control-panel{position:absolute;bottom:20px;left:50%;transform:translate(-50%);z-index:10;background-color:var(--panel-color);border:1px solid var(--knob-border-color);border-radius:8px;padding:10px 20px;display:flex;align-items:center;gap:20px;box-shadow:0 4px 15px #0006;cursor:grab;opacity:.4;transition:opacity .3s ease}#control-panel:hover,#control-panel.active{opacity:1}.knob-section{display:flex;gap:30px}.knob-container{display:flex;flex-direction:column;align-items:center;gap:8px}.knob{width:40px;height:40px;border-radius:50%;background-color:var(--knob-color);border:2px solid var(--knob-border-color);position:relative;cursor:ns-resize;box-shadow:inset 0 2px 4px #00000080}.knob .indicator{width:2px;height:10px;background-color:var(--accent-color);position:absolute;bottom:50%;left:50%;transform-origin:bottom center;transform:translate(-50%);border-radius:2px}.knob-container label{color:var(--text-color);font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase}.divider{width:1px;height:50px;background-color:var(--knob-border-color)}.preset-section{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;width:150px}.preset-button{background-color:var(--knob-color);border:1px solid var(--knob-border-color);color:var(--text-color);padding:6px 12px;border-radius:4px;font-family:Inter,sans-serif;font-size:.7rem;letter-spacing:.05em;cursor:pointer;transition:background-color .2s;text-transform:uppercase}#preset-spectrum{grid-column:1 / -1}.preset-button:hover{background-color:var(--button-hover-color)}.preset-button.active{background-color:var(--accent-color);color:var(--background-color);font-weight:700}.audio-section{display:flex;flex-direction:column;gap:8px}.audio-button{background-color:var(--knob-color);border:1px solid var(--knob-border-color);color:var(--text-color);padding:6px 12px;border-radius:4px;font-family:Inter,sans-serif;font-size:.7rem;letter-spacing:.05em;cursor:pointer;transition:background-color .2s;text-transform:uppercase;text-align:center}.audio-button:hover{background-color:var(--button-hover-color)}#audio-playback-controls{display:flex;flex-direction:column;gap:6px;width:130px;margin-bottom:8px}#audio-playback-controls.hidden{display:none}#time-display{color:var(--text-color);font-size:.7rem;font-family:Courier New,monospace;text-align:center}#seek-bar{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;background:var(--knob-color);outline:none;border-radius:2px;cursor:pointer}#seek-bar::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent-color);cursor:pointer}#seek-bar::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--accent-color);cursor:pointer;border:none}