.d-flex{display:flex}.flex-wrap{flex-wrap:wrap}.imageFormatConverter{max-width:1200px}.imageFormatConverter h3{font-size:20px;font-weight:700;text-align:left;color:#17445c;margin-bottom:8px}@media(max-width:576px){.imageFormatConverter h3{font-size:18px}}.imageFormatConverter__limitNote{background:#df20730f;border-left:4px solid #df2073;border-radius:8px;padding:10px 16px;text-align:left}.imageFormatConverter__limitNote p{color:#17445c;font-size:14px;margin:0}@media(max-width:576px){.imageFormatConverter__limitNote p{font-size:13px}}.imageFormatConverter .card{background:#fdfdfd;border:1px solid #eee;border-radius:10px;padding:18px}@media(max-width:576px){.imageFormatConverter .card{padding:14px}}.imageFormatConverter .card__title{font-size:18px;font-weight:700;color:#17445c;text-align:left;border-left:4px solid #4e8ab5;padding-left:8px;margin-bottom:14px}@media(max-width:576px){.imageFormatConverter .card__title{font-size:16px}}.imageFormatConverter .decodingBox{text-align:center;padding:50px 16px}.imageFormatConverter .decodingBox p{color:#3f464d;font-size:15px}.imageFormatConverter .spinner{display:inline-block;width:36px;height:36px;border:4px solid rgba(78,138,181,.2);border-top-color:#4e8ab5;border-radius:50%;animation:imageFormatConverterSpin .8s linear infinite}@keyframes imageFormatConverterSpin{to{transform:rotate(360deg)}}.imageFormatConverter label{display:block;font-weight:600;margin-bottom:6px;color:#3f464d;font-size:13px;text-align:left}.imageFormatConverter .privacyNote{font-size:13px;color:#7993a5;text-align:center}.imageFormatConverter .dropZone{border:2px dashed #cfd8e3;border-radius:10px;padding:40px 16px;text-align:center;cursor:pointer;transition:all .2s}.imageFormatConverter .dropZone.is-dragover{border-color:#4e8ab5;background:#4e8ab50f}.imageFormatConverter .dropZone:hover{border-color:#4e8ab5}@media(max-width:576px){.imageFormatConverter .dropZone{padding:26px 12px}}.imageFormatConverter .dropZone__hint{color:#17445c;font-size:16px;font-weight:600;margin-bottom:6px}.imageFormatConverter .dropZone__sub{color:#3f464d;font-size:13px;margin-bottom:16px}.imageFormatConverter .hidden-input{display:none}.imageFormatConverter .actionBtn{display:inline-block;border:none;border-radius:20px;padding:8px 20px;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s}.imageFormatConverter .actionBtn.primary{background:#4e8ab5;color:#fff}.imageFormatConverter .actionBtn.primary:hover{background:#3c79a5}.imageFormatConverter .actionBtn.primary:disabled{background:#ccc;cursor:not-allowed}.imageFormatConverter .actionBtn.ghost{background:#fff;color:#3f464d;border:1px solid #ddd}.imageFormatConverter .actionBtn.ghost:hover{border-color:#4e8ab5;color:#4e8ab5}.imageFormatConverter .downloadBtn{width:100%;padding:12px;font-size:16px}.imageFormatConverter .workspace{display:flex;gap:24px;align-items:flex-start}@media(max-width:576px){.imageFormatConverter .workspace{flex-direction:column}}@media(max-width:992px){.imageFormatConverter .workspace{flex-direction:column}}.imageFormatConverter .workspace__stage{flex:1 1 55%;min-width:0}.imageFormatConverter .workspace__controls{flex:1 1 45%;min-width:0}.imageFormatConverter .stageWrap{position:relative;width:100%;border-radius:8px;overflow:hidden;background:repeating-conic-gradient(#e9edf1 0% 25%,#f7f9fb 0% 50%) 50%/20px 20px;line-height:0}.imageFormatConverter .stageImg{display:block;width:100%;height:auto;max-height:460px;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.imageFormatConverter .infoRow{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.imageFormatConverter .infoRow__badge{display:inline-block;background:#4e8ab5;color:#fff;font-size:12px;font-weight:700;border-radius:20px;padding:3px 12px}.imageFormatConverter .infoRow__dims{font-size:13px;color:#3f464d}.imageFormatConverter .targetFormatNote{font-size:13px;color:#df2073;font-weight:600}.imageFormatConverter .previewWrap{width:100%;background:repeating-conic-gradient(#e9edf1 0% 25%,#f7f9fb 0% 50%) 50%/20px 20px;border-radius:8px;padding:10px;text-align:center}.imageFormatConverter .previewCanvas{max-width:100%;max-height:320px;border-radius:4px}.imageFormatConverter .sizeCompare{background:#fdfdfd;border:1px solid #eee;border-radius:8px;padding:12px 16px}.imageFormatConverter .sizeCompare__row{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;color:#3f464d;padding:4px 0}.imageFormatConverter .sizeCompare__value{font-weight:700;color:#17445c}.imageFormatConverter .sizeCompare__value.is-smaller{color:#28a745}.imageFormatConverter .sizeCompare__value.is-larger{color:#df2073}.imageFormatConverter .sizeCompare__diff{margin-top:6px;font-size:13px;font-weight:700;text-align:right}.imageFormatConverter .sizeCompare__diff.is-smaller{color:#28a745}.imageFormatConverter .sizeCompare__diff.is-larger{color:#df2073}.imageFormatConverter .sizeCompare__diff.is-same{color:#3f464d}
