.range-slider{touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;cursor:pointer;background:#ddd;border-radius:4px;width:100%;height:8px;display:block;position:relative}.range-slider[data-vertical]{width:8px;height:100%}.range-slider[data-disabled]{opacity:.5;cursor:not-allowed}.range-slider .range-slider__thumb{z-index:3;background:#2196f3;border-radius:50%;width:24px;height:24px;position:absolute;top:50%;transform:translate(-50%,-50%)}.range-slider .range-slider__thumb:focus-visible{outline:0;box-shadow:0 0 0 6px #2196f380}.range-slider[data-vertical] .range-slider__thumb{left:50%}.range-slider .range-slider__thumb[data-disabled]{z-index:2}.range-slider .range-slider__range{z-index:1;background:#51adf6;width:100%;height:100%;position:absolute;top:50%;transform:translateY(-50%)}.range-slider[data-vertical] .range-slider__range{left:50%;transform:translate(-50%)}.range-slider input[type=range]{-webkit-appearance:none;pointer-events:none;z-index:2;background-color:#0000;width:0;height:0;position:absolute;top:0;left:0}.range-slider input[type=range]::-webkit-slider-thumb{appearance:none}.range-slider input[type=range]::-moz-range-thumb{border:0;width:0;height:0}.range-slider input[type=range]:focus{outline:0}*{box-sizing:border-box;margin:0;padding:0}.app{color:#e0e0e0;background:#0f0f0f;flex-direction:column;align-items:center;min-height:100vh;padding:2rem 1.5rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}h1{margin-bottom:.25rem;font-size:1.8rem;font-weight:700}h3{color:#ccc;margin-bottom:1rem;font-size:1rem;font-weight:600}.subtitle{color:#888;margin-bottom:1.5rem;font-size:.9rem}.upload-area{margin-bottom:1.5rem}.upload-label{cursor:pointer;border:2px dashed #444;border-radius:8px;padding:.75rem 1.5rem;font-size:.9rem;transition:border-color .2s;display:inline-block}.upload-label:hover{border-color:#888}.file-input{display:none}.content{gap:2rem;width:100%;max-width:700px;margin-bottom:1.5rem;display:flex}.left-panel{flex-direction:column;align-items:center;gap:.5rem;display:flex}.right-panel{flex:1;min-width:240px}.preview-wrapper{background:#1a1a1a;border:1px solid #333;border-radius:12px;width:200px;height:200px;overflow:hidden}.preview-canvas{width:100%;height:100%;display:block}.info{color:#888;font-size:.8rem}.info-hint{color:#666;margin-top:.25rem;font-size:.75rem}.frame-range{width:100%;margin-top:.75rem}.frame-range>label{color:#aaa;margin-bottom:.25rem;font-size:.8rem;display:block}.range-dual{flex-direction:column;gap:.25rem;display:flex}.range-dual input[type=range]{accent-color:#4f46e5;width:100%}.range-labels{color:#666;justify-content:space-between;font-size:.7rem;display:flex}.playback-controls{align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.play-btn{color:#e0e0e0;cursor:pointer;background:#1a1a1a;border:1px solid #444;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;transition:border-color .15s;display:flex}.play-btn:hover{border-color:#888}.frame-display{color:#888;font-variant-numeric:tabular-nums;font-size:.75rem}.playhead{width:100%;margin-top:.25rem}.playhead-slider{accent-color:#4f46e5;width:100%;height:4px}.trim-section{background:#161616;border:1px solid #2a2a2a;border-radius:8px;width:100%;margin-top:.75rem;padding:.6rem .75rem}.trim-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem;margin-bottom:.5rem;display:flex}.trim-label{color:#999;font-variant-numeric:tabular-nums;font-size:.8rem}.trim-buttons{gap:.3rem;display:flex}.trim-btn{color:#bbb;cursor:pointer;background:#222;border:1px solid #3a3a3a;border-radius:4px;padding:.25rem .6rem;font-size:.7rem;transition:all .15s}.trim-btn:hover{color:#c7c3ff;background:#2a2a3a;border-color:#4f46e5}.trim-slider{background:#2a2a2a!important;border:none!important;border-radius:4px!important;height:8px!important}.trim-slider .range-slider__range{background:#4f46e5!important;border-radius:4px!important}.trim-slider .range-slider__thumb{background:#e0e0e0!important;border:2px solid #4f46e5!important;border-radius:50%!important;width:16px!important;height:16px!important;box-shadow:0 1px 4px #0006!important}.trim-slider .range-slider__thumb:hover{background:#fff!important}.bg-buttons{flex-wrap:wrap;gap:.4rem;display:flex}.bg-btn{color:#aaa;cursor:pointer;background:#1a1a1a;border:1px solid #333;border-radius:6px;align-items:center;gap:.3rem;padding:.35rem .6rem;font-size:.75rem;transition:all .15s;display:flex}.bg-btn:hover{border-color:#555}.bg-btn.active{color:#a5b4fc;border-color:#4f46e5}.bg-swatch{border:1px solid #555;border-radius:3px;width:14px;height:14px}.transparent-swatch{background:repeating-conic-gradient(#444 0% 25%,#666 0% 50%) 50%/8px 8px}.bg-custom{position:relative}.bg-custom input[type=color]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.option-group{margin-bottom:.75rem}.option-group>label{color:#aaa;margin-bottom:.25rem;font-size:.85rem;display:block}.option-hint{color:#666;margin-top:.2rem;font-size:.75rem;display:block}.checkbox-label{align-items:center;gap:.5rem;flex-direction:row!important;display:flex!important}.checkbox-label input[type=checkbox]{width:auto}.format-buttons{gap:.5rem;margin-bottom:.25rem;display:flex}.format-btn{color:#aaa;cursor:pointer;background:#1a1a1a;border:1px solid #333;border-radius:6px;flex:1;padding:.5rem;font-size:.8rem;font-weight:600;transition:all .15s}.format-btn:hover{color:#e0e0e0;border-color:#555}.format-btn.active{color:#a5b4fc;background:#4f46e520;border-color:#4f46e5}.option-group.disabled{opacity:.4;pointer-events:none}.option-group input[type=number],.option-group select{color:#e0e0e0;background:#1a1a1a;border:1px solid #333;border-radius:6px;width:100%;padding:.4rem .6rem;font-size:.85rem}.option-group input[type=range]{accent-color:#4f46e5;width:100%}.size-inputs{align-items:center;gap:.5rem;display:flex}.size-inputs input{flex:none;width:80px!important}.size-inputs span{color:#666}.actions{flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:700px;display:flex}.convert-btn{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:8px;min-width:200px;padding:.75rem 2rem;font-size:1rem;font-weight:600;transition:background .2s}.convert-btn:hover:not(:disabled){background:#4338ca}.convert-btn:disabled{opacity:.7;cursor:not-allowed}.progress-bar{background:#333;border-radius:3px;width:300px;height:6px;overflow:hidden}.progress-fill{background:#4f46e5;height:100%;transition:width .15s}.result{flex-direction:column;align-items:center;gap:.75rem;display:flex}.result-preview{background:#1a1a1a;border:1px solid #333;border-radius:8px;max-width:200px;max-height:200px}.download-btn{color:#fff;background:#059669;border-radius:8px;padding:.75rem 2rem;font-size:.95rem;font-weight:600;text-decoration:none;transition:background .2s;display:inline-block}.download-btn:hover{background:#047857}.file-size{opacity:.8;font-weight:400}.error{color:#ef4444;text-align:center;max-width:500px;margin-top:1rem;font-size:.9rem}@media (width<=600px){.content{flex-direction:column;align-items:center}}