.loading[data-v-9a88f8b0]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.menu-items[data-v-9a88f8b0]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:5vmin;background-color:#ccca;width:90%;max-width:600px;font-size:1.5rem;text-align:center;border-radius:4px}.menu .control[data-v-9a88f8b0]{display:flex;flex-direction:column;gap:2rem;justify-content:center;align-items:center}.start-btn[data-v-9a88f8b0]{background-color:hsl(var(--clr-primary-400));border:none;color:#fff;padding-block:.5em;padding-inline:1em;font-family:inherit;font-size:1rem}.start-btn[data-v-9a88f8b0]:hover{background-color:hsl(var(--clr-primary-700))}.header[data-v-9a88f8b0]{position:absolute;top:0;left:50%;display:flex;gap:1rem;padding:12px 6px;align-items:center;justify-content:center;transform:translate(-50%)}.time[data-v-9a88f8b0]{text-align:center;font-size:1.5rem;color:hsl(var(--clr-primary-400))}.settings-backdrop[data-v-9a88f8b0]{position:absolute;inset:0;background-color:hsla(var(--clr-primary-700),.5)}.settings[data-v-9a88f8b0]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:hsla(var(--clr-neutral-200),.5);width:90%;max-width:600px;min-height:50vh}.settings ul[data-v-9a88f8b0]{padding:2rem}.form-control[data-v-9a88f8b0]{padding:6px 12px;font-size:inherit}.fade-enter-active[data-v-9a88f8b0],.fade-leave-active[data-v-9a88f8b0]{transform-origin:50%,50%;transition:all .25s ease-in-out}.fade-enter-from[data-v-9a88f8b0],.fade-leave-to[data-v-9a88f8b0]{transform:translate(-50%,-50%) scale(2);opacity:0}*,*:before,*:after{box-sizing:border-box}:root{--clr-primary-200: 211, 82%, 80%;--clr-primary-400: 211, 82%, 45%;--clr-primary-700: 211, 82%, 20%;--clr-neutral-200: 0, 0%, 90%;--clr-neutral-400: 0, 0%, 60%;--clr-neutral-700: 0, 0%, 33%;--clr-neutral-900: 0, 0%, 20%;--clr-primary-200-hsl: hsl(211, 82%, 80%);--clr-primary-400-hsl: hsl(211, 82%, 45%);--clr-primary-700-hsl: hsl(211, 82%, 20%);--clr-neutral-200-hsl: hsl(0, 0%, 90%);--clr-neutral-400-hsl: hsl(0, 0%, 60%);--clr-neutral-700-hsl: hsl(0, 0%, 33%);--clr-neutral-900-hsl: hsl(0, 0%, 20%)}body{margin:0;font-family:Helvetica,sans-serif;display:flex;justify-content:center;align-items:center;overscroll-behavior-y:none;overflow:hidden;background-color:hsl(var(--clr-neutral-200))}.container{padding:1rem;max-width:1200px;width:100%}.dropzone{margin:0 auto;max-width:400px;aspect-ratio:16/9;background:hsl(var(--clr-neutral-200));border:2px dashed hsl(var(--clr-primary-400));display:flex;justify-content:center;align-items:center;color:hsl(var(--clr-neutral-400))}.dropzone.dragging-over{border-style:solid;background-color:hsl(var(--clr-primary-200))}.dropzone .preview{height:100%;width:100%;position:relative}.dropzone .preview-img{display:block;width:100%;height:100%;object-fit:cover}.dropzone button{display:block;position:absolute;top:0;right:0;transform:translate(50%,-50%);padding:6px;background-color:transparent;border:1px solid red;border-radius:50%}.dropzone .x-icon{display:block;width:2ch;aspect-ratio:1;background-color:red;clip-path:polygon(15% 0,0 15%,35% 50%,0 85%,15% 100%,50% 65%,85% 100%,100% 85%,65% 50%,100% 15%,85% 0,50% 35%)}.input-zone{margin-block:1rem}.actions{display:flex;justify-content:flex-end}.play-btn{background-color:hsl(var(--clr-primary-400));border:none;color:#fff;padding-block:.5em;padding-inline:1em;font-family:inherit;font-size:1rem;margin-left:auto}.play-btn:disabled{opacity:.6}