*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f7f8fb;color:#1f2937}a{text-decoration:none;color:inherit}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}:root{--brand:#e83e5b;--brand-dark:#c92846;--ink:#172033;--muted:#6b7280;--line:#e6e9ef;--card:#fff;--success:#22c55e;--warning:#f59e0b;--shadow:0 14px 40px rgba(28,36,50,.08)}
.shell{min-height:100vh}.topbar{height:72px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:50}.brand{display:flex;align-items:center;gap:12px}.brand img{width:43px;height:43px;object-fit:contain}.brand-copy strong{display:block;font-size:17px;color:var(--ink)}.brand-copy span{font-size:11px;color:#9aa1ad;letter-spacing:.04em}.top-actions{display:flex;align-items:center;gap:10px}.pill{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border:1px solid var(--line);background:white;border-radius:999px;font-size:13px;font-weight:700}.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#ffd166,#ef476f);display:grid;place-items:center;color:white;font-weight:900;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}
.layout{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 72px)}.sidebar{background:#fff;border-right:1px solid var(--line);padding:20px 14px;position:sticky;top:72px;height:calc(100vh - 72px)}.nav-group{display:flex;flex-direction:column;gap:7px}.nav-link{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:14px;font-size:14px;font-weight:750;color:#657083}.nav-link:hover{background:#f6f7fa;color:var(--ink)}.nav-link.active{background:#fff0f3;color:var(--brand)}.nav-icon{width:25px;text-align:center;font-size:19px}.sidebar-foot{position:absolute;bottom:18px;left:14px;right:14px;padding:13px;border-radius:16px;background:#f8fafc;border:1px solid var(--line);font-size:11px;color:#86909d}.main{min-width:0;padding:28px 34px 90px}.container{max-width:1160px;margin:auto}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:24px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:900;color:var(--brand)}h1{font-size:30px;line-height:1.15;margin:5px 0 6px;color:var(--ink)}.subtitle{font-size:14px;line-height:1.65;color:var(--muted);max-width:700px}.btn{border:0;border-radius:14px;padding:11px 16px;font-weight:850;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}.btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 20px rgba(232,62,91,.22)}.btn-primary:hover{transform:translateY(-1px);background:var(--brand-dark)}.btn-secondary{background:white;border:1px solid var(--line);color:var(--ink)}.btn-soft{background:#fff0f3;color:var(--brand)}
.hero{border-radius:28px;padding:28px;background:linear-gradient(135deg,#172033,#293653);color:white;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08);right:-50px;top:-80px}.hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:20px;position:relative;z-index:2}.hero h2{font-size:29px;margin:4px 0 8px}.hero p{color:#cdd4df;line-height:1.6;margin:0 0 18px}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.hero-stat{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);padding:14px;border-radius:17px}.hero-stat b{display:block;font-size:22px}.hero-stat span{font-size:11px;color:#cbd5e1}.daily-ring{width:150px;height:150px;border-radius:50%;margin:auto;display:grid;place-items:center;background:conic-gradient(#45d483 0 72%,rgba(255,255,255,.13) 72%);position:relative}.daily-ring:before{content:"";position:absolute;inset:12px;border-radius:50%;background:#202b43}.daily-ring>div{position:relative;text-align:center}.daily-ring b{font-size:26px;display:block}.daily-ring span{font-size:11px;color:#cbd5e1}
.grid{display:grid;gap:16px}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}.card{background:white;border:1px solid var(--line);border-radius:22px;padding:20px;box-shadow:0 5px 18px rgba(27,35,50,.04)}.section-title{display:flex;align-items:center;justify-content:space-between;margin:26px 0 13px}.section-title h3{margin:0;font-size:17px;color:var(--ink)}.section-title a{font-size:12px;color:var(--brand);font-weight:800}.metric{display:flex;align-items:center;gap:12px}.metric-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:21px;background:#f5f7fa}.metric b{display:block;font-size:19px;color:var(--ink)}.metric span{font-size:11px;color:var(--muted)}
.course-card{position:relative;overflow:hidden;padding:20px;border-radius:24px;background:white;border:1px solid var(--line);transition:.2s}.course-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.course-top{display:flex;align-items:center;justify-content:space-between}.flag{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;font-size:27px;background:var(--soft,#f8fafc)}.course-card h3{margin:14px 0 2px;font-size:18px}.native{font-size:12px;color:var(--muted)}.course-card p{font-size:12px;line-height:1.55;color:#6d7685;min-height:56px}.progress{height:9px;background:#edf0f4;border-radius:999px;overflow:hidden}.progress>i{display:block;height:100%;border-radius:inherit;background:var(--course,#ef4444)}.progress-row{display:flex;justify-content:space-between;font-size:11px;margin:8px 0 6px;color:#727b89}.course-cta{margin-top:14px;width:100%;background:var(--course,#ef4444);color:white}
.path-wrap{max-width:760px;margin:0 auto}.week-card{background:white;border:1px solid var(--line);border-radius:24px;padding:18px;margin:20px 0 10px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 15px rgba(0,0,0,.03)}.week-card strong{font-size:15px}.week-card small{display:block;color:var(--muted);margin-top:3px}.path{position:relative;padding:16px 0 34px}.path:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:5px;background:#e8ebf0;border-radius:9px;transform:translateX(-50%)}.path-node{width:50%;padding:11px 45px;position:relative}.path-node:nth-child(even){margin-left:50%;text-align:left}.path-node:nth-child(odd){text-align:right}.node-dot{position:absolute;width:64px;height:64px;border-radius:21px;top:9px;display:grid;place-items:center;font-weight:900;font-size:22px;color:white;border:7px solid #f7f8fb;box-shadow:0 5px 14px rgba(0,0,0,.12);background:var(--course,#e83e5b)}.path-node:nth-child(odd) .node-dot{right:-32px}.path-node:nth-child(even) .node-dot{left:-32px}.node-box{display:inline-block;background:white;border:1px solid var(--line);border-radius:18px;padding:13px 15px;min-width:225px;text-align:left;box-shadow:0 5px 18px rgba(0,0,0,.035)}.node-box b{display:block;font-size:13px}.node-box span{font-size:11px;color:var(--muted);display:block;margin-top:4px}.node-box em{font-style:normal;font-size:10px;font-weight:850;color:var(--course,#e83e5b);display:block;margin-top:7px}
.module-hero{border-radius:26px;padding:24px;color:#fff;background:linear-gradient(135deg,var(--course),color-mix(in srgb,var(--course) 72%,#111));margin-bottom:20px}.module-hero h1{color:#fff;margin:5px 0}.module-hero p{color:rgba(255,255,255,.82);max-width:760px}.module-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.meta-chip{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);padding:8px 10px;border-radius:12px;font-size:11px;font-weight:800}.lesson-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.lesson-row{background:white;border:1px solid var(--line);border-radius:18px;padding:15px;display:flex;gap:13px;align-items:center}.lesson-number{width:42px;height:42px;border-radius:14px;background:var(--courseSoft,#f8fafc);color:var(--course);display:grid;place-items:center;font-weight:900}.lesson-copy{flex:1;min-width:0}.lesson-copy b{font-size:14px}.lesson-copy span{display:block;font-size:11px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-dots{display:flex;gap:4px}.stage-dots i{width:7px;height:7px;border-radius:50%;background:#dfe3ea}.stage-dots i.done{background:var(--course)}
.lesson-shell{max-width:820px;margin:0 auto}.lesson-top{display:flex;align-items:center;gap:13px;margin-bottom:22px}.lesson-top .progress{flex:1;height:12px}.close-btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:white;font-weight:900}.xp-chip{font-size:12px;font-weight:900;color:#f59e0b}.question-card{background:white;border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow)}.lesson-label{font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:900;color:var(--course)}.big-term{font-size:48px;font-weight:900;line-height:1.1;color:var(--ink);margin:14px 0 8px}.reading{font-size:19px;color:var(--course);font-weight:800}.meaning{font-size:15px;color:#505a69;margin-top:8px}.sound-actions{display:flex;gap:8px;margin:18px 0}.sound-btn{border:0;border-radius:14px;padding:10px 13px;background:var(--courseSoft);color:var(--course);font-weight:850}.tip-box{padding:15px;border-radius:17px;background:#f8fafc;border:1px solid #edf0f4;margin-top:14px}.tip-box b{font-size:12px}.tip-box p{font-size:12px;color:var(--muted);line-height:1.55;margin:5px 0 0}.example-box{padding:17px;border-radius:18px;background:#fffaf0;border:1px solid #fde9b5;margin-top:14px}.example-box strong{display:block;font-size:15px}.example-box span{display:block;color:#7b6a45;font-size:12px;margin-top:5px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.choice{padding:15px;border:2px solid #e6e9ef;background:white;border-radius:17px;font-weight:800;text-align:left}.choice:hover{border-color:var(--course);background:var(--courseSoft)}.lesson-footer{display:flex;justify-content:space-between;align-items:center;margin-top:16px}.stage-tabs{display:flex;gap:7px}.stage-tab{font-size:11px;font-weight:850;padding:7px 10px;border-radius:999px;background:#eef1f5;color:#7b8491}.stage-tab.active{background:var(--courseSoft);color:var(--course)}
.auth-page{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.auth-visual{padding:48px;background:linear-gradient(155deg,#172033,#2a3754);color:white;display:flex;flex-direction:column;justify-content:space-between}.auth-visual img{width:58px;height:58px;background:white;border-radius:18px;padding:6px}.auth-visual h1{color:white;font-size:42px;max-width:530px}.auth-visual p{color:#cbd5e1;line-height:1.65;max-width:530px}.auth-feature{display:flex;gap:11px;align-items:center;margin:10px 0;font-size:13px;color:#e6ebf2}.auth-main{display:flex;align-items:center;justify-content:center;padding:40px}.auth-card{width:100%;max-width:430px}.auth-card h2{font-size:28px;margin:0 0 5px}.auth-card>p{color:var(--muted);font-size:13px;margin:0 0 24px}.field{margin-bottom:14px}.field label{display:block;font-size:12px;font-weight:800;margin-bottom:7px}.field input,.field select{width:100%;height:48px;border:1.5px solid #dfe3ea;border-radius:14px;padding:0 14px;outline:none}.field input:focus{border-color:var(--brand);box-shadow:0 0 0 4px #fff0f3}.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:#9aa1ad;font-size:11px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#e6e9ef}.google-wrap{min-height:44px}.auth-msg{font-size:12px;padding:11px 12px;border-radius:12px;margin:10px 0}.auth-msg.error{background:#fff1f2;color:#be123c}.auth-msg.info{background:#eff6ff;color:#1d4ed8}.demo-btn{width:100%;margin-top:9px}.auth-foot{text-align:center;font-size:12px;color:var(--muted);margin-top:18px}.auth-foot a{color:var(--brand);font-weight:800}
.practice-card{text-align:center;max-width:720px;margin:auto}.practice-icon{width:82px;height:82px;border-radius:28px;margin:0 auto 14px;display:grid;place-items:center;font-size:37px;background:#fff4e6}.practice-card h2{margin:4px 0 8px}.answer-stack{display:grid;gap:10px;margin-top:18px}.answer-btn{border:2px solid var(--line);background:white;border-radius:16px;padding:14px;font-weight:800}.answer-btn:hover{border-color:var(--brand);background:#fff5f7}.chart-bars{display:flex;align-items:end;gap:10px;height:130px;padding-top:10px}.bar{flex:1;background:#f0f2f6;border-radius:10px 10px 4px 4px;min-width:18px;position:relative}.bar i{position:absolute;inset:auto 0 0;background:var(--brand);border-radius:inherit}.bar span{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:10px;color:#9aa1ad}.profile-grid{display:grid;grid-template-columns:280px 1fr;gap:18px}.profile-card{text-align:center}.profile-avatar{width:92px;height:92px;margin:auto;border-radius:30px;background:linear-gradient(135deg,#ffd166,#ef476f);display:grid;place-items:center;color:white;font-size:32px;font-weight:900;overflow:hidden}.profile-avatar img{width:100%;height:100%;object-fit:cover}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line)}.settings-row:last-child{border:0}.settings-row b{font-size:13px}.settings-row span{display:block;font-size:11px;color:var(--muted);margin-top:3px}.toggle{width:44px;height:24px;border-radius:999px;background:#d9dee6;position:relative}.toggle:after{content:"";width:18px;height:18px;border-radius:50%;background:white;position:absolute;top:3px;left:3px;transition:.2s}.toggle.on{background:var(--brand)}.toggle.on:after{left:23px}
.mobile-nav{display:none}.landing{background:white}.landing .topbar{position:relative}.landing-hero{max-width:1160px;margin:auto;padding:76px 30px 60px;display:grid;grid-template-columns:1.08fr .92fr;gap:50px;align-items:center}.landing-hero h1{font-size:54px;letter-spacing:-.03em}.landing-hero p{font-size:17px;color:#667085;line-height:1.7}.landing-visual{background:#f7f8fb;border:1px solid var(--line);border-radius:34px;padding:24px}.mini-path{position:relative;padding:10px}.mini-path:before{content:"";position:absolute;left:50%;top:10px;bottom:10px;width:5px;background:#e5e7eb;border-radius:8px}.mini-node{position:relative;width:70px;height:70px;border-radius:24px;display:grid;place-items:center;color:white;font-size:27px;font-weight:900;margin:18px auto;z-index:2;box-shadow:0 8px 18px rgba(0,0,0,.12)}.landing-section{max-width:1160px;margin:auto;padding:60px 30px}.landing-section h2{text-align:center;font-size:34px}.landing-section>p{text-align:center;color:var(--muted);max-width:700px;margin:0 auto 30px;line-height:1.6}
@media(max-width:1000px){.grid-4{grid-template-columns:repeat(2,1fr)}.hero-grid{grid-template-columns:1fr}.daily-ring{display:none}.lesson-list{grid-template-columns:1fr}.landing-hero{grid-template-columns:1fr}.landing-visual{max-width:620px}.auth-page{grid-template-columns:1fr}.auth-visual{display:none}.profile-grid{grid-template-columns:1fr}}
@media(max-width:760px){.topbar{height:62px;padding:0 14px}.brand-copy span{display:none}.layout{display:block}.sidebar{display:none}.main{padding:20px 14px 92px}.page-head{align-items:flex-start;flex-direction:column}.page-head .btn{width:100%}h1{font-size:26px}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.hero{padding:22px}.hero h2{font-size:24px}.hero-stats{grid-template-columns:repeat(3,1fr)}.hero-stat{padding:11px}.hero-stat b{font-size:18px}.mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;height:68px;background:rgba(255,255,255,.97);border-top:1px solid var(--line);z-index:60}.mobile-nav a{display:grid;place-items:center;font-size:10px;color:#798291;font-weight:800}.mobile-nav a span{display:block;font-size:20px;text-align:center}.mobile-nav a.active{color:var(--brand)}.path:before{left:31px}.path-node,.path-node:nth-child(even){width:100%;margin:0;text-align:left;padding:10px 0 10px 80px}.path-node:nth-child(odd) .node-dot,.path-node:nth-child(even) .node-dot{left:0;right:auto}.node-box{width:100%;min-width:0}.choice-grid{grid-template-columns:1fr}.big-term{font-size:40px}.top-actions .pill{display:none}.landing-hero{padding:44px 18px}.landing-hero h1{font-size:38px}.landing-section{padding:45px 18px}.auth-main{padding:28px 18px}.hero-stats{gap:6px}.profile-grid{grid-template-columns:1fr}}