::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#212326;border-radius:10px}::-webkit-scrollbar-thumb{background:#57c27a;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#4aac68}.dropzone{border:3px dashed #57c27a;transition:.2s}.dropzone.active{border-color:#f0ca81;background-color:rgba(87,194,122,.1)}.canvas-container{position:relative;width:800px;height:800px;background-color:#212326;background-image:linear-gradient(#2d3033 1px,transparent 1px),linear-gradient(90deg,#2d3033 1px,transparent 1px);background-size:20px 20px;overflow:hidden;touch-action:none}.zoom-container{width:100%;height:100%;transform-origin:center center;transform:scale(1) translate(0,0);touch-action:none}.crop-area{position:absolute;border:2px dashed #f0ca81;box-sizing:border-box;display:flex;justify-content:center;align-items:center;pointer-events:none;transition:.3s;z-index:10}.image-container{position:absolute;user-select:none;touch-action:none}.image-container img{max-width:none;max-height:none;user-select:none}.handle{position:absolute;background-color:#57c27a;border:2px solid #fff;border-radius:50%;z-index:30;pointer-events:auto;width:18px;height:18px}.side-handle{position:absolute;background-color:#57c27a;border:1px solid #fff;pointer-events:auto;z-index:30;width:30px;height:30px}.handle-tl{top:0;left:0;cursor:nw-resize;transform:translate(-50%,-50%)}.handle-tr{top:0;right:0;cursor:ne-resize;transform:translate(50%,-50%)}.handle-bl{bottom:0;left:0;cursor:sw-resize;transform:translate(-50%,50%)}.handle-br{bottom:0;right:0;cursor:se-resize;transform:translate(50%,50%)}.handle-top{top:0;left:50%;cursor:n-resize;transform:translate(-50%,-50%)}.handle-bottom{bottom:0;left:50%;cursor:s-resize;transform:translate(-50%,50%)}.handle-left{left:0;top:50%;cursor:w-resize;transform:translate(-50%,-50%)}.handle-right{right:0;top:50%;cursor:e-resize;transform:translate(50%,-50%)}.ratio-btn.active,.resolution-btn.active{background-color:#57c27a;color:#fff}.format-selector{position:relative;display:inline-block;background-color:#212326;border-radius:20px;padding:4px}.format-selector input[type=radio]{display:none}.format-selector label{display:inline-block;padding:8px 16px;cursor:pointer;border-radius:16px;transition:.3s}.format-selector input[type=radio]:checked+label{background-color:#57c27a;color:#fff}.snap-side{position:absolute;background-color:rgba(87,194,122,.5);z-index:4;pointer-events:none}.snap-toggle{display:flex;align-items:center;gap:8px}.snap-toggle .toggle-switch{position:relative;display:inline-block;width:48px;height:24px}.snap-toggle .toggle-switch input{opacity:0;width:0;height:0}.snap-toggle .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#2d3033;transition:.4s;border-radius:24px;border:1px solid #57c27a}.snap-toggle .slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:2px;background-color:#57c27a;transition:.4s;border-radius:50%}.snap-toggle input:checked+.slider{background-color:#57c27a}.snap-toggle input:checked+.slider:before{transform:translateX(22px);background-color:#fff}.quality-slider{width:100%;height:6px;-webkit-appearance:none;appearance:none;background:#2d3033;outline:0;border:1px solid #57c27a;border-radius:3px}.quality-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#57c27a;cursor:pointer;border-radius:50%;border:2px solid #fff}.quality-slider::-moz-range-thumb{width:18px;height:18px;background:#57c27a;cursor:pointer;border-radius:50%;border:2px solid #fff}.help-link{color:#f0ca81;text-decoration:none;font-size:16px;margin-top:10px;display:block;opacity:1;transition:opacity .3s;font-weight:400}.help-link:hover{opacity:.8;text-decoration:underline}