*{box-sizing:border-box;margin:0;padding:0}html,body,#app{touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:#fff;background:#0f0c29;width:100%;height:100dvh;font-family:PingFang SC,Microsoft YaHei,sans-serif;overflow:hidden}#app{background:linear-gradient(#0f0c29 0%,#1a1a2e 50%,#16213e 100%);flex-direction:column;display:flex;position:relative}.top-bar{flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 12px 4px;display:flex}.back-link{color:#64748b;padding:4px 8px;font-size:14px;text-decoration:none}.back-link:active{color:#94a3b8}.top-info{color:#94a3b8;font-size:13px}h1{text-align:center;color:#f97316;flex-shrink:0;margin:2px 0;font-size:18px;font-weight:800}.stats-bar{color:#94a3b8;flex-shrink:0;justify-content:center;gap:8px;padding:2px 0 8px;font-size:12px;display:flex}.stat{background:#ffffff0a;border-radius:8px;align-items:center;gap:2px;padding:2px 8px;display:inline-flex}.stat-correct{color:#4ade80}.stat-wrong{color:#ef4444}.stat-total{color:#94a3b8}.stat-time{color:#facc15}.question-area{text-align:center;flex-shrink:0;padding:8px 16px 4px;position:relative}.q-type-tag{color:#fdba74;background:#f9731626;border:1px solid #f973164d;border-radius:10px;margin-bottom:4px;padding:2px 10px;font-size:12px;display:inline-block}.q-level-tag{color:#fff;background:linear-gradient(135deg,#f97316,#ea580c);border-radius:10px;margin-bottom:8px;margin-left:4px;padding:2px 10px;font-size:11px;font-weight:600;display:inline-block}.question-text{color:#fdba74;text-align:left;background:#f9731614;border:2px solid #f9731633;border-radius:16px;justify-content:center;align-items:center;min-height:80px;padding:16px 14px;font-size:20px;line-height:1.8;display:flex}.options-area{flex-shrink:0;width:100%;max-width:420px;margin:0 auto;padding:6px 16px}.option-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.opt-btn{color:#fff;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#ffffff0f;border:none;border-radius:14px;height:52px;font-size:20px;font-weight:700;transition:all .15s}.opt-btn:active{background:#f9731626;border:1px solid #f973164d;transform:scale(.92)}.opt-btn.correct{animation:.4s pulse;color:#00e676!important;background:#00e67633!important;border:2px solid #00e676!important}.opt-btn.wrong{animation:.3s shake;color:#ff5252!important;background:#ff525233!important;border:2px solid #ff5252!important}.opt-btn:disabled{opacity:.7;cursor:default}.opt-btn:disabled:active{transform:none}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.hint-area{cursor:pointer;text-align:center;background:#f973161a;border:1px solid #f973164d;border-radius:12px;flex-shrink:0;margin:4px 16px 8px;padding:10px 14px}.hint-title{color:#f97316;margin-bottom:4px;font-size:14px;font-weight:700}.hint-content{color:#fdba74;margin-bottom:6px;font-size:13px;line-height:1.6}.continue-btn{color:#fff;cursor:pointer;touch-action:manipulation;background:linear-gradient(135deg,#f97316,#ea580c);border:none;border-radius:12px;padding:6px 20px;font-size:13px;font-weight:600}.continue-btn:active{transform:scale(.95)}.feedback-overlay{pointer-events:none;z-index:20;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.feedback-box{text-align:center}.fb-emoji{font-size:80px;animation:.5s ease-out bounceIn}.fb-title{margin-top:8px;font-size:24px;font-weight:800;animation:.5s ease-out fadeUp}@keyframes bounceIn{0%{opacity:0;transform:scale(0)}50%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.particle{pointer-events:none;z-index:30;animation:particleFly var(--duration,1s) ease-out forwards;font-size:24px;position:fixed}@keyframes particleFly{0%{opacity:1;transform:translate(0)scale(1)rotate(0)}30%{opacity:1;transform:translate(calc(var(--vx)*.4),calc(var(--vy)*.4)) scale(1) rotate(calc(var(--r)/3))}70%{opacity:.7;transform:translate(calc(var(--vx)*.7),calc(var(--vy)*.2)) scale(.6) rotate(calc(var(--r)*.6))}to{opacity:0;transform:translate(var(--vx),calc(var(--vy) + 60px)) scale(0) rotate(var(--r))}}.combo-banner{color:#000;z-index:35;white-space:nowrap;pointer-events:none;background:linear-gradient(135deg,#ffd700e6,#ff9500e6);border-radius:20px;padding:12px 32px;font-size:20px;font-weight:800;animation:2s ease-out forwards comboShow;position:fixed;bottom:20%;left:50%;transform:translate(-50%)}@keyframes comboShow{0%{opacity:0;transform:translate(-50%,-50%)scale(0)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.3)}30%{transform:translate(-50%,-50%)scale(1)}90%{opacity:1}to{opacity:0}}.level-overlay{z-index:40;background:#0f0c29f2;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.level-notice{text-align:center;border-radius:20px;padding:36px 52px;animation:.5s ease-out popIn}.level-up{color:#00e676;background:linear-gradient(135deg,#00e67626,#00d2ff1a);border:3px solid #00e676;box-shadow:0 0 40px #00e67633}.level-down{color:orange;background:linear-gradient(135deg,#ff525226,#ffa0001a);border:3px solid #ff5252;box-shadow:0 0 40px #ff525226}.lv-emoji{margin-bottom:10px;font-size:60px}.lv-title{margin-bottom:6px;font-size:28px;font-weight:800}.lv-desc{color:#94a3b8;font-size:18px}@keyframes popIn{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.weakness-bar{color:#94a3b8;flex-wrap:wrap;flex-shrink:0;justify-content:center;gap:4px;padding:4px 16px;font-size:11px;display:flex}.weakness-label{color:#f97316;font-weight:600}.weakness-item{color:#64748b}.weakness-sep{color:#374151;margin:0 2px}.bottom-bar{flex-shrink:0;justify-content:center;margin-top:auto;padding:8px 16px 12px;display:flex}.bottom-bar a{color:#64748b;background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;padding:8px 24px;font-size:14px;text-decoration:none;transition:all .15s}.bottom-bar a:active{background:#ffffff0f}.slide-up-enter-active{transition:all .3s}.slide-up-leave-active{transition:all .2s}.slide-up-enter-from,.slide-up-leave-to{opacity:0;transform:translateY(10px)}.pop-in-enter-active{animation:.4s ease-out pop}.pop-in-leave-active{animation:.3s ease-in reverse pop}@keyframes pop{0%{opacity:0;transform:scale(0)}50%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}.combo-enter-active{animation:.3s ease-out comboEntrance}.combo-leave-active{animation:.3s ease-in reverse comboExit}@keyframes comboEntrance{0%{opacity:0;transform:translate(-50%)scale(0)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes comboExit{0%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0;transform:translate(-50%)scale(0)}}
