.image-converter-pro{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;max-width:1200px;margin:30px auto;background:#fff;border-radius:12px;box-shadow:0 5px 30px rgba(0,0,0,.08);overflow:hidden}.converter-header{background:linear-gradient(140deg,#fa812f,#ff9149);color:#fff;padding:25px 40px;text-align:center}.converter-header h1{margin:0;font-size:32px;display:flex;align-items:center;justify-content:center;gap:15px}.converter-header p{margin:10px 0 0;opacity:.9;font-size:18px}.converter-main{display:flex;min-height:600px}.control-panel{flex:1;padding:25px;background:#f8f9fa;border-right:1px solid #e5e7eb}.control-section{margin-bottom:25px;background:#fff;padding:20px;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.03)}.control-section h3{margin-top:0;margin-bottom:15px;color:#3a0ca3;display:flex;align-items:center;gap:10px;font-size:18px}.operation-selector{display:flex;gap:10px;margin-bottom:10px}.op-btn{flex:1;padding:12px;border:none;border-radius:6px;background:#e9ecef;color:#495057;font-weight:600;cursor:pointer;transition:all .3s;text-align:center}.op-btn.active{background:#4361ee;color:#fff}.op-btn:hover:not(.active){background:#dee2e6}.upload-area{border:2px dashed #ced4da;border-radius:8px;padding:30px;text-align:center;cursor:pointer;transition:all .3s;margin-bottom:10px}.upload-area:hover{border-color:#4361ee;background:#f8f9fe}.upload-area i{font-size:42px;color:#4361ee;margin-bottom:10px}.upload-area p{margin:10px 0;color:#6c757d}.upload-area p span{color:#4361ee;text-decoration:underline}.file-limits{font-size:13px;color:#6c757d;margin-top:10px}.file-info{font-size:14px;color:#495057;padding:5px 0}.option-group{margin-bottom:15px}.option-group label{display:block;margin-bottom:8px;font-weight:500;color:#343a40}.option-group select,.option-group input[type=number]{width:100%;padding:10px 12px;border:1px solid #ced4da;border-radius:6px;font-size:14px}.option-group input[type=range]{width:100%}.checkbox-group{display:flex;align-items:center;gap:8px}.action-buttons{display:flex;gap:15px;margin-top:25px}.btn-process,.btn-download{flex:1;padding:14px;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:10px}.btn-process{background:#4361ee;color:#fff}.btn-process:hover{background:#3a56d4}.btn-download{background:#4cc9f0;color:#fff}.btn-download:hover{background:#3aa8cc}.btn-download:disabled{background:#ced4da;cursor:not-allowed}.btn-reset{background:#f8f9fa;color:#495057;border:1px solid #ced4da;padding:14px;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:10px}.btn-reset:hover{background:#e9ecef}.preview-panel{flex:1;padding:25px;display:flex;flex-direction:column}.preview-section{flex:1;margin-bottom:25px}.preview-section h3{margin-top:0;margin-bottom:15px;color:#3a0ca3;display:flex;align-items:center;gap:10px}.preview-area{border:1px solid #e5e7eb;border-radius:8px;padding:20px;min-height:300px;background:#f8f9fa;overflow-y:auto}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#6c757d;text-align:center}.empty-state i{font-size:48px;margin-bottom:15px;color:#adb5bd}.tips-section{background:#fff;border-radius:10px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,.03)}.tip-card{background:#f8f9fa;border-radius:8px;padding:15px;margin-bottom:15px}.tip-card h4{margin-top:0;margin-bottom:10px;color:#3a0ca3;display:flex;align-items:center;gap:8px;font-size:16px}.tip-card ul{margin:0;padding-left:20px;font-size:14px;color:#495057}.tip-card li{margin-bottom:5px}.supported-formats{padding:25px 40px;background:#f8f9fa;border-top:1px solid #e5e7eb}.supported-formats h3{margin-top:0;margin-bottom:20px;color:#3a0ca3;display:flex;align-items:center;gap:10px;justify-content:center}.formats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px}.format-item{background:#fff;border-radius:8px;padding:15px;text-align:center;box-shadow:0 2px 5px rgba(0,0,0,.05)}.format-icon{font-weight:700;color:#4361ee;margin-bottom:5px}.format-desc{font-size:13px;color:#6c757d}@media (max-width:900px){.converter-main{flex-direction:column}.control-panel{border-right:none;border-bottom:1px solid #e5e7eb}}@media (max-width:600px){.operation-selector{flex-direction:column}.action-buttons{flex-direction:column}.converter-header h1{font-size:26px}}