*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);min-height:100vh;padding:20px;color:#333}.container{max-width:800px;margin:0 auto}.header{text-align:center;color:white;margin-bottom:30px;position:relative}.header h1{font-size:3rem;margin-bottom:10px;text-shadow:2px 2px 4px rgba(0,0,0,0.2)}.subtitle{font-size:1.2rem;opacity:0.9}.hamburger-btn{display:none;position:absolute;left:0;top:10px;background:rgba(255,255,255,0.2);border:none;padding:10px;cursor:pointer;border-radius:5px;z-index:1001;flex-direction:column;gap:4px;width:40px;height:40px;justify-content:center;align-items:center}.hamburger-btn span{display:block;width:25px;height:3px;background:white;border-radius:2px;transition:all 0.3s ease}.hamburger-btn.active span:nth-child(1){transform:rotate(45deg) translate(5px, 5px)}.hamburger-btn.active span:nth-child(2){opacity:0}.hamburger-btn.active span:nth-child(3){transform:rotate(-45deg) translate(7px, -7px)}.mobile-nav{display:none}.desktop-selector{background:white;padding:20px;border-radius:10px;margin-bottom:30px;box-shadow:0 4px 6px rgba(0,0,0,0.1);display:flex;justify-content:center}.category-selector{display:flex;align-items:center;gap:10px}.category-selector label{font-weight:600;color:#555}#category-select,#category-select-desktop{padding:8px 15px;border:2px solid #667eea;border-radius:5px;font-size:1rem;background:white;cursor:pointer;min-width:200px}#category-select:focus,#category-select-desktop:focus{outline:none;border-color:#764ba2}.card-counter{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:1rem;font-weight:600;z-index:10;transition:color 0.3s ease;padding-top:25px;margin-top:15px}.flashcard:not(.flipped) .card-counter{color:#999}.flashcard.flipped .card-counter{color:rgba(255,255,255,0.8)}.flashcard-container{perspective:1000px;margin-bottom:30px}.flashcard{width:100%;min-height:400px;position:relative;transition:transform 0.6s;transform-style:preserve-3d;cursor:pointer}.flashcard.no-transition{transition:none}.flashcard.flipped{transform:rotateY(180deg)}.flashcard-inner{position:relative;width:100%;min-height:100%;transform-style:preserve-3d}.flashcard-front,.flashcard-back{width:100%;min-height:400px;backface-visibility:hidden;border-radius:15px;box-shadow:0 8px 16px rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;padding:40px 40px 70px 40px}.flashcard-front{position:relative;background:white}.flashcard-back{position:absolute;top:0;left:0;height:100%;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);transform:rotateY(180deg);color:white}.card-content{font-size:1.5rem;text-align:center;line-height:1.6}.card-question{font-size:1.3rem;font-weight:600;margin-bottom:20px;line-height:1.5}.card-choices{margin-top:15px;text-align:left}.choice-item{padding:10px 15px;margin:8px 0;background:rgba(102,126,234,0.1);border-radius:8px;border-left:3px solid #667eea;line-height:1.4;font-size:1rem;transition:all 0.3s ease;cursor:pointer}.choice-item:hover:not(.wrong):not(.correct){background:rgba(102,126,234,0.15);transform:translateX(3px)}.choice-item.wrong{background:rgba(220,38,38,0.15);border-left-color:#dc2626;cursor:not-allowed;animation:shake 0.3s ease}.choice-item.correct{background:rgba(34,197,94,0.15);border-left-color:#22c55e}@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.card-answer{font-size:1.8rem;font-weight:700;margin-bottom:25px;line-height:1.4}.card-explanation{font-size:1.1rem;font-weight:400;line-height:1.6;padding-top:20px;border-top:2px solid rgba(255,255,255,0.3);opacity:0.95}.navigation{display:flex;gap:15px;justify-content:center;margin-bottom:20px}.nav-btn{padding:12px 30px;font-size:1rem;border:2px solid white;border-radius:8px;background:rgba(255,255,255,0.2);color:white;cursor:pointer;transition:all 0.3s ease;font-weight:600}.nav-btn:hover:not(:disabled){background:white;color:#667eea;transform:translateY(-2px)}.nav-btn.primary{background:white;color:#667eea}.nav-btn.primary:hover:not(:disabled){background:#764ba2;color:white;border-color:#764ba2}.nav-btn:disabled{opacity:0.4;cursor:not-allowed}.actions{display:flex;gap:15px;justify-content:center;margin-bottom:30px}.action-btn{padding:10px 25px;font-size:0.95rem;border:2px solid rgba(255,255,255,0.5);border-radius:8px;background:rgba(255,255,255,0.1);color:white;cursor:pointer;transition:all 0.3s ease;font-weight:600}.action-btn:hover:not(:disabled){background:rgba(255,255,255,0.3);border-color:white;transform:translateY(-2px)}.action-btn:disabled{opacity:0.4;cursor:not-allowed}.progress-bar{width:100%;height:8px;background:rgba(255,255,255,0.3);border-radius:10px;overflow:hidden}.progress-fill{height:100%;background:white;transition:width 0.3s ease;border-radius:10px}@media (max-width: 768px){.header h1{font-size:2rem}.hamburger-btn{display:flex}.desktop-selector{display:none}.mobile-nav{display:block;position:fixed;top:0;left:-100%;width:80%;max-width:300px;height:100vh;background:white;box-shadow:2px 0 10px rgba(0,0,0,0.3);z-index:1000;transition:left 0.3s ease;padding:80px 20px 20px}.mobile-nav.active{left:0}.mobile-nav .category-selector{display:flex;flex-direction:column;gap:10px;width:100%}.mobile-nav .category-selector label{font-weight:600;color:#555;font-size:1.1rem}.mobile-nav #category-select{padding:12px 15px;border:2px solid #667eea;border-radius:5px;font-size:1rem;background:white;cursor:pointer;width:100%}.flashcard{min-height:300px}.card-content{font-size:1.2rem}.navigation{flex-direction:column}.nav-btn{width:100%}body.menu-open::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:999}}.category-list{display:grid;grid-template-columns:repeat(auto-fill, minmax(250px, 1fr));gap:20px;max-width:1000px;margin:0 auto;padding:20px}.category-card{background:white;border-radius:15px;padding:30px;text-align:center;text-decoration:none;color:#333;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:all 0.3s ease}.category-card:hover{transform:translateY(-5px);box-shadow:0 8px 12px rgba(0,0,0,0.2)}.category-card h2{font-size:1.8rem;margin-bottom:10px;color:#667eea}.category-card p{color:#666;font-size:1rem}@keyframes slideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.container>*{animation:slideIn 0.5s ease-out}