.svg-png-tool{color:#17151d;background:radial-gradient(circle at 15% 10%,#401e9712,#0000 28%),radial-gradient(circle at 85% 35%,#6a3fd00f,#0000 30%),#fff;min-height:100vh;padding:120px 7% 100px}.svg-png-hero{text-align:center;max-width:850px;margin:0 auto 70px}.svg-png-hero .section-label{color:#401e97;letter-spacing:.14em;text-transform:uppercase;margin-bottom:18px;font-size:.75rem;font-weight:700;display:inline-block}.svg-png-hero h1{color:#17151d;letter-spacing:-.055em;margin:0;font-size:clamp(3rem,8vw,6.5rem);font-weight:700;line-height:.95}.svg-png-hero p{color:#68636f;max-width:620px;margin:28px auto 0;font-size:1.05rem;line-height:1.7}.svg-png-toolbox{width:min(1100px,100%);margin:0 auto}.svg-upload{text-align:center;cursor:pointer;background:linear-gradient(135deg,#401e9709,#6a3fd004);border:1.5px dashed #401e974d;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;min-height:300px;padding:50px 30px;transition:border-color .3s,background .3s,transform .3s;display:flex;position:relative;overflow:hidden}.svg-upload:before{content:"";pointer-events:none;border:1px solid #401e9714;border-radius:50%;width:260px;height:260px;position:absolute}.svg-upload:after{content:"";pointer-events:none;border:1px solid #401e970f;border-radius:50%;width:170px;height:170px;position:absolute}.svg-upload:hover{background:linear-gradient(135deg,#401e9712,#6a3fd006);border-color:#401e97a6;transform:translateY(-2px)}.svg-upload.has-file{border-style:solid;border-color:#401e9738}.svg-upload-icon{z-index:1;color:#fff;background:#401e97;border-radius:50%;justify-content:center;align-items:center;width:58px;height:58px;margin-bottom:22px;font-size:1.8rem;font-weight:300;display:flex;position:relative;box-shadow:0 12px 35px #401e9733}.svg-upload h2{z-index:1;letter-spacing:-.02em;margin:0;font-size:1.3rem;font-weight:600;position:relative}.svg-upload p{z-index:1;color:#77717e;margin:9px 0 0;font-size:.9rem;position:relative}.svg-png-editor{grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:25px;margin-top:25px;display:grid}.svg-preview-panel{background:#fff;border:1px solid #ebe8ef;border-radius:25px;min-width:0;padding:25px;box-shadow:0 15px 45px #17151d0a}.svg-preview-panel>span,.svg-settings>span{color:#401e97;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;font-size:.72rem;font-weight:700;display:block}.svg-preview{background-color:#f1f0f3;background-image:linear-gradient(45deg,#e4e2e8 25%,#0000 25%),linear-gradient(-45deg,#e4e2e8 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e4e2e8 75%),linear-gradient(-45deg,#0000 75%,#e4e2e8 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px;border-radius:17px;justify-content:center;align-items:center;min-height:500px;padding:40px;display:flex;overflow:hidden}.svg-preview img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:460px;display:block}.svg-settings{background:#fff;border:1px solid #ebe8ef;border-radius:25px;padding:25px;box-shadow:0 15px 45px #17151d0a}.svg-setting-group{margin-bottom:20px}.svg-setting-group label{color:#4f4a56;margin-bottom:8px;font-size:.82rem;font-weight:600;display:block}.svg-setting-group input,.svg-setting-group select{color:#17151d;background:#faf9fb;border:1px solid #ddd9e2;border-radius:12px;outline:none;width:100%;height:48px;padding:0 14px;font-family:inherit;font-size:.92rem;transition:border-color .2s,box-shadow .2s}.svg-setting-group input:focus,.svg-setting-group select:focus{border-color:#401e97;box-shadow:0 0 0 3px #401e9714}.svg-checkbox{color:#57515e;cursor:pointer;align-items:center;gap:10px;margin:5px 0 25px;font-size:.86rem;display:flex}.svg-checkbox input{accent-color:#401e97;cursor:pointer;width:17px;height:17px}.svg-download-button{color:#fff;cursor:pointer;background:#401e97;border:none;border-radius:14px;width:100%;min-height:52px;margin-top:10px;font-family:inherit;font-size:.9rem;font-weight:600;transition:transform .25s,background .25s,box-shadow .25s}.svg-download-button:hover{background:#321778;transform:translateY(-2px);box-shadow:0 12px 28px #401e9733}.svg-download-button:active{transform:translateY(0)}.svg-png-info{text-align:center;border-top:1px solid #ebe8ef;max-width:700px;margin:100px auto 0;padding-top:55px}.svg-png-info h2{color:#401e97;letter-spacing:-.035em;margin:0;font-size:clamp(1.6rem,4vw,2.4rem)}.svg-png-info p{color:#77717e;max-width:550px;margin:15px auto 0;line-height:1.7}@media (max-width:850px){.svg-png-tool{padding:100px 5% 80px}.svg-png-editor{grid-template-columns:1fr}.svg-preview{min-height:400px}}@media (max-width:600px){.svg-png-tool{padding:90px 20px 70px}.svg-png-hero{margin-bottom:50px}.svg-png-hero h1{font-size:clamp(3rem,16vw,5rem)}.svg-png-hero p{font-size:.95rem}.svg-upload{border-radius:22px;min-height:250px;padding:40px 20px}.svg-upload h2{font-size:1.15rem}.svg-png-editor{gap:18px}.svg-preview-panel,.svg-settings{border-radius:20px;padding:18px}.svg-preview{border-radius:14px;min-height:300px;padding:25px}.svg-preview img{max-height:280px}.svg-png-info{margin-top:75px;padding-top:40px}}.svg-editor{background:#fff;border:1px solid #ebe8ef;border-radius:25px;width:100%;overflow:hidden;box-shadow:0 15px 45px #17151d0d}.svg-editor-toolbar{border-bottom:1px solid #ebe8ef;justify-content:space-between;align-items:center;gap:15px;min-height:65px;padding:12px 18px;display:flex}.svg-editor-tools,.svg-editor-actions{align-items:center;gap:7px;display:flex}.svg-tool-button,.svg-action-button{color:#5d5764;cursor:pointer;background:#fff;border:1px solid #e3dfe8;border-radius:10px;min-height:38px;padding:0 15px;font-family:inherit;font-size:.8rem;font-weight:600;transition:background .2s,color .2s,border-color .2s,opacity .2s}.svg-tool-button:hover:not(:disabled),.svg-action-button:hover:not(:disabled){color:#401e97;border-color:#401e97}.svg-tool-button.active{color:#fff;background:#401e97;border-color:#401e97}.svg-tool-button:disabled,.svg-action-button:disabled{cursor:not-allowed;opacity:.4}.svg-editor-canvas{background-color:#f2f1f4;background-image:linear-gradient(45deg,#e5e3e8 25%,#0000 25%),linear-gradient(-45deg,#e5e3e8 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e5e3e8 75%),linear-gradient(-45deg,#0000 75%,#e5e3e8 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px;justify-content:center;align-items:center;min-height:550px;padding:50px;display:flex;position:relative;overflow:auto}.svg-editable{cursor:default;justify-content:center;align-items:center;max-width:100%;max-height:500px;display:flex;position:relative}.svg-editable svg{width:auto;max-width:100%;height:auto;max-height:500px;display:block;overflow:visible}.svg-editable path,.svg-editable circle,.svg-editable rect,.svg-editable ellipse,.svg-editable line,.svg-editable polygon,.svg-editable polyline,.svg-editable text,.svg-editable image,.svg-editable g{cursor:pointer}.svg-editable path:hover,.svg-editable circle:hover,.svg-editable rect:hover,.svg-editable ellipse:hover,.svg-editable line:hover,.svg-editable polygon:hover,.svg-editable polyline:hover,.svg-editable text:hover,.svg-editable image:hover,.svg-editable g:hover{filter:drop-shadow(0 0 3px #401e9773)}.svg-vector-controls{border-top:1px solid #ebe8ef;justify-content:space-between;align-items:center;gap:20px;min-height:72px;padding:15px 20px;display:flex}.svg-vector-controls>div{flex-direction:column;gap:3px;display:flex}.svg-vector-controls strong{color:#27232d;font-size:.85rem;font-weight:650}.svg-vector-controls span{color:#88818f;font-size:.72rem}.svg-delete-button{color:#d20b05;cursor:pointer;background:#ff08000a;border:1px solid #ff080033;border-radius:10px;min-height:40px;padding:0 17px;font-family:inherit;font-size:.78rem;font-weight:600;transition:background .2s,border-color .2s,color .2s,opacity .2s}.svg-delete-button:hover:not(:disabled){color:#fff;background:#ff0800;border-color:#ff0800}.svg-delete-button:disabled{cursor:not-allowed;opacity:.35}@media (max-width:700px){.svg-editor-toolbar{flex-direction:column;align-items:stretch}.svg-editor-tools,.svg-editor-actions{width:100%}.svg-tool-button,.svg-action-button{flex:1}.svg-editor-canvas{min-height:380px;padding:25px}.svg-editor svg{max-height:330px}.svg-vector-controls{flex-direction:column;align-items:stretch}.svg-delete-button{width:100%}}.svg-editor-canvas.crop-active{cursor:crosshair;-webkit-user-select:none;user-select:none}.svg-crop-selection{z-index:20;pointer-events:none;box-sizing:border-box;background:#401e9714;border:2px solid #401e97;position:absolute}.svg-crop-selection:before{content:"";position:absolute;inset:-1px;box-shadow:0 0 0 9999px #17151d47}.svg-crop-selection span{color:#fff;white-space:nowrap;background:#401e97;border-radius:6px;padding:5px 8px;font-size:.68rem;font-weight:600;position:absolute;top:8px;left:8px}.svg-crop-actions{background:#faf9fb;border-top:1px solid #ebe8ef;justify-content:space-between;align-items:center;gap:20px;min-height:60px;padding:12px 20px;display:flex}.svg-crop-actions span{color:#77717e;font-size:.78rem}.svg-crop-actions button:hover{background:#321778;transform:translateY(-1px)}.svg-zoom-controls{background:#fff;border-top:1px solid #ebe8ef;justify-content:center;align-items:center;gap:8px;padding:12px;display:flex}.svg-zoom-controls span{color:#401e97;text-align:center;min-width:55px;font-size:.75rem;font-weight:700}.svg-upload.dragging{background:linear-gradient(135deg,#401e9717,#6a3fd00a);border-color:#401e97;transform:translateY(-3px)scale(1.01)}.svg-editor-canvas{touch-action:none}.svg-editable{transform-origin:50%;flex-shrink:0;transition:transform .2s}.svg-editable svg{width:auto;max-width:none;height:auto;max-height:none}.svg-editable [data-svg-id]{cursor:pointer}.svg-editable [data-svg-id]:hover{filter:drop-shadow(0 0 3px #401e9773)}.svg-zoom-controls{background:#fff;border-top:1px solid #ebe8ef;justify-content:center;align-items:center;gap:8px;min-height:58px;padding:10px 20px;display:flex}.svg-zoom-controls button{color:#5d5764;cursor:pointer;background:#fff;border:1px solid #e3dfe8;border-radius:9px;min-width:38px;height:36px;padding:0 12px;font-family:inherit;font-size:.78rem;font-weight:600;transition:border-color .2s,color .2s,background .2s}.svg-zoom-controls button:hover{color:#401e97;border-color:#401e97}.svg-zoom-controls span{text-align:center;color:#403b47;min-width:58px;font-size:.78rem;font-weight:600}.svg-export-settings{background:#fff;border-top:1px solid #ebe8ef;padding:25px}.svg-export-settings>span{color:#401e97;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;font-size:.72rem;font-weight:700;display:block}.svg-export-fields{grid-template-columns:1fr 1fr;gap:15px;display:grid}.svg-export-settings .svg-setting-group{margin-bottom:18px}.svg-export-settings .svg-download-button{margin-top:5px}.svg-crop-actions button{color:#fff;cursor:pointer;background:#401e97;border:none;border-radius:10px;min-height:40px;padding:0 17px;font-family:inherit;font-size:.78rem;font-weight:600;transition:transform .2s,background .2s,opacity .2s}.svg-crop-actions button:hover:not(:disabled){background:#321778;transform:translateY(-1px)}.svg-crop-actions button:disabled{opacity:.35;cursor:not-allowed}@media (max-width:700px){.svg-export-fields{grid-template-columns:1fr;gap:0}.svg-zoom-controls{flex-wrap:wrap}.svg-crop-actions{flex-direction:column;align-items:stretch}.svg-crop-actions button{width:100%}}