:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#000000de;background-color:beige;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:beige;background-image:linear-gradient(90deg,rgba(0,0,0,.03) 1px,transparent 1px),linear-gradient(rgba(0,0,0,.03) 1px,transparent 1px);background-size:20px 20px}.app__container{width:100%;margin:0 auto;padding:2rem;text-align:center;box-sizing:border-box}.app__title{font-size:2.5em;line-height:1.1;color:#333;margin-bottom:1.5em}.app__content{width:100%;display:flex;flex-direction:row;flex-wrap:wrap;gap:2rem;align-items:flex-start;justify-content:center}.controls{flex:1;min-width:320px;max-width:520px;display:flex;flex-direction:column;gap:1rem}.output{flex:1;min-width:240px;max-width:360px;display:flex;flex-direction:column;gap:1rem}.canvas-container{width:100%;height:auto;aspect-ratio:1 / 1}.canvas-container__canvas{width:100%;object-fit:contain;border:2px solid #ccc;border-radius:50%;box-shadow:0 0 10px #0000001a}.controls__slider{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.controls__label{flex:0 0 80px;text-align:right;color:#444}.controls__range{flex:1}.controls__value{flex:0 0 40px;text-align:left}.controls__file-input{margin-bottom:1rem;padding:.5rem;background-color:#fff;border:1px solid #ccc;border-radius:4px;width:100%;box-sizing:border-box}.controls__file-error{color:red;display:none;margin:0}.controls__download-btn{background-color:#4caf50;border:none;color:#fff;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:4px 2px;cursor:pointer;border-radius:4px;transition:background-color .3s;width:100%}.controls__download-btn:hover{background-color:#45a049}.controls__text{display:flex;align-items:center;gap:.5rem}.controls__text-input{flex:1;padding:.5rem;border:1px solid #ccc;border-radius:4px;font-size:14px}.controls__color-fieldset{border:1px solid #ccc;border-radius:4px;padding:.5rem}.controls__color-legend{padding:0 .5rem;font-size:14px;color:#444}.controls__color-options{display:flex;flex-direction:column;gap:.5rem}.controls__color-option{display:flex;align-items:center}.controls__color-radio{margin:0;opacity:0;width:0;height:0;position:absolute}.controls__color-label{display:flex;align-items:center;gap:.5rem;font-size:14px;color:#444;cursor:pointer}.controls__color-swatch{width:20px;height:20px;border-radius:50%;border:1px solid #ccc}.controls__color-radio:checked+.controls__color-label:after{content:"✔"}.controls__color-picker{width:20px;height:20px;padding:0;border:none;border-radius:50%;cursor:pointer;background:none}.controls__color-picker::-webkit-color-swatch-wrapper{padding:0}.controls__color-picker::-webkit-color-swatch{border:none;border-radius:50%}