:root{--green:#157a55;--lime:#c8f05a;--ink:#15352b;--muted:#6e8179;--line:#deebe5;--cream:#f6faf7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Be Vietnam Pro",sans-serif;background:#fff}.topbar{height:84px;display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:auto;padding:0 24px}.brand{font-size:26px;font-weight:800;letter-spacing:-1.8px;color:var(--ink);text-decoration:none}.brand span{color:var(--green)}nav{display:flex;gap:34px;margin-left:100px}nav a{font-size:14px;font-weight:600;color:#789087;text-decoration:none;padding:9px 0}nav a.active{color:var(--green);border-bottom:2px solid var(--green)}button{font:inherit;cursor:pointer}.login{border:1px solid #cde0d7;border-radius:8px;color:var(--green);background:#fff;font-size:14px;font-weight:700;padding:10px 15px}.login span{margin-left:8px}.hero{min-height:550px;overflow:hidden;display:grid;grid-template-columns:1fr .82fr;gap:32px;max-width:1180px;padding:90px 24px 72px;margin:auto}.hero-copy{padding-left:56px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.3px;color:var(--green);margin:0 0 18px}.eyebrow i{display:inline-block;width:16px;height:2px;vertical-align:middle;background:var(--lime);margin:0 8px 0 0}h1,h2,h3,p{margin-top:0}h1{font-size:58px;line-height:1.13;letter-spacing:-3.4px;margin-bottom:20px}em{font-style:normal;color:var(--green)}.intro{line-height:1.75;color:var(--muted);font-size:15px;max-width:425px;margin-bottom:29px}.hero-actions{display:flex;align-items:center;gap:26px}.primary-button{border:0;border-radius:8px;padding:14px 17px;background:var(--green);color:white;font-size:14px;font-weight:700;box-shadow:0 7px 14px #157a5520}.primary-button span{font-size:20px;margin-left:13px;vertical-align:-1px}.text-button{background:transparent;border:0;color:var(--green);font-size:13px;font-weight:700}.text-button span{margin-left:5px}.trust-row{display:flex;align-items:center;gap:12px;margin-top:36px}.trust-row p{margin:0;color:var(--muted);font-size:11px}.trust-row strong{color:var(--ink)}.avatars{display:flex}.avatars b{border:2px solid white;margin-left:-7px;border-radius:50%;width:24px;height:24px;color:#174033;background:#ccebc9;font-size:9px;display:grid;place-items:center}.avatars b:nth-child(2){background:#ffe3bd}.avatars b:nth-child(3){background:#d8d4fc}.avatars b:nth-child(4){background:var(--green);color:white}.hero-visual{position:relative;min-height:350px}.circle{position:absolute;border-radius:50%}.c1{width:400px;height:400px;right:-50px;top:-25px;background:#eff8e9}.c2{width:270px;height:270px;right:40px;top:45px;background:#dff2cc}.c3{width:90px;height:90px;background:var(--lime);top:27px;right:22px}.visual-card{position:absolute;width:325px;right:67px;top:73px;background:white;border-radius:13px;padding:25px 27px;box-shadow:0 22px 50px #174c3920;transform:rotate(-3deg)}.mini-top{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.mini-top b{color:var(--green)}.progress{height:6px;background:#e4efe9;border-radius:4px;margin:18px 0}.progress i{display:block;width:42%;height:100%;border-radius:4px;background:var(--green)}.visual-card p{font-size:17px;font-weight:700;line-height:1.5;margin:0 0 26px}.keys{display:flex;gap:9px}.keys span{width:40px;height:37px;display:grid;place-items:center;background:#f0f7f2;border:1px solid #dcece2;border-radius:5px;font-family:"DM Mono";font-size:13px;color:var(--green)}.keys span:nth-child(1),.keys span:nth-child(2){background:var(--lime);border-color:var(--lime)}.spark{position:absolute;right:-22px;bottom:-20px;background:var(--green);color:var(--lime);border-radius:50%;width:48px;height:48px;display:grid;place-items:center;font-size:21px;transform:rotate(20deg)}.practice{background:var(--cream);padding:78px max(24px,calc((100% - 1068px)/2)) 88px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:27px}.section-heading .eyebrow{margin-bottom:10px}h2{font-size:32px;line-height:1.2;letter-spacing:-1.7px;margin-bottom:0}.mode-switch{padding:4px;border:1px solid #dce8e2;border-radius:7px;background:white}.mode-switch button{border:0;border-radius:4px;background:transparent;color:var(--muted);font-size:11px;font-weight:700;padding:9px 13px}.mode-switch .selected{background:#e5f5df;color:var(--green)}.practice-grid{display:grid;grid-template-columns:1fr 265px;gap:22px}.typing-card{background:#fff;border-radius:10px;padding:25px 31px 20px;box-shadow:0 3px 14px #244b3d08}.stats{display:grid;grid-template-columns:repeat(3,1fr) 35px;padding-bottom:19px;border-bottom:1px solid var(--line)}.stats div span{display:block;color:#83948d;font-size:10px;margin-bottom:4px}.stats strong{font-size:22px;letter-spacing:-1px}.stats small{font-size:10px;letter-spacing:0;color:var(--green)}.reset{width:29px;height:29px;align-self:center;border:1px solid var(--line);border-radius:6px;background:white;color:var(--green);font-size:18px}.lesson-label{font-size:11px;font-weight:700;color:#648077;margin:24px 0 15px}.lesson-label span{color:var(--green);margin-right:8px}.prompt{font-family:"DM Mono",monospace;font-size:21px;line-height:1.8;letter-spacing:.3px;min-height:72px;margin:0}.prompt .current{background:#dff5d5;color:var(--green);border-radius:2px}.prompt .wrong{color:#d35757;text-decoration:underline}.typing-label{display:block;font-size:10px;color:#7a8e85;font-weight:700;margin-top:13px}textarea{resize:none;width:100%;border:1px solid #cfe1d8;border-radius:6px;padding:11px 12px;line-height:1.5;color:var(--ink);margin-top:7px;outline:0;font:14px "DM Mono",monospace}textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px #157a5510}.feedback{margin:10px 0 0;color:#7b9086;font-size:10px}.tip-card{background:var(--green);padding:27px 25px;border-radius:10px;color:#fff;position:relative;overflow:hidden}.tip-card:after{content:"";position:absolute;width:180px;height:180px;right:-90px;bottom:-70px;border:25px solid #2a946b;border-radius:50%}.tip-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;background:#47a57d;color:var(--lime);font-size:21px}.tip-number{font-size:9px;font-weight:800;letter-spacing:1.2px;color:var(--lime);margin:26px 0 9px}.tip-card h3{font-size:21px;letter-spacing:-1px;margin-bottom:10px}.tip-card>p:not(.tip-number){font-size:12px;line-height:1.7;color:#c8e5d6}.finger-guide{position:relative;z-index:1;display:flex;gap:4px;flex-wrap:wrap;margin-top:31px}.finger-guide span{border:1px solid #58ad89;border-radius:3px;padding:4px 6px;font-size:9px;color:#d7f1e2}.benefits{max-width:1068px;margin:auto;display:grid;grid-template-columns:.7fr 1fr;gap:130px;padding:95px 0}.benefits h2{font-size:42px;line-height:1.17}.benefit-list article{display:flex;gap:25px;padding:5px 0 22px;margin-bottom:20px;border-bottom:1px solid var(--line)}.benefit-list>article>span{font-size:12px;color:#a0b3aa;font-weight:700;padding-top:5px}.benefit-list h3{font-size:17px;margin:0 0 7px}.benefit-list p{font-size:12px;color:var(--muted);line-height:1.7;margin:0}footer{max-width:1068px;border-top:1px solid var(--line);margin:auto;padding:23px 0 34px;display:flex;align-items:center;justify-content:space-between}footer .brand{font-size:18px}footer p,footer span{font-size:10px;color:#90a39a;margin:0}@media(max-width:750px){.topbar{height:68px}.topbar nav{display:none}.hero{grid-template-columns:1fr;padding:60px 24px 25px}.hero-copy{padding:0}h1{font-size:44px}.hero-visual{min-height:280px}.visual-card{right:50%;transform:translateX(50%) rotate(-3deg);top:36px}.practice-grid,.benefits{grid-template-columns:1fr}.section-heading{align-items:flex-start;gap:18px}.practice{padding:55px 24px}.tip-card{min-height:260px}.benefits{padding:60px 24px;gap:40px}.benefits h2{font-size:35px}footer{margin:0 24px;gap:13px;flex-wrap:wrap}.stats{grid-template-columns:repeat(3,1fr) 29px}.typing-card{padding:22px 18px}.prompt{font-size:17px}.hero-actions{align-items:flex-start;flex-direction:column;gap:15px}}