:root{--bg: #f5f6f8;--card: #ffffff;--text: #1a1a1a;--muted: #888;--primary: #2563eb;--high: #2563eb;--mid: #6b7280;--low: #b0b4bc;--error: #dc2626;--mastered: #16a34a;--border: #e5e7eb}@media(prefers-color-scheme:dark){:root{--bg: #111318;--card: #1c1f26;--text: #e7e9ee;--muted: #9aa0aa;--border: #2a2e38}}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:-apple-system,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;height:100%;max-width:760px;margin:0 auto}.topnav{display:flex;gap:4px;padding:10px 12px 0;background:var(--bg)}.topnav button{flex:1;padding:10px 0;border:none;border-radius:10px 10px 0 0;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;border-bottom:2px solid transparent}.topnav button.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.content{flex:1;overflow-y:auto;padding:16px}.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;margin:8px 0;box-shadow:0 1px 3px #0000000f}.word-front{text-align:center;padding:40px 0}.word-front .word{font-size:42px;font-weight:700;letter-spacing:.5px}.word-front .phonetic{font-size:20px;color:var(--muted);margin-top:12px}.badges{display:flex;gap:6px;justify-content:center;margin-top:16px;flex-wrap:wrap}.badge{font-size:12px;padding:3px 10px;border-radius:20px;background:var(--bg);border:1px solid var(--border)}.badge.high{color:#fff;background:var(--high);border-color:var(--high)}.badge.mid{color:#fff;background:var(--mid);border-color:var(--mid)}.badge.low{color:#fff;background:var(--low);border-color:var(--low)}.rating-bar{display:flex;gap:10px;margin-top:20px}.rating-bar button{flex:1;padding:16px 0;border-radius:12px;border:1px solid var(--border);font-size:17px;font-weight:600;cursor:pointer;background:var(--card);color:var(--text)}.rating-bar button.know{background:#dcfce7;border-color:#86efac;color:#166534}.rating-bar button.fuzzy{background:#fef9c3;border-color:#fde047;color:#854d0e}.rating-bar button.unknown{background:#fee2e2;border-color:#fca5a5;color:#991b1b}.back-meaning{font-size:20px;font-weight:700;margin-bottom:12px}.back-section{margin:14px 0}.back-section h4{font-size:13px;color:var(--muted);margin-bottom:6px}.example{font-size:15px;line-height:1.6;padding:10px 12px;background:var(--bg);border-radius:8px;margin:6px 0}.example .src{font-size:12px;color:var(--muted);margin-top:4px}.dynamic-tag{font-size:11px;color:#7c3aed;font-weight:600}.session-bar{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}.session-bar button{padding:8px 14px;border-radius:20px;border:1px solid var(--border);background:var(--card);color:var(--text);cursor:pointer;font-size:14px}.session-bar button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.progress{font-size:13px;color:var(--muted);margin-bottom:10px}.auth-wrap{display:flex;flex-direction:column;justify-content:center;height:100%;padding:24px}.auth-wrap h1{font-size:24px;margin-bottom:20px;text-align:center}.auth-wrap input{width:100%;padding:14px;border:1px solid var(--border);border-radius:10px;font-size:16px;margin-bottom:12px;background:var(--card);color:var(--text)}.auth-wrap .primary{width:100%;padding:14px;border:none;border-radius:10px;background:var(--primary);color:#fff;font-size:16px;font-weight:600;cursor:pointer}.auth-wrap .link{text-align:center;margin-top:12px;color:var(--primary);cursor:pointer;font-size:14px}.error-msg{color:var(--error);font-size:13px;margin-bottom:10px}.list-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--card);border:1px solid var(--border);border-radius:10px;margin:6px 0}.list-item .w{font-size:18px;font-weight:600}.list-item .sub{font-size:13px;color:var(--muted)}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat-box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px;text-align:center}.stat-box .num{font-size:30px;font-weight:700}.stat-box .label{font-size:13px;color:var(--muted);margin-top:4px}.btn{padding:10px 18px;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--text);cursor:pointer;font-size:14px}.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}.hint{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.5}
