.flashcard-container{background-color:#f8f9fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0 auto;max-width:800px;min-height:100vh;padding:20px}.flashcard-start{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.15);color:#fff;padding:40px 20px;text-align:center}.flashcard-start h2{font-size:2.5rem;font-weight:700;margin-bottom:10px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.flashcard-start p{font-size:1.2rem;margin-bottom:30px;opacity:.9}.username-input{margin-bottom:25px}.username-input label{display:block;font-size:1.1rem;font-weight:600;margin-bottom:10px}.username-input input{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.95);border:none;border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,.1);font-size:16px;max-width:320px;padding:14px 18px;transition:all .3s ease;width:100%}.username-input input:focus{box-shadow:0 6px 20px rgba(0,0,0,.15);outline:none;transform:translateY(-2px)}.next-button,.restart-button,.start-button{background:linear-gradient(45deg,#ff6b6b,#ee5a24);border:none;border-radius:12px;box-shadow:0 4px 15px rgba(238,90,36,.3);color:#fff;cursor:pointer;font-size:16px;font-weight:600;letter-spacing:1px;min-width:160px;padding:14px 32px;text-transform:uppercase;transition:all .3s ease}.next-button:hover,.restart-button:hover,.start-button:hover{box-shadow:0 8px 25px rgba(238,90,36,.4);transform:translateY(-3px)}.start-button:disabled{background:#95a5a6;box-shadow:none;cursor:not-allowed;transform:none}.error-message{backdrop-filter:blur(10px);background:rgba(231,76,60,.1);border:1px solid rgba(231,76,60,.3);border-radius:8px;color:#e74c3c;margin:15px 0;padding:12px 20px}.flashcard-header{background:#fff;border:1px solid hsla(0,0%,100%,.2);border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,.08);justify-content:space-between;margin-bottom:25px;padding:20px 25px}.flashcard-header,.player-info{align-items:center;display:flex}.player-info{color:#2c3e50;font-size:1.2rem;font-weight:700;gap:8px}.question-counter{background:rgba(102,126,234,.1);border-radius:20px;color:#667eea;font-size:1rem;font-weight:600;padding:8px 16px}.question-section{background:#fff;border-left:6px solid #667eea;border-radius:16px;box-shadow:0 6px 25px rgba(0,0,0,.08);margin-bottom:25px;padding:35px 30px}.question-text{color:#2c3e50;font-size:1.4rem;font-weight:600;line-height:1.6;margin:0}.question-text p{margin:.5em 0}.question-text b,.question-text strong{color:#1a252f;font-weight:700}.question-text em,.question-text i{font-style:italic}.question-text ol,.question-text ul{margin:.5em 0;padding-left:2em}.question-text li{margin:.25em 0}.alternatives-section{display:grid;gap:15px;margin-bottom:25px}.alternative-button{background:#fff;border:2px solid #e9ecef;border-radius:12px;cursor:pointer;font-size:16px;line-height:1.5;overflow:hidden;padding:18px 22px;position:relative;text-align:left;transition:all .3s ease}.alternative-button span p{margin:0}.alternative-button span b,.alternative-button span strong{font-weight:700}.alternative-button span em,.alternative-button span i{font-style:italic}.alternative-button span ol,.alternative-button span ul{margin:.5em 0;padding-left:1.5em}.alternative-button span li{margin:.25em 0}.alternative-button:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.4),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.alternative-button:hover:not(:disabled):before{left:100%}.alternative-button:hover:not(:disabled){background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-color:#667eea;box-shadow:0 4px 15px rgba(102,126,234,.2);transform:translateX(6px)}.alternative-button:disabled{cursor:not-allowed}.alternative-button.correct-answer{box-shadow:0 4px 15px rgba(40,167,69,.3)}.alternative-button.correct-answer,.alternative-button.correct-selected{background:linear-gradient(135deg,#d4edda,#c3e6cb);border-color:#28a745;color:#155724}.alternative-button.correct-selected{box-shadow:0 6px 20px rgba(40,167,69,.4);transform:scale(1.02)}.alternative-button.wrong-selected{background:linear-gradient(135deg,#f8d7da,#f1c2c7);border-color:#dc3545;box-shadow:0 6px 20px rgba(220,53,69,.4);color:#721c24;transform:scale(1.02)}.feedback-section{animation:slideUp .5s ease-out;background:#fff;border-radius:16px;box-shadow:0 6px 25px rgba(0,0,0,.08);padding:35px 30px;text-align:center}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.feedback-icon{animation:bounce .6s ease-out;font-size:5rem;margin-bottom:20px}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.feedback-title{font-size:1.5rem;font-weight:700;margin-bottom:15px}.feedback-message{color:#6c757d;font-size:1.1rem;font-style:italic;margin-bottom:15px}.feedback-message p{margin:.5em 0}.feedback-message b,.feedback-message strong{color:#495057;font-weight:700}.feedback-message em,.feedback-message i{font-style:italic}.feedback-message ol,.feedback-message ul{margin:.5em 0;padding-left:1.5em}.feedback-message li{margin:.25em 0}.correct-answer-text{background:#f8f9fa;border-left:4px solid #28a745;border-radius:8px;color:#495057;font-size:1.1rem;margin-bottom:15px;padding:15px}.correct-answer-text strong{color:#155724;font-weight:700}.correct-answer-text p{margin:.5em 0}.correct-answer-text em,.correct-answer-text i{font-style:italic}.game-complete{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.15);color:#fff;padding:40px 20px;text-align:center}.game-complete h2{font-size:2.8rem;font-weight:700;margin-bottom:20px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.game-stats{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.95);border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,.1);color:#2c3e50;margin:25px 0;padding:30px}.game-stats p{font-size:1.2rem;font-weight:500;margin:12px 0}.game-stats p:last-child{border-top:2px solid #e9ecef;color:#667eea;font-size:1.5rem;font-weight:700;margin-top:20px;padding-top:20px}@media (max-width:768px){.flashcard-container{padding:15px}.flashcard-header{flex-direction:column;gap:12px;text-align:center}.question-section{padding:25px 20px}.question-text{font-size:1.2rem}.alternative-button{font-size:15px;padding:16px 18px}.feedback-section{padding:25px 20px}.feedback-icon{font-size:4rem}.username-input input{max-width:280px}}@media (max-width:480px){.flashcard-start h2{font-size:2rem}.game-complete h2{font-size:2.2rem}.question-text{font-size:1.1rem}.alternative-button{font-size:14px;padding:14px 16px}}