:root{color-scheme:dark;font-family:Inter,Arial,sans-serif;color:#f6f5f8;background:#101014;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #79cfff;outline-offset:4px}header{height:78px;border-bottom:1px solid #303037;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:#19191f}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:white;font-size:32px;font-weight:800;letter-spacing:-1.5px}.brand-icon{background:#ed0878;border-radius:9px;padding:0 7px;font-size:30px;font-weight:400}.studio{font-size:11px;letter-spacing:2px;color:#8d8b98;margin-left:15px;font-weight:500}.privacy{font-size:13px;color:#aaa7b6}.outline{background:none;border:1px solid #494751;color:white;border-radius:7px;padding:11px 17px;font-size:14px}main{display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:calc(100vh - 78px)}#workspace{position:relative;min-height:700px;height:calc(100vh - 78px);overflow:hidden;background:radial-gradient(ellipse at 45% 45%,#1f1e28 0%,#111115 70%)}.workspace-label{position:absolute;z-index:3;top:24px;left:28px;font-size:11px;letter-spacing:1.5px;color:#9b98a7;display:flex;align-items:center;gap:9px}#filename{letter-spacing:0;color:#686674;margin-left:13px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dot{width:6px;height:6px;background:#eb0876;border-radius:100%}#empty{position:absolute;left:0;right:0;top:50%;transform:translateY(-51%);text-align:center;padding:20px}.upload-icon{margin:0 auto 30px;display:grid;place-items:center;width:70px;height:70px;border:1px solid #62515e;border-radius:19px;font-size:43px;color:#f53892;transform:rotate(-7deg);background:#2d1c2b;box-shadow:8px 8px 0 #16151c}h1{font-size:clamp(40px,5vw,70px);font-weight:650;letter-spacing:-3px;line-height:1.06;margin:0 0 22px}h1 span{color:#9893a5}#empty p{font-size:16px;color:#a29ead;line-height:1.5}.primary{margin:21px 0 9px;background:#ee087a;border:0;border-radius:8px;color:white;padding:16px 23px;font-weight:600}.primary span{margin-left:35px}.hint,#empty .hint{font-size:12px;color:#878292;line-height:1.6}.formats{margin-top:35px;font-size:11px;letter-spacing:1.5px;color:#6c6778}.formats i{padding:0 14px;font-style:normal}.canvas-bottom{position:absolute;bottom:22px;left:28px;right:28px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#777380;font-size:12px;z-index:5}#canvas-status{font-size:10px;letter-spacing:1.4px}aside{background:#1c1c22;border-left:1px solid #34323c;display:flex;flex-direction:column}.panel-title{padding:25px 24px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #35323e}h2{font-size:16px;font-weight:600;margin:0}.panel-title>span{font-size:11px;color:#736d81}fieldset{border:0;padding:0;margin:0;min-width:0}.tool{padding:21px 24px;border-bottom:1px solid #34313d}.tool-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}h3{font-size:15px;margin:0;font-weight:600}h3 b{color:#77707f;font-size:11px;font-weight:500;margin-right:12px}.tag{background:#482037;color:#ff73b4;font-size:9px;letter-spacing:1px;margin-left:8px;padding:3px 5px;border-radius:3px}.sub{font-size:12px;color:#8b8596;margin:0}.active-label{font-size:10px;letter-spacing:1px;color:#73bdd8}label{font-size:13px;color:#b6afc2;display:block}input[type=number],select{display:block;width:100%;background:#121216;border:1px solid #39343f;border-radius:5px;padding:10px;color:#ddd7e6;font-size:14px;margin:8px 0 15px;height:38px}.pair{display:flex;gap:12px}.pair label{width:50%}.pair label span{float:right;font-size:11px;color:#6b6477}.check{display:flex;gap:8px;align-items:center;font-size:12px}.check input{accent-color:#63bce9}.tool-title input{appearance:none;width:32px;height:18px;border-radius:20px;background:#45414d;position:relative;margin:0;cursor:pointer}.tool-title input:before{content:'';position:absolute;width:12px;height:12px;top:3px;left:3px;border-radius:50%;background:#a29baa;transition:.2s}.tool-title input:checked{background:#405969}.tool-title input:checked:before{left:17px;background:#6bc5f2}#crop-toggle:checked{background:#76204b}#crop-toggle:checked:before{background:#ff50a2}.quality-label{display:flex;justify-content:space-between;align-items:center}.quality-label output{font-size:13px;color:#80c7ec;background:#25333f;padding:4px 6px;border-radius:3px}input[type=range]{width:100%;accent-color:#6ac5f2;margin:14px 0 5px}.range-labels{display:flex;justify-content:space-between;font-size:10px;color:#867d93}.export{padding:24px;margin-top:auto;background:#222128}.size-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.size-row div>span{font-size:10px;letter-spacing:1.2px;color:#958b9f}strong{display:block;font-size:30px;margin-top:5px;font-weight:500}strong small{font-size:13px;color:#8d8699}#savings{font-size:11px;color:#a69bab;max-width:120px;text-align:right}.download{width:100%;background:#66bce8;color:#0c2230;padding:14px 5px;border:0;border-radius:6px;font-size:14px;font-weight:700}.export p{text-align:center;font-size:11px;color:#908499;margin:12px 0 0}#view{height:100%;overflow:auto;padding:80px 35px 90px;align-items:center;justify-content:center}#view:not([hidden]){display:flex}#imagebox{position:relative;flex:none;line-height:0;box-shadow:0 5px 40px #0005}#original{display:block;width:100%;height:100%;object-fit:fill}#result{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;clip-path:inset(0 0 0 50%)}#divider{position:absolute;left:50%;top:0;bottom:0;width:2px;background:#fff9;touch-action:none}#handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #555;background:#151219;color:#ed2e91;width:44px;height:44px;border-radius:50%;font-size:12px;touch-action:none;cursor:ew-resize}#compare-labels{position:absolute;top:60px;left:30px;right:30px;display:flex;justify-content:space-between;pointer-events:none;font-size:10px;letter-spacing:1px;color:#a298b2}#compare-labels[hidden]{display:none}#zoom-tools{background:#27232c;border:1px solid #49404d;border-radius:6px;white-space:nowrap}#zoom-tools button{background:none;color:#c2b6cf;border:0;padding:9px 12px;font-size:13px}#crop-layer{position:absolute;inset:0;touch-action:none;cursor:crosshair;overflow:hidden}#crop-box{position:absolute;border:2px solid #ff2b91;box-shadow:0 0 0 10000px #0009;pointer-events:none;background:linear-gradient(90deg,transparent 33%,#fff5 33%,#fff5 33.3%,transparent 33.3%,transparent 66.6%,#fff5 66.6%,#fff5 67%,transparent 67%),linear-gradient(transparent 33%,#fff5 33%,#fff5 33.3%,transparent 33.3%,transparent 66.6%,#fff5 66.6%,#fff5 67%,transparent 67%)}.accent{background:#ec0876;color:white;border:0;border-radius:5px;padding:10px 17px;font-size:13px}.text-button{background:none;color:#aaa1b6;border:0;padding:10px;font-size:13px}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#453142;border:1px solid #ad729b;padding:12px 20px;border-radius:8px;z-index:20;font-size:14px;display:none}.dragging{outline:3px dashed #ff3699;outline-offset:-12px}#resize-controls.inactive{opacity:.5}@media(max-width:760px){header{padding:0 18px;height:66px}.studio,.privacy{display:none}main{display:block}#workspace{height:64vh;min-height:450px}aside{border-left:0}.panel-title{padding:20px 24px}h1{font-size:46px}.upload-icon{margin-bottom:22px;width:50px;height:50px;font-size:32px}#empty p{font-size:14px}#canvas-status{display:none}.canvas-bottom{left:18px;right:18px}#dimensions{max-width:170px;font-size:11px}.formats{margin-top:20px}#empty .hint{font-size:11px}#filename{max-width:150px}.tool{padding:20px 24px}}
label,.check{font-size:14px}.hint,.sub,.export p,.range-labels{font-size:12px}