@import"https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;500;600;700;900&family=Noto+Sans+TC:wght@300;400;500;700&display=swap";:root{--bg-deep: #0a0a14;--bg-card: #12121f;--bg-card-hover: #1a1a2e;--bg-surface: #16162a;--gold-primary: #d4a853;--gold-light: #f0d78c;--gold-dim: #8b7335;--text-primary: #e8e4dc;--text-secondary: #9a9590;--text-dim: #5a5550;--correct: #4ade80;--correct-bg: rgba(74, 222, 128, .1);--wrong: #f87171;--wrong-bg: rgba(248, 113, 113, .1);--border: rgba(212, 168, 83, .15);--border-active: rgba(212, 168, 83, .4);--shadow: 0 4px 24px rgba(0, 0, 0, .4);--radius: 12px;--radius-sm: 8px}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{font-family:Noto Sans TC,sans-serif;background:var(--bg-deep);color:var(--text-primary);min-height:100vh;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 20% 20%,rgba(212,168,83,.03) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(100,80,200,.03) 0%,transparent 50%);pointer-events:none;z-index:0}#root{position:relative;z-index:1;min-height:100vh}.app-container{max-width:720px;margin:0 auto;padding:24px 20px 80px}.app-header{text-align:center;padding:32px 0 24px;border-bottom:1px solid var(--border);margin-bottom:32px}.app-title{font-family:"Noto Serif TC",serif;font-size:2rem;font-weight:700;color:var(--gold-primary);letter-spacing:.1em;margin-bottom:8px}.app-subtitle{font-size:.85rem;color:var(--text-secondary);letter-spacing:.05em}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:16px;transition:all .2s ease}.card-clickable{cursor:pointer}.card-clickable:hover{background:var(--bg-card-hover);border-color:var(--border-active);transform:translateY(-1px);box-shadow:var(--shadow)}.card-locked{opacity:.4;pointer-events:none}.stage-grid{display:flex;flex-direction:column;gap:12px}.stage-card{display:flex;align-items:center;gap:16px}.stage-icon{font-size:1.8rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg-surface);border-radius:var(--radius-sm);flex-shrink:0}.stage-info{flex:1}.stage-name{font-family:"Noto Serif TC",serif;font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}.stage-desc{font-size:.8rem;color:var(--text-secondary)}.stage-accuracy{font-size:.75rem;color:var(--gold-dim);margin-top:4px}.stage-lock{font-size:.75rem;color:var(--text-dim);font-style:italic}.stage-arrow{color:var(--gold-dim);font-size:1.2rem}.menu-section{margin-bottom:32px}.menu-section-title{font-family:"Noto Serif TC",serif;font-size:.85rem;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.15em;margin-bottom:12px;padding-left:4px}.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.menu-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 16px;cursor:pointer;text-align:center;transition:all .2s ease;color:var(--text-primary);font-family:Noto Sans TC,sans-serif}.menu-btn:hover{background:var(--bg-card-hover);border-color:var(--border-active);transform:translateY(-1px)}.menu-btn-icon{font-size:1.6rem;margin-bottom:8px}.menu-btn-label{font-size:.9rem;font-weight:500}.menu-btn-sub{font-size:.75rem;color:var(--text-secondary);margin-top:4px}.quiz-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border)}.quiz-progress{font-size:.85rem;color:var(--text-secondary)}.quiz-stage-label{font-family:"Noto Serif TC",serif;font-size:.9rem;color:var(--gold-primary)}.quiz-back-btn{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);padding:6px 14px;cursor:pointer;font-size:.8rem;font-family:Noto Sans TC,sans-serif;transition:all .2s}.quiz-back-btn:hover{border-color:var(--border-active);color:var(--text-primary)}.progress-bar-track{width:100%;height:3px;background:var(--bg-surface);border-radius:2px;margin-bottom:28px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold-primary));border-radius:2px;transition:width .3s ease}.question-text{font-family:"Noto Serif TC",serif;font-size:1.15rem;font-weight:600;line-height:1.7;color:var(--text-primary);margin-bottom:28px;padding:0 4px}.options-list{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.option-btn{display:flex;align-items:flex-start;gap:12px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 16px;cursor:pointer;text-align:left;transition:all .15s ease;color:var(--text-primary);font-family:Noto Sans TC,sans-serif;font-size:.9rem;line-height:1.6;width:100%}.option-btn:hover:not(.option-disabled){border-color:var(--gold-dim);background:var(--bg-card-hover)}.option-label{width:24px;height:24px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;color:var(--text-secondary);flex-shrink:0;margin-top:1px}.option-text{flex:1}.option-disabled{cursor:default}.option-correct{border-color:var(--correct)!important;background:var(--correct-bg)!important}.option-correct .option-label{border-color:var(--correct);color:var(--correct);background:#4ade8026}.option-wrong{border-color:var(--wrong)!important;background:var(--wrong-bg)!important}.option-wrong .option-label{border-color:var(--wrong);color:var(--wrong);background:#f8717126}.explanation-box{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 20px;margin-bottom:20px}.explanation-title{font-size:.75rem;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}.explanation-text{font-size:.85rem;color:var(--text-secondary);line-height:1.7;white-space:pre-line}.next-btn{width:100%;background:linear-gradient(135deg,var(--gold-dim),var(--gold-primary));border:none;border-radius:var(--radius-sm);color:var(--bg-deep);font-family:Noto Sans TC,sans-serif;font-size:.95rem;font-weight:600;padding:14px;cursor:pointer;transition:all .2s;letter-spacing:.05em}.next-btn:hover{opacity:.9;transform:translateY(-1px)}.results-header{text-align:center;padding:32px 0}.results-score{font-family:"Noto Serif TC",serif;font-size:3.5rem;font-weight:900;color:var(--gold-primary);margin-bottom:4px}.results-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:24px}.results-summary{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:32px}.summary-item{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;text-align:center}.summary-value{font-family:"Noto Serif TC",serif;font-size:1.5rem;font-weight:700;color:var(--text-primary)}.summary-value.correct{color:var(--correct)}.summary-value.wrong{color:var(--wrong)}.summary-label{font-size:.75rem;color:var(--text-secondary);margin-top:4px}.results-actions{display:flex;gap:12px}.results-actions .next-btn{flex:1}.btn-secondary{background:var(--bg-surface)!important;border:1px solid var(--border)!important;color:var(--text-primary)!important}.btn-secondary:hover{border-color:var(--border-active)!important}.stats-overview{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.stat-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:20px;text-align:center}.stat-value{font-family:"Noto Serif TC",serif;font-size:2rem;font-weight:700;color:var(--gold-primary)}.stat-label{font-size:.8rem;color:var(--text-secondary);margin-top:4px}.stage-stat-row{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border)}.stage-stat-row:last-child{border-bottom:none}.stage-stat-name{font-size:.9rem;color:var(--text-primary)}.stage-stat-bar{display:flex;align-items:center;gap:8px}.mini-bar-track{width:80px;height:4px;background:var(--bg-deep);border-radius:2px;overflow:hidden}.mini-bar-fill{height:100%;background:var(--gold-primary);border-radius:2px;transition:width .3s}.stage-stat-pct{font-size:.8rem;color:var(--text-secondary);width:40px;text-align:right}.wrong-item{padding:16px;border-bottom:1px solid var(--border)}.wrong-item:last-child{border-bottom:none}.wrong-question-text{font-size:.9rem;color:var(--text-primary);margin-bottom:8px;line-height:1.5}.wrong-answer-text{font-size:.8rem;color:var(--correct)}.wrong-count{font-size:.75rem;color:var(--wrong);margin-top:4px}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;padding:24px}.dialog-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:28px;max-width:360px;width:100%}.dialog-title{font-family:"Noto Serif TC",serif;font-size:1.1rem;margin-bottom:12px}.dialog-text{font-size:.85rem;color:var(--text-secondary);margin-bottom:20px;line-height:1.6}.dialog-actions{display:flex;gap:10px;justify-content:flex-end}.dialog-btn{padding:8px 20px;border-radius:var(--radius-sm);font-family:Noto Sans TC,sans-serif;font-size:.85rem;cursor:pointer;transition:all .2s;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-primary)}.dialog-btn:hover{border-color:var(--border-active)}.dialog-btn-danger{background:#f8717126;border-color:var(--wrong);color:var(--wrong)}.empty-state{text-align:center;padding:48px 24px;color:var(--text-secondary)}.empty-icon{font-size:2.5rem;margin-bottom:16px;opacity:.5}.empty-text{font-size:.9rem;line-height:1.6}@media(max-width:480px){.app-container{padding:16px 14px 60px}.app-title{font-size:1.6rem}.question-text{font-size:1.05rem}.menu-actions{grid-template-columns:1fr}.results-summary{grid-template-columns:1fr 1fr 1fr}.results-actions{flex-direction:column}}.custom-checkbox{width:28px;height:28px;border-radius:6px;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:transparent;flex-shrink:0;transition:all .15s ease}.custom-checkbox-checked{border-color:var(--gold-primary);background:#d4a85326;color:var(--gold-primary)}.card-selected{border-color:var(--border-active);background:var(--bg-card-hover)}.custom-toggle-all{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);padding:6px 14px;cursor:pointer;font-size:.8rem;font-family:Noto Sans TC,sans-serif;transition:all .2s}.custom-toggle-all:hover{border-color:var(--border-active);color:var(--text-primary)}.custom-total{font-size:.85rem;color:var(--text-secondary)}.custom-total-num{color:var(--gold-primary);font-weight:600}.custom-question-count{font-size:.75rem;color:var(--gold-dim);margin-top:4px}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .25s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .3s ease}