body{font-family:Fuzzy Bubbles,cursive;background-color:#f5f5f5}@font-face{font-family:Fuzzy Bubbles;src:url(/FuzzyBubbles-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}a{color:inherit;text-decoration:underline}a#about{display:block;width:100%;font-size:12px;margin:16px;text-align:left;text-decoration:none;color:#0009}#container{display:flex;background-color:#fff}form{display:flex;flex-direction:column;align-items:center}form .form-group{display:flex;flex-direction:row;align-items:center;margin-bottom:16px}form .button-group{display:flex;flex-direction:row;gap:16px;width:100%}form label{width:62px;align-self:baseline;text-align:right;margin-right:16px;margin-top:8px;font-size:16px}form input[type=text]{padding:8px 12px;border:none;border-bottom:1px solid rgba(0,0,0,.2);font-size:16px;font-family:inherit}form textarea{width:100%;padding:8px 12px;border:none;border-bottom:1px solid rgba(0,0,0,.2);font-size:16px;font-family:inherit}form button,form a.button{box-sizing:border-box;width:100%;display:inline-block;margin-top:0;padding:8px 16px;background-color:#000000b3;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:16px;font-family:inherit;text-decoration:none;text-align:center}form button:hover{background-color:#000000e6}form button:disabled{background-color:#0003;cursor:progress}form a.hidden,form button.hidden{display:none}#notification{padding:16px;background-color:#000000b3;color:#fff;border-radius:4px;box-shadow:0 4px 8px #0003}#notification.hidden{display:none}#notification.error{background-color:#ff0000b3}#notification.info{background-color:#0000ffb3}dialog{padding:16px;background-color:#fff;border:none;border-radius:4px;box-shadow:0 4px 8px #0003}::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0003}@media (min-width: 768px){body{margin:64px}#container{padding:64px;margin:0 auto;flex-direction:row;align-items:center;width:fit-content;border-radius:8px;box-shadow:0 8px 16px #0000001a}#fold{width:1px;margin:-64px 64px;align-self:stretch;background:#fff;box-shadow:8px 0 8px #0009}#canvas{width:450px;height:450px;padding:32px;margin:-32px;border-radius:6px}#canvas.vibrate-right{animation:vibrate-right .1s ease-in-out infinite}#canvas.vibrate-left{animation:vibrate-left .1s ease-in-out infinite}#canvas.vibrate-down{animation:vibrate-down .1s ease-in-out infinite}#canvas.vibrate-up{animation:vibrate-up .1s ease-in-out infinite}@keyframes vibrate-right{0%,to{transform:translate(0)}50%{transform:translate(4px)}}@keyframes vibrate-left{0%,to{transform:translate(0)}50%{transform:translate(-4px)}}@keyframes vibrate-down{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}@keyframes vibrate-up{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}form{margin-top:0;width:450px}form .form-group{width:100%;margin-bottom:32px}form input[type=text]{width:calc(100% - 40px)}form .button-group{margin-top:32px}}@media (max-width: 767px){body{margin:0}#container{flex-direction:column;height:100vh}#frame{width:calc(100vw - 32px);height:calc(100vw - 32px);margin:0}#canvas{padding:16px;margin:0}#fold{display:none}form{padding:0;margin:64px 16px;width:calc(100vw - 32px)}form .form-group{width:100%}form input[type=text]{width:calc(100% - 40px)}form button,form a.button{margin-bottom:16px}}
