*{box-sizing:border-box}body{margin:0;background:#f3f5fb;color:#172442;font:16px/1.65 -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #f4ac36;outline-offset:4px}header{height:100px;max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 36px}.brand{font-size:26px;font-weight:750;text-decoration:none;color:inherit;display:flex;align-items:center;gap:12px}.brandmark{background:#173dcd;color:white;border-radius:13px;width:43px;text-align:center}.brand small{font-size:14px;font-weight:400;color:#64708a;margin-left:12px}.edition{font-size:14px;color:#5c6880;border:1px solid #d6ddea;border-radius:25px;padding:5px 14px}main{max-width:1170px;margin:26px auto 60px;display:grid;grid-template-columns:340px 1fr;gap:62px;padding:0 24px}.eyebrow{color:#173dcd;font-size:12px;letter-spacing:2.5px;font-weight:700}h1{font-size:43px;line-height:1.4;letter-spacing:-1px;margin:14px 0 17px}.intro{color:#616e86;max-width:290px}.course{margin-top:36px;border-top:1px solid #d9deea;padding-top:24px}.course>span{font-size:14px;color:#63718a}.course h2{font-size:23px;margin:4px 0}.course p{font-size:14px;color:#67738a;margin:0}ol{list-style:none;padding:0;margin-top:22px;counter-reset:step}li{counter-increment:step;padding:14px 12px;color:#737f92;border-radius:10px;display:flex;align-items:center;gap:12px}li:before{content:counter(step,decimal-leading-zero);font-size:14px}li.active{color:#173dcd;background:#e4eafe;font-weight:650}li small{font-size:13px;margin-left:auto;font-weight:400}.aside-note{font-size:14px;color:#6b7689;margin-top:32px}.aside-note strong{color:#253959;font-weight:500}.workspace nav{display:flex;gap:8px;margin-bottom:16px;background:#e8edf7;padding:5px;border-radius:14px}.tab{border:0;background:transparent;color:#63708a;border-radius:10px;padding:11px;flex:1}.tab.selected{background:white;color:#173dcd;box-shadow:0 2px 6px #142b4b0b;font-weight:650}article{background:white;border:1px solid #e3e7f0;border-radius:24px;padding:28px 34px;box-shadow:0 15px 50px #243b6810}.lesson-meta{display:flex;justify-content:space-between;font-size:14px;color:#748097}.lesson-meta span:first-child{color:#173dcd;background:#edf1ff;border-radius:6px;padding:3px 9px}#card{text-align:center;padding-top:18px}.sound{font-size:68px;line-height:1.3;font-weight:650;color:#1539ba;letter-spacing:1px}.word{font-size:45px;font-weight:650;color:#142857;line-height:1.3;padding:15px 0 5px}.translation{font-size:22px;margin:4px 0 20px}.ipa{color:#778297;font-size:18px}.guide{background:#f4f6fb;border-radius:12px;padding:16px 20px;text-align:left;margin:18px 0 5px}.guide strong{font-size:15px}.guide p{margin:5px 0;color:#576680;font-size:15px}.play-area{text-align:center;padding-top:24px}.primary{border:0;color:white;background:#173dcd;border-radius:13px;min-height:54px;padding:12px 32px;font-weight:600;box-shadow:0 5px 12px #173dcd20;width:100%}#status{font-size:14px;color:#63728e;min-height:24px;margin:10px 0 20px}.settings{display:flex;justify-content:center;gap:18px;flex-wrap:wrap}.settings label{font-size:14px;color:#69768b}select{margin-left:5px;border:0;border-bottom:1px solid #d3dbec;background:white;color:#23365a;font-size:14px;padding:6px 2px}.sequence{display:flex;align-items:center;justify-content:center;gap:9px;margin:16px 0 24px;color:#6a7892;font-size:12px}.sequence i{font-style:normal;color:#a6b3c7}.record-box{border-top:1px solid #e6eaf2;border-bottom:1px solid #e6eaf2;padding:20px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.record-box strong{font-size:15px}.record-box p{font-size:13px;color:#7a8598;margin:3px 0}.secondary{border:1px solid #d8e0f1;background:white;color:#233d7c;padding:10px 15px;border-radius:10px;font-size:14px}audio{width:100%;height:40px}#recordStatus:empty{display:none}#recordStatus{width:100%}.footer-controls{display:flex;align-items:center;justify-content:space-between;padding-top:22px}.text-btn{border:0;background:transparent;color:#60708b;padding:8px 0}.next{border:0;background:#eef2ff;color:#173dcd;border-radius:9px;padding:9px 15px}.text-btn:disabled{opacity:.35;cursor:default}#dots{font-size:13px;color:#8090ae}.privacy{text-align:center;color:#7b879b;font-size:12px;margin-top:16px}dialog{border:0;border-radius:24px;padding:36px;text-align:center;max-width:calc(100% - 36px);color:#172442}dialog::backdrop{background:#11224c66}.completion{font-size:35px;color:#173dcd}dialog .text-btn{display:block;margin:15px auto 0}button:hover{filter:brightness(.97)}@media(max-width:850px){header{height:78px;padding:0 20px}.brand small{display:none}main{grid-template-columns:1fr;gap:22px;margin-top:10px;max-width:620px;padding:0 16px}.eyebrow,.course,.aside-note{display:none}h1{font-size:29px;margin:6px 0}h1 br{display:none}.intro{max-width:none;margin:5px 0;font-size:15px}article{padding:22px 20px;border-radius:20px}.sound{font-size:60px}.word{font-size:36px}.settings{gap:10px}.edition{font-size:12px}.privacy{padding-bottom:env(safe-area-inset-bottom)}.record-box{gap:12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
.mouth{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:-10px}.mouth svg{width:115px;height:50px}.mouth span{font-size:13px;color:#657491}
.voice-setting{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 14px;font-size:14px;color:#69768b}.voice-setting select{min-width:0;max-width:70%;text-overflow:ellipsis}
.course-progress{display:flex;align-items:center;gap:12px;margin-top:18px;color:#64728c;font-size:13px}.course-progress progress{width:100%;height:7px;accent-color:#173dcd}.course-progress span{white-space:nowrap}.player-actions{display:flex;align-items:center;justify-content:space-between;margin-top:8px;font-size:14px;color:#536680}.player-actions input{accent-color:#173dcd;width:18px;height:18px;vertical-align:middle}.sequence span{padding:3px 5px;border-radius:5px}.sequence .current{background:#173dcd;color:white}button:disabled{opacity:.5;cursor:default}.record-box [hidden]{display:none}.primary.paused{background:#24457f}
[hidden]{display:none!important}header{height:auto;min-height:90px;gap:15px}.top-nav{display:flex;gap:5px}.top-nav button{background:none;border:0;padding:9px 20px;border-radius:9px;color:#63708a}.top-nav button.active{color:#173dcd;background:#e5ebff;font-weight:650}.page-view{max-width:1120px;margin:30px auto 70px;padding:0 24px}.page-heading h1{font-size:36px;margin:9px 0}.page-heading p{color:#63708a}.wide{width:100%;margin-top:12px}.summary-strip{display:flex;gap:30px;background:#173dcd;color:white;padding:22px 28px;border-radius:18px;margin:28px 0}.summary-strip b{font-size:25px;display:block}.summary-strip small{font-size:14px;color:#dfe6ff}.week-group{margin:16px 0;border:1px solid #dce3f1;border-radius:16px;background:white;overflow:hidden}.week-group>summary{padding:22px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}.week-group>summary h2{margin:0;font-size:19px}.week-group>summary p{font-size:14px;color:#738098;margin:3px 0 0}.week-group>summary:after{content:'＋';font-size:22px;color:#173dcd}.week-group[open]>summary:after{content:'−'}.lesson-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 20px 20px}.lesson-tile{border:1px solid #e1e7f1;background:#f9faff;border-radius:12px;padding:18px;text-align:left;color:#203557;display:flex;flex-direction:column;gap:8px}.lesson-tile.current{border-color:#173dcd;box-shadow:inset 0 0 0 1px #173dcd}.lesson-tile small{color:#66799b;font-size:13px}.lesson-tile strong{font-size:18px}.lesson-tile p{font-size:14px;color:#61728f;margin:0;flex:1}.lesson-tile .badge{font-size:12px;color:#173dcd}.week-review{padding:0 22px 20px;display:flex;justify-content:space-between;align-items:center;gap:14px}.week-review p{font-size:14px;color:#65758e;margin:0}.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.plan-card{background:white;border:1px solid #e0e6f0;border-radius:18px;padding:24px;margin:20px 0}.plan-card h2{font-size:21px;margin:0 0 12px}.plan-card p{color:#5b6d8c}.plan-card ol{margin:0}.plan-card li{padding:7px 0;display:block}.plan-card li:before{content:none}.plan-card b{color:#173dcd;margin-right:10px}.plan-week{display:grid;grid-template-columns:110px 1fr;gap:24px;padding:24px 0;border-bottom:1px solid #dde3ed}.plan-week h3{margin:0 0 6px}.plan-week p{margin:4px 0;color:#62738f}.download-link{display:inline-block;margin-top:24px;color:#173dcd}.play-settings{border:1px solid #e3e8f2;border-radius:10px;padding:12px 14px;font-size:14px}.play-settings summary{cursor:pointer;color:#304464}.play-settings summary span{color:#7a879e;float:right;font-size:12px}.play-settings .settings{margin-top:12px}.auto-next{display:block;text-align:center;color:#65758e;margin-top:14px}.auto-next input,.task input{accent-color:#173dcd}.lesson-note{background:white;padding:18px 22px;border-radius:14px;margin-top:18px;border:1px solid #e3e8f2}.lesson-note summary{cursor:pointer;font-weight:600}.lesson-note p{font-size:15px;color:#596d8d}.task{background:#f1f5ff;padding:15px;border-radius:9px}.task p{margin:8px 0}.task label{font-size:14px;color:#263e69}.role{font-size:14px;color:#173dcd;background:#eaf0ff;border-radius:8px;padding:4px 10px;display:inline-block}.word{overflow-wrap:anywhere}#quizDialog{width:510px}#quizOptions{display:grid;gap:10px;margin:20px 0}#quizOptions button{border:1px solid #d7e0ef;border-radius:10px;background:white;padding:14px;text-align:left;color:#253d65}#quizOptions .correct{background:#e1f3e9;border-color:#549573}#quizOptions .wrong{background:#fff0ed;border-color:#cf836a}#quizFeedback{min-height:26px;color:#314b73}.dialog-close{position:absolute;right:15px;top:10px;border:0;background:transparent;font-size:28px;color:#667}.site-footer{max-width:1120px;margin:30px auto;padding:20px 24px;color:#7b889e;border-top:1px solid #dee5ef;font-size:13px;display:flex;justify-content:space-between}#loading{max-width:1120px;margin:60px auto;text-align:center;color:#667}.tab{padding:10px 5px}.tab:disabled{display:none}.review-notice{font-size:14px;background:#edf2ff;padding:12px;border-radius:9px}.record-box{scroll-margin-top:20px}.plan-week .week-number{color:#173dcd;font-weight:700}#finish .text-btn{display:inline-block;margin:15px 12px 0}@media(max-width:850px){header{min-height:80px;padding:12px 16px}.brand{font-size:23px}.top-nav button{padding:8px 12px;font-size:15px}.page-heading h1{font-size:28px}.lesson-grid{grid-template-columns:1fr}.lesson-tile{gap:4px}.plan-grid{grid-template-columns:1fr;gap:0}.plan-card{margin:10px 0}.plan-week{grid-template-columns:70px 1fr;gap:12px}.summary-strip{gap:18px;padding:20px}.summary-strip b{font-size:21px}.week-review{flex-direction:column;align-items:flex-start}.page-view{padding:0 16px;margin-top:18px}main aside>.wide{width:auto;margin:10px 12px 0 0}main aside>.text-btn:last-child{font-size:14px}.word{font-size:30px}.site-footer span{display:none}.course-progress{font-size:12px}h1{font-size:29px}.page-heading{margin-bottom:24px}}@media(min-width:851px){.workspace{min-width:0}aside{position:sticky;top:25px;align-self:start}}
.sound{font-size:clamp(1.9rem,7vw,3.6rem);overflow-wrap:anywhere;line-height:1.35}.lesson-meta{gap:12px}.lesson-meta span:last-child{white-space:nowrap}.settings{row-gap:12px}.task label{display:flex;align-items:flex-start;gap:7px}#quizDialog h2{font-size:24px}#quizOptions button:disabled{opacity:1}dialog{max-height:90dvh;overflow:auto}
/* Extended curriculum: preserve the existing blue learning surface. */
.top-nav{flex-wrap:wrap;gap:.25rem}.top-nav button{white-space:nowrap}#advancedStart{margin-bottom:.75rem}.filter-label,.studio-toolbar label,.vocab-filters label{display:flex;gap:.65rem;align-items:center;flex-wrap:wrap}.filter-label{margin:1.5rem 0}select,input,textarea{font:inherit}select{max-width:100%}.roadmap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:2rem 0}.roadmap section{border:1px solid #c9d4f3;border-top:4px solid #173dcd;border-radius:16px;padding:1.5rem;background:#fff}.roadmap span{font-weight:700;color:#173dcd}.roadmap h2{font-size:1.5rem;margin:.8rem 0}.roadmap p{line-height:1.85;color:#47526a}.studio-toolbar{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:1.5rem 0}.studio-toolbar select{min-height:44px;max-width:100%;width:min(100%,34rem)}.lab-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0}.lab-tabs button{padding:.7rem 1rem;background:#fff;border:1px solid #bdc8e5;border-radius:10px;color:#233257;min-height:44px}.lab-tabs button.selected{background:#173dcd;color:#fff;border-color:#173dcd}.timer-bar{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem;padding:1rem;background:#edf2ff;border-radius:12px}.timer-bar label{display:flex;gap:.5rem;align-items:center}.timer-bar small{flex-basis:100%;font-size:.875rem;color:#536079}#studyTimer{font-variant-numeric:tabular-nums;font-weight:700}.studio-content{padding:clamp(1rem,4vw,2.5rem);border:1px solid #d5def1;border-radius:20px;background:#fff;margin-bottom:1.5rem}.studio-content>p{line-height:1.85}.passage{font-size:1.0625rem;line-height:1.95;white-space:pre-line;overflow-wrap:anywhere;margin:1.5rem 0;color:#25334e}.question{display:block;border:1px solid #dbe2f1;border-radius:12px;padding:1.25rem;margin:1.25rem 0;min-width:0;line-height:1.7}.question legend{font-weight:650;padding:0 .4rem;max-width:100%}.answer-option{display:flex;align-items:flex-start;gap:.65rem;padding:.85rem;margin:.5rem 0;border-radius:8px;background:#f5f7fc;cursor:pointer}.answer-option input{margin-top:.4rem;flex:none}.answer-option.correct{background:#e4f4ed;color:#155c3a}.explanation{display:block;font-size:.95rem;line-height:1.8;color:#364c73;margin:.75rem 0}.result-panel{padding:1.3rem;border-radius:14px;background:#edf2ff;line-height:1.8}.result-panel strong{font-size:1.5rem}.word-bank{display:flex;flex-wrap:wrap;gap:.65rem;padding:1rem;background:#f0f4fd;border-radius:12px}.word-bank span{padding:.4rem .65rem;background:white;border-radius:6px}.gap-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1rem 0}.gap-grid label{display:flex;flex-direction:column;gap:.4rem}.question select{display:block;margin-top:.8rem;min-height:44px}.studio-content textarea{display:block;width:100%;max-width:100%;box-sizing:border-box;padding:1rem;border:1px solid #a9b9dc;border-radius:12px;line-height:1.7;resize:vertical;margin-top:.5rem}.self-check{padding:1.25rem;background:#f5f7fc;border-radius:12px;margin:1.5rem 0}.self-check label{display:flex;align-items:flex-start;gap:.6rem;line-height:1.7;margin:.75rem 0}.self-check input{margin-top:.35rem;flex:none}.model-answer summary{cursor:pointer;padding:1rem 0;color:#173dcd;font-weight:650}.muted{color:#60708a;font-size:.95rem;line-height:1.8}.vocab-filters{display:flex;flex-wrap:wrap;gap:1.25rem;margin:1.5rem 0}.vocab-filters input,#spellInput{min-height:44px;border:1px solid #adbcda;border-radius:8px;padding:.5rem .75rem;max-width:100%;box-sizing:border-box}#spellInput{display:block;width:100%;margin:.75rem 0}.vocab-word{font-size:clamp(2rem,6vw,3.5rem);overflow-wrap:anywhere;margin:1rem 0}.vocab-actions{display:flex;gap:1rem;flex-wrap:wrap}#vocabCard>label{display:block;margin-top:1.5rem}#vocabCard{max-width:48rem;margin-inline:auto}#studioAudio{width:100%;margin:1rem 0}.exam-table{overflow-x:auto}.exam-table table{border-collapse:collapse;width:100%;font-size:1rem}.exam-table th,.exam-table td{padding:.9rem .65rem;text-align:left;border-bottom:1px solid #d7dfed;line-height:1.7}.exam-table th{background:#f0f4ff}.plan-card li{line-height:1.9;margin:.5rem 0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #4777eb;outline-offset:3px}
@media(max-width:720px){header{flex-wrap:wrap;gap:.6rem}.top-nav{width:100%;justify-content:space-between}.top-nav button{padding:.6rem .75rem}.roadmap{grid-template-columns:1fr}.studio-toolbar{display:block}.studio-toolbar label{display:block}.studio-toolbar select{display:block;width:100%;margin:.65rem 0}.gap-grid{grid-template-columns:1fr}.timer-bar{padding:.8rem}.question{padding:.9rem}.vocab-filters{display:block}.vocab-filters label{margin:1rem 0}.vocab-filters input{width:100%}.filter-label select{width:100%}.footer-controls{gap:.5rem}.footer-controls button{white-space:normal}.exam-table th,.exam-table td{padding:.6rem .35rem;font-size:.95rem}.page-heading h1{overflow-wrap:anywhere}}

/* Project name fits narrow screens without hiding navigation. */
header{height:auto;min-height:100px;padding-top:16px;padding-bottom:16px;gap:16px;flex-wrap:wrap}.brand{min-width:0;max-width:100%}.brandmark{flex:0 0 43px}.brand-text{display:flex;flex-direction:column;min-width:0;line-height:1.5}.brand-text small{margin-left:0;display:block}@media(max-width:720px){.brand{font-size:20px;gap:10px}.brand-text small{font-size:14px}}