:root{--col-black: #000;--col-charcoal: #333;--col-grey-dark: #888;--col-grey: #aaa;--col-grey-light: #ccc;--col-cloud: #eee;--col-white: #fff;--col-green: #6a994e;--col-hatchd-red: #c73d2d;--font-main: Rubik, Arial, Helvetica, sans-serif;--font-mono: monospace;--box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, .14), 0px 3px 1px -2px rgba(0, 0, 0, .12), 0px 1px 5px 0px rgba(0, 0, 0, .2);--border-thick: 4px solid;--border-medium: 2px solid;--border-thin: 1px solid;--font-size-s: .8rem;--font-size-r: 1rem;--font-size-m: 1.5rem;--font-size-ml: 1.75rem;--font-size-l: 2rem;--font-size-xl: 2.5rem;--space-xt: .25rem;--space-t: .5rem;--space-s: .75rem;--space-m: 1rem;--space-ml: 1.5rem;--space-l: 2rem;--space-xl: 3rem}.header-hatchd-logo{width:48px;top:1rem;left:1rem;opacity:1;display:block}@media screen and (min-width: 640px){.header-hatchd-logo{width:72px;height:auto}}.header-hatchd-logo>a{text-decoration:none;border:none}.site-header{display:flex;width:100%;justify-content:center;height:calc(69px + var(--space-m));border-bottom:var(--border-medium) var(--col-cloud)}@media screen and (min-width: 640px){.site-header{height:calc(110px + var(--space-m))}}.site-header.menu-active .header-hatchd-logo{z-index:-1}.site-header .logo-and-title{display:flex;align-items:center;flex-direction:row;gap:var(--space-m);margin-left:var(--space-ml);width:100%}.site-header .logo-and-title>h1{margin:0;text-transform:uppercase;font-size:var(--font-size-r)}@media screen and (min-width: 480px){.site-header .logo-and-title>h1{font-size:var(--font-size-ml)}}.page-header{padding-top:var(--space-m);width:100%;margin-top:var(--space-m);margin-bottom:var(--space-ml)}@media screen and (min-width: 640px){.page-header{margin:5rem 0}}.page-header .heading{margin:0 0 var(--space-m);font-size:3rem}@media screen and (max-width: 640px){.page-header .heading{font-size:var(--font-size-l)}}.page-header span{width:100%;display:block;margin-top:var(--space-t)}.page-header small{font-size:1rem}.page-header a{border:none}.page-header a svg{height:12px;width:auto}.page-header--has-page-nav{display:grid;grid-template-columns:1fr max-content}@media screen and (max-width: 640px){.page-header--has-page-nav{display:flex;flex-direction:column;align-items:center}}.page-header--has-page-nav .heading{grid-row:1;margin-bottom:0}@media screen and (max-width: 640px){.page-header--has-page-nav .heading+*{margin-top:var(--space-m)}}.page-header--has-page-nav>span+.page-nav-arrows{margin-top:var(--space-l)}@media screen and (min-width: 640px){.page-header--has-page-nav>span{grid-row:2}.page-header--has-page-nav>span+.page-nav-arrows{grid-row:1}}.page-header .page-nav-arrows{grid-column:2;align-self:center}.page-header .page-nav-arrows .button{display:inline-block;width:24px;height:24px;background-repeat:no-repeat;background-image:url(forward-arrow-black.svg);background-size:contain}@media screen and (min-width: 640px){.page-header .page-nav-arrows .button{width:32px;height:32px}}.page-header .page-nav-arrows .button:hover{opacity:.3}.page-header .page-nav-arrows .button+.button{margin-left:var(--space-m)}.page-header .page-nav-arrows .button--prev{transform:rotate(180deg)}@font-face{font-family:Rubik;src:url(rubik.ttf) format("truetype")}*,:before,:after{box-sizing:border-box}html,body{padding:0;margin:0;min-height:100vh;overflow-x:hidden}body,main{display:flex;flex-direction:column;align-items:center}body{font-family:var(--font-main);font-size:18px;color:var(--col-black);background-color:var(--col-white);padding:0 0 var(--space-m)}body.dark-mode{background-color:#333;color:#ddd}body.dark-mode .dataOutput__item{border-color:#ddd}body:not(.dark-mode){color:var(--col-black)}body:not(.dark-mode) .dataOutput__item{border-color:var(--col-black)}h1,h2,h3,h4{font-family:var(--font-main);font-weight:600}main{max-width:1280px;width:100%;padding:0 var(--space-m) var(--space-m);margin:0 auto;position:relative}img{max-width:100%;height:auto}img[src*=".svg"]{width:100%}p{margin:0}figure{margin:0}blockquote{background-color:var(--col-cloud)}button{font-size:var(--font-size-r);outline:none!important}a{text-decoration:none;transition:.2s linear;border-bottom:var(--border-thin) var(--col-black)}a:link,a:visited,a:active{color:var(--col-black)}a:hover,a:focus{color:var(--col-hatchd-red);border-bottom-color:transparent}code{font-family:var(--font-mono)}code.code{background-color:#f5f5f5;padding:.2em .35em}code.code a{color:var(--col-black);text-decoration:underline}code.code a:hover{text-decoration:none}section h1{font-size:var(--font-size-m)}.heading{font-size:var(--font-size-xl);margin:var(--space-l) 0 5rem}.heading .small-text{display:block;width:100%;font-size:.5em}.button,.input,.notify{border:var(--border-medium) var(--col-black);background-color:transparent}.button,.label{text-transform:uppercase;font-weight:700;letter-spacing:.05em}.button{padding:var(--space-t) var(--space-m);cursor:pointer;transition:all .2s linear;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:var(--font-size-s)}.button:not(.button--filled):hover{border-color:var(--col-grey-dark);color:var(--col-grey-dark)}.button:not(.button--filled):active{border-color:var(--col-black);color:var(--col-black)}.button:not(.button--filled):disabled{border-color:var(--col-grey-light);color:var(--col-grey-light);cursor:default}.button:not(.button--filled):disabled:hover,.button:not(.button--filled):disabled:active{border-color:var(--col-grey-light);color:var(--col-grey-light)}.button--filled{border-color:var(--col-black);background-color:var(--col-black);color:var(--col-white)!important}.button--filled:hover{border-color:var(--col-hatchd-red);background-color:var(--col-hatchd-red);color:var(--col-white)}.button--filled:disabled{border-color:var(--col-grey-dark);background-color:var(--col-grey-dark);color:var(--col-grey-light);cursor:default}.button--filled:disabled:hover,.button--filled:disabled:active{border-color:var(--col-grey-dark);background-color:var(--col-grey-dark);color:var(--col-grey-light)}.button[data-payment=google]{display:inline-flex;align-items:center;justify-content:center;min-width:150px}.button[data-payment=google] img{width:100%;height:auto;max-width:54px}.button[data-payment=google]:disabled img{opacity:.5}.input-wrap{display:flex;flex-direction:row;align-items:center;gap:var(--space-m)}.input-wrap label{min-width:80px}.input-wrap>[class*=input]{flex:1}.label{font-size:var(--font-size-s)}.input{background-color:transparent;border:var(--border-medium) var(--col-charcoal);padding:var(--space-t) var(--space-m);font-size:var(--font-size-r);outline:0;font-size:var(--font-size-s);border-radius:6px}.input:not([type=file]):not(select):read-only{border-color:var(--col-grey)!important;background-color:var(--col-cloud);color:var(--col-grey-dark)}.bordered-box{border:var(--border-thick) var(--col-black);padding:var(--space-m)}.notice{position:absolute;top:0;left:0;font-weight:700;width:100%;text-align:center;padding:var(--space-m);z-index:-1;opacity:0;transition:opacity .25s linear}.notice--start,.notice--winner,.notice--success{z-index:1;opacity:1}.notice--start,.notice--success{background-color:#a4f0c8}.notice--winner{background-color:#4007b1;color:var(--col-white)}.hide-if-installed{display:inline-flex}@media (display-mode: standalone){.hide-if-installed{display:none}}.show-if-installed{display:none}@media (display-mode: standalone){.show-if-installed{display:block}}.notify{position:absolute;top:4.5rem;right:var(--space-m);z-index:2;display:flex;flex-direction:row;padding:var(--space-s);align-items:center;justify-content:center;overflow:hidden;border-radius:.5rem;background-color:var(--col-white);box-shadow:var(--box-shadow)}.notify:not(.notify--active){display:none}.notify--success{--color: #6a994e;border-color:var(--color);color:var(--color)}.notify--success .notify__text{color:var(--color)}.notify__text{font-size:var(--font-size-s)}.notify__icon{margin:0;display:inline-flex}.notify__icon:not(.notify__icon--active){display:none}.notify__icon--has-sibling{margin-left:var(--space-t)}.notify__icon>svg{width:24px;height:24px}.demo-spiel{width:100%;margin-bottom:4rem;text-align:left}.site-banner{position:fixed;z-index:99;bottom:0;left:0;width:100%;background:var(--col-black);color:var(--col-white);padding:var(--space-m)}.site-banner__content{width:100%;display:flex;justify-content:center;align-items:center}.site-banner__content .button{border-color:var(--col-white);color:var(--col-white)}.site-banner__content>*+*{margin-left:var(--space-t)}.section-nav{display:flex;justify-content:space-evenly;width:100%;border-bottom:var(--border-medium) var(--col-black)}@media screen and (max-width: 480px){.section-nav{flex-wrap:wrap}}.section-nav__button{background-color:transparent;border:0!important;box-shadow:none;cursor:pointer;padding:var(--space-t) var(--space-m);font-weight:600;text-transform:uppercase;letter-spacing:.05em;transition:color .2s linear;color:var(--col-grey-dark);border-radius:0;font-family:var(--font-main);font-size:var(--font-size-r)}@media screen and (max-width: 760px){.section-nav__button{font-size:var(--font-size-s)}}.section-nav__button--active{color:var(--col-black)}.sections{position:relative;width:100%;margin-top:var(--space-l)}.section{position:absolute;left:0;width:100%}.section:not(.section--active){display:none;opacity:0;z-index:-1}.section__spiel+*{margin-top:var(--space-m)}@media screen and (min-width: 480px){.section__inner,.section__spiel{padding:0 var(--space-l)}}#demo{padding-bottom:var(--space-m)}#tech-info{width:100%;background-color:var(--col-white);width:100vw;padding:0 var(--space-m);left:-1rem}#tech-info>*+*{margin-top:1em}#tech-info li{line-height:1.5}#tech-info hr{margin:var(--space-l) 0;border-top:var(--border-thin) var(--col-grey-light)}#tech-info pre{overflow-x:auto}.toggle-menu{display:none;background-color:transparent;border:none;box-shadow:none;cursor:pointer;padding:var(--space-t);transition:background-color .3s ease-in-out;display:block;position:absolute;z-index:100;top:calc(.125rem + var(--space-m));right:var(--space-ml)}@media screen and (min-width: 640px){.toggle-menu{top:calc(.5rem + var(--space-l))}}.toggle-menu.active{background-color:transparent;position:fixed}.toggle-menu.active>.toggle-menu__line{background-color:var(--col-white)}.toggle-menu .toggle-menu__line{width:30px;height:3px;background-color:var(--col-black);display:block;margin:5px auto;transition:all .3s ease-in-out}.toggle-menu.active .toggle-menu__line:nth-child(1){opacity:0;transform:translate(-100%)}.toggle-menu.active .toggle-menu__line:nth-child(3){opacity:0;transform:translate(100%)}.menu{background-color:var(--col-hatchd-red);width:100vw;text-align:center;padding:132px var(--space-l) var(--space-m);font-size:var(--font-size-s);line-height:2;display:flex;flex-direction:column;gap:var(--space-t);align-items:center;justify-content:center;height:100vh;position:fixed;top:0;left:0;z-index:100;transform:translate(100vw);transition:transform .5s ease-in-out}.menu.active{transform:translate(0)}.menu.hide{display:none}.menu__inner{max-width:1440px;width:100%;margin:-200px 0 0}@media screen and (max-width: 960px){.menu__inner{height:100%}}.menu__list{display:grid;width:100%;height:100%;grid-template-columns:minmax(0,1fr);gap:var(--space-xt) 4rem;list-style:none;padding:0;overflow-y:auto}@media screen and (min-width: 960px){.menu__list{grid-template-columns:repeat(2,minmax(0,1fr))}}.menu h2{grid-column:1/-1;color:var(--col-white);text-align:left;font-size:2.25rem;text-transform:uppercase;margin:0 0 var(--space-m);line-height:normal}@media screen and (min-width: 960px){.menu h2{font-size:4rem}}.menu li{text-align:left}.menu a{font-family:var(--font-main);font-size:var(--font-size-m);line-height:normal;font-weight:600;color:var(--col-white);text-transform:uppercase;letter-spacing:.05em;border-bottom-color:transparent;border-bottom-width:2px;transition:all .2s linear}@media screen and (max-width: 640px){.menu a{font-size:var(--font-size-r)}}.menu a:link,.menu a:visited{color:var(--col-white)}.menu a.current{border-bottom-color:var(--col-white)!important}.menu .logout-button-item{display:flex;justify-content:center;grid-column:1/-1;margin-top:var(--space-l);padding-top:var(--space-m);border-top:var(--border-medium) #b23728}.menu .logout-button{border-color:var(--col-white);color:var(--col-white);grid-column:1/-1}@keyframes slide-in-right{0%{transform:translate(100vw);opacity:0}to{-webkit-transform:translateX(0);transform:translate(0);opacity:1}}@keyframes slide-in-left{0%{transform:translate(100vw);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slide-in-left{0%{transform:translate(-100vw);opacity:0}to{transform:translate(0);opacity:1}}.page-home{justify-content:center;align-items:flex-start;flex:1}.page-home .introduction{display:flex;flex-direction:column;position:relative;margin-top:1rem}@media screen and (min-width: 960px){.page-home .introduction{padding-left:var(--space-l)}}@media screen and (min-height: 670px){.page-home .introduction{margin-top:-6rem}}.page-home .heading{text-transform:uppercase;margin:var(--space-l) 0 var(--space-ml);text-align:left;font-size:4rem}@media screen and (max-width: 960px){.page-home .heading{text-align:center}}@media screen and (max-width: 640px){.page-home .heading{text-align:center;font-size:var(--font-size-xl);margin:0 0 0var --space-s}}.page-home .hatchd-logo{border:none;margin-bottom:0;display:flex}@media screen and (max-width: 960px){.page-home .hatchd-logo{justify-content:center}}.page-home .hatchd-logo>img{max-width:175px}@media screen and (max-width: 640px){.page-home .hatchd-logo>img{max-width:125px}}.page-home .spiel{line-height:normal;font-size:var(--font-size-l);max-width:865px;text-wrap:balance;font-weight:400;font-style:normal}.page-home .spiel>small{display:block;margin-top:var(--space-m);font-size:.65em}@media screen and (max-width: 960px){.page-home .spiel{text-align:center;font-size:var(--font-size-ml)}}@media screen and (max-width: 640px){.page-home .spiel{text-align:center;font-size:1.25rem}}.page-home .button{margin-top:var(--space-ml);font-size:var(--font-size-m);font-weight:600;width:fit-content;display:inline-flex;background-color:var(--col-hatchd-red);align-items:center;border-color:var(--col-hatchd-red)}@media screen and (max-width: 960px){.page-home .button{align-self:center}}@media screen and (max-width: 640px){.page-home .button{font-size:var(--font-size-r)}}.page-home .button:hover{background-color:var(--col-black);border-color:var(--col-black)}.page-home .button>img{width:32px;height:auto;margin-left:.25em}@media screen and (max-width: 640px){.page-home .button>img{width:20px}}.button--wide{width:100%}.section--images .section__inner{display:flex;flex-direction:column;gap:var(--space-l);align-items:baseline;margin-top:var(--space-l)}@media screen and (min-width: 720px){.section--images .section__inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}}.section--video .section__inner{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:var(--space-l)}.section--video .video-detect__video{width:100%;max-width:720px;border:var(--border-thick) var(--col-black);background-color:var(--col-white)}.barcodes{position:relative;width:100%}.barcodes__item{padding:var(--space-m);width:100%;background-color:var(--col-white);box-shadow:var(--box-shadow)}.barcodes__uploadSubmit{margin-top:var(--space-m)}.result{display:block;width:100%;margin-top:var(--space-m);padding-top:var(--space-m);border-top:var(--border-thin) var(--col-grey-light);font-size:var(--font-size-r)}.result>*+.result__heading{margin-top:var(--space-m)}.result__heading{font-size:var(--font-size-r);margin:0 0 1rem}.result__stringOutput{background-color:var(--col-cloud);padding:var(--space-m);white-space:pre-wrap;word-wrap:break-word}.is-installed .barcodes__item--upload,.is-offline .barcodes__item--upload{display:none}.page-eyedropper #demo{display:flex;flex-direction:column;align-items:center}.page-eyedropper .sample-image{border:var(--border-thick) var(--col-black);margin-bottom:var(--space-l)}.page-eyedropper .sample-image>img{max-width:480px;width:100%;display:block}.page-eyedropper .eyedropper-buttons{display:flex;flex-direction:row}.page-eyedropper .eyedropper-buttons>*+*{margin-left:var(--space-m)}.page-eyedropper .eyedropper-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-m);margin-top:var(--space-l);width:80%}.page-eyedropper .eyedropper-palette>p{grid-column:1/-1;grid-row:1}.page-eyedropper .eyedropper-palette--has-colors{border-top:var(--border-thin) var(--col-grey-light);padding-top:var(--space-l)}.page-eyedropper .eyedropper-palette__square{padding:var(--space-t);text-align:center;border-radius:var(--space-xt);border:var(--border-thin) var(--col-grey-light)}.page-facedetect .video-detect{border:var(--border-thick) var(--col-black);position:relative;max-width:720px;width:100%;aspect-ratio:1/.75;overflow:hidden}.page-facedetect .video-detect--item-detected>*{position:absolute;top:0;left:0}.page-facedetect .video-detect--item-detected .video-detect__overlay{z-index:1}.page-facedetect .video-detect--item-detected .video-detect__overlay>*{position:absolute;border:var(--border-medium) red}.page-facedetect .video-detect__video{border:none!important;height:auto}.page-facedetect #reset-video{position:relative;z-index:1;margin-top:var(--space-m)}.page-gamepad #demo{display:flex;flex-direction:column;align-items:center}.page-gamepad .notice{top:calc(1rem + 4px);left:4px;width:calc(100% - 8px)}.page-gamepad .notice .restart{width:100%;text-align:center;margin-top:var(--space-m)}.page-gamepad .notice .restart__button{background-color:transparent;border:var(--border-medium) var(--col-white);padding:var(--space-t);text-transform:uppercase;letter-spacing:.05em;color:var(--col-white);cursor:pointer;font-weight:700}.page-gamepad .info{position:absolute;right:5rem;top:6rem;max-width:480px;padding:var(--space-m);border:var(--border-thick) var(--col-black)}.page-gamepad .info>*+*{margin-top:var(--space-m)}.page-gamepad .game{--game-width: 1280px;--game-height: 600px;position:relative;margin-top:var(--space-m);display:block;max-width:var(--game-width);width:100%;height:var(--game-height);border:var(--border-thick) var(--col-black)}.page-gamepad .avatar{width:64px;height:64px;position:absolute;left:150px;top:150px;transition:left .1s linear,top .1s linear,width .3s ease-out,height .3s ease-out}.page-gamepad .coffee{width:64px;height:64px;position:absolute;left:400px;top:400px;transition:all .4s linear}.page-indexeddb{--max-width: 480px}.page-indexeddb #demo{display:flex;flex-direction:column;justify-content:center;align-items:center}.page-indexeddb .database-entry,.page-indexeddb .output{width:100%;max-width:var(--max-width)}.page-indexeddb .database-entry>*+*{margin-top:var(--space-m)}.page-indexeddb .database-entry p{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center}.page-indexeddb .output{margin-top:var(--space-l)}.page-indexeddb .data-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 32px;gap:var(--space-m);align-items:center}.page-indexeddb .data-item--headers{border-bottom:var(--border-thin) var(--col-black);margin-bottom:var(--space-m);padding-bottom:var(--space-t)}.page-indexeddb .data-item+.data-item{margin-top:var(--space-m)}.page-indexeddb .data-item__email{word-break:break-all}.page-indexeddb .data-item__delete{display:flex;justify-content:center;align-items:center}.page-indexeddb .button--reset-list{margin-top:var(--space-m)}.section--ink#demo{display:flex;flex-direction:column;align-items:center}.ink-buttons{display:flex;justify-content:center;margin-bottom:var(--space-m)}.ink-buttons>button+button{margin-left:var(--space-m)}.drawingpad{position:relative;display:flex;justify-content:center;width:100%;max-width:600px;aspect-ratio:2/1.25;border:var(--border-thick) var(--col-black)}.drawingpad__overlay{width:100%;height:100%;position:absolute;background-color:#e8e5e5;display:flex;justify-content:center;align-items:center;cursor:pointer}.drawingpad__overlay p{text-transform:uppercase;color:var(--col-grey-dark)}.drawingpad__canvas{width:100%;touch-action:none}.ink-colour-select{display:flex;justify-content:center;margin-top:var(--space-l);gap:var(--space-s)}@media screen and (max-width: 640px){.ink-colour-select{flex-wrap:wrap}}.ink-colour-select>button{display:block;position:relative;width:40px;height:40px;border:var(--border-medium) var(--col-black);border-radius:100%;overflow:hidden;cursor:pointer;transition:all .25s;margin-top:var(--space-t)}.ink-colour-select>button.active{margin-top:-.5rem;box-shadow:#00000040 0 10px 15px,#0000000f 0 0 0 1px}.ink-size-select{display:flex;flex-direction:row;align-items:center;justify-content:center;max-width:600px;width:100%;margin-top:var(--space-ml);padding-top:var(--space-ml);border-top:var(--border-thin) var(--col-cloud);gap:var(--space-s)}@media screen and (max-width: 640px){.ink-size-select{flex-wrap:wrap}}.ink-size-select>button{background-color:transparent;padding:var(--space-t);cursor:pointer;font-size:0;border:none}@media screen and (min-width: 640px){.ink-size-select>button{padding:var(--space-m)}}.ink-size-select>button>span{display:block;background-color:var(--col-black);border-radius:100%;overflow:hidden;transition:all .25s}.ink-size-select>button.active>span{background-color:var(--col-grey-dark)}.ink-size-select__label{margin-right:var(--space-m);display:inline-flex}.page-originfs .upload-and-preview{border:var(--border-medium) var(--col-black);height:fit-content}.page-originfs .upload-and-preview .masonry-item__inner{padding:var(--space-m)}.page-originfs .upload-and-preview:not(.has-preview) .upload-preview{background-color:var(--col-cloud);border:2px dashed var(--col-grey-dark);display:flex;align-items:center;justify-content:center}.page-originfs .upload-and-preview:not(.has-preview) .upload-preview:before{content:"Image preview";display:block;position:absolute;z-index:0;color:var(--col-grey-dark)}.page-originfs .upload-and-preview:not(.has-preview) .upload-preview__text{display:none}.page-originfs .upload-and-preview .upload-preview{position:relative;width:100%;height:auto;margin-bottom:var(--space-t)}.page-originfs .upload-and-preview .upload-preview>canvas{position:relative;z-index:1;width:100%;max-height:auto}.page-originfs .upload-and-preview .upload-preview__text{font-size:.8em;margin:var(--space-t) 0}.page-originfs .upload-and-preview .upload{display:flex;flex-direction:column;gap:var(--space-t)}.page-originfs .gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-rows:0;gap:var(--space-m);opacity:0;transition:opacity .2s linear;margin:var(--space-l) 0 var(--space-m)}.page-originfs .gallery--visible{opacity:1}.page-originfs .gallery__item{position:relative}.page-originfs .gallery__item figure{display:inline-flex;width:100%}.page-originfs .gallery__item figure img{width:100%;object-fit:cover}.page-originfs .gallery__filesize{font-size:.8em;position:absolute;bottom:0;left:0;width:100%;text-align:right;background-color:rgb(var(--col-black),.4);color:var(--col-white);padding:var(--space-xt)}.page-originfs .gallery__remove-button{position:absolute;top:-.5rem;right:-.5rem;z-index:1;cursor:pointer;background-color:var(--col-white);width:24px;height:24px;padding:0;border-radius:50%;border:none;display:inline-flex;justify-content:center;align-items:center}.page-originfs .gallery__remove-button>svg{width:100%;height:auto;pointer-events:none}.page-originfs .masonry-item:not(.upload-and-preview) .masonry-item__inner{display:flex;position:relative}.page-originfs .opfs-filelist__meta label{display:block;width:100%;margin-bottom:var(--space-t)}.page-originfs .opfs-filelist__total-size{margin:var(--space-l) 0 var(--space-m)}.page-originfs .opfs-filelist__list{display:flex;flex-direction:column;gap:var(--space-m)}.page-originfs .opfs-filelist__list .row{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));gap:var(--space-m)}.page-payments .cart-is-empty .products{margin-top:-64px;transition:all .25s ease-in-out}.page-payments .cart-review{display:flex;width:100%;padding-bottom:var(--space-m);margin-bottom:var(--space-m);align-items:center;min-height:40px}@media screen and (max-width: 760px){.page-payments .cart-review{flex-wrap:wrap}}.page-payments .cart-review__meta{display:flex;font-weight:700;min-width:320px;justify-content:flex-end;align-items:center;gap:var(--space-m)}@media screen and (max-width: 760px){.page-payments .cart-review__meta{width:100%;justify-content:center;margin-top:var(--space-m)}}@media screen and (max-width: 480px){.page-payments .cart-review__meta{font-size:.9rem;margin-bottom:var(--space-m);min-width:auto}}.page-payments .cart-review__pay{justify-self:flex-start;display:inline-flex;gap:var(--space-m);width:100%;opacity:1;transition:opacity .25s ease-in-out}@media screen and (max-width: 760px){.page-payments .cart-review__pay{justify-content:center}}@media screen and (max-width: 480px){.page-payments .cart-review__pay{flex-wrap:wrap;gap:var(--space-ml)}}.page-payments .cart-review__pay--hide{opacity:0}.page-payments .cart-review__pay>*{width:100%;min-height:40px;max-height:64px;border-radius:4px}@media screen and (min-width: 480px){.page-payments .cart-review__pay>*{max-width:200px}}.page-payments .cart-review__pay-button{display:flex;flex-direction:column;gap:.5rem}.page-payments .cart-review__pay-button>small{width:100%;text-align:center}.page-payments .products{position:relative;display:grid;grid-template-columns:minmax(0,1fr);margin-bottom:var(--space-l);margin-top:0;gap:var(--space-l)}@media screen and (min-width: 760px){.page-payments .products{grid-template-columns:repeat(3,minmax(0,1fr))!important}}@media screen and (min-width: 480px){.page-payments .products{grid-template-columns:repeat(2,minmax(0,1fr))}}.page-payments .products__item img{width:100%;height:250px;object-fit:cover;object-position:center}@media screen and (min-width: 960px){.page-payments .products__item img{height:400px;object-position:unset}}.page-payments .products__item--middle img{object-position:bottom}.page-payments .products__meta{display:flex;justify-content:space-between;align-items:center}.clear-cart--hide{display:none}.page-pip .bot-image{width:480px;position:fixed;bottom:-280px;left:-280px;transform:rotate(45deg);z-index:-1}@media screen and (max-height: 1000px){.page-pip .bot-image{display:none}}.page-pip #demo{display:flex;flex-direction:column;align-items:center}.page-pip .toggle-window-button{cursor:pointer;max-width:320px;width:100%;margin-top:var(--space-m)}.page-pip .toggle-window-button.active{border-color:var(--col-grey-dark);background-color:var(--col-grey-dark);color:var(--col-grey-light)}.page-pip .toggle-window-button.active:hover{background-color:var(--col-hatchd-red);border-color:var(--col-hatchd-red)}.page-pip .response{width:100%;margin-top:var(--space-xl);position:relative}.page-pip .response__label{background-color:var(--col-white);position:relative;top:-.5rem;left:1rem;padding:var(--space-t) var(--space-m);border-top:var(--border-thick) var(--col-black);border-left:var(--border-thick) var(--col-black);border-right:var(--border-thick) var(--col-black);border-bottom:var(--border-thick) var(--col-white)}.page-pip .response__label:not(.active){opacity:0}.page-pip .response__text{cursor:default;font-family:var(--font-mono);background-color:var(--col-white);padding:var(--space-l) var(--space-m);white-space:pre-line}.pip-window{overflow:hidden}.pip-window .pip-wrap{display:flex;flex-direction:column;justify-content:center;min-height:100vh;position:relative;z-index:1;width:100%;padding:var(--space-m) var(--space-l)}.pip-window .pip-wrap .prompt-input-label{margin-bottom:var(--space-t)}.pip-window .pip-wrap .prompt-input{background-color:var(--col-white);font-size:var(--font-size-r);padding:1em;resize:none}.pip-window .pip-wrap .button{margin-top:var(--space-m)}.page-pwa #demo{display:flex;align-items:center;flex-direction:column}.page-sensors #demo{display:flex;flex-direction:column;align-items:center}.page-sensors .dataOutput{display:flex;justify-content:center;width:100%;max-width:640px}.page-sensors .dataOutput>*+*{margin-top:var(--space-ml)}.page-sensors .dataOutput__item{padding:var(--space-m);border:var(--border-thick);width:100%}.page-sensors .dataOutput__item:not(.visible){display:none}.page-sensors .dataOutput__item h2{margin:0 0 var(--space-s)}.page-sensors .dataOutput__item span{display:inline-flex;text-align:center}.page-sensors .dataOutput__data{overflow-wrap:break-word}.page-sensors .dataOutput__orientation .dataOutput__data>span{line-height:1;width:100%;display:inline-flex}.page-sensors .dataOutput__other{margin-top:var(--space-m)}.page-sensors .messages{margin-top:var(--space-m);background-color:#ddd;line-height:var(--space-ml);text-align:center;width:100%;padding:var(--space-m);max-width:640px}.page-sensors .messages:not(.visible){display:none}.page-visual-processing .ai-demo{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-l)}@media screen and (min-width: 960px){.page-visual-processing .ai-demo{grid-template-columns:360px minmax(0,1fr)}}.page-visual-processing .demo-description{flex-direction:column;margin-bottom:var(--space-m)}.page-visual-processing .demo-description>*+*{margin-top:var(--space-t)}.page-visual-processing .selected-image{width:100%;text-align:center}@media screen and (min-width: 960px){.page-visual-processing .selected-image{grid-row:1}}.page-visual-processing .selected-image__preview{max-width:360px}.page-visual-processing .image-form{margin-top:var(--space-m)}.page-visual-processing .image-form>*+*{margin-top:var(--space-t)}.page-visual-processing .image-form__file{width:100%}@media screen and (min-width: 960px){.page-visual-processing .ai-spiel{grid-row:1}}.page-visual-processing .ai-spiel__text{margin-top:var(--space-l);padding:var(--space-m);font-family:var(--font-mono);background-color:var(--col-cloud);white-space:pre-line}.page-visual-processing .ai-image-data{grid-column:1/-1;padding-top:var(--space-l);border-top:var(--border-medium) var(--col-grey)}@media screen and (min-width: 960px){.page-visual-processing .ai-image-data{grid-row:2}}.page-visual-processing .ai-image-data:not(.active){display:none}.page-visual-processing .ai-image-data table{table-layout:fixed;border:var(--border-medium) var(--col-black)}.page-visual-processing .ai-image-data table th{text-align:left;padding:var(--space-m);vertical-align:top;width:25%;border-bottom:var(--border-medium) var(--col-black)}.page-visual-processing .ai-image-data table th:not(:last-of-type){border-right:var(--border-medium) var(--col-black)}.page-visual-processing .ai-image-data table td{vertical-align:top;padding:var(--space-m);width:25%}.page-visual-processing .ai-image-data table td:not(:last-of-type){border-right:var(--border-medium) var(--col-black)}.page-visual-processing .ai-image-data table td ul,.page-visual-processing .ai-image-data table td ol{margin:0}.voices{margin-bottom:var(--space-l);display:flex;width:100%;justify-content:center;align-items:center}.voices>label{margin-right:var(--space-m)}.voices .input{max-width:320px;width:100%}.info .section__inner{line-height:1.5}.info .section__inner>*{margin:0}.info .section__inner>*+*{margin-top:var(--space-m)}.info .section__inner h4{margin-top:var(--space-l)}.info .section__inner h4+*{margin-top:var(--space-t)}.speechText__output{margin-bottom:var(--space-m);padding:var(--space-t);background-color:var(--col-cloud)}.textSpeech__entry,.textSpeech__note{margin-bottom:var(--space-m)}.textSpeech__input{width:100%;margin-top:var(--space-t)}.speechForm__form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-m)}.speechForm__form p:nth-child(3){grid-column:1/-1}.speechForm__form p{display:flex;flex-direction:column}.speechForm__form p>label{margin-bottom:var(--space-t)}.speechForm__form .form__message{height:200px}.speechForm__button{margin-top:var(--space-m)}.speechForm__notice{margin-bottom:var(--space-m);padding:var(--space-m);text-align:center;background-color:var(--col-cloud)}.speechForm__notice:not(.speechForm__notice--submitted){display:none}.speechOutput{position:absolute;left:50%;transform:translate(-50%);bottom:1rem;z-index:1;padding:var(--space-m);text-align:center;background-color:var(--col-cloud)}.speechOutput:not(.speechOutput--active){display:none}body.authenicated-user .page-webauthn .inner{opacity:0}body.authenicated-user .page-webauthn .content{animation-delay:.4s;position:absolute;top:60px}.page-webauthn .inner{transition:all .2s linear;display:flex;flex-direction:column;align-items:center;width:100%}.page-webauthn .notice{top:77vh;right:1rem;left:auto;max-width:360px}.page-webauthn .register{margin-bottom:var(--space-l);width:100%;max-width:480px}.page-webauthn .register__user{display:flex;flex-direction:column;margin-bottom:var(--space-m)}.page-webauthn .register__label{font-size:var(--font-size-s);margin-bottom:var(--space-t)}.page-webauthn .auth{position:relative;display:flex;flex-direction:row;align-items:center}.page-webauthn .auth__message+button{margin-left:var(--space-t)}.page-webauthn .auth__button{display:inline-flex;flex-direction:row;align-items:center}.page-webauthn .auth__button svg{width:13px;height:auto;margin-left:.5em}.page-webauthn .auth__register-tip{display:none;align-items:center;position:absolute;right:-360px;padding:var(--space-t);background-color:#f0ce94;font-size:var(--font-size-s);font-weight:700}.page-webauthn .auth__register-tip svg{margin-right:.35em}.page-webauthn .auth__register-tip--visible{display:inline-flex}.page-webauthn .content{width:100%;padding-top:var(--space-l);margin-top:8rem;text-align:center;transition:all .5s linear}.page-webauthn .content__restricted{display:none}.page-webauthn .content__restricted--visible{display:block}.page-webauthn .content__welcome{margin-bottom:var(--space-l);font-style:italic}.page-webauthn .content__quote{font-size:var(--font-size-l)}.page-webauthn .content__refresh{margin-top:var(--space-l)}.page-webauthn #tech-info{border-top:var(--border-thin) var(--col-black);margin-top:var(--space-xl);padding-top:var(--space-m)}.login-body{padding:0}.page-login{height:100vh;display:flex;justify-content:center;overflow-y:clip}.page-login__inner{max-width:480px;width:100%}.page-login__error{text-align:center;color:var(--col-hatchd-red);margin-bottom:var(--space-ml);display:none}.page-login__error--visible{display:block}.page-login .page-header{margin:0 0 var(--space-l);padding-top:0}.page-login .page-header .logo{display:flex;justify-content:center;margin-bottom:var(--space-ml)}.page-login .page-header .logo>img{max-width:120px}.page-login .page-header .heading{text-align:center;font-size:var(--font-size-l);text-transform:uppercase}.page-login .login-form{display:flex;flex-direction:column;align-items:flex-end;padding:0 var(--space-m)}.page-login .login-form>p{display:grid;grid-template-columns:repeat(200px,minmax(0,1fr));width:100%}.page-login .login-form>p+p{margin-top:var(--space-m)}.page-login .login-form>p label{display:block;margin-bottom:var(--space-xt)}.page-login .login-form .button{margin-top:var(--space-m)}.page-notifications .notifications-error{color:var(--col-hatchd-red)}.page-notifications .notifications-error--hide{display:none}.page-notifications .notification-wrap{margin-top:var(--space-l);padding-top:var(--space-m);border-top:var(--border-medium) var(--col-cloud)}@media screen and (min-width: 1024px){.page-notifications .notification-wrap{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:var(--space-l)}}.page-notifications .notification-wrap:not(.is-visible){display:none}.page-notifications .notification-wrap hgroup{margin-bottom:var(--space-m)}.page-notifications .notification-wrap hgroup h3{margin-bottom:0}.page-notifications .notification-wrap hgroup h3+p{margin-top:var(--space-s)}.page-notifications .notification-wrap__subscribed-users{display:flex;font-size:var(--font-size-s);align-items:center}.page-notifications .notification-wrap__subscribed-users>strong{margin-left:var(--space-xt)}.page-notifications .notification-wrap__broadcast{padding-bottom:var(--space-m);display:flex;flex-direction:column}.page-notifications .notification-wrap__broadcast-inputs{width:100%;margin-top:var(--space-t)}@media screen and (min-width: 640px) and (max-width: 1024px){.page-notifications .notification-wrap__broadcast-inputs{display:flex;flex-direction:column}}.page-notifications .notification-wrap__broadcast-inputs .required-inputs{display:flex;flex-wrap:wrap}.page-notifications .notification-wrap__broadcast-inputs .optional{width:100%;margin:var(--space-ml) 0 var(--space-t)}.page-notifications .notification-wrap__broadcast-inputs .optional>*{width:100%}.page-notifications .notification-wrap__broadcast-inputs .optional>*+*{margin-top:var(--space-t)}.page-notifications .notification-wrap__broadcast-inputs .optional__heading{font-size:var(--font-size-r);margin:var(--space-m) 0 0}.page-notifications .notification-wrap__broadcast h2{width:100%}.page-notifications .notification-wrap__broadcast label{font-size:var(--font-size-s);min-width:125px}.page-notifications .notification-wrap__broadcast .input--user{width:100%;text-align:center;color:var(--col-black);font-weight:700;text-transform:uppercase}@media screen and (min-width: 480px){.page-notifications .notification-wrap__broadcast .input--user{max-width:125px;margin-right:var(--space-m)}}@media screen and (max-width: 480px){.page-notifications .notification-wrap__broadcast .input--user{margin-bottom:var(--space-t)}}.page-notifications .notification-wrap__broadcast .input--message{flex:1}.page-notifications .notification-wrap__broadcast .input--message.error{border-color:var(--col-hatchd-red)!important}@media screen and (max-width: 1024px){.page-notifications .notification-wrap__history{margin-top:var(--space-m);padding-top:var(--space-m);border-top:var(--border-medium) var(--col-cloud)}}.page-notifications .notification-wrap__history-header{display:flex;align-items:center;gap:var(--space-m)}.page-notifications .history{border:var(--border-medium) var(--col-grey);margin-top:var(--space-t)}.page-notifications .history>p{display:grid;grid-template-columns:100px minmax(0,1fr);gap:var(--space-m);padding:var(--space-m)}.page-notifications .history>p>span:first-child{color:var(--col-grey)}.page-notifications .history>p+p{border-top:1px dashed var(--col-grey)}.page-notifications .history__message{display:block!important}.page-notifications .button--notify-all{width:100%;margin-top:var(--space-t)}@media screen and (min-width: 640px) and (max-width: 1024px){.page-notifications .button--notify-all{max-width:200px;align-self:flex-end}}@media screen and (max-width: 480px){.page-notifications .button--notify-all{width:100%;margin-top:var(--space-t)}}.page-notifications .button__countdown:not(.active){display:none}.page-foodscanner .spiel{margin-bottom:var(--space-l)}.page-foodscanner .container{gap:var(--space-m) 2rem;width:100%}@media screen and (min-width: 760px){.page-foodscanner .container{display:grid;grid-template-columns:280px minmax(0,1fr);grid-template-rows:210px minmax(0,1fr)}}@media screen and (max-width: 760px){.page-foodscanner .container{display:flex;flex-direction:column;align-items:center}}.page-foodscanner .container .under-the-video{max-width:420px}@media screen and (min-width: 760px){.page-foodscanner .container .under-the-video{grid-row:2;grid-column:1;align-self:flex-start}}.page-foodscanner .container .under-the-video>.button{width:100%}@media screen and (max-width: 760px){.page-foodscanner .container .under-the-video>.button{max-width:420px}}.page-foodscanner .container .under-the-video>.button+*{margin-top:var(--space-t)}.page-foodscanner .video-detect{width:100%;max-width:420px;aspect-ratio:1/.75;height:fit-content;position:relative;overflow:hidden;grid-column:1;border:var(--border-thick) var(--col-black)}@media screen and (min-width: 760px){.page-foodscanner .video-detect{max-width:280px}}.page-foodscanner .video-detect>*{position:absolute;top:0;left:0}.page-foodscanner .video-detect__overlay{z-index:1}.page-foodscanner .video-detect__overlay>*{position:absolute;border:var(--border-medium) red}.page-foodscanner .video-detect__label{font-weight:600;font-size:var(--font-size-s);text-transform:uppercase;margin:var(--space-xt) 0 0 var(--space-xt)}.page-foodscanner .video-detect__video{width:100%;height:100%}.page-foodscanner .video-detect__screenshot{max-width:420px;aspect-ratio:1/.75}@media screen and (min-width: 760px){.page-foodscanner .video-detect__screenshot{max-width:280px}}.page-foodscanner .product-list{width:100%}@media screen and (max-width: 760px){.page-foodscanner .product-list{margin-top:var(--space-l)}}.page-foodscanner .product-list>h2{margin:0 0 var(--space-m)}.page-foodscanner .product-list__inner{grid-row:1/span 2;grid-column:2;padding-top:var(--space-m);margin-top:var(--space-m);border-top:var(--border-thin) var(--col-grey)}.page-foodscanner .product-list__message--hide{display:none}.page-foodscanner .product-list__message--error{color:var(--col-hatchd-red)}.page-foodscanner .cart{margin-top:var(--space-m)!important;border:2px dashed var(--col-grey);padding:var(--space-m);width:100%}.page-foodscanner .cart--empty .cart__message-empty{display:flex}.page-foodscanner .cart__title{display:flex;justify-content:space-between}.page-foodscanner .cart__message-empty{display:none;align-items:center;justify-content:center;text-align:center;margin-bottom:var(--space-l)}.page-foodscanner .cart__message-empty>span{margin-left:.35em;display:inline-flex}.page-foodscanner .cart__message-empty>span>svg{width:24px;height:auto}.page-foodscanner .cart__items{margin-top:var(--space-m)}.page-foodscanner .cart__items>ul{padding:0;list-style:none}.page-foodscanner .cart__item{display:flex;justify-content:space-between}.page-foodscanner .cart__item+*{margin-top:var(--space-s)}.page-foodscanner .cart__totalItems{text-align:right}.page-foodscanner .cart__buttons{display:flex;justify-content:end;gap:var(--space-m);margin-top:var(--space-m)}.product-spreadsheet{width:100%;display:none;font-size:var(--font-size-s)}.product-spreadsheet--visible{display:block}.product-spreadsheet td{text-wrap:balance!important}.product-spreadsheet td[data-x="0"]{text-transform:capitalize}.product-spreadsheet .jexcel_content{box-shadow:none!important;max-height:none!important}.product-spreadsheet .readonly{color:inherit!important}.product-spreadsheet .add-to-cart{padding:.15rem;display:inline-flex;border-radius:50%;position:relative;width:24px;height:24px}.product-spreadsheet .add-to-cart:before{content:"";display:block;background-image:url(icons/plus.svg);background-repeat:no-repeat;background-position:center;background-size:18px;position:absolute;width:100%;height:100%;top:0;left:0;opacity:1}.product-spreadsheet .add-to-cart:hover:before{opacity:.7}.product-list-small-screen{display:none}.product-list-small-screen--visible{display:block}.product-list-small-screen>ul{display:flex;flex-direction:column;gap:var(--space-m);list-style:none;padding:0;text-transform:capitalize;align-items:center}.product-list-small-screen li{display:flex;flex-direction:column;gap:var(--space-xt);width:100%}.product-list-small-screen li>div:not(.add-button):not(.productName){display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:var(--space-m)}.product-list-small-screen li>div>span:last-child{text-align:right}.product-list-small-screen li .productName{margin-bottom:var(--space-xt);font-weight:700}.product-list-small-screen li .add-button{display:flex;width:100%;margin-top:var(--space-t)}.product-list-small-screen li .add-button>button{width:100%}.product-list-small-screen li+li{border-top:1px dashed var(--col-grey);padding-top:var(--space-m)}.notify--foodscanner{position:fixed}.page-settings .heading{text-align:center;text-transform:capitalize}.page-settings .heading--sub{font-size:var(--font-size-ml)}.page-settings .wrapper{width:100%;flex-direction:column;align-items:center}.page-settings .settings-group{max-width:680px;width:100%;display:flex;align-items:center;flex-direction:column}.page-settings .settings-group+.settings-group{margin-top:var(--space-xl);padding-top:var(--space-xl);border-top:var(--border-medium) #e5e5e5}.page-settings .settings-group .spiel{margin-bottom:var(--space-m)}.page-settings .settings-group .spiel .heading{margin:0 0 var(--space-m)}.page-settings .sortable-list{list-style:none;padding:0;min-width:400px;margin-top:var(--space-l);width:100%}.page-settings .sortable-list li{padding:.2rem var(--space-t);border:var(--border-medium) var(--col-black);background-color:var(--col-white);font-size:var(--font-size-s)}.page-settings .sortable-list li>div{width:100%;display:inline-flex;justify-content:space-between;align-items:center}.page-settings .sortable-list li[draggable=true]{cursor:pointer}.page-settings .sortable-list li[draggable=true]:hover{background-color:var(--col-cloud)}.page-settings .sortable-list li.active{background-color:var(--col-black);color:var(--col-white)}.page-settings .sortable-list li[data-hide=true]{color:#ddd;border-color:#ddd}.page-settings .sortable-list li[data-hide=true] button>span{background-color:#ddd}.page-settings .sortable-list li[data-hide=true] button>span:hover{background-color:#ddd}.page-settings .sortable-list li button{background-color:transparent;position:relative;border:none;box-shadow:none;cursor:pointer;z-index:1;padding:var(--space-xt)}.page-settings .sortable-list li button>span{display:block;background-color:#a7c957;width:20px;height:20px;border-radius:100%}.page-settings .sortable-list li+li{margin-top:var(--space-m)}