@import url("https://fonts.googleapis.com/css2?family=Lilita+One&display=swap");@import url("https://fonts.googleapis.com/css2?family=Lobster&display=swap");@import url("https://fonts.googleapis.com/css2?family=Russo+One&display=swap");@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500&display=swap");*{--max-wave-value:0.625rem;--min-wave-value:-0.625rem;--rotation-left-w:-5deg;--rotation-right-w:5deg;--color:#70c9cb;--checked-color:#1a9fe2;--bg-color:#d5d5d5;font-size:12px;letter-spacing:.09rem;transition:all .3s ease-in-out}body{user-select:none;font-family:Orbitron,sans-serif;background-color:#0093e9;background-image:linear-gradient(160deg,#0093e9,#80d0c7)}input,label{cursor:pointer}.app__container{min-height:100vh;width:100%;overflow:hidden;padding:2rem;display:flex;align-items:center}.main__title{font-family:Lilita One,cursive;margin-bottom:4rem;display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;color:#fff}.main-title-word__container{display:inline-flex}.main-title-word__letter{text-shadow:.125rem .25rem .125rem #c7c7c7;font-size:6rem;min-width:2rem;animation-duration:3.5s;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:ease-in-out;color:#fff;border-radius:.625rem;padding:0 .7rem;box-shadow:0 0 .375rem 0;background:hsla(0,0%,100%,.2);-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem);min-height:7rem;display:flex;align-items:center}.main-title-word__letter:nth-child(odd){animation-name:example}.main-title-word__letter:nth-child(2n){animation-name:example1}.main-title-word__letter:nth-child(2n+2){background:radial-gradient(red,#ff0000a8,#df0007)}.main-title-word__letter:nth-child(odd){background:radial-gradient(orange,#ffa500a8,#db9008)}.main-title-word__letter:nth-child(3n+1){background:radial-gradient(green,#008000a8,#009700)}@keyframes example{0%{transform:translateY(var(--max-wave-value))}50%{transform:translateY(var(--min-wave-value)) rotate(var(--rotation-left-w))}to{transform:translateY(var(--max-wave-value)) rotate(var(--rotation-right-w)) rotateY(-90deg)}}@keyframes example1{0%{transform:translateY(var(--min-wave-value))}50%{transform:translateY(var(--max-wave-value)) rotate(var(--rotation-left-w))}to{transform:translateY(var(--min-wave-value)) rotate(var(--rotation-right-w)) rotateY(-90deg)}}.title--center{text-align:center}form.form{padding:1rem;box-shadow:0 0 .375rem 0;background:hsla(0,0%,100%,.2);-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem);color:#fff}.form__title{margin-bottom:.6rem;font-size:1.5rem}fieldset.form__fieldset{padding:.7rem 1rem;border-color:#f9f9f9;margin-bottom:.5rem}.form__legend{font-size:1.4rem;padding:0 .7rem}.form-imputs__container input[type=radio]{margin-right:.2rem;width:1.1rem;height:1.1rem;appearance:none;-webkit-appearance:none;border:.2rem solid #fff;background-color:var(--bg-color);border-radius:50%;outline:.0625rem solid var(--color)}.form-imputs__container input[type=radio]:hover{outline-color:var(--checked-color)}.form-imputs__container input[type=radio]:checked{outline-color:var(--checked-color);background-color:var(--checked-color)}.form-imputs__container label{margin-right:.6rem}.form__div{padding:1rem 1.5rem;display:flex;flex-wrap:wrap;gap:3rem;align-items:center;justify-content:center}.form__div label{font-size:1.3rem}.form-btn__container{display:flex;justify-content:center;margin-top:1.5rem}.form__button{font-family:Orbitron,sans-serif;font-size:2rem;padding:.5rem 5rem;border-radius:1.875rem;box-shadow:0 .125rem .3125rem 0 #fff;border:none;color:#fff;background:hsla(0,0%,100%,.18)}.form__button:hover{box-shadow:0 .0625rem .1875rem 0}.info__container{display:none;color:#fff;position:absolute;top:2rem;left:2rem;padding:1rem 3rem;box-shadow:0 0 .375rem 0;background:rgba(255,36,36,.28);-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem)}.game__window,.home__window{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.home__window{animation:showGameWindow 5s}.game__window{animation:showSettingsWindow 1s}.cards-number-container{display:flex;gap:1rem;align-items:center;color:#fff;font-size:1.5rem}.cards-number{font-size:2rem;font-weight:700}@media screen and (max-width:768px){*{font-size:12px}}@media screen and (max-width:425px){*{font-size:10px}}@media screen and (max-width:320px){*{font-size:8px}}@keyframes showSettingsWindow{0%{opacity:0}to{opacity:1}}@keyframes showGameWindow{0%{transform:scale(0) rotateX(180deg);opacity:0}to{transform:scale(1);opacity:1}}@keyframes changeCard{0%{transform:translate(0)}50%{transform:translateY(-200%)}to{transform:translate(0)}}@keyframes flipCard{0%{transform:rotateY(180deg)}50%{transform:rotateY(90deg)}to{transform:rotateY(0deg)}}