@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Nunito:wght@500;600;700;800;900&display=swap');
:root{--ink:#303c32;--green:#4d714b;--orange:#d67943;--muted:#7b8175;--cream:#f9f6ed}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #d88a50;outline-offset:4px}header{max-width:1180px;margin:auto;padding:28px 36px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:11px;text-decoration:none;color:var(--ink);font-family:Nunito,sans-serif;font-size:23px;font-weight:900;line-height:1.1}.brand-icon{font-size:44px;color:var(--orange)}.brand-sub{display:block;font-size:9px;font-family:'DM Sans',sans-serif;letter-spacing:2px;margin-top:6px;font-weight:600}.quiet{background:transparent;border:1px solid #deded1;border-radius:30px;padding:10px 17px;color:var(--green);font-size:13px}main{max-width:1080px;margin:24px auto 0;padding:0 24px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--green)}.eyebrow>span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#88a17b;margin-right:6px}h1{font:900 clamp(34px,4.3vw,53px)/1.12 Nunito,sans-serif;margin:17px 0 12px;letter-spacing:-1.8px}h1 em{font-style:normal;color:var(--green);position:relative}h1 em:after{content:'';position:absolute;bottom:-4px;left:0;width:100%;height:6px;border-radius:100%;border-top:3px solid #dbad70;transform:rotate(-3deg)}.wave{display:inline-block;font-size:32px;transform-origin:bottom center;animation:wave 3s ease-in-out infinite}.intro{color:var(--muted);font-size:14px;margin-bottom:28px}.modes{display:flex;gap:10px;margin-bottom:20px}.modes button{background:#fffcf5;border:1px solid #e3e3d7;border-radius:13px;padding:13px 20px;text-align:left;display:grid;grid-template-columns:28px 1fr;column-gap:8px;min-width:175px;color:#66705f;font-weight:700;font-size:13px}.modes button>span{grid-row:span 2;font-size:22px;align-self:center}.modes small{font-size:10px;font-weight:400;margin-top:3px;opacity:.8}.modes .selected{background:var(--green);color:white;border-color:var(--green);box-shadow:0 5px 10px #405e4514}.workspace{display:grid;grid-template-columns:1fr 294px;gap:22px}.practice{background:#fffefa;border:1px solid #e1e4d5;border-radius:22px;padding:24px 30px 16px;box-shadow:0 8px 25px #444c3110;min-width:0}.card-top{display:flex;justify-content:space-between;gap:8px;font-size:9px;letter-spacing:1.5px;color:#7f8c73;font-weight:700}.untimed{letter-spacing:0;font-weight:500;color:#8a8e82}.prompt-head{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:27px}.prompt-head p{font-size:14px;color:#7b8174}.listen{background:#edf1e5;color:var(--green);border:none;border-radius:20px;padding:7px 12px;font-size:11px}#picture{text-align:center;font-size:31px;margin:8px auto 0}#target{font:800 62px/1.4 Nunito,sans-serif;letter-spacing:5px;text-align:center;min-height:95px;overflow-wrap:anywhere;padding:3px 0 12px}#target.long{font-size:32px;letter-spacing:2px}#target span.correct{color:#79a06b}#target span.current{border-bottom:4px solid #dbab62}#target span.wrong{color:#c75e50;background:#fbe7dd;border-radius:5px}#typing{display:block;width:100%;background:#f9faf4;border:2px solid #dce5cf;border-radius:12px;padding:16px;text-align:center;outline:none;font-size:16px;caret-color:var(--green)}#typing:focus{border-color:#87a779;box-shadow:0 0 0 4px #e6eedc}#typing::placeholder{color:#aaa99b;font-size:13px}#feedback{text-align:center;color:#7e8970;font-size:12px;min-height:18px;margin:15px 0 20px}.practice-bottom{border-top:1px dashed #e3e5d9;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;color:#9a9e90}.text-button{border:0;background:none;color:#758468;padding:4px;font-size:11px}#next{border:0;background:var(--green);color:white;border-radius:20px;padding:9px 15px;font-size:12px}aside{border-radius:22px;overflow:hidden;background:#eff1e3;border:1px solid #e2e5d7}.buddy{height:180px;position:relative;background:#e9efdd;overflow:hidden}.sun{position:absolute;right:23px;top:10px;font-size:49px;color:#e4b45a;animation:spin 40s linear infinite}.plant{position:absolute;bottom:14px;left:40px;z-index:2}.flower{display:block;font-size:88px;line-height:1;transform-origin:bottom center;animation:sway 4s ease-in-out infinite}.pot{height:32px;width:53px;margin:-7px auto 0;background:#c77c53;clip-path:polygon(0 0,100% 0,85% 100%,15% 100%);border-top:6px solid #da956a}.ground{position:absolute;bottom:-40px;left:-20px;width:360px;height:75px;border-radius:50%;background:#d8e3c5}.speech{position:absolute;right:18px;top:85px;background:#fffdf3;border-radius:15px 15px 15px 2px;padding:12px;font-size:10px;line-height:1.6;transform:rotate(3deg);text-align:center}.garden-info{padding:22px 23px}.garden-info .eyebrow{font-size:8px;letter-spacing:1.3px}h2{font:800 20px Nunito,sans-serif;margin:9px 0}h2>span:last-child{color:#d39558}.garden-info p{font-size:10px;color:#89917d}#flower-bed{font-size:11px;color:#97a086;min-height:42px;padding:12px 0 8px;line-height:1.6}.stats{border-top:1px solid #dce2cf;display:flex;margin-top:10px;padding-top:15px;gap:35px}.stats b{font:800 20px Nunito,sans-serif;display:block}.stats span{display:block;font-size:9px;color:#89917d;margin-top:3px}.keyboard-section{max-width:710px;margin:30px auto 0}.keyboard-heading{display:flex;justify-content:space-between;margin:0 10px 12px;font-size:9px;color:#939a86;letter-spacing:1.3px}#key-hint{letter-spacing:0;color:var(--green)}.key-row{display:flex;justify-content:center;gap:7px;margin:7px 0}.key{display:flex;align-items:center;justify-content:center;background:#fffdf7;border:1px solid #e0e1d3;border-bottom:3px solid #dcdfcf;border-radius:7px;width:45px;height:40px;color:#7d8571;font-size:12px;font-weight:600;transition:background .2s,transform .2s}.key.space{width:245px;font-size:9px}.key.lit{background:#e7b56a;color:#463c28;border-color:#d5a15b;transform:translateY(-3px);box-shadow:0 3px 13px #dca65040}.keyboard-section>p{text-align:center;font-size:11px;color:#969d89;margin:16px 0}.keyboard-section>p span{color:#c67e5b}footer{border-top:1px solid #e5e6db;margin-top:30px;padding:20px 0;color:#a3a797;font-size:10px;display:flex;align-items:center;gap:4px}footer strong{font-weight:500;color:#7b886d}footer span{margin-left:3px;color:#b1b99e}footer button{margin-left:auto}.petal{position:fixed;color:#e4bb892f;z-index:-1;font-size:100px}.p1{top:140px;right:4%;transform:rotate(20deg)}.p2{top:400px;left:3%;font-size:50px}.p3{bottom:20px;right:8%}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}#confetti{pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetto{position:absolute;top:-30px;animation:fall 2s ease-in forwards;font-size:24px}@keyframes fall{to{transform:translateY(105vh) rotate(300deg);opacity:0}}@keyframes sway{50%{transform:rotate(8deg)}}@keyframes wave{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(16deg)}80%{transform:rotate(-8deg)}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:760px){header{padding:22px}.brand{font-size:19px}main{margin-top:15px;padding:0 18px}.workspace{grid-template-columns:1fr}.modes{gap:6px}.modes button{min-width:0;flex:1;display:block;padding:12px 8px;font-size:11px;text-align:center}.modes small{display:none}.modes button>span{display:block;font-size:21px;margin-bottom:5px}.practice{padding:20px}.practice-bottom>span{display:none}aside{display:flex}.buddy{width:145px;flex-shrink:0;height:auto;min-height:190px}.plant{left:18px}.sun{right:4px;font-size:35px}.speech{display:none}.garden-info{padding:16px;flex:1}.garden-info h2{font-size:17px}.stats{gap:20px}.key-row{gap:4px}.key{width:8.5vw;max-width:44px;height:37px}.keyboard-heading{font-size:8px}#target.long{font-size:27px}h1{letter-spacing:-1px}.card-top{font-size:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}