.visible{display:block}.hidden{display:none}.logo{height:10em;padding:1.5em}.container_fs{display:flex;flex-direction:column;justify-content:center;align-items:center;align-content:center;text-align:center;min-width:1024px;width:100vw;height:100vh;overflow:hidden;background-image:url(/assets/canvas-DMV8j_vS.jpg);background-size:cover;background-position:center;background-repeat:no-repeat}.camera-feed-container{position:relative;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center}.camera-feed-container video,.camera-feed-container canvas{width:100vw;height:100vh;object-fit:cover;display:block}.server-feed-container{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.server-feed-container canvas{width:100vw;height:100vh;object-fit:cover}.instructions{display:grid;grid-template-rows:75vh 25vh;width:100vw;height:100vh;position:absolute;top:0;left:0;pointer-events:none;color:#fff;text-align:center;z-index:10;background:transparent}.full-container{grid-row:1 / span 2;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;background:transparent;pointer-events:auto}.top-row{display:grid;grid-template-columns:33vw 33vw 33vw;pointer-events:auto}.column{display:flex;justify-content:center;align-items:center}.bottom-row{display:flex;justify-content:center;align-items:top;background:transparent}.big-text{font-size:4em;font-weight:500;margin:.5em}@property --progress{syntax: "<percentage>"; initial-value: 0%; inherits: false;}@property --visible{syntax: "<number>"; initial-value: 0; inherits: false;}#progress-circle{transition:right .5s cubic-bezier(.47,1.64,.41,.8),top .5s cubic-bezier(.47,1.64,.41,.8),opacity .1s ease;position:absolute;right:calc(var(--right) - 100px);top:calc(var(--top) - 20%);z-index:1;opacity:var(--visible)}#progress-circle #progress-circle-bar{stroke-dashoffset:var(--strokeDashoffset);stroke-dasharray:var(--strokeDasharray);stroke:var(--progressColor);transition:all .5s linear;stroke-width:16px;stroke-linecap:round;fill:transparent}@property --qr-timeout{syntax: "<percentage>"; initial-value: 100%; inherits: false;}@keyframes qr{0%{--qr-timeout: 100%}to{--qr-timeout: 0%}}#qr-popup.dismissed{bottom:-100%}#qr-popup.active{animation:qr 60s linear}#qr-popup{transition:bottom .5s ease-in-out;position:absolute;bottom:1rem;right:1rem;padding:3px;background:conic-gradient(var(--color-highlight) max(0%,calc(var(--qr-timeout) - 1%)),var(--color-highlight-glow) var(--qr-timeout),rgb(0,0,0) 0deg);border-radius:calc(2em + 3px)}#qr-wrapper{border-radius:2rem;padding:2rem;width:10rem;background-color:#313131}#qr-wrapper img{width:100%}#qr-wrapper #qr-code{aspect-ratio:1/1}#qr-wrapper #download-image{aspect-ratio:16/9}#filter-carousel{position:absolute;bottom:10px;left:50%;transform:translate(-50%);display:flex;padding-bottom:5px;width:90%;height:120px;max-width:1000px;scroll-behavior:smooth;scrollbar-width:none;align-items:center;justify-content:center;gap:20px;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 10%,black 90%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,black 10%,black 90%,transparent 100%)}#filter-carousel img{width:80px;height:80px;border-radius:10px;box-sizing:border-box;transition:all .3s ease;border:solid 2px var(--color-text);opacity:.65;object-fit:cover}#filter-carousel img.selected{width:120px;height:120px;border:solid 4px var(--color-highlight);opacity:1}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(45deg)}}@keyframes wave{0%{rotate:-30deg}to{rotate:30deg}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.7)}to{transform:scale(2.5)}}@keyframes pulse_for_hand_still{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1.6)}}@keyframes swipe{0%{translate:100%;transform:rotateX(0)}40%{transform:rotateX(0)}60%{transform:rotateX(180deg)}90%{opacity:1}to{opacity:0;translate:-100%;transform:rotateX(180deg)}}#two_fingers_icon{animation:4.5s ease-in-out infinite swipe;rotate:90deg;transform-origin:50% 100%;margin-top:90%}#point_left{transform:scaleX(-1);rotate:-90deg;margin-right:1%}#point_right{rotate:90deg;margin-left:1%}#hand{animation:4s ease-in-out infinite wave;transform-origin:50% 100%}#hand_still{animation:4s ease-in-out infinite pulse_for_hand_still;transform-origin:50% 100%}.canvas{width:100%;height:100%;transition:all .5s ease}.canvas.artistic-frame{width:80%;height:auto;border:1rem solid var(--color-highlight);border-radius:1rem;box-shadow:0 0 1rem #00000080;position:absolute;left:5%;top:50%;transform:translateY(-50%)}@property --color-text{syntax: "<color>"; initial-value: rgba(255,255,255,.87); inherits: true;}@property --color-background{syntax: "<color>"; initial-value: #242424; inherits: true;}@property --color-highlight{syntax: "<color>"; initial-value: rgb(112,110,189); inherits: true;}@property --color-highlight-hover{syntax: "<color>"; initial-value: rgb(151,148,240); inherits: true;}@property --color-highlight-glow{syntax: "<color>"; initial-value: rgb(255,0,0); inherits: true;}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--color-text);background-color:var(--color-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%}.html{height:100%;margin:0;padding:0}a{font-weight:500;color:var(--color-highlight);text-decoration:inherit}a:hover{color:var(--color-highlight-hover)}body{background-color:var(--color-background);display:block;margin:0;padding:0;height:100%;overflow:hidden}h1{font-size:3.2em;line-height:1.1}h5{border-bottom:solid 1px #d2d2d2}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#00000040;cursor:pointer;transition:border-color .25s}button:hover{border-color:var(--color-highlight-hover)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{--color-text: #213547;--color-background: #ffffff}a:hover{--color-highlight-hover: #747bff}button{background-color:#ffffff40}}
