:root{--bg: #f6f6f4;--fg: #1f2933;--muted: #6b7280;--line: #dcdcd6;--card: #ffffff;--accent: #1f4e79;--accent-soft: #e6eef6;--ok: #1d6b3a;--ok-soft: #e5f2ea;--bad: #9b1c1c;--bad-soft: #f8e7e7;--warn: #8a5a00;--warn-soft: #fbf1dc;--learning: #f3e3a1;--new: #dbe9f7;--radius: 6px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;--font-hk: "PingFang HK", "Noto Sans CJK HK", "Microsoft JhengHei", "PingFang TC", var(--font);color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--bg: #15181c;--fg: #e5e7eb;--muted: #9ca3af;--line: #2d333b;--card: #1d2228;--accent: #8ab4e0;--accent-soft: #22303f;--ok: #7fd19b;--ok-soft: #1b2e22;--bad: #f19a9a;--bad-soft: #352020;--warn: #e6b866;--warn-soft: #33291a;--learning: #5a4b17;--new: #1f3347}}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.5 var(--font);-webkit-text-size-adjust:100%}a{color:var(--accent)}h2{font-size:18px;margin:4px 0 10px;font-weight:600}h3{font-size:14px;margin:0 0 6px;font-weight:600}input,select,textarea,button{font:inherit;color:inherit}input,select,textarea{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:5px 8px}textarea{width:100%;margin:6px 0;font-family:var(--font-hk)}.yue,.target.yue,.prompt-text.yue,.stext.yue,.choice.yue,.order-line.yue,.order-pool.yue,.seltext.yue{font-family:var(--font-hk)}.boot{padding:40px;text-align:center;color:var(--muted)}.app{max-width:980px;margin:0 auto;padding:0 12px calc(24px + env(safe-area-inset-bottom))}.top{display:flex;align-items:center;gap:14px;padding:calc(8px + env(safe-area-inset-top)) 0 8px;border-bottom:1px solid var(--line);margin-bottom:12px;flex-wrap:wrap;position:sticky;top:0;background:var(--bg);z-index:5}.brand{font-weight:600;letter-spacing:.2px}.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:4px;overflow:hidden}.lang-switch button{border:0;background:var(--card);padding:3px 12px;cursor:pointer}.lang-switch button.on{background:var(--fg);color:var(--bg)}nav{display:flex;gap:2px;margin-left:auto;overflow-x:auto}nav a{padding:4px 9px;text-decoration:none;color:var(--muted);border-radius:4px;white-space:nowrap}nav a.on{color:var(--fg);background:var(--card);border:1px solid var(--line)}@media (max-width: 640px){.brand{display:none}nav{order:3;width:100%;margin-left:0}}.row{display:flex;align-items:center}.row.between{justify-content:space-between}.row.gap{gap:8px}.row.wrap,.wrap{flex-wrap:wrap}.row.center{justify-content:center}.grid{display:grid;gap:10px;margin-bottom:12px}.grid.two{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.stats-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px 10px}.stat .num{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}.stat .of{font-size:13px;color:var(--muted);font-weight:400}.stat .lbl{color:var(--muted);font-size:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin-bottom:12px}.muted{color:var(--muted)}.small{font-size:12px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.nowrap{white-space:nowrap}.err{color:var(--bad)}.warn-text{color:var(--warn)}.pre{white-space:pre-wrap}.empty{padding:24px;color:var(--muted);text-align:center}.notice{background:var(--accent-soft);border-radius:4px;padding:6px 10px;margin:8px 0}.notice.err{background:var(--bad-soft)}.btn{border:1px solid var(--line);background:var(--card);border-radius:4px;padding:5px 12px;cursor:pointer;line-height:1.4;touch-action:manipulation}.btn:hover:not(:disabled){border-color:var(--muted)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}@media (prefers-color-scheme: dark){.btn.primary{color:#10161d}}.btn.ghost{background:transparent}.btn.small{padding:1px 7px;font-size:12px}.btn.big{padding:12px 22px;font-size:17px}.btn.danger,.danger{color:var(--bad)}.btn.play.on{background:var(--accent-soft)}.src-tag{font-size:10px;color:var(--muted);margin-left:6px}.play-wrap{display:inline-flex;gap:6px;align-items:center}.link{background:none;border:0;padding:0;color:var(--accent);cursor:pointer;text-decoration:underline dotted}.num-input{width:74px}.chk{display:inline-flex;align-items:center;gap:4px}.tbl{width:100%;border-collapse:collapse}.tbl th,.tbl td{text-align:left;padding:5px 8px;border-bottom:1px solid var(--line);vertical-align:top}.tbl th{font-weight:500;color:var(--muted);font-size:12px}.tbl tbody tr[onclick],.path-tbl tr,.items-tbl tbody tr,.reader-list tr{cursor:pointer}.tbl tbody tr:hover{background:color-mix(in srgb,var(--accent-soft) 50%,transparent)}.tbl.form th{width:150px;font-size:13px;color:var(--fg)}.tbl tr.excluded td{opacity:.45}.tbl tr.error td{color:var(--bad)}.detail-row td{background:var(--bg)}.badges{display:inline-flex;gap:4px;flex-wrap:wrap;vertical-align:middle}.badge{display:inline-block;font-size:11px;padding:0 6px;border-radius:3px;border:1px solid var(--line);color:var(--muted);white-space:nowrap;font-family:var(--font)}.badge.reg-work{color:var(--ok);border-color:currentColor}.badge.reg-friends{color:var(--warn);border-color:currentColor}.badge.reg-profanity{color:var(--bad);border-color:currentColor}.badge.warn{color:var(--warn);background:var(--warn-soft);border-color:transparent}.badge.warn-soft{color:var(--warn);border-color:currentColor;border-style:dashed}.block{display:block}.uncertain{color:var(--warn);background:var(--warn-soft);border-bottom:1px dashed currentColor;border-radius:2px;padding:0 1px;cursor:help}.status{font-size:12px;color:var(--muted)}.status.st-current{color:var(--accent);font-weight:600}.status.st-done,.status.st-tested{color:var(--ok)}.st-locked .lesson-title{color:var(--muted)}.path .unit{margin-bottom:16px}.path-tbl .idx{width:28px;color:var(--muted);font-variant-numeric:tabular-nums}.lesson .actions{margin:8px 0 12px}.crumbs{margin-bottom:4px}.detail .target{font-size:22px;font-weight:500;margin:0}.detail.compact .target{font-size:18px}.rom{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.meaning{margin:6px 0}.detail>*+*{margin-top:6px}.examples{margin:6px 0;padding-left:18px}.examples li{margin:3px 0}.ex-zh{color:var(--muted)}.pattern{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg);border-radius:4px;padding:3px 8px;display:inline-block}.expl{margin:4px 0}.mistakes{background:var(--bad-soft);border-radius:4px;padding:6px 8px;font-size:13px}.mistakes .label{font-size:12px;color:var(--bad)}.conj{display:flex;gap:10px;flex-wrap:wrap}.conj .tbl{width:auto;min-width:220px}.notes .pre{font-size:13px;background:var(--bg);padding:6px 8px;border-radius:4px;margin-top:4px}.in-session{max-width:720px}.session{padding-top:calc(8px + env(safe-area-inset-top))}.session-bar{gap:8px}.progress{height:3px;background:var(--line);margin:6px 0 14px}.progress>div{height:100%;background:var(--accent);transition:width .2s}.intro .btn.primary{margin-top:4px}.exercise{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px}.ex-type{font-size:12px;color:var(--muted)}.instruction{margin:4px 0 8px;font-weight:500}.prompt{margin-bottom:12px}.prompt>*+*{margin-top:8px}.prompt-text{font-size:22px}.prompt-text.big{font-size:28px}.prompt-rom,.prompt-zh{font-size:16px}.choices{display:grid;gap:6px}.choices.grid2{grid-template-columns:1fr 1fr}@media (max-width: 520px){.choices.grid2{grid-template-columns:1fr}}.choice{text-align:left;border:1px solid var(--line);background:var(--card);border-radius:5px;padding:9px 12px;cursor:pointer;font-size:16px;touch-action:manipulation}.choice .key{color:var(--muted);font-size:11px;margin-right:6px;font-family:var(--font)}.choice.rom-opt{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px}.choice.right{background:var(--ok-soft);border-color:var(--ok)}.choice.wrong{background:var(--bad-soft);border-color:var(--bad)}.choice.dim{opacity:.55}.choices.big .choice{padding:16px;font-size:19px}.typed{display:flex;gap:6px;flex-wrap:wrap}.typed input{flex:1 1 220px;font-size:17px;padding:8px 10px}.accents{width:100%;display:flex;gap:3px;flex-wrap:wrap}.order-line,.order-pool{min-height:46px;display:flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:5px;margin-bottom:8px}.order-line{border:1px dashed var(--line)}.tile{border:1px solid var(--line);background:var(--card);border-radius:4px;padding:6px 10px;font-size:17px;cursor:pointer;touch-action:manipulation}.tile.placed{background:var(--accent-soft)}.shadow>*+*{margin-top:8px}.feedback{margin-top:12px;border-radius:5px;padding:10px 12px}.feedback.ok{background:var(--ok-soft)}.feedback.bad{background:var(--bad-soft)}.feedback>*+*{margin-top:6px}.feedback .target{font-size:19px}.hint{font-size:13px;color:var(--warn)}.more summary{cursor:pointer;font-size:12px;color:var(--muted)}.summary .tbl{margin:10px 0;max-width:460px}.subway .exercise,.subway .intro .card{font-size:16px}.subway .instruction{font-size:17px}.subway .btn{padding:10px 18px;font-size:16px}.reader-bar{margin:8px 0;position:sticky;top:52px;background:var(--bg);padding:6px 0;z-index:3}.sentences{list-style:none;padding:0;margin:0 0 120px}.sentence{display:flex;gap:6px;padding:6px 4px;border-bottom:1px solid var(--line)}.sentence.cur{background:var(--accent-soft)}.sp{align-self:flex-start;margin-top:3px}.stext{font-size:19px;line-height:1.7}.subway .stext{font-size:24px}.tok{cursor:pointer;border-radius:2px}.fr .tok.new,.legend .tok.new{background:var(--new)}.tok.learning{background:var(--learning)}.tok.known{background:transparent}.legend .tok.known{border-bottom:1px solid var(--line)}.tok.sel{outline:2px solid var(--accent);background:var(--accent-soft)}.szh{color:var(--muted)}.selbar{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:10px max(12px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom));z-index:10;box-shadow:0 -2px 10px #00000014}.seltext{font-size:20px}.save-form label{display:flex;gap:6px;align-items:center;margin-bottom:6px}.save-form input{flex:1}.legend{display:flex;gap:8px;align-items:center;margin:6px 0}.legend .sw{display:inline-block;width:10px;height:10px}.sw.study{background:var(--accent)}.sw.listen{background:var(--ok)}.search{min-width:200px}.bars{display:flex;align-items:flex-end;gap:2px;height:120px;margin:8px 0}.bar-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%}.bar{background:var(--accent);min-height:1px;display:flex;align-items:flex-end}.bar-listen{background:var(--ok);width:100%}.bar-lbl{font-size:9px;color:var(--muted);text-align:center}.dropzone{border:2px dashed var(--line);border-radius:var(--radius);padding:18px;text-align:center;margin-bottom:8px;background:var(--card)}.dropzone.drag{border-color:var(--accent);background:var(--accent-soft)}.issues td{font-size:12px}.uncertain-mark{color:var(--warn)}.tok.uncertain{border-bottom:1px dashed var(--warn);color:var(--warn)}.subway-pill{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:4px 12px;min-height:32px;font-size:13px;cursor:pointer;touch-action:manipulation}.subway-pill.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}.nav .ico,nav.tabs .ico{display:none}.notice.info{background:var(--accent-soft)}.audio-sync{font-size:13px}.gloss-btn{min-height:32px}.choice-sub{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--muted);margin-top:2px}.self-rate.rate{margin-top:10px}.self-rate.rate .btn{flex:1}.order-line.rom,.order-pool.rom .tile{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.rep-line{margin:2px 0 8px}.reinsert-note{color:var(--warn);margin-left:6px}.mode-card .switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer}.switch{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:51px;height:31px;border-radius:999px;background:var(--line);position:relative;flex:none;border:0;padding:0;cursor:pointer;transition:background .15s}.switch:after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0000004d;transition:transform .15s}.switch:checked{background:var(--ok)}.switch:checked:after{transform:translate(20px)}.center-v{align-items:center}.block-btn{width:100%}.resume{border-color:var(--accent)}@media (max-width: 640px),(pointer: coarse){html,body{font-size:15px}.app{padding:0 12px calc(76px + env(safe-area-inset-bottom))}.app.in-session{padding-bottom:calc(16px + env(safe-area-inset-bottom))}.top{gap:8px;flex-wrap:nowrap;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.top .lang-switch{margin-right:auto}.lang-switch button{padding:6px 14px;min-height:36px}nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;width:auto;margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:0;background:var(--card);border-top:1px solid var(--line);padding:2px env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overflow:visible}nav.tabs a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:52px;padding:4px 0;font-size:11px;border:0;border-radius:0;background:none}nav.tabs a.on{border:0;background:none;color:var(--accent);font-weight:600}nav.tabs .ico{display:block;font-size:19px;line-height:1.1}.btn{min-height:44px;padding:8px 14px}.btn.small{min-height:32px;padding:4px 10px;font-size:13px}.btn.big{min-height:52px}.choice{min-height:52px;padding:12px 14px;font-size:18px}.tile{min-height:44px;min-width:44px;font-size:18px}.typed input{font-size:18px;min-height:44px;flex:1 1 100%}.typed .btn{flex:1}input[type=checkbox]:not(.switch){width:22px;height:22px}.chk{min-height:40px}input[type=range]{width:150px}.tbl.form th{display:block;padding-bottom:0;text-align:left}.tbl.form td{display:block}.tbl.form tr{display:block;border-bottom:1px solid var(--line);padding:6px 0}.reader-bar{top:calc(52px + env(safe-area-inset-top))}.session-bar{position:sticky;top:0;background:var(--bg);z-index:5;padding-top:calc(6px + env(safe-area-inset-top))}.feedback .row .btn.primary{flex:1}}.bar-col{min-width:0}.bar-lbl{overflow:hidden;white-space:nowrap}@media (max-width: 640px){.bar-col:not(:nth-child(5n+1)) .bar-lbl{visibility:hidden}.page .card{overflow-x:auto}}.quick-len{margin:4px 0 10px}.quick-len input[type=range]{flex:1;width:auto;min-height:32px}
