#tool-area{background:var(--bg-tool);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:30px;margin-bottom:30px}.upload-section{margin-bottom:30px}.dropzone{border:2px dashed var(--accent-secondary);border-radius:var(--radius-md);padding:40px;text-align:center;cursor:pointer;transition:all .3s ease;background:#0ea5e905}.dropzone:hover{border-color:var(--accent-primary);background:#e85d3a08}.dropzone.dragover{border-color:var(--accent-primary);background:#e85d3a0d}.dropzone-content{pointer-events:none}.dropzone-content svg{color:var(--accent-secondary);margin-bottom:16px;opacity:.7}.dropzone-text{font-size:16px;font-weight:500;color:var(--text-primary);margin:0 0 8px}.dropzone-subtext{font-size:14px;color:var(--text-secondary);margin:0}.file-input-hidden{display:none}.settings-section{margin-bottom:30px;background:#e85d3a0d;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:20px}.options-row{margin-bottom:20px}.options-row:last-child{margin-bottom:0}.form-group{margin-bottom:0}.form-group label{display:block;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}.quality-control{display:flex;gap:16px;align-items:center}.slider{flex:1;height:6px;border-radius:3px;background:var(--border-color);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent-primary);cursor:pointer;box-shadow:0 0 10px #e85d3a66}.slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent-primary);cursor:pointer;border:none;box-shadow:0 0 10px #e85d3a66}.quality-badge{min-width:60px;padding:6px 12px;background:var(--accent-primary);color:#fff;border-radius:var(--radius-sm);font-weight:600;font-size:14px;text-align:center}.helper-text{font-size:13px;color:var(--text-secondary);margin-top:8px;margin-bottom:0}.form-control{width:100%;padding:10px 12px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;font-family:inherit;cursor:pointer;transition:border-color .2s ease}.form-control:hover{border-color:var(--accent-secondary)}.form-control:focus{outline:none;border-color:var(--accent-primary)}.results-section{margin-bottom:30px}.results-section h3{font-size:18px;font-weight:600;color:var(--text-primary);margin-bottom:20px}.files-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.file-result-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px;transition:all .3s ease}.file-result-card:hover{border-color:var(--accent-primary);box-shadow:0 4px 12px #e85d3a26}.result-header{display:flex;justify-content:space-between;align-items:start;gap:12px;margin-bottom:16px}.result-filename{font-size:14px;font-weight:600;color:var(--text-primary);word-break:break-word;flex:1}.result-reduction{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700;white-space:nowrap}.result-reduction.high{background:#10b98133;color:var(--accent-success)}.result-reduction.medium{background:#f59e0b33;color:var(--accent-warning)}.result-reduction.low{background:#ef444433;color:var(--accent-error)}.result-stats{display:flex;gap:12px;margin-bottom:16px}.stat{flex:1;padding:10px;background:var(--bg-primary);border-radius:var(--radius-sm)}.stat-label{display:block;font-size:12px;color:var(--text-secondary);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.stat-value{display:block;font-size:16px;font-weight:700;color:var(--text-primary)}.result-preview{width:100%;height:140px;margin-bottom:16px;border-radius:var(--radius-sm);overflow:hidden;background:var(--bg-primary)}.result-preview img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.btn-download{width:100%}.empty-state{text-align:center;padding:40px 20px;color:var(--text-secondary)}.tool-actions{display:flex;gap:12px;flex-wrap:wrap}.tool-actions .btn{flex:1;min-width:150px}@media(max-width:640px){#tool-area{padding:20px}.dropzone{padding:30px 20px}.files-grid{grid-template-columns:1fr}.quality-control{flex-direction:column;align-items:stretch}.quality-badge{width:100%}}