:root{--bg-dark: #050505;--panel-bg: #111111;--panel-bg-light: #1A1A1A;--text-main: #F3F4F6;--text-muted: #9CA3AF;--gold-main: #D4AF37;--gold-dim: rgba(212, 175, 55, .15);--border-color: #262626;--correct-color: #10B981;--wrong-color: #EF4444;--wrong-dim: rgba(239, 68, 68, .15)}*{box-sizing:border-box;margin:0;padding:0;font-family:-apple-system,Inter,PingFang SC,system-ui,sans-serif}body{background-color:var(--bg-dark);color:var(--text-main);overflow:hidden}.app-fullscreen{width:100vw;height:100vh;display:flex;flex-direction:row;position:relative;overflow:hidden}.cloud-toast{position:fixed;top:0;left:50%;transform:translate(-50%);background:var(--panel-bg);border:1px solid var(--gold-main);color:var(--gold-main);padding:10px 24px;border-radius:30px;font-size:14px;font-weight:500;z-index:1000;box-shadow:0 8px 24px #000c}.left-sidebar{width:320px;min-width:320px;height:100vh;background:var(--panel-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;padding:32px 24px;box-shadow:4px 0 24px #00000080;z-index:10}.sidebar-header{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}.title-row{display:flex;align-items:center;gap:12px}.title-row h1{font-size:22px;font-weight:600;letter-spacing:1px}.gold-icon{color:var(--gold-main)}.cloud-badge{display:flex;align-items:center;gap:8px;color:var(--text-muted);font-size:12px;background:#ffffff0d;padding:6px 12px;border-radius:16px;width:fit-content}.stats-container{display:flex;flex-direction:column;gap:12px;margin-bottom:32px}.stat-box{background:var(--panel-bg-light);border:1px solid var(--border-color);padding:16px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.stat-label{font-size:13px;color:var(--text-muted);display:flex;align-items:center;gap:6px}.stat-value{font-size:28px;font-weight:600}.gold-text{color:var(--gold-main)}.wrong-text{color:var(--wrong-color)!important}@keyframes pulse-danger{0%{box-shadow:0 0 #ef444466;border-color:var(--wrong-color);background:var(--wrong-dim)}70%{box-shadow:0 0 0 10px #ef444400;border-color:var(--wrong-color);background:var(--wrong-dim)}to{box-shadow:0 0 #ef444400;border-color:var(--wrong-color);background:var(--wrong-dim)}}.danger-pulse{animation:pulse-danger 1s infinite}.history-section{flex:1;display:flex;flex-direction:column;overflow:hidden}.history-title{font-size:15px;color:var(--text-muted);display:flex;align-items:center;gap:8px;margin-bottom:16px;font-weight:500}.history-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding-right:8px}.history-list::-webkit-scrollbar{width:4px}.history-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.empty-history{color:var(--text-muted);font-size:13px;text-align:center;margin-top:20px;opacity:.5}.history-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:10px;font-size:15px;font-weight:500;background:var(--panel-bg-light);border-left:3px solid transparent}.history-correct{border-left-color:var(--correct-color);color:var(--text-main)}.history-wrong{border-left-color:var(--wrong-color);color:var(--text-muted);text-decoration:line-through}.history-answer-highlight{color:var(--gold-main);margin:0 4px;border-bottom:1px solid var(--gold-main);padding-bottom:2px}.history-wrong .history-answer-highlight{color:var(--wrong-color);border-bottom-color:var(--wrong-color)}.right-workspace{flex:1;min-width:0;height:100vh;display:flex;flex-direction:column;position:relative;background:radial-gradient(circle at center,#111,#050505);overflow:hidden}.center-content{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:20px;width:100%}.scrollable-center{overflow-y:auto;padding:40px 20px;justify-content:flex-start}.scrollable-center::-webkit-scrollbar{display:none}.gold-accent-line{width:60px;height:4px;background:var(--gold-main);margin-bottom:24px;border-radius:2px;flex-shrink:0;margin-top:auto}.hero-title{font-size:clamp(28px,4vw,48px);font-weight:600;margin-bottom:16px;letter-spacing:2px}.hero-sub{font-size:clamp(14px,2vw,20px);color:var(--text-muted);margin-bottom:40px}.keyboard-hint-box{display:flex;align-items:center;gap:12px;font-size:clamp(13px,1.5vw,16px);color:var(--text-main);background:var(--gold-dim);border:1px solid rgba(212,175,55,.3);padding:16px 24px;border-radius:12px;margin-bottom:48px;max-width:90%;text-align:left}.keyboard-hint-box strong{color:var(--gold-main);font-weight:600}.flex-shrink-0{flex-shrink:0}.grade-buttons-container{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;max-width:100%;margin-bottom:auto}.btn-grade{background:var(--panel-bg-light);border:1px solid var(--border-color);padding:clamp(20px,3vw,32px) clamp(24px,4vw,40px);border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:16px;cursor:pointer;transition:all .3s ease;width:clamp(160px,20vw,200px)}.btn-grade:hover{border-color:var(--gold-main);background:#d4af370d;box-shadow:0 8px 24px #0006}.grade-icon{color:var(--gold-main)}.grade-title{font-size:clamp(16px,2vw,20px);font-weight:600;color:var(--text-main)}.grade-desc{font-size:14px;color:var(--text-muted)}.btn-primary{background:transparent;border:2px solid var(--gold-main);color:var(--gold-main);padding:16px 32px;border-radius:12px;font-size:16px;font-weight:600;display:flex;align-items:center;gap:10px;cursor:pointer;transition:all .2s}.btn-primary:hover{background:var(--gold-main);color:var(--bg-dark)}.btn-secondary{background:var(--panel-bg-light);border:1px solid var(--border-color);color:var(--text-main);padding:16px 32px;border-radius:12px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:var(--border-color)}.action-buttons{display:flex;gap:16px;margin-top:20px;flex-wrap:wrap;justify-content:center}.play-content{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding:20px 5%;overflow:hidden}.progress-indicator{width:100%;max-width:600px;margin-bottom:8vh;display:flex;flex-direction:column;gap:12px}.progress-text{font-size:16px;color:var(--text-muted);text-align:center}.progress-track{width:100%;height:4px;background:var(--border-color);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--gold-main)}.inline-question-form{display:flex;flex-direction:column;align-items:center;width:100%;max-width:100%}.equation-container{display:flex;align-items:center;justify-content:center;gap:2vw;font-size:clamp(32px,6vw,80px);font-weight:300;color:var(--text-main);margin-bottom:6vh;flex-wrap:wrap;line-height:1.4;width:100%}.q-part{letter-spacing:2px;white-space:nowrap}.inline-input-wrapper{display:inline-flex;align-items:center;gap:1vw}.native-inline-input{width:2.5em;min-width:80px;background:transparent;border:none;border-bottom:4px solid var(--border-color);color:var(--gold-main);font-size:inherit;font-family:inherit;font-weight:500;text-align:center;padding:0 10px 8px;outline:none;transition:all .3s ease}.native-inline-input:focus{border-bottom-color:var(--gold-main)}.inline-input-wrapper.feedback-correct .native-inline-input{border-bottom-color:var(--correct-color);color:var(--correct-color)}.inline-input-wrapper.feedback-wrong .native-inline-input{border-bottom-color:var(--wrong-color);color:var(--wrong-color)}.feedback-icon-container{display:flex;align-items:center;justify-content:center;width:1em;height:1em}.correct-icon{color:var(--correct-color)}.wrong-icon{color:var(--wrong-color)}.enter-hint{margin-top:20px;font-size:14px;color:var(--text-muted);opacity:.6;letter-spacing:1px}.timeout-header{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:24px}.gameover-title{font-size:clamp(24px,3vw,36px);color:var(--text-muted);margin-bottom:40px}.final-score-display{width:clamp(150px,20vw,200px);height:clamp(150px,20vw,200px);border-radius:50%;border:3px dashed var(--gold-main);display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:32px;transition:all .3s ease}.final-score-display.border-wrong{border-color:var(--wrong-color)}.score-label{font-size:16px;color:var(--text-muted);margin-bottom:8px}.score-number{font-size:clamp(48px,8vw,72px);font-weight:600;color:var(--gold-main);line-height:1}.comment-text{font-size:clamp(16px,2vw,22px);color:var(--text-main);margin-bottom:32px;text-align:center;padding:0 20px}
