.gif-main-panel,.video-preview-wrap{display:flex;flex-direction:column;gap:1rem}.gif-main-panel{box-sizing:border-box;padding-bottom:2rem}.video-preview-wrap{width:100%}.video-preview{width:100%;height:auto;background:var(--bg-light);border-radius:.875rem;object-fit:contain;cursor:pointer}.gif-setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.setting-card{background:#fff;border-radius:.875rem;padding:1rem 0;box-sizing:border-box}.card-title{color:var(--text-color);font-size:1rem;margin:0 0 1.2rem;font-weight:500}.setting-item{margin-bottom:1.2rem}.item-label{color:var(--text-light);font-size:.875rem;margin-bottom:1rem}.time-input-wrap{display:flex;align-items:center;gap:.875rem}.time-slider{flex:1;accent-color:var(--primary-color);height:.4rem;-webkit-appearance:none;appearance:none;background-color:#e4e7ed}.btn-group button,.time-duration,.time-input-wrap span{color:var(--text-color);font-size:.875rem}.time-duration{margin-top:.5rem;text-align:center}.btn-group{display:flex;flex-wrap:wrap;gap:.5rem}.btn-group button{padding:.5rem 1rem;background:#f5f7fa;border:0;border-radius:.4rem;cursor:pointer;transition:all .2s}.btn-group button.active{background:var(--primary-color);color:#fff}.btn,.gif-action-bar{display:flex;align-items:center}.gif-action-bar{justify-content:space-between;gap:.875rem;flex-wrap:wrap}.btn{padding:.875rem 1.2rem;border-radius:.5rem;border:0;cursor:pointer;justify-content:center;gap:.4rem;font-size:.875rem;transition:all .2s;box-sizing:border-box}.btn-generate-gif{flex:3;background:var(--primary-color);color:#fff;font-weight:500;min-width:10rem}.btn-generate-gif:disabled{background:#9ec4f5;cursor:not-allowed}.btn-reset{background:#fff;color:var(--text-color);border:.0625rem solid #dcdfe6;width:2.8rem;height:2.8rem;display:flex;align-items:center;justify-content:center;padding:0}.convert-progress{margin-top:1rem}.progress-bar{width:100%;height:.5rem;background:#e4e7ed;border-radius:.25rem;overflow:hidden}.progress-detail,.progress-text{color:var(--text-color);text-align:center}.progress-text{margin:.5rem 0;font-size:.95rem}.progress-detail{font-size:.875rem}@media (max-width:768px){.gif-setting-grid{grid-template-columns:1fr}}