:root{--klein: #002FA7;--klein-dark: #00226e;--ink: #1c2333;--muted: #8a93a6;--bg: #f5f7fb;--card: #ffffff;--line: #e3e8f2;--warn-bg: #fff7e0;--warn-line: #e6c26a;--danger: #b3402a;--ok: #1e7a46;--en-size: 17px;--zh-size: 13px}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100vh}html{scroll-behavior:smooth}body{color:#111c3f;background:radial-gradient(circle at 9% 1%,rgba(80,125,228,.13),transparent 25rem),radial-gradient(circle at 92% 4%,rgba(0,47,167,.16),transparent 28rem),#f2f5fc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Microsoft YaHei,sans-serif;font-size:15px}button{font-family:inherit;cursor:pointer}a{color:var(--klein);text-decoration:none}.topbar{display:flex;gap:8px;padding:10px 14px;background:var(--klein);position:sticky;top:0;z-index:20}.topbar .tab{color:#cfd8ff;padding:8px 18px;border-radius:8px;font-size:16px;min-height:44px;display:flex;align-items:center}.topbar .tab.active{background:#ffffff29;color:#fff;font-weight:600}.page{max-width:760px;margin:0 auto;padding:16px 14px 80px}.page-center{display:grid;place-items:center;min-height:60vh;color:var(--muted)}.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:12px}.card h2,.card h3{margin:0 0 10px;color:var(--klein-dark)}.en{font-size:var(--en-size);color:var(--ink);line-height:1.55}.zh{font-size:var(--zh-size);color:var(--muted);line-height:1.6}.small{font-size:12px;color:var(--muted)}.klein{color:var(--klein)}.muted{color:var(--muted)}.btn{background:var(--klein);color:#fff;border:none;border-radius:8px;padding:10px 18px;font-size:15px;min-height:44px;min-width:44px}.btn:disabled{background:#9fb0d8;cursor:not-allowed}.btn.secondary{background:#e8edf9;color:var(--klein)}.btn.small{padding:6px 12px;min-height:36px;font-size:13px}.btn.danger{background:var(--danger)}.btn.ok{background:var(--ok)}.seg{padding:10px 8px;border-bottom:1px solid var(--line);border-radius:6px}.seg:last-child{border-bottom:none}.seg.playing{background:#eef3ff}.seg .play-dot{display:inline-block;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--klein);color:var(--klein);background:#fff;text-align:center;line-height:32px;margin-right:8px;-webkit-user-select:none;user-select:none}.seg.playing .play-dot{background:var(--klein);color:#fff}.seg .text-selectable{cursor:text}.seg .text-selectable::selection{background:#b9c9ff}.word-token:hover{background:#dfe8ff}.word-token.marked{background:var(--klein);color:#fff}.review-flag{background:var(--warn-bg);border:1px solid var(--warn-line);color:#7a5c00;border-radius:6px;font-size:12px;padding:2px 8px}.list-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px solid var(--line)}.list-row:last-child{border-bottom:none}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}@media (max-width: 480px){.grid4{grid-template-columns:repeat(2,1fr)}}.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;text-align:center}.stat .num{font-size:22px;font-weight:700;color:var(--klein-dark)}.stat .label{font-size:12px;color:var(--muted);margin-top:2px}.form input,.form textarea,.form select{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;font-size:15px;margin:4px 0 10px;font-family:inherit}.form label{font-size:13px;color:var(--muted);display:block}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a102073;display:grid;place-items:center;z-index:50;padding:14px}.modal{background:#fff;border-radius:14px;max-width:620px;width:100%;max-height:86vh;overflow:auto;padding:18px}.modal h3{margin-top:0;color:var(--klein-dark)}.subnav{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 14px}.subnav a{padding:7px 12px;border-radius:999px;background:#e9eefb;color:var(--klein);font-size:13px;min-height:36px;display:inline-flex;align-items:center}.subnav a.active{background:var(--klein);color:#fff}.calendar-day{border:1px solid var(--line);border-radius:8px;padding:8px;min-height:64px;background:#fff}.calendar-day.future{color:var(--muted);background:#fafbfe}.calendar-day .d{font-size:12px;color:var(--muted)}.tag{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;background:#e9eefb;color:var(--klein);margin-right:6px}.tag.practice{background:#fdeeda;color:#8a5a00}.tag.stage{background:#e3f5ea;color:var(--ok)}.tag.paused,.tag.archived{background:#f3f4f6;color:#667}.tag.draft{background:#fdeeee;color:var(--danger)}.progress-track{height:8px;background:#e9eefb;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:var(--klein)}:focus-visible{outline:3px solid #7d97ff;outline-offset:2px}.unlock-wrap{max-width:380px;margin:18vh auto;padding:0 16px}.unlock-wrap h1{color:var(--klein-dark);text-align:center}.error-text{color:var(--danger);font-size:13px}.day-bar{display:flex;align-items:flex-end;gap:8px;height:110px;margin:10px 0}.day-bar .bar{flex:1;background:var(--klein);border-radius:4px 4px 0 0;min-height:2px;position:relative}.day-bar .bar.practice{background:#7d97ff}.day-bar .bar .v{position:absolute;top:-18px;width:100%;text-align:center;font-size:11px;color:var(--muted)}.day-bar .dlabel{flex:1;text-align:center;font-size:11px;color:var(--muted)}.notice{background:#eef3ff;border:1px solid #c8d6ff;color:var(--klein-dark);border-radius:10px;padding:10px 14px;margin-bottom:12px;font-size:13px}:root{--paper: #fffefe;--green: #002fa7;--green-deep: #001b63;--orange: #3566d6;--mint: #e8efff;--line-orig: #dce3f2;--shadow-orig: 0 20px 58px rgba(0, 47, 167, .17)}button,select,input{font:inherit}.shell{width:min(1180px,calc(100% - 28px));margin:20px auto 150px}.cat-hero{padding:44px;border-radius:30px;color:#fff;background:linear-gradient(135deg,var(--green-deep),var(--green) 65%,#174fc4);box-shadow:var(--shadow-orig)}.cat-hero .eyebrow{margin:0}.cat-hero h1{margin:10px 0 12px;font:700 clamp(36px,6vw,64px)/1 Georgia,serif;letter-spacing:-.04em}.cat-hero p{max-width:720px;margin:0;color:#fffc;line-height:1.7}.tb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.tb-card{position:relative;display:grid;grid-template-columns:52px 1fr;gap:3px 15px;padding:21px;border:1px solid var(--line-orig);border-radius:20px;color:inherit;text-decoration:none;background:#ffffffe6;box-shadow:0 5px 18px #002fa70d;transition:.18s}.tb-card:hover{transform:translateY(-3px);border-color:#7797e2;box-shadow:0 15px 34px #002fa721}.tb-card:focus-visible{outline:3px solid rgba(0,47,167,.25);outline-offset:2px}.tb-card .number{grid-row:1/5;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;color:#fff;background:var(--green);font-weight:900}.tb-card .unit{color:var(--orange);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.tb-card strong{font:700 25px/1.2 Georgia,serif}.tb-card .zh{color:#65718f;font-size:14px}.tb-card .tb-meta{margin-top:7px;color:#6b7693;font-size:12px}.home-nav{position:sticky;top:66px;z-index:20;width:fit-content;margin-bottom:14px}.home-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid var(--line-orig);border-radius:14px;background:var(--paper);color:var(--green);text-decoration:none;font-weight:700;box-shadow:0 4px 16px #002fa71a}.home-link:hover{background:var(--mint);border-color:var(--green)}.home-link:focus-visible{outline:3px solid var(--green);outline-offset:3px}.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:end;padding:clamp(28px,5vw,54px);border-radius:30px;color:#fff;background:linear-gradient(135deg,var(--green-deep),var(--green) 66%,#174fc4);box-shadow:var(--shadow-orig)}.hero:before{content:var(--chapter-number, "01");position:absolute;right:20px;top:-55px;color:#ffffff13;font:800 220px/1 Georgia,serif;letter-spacing:-.08em}.hero-copy,.hero-action{position:relative;z-index:1}.hero .eyebrow{margin:0 0 13px;color:#c8d8ff;font-size:13px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.hero h1{margin:0;font:700 clamp(44px,7vw,76px)/.96 Georgia,"Times New Roman",serif;letter-spacing:-.045em}.hero .subtitle{max-width:700px;margin:18px 0 0;color:#ffffffc2;line-height:1.7;font-size:15px}.hero .meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.pill{padding:7px 11px;border:1px solid rgba(255,255,255,.19);border-radius:999px;background:#ffffff17;font-size:13px}.pill.sel-toggle{cursor:pointer;display:inline-flex;gap:7px;align-items:center;-webkit-user-select:none;user-select:none}.pill.sel-toggle.on{background:#ffffff47;border-color:#ffffff8c;font-weight:700}.pill.sel-toggle input{accent-color:#fff}.play-all{min-width:142px;padding:14px 19px;border:1px solid rgba(255,255,255,.35);border-radius:15px;color:var(--green-deep);background:#fff;box-shadow:0 12px 30px #00000029;font-weight:850;cursor:pointer}.play-all:focus-visible{outline:3px solid rgba(255,255,255,.8);outline-offset:3px}.layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:26px;margin-top:28px}.toc{position:sticky;top:130px;align-self:start;padding:13px;border:1px solid var(--line-orig);border-radius:20px;background:#fffef9d1;box-shadow:0 8px 30px #002fa714;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.toc-label{margin:5px 9px 10px;color:#66718f;font-size:11px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.toc a{display:flex;justify-content:space-between;gap:8px;padding:10px 11px;border-radius:12px;color:#111c3f;text-decoration:none;font-weight:720}.toc a:hover{color:var(--green);background:var(--mint)}.toc-count{color:#66718f;font-size:12px;font-variant-numeric:tabular-nums}.content{min-width:0}.lesson-section{scroll-margin-top:130px;margin:0 0 38px}.section-head{display:flex;justify-content:space-between;gap:16px;align-items:end;margin:0 5px 13px}.lesson-section h2{margin:0;font:700 30px/1.1 Georgia,Times New Roman,serif}.section-note{color:#66718f;font-size:13px;text-align:right}.lines{display:grid;gap:9px}.word-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.line-card{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:center;min-height:74px;padding:14px 16px;border:1px solid var(--line-orig);border-radius:17px;color:inherit;text-align:left;background:#fffef9eb;box-shadow:0 4px 14px #002fa70a;cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}.line-card:hover{transform:translateY(-2px);border-color:#91abe8;box-shadow:0 12px 28px #002fa71c}.line-card:focus-visible{outline:3px solid rgba(0,47,167,.25);outline-offset:2px}.line-card.active{border-color:var(--green);background:var(--mint);box-shadow:0 12px 32px #002fa729}.line-card.kind-heading,.line-card.kind-instruction{background:#f5f7ff}.word-grid .kind-heading{grid-column:1 / -1}.line-card .number{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;color:var(--green);background:var(--mint);font-size:13px;font-weight:900;font-variant-numeric:tabular-nums}.line-card.active .number{color:#fff;background:var(--green)}.line-card .speaker{display:block;margin-bottom:3px;color:var(--orange);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.line-card .text{display:block;font:500 clamp(17px,2.2vw,21px)/1.38 Georgia,"Times New Roman",serif}.line-card .translation{display:block;margin-top:5px;color:#73809e;font:400 clamp(13px,1.7vw,15px)/1.55 "Microsoft YaHei","PingFang SC",sans-serif}.kind-word .text{font-size:clamp(22px,3vw,28px)}.kind-word .translation{margin-top:2px;font-size:14px}.line-card.active .translation{color:#4d6090}.line-card .duration{color:#66718f;font-size:12px;font-variant-numeric:tabular-nums}.review-flag-inline{display:block;margin-top:5px;color:#8b631f;font:400 clamp(12px,1.5vw,14px)/1.5 "Microsoft YaHei",sans-serif}.word-token{cursor:pointer;border-radius:3px}.word-token:hover{background:#d7e2ff}.word-token.marked{background:var(--green);color:#fff}.tb-notice{padding:16px 18px;border:1px dashed #c8d1c6;border-radius:16px;color:#66718f;background:#ffffff7a;font-size:13px;line-height:1.65}.history-version-flag{border-color:#ffffff8c;background:#edb24652;color:#ffe9bd}.player{position:fixed;z-index:30;left:50%;bottom:15px;width:min(960px,calc(100% - 24px));transform:translate(-50%);padding:13px 15px;border:1px solid rgba(255,255,255,.5);border-radius:20px;color:#fff;background:#041441f5;box-shadow:0 20px 58px #00195859;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.now{display:flex;align-items:center;gap:10px;min-width:0;margin-bottom:9px}.now-dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:#7da5ff;box-shadow:0 0 0 5px #7da5ff2b}.now-text{overflow:hidden;color:#f0fbf7;font-size:14px;text-overflow:ellipsis;white-space:nowrap}.controls{display:grid;grid-template-columns:auto auto auto minmax(120px,1fr) auto auto;gap:9px;align-items:center}.control,.player select{min-height:39px;border:0;border-radius:11px;color:#fff;background:#ffffff1a;cursor:pointer}.control{min-width:42px;padding:0 12px;font-weight:800}.control:focus-visible{outline:3px solid #7da5ff;outline-offset:1px}.control.primary{background:var(--green)}.control.on{background:var(--orange)}.player select{padding:0 8px}.player select option{color:#111}.progress{width:100%;accent-color:#7da5ff;cursor:pointer}@media (max-width: 820px){.hero{grid-template-columns:1fr}.hero-action{justify-self:start}.layout{grid-template-columns:1fr}.toc{position:static;display:flex;gap:5px;overflow-x:auto}.toc-label{display:none}.toc a{flex:0 0 auto}.word-grid,.tb-grid{grid-template-columns:1fr}}@media (max-width: 600px){.shell{margin-top:13px}.hero{padding:27px 22px;border-radius:22px}.line-card{grid-template-columns:38px minmax(0,1fr);padding:13px}.line-card .duration{display:none}.controls{grid-template-columns:repeat(3,auto) minmax(90px,1fr)}.controls .mode,.controls select{display:none}.player{bottom:7px}.cat-hero{padding:30px 24px}}.topbar{flex-wrap:nowrap}.topbar .tab{white-space:nowrap}.line-card .copy{min-width:0}.line-card .text{-webkit-user-select:text;user-select:text;cursor:text}.line-card.click-to-play,.line-card.click-to-play .text{cursor:pointer}.line-card>.control{background:var(--blue, #0036b0);color:#fff;min-width:40px;min-height:40px}.line-card>.control:disabled{opacity:.4;cursor:not-allowed}button.word-token{border:0;background:transparent;font:inherit;color:inherit;padding:2px;border-radius:4px;cursor:pointer}button.word-token.marked{background:#ffe19b}.source-highlight{outline:2px solid #deb361;outline-offset:2px}.selection-action{position:sticky;top:65px;z-index:20;display:flex;gap:12px;align-items:center;background:#fff5d8;padding:12px;border-radius:12px}.composer-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.word-composer input,.word-composer textarea,.word-composer select{max-width:100%;width:100%;box-sizing:border-box}.word-composer input[type=checkbox]{width:auto}.word-composer details{margin:16px 0}.word-composer .preview{margin-top:14px}.modal{max-height:88vh;overflow:auto;width:min(640px,calc(100vw - 24px));padding:24px;box-sizing:border-box}.exercise-text{white-space:pre-line;line-height:1.8}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #a77725;outline-offset:3px}@media (max-width: 600px){.topbar .tab{font-size:15px;padding:12px 15px}.line-card{grid-template-columns:auto 1fr}.line-card>.btn,.line-card>.control{grid-column:2;justify-self:start}.player .now{max-width:100%;overflow:hidden}.word-composer select{overflow:hidden}.modal{padding:16px}}.exercise-text{overflow-wrap:anywhere}.lesson-section .line-card:has(.exercise-text){grid-template-columns:minmax(0,1fr) auto}@media (max-width:600px){.controls select{display:block}.controls{display:flex;flex-wrap:wrap}.controls .progress{flex:1;min-width:90px}.lesson-section .line-card:has(.exercise-text){grid-template-columns:minmax(0,1fr)}.lesson-section .line-card:has(.exercise-text)>.btn{grid-column:1}}.sentence-line{display:block;white-space:pre-wrap;margin-bottom:.45em}.filing-footer{padding:24px 16px 150px;text-align:center;font-size:13px;color:#66718f}.filing-footer a{color:inherit;text-decoration:underline;text-underline-offset:3px}.sentence-line:last-child{margin-bottom:0}.selection-action{flex-wrap:wrap}.reading-hint{color:#66718f;line-height:1.6}.word-modal-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.word-modal-header h2{margin:0}.word-modal-close{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;color:#66718f;font:30px/1 Arial,sans-serif;cursor:pointer}.word-modal-close:hover{background:#edf1fa;color:var(--ink)}