body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#1a1a1a;color:#e0e0e0;margin:0;padding:15px;line-height:1.6;display:flex;justify-content:center;align-items:flex-start;min-height:100vh}.App{display:flex;flex-direction:column;gap:25px;max-width:900px;width:100%;margin:20px auto;padding:30px;background-color:#282828;border-radius:12px;box-shadow:0 6px 12px #0006}h1{text-align:center;color:#6bff6b;margin-bottom:25px;font-size:2.2em;font-weight:600}.group-box{border:1px solid #444;border-radius:8px;padding:20px;background-color:#333;box-shadow:inset 0 1px 3px #0003}legend{color:#6bd6ff;padding:0 12px;font-weight:700;font-size:1.1em;background-color:#333;border-radius:4px}.media-controls,.export-controls{display:flex;gap:15px;align-items:center;justify-content:flex-start;flex-wrap:wrap}.load-button,button{background-color:#007acc;color:#fff;padding:10px 20px;border-radius:6px;cursor:pointer;border:none;font-size:1em;transition:background-color .2s ease,transform .1s ease;flex-shrink:0}.load-button:hover,button:hover:not(:disabled){background-color:#005f99;transform:translateY(-1px)}button:disabled,.load-button[disabled]{background-color:#5a5a5a;cursor:not-allowed;transform:none;opacity:.7}.progress-container{flex-grow:1;display:flex;flex-direction:column;gap:8px;min-width:150px}.progress-label{font-size:.95em;color:#b0b0b0;text-align:right}progress{width:100%;height:12px;border-radius:6px;overflow:hidden;background-color:#4a4a4a;-webkit-appearance:none;-moz-appearance:none;appearance:none}progress::-webkit-progress-bar{background-color:#4a4a4a;border-radius:6px}progress::-webkit-progress-value{background-color:#6bff6b;border-radius:6px}progress::-moz-progress-bar{background-color:#4a4a4a;border-radius:6px}progress::-moz-progress-value{background-color:#6bff6b;border-radius:6px}.loaded-filename{font-size:.9em;color:#b0b0b0;margin-top:10px;margin-bottom:0;text-align:center}.audio-data-group{display:flex;flex-direction:column;gap:15px}.graph-label{font-size:.95em;color:#b0b0b0;text-align:center;margin-top:0;margin-bottom:-5px}.audio-graph{width:100%;height:200px;background-color:#1a1a1a;border:1px solid #4a4a4a;border-radius:6px;box-sizing:border-box}.settings-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:flex-start}.slider-container{display:flex;gap:40px;justify-content:center;align-items:flex-end;padding-top:30px;min-width:200px;flex-shrink:0}.slider-group{display:flex;flex-direction:column;align-items:center;gap:10px;flex-shrink:0}.vertical-slider{-webkit-appearance:slider-vertical;writing-mode:bt-lr;-moz-appearance:slider-vertical;appearance:slider-vertical;width:12px;height:180px;background:#555;border-radius:6px;outline:none;transition:background .2s ease;margin:0}.vertical-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#0af;cursor:grab;border:2px solid #fff;box-shadow:0 0 5px #00000080;transition:background .2s ease,box-shadow .2s ease}.vertical-slider::-webkit-slider-thumb:active{cursor:grabbing;background:#007bb3;box-shadow:0 0 8px #000000b3}.vertical-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#0af;cursor:grab;border:2px solid #fff;box-shadow:0 0 5px #00000080;transition:background .2s ease,box-shadow .2s ease}.vertical-slider::-moz-range-thumb:active{cursor:grabbing;background:#007bb3;box-shadow:0 0 8px #000000b3}.slider-group span{font-size:1.1em;font-weight:700;color:#e0e0e0}.options-container{flex:1 1 50%;min-width:300px;display:flex;flex-direction:column;gap:15px}.sub-group{border:1px solid #4a4a4a;border-radius:6px;padding:15px;background-color:#3d3d3d}.sub-group legend{font-size:1em;color:#b0b0b0;font-weight:400;background-color:#3d3d3d}.sub-group div{margin-bottom:8px}.sub-group div:last-child{margin-bottom:0}input[type=checkbox],input[type=radio]{margin-right:8px;transform:scale(1.1);accent-color:#00aaff;cursor:pointer}label{cursor:pointer;display:inline-flex;align-items:center}.spinbox-group{display:flex;align-items:center;gap:10px;margin-top:10px}.spinbox-group label{flex-shrink:0}.spinbox-group input[type=number]{width:80px;padding:8px 10px;border-radius:4px;border:1px solid #5a5a5a;background-color:#4a4a4a;color:#e0e0e0;font-size:1em;-moz-appearance:textfield}.spinbox-group input[type=number]::-webkit-outer-spin-button,.spinbox-group input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.export-controls{justify-content:flex-end}.disclaimer{font-size:.9em;color:#888;text-align:center;margin-top:25px}fieldset[disabled]{opacity:.5;pointer-events:none}@media (max-width: 768px){.App{padding:20px;margin:10px auto}.media-controls,.export-controls{flex-direction:column;align-items:stretch}.progress-container{width:100%;text-align:center}.progress-label{text-align:center}.settings-grid{flex-direction:column;align-items:stretch}.slider-container{flex-direction:column;gap:20px;padding-top:0;align-items:center}.slider-group{width:100%}.vertical-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;writing-mode:horizontal-tb;width:100%;height:12px;margin:10px 0;background:#555}.vertical-slider::-webkit-slider-thumb{width:20px;height:20px}.vertical-slider::-moz-range-thumb{width:20px;height:20px}.options-container{min-width:unset;width:100%}.sub-group{padding:12px}}.stats-display{display:flex;flex-wrap:wrap;gap:10px;font-size:.9em}.stats-display div{background-color:#333;padding:5px 10px;border-radius:4px;border:1px solid #555}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}