@import url(https://fonts.googleapis.com/css2?family=Codystar&display=swap);:root{--color-darkest:#1a1d23;--color-dark:#2a2f3a;--color-medium:#d1d9e6;--color-light:#fff;--color-theme:#6c5ce7;--color-accent:#fdcb6e;--color-accent2:#00cec9;--color-accent3:#ff7675}*{box-sizing:border-box;margin:0;padding:0}html{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:62.5%}body{background:linear-gradient(135deg,#1a1d23,#2c3e50);color:#fff;color:var(--color-light);min-height:100vh;padding:3.2rem}.app{align-items:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff0d;border-radius:20px;box-shadow:0 0 30px #6c5ce7;box-shadow:0 0 30px var(--color-theme);display:flex;flex-direction:column;justify-content:center;padding:2rem 2rem 38rem}.main{width:50rem}.app-header{align-items:center;display:flex;margin-bottom:20rem;margin-left:10rem;margin-top:10rem;width:80rem}.error{background-color:#495057;border-radius:100px;font-size:1.6rem;font-weight:500;padding:2rem;text-align:center}img{width:14rem}h1,h2,h3,h4{text-shadow:0 0 10px #6c5ce7;text-shadow:0 0 10px var(--color-theme)}h1{font-family:Codystar;font-size:5.6rem}h2{font-size:3.6rem;margin-bottom:2rem}h3{font-size:2.4rem;margin-bottom:4rem}h3,h4{font-weight:600}h4{font-size:2.2rem;margin-bottom:2.4rem}.start{align-items:center;display:flex;flex-direction:column;text-align:center}.progress{grid-gap:1.2rem;color:#d1d9e6;color:var(--color-medium);display:grid;font-size:1.8rem;gap:1.2rem;grid-template-columns:auto auto;justify-content:space-between;margin-bottom:4rem}progress{-webkit-appearance:none;grid-column:1/-1;height:12px;width:100%}::-webkit-progress-bar{background-color:#2a2f3a;background-color:var(--color-dark);border-radius:100px}::-webkit-progress-value{background:linear-gradient(90deg,#6c5ce7,#00cec9);background:linear-gradient(90deg,var(--color-theme),var(--color-accent2));border-radius:100px;box-shadow:0 0 10px #6c5ce7;box-shadow:0 0 10px var(--color-theme)}.btn{background:#6c5ce7;background:var(--color-theme);border:2px solid #2a2f3a;border:2px solid var(--color-dark);border-radius:100px;box-shadow:0 0 10px #6c5ce7;box-shadow:0 0 10px var(--color-theme);color:#fff;color:var(--color-light);cursor:pointer;display:block;font-family:inherit;font-size:2rem;padding:1.2rem 2.4rem;transition:.3s}.btn:not([disabled]):hover{background:#00cec9;background:var(--color-accent2);background-color:#1a1d23;background-color:var(--color-darkest);border-color:#00cec9;border-color:var(--color-accent2);box-shadow:0 0 15px #00cec9;box-shadow:0 0 15px var(--color-accent2)}.btn-option:not([disabled]):hover{transform:translateX(1.2rem)}.btn[disabled]:hover{cursor:not-allowed}.btn-ui{float:right}.options{display:flex;flex-direction:column;gap:1.2rem;margin-bottom:3.2rem}.btn-option{text-align:left;width:100%}.btn-option.correct{background-color:#00cec9;background-color:var(--color-accent2);border:2px solid #00cec9;border:2px solid var(--color-accent2);box-shadow:0 0 10px #00cec9;box-shadow:0 0 10px var(--color-accent2);color:#1a1d23;color:var(--color-darkest)}.btn-option.wrong{background-color:#ff7675;background-color:var(--color-accent3);border:2px solid #ff7675;border:2px solid var(--color-accent3);box-shadow:0 0 10px #ff7675;box-shadow:0 0 10px var(--color-accent3);color:#fff;color:var(--color-light)}.answer{transform:translateX(2rem)}.result{background-color:#6c5ce7;background-color:var(--color-theme);border-radius:100px;color:#fff;color:var(--color-light);font-size:2rem;font-weight:500;margin-bottom:1.6rem;padding:2rem 0;text-align:center}.result span{font-size:2.2rem;margin-right:4px}.highscore{font-size:1.8rem;margin-bottom:4.8rem;text-align:center}.loader-container{align-items:center;color:#d1d9e6;color:var(--color-medium);display:flex;flex-direction:column;font-size:1.4rem;gap:1.6rem;margin-top:4rem}.timer{border:2px solid #00cec9;border:2px solid var(--color-accent2);border-radius:100px;box-shadow:0 0 10px #00cec9;box-shadow:0 0 10px var(--color-accent2);color:#fff;color:var(--color-light);float:left;font-size:1.8rem;padding:1.35rem 2.8rem}.loader{animation:loader 1s linear infinite;background:radial-gradient(circle closest-side,currentColor 90%,#0000) 0 50%,radial-gradient(circle closest-side,currentColor 90%,#0000) 50% 50%,radial-gradient(circle closest-side,currentColor 90%,#0000) 100% 50%;background-repeat:no-repeat;background-size:33.33333% 12px;height:24px;width:50px}@keyframes loader{20%{background-position:0 0,50% 50%,100% 50%}40%{background-position:0 100%,50% 0,100% 50%}60%{background-position:0 50%,50% 100%,100% 0}80%{background-position:0 50%,50% 50%,100% 100%}}.counter{align-items:center;display:flex;flex-direction:column;font-size:2rem;font-weight:700;gap:1rem;margin:6rem}.counter *{font-size:inherit;padding:.8rem}@media (max-width:992px){.app-header{justify-content:center;margin:5rem 0;text-align:center;width:100%}.main{width:90%}h1{font-size:4.2rem}h2{font-size:2.8rem}.timer{padding:1rem 2rem}}@media (max-width:600px){body{padding:1.6rem}.app-header{flex-direction:column;gap:2rem;margin:4rem 0}img{width:10rem}.main,.start{width:100%}.start{padding:0 1rem}h1{font-size:3.4rem}h2{font-size:2.4rem}h3{font-size:2rem}.btn{font-size:1.8rem}.btn,.timer{padding:1rem 2rem}.timer{float:none;margin-bottom:1.6rem}.progress,.timer{text-align:center}.progress{grid-template-columns:1fr}.options{gap:1rem}.btn-option{font-size:1.8rem}.counter,.highscore,.result{font-size:1.6rem}.counter{margin:3rem 0}}@media (max-width:400px){h1{font-size:2.8rem}h2{font-size:2rem}.btn{font-size:1.6rem;padding:.8rem 1.6rem}.timer{font-size:1.4rem}}
/*# sourceMappingURL=main.b047ecf6.css.map*/