:root{--navy:#071d3a;--blue:#0c4f92;--sky:#eaf5ff;--gold:#f4b942;--ink:#142033;--muted:#667085;--line:#dce5ef;--white:#fff;--green:#17845b;--red:#c93b4a;--panel:#f7faff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#f4f7fb;line-height:1.55}a{text-decoration:none;color:inherit}button{font:inherit}nav{position:sticky;top:0;z-index:30;background:rgba(7,29,58,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}.navin{max-width:1180px;margin:auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.6px}.logo{width:40px;height:40px;border-radius:12px;background:var(--gold);display:grid;place-items:center;color:var(--navy)}.navlinks{display:flex;gap:8px;flex-wrap:wrap}.navlinks a{padding:9px 12px;border-radius:10px;color:#eaf3ff}.navlinks a:hover{background:rgba(255,255,255,.1)}.wrap{max-width:1180px;margin:auto;padding:0 20px}.hero{background:linear-gradient(120deg,#071d3a,#0c4f92);color:#fff;padding:70px 0 58px;overflow:hidden}.heroGrid{display:grid;grid-template-columns:1.3fr .7fr;gap:30px;align-items:center}.eyebrow,.badge{display:inline-block;font-size:12px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase;color:#815d00;background:#fff0be;padding:7px 10px;border-radius:999px}.hero h1{font-size:clamp(38px,6vw,72px);line-height:1.02;margin:14px 0}.hero p{font-size:19px;color:#dcecff;max-width:720px}.heroCard{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:24px;backdrop-filter:blur(8px)}.statGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat{background:#fff;color:var(--navy);border-radius:16px;padding:18px}.stat b{font-size:28px;display:block}.btn{border:0;border-radius:12px;padding:11px 15px;background:var(--blue);color:#fff;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:7px;justify-content:center}.btn:hover{filter:brightness(1.06)}.btn.gold{background:var(--gold);color:var(--navy)}.btn.green{background:var(--green)}.btn.ghost{background:#fff;color:var(--blue);border:1px solid var(--line)}.section{padding:42px 0}.sectionTitle{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:20px}.sectionTitle h2{font-size:32px;margin:0;color:var(--navy)}.filters{display:flex;gap:8px;flex-wrap:wrap}.filter{border:1px solid var(--line);background:#fff;padding:9px 13px;border-radius:999px;cursor:pointer}.filter.active{background:var(--navy);color:#fff}.lessonGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.lessonCard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;transition:.2s;position:relative;overflow:hidden}.lessonCard:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(7,29,58,.09)}.lessonNum{font-size:12px;font-weight:900;color:var(--blue);text-transform:uppercase}.lessonIcon{font-size:32px}.lessonCard h3{margin:8px 0 6px;color:var(--navy)}.miniProgress{height:7px;background:#edf2f7;border-radius:10px;overflow:hidden;margin:14px 0}.miniProgress span{display:block;height:100%;background:var(--gold)}footer{background:var(--navy);color:#cfe0f4;text-align:center;padding:30px;margin-top:30px}.lessonHero{background:linear-gradient(120deg,#071d3a,#0c4f92);color:#fff;padding:42px 0}.lessonHero h1{font-size:clamp(32px,5vw,54px);margin:8px 0}.lessonHero h2{margin:0;color:#cfe7ff;font-weight:500}.progressShell{height:10px;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden}.progress{height:100%;background:var(--gold);transition:.3s}.lessonLayout{display:grid;grid-template-columns:220px 1fr;gap:20px;padding-top:24px}.sidebar{position:sticky;top:78px;align-self:start}.sideBtn{width:100%;text-align:left;border:0;background:transparent;padding:9px 8px;border-radius:9px;color:#40516a;cursor:pointer}.sideBtn:hover{background:var(--sky);color:var(--blue)}.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px}.contentGrid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.span12{grid-column:span 12}.span6{grid-column:span 6}.card h3{font-size:24px;margin:10px 0;color:var(--navy)}.muted{color:var(--muted)}.words{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.word{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--panel)}.word b{font-size:18px;color:var(--blue)}.listen{border:0;background:#e7f2ff;color:var(--blue);border-radius:9px;padding:7px 10px;cursor:pointer;margin-top:7px}.line{display:grid;grid-template-columns:90px 1fr auto;gap:10px;align-items:center;margin:10px 0}.speaker{font-weight:900;color:var(--blue)}.bubble{background:#f3f7fb;border-radius:13px;padding:11px 14px}.exercise{border-top:1px solid var(--line);padding:15px 0}.exercise:first-child{border-top:0}.options{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}.opt{border:1px solid var(--line);background:#fff;padding:9px 12px;border-radius:10px;cursor:pointer}.opt.good{background:#e8f7ef;border-color:#8bd1ad;color:#11633f}.opt.bad{background:#fff0f1;border-color:#e4a1a8;color:#9b2631}.result{margin-top:12px;padding:12px;border-radius:12px;background:#f5f8fc}.target{font-size:25px;font-weight:900;color:var(--navy);padding:15px 0}.mission{background:linear-gradient(135deg,#fff9e9,#fff)}.xp{font-size:38px;font-weight:900;color:var(--blue)}.activityTabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.pill{background:#eef5fb;border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-size:13px}.reading{font-size:17px;background:#f8fbff;border-left:4px solid var(--blue);padding:16px;border-radius:10px}.input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font-size:16px}.celebrate{text-align:center;padding:28px;background:linear-gradient(135deg,#fff5cc,#fff);border:1px solid #f2d576;border-radius:20px}.hidden{display:none}@media(max-width:900px){.heroGrid,.lessonLayout{grid-template-columns:1fr}.lessonGrid{grid-template-columns:repeat(2,1fr)}.sidebar{position:static}.span6{grid-column:span 12}.words{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.navlinks{display:none}.lessonGrid,.words{grid-template-columns:1fr}.hero{padding:45px 0}.line{grid-template-columns:1fr}.sectionTitle{align-items:start;flex-direction:column}.card{padding:17px}.wrap{padding:0 14px}}