*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color: #007bff;--bg-color: #1a1a1a;--text-color: #e0e0e0;--panel-bg: #2d2d2d;--border-color: #404040;--bright-text-color: #ffffff;--comparison-bg-color: #000000;--dropdown-bg-color: #333333;--disabled-bg-color: #555555;--status-text-color: #aaaaaa;--primary-hover-color: #0056b3;--progress-bg-color: #444444;--label-bg-color: rgba(0, 0, 0, .7);--slider-thumb-color: #fff7}html{overflow-y:scroll}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-color);padding:20px;display:flex;flex-direction:column;gap:20px}body>*{width:100%;max-width:1200px;margin:0 auto}.panel{background-color:var(--panel-bg);padding:20px;border-radius:8px;border:1px solid var(--border-color)}h1{color:var(--bright-text-color)}.controls{display:flex;flex-wrap:wrap;gap:20px;align-items:center}.btn{background-color:var(--primary-color);color:var(--bright-text-color);padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s;text-decoration:none;display:inline-block}.btn:hover:not(:disabled){background-color:var(--primary-hover-color)}.btn:disabled{background-color:var(--disabled-bg-color);cursor:not-allowed;opacity:.7}input[type=file]{display:none}.device-selector{display:flex;align-items:center;gap:10px}.device-dropdown{background-color:var(--dropdown-bg-color);color:var(--bright-text-color);border:1px solid var(--border-color);padding:8px;border-radius:4px;min-width:200px}#status{margin-left:auto;font-weight:700;color:var(--status-text-color);min-width:100px;text-align:right}progress{width:100%;height:20px;appearance:none;background-color:var(--progress-bg-color);border-radius:10px;border:none}progress::-webkit-progress-bar{background-color:var(--progress-bg-color);border-radius:10px}progress::-webkit-progress-value{background-color:var(--primary-color);border-radius:10px;transition:width .1s linear}progress::-moz-progress-bar{background-color:var(--primary-color);border-radius:10px}.comparison-container{position:relative;width:100%;height:70vh;background-color:var(--comparison-bg-color);border-radius:8px;overflow:hidden;-webkit-user-select:none;user-select:none;border:1px solid var(--border-color)}.image-wrapper{position:absolute;top:0;left:0;width:100%;height:100%}canvas{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none}#processedImg{clip-path:inset(0 0 0 50%)}.label{position:absolute;bottom:10px;background-color:var(--label-bg-color);color:var(--bright-text-color);padding:4px 8px;border-radius:4px;font-size:12px;pointer-events:none}#originalWrapper .label{left:10px}#processedWrapper .label{right:10px}#slider{position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;z-index:20;cursor:ew-resize;touch-action:none;appearance:none}#slider::-webkit-slider-runnable-track{height:100%}#slider::-moz-range-track{height:100%}#slider::-webkit-slider-thumb{appearance:none;width:4px;height:100%;background:var(--slider-thumb-color);cursor:ew-resize}#slider::-moz-range-thumb{appearance:none;width:4px;height:100%;background:var(--slider-thumb-color);cursor:ew-resize}