:root{--bg: #f7f5f0;--surface: #ffffff;--ink: #1d1c1a;--muted: #6f6a62;--line: #e4dfd5;--accent: #b5452f;--accent-ink: #ffffff;--bubble: #ffffff;--bubble-mine: #95ec69;--bubble-mine-ink: #111;--new: #c9a227;--seen: #f3e7c6;--right: #2f7d4f;--wrong: #b5452f;--shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 4px 16px rgba(0, 0, 0, .05);--zh: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;color-scheme:light}@media(prefers-color-scheme:dark){:root{--bg: #121212;--surface: #1d1d1d;--ink: #ece8e1;--muted: #9a958c;--line: #2e2c29;--accent: #e0765f;--accent-ink: #121212;--bubble: #262626;--bubble-mine: #3e7a2c;--bubble-mine-ink: #f1f1f1;--seen: #3a3320;--shadow: none;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink)}body{font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,var(--zh),sans-serif;-webkit-text-size-adjust:100%}.zh{font-family:var(--zh)}button{font:inherit;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 14px;cursor:pointer}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}button.ghost{background:none;border:none;padding:6px 10px;font-size:18px}button.link{background:none;border:none;color:var(--muted);text-decoration:underline;padding:6px 0}input,textarea{font:inherit;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}textarea{resize:vertical}h2{margin:8px 0 16px;font-size:26px}h3{margin:4px 0 10px;font-size:17px}.muted{color:var(--muted)}.small{font-size:13px}.error{color:var(--wrong);margin:8px 0}.app{max-width:640px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}main{flex:1;padding-bottom:72px}.app.full main{padding-bottom:0}.page{padding:16px;padding-top:max(16px,env(safe-area-inset-top))}.card{display:block;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;margin:0 0 12px;box-shadow:var(--shadow)}.card.hero .title{font-size:28px;margin:4px 0}.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600}.list-item{display:block;width:100%;text-align:left;margin-bottom:8px}.one-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row{display:flex;gap:8px;margin-top:10px}.row>*{flex:1}.row.wrap{flex-wrap:wrap}.row.wrap>*{flex:1 1 40%}.row.three>*{flex:1}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.chip{display:inline-flex;gap:4px;align-items:baseline;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-size:14px;margin:2px}.chip small{color:var(--muted)}.tabs{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.tabs button{flex:1;max-width:213px;border:none;background:none;border-radius:0;padding:8px 0 10px;display:flex;flex-direction:column;align-items:center;font-size:12px;color:var(--muted)}.tabs button .zh{font-size:20px;line-height:1.2}.tabs button.on{color:var(--accent)}.login{max-width:360px;margin:18vh auto 0;padding:16px;text-align:center}.login .logo{font-size:56px;color:var(--accent)}.login form{display:flex;flex-direction:column;gap:10px;margin-top:16px}.bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:6px;padding:8px;padding-top:max(8px,env(safe-area-inset-top));background:var(--bg);border-bottom:1px solid var(--line)}.bar-title{flex:1;min-width:0}.bar-title .zh{font-size:18px;font-weight:600}.bar-title .sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reader{padding-bottom:160px}.passage{padding:12px 14px;font-family:var(--zh);font-size:21px;line-height:2.1}.passage.post .para{margin-bottom:8px}.group-title{text-align:center;color:var(--muted);font-size:14px;margin:4px 0 10px}.line.msg{display:flex;flex-direction:column;align-items:flex-start;margin:6px 0}.line.msg.mine{align-items:flex-end}.who{font-size:12px;color:var(--muted);margin:0 0 0 6px;line-height:1.3}.bubble{background:var(--bubble);border-radius:12px;padding:4px 12px;max-width:86%;box-shadow:var(--shadow);border:1px solid var(--line)}.mine .bubble{background:var(--bubble-mine);color:var(--bubble-mine-ink);border-color:transparent}.w{cursor:pointer;border-radius:4px;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.w.new,.w.taught{text-decoration:underline;text-decoration-color:var(--new);text-decoration-thickness:2px;text-underline-offset:6px}.w.seen{background:var(--seen)}.mine .w.seen{background:#ffffff59}.w.active{outline:2px solid var(--accent)}ruby rt{font-family:-apple-system,sans-serif;font-size:11px;color:var(--muted)}.mine ruby rt{color:inherit;opacity:.75}.tk.punct,.tk.emoji{color:var(--muted)}.tk.mention{color:#3b6fb6}.pop{position:fixed;left:8px;right:8px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;max-width:624px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px;box-shadow:0 8px 30px #00000040}.pop-head{display:flex;align-items:baseline;gap:12px}.pop-head .close{margin-left:auto}.big{font-size:30px}.py{color:var(--accent);font-size:18px}.meaning .cg{font-size:18px;margin:6px 0 2px}.chars{margin-top:8px;border-top:1px solid var(--line);padding-top:6px}.char{font-size:15px}.char .zh{font-size:20px}.char .py{font-size:15px}.dock{position:fixed;left:0;right:0;bottom:0;z-index:4;padding:10px 14px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 30%);max-width:640px;margin:0 auto}.dock .hint{font-size:12px;color:var(--muted);text-align:center;margin-bottom:6px}.dock button{width:100%}.finish{margin:8px 14px 24px;width:auto}.question{margin-bottom:14px}.question .q{font-weight:600;margin-bottom:6px}.option{display:block;width:100%;text-align:left;margin:4px 0}.option.right{border-color:var(--right);color:var(--right);font-weight:600}.option.wrong{border-color:var(--wrong);color:var(--wrong)}.option.dim{opacity:.55}.explain{background:var(--bg);border-radius:10px;padding:10px 12px;margin:8px 0;white-space:pre-wrap}.recap>div{margin:6px 0}.sheet-wrap{position:fixed;inset:0;z-index:30;background:#00000059;display:flex;align-items:flex-end}.sheet{width:100%;max-width:640px;margin:0 auto;max-height:80vh;overflow:auto;background:var(--surface);border-radius:18px 18px 0 0;padding:16px 16px calc(20px + env(safe-area-inset-bottom))}.sheet .sentence{font-size:20px;line-height:1.7}.ladder .rung{border-top:1px solid var(--line);padding:8px 0}.rung .reg{font-size:12px;text-transform:uppercase;color:var(--accent);letter-spacing:.06em}.rung .zh{font-size:19px}.rung .py{font-size:14px}.chatview{display:flex;flex-direction:column;height:100dvh}.msgs{flex:1;overflow-y:auto;padding:12px 14px;font-family:var(--zh);font-size:19px;line-height:1.8}.typing{color:var(--muted)}.composer{display:flex;gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}.composer button{flex:0 0 auto}.feedback{font-family:-apple-system,sans-serif;font-size:15px}.point{border-top:1px solid var(--line);padding:8px 0}.point .zh{font-size:19px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px}.stat .n{font-size:28px;font-weight:700}.stat .label{font-size:13px;color:var(--muted)}.charlist{display:flex;flex-wrap:wrap;gap:6px}.charcell{display:inline-flex;flex-direction:column;align-items:center;width:40px}.charcell .zh{font-size:22px}.bar-mini{width:30px;height:4px;background:var(--line);border-radius:2px;overflow:hidden}.bar-mini span{display:block;height:100%;background:var(--accent)}.big-list{font-size:22px;letter-spacing:.15em}.read-row{display:flex;justify-content:space-between;gap:8px;font-size:14px;padding:4px 0;border-top:1px solid var(--line)}.read-row:first-of-type{border-top:none}