@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap";*,*:before,*:after{box-sizing:border-box}:focus-visible{outline:2px solid black}button{cursor:pointer}body{--color-saturation: 85%;--color-lightness: 50%;--color-dark-1-lightness: 45%;--color-dark-2-lightness: 40%;--color-dark-3-lightness: 30%;--red-hue: 348.8;--red: hsl(var(--red-hue), var(--color-saturation), var(--color-lightness));--red-dark-1: hsl( var(--red-hue), var(--color-saturation), var(--color-dark-1-lightness) );--red-dark-2: hsl( var(--red-hue), var(--color-saturation), var(--color-dark-2-lightness) );--red-dark-3: hsl( var(--red-hue), var(--color-saturation), var(--color-dark-3-lightness) );--yellow-hue: 36.1;--yellow: hsl( var(--yellow-hue), var(--color-saturation), var(--color-lightness) );--yellow-dark-1: hsl( var(--yellow-hue), var(--color-saturation), var(--color-dark-1-lightness) );--yellow-dark-2: hsl( var(--yellow-hue), var(--color-saturation), var(--color-dark-2-lightness) );--lime-hue: 206.9;--lime: hsl( var(--lime-hue), var(--color-saturation), var(--color-lightness) );--lime-dark-1: hsl( var(--lime-hue), var(--color-saturation), var(--color-dark-1-lightness) );--lime-dark-2: hsl( var(--lime-hue), var(--color-saturation), var(--color-dark-2-lightness) );--color-1-hue: 225;--color-1-saturation: 75%;--color-1: hsl(var(--color-1-hue), var(--color-1-saturation), 55%);--color-1-light-1: hsl(var(--color-1-hue), var(--color-1-saturation), 60%);--color-1-light-2: hsl(var(--color-1-hue), var(--color-1-saturation), 65%);--color-1-light-3: hsl(var(--color-1-hue), var(--color-1-saturation), 70%);--color-1-dark-1: hsl(var(--color-1-hue), var(--color-1-saturation), 50%);--color-1-dark-2: hsl(var(--color-1-hue), var(--color-1-saturation), 40%);--button-border-bottom-width: 5px;--button-translate-on-click: 0 3px;--button-translate-on-click-transition-duration: 75ms;--button-translate-on-click-transition-timing-function: ease;--background-transition-duration: .15s;--background-transition-timing-function: ease;--popup-transition-duration: .5s;--popup-transition-timing-function: ease;margin:0;font-family:Montserrat,sans-serif}main.bg{background-image:url(/assets/img/background.png);background-repeat:no-repeat;background-size:cover;background-position:center}button,input{font:inherit;color:inherit}main{padding:1rem;transition:filter var(--popup-transition-duration) var(--popup-transition-timing-function)}.unfocused{filter:blur(6px)}.notification a{color:#66f}.notification{position:fixed;background-color:#000;color:#fff;padding:25px 50px;width:100vw;border-radius:50px 50px 0 0;text-align:center;bottom:0;transition:filter var(--popup-transition-duration) var(--popup-transition-timing-function)}.notification .cross-mark{width:1rem;position:absolute;right:2rem;top:2vh;cursor:pointer}.lnk{display:none}#link{color:#fff0}.round-popup{position:absolute;min-height:100dvh;min-width:100dvw;z-index:1;display:flex;align-items:center;justify-content:center;flex-direction:column;animation:fade-in var(--popup-transition-duration) var(--popup-transition-timing-function)}.round-popup h2{font-size:3.5rem;text-align:center}.round-popup p{margin-top:0;padding:2rem;font-size:2rem;text-align:center}@keyframes fade-in{0%{opacity:0}}.word-grid{--letter-size: min(14vw, 5rem);--character-border-radius: .75rem;border-radius:var(--character-border-radius);display:grid;width:fit-content;grid-template-columns:repeat(var(--letter-amount),var(--letter-size));grid-template-rows:repeat(var(--word-amount),var(--letter-size));background-color:var(--color-1-light-2)}.word-grid .character{--rotate-character-duration: .75s;--rotate-character-part-duration: calc( var(--rotate-character-duration) / 2 );--wave-interval: 75ms;--wave-delay: calc(var(--diagonal-index) * var(--wave-interval));border:3px outset var(--color-1-light-1);display:flex;align-items:flex-end;justify-content:center;background-color:var(--color-1);font-size:min(8vw,3.5rem);animation:rotate-character-part-1 var(--rotate-character-part-duration) ease-in var(--wave-delay) backwards,rotate-character-part-2 var(--rotate-character-part-duration) ease-out calc(var(--rotate-character-part-duration) + var(--wave-delay))}.word-grid .character.correct{border-color:var(--red-dark-1);background-color:var(--red)}.word-grid .character.incorrect-position{color:#000;background-image:url(/assets/img/yellow-circle.svg);background-size:90%;background-repeat:no-repeat;background-position:center}.word-grid .character.letter{align-items:center}.word-grid .character.top-left{border-top-left-radius:var(--character-border-radius)}.word-grid .character.top-right{border-top-right-radius:var(--character-border-radius)}.word-grid .character.bottom-left{border-bottom-left-radius:var(--character-border-radius)}.word-grid .character.bottom-right{border-bottom-right-radius:var(--character-border-radius)}@keyframes rotate-character-part-1{0%{rotate:y -180deg;color:transparent}to{rotate:y -90deg;color:transparent}}@keyframes rotate-character-part-2{0%{rotate:y -90deg;color:#fff}}main.home{display:flex;align-items:center;text-align:center;justify-content:top;flex-direction:column;min-height:100dvh}main p{font-size:1.3rem;text-align:center;padding-bottom:1.5rem}main h1{font-size:4rem;padding:1rem;margin:0}main .page{color:#3763cd}main.home .levels{display:flex;flex-direction:row;gap:1rem}main.home .level{border-top:0;border-inline:0;border-bottom:var(--button-border-bottom-width) solid transparent;border-radius:1rem;padding:.75rem min(10vw,3rem);display:block;font-size:1.25rem;color:inherit;text-decoration:none;transition:background-color var(--background-transition-duration) var(--background-transition-timing-function),translate var(--button-translate-on-click-transition-duration) var(--button-translate-on-click-transition-timing-function)}main.home .level:active{translate:var(--button-translate-on-click)}main.home .level.easy{border-color:var(--lime-dark-1);background-color:var(--lime)}main.home .level.easy:is(:hover,:focus-visible){border-color:var(--lime-dark-2);background-color:var(--lime-dark-1)}main.home .level.hard{border-color:var(--yellow-dark-1);background-color:var(--yellow)}main.home .level.hard:is(:hover,:focus-visible){border-color:var(--yellow-dark-2);background-color:var(--yellow-dark-1)}main.home .level.expert{color:#fff;border-color:var(--red-dark-2);background-color:var(--red-dark-1)}main.home .level.expert:is(:hover,:focus-visible){border-color:var(--red-dark-3);background-color:var(--red-dark-2)}@media only screen and (max-width:600px){main.home .levels{display:flex;flex-direction:column;gap:1rem}main h1{font-size:2rem;padding:0}main p{font-size:1rem}}footer{margin-top:70px;width:90vw;text-align:-webkit-center}main img{width:max(300px,30vw);max-height:max(100px,12vw);object-fit:cover}main.notfound{display:flex;align-items:center;text-align:center;justify-content:top;flex-direction:column;min-height:100dvh}main.guess-word{--word-amount: 5;min-height:100dvh;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3rem;color:#fff}main.guess-word .guess-input-wrapper{display:flex;align-items:center;gap:.75rem}main.guess-word input.guess{--letter-spacing: .375rem;border:5px solid var(--color-1-light-1);border-style:solid;border-radius:100vmin;padding:.75rem min(7vw,3.5rem);box-sizing:content-box;width:calc(var(--letter-amount) * 1ch + var(--letter-amount) * var(--letter-spacing));font-family:Roboto Mono,monospace;font-size:min(7vw,2.25rem);letter-spacing:var(--letter-spacing);background-color:var(--color-1-light-2);transition:background-color var(--background-transition-duration) var(--background-transition-timing-function),border-color var(--background-transition-duration) var(--background-transition-timing-function)}main.guess-word input.guess:focus-visible{outline:none;border-color:var(--color-1-light-3);background-color:var(--color-1-light-1)}main.guess-word input.guess.invalid{border-color:var(--red-dark-3);background-color:var(--red)}main.guess-word button.enter-word{border-top:none;border-inline:none;border-bottom:var(--button-border-bottom-width) solid var(--color-1-dark-1);border-radius:.75rem;padding:.5rem 1.5rem;background-color:var(--color-1);transition:background-color var(--background-transition-duration) var(--background-transition-timing-function),translate var(--button-translate-on-click-transition-duration) var(--button-translate-on-click-transition-timing-function)}main.guess-word button.enter-word:active{translate:var(--button-translate-on-click)}main.guess-word button:focus-visible{outline-color:var(--color-1-light-3)}main.guess-word button:is(:hover,:focus-visible){border-color:var(--color-1-dark-2);background-color:var(--color-1-dark-1)}main.guess-word img.check-mark{width:min(6vw,2rem);fill:#fff}
