*,:after,:before{box-sizing:inherit;-webkit-user-select:none}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;padding:0}button{background-color:#d3d3d3;border:none;margin:.1em;padding:1em}.background{background-color:#000;bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;touch-action:none}.bottom-controls{background:linear-gradient(180deg,#0000001a,#000000e6);border-top:1px solid #ffffff1a;bottom:0;box-sizing:border-box;gap:20px;height:80px;left:0;padding:0 20px;position:fixed;right:0;z-index:100}.bottom-controls,.control-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;justify-content:center}.control-btn{background:#ffffff1a;border:2px solid #fff3;border-radius:25px;color:#fff;cursor:pointer;height:50px;transition:all .2s ease;width:50px}.control-btn:hover:not(:disabled){background:#fff3;border-color:#fff6}.control-btn:active:not(:disabled){background:#ffffff4d}.control-btn:disabled{cursor:not-allowed;opacity:.3;transform:none}.color-dropdown-container,.shape-dropdown-container{align-items:center;display:flex;position:relative}.color-dropdown-trigger,.shape-dropdown-trigger{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:2px solid #fff3;border-radius:50px;box-sizing:border-box;color:#fff;cursor:pointer;display:flex;gap:12px;height:50px;justify-content:space-between;min-width:140px;padding:12px 20px;transition:all .2s ease}.shape-dropdown-trigger:hover{background:#fff3;border-color:#fff6}.shape-dropdown-trigger:active{background:#ffffff4d}.color-dropdown-trigger:hover{background:#fff3;border-color:#fff6}.color-dropdown-trigger:active{background:#ffffff4d}.shape-icon{flex-shrink:0;font-size:20px}.shape-name{font-size:14px;font-weight:500;white-space:nowrap}.color-preview{border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;height:24px;width:24px}.color-name{font-size:14px;font-weight:500;white-space:nowrap}.dropdown-arrow{flex-shrink:0;transition:transform .2s ease}.dropdown-arrow.open{transform:rotate(180deg)}.color-dropdown,.shape-dropdown{animation:dropdownFadeIn .2s ease-out;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#000000f2;border:1px solid #fff3;border-radius:12px;bottom:100%;box-shadow:0 8px 32px #0000004d;left:50%;margin-bottom:10px;min-width:160px;padding:8px;position:absolute;transform:translateX(-50%);z-index:200}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}.shape-option{align-items:center;background:#0000;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;gap:12px;padding:10px 12px;text-align:left;transition:all .2s ease;width:100%}.shape-option:hover{background:#ffffff1a}.shape-option.selected{background:#ffffff26}.shape-option .shape-icon{font-size:18px}.shape-option span{font-size:13px;font-weight:500}.color-option{align-items:center;background:#0000;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;gap:12px;padding:10px 12px;text-align:left;transition:all .2s ease;width:100%}.color-option:hover{background:#ffffff1a}.color-option.selected{background:#ffffff26}.color-option .color-preview{height:20px;width:20px}.color-option span{font-size:13px;font-weight:500}.error-message{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ff4444f2;border:1px solid #fff3;border-radius:12px;box-shadow:0 8px 32px #0000004d;gap:12px;left:50%;padding:16px 20px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:1000}.error-message,.error-message button{align-items:center;color:#fff;display:flex}.error-message button{background:none;border:none;border-radius:50%;cursor:pointer;font-size:18px;height:20px;justify-content:center;padding:0;transition:background .2s ease;width:20px}.error-message button:hover{background:#fff3}@media (max-width:768px){.bottom-controls{gap:12px;height:70px;padding:0 12px}.control-btn{height:45px;width:45px}.color-dropdown-trigger,.shape-dropdown-trigger{gap:10px;height:45px;min-width:110px;padding:10px 16px}.shape-icon{font-size:18px}.color-name,.shape-name{font-size:13px}.color-preview{height:20px;width:20px}.color-dropdown,.shape-dropdown{margin-bottom:8px;min-width:140px}.color-dropdown{max-height:200px;overflow-y:auto}.color-option,.shape-option{gap:10px;padding:8px 10px}.shape-option .shape-icon{font-size:16px}.color-option .color-preview{height:18px;width:18px}.color-option span,.shape-option span{font-size:12px}}@media (max-width:640px){.color-name,.shape-name{display:none}.color-dropdown-trigger,.shape-dropdown-trigger{justify-content:center;min-width:50px}}@media (max-width:480px){.bottom-controls{gap:10px;height:65px;padding:0 10px}.control-btn{height:42px;width:42px}.color-dropdown-trigger,.shape-dropdown-trigger{gap:8px;height:42px;min-width:50px;padding:8px 14px}.shape-icon{font-size:16px}.color-preview{height:18px;width:18px}}
/*# sourceMappingURL=main.86a058b4.css.map*/