:root{--c-primary:#0b0920;--c-primary-light:#221c63;--c-primary-light-1:#1d1b32;--c-primary-light-2:#201f2e;--c-navbar:#151230;--c-secondary:#e6e6e6;--c-secondary-dark:#bfbfbf;--c-secondary-dark-1:#999;--c-secondary-dark-2:gray;--c-secondary-dark-3:#666;--c-accent:#179b95;--c-accent-dark:#14857f;--c-green:#53a343;--c-red:#ff0f0f;--c-highlight:#c7c7ff;--c-dark-square:#4c749a;--c-light-square:#eae9d2}@font-face{font-display:swap;font-family:Geist;font-style:normal;font-weight:400;src:url(/fonts/geist-v5-latin-regular.woff2)format("woff2")}@font-face{font-display:swap;font-family:Geist;font-style:normal;font-weight:500;src:url(/fonts/geist-v5-latin-500.woff2)format("woff2")}@font-face{font-display:swap;font-family:Geist;font-style:normal;font-weight:700;src:url(/fonts/geist-v5-latin-700.woff2)format("woff2")}@font-face{font-display:swap;font-family:Geist;font-style:normal;font-weight:800;src:url(/fonts/geist-v5-latin-800.woff2)format("woff2")}@font-face{font-display:swap;font-family:Geist;font-style:normal;font-weight:900;src:url(/fonts/geist-v5-latin-900.woff2)format("woff2")}*{box-sizing:border-box;margin:0;padding:0}button,input,textarea,select{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}a{color:inherit;text-decoration:none}ul,ol{list-style:none}.home-page{background-color:var(--c-primary);font-family:Geist}.hero-section{background-color:var(--c-primary);height:100dvh;padding:5.5rem 3.75rem 4rem;position:relative;overflow:hidden}.hero-section .hero-container{align-items:center;width:100%;height:100%;display:flex;position:relative}.hero-section .hero-container .main-content{z-index:5;flex-direction:column;gap:1.5rem;display:flex;position:absolute}.hero-section .hero-container .main-content .hero-text{color:var(--c-secondary);flex-direction:column;font-size:5.5rem;font-weight:700;line-height:1;display:flex}.hero-section .hero-container .main-content .hero-text .hide-text{display:inline-block;overflow:hidden}.hero-section .hero-container .main-content .hero-text .bottom{gap:.75rem;display:flex}.hero-section .hero-container .main-content .cta{background-color:var(--c-accent);color:var(--c-secondary);border-radius:.5rem;align-self:flex-start;padding:.75rem 2rem;font-size:1.5rem;font-weight:500}.hero-section .hero-container .main-content .cta:hover{background-color:var(--c-accent-dark);transition:all .2s}.hero-section .hero-container .img-container{z-index:5;justify-content:end;width:45%;display:flex;position:absolute;bottom:0;right:0}.hero-section .hero-container .img-container img{width:100%}.hero-section .gradient{z-index:-1;background-color:var(--c-primary-light);filter:blur(8rem);border-radius:50%;width:1141px;height:1155px;position:absolute;top:50%;left:50%;transform:translate(-25%)}@media (width<=1440px){.hero-section{padding:5.5rem 3.75rem clamp(2rem,8vh - 1rem,4rem)}.hero-section .hero-container .main-content .hero-text{font-size:clamp(4rem,.308rem + 5.769vw,5.5rem)}.hero-section .img-container{width:45%}.hero-section .img-container img{width:100%}}@media (width<=1024px){.hero-section{padding:0 3rem 3rem;overflow:hidden}.hero-section .hero-container .main-content .hero-text{font-size:clamp(3.5rem,.5rem + 6.25vw,4.5rem)}.hero-section .hero-container .main-content .cta{border-radius:.5rem;padding:.75rem 1.5rem;font-size:1.25rem}.hero-section .img-container{width:50%}.hero-section .img-container img{width:100%}}@media (width<=768px){.hero-section{height:100vh;padding:0 2rem;overflow:hidden}.hero-section .hero-container{align-items:center;display:flex}.hero-section .hero-container .main-content .hero-text{font-size:clamp(4rem,2.761rem + 4.665vw,5rem)}.hero-section .hero-container .main-content .hero-text .bottom{flex-direction:column}.hero-section .hero-container .main-content .cta{border-radius:.5rem;padding:.75rem 1rem;font-size:1.25rem}.hero-section .hero-container .img-container{display:none}.hero-section .gradient{z-index:1}}@media (width<=425px){.hero-section{padding:0 .75rem}.hero-section .hero-container{align-items:center;display:flex}.hero-section .hero-container .main-content .hero-text{font-size:clamp(3rem,15.238vw - .048rem,4rem)}.hero-section .hero-container .main-content .hero-text .bottom{flex-direction:column}.hero-section .hero-container .main-content .cta{border-radius:.5rem;padding:.5rem .75rem;font-size:1rem}.hero-section .hero-container .img-container{display:none}.hero-section .gradient{transform:translate(-50%)}}.courses-section{background-color:var(--c-secondary);z-index:20;border-radius:1rem;height:100dvh;padding:9.5rem 3.75rem 4rem;display:flex;position:relative}.courses-section .text-content{width:50%}.courses-section .text-content .bold{font-weight:500}.courses-section .text-content .text{text-wrap:wrap;letter-spacing:-0.3%;font-size:2.5rem;line-height:1.2}.courses-section .text-content .text .wrapper{position:relative}.courses-section .text-content .text .wrapper .ghost-block{background-color:var(--c-secondary-dark-1);border-radius:1rem;width:100%;height:calc(100% - .75rem);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.courses-section .thumbnail-content{flex-direction:column;justify-content:flex-end;align-items:end;width:50%;display:flex}.courses-section .thumbnail-content .wrapper{width:75%}.courses-section .thumbnail-content .wrapper .courseInfo .level{color:var(--c-secondary-dark-3)}.courses-section .thumbnail-content .wrapper .courseInfo .courseTitle{font-size:2.5rem}.courses-section .thumbnail-content .wrapper .card-container{aspect-ratio:16/9;width:100%;position:relative}.courses-section .thumbnail-content .wrapper .card-container .thumbnail-card{background-color:var(--c-primary);border-radius:1rem;width:100%;height:100%;position:absolute;overflow:hidden}.courses-section .thumbnail-content .wrapper .card-container .thumbnail-card img{width:100%;height:100%}.courses-section .thumbnail-content .wrapper .card-container #second-card,.courses-section .thumbnail-content .wrapper .card-container #third-card{top:calc(100% + 4rem)}.courses-section .carousel{display:none}@media (width<=1440px){.courses-section .text-content .text{font-size:clamp(1.75rem,.519rem + 1.923vw,2.25rem)}.courses-section .thumbnail-content .wrapper .courseInfo .level{font-size:clamp(1rem,.385rem + .962vw,1.25rem)}.courses-section .thumbnail-content .wrapper .courseInfo .courseTitle{font-size:clamp(1.75rem,2.885vw - .096rem,2.5rem)}}@media (width<=1024px){.courses-section{padding:8.5rem 3rem 3rem}.courses-section .text-content .text{font-size:clamp(1.25rem,3.125vw - .25rem,1.75rem)}.courses-section .text-content .text .wrapper .ghost-block{border-radius:clamp(.5rem,1.563vw - .25rem,.75rem)}.courses-section .thumbnail-content .wrapper .courseInfo .level{font-size:clamp(.75rem,1.563vw,1rem)}.courses-section .thumbnail-content .wrapper .courseInfo .courseTitle{font-size:clamp(1.5rem,.75rem + 1.563vw,1.75rem)}}@media (width<=768px){.courses-section{border-radius:0;flex-direction:column;gap:4.5rem;height:auto;padding:2rem 0}.courses-section .text-content{width:100%;padding:0 2rem}.courses-section .text-content .text{font-size:clamp(1.5rem,1.19rem + 1.166vw,1.75rem)}.courses-section .text-content .text .wrapper .ghost-block{display:none}.courses-section .thumbnail-content{display:none}.courses-section .carousel{-ms-overflow-style:none;scrollbar-width:none;gap:.75rem;padding:0 2rem;display:flex;overflow-x:auto}.courses-section .carousel .carousel-card{flex-shrink:0}.courses-section .carousel .carousel-card .text-container .level{color:var(--c-secondary-dark-3);font-size:clamp(.75rem,.571rem + .893vw,1rem)}.courses-section .carousel .carousel-card .text-container .title{font-size:clamp(1.5rem,1.321rem + .893vw,1.75rem)}.courses-section .carousel .carousel-card img{aspect-ratio:16/9;border-radius:.5rem;width:60vw;max-width:18.75rem}.courses-section .carousel::-webkit-scrollbar{display:none}}@media (width<=425px){.courses-section{gap:clamp(3.5rem,30.476vw - 2.595rem,5.5rem);padding:2rem 0}.courses-section .text-content{padding:0 .75rem}.courses-section .text-content .text{font-size:clamp(1.25rem,.488rem + 3.81vw,1.5rem)}.courses-section .carousel{padding:0 .75rem}.courses-section .carousel .carousel-card img{width:80vw}}.puzzle-section{background-color:var(--c-primary);height:100dvh;padding:8rem 3.75rem 0;display:flex;overflow:hidden}.puzzle-section .wrapper{width:50%;height:100%}.puzzle-section #first{align-items:center;display:flex}.puzzle-section #first .text-container{color:var(--c-secondary);flex-direction:column;gap:1.5rem;display:flex}.puzzle-section #first .text-container h1{font-size:4rem;line-height:1}.puzzle-section #first .text-container p{color:var(--c-secondary-dark);font-size:1.5rem}.puzzle-section #second{justify-content:center;align-items:center;display:flex}.puzzle-section #second .svg-container{width:80%}.puzzle-section #second .svg-container img{width:100%;height:100%}@media (width<=1440px){.puzzle-section #first .text-container h1{font-size:clamp(3.5rem,2.269rem + 1.923vw,4rem)}.puzzle-section #first .text-container p{font-size:clamp(1.25rem,.635rem + .962vw,1.5rem)}.puzzle-section #second .svg-container{max-width:450px}}@media (width<=1024px){.puzzle-section{padding:0 3rem}.puzzle-section #first .text-container{gap:1rem}.puzzle-section #first .text-container h1{font-size:clamp(2.5rem,1rem + 3.125vw,3rem)}.puzzle-section #first .text-container p{font-size:clamp(1rem,.25rem + 1.563vw,1.25rem)}}@media (width<=768px){.puzzle-section{flex-direction:column;align-items:center;gap:5rem;height:auto;padding:clamp(4rem,1.522rem + 9.329vw,6rem) 2rem}.puzzle-section .wrapper{width:100%}.puzzle-section #first{flex-direction:column;align-items:center;gap:1rem;display:flex}.puzzle-section #first .text-container{text-align:center;gap:.75rem;padding:0 .25rem}.puzzle-section #first .text-container h1{font-size:clamp(2rem,1.38rem + 2.332vw,2.5rem)}.puzzle-section #first .text-container br{display:none}.puzzle-section #first .text-container p{font-size:clamp(1rem,.69rem + 1.166vw,1.25rem)}.puzzle-section #second{width:100%}.puzzle-section #second .svg-container{width:100%;max-width:500px;height:auto}}@media (width<=425px){.puzzle-section{padding:clamp(4rem,.952rem + 15.238vw,5rem) .75rem}.puzzle-section #first .text-container{gap:.5rem;padding:0}.puzzle-section #first .text-container h1{font-size:clamp(1.5rem,7.619vw - .024rem,2rem)}.puzzle-section #first .text-container p{font-size:clamp(.75rem,3.81vw - .012rem,1rem)}}.visualization-section{background-color:var(--c-primary);height:100dvh;position:relative}.visualization-section .text-wrapper{width:100%;height:100%;color:var(--c-secondary);letter-spacing:-1%;justify-content:center;align-items:center;font-size:5.75rem;font-weight:700;display:flex;position:absolute}.visualization-section .body-wrapper{justify-content:center;align-items:end;width:100%;height:100%;padding-top:8rem;display:flex;position:absolute}.visualization-section .body-wrapper .img-container{position:relative}.visualization-section .body-wrapper .img-container img{object-fit:contain}.visualization-section .body-wrapper .img-container .move{color:var(--c-secondary);font-size:4rem;position:absolute}@media (width<=1024px){.visualization-section{display:none}}nav{background-color:var(--c-navbar);z-index:25;width:100%;height:5.5rem;color:var(--c-secondary);border-bottom:1px var(--c-secondary-dark-3) solid;justify-content:space-between;align-items:center;padding:0 3.75rem;font-family:Geist;font-size:1.25rem;display:flex;position:fixed}nav .logo{align-items:center;gap:1rem;font-size:1.5rem;font-weight:500;display:flex;overflow:hidden}nav .logo img{border-radius:.5rem;width:2.5rem;height:2.5rem}nav .buttons-container{gap:1rem;display:flex}nav .buttons-container .back{justify-content:center;align-items:center;padding:.5rem;font-weight:500;display:flex}nav .buttons-container .finish{background-color:var(--c-accent);color:var(--c-secondary);border-radius:.5rem;align-self:flex-start;padding:.5rem 2rem;font-size:1.5rem;font-weight:500;transition:background-color .2s}nav .buttons-container .finish:hover{background-color:var(--c-accent-dark)}nav ul{align-items:center;gap:1rem;display:flex}nav ul li:hover{color:var(--c-secondary-dark-1);transition:color .2s}nav ul .user{background-color:var(--c-accent);color:var(--c-secondary);border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;width:47px;height:47px;font-size:1.5rem;font-weight:500;transition:background-color .2s;display:flex}nav ul .user:hover{background-color:var(--c-accent-dark)}nav ul .lets-go{background-color:var(--c-accent);color:var(--c-secondary);border-radius:.5rem;align-self:flex-start;padding:.5rem 2rem;font-size:1.5rem;font-weight:500;transition:background-color .2s}nav ul .lets-go:hover{background-color:var(--c-accent-dark)}nav .hamburger-menu-btn{display:none}nav .hamburger-menu-btn img{width:1rem;height:1rem}@media (width<=1024px){nav{padding:0 3rem}}@media (width<=768px){nav{padding:0 2rem}nav .logo{gap:.75rem;font-size:1.25rem}nav .logo img{border-radius:6px;width:2rem;height:2rem}nav ul{display:none}nav .hamburger-menu-btn{display:block}}@media (width<=425px){nav{padding:0 .75rem}nav .logo{gap:.5rem;font-size:clamp(1rem,.238rem + 3.81vw,1.25rem)}nav .logo img{border-radius:.25rem;width:1.5rem;height:1.5rem}nav ul{display:none}}.hidden{border-radius:.5rem;height:0;position:absolute;top:6rem;right:0;overflow:hidden}.hidden .dropdown{background-color:var(--c-secondary);color:var(--c-primary);padding:1rem}.hidden .dropdown .wrapper{width:200px}.hidden .dropdown .wrapper .username{padding:.5rem}.hidden .dropdown .wrapper .line{background-color:var(--c-primary-light);width:100%;height:1px;margin-bottom:.5rem}.hidden .dropdown .wrapper button{text-align:start;border-radius:.5rem;align-items:center;gap:.5rem;width:100%;padding:.5rem;transition:all .2s;display:flex}.hidden .dropdown .wrapper button svg{color:#000;transition:all .2s}.hidden .dropdown .wrapper button:hover{background-color:var(--c-red);color:var(--c-secondary)}.hidden .dropdown .wrapper button:hover svg{color:var(--c-secondary)}.hamburger-menu-container{z-index:25;position:fixed;inset:0}.hamburger-menu-container .overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:-webkit-backdrop-filter .1s ease-in,backdrop-filter .1s ease-in;position:absolute;inset:0}.hamburger-menu-container .hamburger-menu{background-color:var(--c-navbar);width:80%;height:100%;color:var(--c-secondary);flex-direction:column;max-width:400px;padding:1.5rem;font-family:Geist;transition:transform .2s ease-in-out;display:flex;position:absolute;right:0;transform:translate(100%)}.hamburger-menu-container .hamburger-menu .close-btn-container{justify-content:flex-end;display:flex}.hamburger-menu-container .hamburger-menu ul{flex-direction:column;flex-grow:1;gap:.5rem;padding:1rem 0;font-size:1.25rem;display:flex}.hamburger-menu-container .hamburger-menu .selected{font-size:2rem;font-weight:500;transition:all .1s ease-in}.hamburger-menu-container .hamburger-menu .signup-redirect{background-color:var(--c-accent);border-radius:.25rem;justify-content:center;padding:.5rem 0;display:flex}.hamburger-menu-container .hamburger-menu .logout-btn{background-color:var(--c-red);border-radius:.25rem;padding:.5rem 0}@media (width>768px){.hamburger-menu-container{display:none}}.loading{background-color:var(--c-primary);justify-content:center;align-items:center;width:100%;height:100dvh;display:flex}.loading .loading-spinner img{animation-name:loading;animation-duration:.5s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes loading{0%{rotate:0deg}to{rotate:360deg}}.accordion{background-color:var(--c-primary-light-1);border:1px solid var(--c-secondary-dark);color:var(--c-secondary);-webkit-user-select:none;user-select:none;border-radius:1rem;flex-direction:column;display:flex}.accordion .card{cursor:pointer;justify-content:space-between;align-items:center;padding:1.5rem 1.75rem;display:flex}.accordion .card .difficulty{align-items:center;gap:1rem;font-size:2rem;display:flex}.accordion .hidden-inner{height:0;padding:0 1.75rem;overflow:hidden}.accordion .hidden-inner .course-cards-container{flex-direction:column;gap:1rem;padding-top:.5rem;padding-bottom:1.75rem;display:flex}.course-card{border:1px solid var(--c-secondary-dark-1);background-color:var(--c-primary-light-2);cursor:pointer;border-radius:1rem;justify-content:space-between;align-items:center;gap:1.25rem;padding:1.25rem;display:flex}.course-card .content{gap:1.25rem;display:flex}.course-card .content img{aspect-ratio:16/9;border-radius:.5rem;height:100px}.course-card .content .text{flex-direction:column;gap:.5rem;display:flex}.course-card .content .text h1{color:var(--c-secondary);font-size:1.5rem;font-weight:500}.course-card .content .text p{color:var(--c-secondary-dark)}.progress-bar{background-color:var(--c-secondary-dark);border:1px solid var(--c-secondary-dark);border-radius:.75rem;width:100%;height:1.25rem}.progress-bar .progress{background-color:var(--c-primary);border-radius:.75rem;width:0%;height:100%}.course-page{background-color:var(--c-primary);color:var(--c-secondary);padding:9rem 3.75rem 1rem;font-family:Geist}.course-page .banner{border-radius:1.25rem;height:22rem;margin-bottom:1.25rem;overflow:hidden}.course-page .banner img{object-fit:cover;width:100%;height:100%}.course-page .main-content{gap:1.25rem;display:flex}.course-page .main-content .course{border-radius:1rem;flex-direction:column;gap:1rem;width:70%;height:100%;display:flex}.course-page .main-content .course-info{background-color:var(--c-primary-light-1);border:1px solid var(--c-secondary-dark);border-radius:1rem;flex-direction:column;gap:1rem;width:30%;height:100%;padding:2rem 1rem;display:flex}.course-page .main-content .course-info h2{font-size:1.5rem;font-weight:400}.course-page .main-content .course-info h3{color:var(--c-secondary-dark);font-size:1.25rem;font-weight:400}.course-page .main-content .course-info .progress-container{flex-direction:column;gap:.75rem;display:flex}.course-page .main-content .course-info .progress-container .progress-info{flex-direction:column;gap:.5rem;display:flex}.course-page .main-content .course-info .progress-container .progress-info .progress-count{color:var(--c-secondary-dark);font-size:1.25rem}.course-page .main-content .course-info .learning-info{flex-direction:column;gap:.75rem;display:flex}.course-page .main-content .course-info .learning-info .levels-info{flex-direction:column;gap:.5rem;display:flex}.course-page .main-content .course-info .learning-info .levels-info ul{list-style:inside}.course-page .main-content .course-info .learning-info .levels-info ul li{color:var(--c-secondary-dark-1)}.course-page .main-content .course-info .learning-info .levels-info div{flex-direction:column;gap:.25rem;display:flex}.course-page .main-content .course-info .badges{flex-direction:column;gap:.75rem;display:flex}.course-page .main-content .course-info .badges .earned{gap:.25rem;display:flex}.watch-course{background-color:var(--c-primary);height:100dvh;padding:8rem 3.75rem 1rem;overflow:hidden}.watch-course iframe{border-width:0;border-radius:1rem;width:100%;height:100%}.signup-page{background-color:var(--c-primary);grid-template-columns:1fr 1fr;gap:1.25rem;height:100dvh;padding:3.75rem;font-family:Geist;display:grid}.signup-page .img-container{border-radius:2rem;overflow:hidden}.signup-page .img-container img{object-fit:cover;width:100%;height:100%}.signup-page .form-container{padding:3rem}.signup-page .form-container .form{color:var(--c-secondary);flex-direction:column;justify-content:center;width:100%;height:100%;display:flex;position:relative}.signup-page .form-container .form .back{cursor:pointer;color:var(--c-secondary-dark);align-items:center;gap:.25rem;transition:color .2s;display:flex;position:absolute;top:0;left:0}.signup-page .form-container .form .back:hover{color:var(--c-secondary-dark-1)}.signup-page .form-container .form h1{font-size:2.25rem}.signup-page .form-container .form .input-container{flex-direction:column;gap:1.25rem;padding-top:2rem;padding-bottom:2.5rem;display:flex}.signup-page .form-container .form .input-container .input-group{flex-direction:column;gap:.5rem;display:flex}.signup-page .form-container .form .input-container .input-group label{color:var(--c-secondary-dark);font-size:1.5rem}.signup-page .form-container .form .input-container .input-group input{background-color:var(--c-secondary);color:var(--c-primary);border-radius:.5rem;padding:1rem}.signup-page .form-container .form .input-container .input-group input::placeholder{color:var(--c-secondary-dark-1)}.signup-page .form-container .form .buttons-container{flex-direction:column;align-items:center;gap:.75rem;font-size:1.5rem;display:flex}.signup-page .form-container .form .buttons-container button{border-radius:.5rem;width:100%;padding:.75rem}.signup-page .form-container .form .buttons-container .signup-button,.signup-page .form-container .form .buttons-container .continue-button{background-color:var(--c-accent);transition:background-color .2s}.signup-page .form-container .form .buttons-container .signup-button:hover,.signup-page .form-container .form .buttons-container .continue-button:hover{background-color:var(--c-accent-dark)}.signup-page .form-container .form .buttons-container .divider{color:var(--c-secondary-dark-1)}.signup-page .form-container .form .buttons-container .guest-button{color:var(--c-secondary-dark);background-color:var(--c-primary-light-2);transition:background-color .2s}.signup-page .form-container .form .buttons-container .guest-button:hover{background-color:var(--c-primary-light-1)}.signup-page .form-container .form .buttons-container .disabled-button{background-color:var(--c-secondary-dark-3);color:var(--c-secondary-dark);cursor:not-allowed}.signup-page .form-container .form .redirect{text-align:center;color:var(--c-secondary-dark-1);padding-top:2rem}.signup-page .form-container .form .redirect a{color:var(--c-accent);text-decoration:underline}.login-page{background-color:var(--c-primary);grid-template-columns:1fr 1fr;gap:1.25rem;height:100dvh;padding:3.75rem;font-family:Geist;display:grid}.login-page .img-container{border-radius:2rem;overflow:hidden}.login-page .img-container img{object-fit:cover;width:100%;height:100%}.login-page .form-container{flex:1;padding:3rem}.login-page .form-container .form{color:var(--c-secondary);flex-direction:column;justify-content:center;width:100%;height:100%;display:flex;position:relative}.login-page .form-container .form .back{cursor:pointer;color:var(--c-secondary-dark);align-items:center;gap:.25rem;display:flex;position:absolute;top:0;left:0}.login-page .form-container .form h1{font-size:2.25rem}.login-page .form-container .form .input-container{flex-direction:column;gap:1.25rem;padding-top:2rem;padding-bottom:2.5rem;display:flex}.login-page .form-container .form .input-container .input-group{flex-direction:column;gap:.5rem;display:flex}.login-page .form-container .form .input-container .input-group label{color:var(--c-secondary-dark);font-size:1.5rem}.login-page .form-container .form .input-container .input-group input{background-color:var(--c-secondary);color:var(--c-primary);border-radius:.5rem;padding:1rem}.login-page .form-container .form .input-container .input-group input::placeholder{color:var(--c-secondary-dark-1)}.login-page .form-container .form .buttons-container{flex-direction:column;align-items:center;gap:.75rem;font-size:1.5rem;display:flex}.login-page .form-container .form .buttons-container button{border-radius:.5rem;width:100%;padding:.75rem}.login-page .form-container .form .buttons-container .login-button{background-color:var(--c-accent)}.login-page .form-container .form .buttons-container .login-button:hover{background-color:var(--c-accent-dark);transition:background-color .2s}.login-page .form-container .form .buttons-container .divider{color:var(--c-secondary-dark-1)}.login-page .form-container .form .buttons-container .guest-button{color:var(--c-secondary-dark);background-color:var(--c-primary-light-2)}.login-page .form-container .form .buttons-container .guest-button:hover{background-color:var(--c-primary-light-1);transition:background-color .2s}.login-page .form-container .form .buttons-container .disabled-button{background-color:var(--c-secondary-dark-3);color:var(--c-secondary-dark);cursor:not-allowed}.login-page .form-container .form .redirect{text-align:center;color:var(--c-secondary-dark-1);padding-top:2rem}.login-page .form-container .form .redirect a{color:var(--c-accent);text-decoration:underline}.vision-page{background-color:var(--c-primary);gap:2rem;height:100dvh;padding:8rem 3.75rem 1.5rem;font-family:Geist;display:flex}.vision-sidebar{color:var(--c-secondary);border:1px solid var(--c-secondary-dark-1);border-radius:1.25rem;flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}.vision-sidebar-header{background-color:var(--c-primary-light-1);border-bottom:1px solid var(--c-secondary-dark-1);align-items:center;gap:.5rem;padding:1rem 2rem;font-size:2rem;display:flex}.vision-sidebar-body{flex-direction:column;flex-grow:1;padding:2rem;display:flex}.vision-sidebar-body .attempts-container{flex-grow:1}.vision-sidebar-body .attempts-container .attempts{flex-wrap:wrap;gap:.75rem;display:flex}.vision-sidebar-body .attempts-container .attempts .square{border-radius:.25rem;padding:.25rem .75rem}.vision-sidebar-body .attempts-container .attempts .correct{background-color:var(--c-green)}.vision-sidebar-body .attempts-container .attempts .incorrect{background-color:var(--c-red)}.progress{justify-content:space-between;display:flex}.progress .score{font-size:3rem}.progress .time-display{color:var(--c-secondary-dark);align-items:center;gap:.5rem;font-size:2rem;display:flex}.options{justify-content:space-between;align-items:center;display:flex}.options .show-coordinates{align-items:center;gap:.5rem;display:flex}.options .show-coordinates input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--c-secondary-dark-3)}.options .button-container{gap:.5rem;display:flex}.options .button-container .button-wrapper{position:relative}.options .button-container .button-wrapper .time,.options .button-container .button-wrapper .color{background-color:var(--c-secondary-dark-3);border-radius:.25rem;align-items:center;gap:.5rem;padding:.5rem 1rem;transition:background-color .2s;display:flex}.options .button-container .button-wrapper .time:hover,.options .button-container .button-wrapper .color:hover{background-color:var(--c-secondary-dark-2)}.options .button-container .time-menu-container,.options .button-container .color-menu-container{height:0;position:absolute;bottom:3rem;left:50%;overflow:hidden;transform:translate(-50%)}:is(.options .button-container .time-menu-container,.options .button-container .color-menu-container) .popup-menu{background-color:var(--c-secondary-dark-3);cursor:default;border-radius:.25rem;flex-direction:column;align-items:center;width:6.5rem;padding:.25rem 0;display:flex}:is(.options .button-container .time-menu-container,.options .button-container .color-menu-container) .popup-menu li{cursor:pointer;border-radius:.25rem;width:100%;padding:.25rem .75rem;transition:all .2s}:is(.options .button-container .time-menu-container,.options .button-container .color-menu-container) .popup-menu li:hover{background-color:var(--c-secondary-dark-1)}:is(.options .button-container .time-menu-container,.options .button-container .color-menu-container) .popup-menu .selected{background-color:var(--c-secondary-dark-2)}.start{background-color:var(--c-accent);border-radius:.5rem;margin-top:1rem;padding:.75rem 0;font-size:1.5rem;transition:background-color .2s}.start:hover{background-color:var(--c-accent-dark)}.info{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.info .square-container{align-items:center;gap:.5rem;display:flex}.info .square-container .square{background-color:var(--c-secondary);border-radius:.25rem;width:1.5rem;height:1.5rem}.info .square-container span{font-size:2rem}.info .scores-container{color:var(--c-secondary-dark);align-items:center;gap:.75rem;display:flex}.info .scores-container .current,.info .scores-container .best{align-items:center;gap:.25rem;display:flex}:is(.info .scores-container .current,.info .scores-container .best) .score{font-size:1.5rem}.vision-chessboard-container{aspect-ratio:1;height:100%;position:relative}.vision-chessboard-container .display{color:var(--c-secondary-dark);z-index:2;pointer-events:none;font-size:7rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vision-chessboard-container .vision-chessboard{border-radius:1.25rem;flex-direction:column-reverse;display:flex;overflow:hidden}.vision-chessboard-container .vision-chessboard .rank{display:flex}.vision-chessboard-container .vision-chessboard .rank .square{aspect-ratio:1;width:12.5%}.vision-chessboard-container .vision-chessboard .rank .light{background-color:var(--c-light-square)}.vision-chessboard-container .vision-chessboard .rank .dark{background-color:var(--c-dark-square)}.vision-chessboard-container .vision-chessboard .piece{cursor:pointer;width:12.5%;height:12.5%;position:absolute;top:0}.vision-chessboard-container .vision-chessboard .piece img{pointer-events:none;width:100%;height:100%}.vision-chessboard-container .vision-chessboard .selected{background-color:var(--c-highlight)}.vision-chessboard-container .vision-chessboard .destSquare,.vision-chessboard-container .vision-chessboard .captureSquare{cursor:pointer;justify-content:center;align-items:center;width:12.5%;height:12.5%;font-size:5rem;display:flex;position:absolute;top:0}.vision-chessboard-container .vision-chessboard .destSquare img{pointer-events:none;width:1.25rem;height:1.25rem}.vision-chessboard-container .vision-chessboard .captureSquare img{pointer-events:none;width:1.5rem;height:1.5rem;position:absolute}.vision-chessboard-container .vision-chessboard .captureSquare .top-left{top:0;left:0;rotate:90deg}.vision-chessboard-container .vision-chessboard .captureSquare .top-right{top:0;right:0;rotate:180deg}.vision-chessboard-container .vision-chessboard .captureSquare .bottom-left{bottom:0;left:0;rotate:0deg}.vision-chessboard-container .vision-chessboard .captureSquare .bottom-right{bottom:0;right:0;rotate:270deg}.vision-chessboard-container .white{rotate:0deg}.vision-chessboard-container .white .piece img{rotate:0deg}.vision-chessboard-container .black{rotate:180deg}.vision-chessboard-container .black .piece img{rotate:180deg}.white .dark{color:#000}.white .light{color:#fff}.white .files{width:100%;display:flex;position:absolute;bottom:0}.white .files .file{width:12.5%;padding-left:.5rem}.white .ranks{flex-direction:column-reverse;height:100%;display:inline-flex}.white .ranks .rank{height:12.5%;padding-top:.5rem}.black .dark{color:#000}.black .light{color:#fff}.black .files{flex-direction:row-reverse;width:100%;display:flex;position:absolute;bottom:0}.black .files .file{width:12.5%;padding-left:.5rem}.black .ranks{flex-direction:column;height:100%;display:inline-flex}.black .ranks .rank{height:12.5%;padding-top:.5rem}.puzzles-page{background-color:var(--c-primary);gap:2rem;height:100dvh;padding:8rem 3.75rem 1.5rem;font-family:Geist;display:flex}.puzzles-chessboard-container{aspect-ratio:1;height:100%;position:relative}.puzzles-chessboard-container .display{color:var(--c-secondary-dark);z-index:2;pointer-events:none;font-size:7rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.puzzles-chessboard-container .puzzles-chessboard{-webkit-user-select:none;user-select:none;border-radius:1.25rem;flex-direction:column-reverse;display:flex;overflow:hidden}.puzzles-chessboard-container .puzzles-chessboard .rank{display:flex}.puzzles-chessboard-container .puzzles-chessboard .rank .square{aspect-ratio:1;width:12.5%}.puzzles-chessboard-container .puzzles-chessboard .rank .light{background-color:var(--c-light-square)}.puzzles-chessboard-container .puzzles-chessboard .rank .dark{background-color:var(--c-dark-square)}.puzzles-chessboard-container .puzzles-chessboard .piece{cursor:pointer;width:12.5%;height:12.5%;position:absolute;top:0}.puzzles-chessboard-container .puzzles-chessboard .piece img{pointer-events:none;width:100%;height:100%}.puzzles-chessboard-container .puzzles-chessboard .selected{background-color:var(--c-highlight)}.puzzles-chessboard-container .puzzles-chessboard .destSquare,.puzzles-chessboard-container .puzzles-chessboard .captureSquare{cursor:pointer;justify-content:center;align-items:center;width:12.5%;height:12.5%;font-size:5rem;display:flex;position:absolute;top:0}.puzzles-chessboard-container .puzzles-chessboard .destSquare img{pointer-events:none;width:1.25rem;height:1.25rem}.puzzles-chessboard-container .puzzles-chessboard .captureSquare img{pointer-events:none;width:1.5rem;height:1.5rem;position:absolute}.puzzles-chessboard-container .puzzles-chessboard .captureSquare .top-left{top:0;left:0;rotate:90deg}.puzzles-chessboard-container .puzzles-chessboard .captureSquare .top-right{top:0;right:0;rotate:180deg}.puzzles-chessboard-container .puzzles-chessboard .captureSquare .bottom-left{bottom:0;left:0;rotate:0deg}.puzzles-chessboard-container .puzzles-chessboard .captureSquare .bottom-right{bottom:0;right:0;rotate:270deg}.puzzles-chessboard-container .white{rotate:0deg}.puzzles-chessboard-container .white .piece img{rotate:0deg}.puzzles-chessboard-container .black{rotate:180deg}.puzzles-chessboard-container .black .piece img{rotate:180deg}.coords{pointer-events:none;border-radius:1.25rem;width:100%;height:100%;position:absolute}.white .dark{color:#000}.white .light{color:#fff}.white .files{width:100%;display:flex;position:absolute;bottom:0}.white .files .file{width:12.5%;padding-left:.5rem}.white .ranks{flex-direction:column-reverse;height:100%;display:inline-flex}.white .ranks .rank{height:12.5%;padding-top:.5rem}.black .dark{color:#000}.black .light{color:#fff}.black .files{flex-direction:row-reverse;width:100%;display:flex;position:absolute;bottom:0}.black .files .file{width:12.5%;padding-left:.5rem}.black .ranks{flex-direction:column;height:100%;display:inline-flex}.black .ranks .rank{height:12.5%;padding-top:.5rem}.puzzles-sidebar{color:var(--c-secondary);border:1px solid var(--c-secondary-dark-1);border-radius:1.25rem;flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}.puzzles-sidebar-header{background-color:var(--c-primary-light-1);border-bottom:1px solid var(--c-secondary-dark-1);align-items:center;gap:.5rem;padding:1rem 2rem;font-size:2rem;display:flex}.puzzles-sidebar-body{flex-direction:column;flex-grow:1;gap:1rem;padding:2rem;display:flex}.puzzles-sidebar-body .levels-container{flex-grow:1;grid-template-rows:repeat(auto-fill,minmax(4rem,1fr));grid-template-columns:repeat(auto-fill,minmax(4rem,1fr));justify-content:center;gap:.75rem;display:grid}.puzzles-sidebar-body .levels-container .level-btn{cursor:pointer;border:1px solid var(--c-secondary-dark-2);aspect-ratio:1;border-radius:1.25rem;justify-content:center;align-items:center;font-size:1.5rem;transition:all .2s;display:flex}.puzzles-sidebar-body .levels-container .selected{background-color:var(--c-primary-light-1);border-color:var(--c-secondary-dark);box-shadow:inset 0 0 5px 1px var(--c-secondary);font-weight:700}.puzzles-sidebar-body .levels-container .completed{background-color:var(--c-primary-light-2)}.puzzles-sidebar-body .levels-container .locked{background-color:var(--c-secondary-dark-3);border:none}.puzzles-sidebar-body .hint-container{flex-direction:column;flex-grow:1;justify-content:space-between;font-size:1.25rem;display:flex}.puzzles-sidebar-body .hint-container .player-color{gap:.5rem;display:flex}.puzzles-sidebar-body .hint-container .hint-text{gap:.5rem;display:flex}.puzzles-sidebar-body .hint-container .hint-text .text{color:var(--c-secondary-dark)}.puzzles-sidebar-body .buttons-container{gap:.5rem;display:flex}.puzzles-sidebar-body .buttons-container button{background-color:var(--c-accent);height:3.5rem;transition:background-color all ease;border-radius:.5rem;flex-grow:1;justify-content:center;align-items:center;gap:.5rem;font-size:1.5rem;display:flex}.puzzles-sidebar-body .buttons-container button:hover{background-color:var(--c-accent-dark)}.puzzles-sidebar-body .buttons-container .grow-1{flex-grow:1}.puzzles-sidebar-body .buttons-container .grow-3,.puzzles-sidebar-body .buttons-container .next-puzzle-btn{flex-grow:3}.puzzles-sidebar-body .buttons-container .bg-gray{background-color:var(--c-secondary-dark-3)}.puzzles-sidebar-body .buttons-container .bg-gray:hover{background-color:var(--c-secondary-dark-2)}.puzzles-sidebar-body .buttons-container .disabled{background-color:var(--c-secondary-dark-3);color:var(--c-secondary-dark);transition:all .2s}