.paint-canvas-container{background-color:rgb(var(--c-card-background));height:100svh;width:100svw}.paint-canvas-container .paint-canvas-content{align-items:start;display:flex;height:100%;justify-content:start;width:100%}.paint-canvas-container .paint-canvas-content .paint-canvas-header{padding:var(--ax12) var(--ax16);width:100%}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-header{padding:var(--ax16) var(--ax16)}}.paint-canvas-container .paint-canvas-content .paint-canvas-header .paint-canvas-header__title{margin:0}.paint-canvas-container .paint-canvas-content .paint-canvas-timer__wrapper ps-timer{gap:var(--ax12)}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-timer__wrapper ps-timer{left:50%;position:absolute;top:var(--ax13);transform:translate(-50%)}.paint-canvas-container .paint-canvas-content .paint-canvas-timer__wrapper ps-timer .button{height:var(--ax32);min-height:var(--ax32);min-width:unset;width:fit-content}}.paint-canvas-container .paint-canvas-content .paint-canvas-timer__wrapper ps-timer h2{margin:0;min-width:calc(var(--ax)*124)}.paint-canvas-container .paint-canvas-content .paint-canvas-tools{max-width:calc(var(--ax)*150);padding:var(--ax16);width:100%}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-tools{max-width:100%;order:2;padding:var(--ax10);padding-bottom:calc(var(--ax10) + env(safe-area-inset-bottom))}}.paint-canvas-container .paint-canvas-content .paint-canvas-tools h4{color:#7f776b}.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list{gap:var(--ax8);margin-top:var(--ax16)}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list{flex-direction:row;justify-content:start;margin-top:0}}.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list .button{gap:var(--ax12);justify-content:flex-start;padding:var(--ax12) var(--ax16);text-align:left}.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list .button:not(.active){background-color:transparent;border-color:transparent!important;color:rgb(var(--c-secondary-button-text))}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list .button:not(.active){border-color:rgb(var(--c-secondary-button-border))!important}}.paint-canvas-container .paint-canvas-content .paint-canvas-tools__list .button:not(.active):hover{background-color:rgb(var(--c-secondary-button));border-color:rgb(var(--c-secondary-button-border))!important}.paint-canvas-container .paint-canvas-content .paint-canvas-colors{max-width:calc(var(--ax)*150);padding:var(--ax16);width:100%}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-colors{background-color:rgb(var(--c-card-background));border-radius:100px;left:50%;max-width:none;order:1;padding:var(--ax10);position:absolute;top:var(--ax10);transform:translate(-50%);width:fit-content;z-index:1}}.paint-canvas-container .paint-canvas-content .paint-canvas-colors h4{color:#7f776b}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__form{margin-top:var(--ax16)}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-colors__form{margin-top:0}}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__list{display:grid;gap:var(--ax10);grid-template-columns:repeat(3,1fr);list-style:none;margin:0;padding:0}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-colors__list{display:flex;flex-wrap:nowrap;gap:var(--ax8);justify-content:center}}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__item{min-width:var(--ax32)}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__radio{clip:rect(0 0 0 0);block-size:1px;border:0;inline-size:1px;margin:-1px;opacity:0;overflow:hidden;padding:0;position:absolute}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__option{align-items:center;border:4px solid rgba(var(--c-foreground),0);border-radius:50%;cursor:pointer;display:flex;gap:var(--ax10);transition:.3s ease}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__swatch{--size:var(--ax24);background:var(--swatch,#000);block-size:var(--size);border:4px solid rgba(var(--c-foreground),0);border-radius:50%;flex:0 0 auto;inline-size:var(--size);transition:.3s ease}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__label{color:rgb(var(--c-foreground))}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__radio:checked+.paint-canvas-colors__option .paint-canvas-colors__swatch{border:var(--ax4) solid #f4f4f2;transition:.3s ease}.paint-canvas-container .paint-canvas-content .paint-canvas-colors__radio:checked+.paint-canvas-colors__option{border:1px solid #000;transition:.3s ease}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive__wrapper paint-surface{height:100%;position:absolute;width:100%}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive__wrapper paint-surface svg{height:100%;width:100%}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-interactive__wrapper{flex-direction:column}}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive{background-color:rgb(var(--c-background));position:relative}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-interactive{order:1}}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup{-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);background:#0000001a;border-radius:var(--ax6);left:var(--ax24);max-width:187px;opacity:0;padding:var(--ax16);position:absolute;top:var(--ax24);transition:.3s cubic-bezier(.32,.24,.15,1);visibility:hidden;z-index:3}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup{bottom:var(--ax10);left:unset;right:var(--ax16);top:unset}}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup.paint-canvas-warning{z-index:4}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup .paint-canvas-info__image{margin-top:var(--ax10)}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup .paint-canvas-info__image img{border-radius:var(--ax6)}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup p{margin:0}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup.active{opacity:1;transition:.3s cubic-bezier(.32,.24,.15,1);visibility:visible}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup .paint-canvas-popup-close{align-items:center;background-color:#fff;border:1px solid #e3e2de;border-radius:100px;color:#000;cursor:pointer;display:flex;height:var(--ax32);justify-content:center;padding:var(--ax10);position:absolute;right:calc(var(--ax8)*-1);top:calc(var(--ax8)*-1);transition:.3s cubic-bezier(.32,.24,.15,1);width:var(--ax32);z-index:3}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-popup .paint-canvas-popup-close:hover{background-color:#000;color:#fff;transition:.3s cubic-bezier(.32,.24,.15,1)}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-footer{padding:var(--ax24)}@media only screen and (max-width:749px){.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-footer{padding:var(--ax10)}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-footer__buttons{align-items:start;flex-direction:column;gap:var(--ax10)}}.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-footer__buttons__left,.paint-canvas-container .paint-canvas-content .paint-canvas-interactive .paint-canvas-footer__buttons__right{gap:var(--ax12)}.paint-popup-content{opacity:0;position:relative;transition:opacity .25s cubic-bezier(.32,.24,.15,1),visibility 0s linear .25s;visibility:hidden}.paint-popup-content.active{opacity:1;transition:opacity .25s cubic-bezier(.32,.24,.15,1);visibility:visible}.paint-popup-content.closing{opacity:0;transition:opacity .2s cubic-bezier(.32,.24,.15,1),visibility 0s linear .2s;visibility:hidden}