:root{--bg:#f5f6fa;--panel:#fff;--text:#1c2333;--muted:#7a8199;--primary:#4f6ef7;--primary-soft:#e8edff;--good:#2fb37a;--good-soft:#e2f7ee;--hard:#e6a23c;--hard-soft:#fdf3e3;--again:#e05260;--again-soft:#fdeaec;--line:#e8eaf2;--radius:16px}@media (prefers-color-scheme:dark){:root{--bg:#10131c;--panel:#1a1f2e;--text:#e8eaf2;--muted:#8b93ab;--primary:#6d87ff;--primary-soft:#232c47;--good-soft:#17322a;--hard-soft:#332a1a;--again-soft:#33191d;--line:#262c3d}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Segoe UI,Microsoft YaHei,sans-serif}.app{flex-direction:column;max-width:520px;height:100%;margin:0 auto;display:flex}.content{padding:16px 16px calc(16px + env(safe-area-inset-bottom));flex:1;overflow-y:auto}.page-center{height:100%;color:var(--muted);justify-content:center;align-items:center;font-size:15px;display:flex}.page-center.error{color:var(--again);padding:24px}.tabbar{border-top:1px solid var(--line);background:var(--panel);padding-bottom:env(safe-area-inset-bottom);display:flex}.tab{color:var(--muted);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;padding:8px 0 10px;font-size:12px;display:flex}.tab-icon{font-size:20px}.tab.active{color:var(--primary);font-weight:600}.study-page{flex-direction:column;gap:14px;min-height:100%;display:flex}.study-header{flex-direction:column;gap:4px;font-size:14px;display:flex}.study-header b{font-size:15px}.muted{color:var(--muted);margin-left:8px;font-size:13px}.trim-hint{color:var(--hard);background:var(--hard-soft);border-radius:8px;padding:4px 10px;font-size:12px}.card{background:var(--panel);border-radius:var(--radius);border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;min-height:300px;padding:28px 22px;display:flex}.word{text-align:center;letter-spacing:.5px;word-break:break-word;font-size:40px;font-weight:700}.word-small{margin-bottom:12px;font-size:26px}.phonetic{color:var(--muted);justify-content:center;align-items:center;gap:8px;margin-top:10px;font-size:16px;display:flex}.tier-badge{color:var(--primary);background:var(--primary-soft);border-radius:999px;padding:2px 8px;font-size:11px}.icon-btn{background:var(--primary-soft);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:15px;display:flex}.flip-hint{text-align:center;color:var(--muted);margin-top:26px;font-size:12px}.senses{margin:0 0 14px;padding:0;font-size:17px;line-height:1.65;list-style:none}.senses .pos{color:var(--primary);margin-right:6px;font-size:14px;font-style:normal}.sentence{border-top:1px solid var(--line);padding-top:12px;font-size:14px}.sentence .en{margin:0 0 4px;line-height:1.5}.sentence .cn{color:var(--muted);margin:0;font-size:13px}.family{flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px;display:flex}.family-label{color:var(--muted);margin-right:2px;font-size:12px}.chip{border:1px solid var(--line);background:var(--bg);color:var(--text);cursor:pointer;border-radius:999px;padding:3px 10px;font-size:13px}.btn-flip{background:var(--primary);color:#fff;cursor:pointer;letter-spacing:6px;border:none;border-radius:14px;padding:15px;font-size:17px;font-weight:600}.rating-row{gap:10px;display:flex}.btn-rate{cursor:pointer;border:none;border-radius:14px;flex:1;padding:15px 0;font-size:16px;font-weight:600}.btn-again{background:var(--again-soft);color:var(--again)}.btn-hard{background:var(--hard-soft);color:var(--hard)}.btn-good{background:var(--good-soft);color:var(--good)}.done-card{text-align:center;background:var(--panel);border-radius:var(--radius);border:1px solid var(--line);width:100%;max-width:360px;padding:36px 28px}.done-emoji{font-size:52px}.summary{justify-content:center;gap:26px;margin:18px 0 22px;display:flex}.summary-item{flex-direction:column;display:flex}.summary-item b{font-size:26px}.summary-item span{color:var(--muted);font-size:12px}.btn-primary{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;padding:12px 26px;font-size:15px;font-weight:600}.btn-secondary{border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;border-radius:12px;padding:12px 26px;font-size:15px}.dashboard{flex-direction:column;gap:14px;display:flex}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px}.panel h3{margin:0 0 14px;font-size:15px}.ring-panel{flex-direction:column;align-items:center;gap:8px;display:flex}.ring{width:150px}.ring-bg{stroke:var(--line)}.ring-fg{stroke:var(--primary);transition:stroke-dasharray .4s}.ring-num{fill:var(--text);font-size:28px;font-weight:700}.ring-sub{fill:var(--muted);font-size:13px}.streak{color:var(--muted);font-size:14px}.streak b{color:var(--hard)}.stat-row{align-items:center;gap:10px;margin-bottom:10px;display:flex}.stat-label{width:52px;color:var(--muted);flex-shrink:0;font-size:13px}.stat-track{background:var(--bg);border-radius:999px;flex:1;height:10px;overflow:hidden}.stat-fill{border-radius:999px;height:100%}.bar-learning{background:var(--primary)}.bar-fuzzy{background:var(--hard)}.bar-mastered{background:var(--good)}.bar-new{background:var(--muted);opacity:.4}.stat-num{text-align:right;font-variant-numeric:tabular-nums;width:44px;font-size:14px}.week{justify-content:space-between;align-items:flex-end;padding:0 4px;display:flex}.day{flex-direction:column;align-items:center;gap:6px;display:flex}.day-bar-wrap{align-items:flex-end;height:68px;display:flex}.day-bar{background:var(--primary);border-radius:6px 6px 2px 2px;width:18px}.day-label{color:var(--muted);font-size:11px}.settings{flex-direction:column;gap:14px;display:flex}.field{flex-direction:column;gap:8px;margin-bottom:14px;font-size:14px;display:flex}.field input[type=range]{width:100%;accent-color:var(--primary)}.hint{color:var(--muted);margin:6px 0 0;font-size:12px;line-height:1.6}.seg{background:var(--bg);border-radius:12px;gap:4px;padding:4px;display:flex}.seg-btn{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:9px;flex:1;padding:9px 0;font-size:14px}.seg-btn.active{background:var(--primary);color:#fff;font-weight:600}.btn-row{gap:10px;display:flex}.msg{color:var(--good);margin:10px 0 0;font-size:13px}.about p{margin:4px 0;font-size:13px}
