*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;align-items:center;min-height:100vh;overflow:hidden;touch-action:none}#gameContainer{position:relative;width:100%;max-width:400px;height:600px;background:linear-gradient(180deg,#87ceeb 0,#98d8c8);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.3);overflow:hidden}#canvas{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}canvas{touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.gameOverScreen,.startScreen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:rgba(0,0,0,.7);color:#fff;z-index:10}.gameOverScreen.hidden{display:none}h1{font-size:2.5em;margin-bottom:20px;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;padding:15px 30px;font-size:1.2em;border-radius:25px;cursor:pointer;margin:10px;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 15px rgba(0,0,0,.3)}.button:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.4)}.button:active{transform:translateY(0)}.score{position:absolute;top:30px;left:50%;transform:translateX(-50%);font-size:2.5em;color:#fff;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.5);z-index:5}.instructions{text-align:center;margin:20px;line-height:1.6}.scoreDisplay{font-size:1.5em;margin:10px}@media (max-width:450px){#gameContainer{border-radius:0;height:100vh;max-width:100%}}.quizOverlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.85);z-index:20;padding:20px}.quizContainer{background:#fff;border-radius:15px;padding:30px;max-width:90%;width:100%;box-shadow:0 10px 40px rgba(0,0,0,.5);animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}.quizCategory{color:#667eea;font-size:.9em;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}.quizQuestion{color:#333;font-size:1.3em;margin-bottom:20px;line-height:1.4}.quizOptions{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.quizOption{background:#f5f5f5;border:2px solid #ddd;color:#333;padding:15px;font-size:1em;border-radius:10px;cursor:pointer;transition:all .2s;text-align:left}.quizOption:hover:not(:disabled){background:#e8e8e8;border-color:#667eea;transform:translateX(5px)}.quizOption:disabled{cursor:default}.quizOption.correct{background:#d4edda;border-color:#28a745;color:#155724}.quizOption.incorrect{background:#f8d7da;border-color:#dc3545;color:#721c24}.quizExplanation{background:#f8f9fa;border-radius:10px;padding:20px;margin-top:20px}.quizExplanation p{margin-bottom:15px;line-height:1.6;color:#333}.quizExplanation p.correct{color:#28a745;font-weight:700;font-size:1.2em}.quizExplanation p.incorrect{color:#dc3545;font-weight:700;font-size:1.2em}.countdownOverlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.6);z-index:15}.countdownNumber{font-size:8em;font-weight:700;color:#fff;text-shadow:0 0 20px rgba(102,126,234,.8),0 0 40px rgba(102,126,234,.6);animation:countdownPulse 1s ease-in-out}@keyframes countdownPulse{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:1}}.speedBanner{position:absolute;top:80px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;font-size:1.5em;font-weight:700;padding:12px 30px;border-radius:25px;box-shadow:0 4px 15px hsla(0,100%,71%,.5);z-index:12;animation:speedPulse .5s ease-in-out infinite alternate}@keyframes speedPulse{0%{transform:translateX(-50%) scale(1)}to{transform:translateX(-50%) scale(1.05)}}.settingsContainer{background:#fff;border-radius:15px;padding:20px;max-width:85%;width:100%;max-height:70vh;overflow-y:auto;box-shadow:0 10px 40px rgba(0,0,0,.5);animation:slideIn .3s ease-out}.settingsContainer h2{color:#333;margin-bottom:8px;font-size:1.5em}.settingsContainer>p{color:#666;margin-bottom:12px;font-size:.9em}.settingsButtons{display:flex;gap:8px;margin-bottom:15px;flex-wrap:wrap}.settingsButtons .button{flex:1 1;min-width:100px;padding:8px 16px;font-size:.9em}.categoryList{display:flex;flex-direction:column;gap:8px;margin-bottom:15px;max-height:300px;overflow-y:auto;padding:8px;background:#f8f9fa;border-radius:8px}.categoryItem{display:flex;align-items:center;gap:10px;padding:10px;background:#fff;border:2px solid #ddd;border-radius:6px;cursor:pointer;transition:all .2s}.categoryItem:hover{border-color:#667eea;background:#f5f5ff}.categoryItem input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#667eea;flex-shrink:0}.categoryItem span{color:#333;font-size:.9em;flex:1 1;line-height:1.3}.settingsFooter{display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:15px;border-top:2px solid #eee}.selectedCount{color:#667eea;font-weight:700;font-size:.9em}.settingsFooter .button{width:100%;max-width:180px;padding:10px 20px;font-size:1em}.quizWarning{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;padding:40px 30px;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.5);animation:pulseWarning 1.5s ease-in-out infinite}.quizWarning h2{color:#fff;font-size:2em;margin-bottom:15px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.quizWarning p{color:#fff;font-size:1.3em;opacity:.9}@keyframes pulseWarning{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.wheelContainer{background:#fff;border-radius:20px;padding:30px;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.5);animation:slideIn .3s ease-out;max-width:90%;width:100%}.wheelContainer h2{color:#333;font-size:2em;margin-bottom:10px}.wheelContainer>p{color:#666;font-size:1.1em;margin-bottom:30px}.wheelOuter{position:relative;width:300px;height:300px;margin:0 auto 30px}.wheel{border-radius:50%;position:relative;box-shadow:0 8px 30px rgba(0,0,0,.3);border:8px solid #333;background:conic-gradient(from 0deg,#22c55e 0deg 72deg,#333 72deg 73deg,#dc2626 73deg 144deg,#333 144deg 145deg,#dc2626 145deg 216deg,#333 216deg 217deg,#dc2626 217deg 288deg,#333 288deg 289deg,#dc2626 289deg 1turn);transition:transform 5s cubic-bezier(.17,.67,.12,.99)}.wheel,.wheelSlice{width:100%;height:100%}.wheelSlice{position:absolute;display:flex;align-items:center;justify-content:center}.wheelSlice.slice1{transform:rotate(36deg)}.wheelSlice.slice2{transform:rotate(108deg)}.wheelSlice.slice3{transform:rotate(180deg)}.wheelSlice.slice4{transform:rotate(252deg)}.wheelSlice.slice5{transform:rotate(324deg)}.sliceContent{transform:translateY(-100px) rotate(-36deg);color:#fff;font-weight:700;font-size:1.3em;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.5);line-height:1.2;pointer-events:none}.wheelCenter{width:30px;height:30px;background:#333;border-radius:50%;top:50%;transform:translate(-50%,-50%)}.wheelCenter,.wheelPointer{position:absolute;left:50%;z-index:10}.wheelPointer{top:-20px;transform:translateX(-50%);font-size:3em;color:#333;text-shadow:0 2px 4px rgba(0,0,0,.3)}.wheelResult{animation:slideIn .5s ease-out;margin-top:20px}.wheelResult p{font-size:1.3em;font-weight:700;margin-bottom:20px;padding:15px;border-radius:10px}.wheelResult p.lucky{background:#d4edda;color:#155724}.wheelResult p.unlucky{background:#f8d7da;color:#721c24}.wheelButton{background:linear-gradient(135deg,#f59e0b,#d97706)!important;animation:pulseButton 1s ease-in-out infinite}@keyframes pulseButton{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media (max-width:450px){.wheelContainer{padding:20px}.wheelOuter{width:250px;height:250px}.wheelContainer h2{font-size:1.5em}.wheelContainer>p{font-size:1em;margin-bottom:20px}.sliceContent{font-size:1.1em;transform:translateY(-85px) rotate(-36deg)}.wheelPointer{font-size:2.5em}.wheelResult p{font-size:1.1em}}