:root{--bg: #f7f6f3;--card: #ffffff;--ink: #1f2328;--muted: #646b73;--line: #e5e3de;--red: #b42318;--red-2: #912018;--red-soft: #fdf0ee;--blue: #1d4ed8;--blue-soft: #eef3fe;--ok: #15803d;--ok-soft: #e8f6ec;--warn: #b45309;--warn-soft: #fef6e7;--bad: #b91c1c;--bad-soft: #fdecec;--radius: 14px;--shadow: 0 1px 2px rgba(30, 25, 20, .05), 0 4px 14px rgba(30, 25, 20, .05);--cn: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;--ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--ui)}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--red)}h1,h2,h3,h4{line-height:1.3;margin:0 0 .4em}h4{display:flex;align-items:center;gap:6px;margin-top:1em}p{margin:0 0 .7em}.cn{font-family:var(--cn)}.muted{color:var(--muted)}.small{font-size:.875rem}.center{text-align:center}.right{text-align:right}.nowrap{white-space:nowrap}.mt{margin-top:1.4em}.err{color:var(--bad)}.app{min-height:100vh;padding-bottom:84px}.topbar{position:sticky;top:0;z-index:20;background:#fffffff2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:8px 16px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.brand b{display:block}.brand small{display:block;color:var(--muted);font-size:.78rem;white-space:nowrap}.logo{width:38px;height:38px;border-radius:10px;background:var(--red);color:#fff;display:grid;place-items:center;font:700 21px/1 var(--cn);flex:none}.nav{display:flex;gap:2px;margin-left:auto}.nav a{display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--muted);font-weight:600;font-size:.9rem;white-space:nowrap}.nav a:hover{background:var(--red-soft);color:var(--red-2)}.nav a.on{background:var(--red);color:#fff}.main{max-width:920px;margin:0 auto;padding:18px 14px}@media(max-width:960px){.nav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);padding:4px 2px calc(4px + env(safe-area-inset-bottom));justify-content:space-around;z-index:30}.nav a{flex-direction:column;gap:1px;font-size:.64rem;padding:5px 2px;flex:1;min-width:0}.nav a span{overflow:hidden;text-overflow:ellipsis;max-width:100%}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px 16px;min-height:44px;font-weight:600;cursor:pointer;text-decoration:none;color:var(--ink)}.btn:disabled{opacity:.45;cursor:default}.btn:active:not(:disabled){transform:scale(.98)}.btn.primary{background:var(--red);border-color:var(--red);color:#fff}.btn.primary:hover:not(:disabled){background:var(--red-2)}.btn.ghost:hover:not(:disabled){border-color:var(--red);color:var(--red-2)}.btn.ok{color:var(--ok);border-color:#bfe3cb;background:var(--ok-soft)}.btn.warn{color:var(--warn);border-color:#f3d9a8;background:var(--warn-soft)}.btn.sm{padding:7px 12px;min-height:38px;font-size:.88rem}.btn.xs{padding:4px 10px;min-height:30px;font-size:.8rem;border-radius:8px}.btn.icon-only{padding:4px 8px}.btn.wide{width:100%;margin-top:12px}.btn.push{margin-left:auto}.btn.rec-on{background:var(--bad);border-color:var(--bad);color:#fff;animation:pulse 1.4s infinite}@keyframes pulse{50%{opacity:.75}}.linklike{background:none;border:0;color:var(--red);text-decoration:underline;cursor:pointer;padding:0}.audio-btn{display:inline-flex;align-items:center;gap:6px;border-radius:999px;border:1px solid #f2c9c4;background:var(--red-soft);color:var(--red-2);padding:0 14px;height:40px;min-width:40px;justify-content:center;cursor:pointer;font-weight:600;vertical-align:middle;flex:none}.audio-btn.lg{height:48px;padding:0 22px;margin:6px 0 10px}.audio-btn.sm{height:32px;min-width:32px;padding:0 8px}.audio-btn.blue{background:var(--blue-soft);border-color:#c9d7fb;color:var(--blue)}.audio-btn.on{background:var(--red);color:#fff;border-color:var(--red)}.audio-btn.blue.on{background:var(--blue);border-color:var(--blue)}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:14px}.card.empty{text-align:center;padding:36px 18px}.page-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}.page-head>svg{color:var(--red);margin-top:4px;flex:none}.page-head h2{margin:0}.item-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}.item-head h3{margin:0}.item-head>svg{color:var(--red)}.pill{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:999px;background:#f1f0ec;font-size:.8rem;font-weight:600}.pill.ok{background:var(--ok-soft);color:var(--ok)}.pill.bad{background:var(--bad-soft);color:var(--bad)}.pill.muted{color:var(--muted)}.lang-tag{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}.lang-tag.vi{background:var(--blue-soft);color:var(--blue)}.lang-tag.zh{background:var(--red-soft);color:var(--red-2)}.tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:12px;padding-bottom:2px}.tabs a{padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:.9rem;white-space:nowrap}.tabs a.on{background:var(--ink);border-color:var(--ink);color:#fff}.tab-count{margin-left:6px;font-size:.75rem;opacity:.7}.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}.seg{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px}.seg.wrap{flex-wrap:wrap}.seg button{border:0;background:none;padding:6px 12px;border-radius:8px;cursor:pointer;font-weight:600;font-size:.87rem;color:var(--muted)}.seg.sm button{padding:4px 10px;font-size:.82rem}.seg button.on{background:var(--red);color:#fff}.check{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;cursor:pointer}.check input{width:18px;height:18px;accent-color:var(--red)}.select{display:inline-flex;align-items:center;gap:6px;font-size:.9rem}.select select{padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:#fff}.progress{position:relative;height:22px;background:#efede8;border-radius:999px;overflow:hidden;margin:6px 0 10px}.progress-bar{height:100%;background:linear-gradient(90deg,#e0584c,var(--red));border-radius:999px;transition:width .3s}.progress-label{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:.78rem;font-weight:700}.howto{display:flex;gap:10px;background:var(--warn-soft);border:1px solid #f3dfb6;border-radius:12px;padding:10px 14px;font-size:.92rem;margin-bottom:12px}.howto svg{flex:none;color:var(--warn);margin-top:3px}.back{display:inline-flex;align-items:center;gap:4px;font-size:.9rem;margin-bottom:8px;text-decoration:none;font-weight:600}.nav-row{display:flex;justify-content:space-between;align-items:center;gap:8px}.score-line{font-size:1.05rem;background:var(--ok-soft);color:var(--ok);padding:8px 12px;border-radius:10px}.hero{display:flex;gap:18px;align-items:center;background:linear-gradient(135deg,#fff,#fdf0ee);border:1px solid #f3d5d0;border-radius:var(--radius);padding:22px;margin-bottom:14px}.hero h1{font-size:1.7rem}.eyebrow{color:var(--red);font-weight:700;font-size:.85rem;margin-bottom:4px;font-family:var(--cn)}.countdown-big{flex:none;background:var(--red);color:#fff;border-radius:18px;padding:14px 20px;text-align:center;display:flex;flex-direction:column;min-width:130px}.countdown-big b{font-size:3rem;line-height:1}.countdown-big small{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:6px;opacity:.9}@media(max-width:640px){.hero{flex-direction:column;align-items:stretch;padding:18px}.hero h1{font-size:1.4rem}}.tasks{display:grid;gap:6px}.task{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:#faf9f6}.task span{flex:1}.task.done span{text-decoration:line-through;color:var(--muted)}.task-check{border:0;background:none;cursor:pointer;color:var(--muted);padding:0;display:grid}.task.done .task-check{color:var(--ok)}.plan-all{margin-top:12px}.plan-all summary{cursor:pointer;font-weight:600;color:var(--red)}.plan-week{margin-top:10px;padding:8px 12px;border-left:3px solid var(--line)}.plan-week.cur{border-color:var(--red);background:var(--red-soft);border-radius:0 10px 10px 0}.plan-week ul{margin:4px 0 0;padding-left:20px}.plan-week li.done{text-decoration:line-through;color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}.stat{border:1px solid var(--line);border-radius:12px;padding:10px 12px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}.stat .progress{margin-bottom:0}.table-wrap{overflow-x:auto}.grid-table{width:100%;border-collapse:collapse;font-size:.92rem}.grid-table th,.grid-table td{border-bottom:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}.grid-table th{background:#faf9f6;font-size:.82rem;color:var(--muted)}.levels{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.level{border-radius:12px;padding:8px 12px;display:flex;flex-direction:column;background:#f4f3ef}.level b{font-size:1.3rem}.level small{color:var(--muted);line-height:1.35}.level.lA{background:#e8f6ec}.level.lB{background:#eef3fe}.level.lC{background:#fef6e7}.notes{padding-left:20px}.notes li{margin-bottom:4px}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.tip{background:#faf9f6;border-radius:12px;padding:12px}.tip p{margin:4px 0 0;font-size:.92rem}.strip{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}.strip-dot{width:34px;height:30px;border-radius:8px;border:1px solid var(--line);background:#fff;font-size:.78rem;font-weight:700;cursor:pointer;color:var(--muted)}.strip-dot.ok{background:var(--ok-soft);border-color:#bfe3cb;color:var(--ok)}.strip-dot.bad{background:var(--bad-soft);border-color:#f5c2c2;color:var(--bad)}.strip-dot.done{background:#f1f0ec;color:var(--ink)}.strip-dot.cur{outline:2px solid var(--red);outline-offset:1px}.question{font-weight:700;font-size:1.05rem;margin:10px 0 8px}.src-sentence{font-size:1.15rem;font-weight:600;background:#faf9f6;border-radius:12px;padding:12px 14px}.options{display:grid;gap:8px;margin-bottom:10px}.option{display:flex;gap:10px;align-items:flex-start;text-align:left;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;cursor:pointer;font-size:1rem;line-height:1.5}.option:hover:not(:disabled){border-color:var(--red)}.option:disabled{cursor:default}.opt-letter{flex:none;width:26px;height:26px;border-radius:50%;background:#f1f0ec;display:grid;place-items:center;font-weight:700;font-size:.82rem}.option.right{border-color:var(--ok);background:var(--ok-soft)}.option.right .opt-letter{background:var(--ok);color:#fff}.option.wrong{border-color:var(--bad);background:var(--bad-soft)}.option.wrong .opt-letter{background:var(--bad);color:#fff}.option.dim{opacity:.55}.option.chosen{border-color:var(--red);background:var(--red-soft)}.option.chosen .opt-letter{background:var(--red);color:#fff}.explain{background:var(--warn-soft);border-radius:10px;padding:10px 12px;font-size:.93rem}.sub-q{border-top:1px dashed var(--line);padding-top:6px;margin-top:8px}.transcript{margin-top:10px;display:grid;gap:6px}.t-line{display:flex;gap:8px;align-items:flex-start;background:#faf9f6;border-radius:10px;padding:8px 10px}.t-line>span:nth-child(2){flex:1}.spk{flex:none;font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:999px;margin-top:3px;background:var(--blue-soft);color:var(--blue)}.spk.B{background:#fbeef7;color:#a21caf}.line{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px;background:#fff;border-left:4px solid var(--red)}.line.vi{border-left-color:var(--blue)}.line.active{box-shadow:0 0 0 3px #f9d8d3}.line-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.who{font-size:.78rem;font-weight:700;color:var(--red-2)}.who.vi{color:var(--blue)}.line-act{margin-left:auto;display:flex;gap:6px}.countdown{background:var(--red);color:#fff;font-weight:700;font-size:.82rem;padding:2px 10px;border-radius:999px}.countdown.soft{background:var(--red-soft);color:var(--red-2)}.line-src{font-size:1.05rem;margin-bottom:6px}.line-src.blur{filter:blur(6px);-webkit-user-select:none;user-select:none}.line-ans{display:flex;gap:8px;align-items:flex-start;justify-content:space-between;background:#f5f8ff;border-radius:10px;padding:8px 10px}.recorder{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;align-items:flex-start}.clip{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.clip audio{height:36px;max-width:100%}.list{display:grid;gap:8px}.list-item{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;text-decoration:none;color:var(--ink)}.list-item:hover{border-color:var(--red)}.list-item .num{width:30px;height:30px;border-radius:50%;background:var(--red-soft);color:var(--red-2);display:grid;place-items:center;font-weight:700;flex:none}.li-main{flex:1;display:flex;flex-direction:column}.ok-ic{color:var(--ok);flex:none}.prep{margin:8px 0 12px}.mini-table{border-collapse:collapse;margin:8px 0;width:100%;font-size:.92rem}.mini-table td{border-bottom:1px solid var(--line);padding:6px 8px}.tips{padding-left:20px;font-size:.92rem}.src-box{background:#faf9f6;border-radius:12px;padding:12px 14px;margin-bottom:10px;font-size:1.02rem}.src-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.timer-box{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;background:#fff}.timer-box.warn{border-color:#f3d9a8;background:var(--warn-soft)}.timer-box.over{border-color:var(--bad);background:var(--bad-soft)}.timer-num{font-size:1.25rem;font-variant-numeric:tabular-nums;margin-right:auto}textarea.answer{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px;font-size:1.02rem;line-height:1.7;resize:vertical;min-height:200px}textarea.answer:focus{outline:none;border-color:var(--red)}.ref-box{background:var(--ok-soft);border-radius:12px;padding:12px 14px;margin:12px 0}.ref-box.mine{background:#f4f3ef}.ref-box h4{margin-top:.4em}.points{display:grid;gap:6px}.point{background:#fff;border-radius:10px;padding:8px 10px}.self-score{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:12px 0}.crit{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0;border-bottom:1px dashed var(--line)}.search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 12px;margin-bottom:12px}.search input{border:0;outline:none;flex:1;padding:11px 0;background:none}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font-size:.86rem;font-weight:600;cursor:pointer}.chip small{color:var(--muted);margin-left:4px}.chip.on{background:var(--red);border-color:var(--red);color:#fff}.chip.on small{color:#fde3df}.word-row{display:grid;grid-template-columns:minmax(130px,1.1fr) minmax(100px,.9fr) minmax(140px,1.4fr) 38px;gap:6px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.word-row.known{opacity:.6}.w-zh{display:flex;align-items:center;gap:6px;font-size:1.15rem;font-weight:600}.w-py{color:var(--muted);font-size:.88rem}.w-vi{display:flex;align-items:center;justify-content:space-between;gap:6px}.w-note{grid-column:1 / 4;font-size:.85rem;color:var(--muted);display:flex;flex-direction:column;gap:2px}.w-ex{display:flex;flex-direction:column;border-left:3px solid var(--line);padding-left:8px}.known-btn{grid-column:4;grid-row:1;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:#c8c5bd;cursor:pointer;display:grid;place-items:center}.known-btn.on{background:var(--ok);border-color:var(--ok);color:#fff}@media(max-width:640px){.word-row{grid-template-columns:1fr 38px}.w-zh,.w-py,.w-vi,.w-note{grid-column:1}.known-btn{grid-column:2;grid-row:1}}.flashcard{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);min-height:240px;padding:24px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;cursor:pointer;margin-bottom:12px}.flashcard.flipped{border-color:#f3d5d0}.fc-front{font-size:1.6rem;font-weight:700}.fc-front.cn{font-size:2.1rem}.fc-py{color:var(--muted)}.fc-back{display:flex;flex-direction:column;gap:4px;font-size:1.15rem}.fc-back .big{font-size:1.7rem;font-weight:700}.fc-audio{display:flex;gap:8px}.fc-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.mock-card{display:flex;flex-direction:column;gap:6px;text-align:left;cursor:pointer;font-size:1.05rem}.mock-card svg{color:var(--red)}.mock-card:hover{border-color:var(--red)}.mock-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.clock{font-weight:700;font-variant-numeric:tabular-nums;background:#f1f0ec;padding:2px 10px;border-radius:999px}.clock.warn{background:var(--bad-soft);color:var(--bad)}.result{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}.result>svg{color:#d29b16}.result h2{font-size:2rem;margin:0}.level-big{font-weight:800;font-size:1.2rem;padding:2px 16px;border-radius:999px;background:#f1f0ec}.level-big.lA{background:var(--ok-soft);color:var(--ok)}.level-big.lB{background:var(--blue-soft);color:var(--blue)}.level-big.lC{background:var(--warn-soft);color:var(--warn)}.result .mini-table{max-width:420px;text-align:left}.review{padding:8px 0;border-bottom:1px solid var(--line)}.review summary{cursor:pointer;font-weight:600}details.card>summary{cursor:pointer;font-weight:700}.ok-t{color:var(--ok)}.bad-t{color:var(--bad)}.review .card{color:var(--ink);margin-top:8px}.hist-row{display:grid;grid-template-columns:100px 60px 130px 1fr;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);align-items:center}@media(max-width:640px){.hist-row{grid-template-columns:1fr 1fr}}