:root{--bg: #faf9f5;--surface: #ffffff;--text: #21201d;--muted: #6b6a64;--line: #e8e6df;--accent: #185fa5;--accent-bg: #e6f1fb;--vocab-bg: #eeedfe;--vocab: #3c3489;--vocab-mid: #7f77dd;--conn-bg: #e1f5ee;--conn: #085041;--conn-mid: #1d9e75;--gram-bg: #faece7;--gram: #712b13;--gram-mid: #d85a30;--idiom-bg: #fbeaf0;--idiom: #72243e;--idiom-mid: #d4537e;--lv-a1: #3b6d11;--lv-a1-bg: #eaf3de;--lv-a2: #854f0b;--lv-a2-bg: #faeeda;--lv-b1: #185fa5;--lv-b1-bg: #e6f1fb;--lv-b2: #993c1d;--lv-b2-bg: #faece7;--lv-book: #a32d2d;--lv-book-bg: #fcebeb;--ok: #0f6e56;--ok-bg: #e1f5ee;--bad: #a32d2d;--bad-bg: #fcebeb;--hint-bg: #faeeda;--hint: #633806;--serif: "Iowan Old Style", "Charter", Georgia, "Times New Roman", serif;--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--radius: 10px;--shadow: 0 1px 3px rgb(33 32 29 / .06), 0 8px 24px rgb(33 32 29 / .05);--shadow-pop: 0 4px 12px rgb(33 32 29 / .12), 0 12px 32px rgb(33 32 29 / .14)}*{box-sizing:border-box}html{color-scheme:light only}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased}.shell{max-width:780px;margin:0 auto;padding:2rem 1.25rem 4rem}a{color:var(--accent)}.brand{font-family:var(--serif);font-size:34px;margin:0 0 .25rem;letter-spacing:-.5px}.brand small{font-size:15px;color:var(--muted);font-family:var(--sans);font-weight:400;margin-left:10px}.bookcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem 1.5rem;margin-top:1.25rem;cursor:default}.bookcard h2{font-family:var(--serif);margin:0;font-size:22px}.bookcard .meta{color:var(--muted);font-size:14px;margin:4px 0 12px}.ladder{display:flex;gap:8px;flex-wrap:wrap}.lv{border:1px solid transparent;border-radius:999px;padding:6px 16px;font-size:14px;font-weight:600;cursor:pointer;background:var(--surface);color:var(--muted);border-color:var(--line);transition:transform .06s ease}.lv:active{transform:scale(.96)}.lv.a1.on{background:var(--lv-a1-bg);color:var(--lv-a1);border-color:var(--lv-a1)}.lv.a2.on{background:var(--lv-a2-bg);color:var(--lv-a2);border-color:var(--lv-a2)}.lv.b1.on{background:var(--lv-b1-bg);color:var(--lv-b1);border-color:var(--lv-b1)}.lv.b2.on{background:var(--lv-b2-bg);color:var(--lv-b2);border-color:var(--lv-b2)}.lv.book.on{background:var(--lv-book-bg);color:var(--lv-book);border-color:var(--lv-book)}.crumb{font-size:14px;margin-bottom:1rem}.chapter-title{font-family:var(--serif);font-size:28px;margin:1.2rem 0 .2rem}.chapter-note{color:var(--muted);font-size:13.5px;margin-bottom:1rem}.legend{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:1rem 0 1.5rem}.legend .chip{font-size:12px;padding:3px 12px;border-radius:999px;font-weight:600}.legend .hint{font-size:12.5px;color:var(--muted)}.chip.vocab{background:var(--vocab-bg);color:var(--vocab)}.chip.conn{background:var(--conn-bg);color:var(--conn)}.chip.gram{background:var(--gram-bg);color:var(--gram)}.chip.idiom{background:var(--idiom-bg);color:var(--idiom)}.para{display:flex;gap:14px;margin:0 0 1.4rem}.para .n{font-size:13px;font-weight:700;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:999px;width:28px;height:28px;flex:none;display:flex;align-items:center;justify-content:center;margin-top:4px}.para .body{font-family:var(--serif);font-size:18px;line-height:1.85}.body .diff{padding:1px 5px;border-radius:5px;cursor:pointer;transition:filter .1s}.body .diff:hover{filter:brightness(.94)}.diff[data-kind=vocabulary]{background:var(--vocab-bg);color:var(--vocab)}.diff[data-kind=connector]{background:var(--conn-bg);color:var(--conn)}.diff[data-kind=grammar],.diff[data-kind=verb]{background:var(--gram-bg);color:var(--gram)}.diff[data-kind=idiom],.diff[data-kind=expression]{background:var(--idiom-bg);color:var(--idiom)}.pop{position:absolute;z-index:30;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-pop);padding:12px 16px;max-width:320px;font-size:14px;line-height:1.55;animation:pop .12s ease-out}@keyframes pop{0%{opacity:0;transform:translateY(4px)}}.pop .w{font-weight:700;font-size:16.5px}.pop .ipa{color:var(--muted);margin:0 8px;font-size:13.5px}.pop .say{border:none;background:var(--accent-bg);color:var(--accent);border-radius:999px;width:30px;height:30px;cursor:pointer;font-size:14px;vertical-align:middle}.pop .say:hover{filter:brightness(.95)}.pop .illus{margin-top:2px}.pop .tr{font-size:15px;color:var(--vocab);margin-top:3px;font-weight:600}.pop .tr.ar{direction:rtl;text-align:right;font-size:17px}.pop .langs{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px}.pop .langpill{border:1px solid var(--line);background:var(--surface);border-radius:999px;font-size:11px;padding:3px 9px;cursor:pointer;color:var(--muted)}.pop .langpill.on{background:var(--vocab-bg);color:var(--vocab);border-color:var(--vocab-mid);font-weight:700}.pop .prev{font-size:12.5px;margin-top:8px;color:var(--gram)}.pop .prev b{font-weight:600}select.langsel{font-family:var(--sans);font-size:12px;border:1px solid var(--line);border-radius:6px;padding:3px 6px;background:var(--surface);cursor:pointer;text-transform:none;color:var(--accent);font-weight:700}.gloss-wrap{overflow-x:auto}table.gloss{border-collapse:collapse;width:100%;font-size:14px;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.gloss th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:var(--bg);padding:10px 12px;border-bottom:1px solid var(--line)}.gloss td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}.gloss tr:last-child td{border-bottom:none}.gloss .item{font-weight:600}.gloss .ar{direction:rtl}.gloss .ipa{color:var(--muted);white-space:nowrap}.kindtag{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}.kindtag.vocabulary{background:var(--vocab-bg);color:var(--vocab)}.kindtag.connector{background:var(--conn-bg);color:var(--conn)}.kindtag.grammar,.kindtag.verb{background:var(--gram-bg);color:var(--gram)}.kindtag.idiom,.kindtag.expression{background:var(--idiom-bg);color:var(--idiom)}h2.qh{font-family:var(--serif);font-size:24px;margin:2.5rem 0 1rem}.qsec{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem 1.5rem;margin-bottom:1.25rem}.qsec>h3{margin:0 0 .2rem;font-size:16px;display:flex;align-items:center;gap:10px}.qsec .instr{color:var(--muted);font-size:14px;margin:0 0 1rem}.scorechip{font-size:13px;font-weight:700;padding:2px 10px;border-radius:999px;background:var(--accent-bg);color:var(--accent)}.scorechip.perfect{background:var(--ok-bg);color:var(--ok)}.qitem{padding:.9rem 0;border-top:1px solid var(--line)}.qitem .stem{font-size:15px;font-weight:600;margin:0 0 .6rem}.qitem .stem .mark{margin-right:6px}.qitem .ctx{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:15px;margin:-4px 0 .6rem}.qitem.ok .stem{color:var(--ok)}.qitem.bad .stem{color:var(--bad)}select.pmatch{font-family:var(--sans);font-size:14px;padding:8px 12px;border-radius:8px;border:1px solid var(--line);background:var(--surface);cursor:pointer;min-width:170px}select.pmatch:focus{outline:2px solid var(--accent-bg);border-color:var(--accent)}select.pmatch.ok{border-color:var(--ok);background:var(--ok-bg);color:var(--ok);font-weight:600}select.pmatch.bad{border-color:var(--bad);background:var(--bad-bg);color:var(--bad);font-weight:600}.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}.seg button{border:none;background:var(--surface);padding:8px 18px;font-size:14px;cursor:pointer;color:var(--muted);border-right:1px solid var(--line)}.seg button:last-child{border-right:none}.seg button.sel{background:var(--text);color:#fff;font-weight:600}.seg button.sel.ok{background:var(--ok)}.seg button.sel.bad{background:var(--bad)}.seg button.reveal{background:var(--ok-bg);color:var(--ok);font-weight:700}.cards{display:grid;gap:8px}.card{text-align:left;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;padding:10px 14px;font-size:14.5px;display:flex;gap:10px;align-items:baseline;transition:border-color .1s,background .1s}.card:hover{border-color:var(--accent)}.card .abc{font-weight:700;font-size:12.5px;color:var(--muted)}.card.sel{border-color:var(--accent);background:var(--accent-bg)}.card.sel .abc{color:var(--accent)}.card.right{border-color:var(--ok);background:var(--ok-bg);color:var(--ok);font-weight:600}.card.right .abc{color:var(--ok)}.card.wrong{border-color:var(--bad);background:var(--bad-bg);color:var(--bad)}.card.wrong .abc{color:var(--bad)}.expl{background:var(--hint-bg);color:var(--hint);border-radius:8px;padding:9px 13px;margin-top:.7rem;font-size:13.5px;line-height:1.6}.checkrow{margin-top:1.1rem;display:flex;gap:10px;align-items:center}button.checkbtn{font-size:14.5px;font-weight:600;padding:9px 22px;border-radius:999px;cursor:pointer;border:none;background:var(--text);color:#fff}button.checkbtn:hover{opacity:.88}.loading{color:var(--muted);padding:4rem 0;text-align:center;font-size:15px}.gradehint{color:var(--muted);font-size:14px;text-align:center;margin:1.5rem 0}.gradecard{display:flex;gap:20px;align-items:center;border-radius:var(--radius);box-shadow:var(--shadow);padding:1.4rem 1.6rem;margin:1.5rem 0;border:1.5px solid}.gradecard .pct{font-size:40px;font-weight:800;font-family:var(--sans);letter-spacing:-1px;flex:none}.gradecard .headline{font-weight:700;font-size:16px}.gradecard .msg{font-size:14.5px;margin-top:2px}.gradecard .best{font-size:12.5px;color:var(--muted);margin-top:6px}.gradecard.gold{background:var(--ok-bg);border-color:var(--ok);color:var(--ok)}.gradecard.good{background:var(--lv-b1-bg);border-color:var(--lv-b1);color:var(--lv-b1)}.gradecard.retry{background:var(--hint-bg);border-color:var(--hint);color:var(--hint)}
