*{margin:0;padding:0;box-sizing:border-box}#root{font-family:Arial,Helvetica,sans-serif;width:80%;height:100%;display:flex;align-items:center;justify-content:center}body{background-color:#7f9cf5;color:#1e1e2f;height:100vh;display:flex;align-items:center;justify-content:center}button{border-radius:5px;background-color:#7f9cf5;color:#e2e8f0;border:none;outline:none;font-size:1.5rem;padding:10px;transition:.3s ease}button:hover{background-color:#7f9cf5;color:#3f4f44;box-shadow:0 10px 20px #0003}button{border:2px solid #1E1E2F;color:#1e1e2f;border-radius:10px;cursor:pointer}button:hover{background-color:#1e1e2f;color:#e2e8f0}@media(max-width:768px){button{padding:10px 14px;font-size:.95rem;border-radius:8px}}@media(max-width:480px){button{width:100%;padding:12px 16px;font-size:.9rem;border-radius:6px}}.option{width:100%;cursor:pointer;color:#1e1e2f;border:2px solid #1E1E2F;font-size:1rem;font-weight:700}.option:hover{color:#e2e8f0;background-color:#1e1e2f}.question{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:20px}.media-container{width:500px;height:300px;overflow:hidden;border:10px solid #1E1E2F;border-radius:10px}.question-info{display:flex;flex-direction:column;align-self:center;justify-content:center;width:100%;height:100%;font-size:1.5rem;padding:30px;position:relative;color:#1e1e2f;border:2px solid #1E1E2F;border-radius:5px}.question-media{width:100%;height:100%;object-fit:contain;background-color:#1e1e2f}.question-title{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px}.question-number,.question-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.question-content{font-weight:700}.question-number,.time{display:flex;align-items:center;justify-content:center;width:100%;background-color:#1e1e2f;color:#e2e8f0;text-align:right;padding:5px;border-radius:5px}@media(max-width:768px){.question{grid-template-columns:1fr;padding:16px;gap:16px}.media-container{width:100%;height:260px}.question-info{font-size:1.3rem;padding:20px}.question-title{gap:10px;margin-bottom:10px}.question-number,.time{font-size:.9rem;padding:6px 12px}}@media(max-width:480px){.question{padding:12px;gap:12px}.media-container{height:220px;border-width:6px}.question-info{font-size:1.1rem;padding:16px}.question-title{flex-direction:column;align-items:flex-start;gap:8px}.question-number,.time{width:100%;display:flex;align-items:center;justify-content:center;font-size:.85rem;padding:6px}.question-content{margin-top:10px;text-align:center}}.quiz-over{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:50px;font-weight:700}.answers{display:flex;align-items:center;justify-content:center;gap:10px;text-align:center;display:inline-block;width:100px}.results{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}h2{display:flex;align-items:center;justify-content:center;width:auto;background-color:#1e1e2f;color:#e2e8f0;text-align:right;padding:5px;border-radius:5px}@media(max-width:768px){.quiz-over{gap:30px;padding:16px}.answers{width:auto;min-width:72px;padding:8px 10px;gap:8px;font-size:.95rem}.results{gap:14px;width:100%;max-width:520px}h2{width:100%;justify-content:center;text-align:center;font-size:1.1rem;padding:10px 12px}}@media(max-width:480px){.quiz-over{gap:20px;padding:12px}.answers{min-width:60px;padding:8px;font-size:.9rem}.results{width:100%;gap:12px}h2{font-size:1rem;padding:10px}}.quiz-container{height:100vh;display:grid;grid-template-rows:1fr 1fr;padding:10px;gap:10px}.question-section{display:flex;align-items:center;justify-content:center;width:100%;margin-top:30px}.options{display:grid;grid-template-columns:repeat(2,1fr);height:50px;gap:10px;margin-top:30px}@media(max-width:768px){.quiz-container{grid-template-rows:auto 1fr;height:100vh;padding:12px;gap:12px}.question-section{margin-top:12px}.options{grid-template-columns:1fr;height:auto;margin-top:12px}}@media(max-width:480px){.quiz-container{padding:10px;gap:10px}.question-section{margin-top:8px}.options{gap:8px;margin-top:8px}}
