html,body{height:100%;margin:0;padding:0;overflow:hidden}body{color:#333;background-color:#f0f0f0;font-family:sans-serif}.container{box-sizing:border-box;flex-direction:column;height:100%;margin:10px;display:flex}.controls{flex-flow:wrap;justify-content:flex-start;align-items:center;gap:10px;margin-bottom:10px;padding-top:35px;display:flex}#toggle-controls-btn{z-index:1001;cursor:pointer;box-sizing:border-box;background-color:#f0f0f0;border:1px solid #ccc;height:28px;padding:5px 10px;font-size:14px;line-height:16px;position:absolute;top:10px;left:80px}#pause-resume-btn{z-index:1001;cursor:pointer;box-sizing:border-box;background-color:#f0f0f0;border:1px solid #ccc;height:28px;padding:5px 10px;font-size:14px;line-height:16px;position:absolute;top:10px;left:10px}.main-spectrogram-area{flex-direction:row;flex-grow:1;width:100%;min-height:0;display:flex;position:relative}#selection-overlay{box-sizing:border-box;pointer-events:none;z-index:200;border:2px dashed #ffffffb3;width:calc(100% - 41px);height:100%;display:none;position:absolute;top:0;left:0}canvas{border:0}#spectrogram{z-index:100;background-color:#000;flex:1;width:calc(100% - 41px)}#cursor-line-canvas{pointer-events:none;z-index:300;width:calc(100% - 41px);height:100%;position:absolute;top:0;left:0}#frequency-labels{background-color:#0000;border-left:1px solid #ccc;flex:0 0 41px}.frequency-controls{align-items:center;gap:5px;display:flex}.frequency-controls>label:first-child{min-width:130px;font-weight:700}.frequency-controls>label[for=sample-rate]{vertical-align:middle;line-height:20px}.color-controls{align-items:center;gap:5px;display:flex}.color-controls>label:first-child{min-width:130px;font-weight:700}.processing-controls{align-items:center;gap:5px;display:flex}.processing-controls>label:first-child{min-width:130px;font-weight:700}.misc-controls{align-items:center;gap:5px;display:flex}.misc-controls>label:first-child{min-width:130px;font-weight:700}.slider-label-right{margin-right:15px}.fps-counter{z-index:1001;color:#fff;font-size:14px;font-weight:700;position:absolute;top:10px;left:10px}#pause-resume-btn{cursor:pointer;width:70px;padding:5px 10px;font-size:14px}input[type=range]{width:100px}select{padding:5px;font-size:14px}label{font-size:14px}.frequency-controls span,.color-controls span{text-align:right;min-width:40px;font-weight:700;display:inline-block}.misc-controls span{text-align:right;min-width:30px;font-weight:700;display:inline-block}.tooltip{color:#fff;pointer-events:none;z-index:1000;background-color:#000000b3;border-radius:3px;padding:5px;font-size:12px;display:none;position:absolute}.resize-handle{cursor:ns-resize;background-color:#666;border-radius:2px;flex-shrink:0;height:5px;margin-top:5px;margin-bottom:5px}.resize-handle:hover{background-color:#888}.waveform-area{background-color:#000;border:1px solid #444;border-radius:4px;flex:0 0 100px;min-height:50px;margin-bottom:15px;position:relative}#waveform-canvas{background-color:#000;border-radius:4px;display:block}.waveform-label{color:#888;pointer-events:none;z-index:1;font-family:monospace;font-size:12px;position:absolute;top:5px;left:10px}
/*# sourceMappingURL=spectrogram.00781933.css.map */
