#app.dark-theme{color:#fff;--bg-color: #222222}#app.dark-theme .score-bar,#app.dark-theme button,#app.dark-theme a,#app.dark-theme .menu-open{color:#fff;background:#1f1f1f;box-shadow:6px 6px 10px #191919,-6px -6px 10px #282828}#app.dark-theme button:active,#app.dark-theme a:hover{background:#1f1f1f;box-shadow:inset 10px 10px 20px #1b1b1b,inset -10px -10px 20px #2d2d2d}#app.dark-theme .score{background:#1f1f1f;box-shadow:6px 6px 15px #191919,-6px -6px 15px #282828;background:linear-gradient(145deg,#1c1c1c,#242424)}#app.dark-theme .resultMode div img{background:#1f1f1f;box-shadow:15px 15px 20px #161616,-15px -15px 20px #282828;background:linear-gradient(145deg,#1e1e1e,#1b1b1b)}#app.dark-theme .login-page input,#app.dark-theme .signup-page input{color:#fff;background:#1f1f1f;box-shadow:10px 10px 20px #1a1a1a,-10px -10px 20px #282828}#app.dark-theme .login-page input:focus,#app.dark-theme .signup-page input:focus{color:#fff;background:#1f1f1f;box-shadow:inset 5px 5px 20px #1b1b1b,inset -5px -5px 20px #2d2d2d}@media screen and (min-width: 431px){#app.dark-theme .login-page,#app.dark-theme .signup-page{background:#1f1f1f;box-shadow:10px 10px 20px #1a1a1a,-10px -10px 20px #282828}}#app.light-theme{--bg-color: #d9d9d9}#app{background-color:var(--bg-color)}body{margin:0;box-sizing:border-box;font-family:Inter,sans-serif;font-style:normal;background-color:var(--bg-color)}.layer{height:90vh;padding:5vh 11vw;display:flex;flex-direction:column;justify-content:space-between;transition:transform .4s}.score-bar{background:#d9d9d9;box-shadow:6px 6px 10px #aeaeae,-6px -6px 10px #fdfdfd;height:12vh;padding:1.5vh 5vw;border-radius:28px;display:flex;justify-content:space-between;align-items:center;font-weight:700}.score{background:#d9d9d9;box-shadow:6px 6px 15px #aeaeae,-6px -6px 15px #fdfdfd;background:linear-gradient(145deg,#c3c3c3,#f6f6f6);border-radius:20px;aspect-ratio:1/1;min-height:100%;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.score :first-child{font-size:.75rem}.score :last-child{font-size:2.5rem}#title{text-shadow:0 4px 4px rgba(0,0,0,.25);font-size:1rem}.board button{aspect-ratio:1/1;background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;border-radius:25px}.board button:active{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff}.board button:hover{cursor:pointer}.board button img{max-width:20vw}.easyMode,.hardMode{align-self:center;display:flex;flex-flow:row wrap;justify-content:center}.hardMode{gap:10vw}.easyMode{gap:20vw}.resultMode{display:flex;flex-flow:row wrap;justify-content:space-around;align-items:center;align-content:center}.resultMode .middle{order:1;flex-direction:column;margin-top:2rem}.resultMode .middle h2{font-weight:700;letter-spacing:.25rem;text-shadow:3px 3px 6px rgb(82,81,81)}.resultMode .middle button{aspect-ratio:3/1;height:7vh;border-radius:15px;font-weight:700;font-size:medium}.resultMode div{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:center}.resultMode div span{margin-top:2rem;font-size:small;font-weight:700}.resultMode img{aspect-ratio:1/1;background:#d9d9d9;box-shadow:15px 15px 20px #9a9a9a,-15px -15px 20px #fff;background:linear-gradient(145deg,#f4f4f4,#bababa);border-radius:25px}@media screen and (min-width: 431px){.resultMode div{flex-direction:column}.resultMode div span{margin-top:0;margin-bottom:2rem}.resultMode .middle{align-self:baseline;order:initial}.resultMode .middle h2{margin:0 0 1.5rem}.resultMode img{min-width:10vw}.resultMode span{font-size:2rem}}.modal{position:fixed;top:50%;left:50%;z-index:10;transform:translate(-50%,-50%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.modal img{max-width:100%}.closed{display:none}.login img,.signup img,.logout img{width:1rem}a{border-radius:15px;background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;padding:.5rem}a:hover{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff;cursor:alias}.menu{display:flex;justify-content:space-around;align-items:center}.menu #menuButton{flex:1;margin:0 5vw}.menu button{background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;font-weight:700;font-size:1rem;border-radius:15px;padding:1rem}.menu button:active{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff}.menu button:hover{cursor:pointer}.menu-open{transform:translateY(-37vh);background:#d9d9d9;box-shadow:6px 6px 10px #aeaeae,-6px -6px 10px #fdfdfd;border-radius:1rem}nav{position:fixed;bottom:0;left:50%;transform:translate(-50%)}nav ul{padding:0;list-style-type:none;display:flex;flex-direction:column;justify-content:space-around;align-items:center;flex-wrap:wrap;width:100vw}nav ul button{width:95vw;margin-top:2vh}nav ul button{background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;font-weight:700;font-size:1rem;border-radius:15px;padding:1rem}nav ul button:active{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff}nav ul button:hover{cursor:pointer}#themeChanger{max-width:fit-content;padding:.5rem}#spock img{filter:drop-shadow(0px 3px 2px rgba(0,0,0,.2901960784))}.login-layer{height:90vh;padding:5vh 11vw;display:flex;flex-direction:column}.login-page,.signup-page{height:100%;display:flex;flex-direction:column;justify-content:space-between}.login-page button,.signup-page button{background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;font-weight:700;font-size:1rem;border-radius:15px;padding:1rem}.login-page button:active,.signup-page button:active{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff}.login-page button:hover,.signup-page button:hover{cursor:pointer}#loginButton,#signUpButton{background-color:#000;color:#fff}input{border:none;border-radius:10px;width:100%;margin-top:2rem;padding:1rem;text-decoration:none;font-family:Inter,sans-serif;font-weight:700;background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc}input:focus{outline:none;background:#d9d9d9;box-shadow:inset 5px 5px 20px #bbb,inset -5px -5px 20px #fff}input::placeholder{padding-left:2rem;font-size:.9rem}form{display:flex;flex-direction:column;justify-content:space-between;margin-bottom:auto;align-items:center}h1{text-align:center}p{font-size:medium}@media screen and (min-width: 431px){.login-page,.signup-page{border-radius:2rem;align-self:center;width:fit-content;background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;padding:1.5rem}input{width:90%}}#goHome{aspect-ratio:1/1;width:fit-content;background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc}.toast{padding:1rem;border-radius:1rem;margin-top:1rem;color:#fff;text-align:center;font-weight:700;animation:2.5s fade ease-in-out infinite}@keyframes fade{0%{opacity:1}50%{opacity:.9;translate:0}to{translate:-1000px;opacity:0}}.warning{background-color:#ff0;background:#9f9f2c;box-shadow:5px 5px 20px #8f8f28,-5px -5px 20px #dada7a;background:linear-gradient(145deg,#d4d462,#97972a)}.error{background:#862424;box-shadow:5px 5px 20px #792020,-5px -5px 20px #d35a5a;background:linear-gradient(145deg,#cb3f3f,#7f2222)}.success{background:#418037;box-shadow:5px 5px 20px #3b7332,-5px -5px 20px #82c578;background:linear-gradient(145deg,#6dbb61,#3e7a34)}.container{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between}.container button{background:#d9d9d9;box-shadow:10px 10px 20px #b8b8b8,-10px -10px 20px #fcfcfc;border:none;font-weight:700;font-size:1rem;border-radius:15px;padding:1rem}.container button:active{background:#d9d9d9;box-shadow:inset 10px 10px 20px #bbb,inset -10px -10px 20px #fff}.container button:hover{cursor:pointer}.container p{font-size:large}