:root{--bg:#f6f5f0;--card:#fff;--ink:#203d37;--muted:#63746d;--line:#dce3da;--accent:#d6ef85;--green:#245647}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d38d37;outline-offset:4px}header{max-width:1320px;margin:auto;display:flex;align-items:center;gap:35px;padding:26px 5%;border-bottom:1px solid var(--line)}.brand{display:flex;gap:9px;text-decoration:none;color:var(--ink);font-size:27px;font-weight:850;letter-spacing:-1px}.brand:first-letter{color:var(--green)}.dot{color:#71972c}nav{display:flex;gap:18px;margin-left:auto}nav button,footer button{border:0;background:none;font-size:14px}nav button:hover,footer button:hover{text-decoration:underline}.xp{background:#e7eddf;border-radius:40px;padding:10px 18px;font-size:13px;font-weight:750;white-space:nowrap}main{max-width:1200px;margin:auto;padding:45px 28px 70px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}h1{font-size:clamp(38px,5vw,65px);line-height:1.09;letter-spacing:-2.5px;margin:18px 0 22px;font-weight:750}h2{font-size:26px;letter-spacing:-.7px}p{line-height:1.7;color:var(--muted)}.hero{display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:35px;margin-bottom:42px}.hero p{max-width:520px;font-size:16px}.art{position:relative;background:#e8eddf;border-radius:45% 45% 30% 40%;height:270px;display:flex;align-items:center;justify-content:center;overflow:hidden}.globe{width:190px;height:190px;border:1px solid #799c7a;border-radius:50%;position:relative;background:repeating-linear-gradient(0deg,transparent 0 35px,#b1c5a6 36px 37px)}.globe:before{content:'';position:absolute;inset:-1px 45px;border:1px solid #799c7a;border-radius:50%}.bubble{position:absolute;background:white;padding:13px 22px;border-radius:20px;box-shadow:0 10px 30px #234c3710;font-weight:700}.b1{top:35px;left:24px;transform:rotate(-9deg)}.b2{right:12px;top:115px;transform:rotate(8deg)}.b3{bottom:22px;left:42px;background:var(--accent);transform:rotate(-5deg)}.sectionhead{display:flex;align-items:center;justify-content:space-between;gap:20px}.tag{font-size:12px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.language{border:1px solid var(--line);background:var(--card);border-radius:20px;padding:24px;text-align:left;transition:transform .2s,box-shadow .2s;position:relative}.language:hover{transform:translateY(-4px);box-shadow:0 12px 26px #203d370c;border-color:#96ac88}.flag{font-size:32px;display:inline-flex;background:var(--bg);border-radius:14px;width:58px;height:58px;align-items:center;justify-content:center}.language h3{font-size:21px;margin:18px 0 4px}.native{font-size:14px;color:var(--muted)}.arrow{position:absolute;right:24px;top:37px;font-size:24px}.progress{height:5px;background:#edf0e8;border-radius:9px;margin:23px 0 9px;overflow:hidden}.progress i{display:block;background:#799d42;height:100%;border-radius:9px}.small{font-size:12px;color:var(--muted)}.banner{margin-top:28px;background:var(--green);color:white;padding:24px 28px;border-radius:20px;display:flex;align-items:center;gap:22px}.banner p{margin:4px 0 0;color:#d1dfd3;font-size:14px}.banner strong{font-size:18px}.banner .symbol{font-size:34px}.btn{background:var(--green);color:white;border:0;border-radius:12px;padding:14px 22px;font-weight:650}.btn:hover{filter:brightness(1.1)}.btn.secondary{background:#e8eddf;color:var(--ink)}.btn.lime{background:var(--accent);color:var(--ink)}.back{border:0;background:none;padding:0;margin-bottom:25px;color:var(--muted)}.coursehero{display:flex;align-items:center;gap:22px;margin-bottom:30px}.coursehero h1{font-size:40px;margin:0}.coursehero p{margin:6px 0}.lessons{display:grid;grid-template-columns:1fr 1fr;gap:16px}.lesson{background:white;border:1px solid var(--line);padding:24px;border-radius:18px;display:flex;gap:18px;align-items:center}.lesson .num{background:#edf2e4;padding:12px;border-radius:14px;font-weight:750}.lesson h3{margin:0 0 7px}.lesson p{margin:0;font-size:13px}.lesson button{margin-left:auto}.note{background:#e9eddf;border-radius:14px;padding:18px 22px;font-size:14px;line-height:1.7;margin:22px 0}.exercise{max-width:760px;margin:auto}.exhead{display:flex;align-items:center;gap:18px}.exhead .progress{flex:1;margin:0}.modebar{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.modebar button{border:1px solid var(--line);border-radius:30px;background:white;padding:9px 17px;font-size:13px}.modebar button.active{background:var(--green);color:white}.question{background:white;border:1px solid var(--line);padding:36px;border-radius:24px;min-height:330px;text-align:center}.prompt{font-size:30px;font-weight:700;line-height:1.5;margin:22px 0 10px}.roman{color:var(--muted);margin:8px 0 18px}.speak{border:0;background:#eef2e7;border-radius:30px;padding:9px 15px;margin:12px 0}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}.answer{background:white;border:1px solid #cbd5c5;padding:16px;border-radius:12px}.answer:hover{background:#f2f6e9}.answer:disabled{cursor:default;color:var(--ink);opacity:1}.answer.good{background:#e2f4ce;border-color:#81a85c}.answer.bad{background:#ffe8df;border-color:#c88e77}.write{padding:15px;border:1px solid #bacbb6;border-radius:12px;width:100%;margin:18px 0}.feedback{padding:18px;margin-top:18px;border-radius:14px;background:#e5efd9;line-height:1.6}.feedback.wrong{background:#f8e7de}.actions{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap}.statrow{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;margin:24px 0}.stat{background:#edf3e6;border-radius:15px;padding:22px;min-width:130px}.stat strong{display:block;font-size:30px}.empty{text-align:center;padding:65px 20px}footer{border-top:1px solid var(--line);padding:25px;text-align:center;color:var(--muted);font-size:12px}footer button{font-size:12px;display:block;margin:12px auto}dialog{border:1px solid var(--line);border-radius:22px;padding:32px;max-width:600px;width:90%;color:var(--ink);max-height:85vh}dialog::backdrop{background:#142d2566;backdrop-filter:blur(4px)}.close{float:right;border:0;background:none;font-size:20px}dialog label{display:block;margin:20px 0}dialog select{padding:10px;border-radius:8px;max-width:100%}.error{color:#9c452b}@media(max-width:700px){header{padding:20px;gap:10px}.brand{font-size:23px}nav{gap:6px}nav button{font-size:12px;padding:5px}.xp{padding:8px;font-size:11px}.hero{grid-template-columns:1fr;gap:12px}.art{height:190px}.globe{width:150px;height:150px}main{padding:30px 18px 45px}.grid{grid-template-columns:1fr 1fr;gap:12px}.language{padding:18px}.language h3{font-size:18px}.arrow{right:15px;top:31px}.lessons{grid-template-columns:1fr}.lesson{padding:17px;gap:10px}.lesson button{padding:12px}.sectionhead h2{font-size:22px}.question{padding:25px 17px}.prompt{font-size:25px}.answers{grid-template-columns:1fr}.banner{padding:22px}.coursehero h1{font-size:32px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
details{text-align:left}summary{cursor:pointer;line-height:1.7}select.write{background:white;color:var(--ink)}button:disabled{cursor:not-allowed;opacity:.55}.question .note{font-size:12px}.question p{overflow-wrap:anywhere}
.charhelp{text-align:left;background:#f0f3e9;border:1px solid #dae3cc;border-radius:14px;padding:16px;margin:22px 0 0;font-size:13px}.charhelp summary{font-weight:700}.charhelp p{font-size:13px}.charrows{display:grid;grid-template-columns:1fr;gap:10px}.charrow{display:flex;gap:15px;background:white;border-radius:10px;padding:12px;line-height:1.65;text-align:left}.charrow>strong{font-size:33px;min-width:48px;text-align:center;align-self:flex-start}.charrow small{color:var(--muted);font-size:11px}.charlayout{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start}.chargrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:9px}.charbutton{border:1px solid var(--line);background:white;border-radius:12px;padding:10px 5px}.charbutton>span{font-size:30px;display:block}.charbutton small{font-size:10px;display:block;color:var(--muted);overflow-wrap:anywhere}.charbutton.selected{background:var(--accent);border-color:var(--green)}.bigchar{font-size:84px;line-height:1.5}.chardetail{position:sticky;top:20px;padding:25px}.charhelp a{color:var(--green)}@media(max-width:700px){.charlayout{grid-template-columns:1fr}.chardetail{position:static}.chargrid{grid-template-columns:repeat(5,1fr)}.charrow>strong{min-width:35px;font-size:28px}.charrow{gap:10px;padding:10px}.charhelp{padding:12px}}
