.workspace{min-height:690px}.vocab-grid{display:grid;gap:11px;margin:22px 0}.vocab-card{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:18px 20px;background:#eef6ff;border:1px solid #d7e7fa;border-radius:16px}.vocab-card h3{margin:0;font:750 23px/1.3 system-ui,sans-serif;color:#21458d}.vocab-card p{margin:5px 0;font-size:15px}.vocab-card .meaning{color:#4f3990;font-weight:750}.vocab-card .example{color:#33486a;grid-column:1/-1}.vocab-card button{padding:6px 12px;font-size:14px;align-self:start}.vocab-card .reveal{grid-column:1/-1;text-align:left;border:0;background:transparent;color:var(--blue);padding:7px 0;font-weight:700}.schedule{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:24px 0}.schedule div{border-radius:12px;background:#f2f5fa;padding:12px;font-size:12px;color:var(--muted)}.schedule b{display:block;font-size:17px;color:var(--ink)}.phase-help{font-size:14px;color:var(--muted);padding:12px 0;border-bottom:1px solid var(--line)}.lesson-summary{display:grid;gap:14px}.lesson-summary p{margin:0}.status-pill{font-size:12px;background:#e8f7ef;color:#146347;padding:3px 8px;border-radius:7px}.chapter-progress progress{width:100%}.topline{gap:12px;flex-wrap:wrap}.completion-note{font-size:14px;color:var(--muted)}#saveStatus{font-size:13px;color:#98601d}.self-speak{font-size:14px;padding:14px 0;margin:0;color:var(--muted)}.sentence{font-size:23px}.workspace a.primary{display:block;text-align:center}.choices button:disabled{cursor:default;color:var(--ink);opacity:1}.choices .selected:disabled{color:var(--blue)}.review-label{background:#fff0d8;color:#795013;padding:5px 10px;border-radius:7px;font-size:13px}.summary p{overflow-wrap:anywhere}.answer-zone{margin-top:16px}.word-meta{font-size:13px;color:var(--muted)}@media(max-width:700px){.workspace{min-height:560px}.schedule{grid-template-columns:repeat(2,1fr)}.vocab-card{padding:16px}.vocab-card h3{font-size:21px}.intro{margin-bottom:12px}.workspace h2{font-size:25px}.self-speak{font-size:13px}nav button.active span{max-width:160px;white-space:nowrap}.device-note{font-size:12px}}

/* Content determines height; selected cards leave no invisible slots. */
.workspace{min-height:0}.tokens{min-height:0}.tokens:not(:has(button)){display:none}.answer-zone{min-height:78px}.word-role{color:#2457a1;font-weight:700}#audioStatus:empty,#saveStatus:empty{display:none}.summary{overflow-wrap:break-word}@media(max-width:700px){.workspace{min-height:0}}
@media(max-width:700px){.actions .primary{flex-basis:100%;min-width:0}.actions .secondary{flex:1;white-space:nowrap}footer{display:block}footer span{display:block;margin-top:4px}}

.word-help{margin:18px 0 0;padding:14px 17px;background:#f4f6fa;border-radius:12px;font-size:14px;line-height:1.6}.word-help>b{font-size:13px;color:#596980}.word-help dl{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:5px 20px}.word-help dl div{display:flex;gap:7px;flex-wrap:wrap}.word-help dt{font-weight:650;color:#27466d}.word-help dd{margin:0;color:#46556b}

#chapters{max-height:260px;overflow:auto;border-bottom:1px solid var(--line);margin-bottom:16px;padding-bottom:12px}#chapters button{font-size:13px;padding:8px 10px}.workspace{min-width:0}@media(max-width:700px){#chapters{max-height:none;display:flex}#chapters button{white-space:nowrap}}

/* Mobile concise lesson UI, 2026-09-11 */
.feedback-detail summary,.lesson-summary summary{cursor:pointer;font-size:15px;padding:10px 0}.feedback-detail p{margin:4px 0 0}.skip-vocab{width:100%;margin-top:10px}.feedback{margin-top:16px}.word-help{padding:10px 14px;margin-top:12px}.word-help>b{display:none}.word-help dl{margin:0}.prompt p,.choice,.token{overflow-wrap:anywhere}.lesson-summary:not([open]){display:block}.lesson-summary[open]{display:block}.lesson-summary[open] p{margin:12px 0}@media(max-width:700px){.workspace{padding:20px 16px}.workspace h2{font-size:23px;line-height:1.4;margin-bottom:16px}.prompt{padding:18px 16px}.rule{line-height:1.6}.choices{gap:9px}.choice{padding:14px 16px;min-height:48px}.feedback{padding:14px 16px}.word-help{font-size:14px}.actions{margin-top:16px}.kicker{margin-bottom:8px}.intro,.device-note{line-height:1.6}}
.answer-zone .token:disabled{visibility:visible;opacity:1;cursor:default}

/* English10 navigation and vector visuals. No remote assets or font services. */
:root{--blue:#3158bd;--teal:#147b77;--ink:#20334e;--muted:#5e6e83}
body{background:#f4f7fb}button svg,a svg{flex:none;vertical-align:middle}.app-bar{height:auto;min-height:72px;position:sticky;top:0;z-index:20;background:#fffffff2;backdrop-filter:blur(12px);max-width:none;padding:12px max(24px,calc((100vw - 1180px)/2));gap:16px}.app-brand{display:flex;align-items:center;gap:10px;font-weight:850;white-space:nowrap}.app-brand small{display:block;font-size:10px;letter-spacing:2px;color:var(--teal)}.app-brand>span:last-child{line-height:1.3}.app-brand .logo{background:#213c67;width:38px;height:38px}.nav-current{margin-left:auto;max-width:42%;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.menu-toggle{display:flex;align-items:center;gap:7px;background:#edf3fc;color:#294c97;border:1px solid #d8e4f7;border-radius:12px;padding:10px 14px;min-height:44px;font-weight:700;white-space:nowrap}
main{margin-top:28px;gap:40px;grid-template-columns:285px minmax(0,1fr)}.workspace{border-radius:24px;box-shadow:0 12px 42px #243b6010}.workspace h2{font-size:25px}.lesson-route{display:flex;gap:6px;justify-content:space-between;margin:0 0 16px}.lesson-route>span{display:flex;align-items:center;gap:5px;font-size:12px;color:#718097}.lesson-route i{display:grid;place-items:center;width:22px;height:22px;background:#eef1f6;border-radius:50%;font-style:normal;font-size:11px}.lesson-route svg{width:14px;height:14px}.lesson-route .is-current{color:var(--teal);font-weight:750}.lesson-route .is-current i{background:var(--teal);color:white}.lesson-route .is-past i{background:#e4f3ef;color:var(--teal)}.study-tools{display:flex;justify-content:space-between;border-bottom:1px solid #edf0f5;padding-bottom:12px;margin-bottom:20px}.text-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;border:0;background:transparent;color:#365483;font-size:14px;padding:8px 10px;border-radius:9px}.text-button:hover{background:#edf3fb}.text-button:disabled{opacity:.4;cursor:default}.lesson-illustration{display:flex;align-items:center;justify-content:center;gap:16px;background:linear-gradient(120deg,#eef4ff,#eef8f4);border-radius:18px;margin-bottom:20px;padding:10px 14px}.lesson-art{width:150px;height:auto;flex-shrink:0}.lesson-illustration>span{font-size:13px;line-height:1.7;color:#4f6580}.lesson-illustration b{color:#1b5263;font-weight:700}.celebrate svg{width:44px;height:44px}.topline{font-size:12px}.steps{margin:12px 0 22px}.answer-zone .token{box-shadow:0 2px 5px #2742700a}.primary{background:var(--blue)}.word-help{border-left:3px solid #a8d5cb}.reference-guide{color:var(--muted);font-size:14px;margin:20px 0}
.course-dialog{border:1px solid #dbe5f0;border-radius:22px;width:min(620px,calc(100% - 28px));max-height:85dvh;padding:0;background:#fff;color:var(--ink);box-shadow:0 20px 80px #162b5640}.course-dialog::backdrop{background:#142b4d70;backdrop-filter:blur(3px)}.dialog-head{position:sticky;top:0;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid #e7edf5;gap:8px;z-index:1}.dialog-head h2{font-size:20px;margin:0}.dialog-head button{border:0;border-radius:10px;background:#f0f4f9;padding:10px;min-width:44px;min-height:44px}.dialog-body{padding:18px 22px}.course-links{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}.course-links a{display:block;padding:12px;background:#f2f6fb;border:1px solid #e1e8f2;border-radius:12px;font-size:13px;text-align:center;font-weight:700}.course-links a[aria-current]{background:#e7f2f0;border-color:#a6cdc5;color:#166862}.menu-filters{display:grid;grid-template-columns:1fr;gap:8px}.menu-filters label{font-size:13px;color:#53687f}.menu-filters input,.menu-filters select{width:100%;padding:12px;background:white;border:1px solid #cbd8e9;border-radius:10px;font:16px/1.4 inherit;color:var(--ink);min-height:48px}.menu-count{font-size:12px;color:var(--muted);margin:14px 0 8px}.menu-lesson{display:flex;gap:12px;width:100%;padding:14px 10px;text-align:left;align-items:center;border:0;border-bottom:1px solid #eaf0f6;background:white;color:var(--ink)}.menu-lesson>b{display:grid;place-items:center;flex:none;background:#eef3fa;color:#3a5a91;width:36px;height:36px;border-radius:12px;font-size:13px}.menu-lesson>span{flex:1;font-size:15px;line-height:1.5}.menu-lesson small{display:block;color:#6c7e91;font-size:11px;margin-top:3px}.menu-lesson>svg{width:17px;color:#91a1b6}.menu-lesson.is-selected{background:#edf6f3;border-radius:12px}.menu-lesson.is-selected>b{background:#147b77;color:white}.menu-footer{display:flex;justify-content:space-between;gap:8px;border-top:1px solid #e6edf5;padding-top:16px;margin-top:18px;font-size:13px;color:#416192}.reference-rule{display:flex;gap:12px;padding:16px;background:#eaf4f1;border-radius:14px}.reference-rule>svg{flex:none;margin-top:4px;color:#167b77}.reference-rule p{margin:0;font-size:15px;line-height:1.7}.reference-example{padding:18px 0;border-top:1px solid #e6edf5}.example-number{font-size:11px;font-weight:800;letter-spacing:1px;color:#147b77}.reference-example>p{font:600 20px/1.6 system-ui;margin:6px 0 8px;overflow-wrap:anywhere}.example-tools{display:flex;gap:8px}.reference-example details{font-size:14px;color:#53677f;margin-top:6px}.reference-example summary{cursor:pointer;padding:8px 0}.reference-example details p{margin:4px 0}.empty-menu{color:var(--muted);font-size:14px}
@media(max-width:700px){.app-bar{padding:10px 16px;gap:8px;min-height:66px}.app-brand{font-size:16px}.app-brand .logo{width:32px;height:32px;font-size:20px}.app-brand small{font-size:9px}.nav-current{display:none}.menu-toggle{margin-left:auto;padding:8px 12px;font-size:14px}.app-bar>a:last-child{margin-left:0}main{margin:16px auto 26px;padding:0 12px}main>aside{display:none}.workspace{padding:18px 16px;border-radius:20px}.topline{gap:6px;font-size:11px}.steps{gap:3px;margin-bottom:16px}.lesson-route{gap:4px}.lesson-route>span{font-size:11px;gap:4px}.study-tools{margin-bottom:16px;padding-bottom:8px}.lesson-illustration{gap:6px;padding:4px 10px;margin-bottom:16px}.lesson-art{width:120px}.lesson-illustration>span{font-size:11px}.workspace h2{font-size:22px}.dialog-head{padding:14px 16px}.dialog-body{padding:16px}.course-dialog{max-height:90dvh;width:calc(100% - 20px);border-radius:18px}.dialog-head h2{font-size:18px}.menu-lesson>span{font-size:14px}.prompt{margin:16px 0}footer{margin:24px 16px}.actions .secondary{white-space:normal}.reference-example>p{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.brand-short{display:none}.workspace h2{scroll-margin-top:90px}.menu-filters input,.menu-filters select{font-family:inherit;font-size:16px}@media(max-width:700px){.brand-full{display:none}.brand-short{display:inline}.app-brand{min-width:0}.lesson-illustration>span{min-width:0}.study-tools{min-height:44px}}

.study-tools .reference-open{background:#eaf0ff;border:1px solid #315bea;border-radius:10px;padding:10px 14px;color:#2449bb;font-weight:700;cursor:pointer}.reference-open:focus-visible{outline:3px solid #315bea;outline-offset:3px}.delete-help{font-size:12px;line-height:1.5;margin:6px 0;color:var(--muted)}.delete-help summary{cursor:pointer}.delete-help p{margin:4px 0}