.hero-playground-card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}.hero-name-input{transition:border-color .25s,box-shadow .25s}.hero-name-input:focus-visible{border-color:#ff5c35;box-shadow:0 0 0 3px #ff5c3520}.hero-swatch>span{transition:transform .25s}.hero-make-button{transition:transform .25s,box-shadow .25s,background-color .25s}.hero-make-button svg{transition:transform .25s}.hero-make-button:focus-visible{outline-offset:4px;outline:3px solid #181817}[data-bounce=true]{animation:.55s cubic-bezier(.2,.8,.2,1) hero-soft-bounce}@keyframes hero-soft-bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-6px)}70%{transform:translateY(1px)}}@media (hover:hover) and (pointer:fine){.hero-playground-card:hover{transform:translateY(-4px);box-shadow:0 24px 50px #1818171c}.hero-swatch:hover>span{transform:translateY(-2px)}.hero-make-button:hover{background-color:#ed502e;transform:translateY(-2px);box-shadow:0 6px 18px #ff5c3528}.hero-make-button:hover svg{transform:translate(2px,-2px)}}@media (prefers-reduced-motion:reduce){.hero-playground-card,.hero-name-input,.hero-swatch>span,.hero-make-button,.hero-make-button svg{transition:none!important;transform:none!important}[data-bounce=true]{animation:none!important}}