.mt-image-preview{position:relative;display:flex;align-items:center;justify-content:center;background-color:var(--mt-bg-secondary);border:1px solid var(--mt-border);border-radius:var(--mt-radius-md);padding:var(--mt-space-sm);min-height:200px;max-height:500px;overflow:hidden;margin-top:var(--mt-space-md)}.mt-image-preview img,.mt-image-preview canvas{max-width:100%;max-height:480px;height:auto;object-fit:contain;border-radius:var(--mt-radius-sm)}.mt-image-preview.mt-checkerboard{background-image:linear-gradient(45deg,var(--mt-bg-tertiary) 25%,transparent 25%),linear-gradient(-45deg,var(--mt-bg-tertiary) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--mt-bg-tertiary) 75%),linear-gradient(-45deg,transparent 75%,var(--mt-bg-tertiary) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.mt-image-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--mt-space-sm);margin-top:var(--mt-space-md);padding:var(--mt-space-md);background-color:var(--mt-bg-secondary);border:1px solid var(--mt-border);border-radius:var(--mt-radius-md)}.mt-image-info-item{display:flex;flex-direction:column;gap:2px}.mt-image-info-label{font-size:var(--mt-font-size-xs);color:var(--mt-text-tertiary);text-transform:uppercase;letter-spacing:.05em;font-weight:600}.mt-image-info-value{font-size:var(--mt-font-size-sm);color:var(--mt-text);font-weight:500}.mt-range-group{margin-bottom:var(--mt-space-md)}.mt-range-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--mt-space-xs)}.mt-range-label{font-size:var(--mt-font-size-sm);font-weight:600;color:var(--mt-text)}.mt-range-value{font-size:var(--mt-font-size-sm);color:var(--mt-primary);font-weight:600;font-family:var(--mt-font-mono);min-width:3em;text-align:right}.mt-range-group input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:6px;background:var(--mt-bg-tertiary);border-radius:var(--mt-radius-full);outline:none;transition:background var(--mt-transition-fast)}.mt-range-group input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--mt-primary);border-radius:50%;cursor:pointer;border:2px solid var(--mt-bg);box-shadow:var(--mt-shadow-sm);transition:transform var(--mt-transition-fast)}.mt-range-group input[type="range"]::-webkit-slider-thumb:hover{transform:scale(1.15)}.mt-range-group input[type="range"]::-moz-range-thumb{width:18px;height:18px;background:var(--mt-primary);border-radius:50%;cursor:pointer;border:2px solid var(--mt-bg);box-shadow:var(--mt-shadow-sm)}.mt-image-tools-section{margin-top:var(--mt-space-lg);padding-top:var(--mt-space-lg);border-top:1px solid var(--mt-border)}.mt-image-tools-section.mt-hidden{display:none!important}.mt-image-compare{display:grid;grid-template-columns:1fr 1fr;gap:var(--mt-space-md);margin-top:var(--mt-space-md)}.mt-image-compare-panel{text-align:center}.mt-image-compare-label{font-size:var(--mt-font-size-xs);font-weight:600;color:var(--mt-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--mt-space-sm)}.mt-image-compare-panel .mt-image-preview{margin-top:0}.mt-position-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;width:120px}.mt-position-grid button{width:36px;height:36px;border:1px solid var(--mt-border);border-radius:var(--mt-radius-sm);background:var(--mt-bg-secondary);cursor:pointer;transition:all var(--mt-transition-fast);padding:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--mt-text-tertiary)}.mt-position-grid button:hover{border-color:var(--mt-primary);color:var(--mt-primary)}.mt-position-grid button.is-active{background:var(--mt-primary);border-color:var(--mt-primary);color:var(--mt-text-inverse)}.mt-crop-container{position:relative;display:inline-block;cursor:crosshair;user-select:none;-webkit-user-select:none}.mt-crop-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mt-crop-region{position:absolute;border:2px dashed var(--mt-primary);background:rgb(37 99 235 / .1);cursor:move;pointer-events:auto;box-shadow:0 0 0 9999px rgb(0 0 0 / .4)}.mt-crop-handle{position:absolute;width:10px;height:10px;background:var(--mt-primary);border:2px solid #fff;border-radius:50%;pointer-events:auto}.mt-crop-handle-nw{top:-5px;left:-5px;cursor:nw-resize}.mt-crop-handle-ne{top:-5px;right:-5px;cursor:ne-resize}.mt-crop-handle-sw{bottom:-5px;left:-5px;cursor:sw-resize}.mt-crop-handle-se{bottom:-5px;right:-5px;cursor:se-resize}.mt-progress{width:100%;height:8px;background:var(--mt-bg-tertiary);border-radius:var(--mt-radius-full);overflow:hidden;margin:var(--mt-space-md) 0;display:none}.mt-progress.is-visible{display:block}.mt-progress-bar{height:100%;background:linear-gradient(90deg,var(--mt-primary),#60a5fa);border-radius:var(--mt-radius-full);transition:width var(--mt-transition-base);width:0%}.mt-size-badge{display:inline-flex;align-items:center;gap:var(--mt-space-xs);padding:.25rem .625rem;font-size:var(--mt-font-size-xs);font-weight:600;border-radius:var(--mt-radius-full)}.mt-size-badge-decrease{color:var(--mt-success);background:var(--mt-success-light)}.mt-size-badge-increase{color:var(--mt-error);background:var(--mt-error-light)}.mt-aspect-lock{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--mt-border);border-radius:var(--mt-radius-md);background:var(--mt-bg-secondary);cursor:pointer;transition:all var(--mt-transition-fast);font-size:16px;color:var(--mt-text-secondary);padding:0;flex-shrink:0}.mt-aspect-lock.is-locked{background:var(--mt-primary);border-color:var(--mt-primary);color:var(--mt-text-inverse)}.mt-resize-dimensions{display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto auto;gap:var(--mt-space-xs) var(--mt-space-sm);align-items:center;margin-bottom:var(--mt-space-md)}.mt-resize-width-label{grid-column:1;grid-row:1;margin-bottom:0!important}.mt-resize-width-input{grid-column:1;grid-row:2}.mt-resize-dimensions .mt-aspect-lock{grid-column:2;grid-row:2;align-self:center}.mt-resize-height-label{grid-column:3;grid-row:1;margin-bottom:0!important}.mt-resize-height-input{grid-column:3;grid-row:2}@media (max-width:768px){.mt-image-compare{grid-template-columns:1fr}.mt-image-info{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.mt-image-info{grid-template-columns:1fr}.mt-image-preview{min-height:150px;max-height:350px}}