@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');@font-face{font-family:"Balgin Display";font-style:bold;font-weight:900;src:local("Balgin Display"),url("/static/font/balgindisplay-semibold.otf") format("opentype")}:root{--bg:#fff;--bg-80:#f5f4ed;--bg-60:#eae7da;--bg-40:#cecaba;--primary:#fec72f;--primary-110:#ffd971;--primary-80:#f1cf6c;--primary-60:#f9e4a9;--secondary:#000;--danger:#ff5b00;--font-primary:"Balgin Display";--font-secondary:"Montserrat";--font-clr:#000;--font-clr-70:#454545;--font-clr-0:#fff;--app-w:800px}*{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p{margin:0;padding:0}button,select,input,body{font-family:var(--font-secondary);font-size:16px}body{background:var(--bg-80);padding:4vw;height:100svh;max-width:var(--app-w);margin:0 auto}h1,h2,h3,h4,h5,h6{font-family:var(--font-primary)}button,select,input{border:none;transition:.2s;cursor:pointer;padding:10px 20px;font-weight:bold}button.primary{border-radius:50px;background:var(--primary)}button.primary:hover{background:var(--primary-80)}button.secondary,select,input{border-radius:50px;border:2px solid var(--bg-60)}button.secondary,button.btn-select{background:var(--bg)}button.secondary:hover,button.btn-select:hover,button.btn-select.active{background:var(--bg-60)}button.tertiary{border-radius:50px;background:var(--secondary);color:var(--font-clr-0)}select,input{width:100%}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");background-repeat:no-repeat;background-position-x:98%;background-position-y:7px;transition:.3s}select:hover,select:focus{background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 14l5-5 5 5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>")}option:hover{background-color:var(--primary)}body{max-width:500px;padding:2vw 4vw}h1{font-size:8vh}h2{font-size:6vh}h3{font-size:4vh}.subtitle,h2{color:var(--font-clr-70)}.subtitle{margin:15px 0;font-weight:bold}.game-search,.aligned{display:flex;align-items:center;justify-content:center;gap:15px}.btn-selection,.login,body{display:flex;flex-direction:column}.auth-img-wrapper{overflow:hidden;margin:0vh -5vw 10px -5vh}.auth-img-wrapper div{background-size:contain;height:50vh}.auth-img{background-image:url("/static/images/running.svg");background-repeat:no-repeat;min-width:1050px}.login-img{background-repeat:no-repeat;background-image:url("/static/images/dancing.svg");background-position-y:60%}.bottom-aligned{margin-top:auto}.btn-selection{border:2px solid var(--bg-60);border-radius:15px;overflow:hidden;flex-shrink:0}.btn-selection div{border-top:2px solid var(--bg-60)}.btn-select{padding:15px 20px}.login{gap:20px}.divider{position:relative;height:2px;background-color:var(--bg-60)}.divider b{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg-80);padding:0 10px;font-size:14px;color:var(--bg-40);font-weight:600}button img{height:20px}button.email{margin-top:-10px}body.awaiting{max-width:600px;text-align:center}.code{margin:15% 0}.code input{text-align:center;font-size:20px;padding:20px 0;font-weight:bold;-moz-appearance:textfield}.onboarding{display:none;overflow:hidden}.onboarding.active{display:block}.onboarding h3{margin:20px 0 25px 0}.onboarding .description{margin:-20px 0 10px 0}.game-search{margin-bottom:10px}.game-search img{height:20px}.btn-selection#games{height:70%;overflow-y:scroll}#games .btn-select{display:flex;gap:10px;text-align:left;font-size:14px;align-items:center}#games .btn-select img{width:50px;height:50px;object-fit:cover;border-radius:10px}.progress img{height:20px;cursor:pointer}.progress .progress-bar,.progress-indicator{height:10px;border-radius:50px}.progress .progress-bar{width:100%;background:var(--bg-60);position:relative}.progress-indicator{position:absolute;transition:.2s;background:var(--primary)}.step-1 .progress-indicator{width:25%}.step-2 .progress-indicator{width:50%}.step-3 .progress-indicator{width:75%}.step-4 .progress-indicator{width:100%}.bottom-aligned button{width:100%}@media(max-width:500px){.auth-img{background-position-x:-20%}}