*{box-sizing:border-box}#root{height:100%;display:grid;place-items:center}body{margin:0;background-color:#252a38;height:100vh;display:flex;justify-content:center;align-items:center}main{max-width:800px;height:max-content;min-height:800px;background-color:#f5f7fb;display:grid;place-items:center;border-radius:6px}.first-page-container{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:40px 75px}.first-page-container>h1{font-size:30px;font-family:Karla,sans-serif;color:#293264;margin:0}.first-page-container>p{font-size:14px;font-family:Inter,sans-serif;text-align:center;color:#293264}.first-page-container>button{font-family:Inter,sans-serif;font-size:16px;background-color:#4d5b9e;color:#f5f7fb;border:none;border-radius:15px;width:200px;height:50px;margin-top:30px;cursor:pointer}.question-wrapper{display:flex;flex-direction:column;justify-content:center;padding-inline:50px}.question-container{display:flex;flex-direction:column;justify-content:center;gap:25px;min-height:120px;padding-block:20px;border-bottom:1px solid #DBDEF0}.question{font-family:Karla,sans-serif;font-size:16px;font-weight:700;color:#293264}.option-wrapper{display:flex;gap:clamp(5px,3vw,20px);flex-wrap:wrap}.question-option{font-family:Inter,sans-serif;font-size:14px;color:#293264;border:1px solid #4D5B9E;border-radius:8px;padding:4px 15px;cursor:pointer}.option-container>input{display:none}.option-container>input:checked+.question-option{background-color:#d6dbf5;border:1px solid #D6DBF5}.check-answers-button{width:150px;height:50px;margin:30px auto;font-family:Inter,sans-serif;font-size:14px;background-color:#4d5b9e;color:#f5f7fb;border:none;border-radius:15px;cursor:pointer}.option-container>input+.question-option.question-option--correct{background-color:#94d7a2;border:1px solid #94D7A2;opacity:1!important}.option-container>input:checked+.question-option.question-option--wrong{background-color:#f8bcbc;border:1px solid #F8BCBC}.option-container>input+.question-option.question-option--checked{pointer-events:none;opacity:.5}.play-again-container{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:35px}.correct-answer-count{font-family:Inter,sans-serif;font-weight:700;color:#293264}.play-again-button{width:120px;height:40px;padding:8px 14px;font-family:Inter,sans-serif;font-size:14px;background-color:#4d5b9e;color:#f5f7fb;border:none;border-radius:15px;cursor:pointer}@media screen and (max-width: 600px){main:has(>.first-page-container){height:100%}main:has(.question-wrapper){height:max-content}.question-wrapper{padding-block:20px}.option-wrapper{flex-direction:column;gap:15px}.play-again-container{margin-bottom:35px}.play-again-button{white-space:nowrap}}@media screen and (orientation: landscape) and (max-width: 1000px){main{min-height:unset}}
