:root{--green:#12685b;--dark:#143d35;--muted:#78837f;--line:#e5eae5;--bg:#f6f8f4;--yellow:#f4bd58}*{box-sizing:border-box}body{margin:0;font:15px/1.6 system-ui,-apple-system,Segoe UI,sans-serif;color:var(--dark);background:var(--bg)}button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;border-radius:12px;padding:12px 20px;background:var(--green);color:white;font-weight:650}button:hover{filter:brightness(.94)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #efb64c;outline-offset:3px}button.secondary{background:#edf3ee;color:var(--green)}button:disabled{opacity:.55;cursor:default}a{color:inherit;text-decoration:none}aside{position:fixed;width:245px;background:#fff;height:100vh;border-right:1px solid var(--line);padding:34px 24px;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;margin-bottom:48px}.brand b{background:var(--green);color:white;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:28px}.brand span{font-size:29px;font-weight:750;line-height:1.1;letter-spacing:-1px}.brand small{font-size:8px;letter-spacing:1.4px;display:block;margin-top:8px}nav{display:grid;gap:10px}nav a{padding:13px 15px;border-radius:11px;display:flex;gap:13px;color:#66766d;font-weight:600}nav a.active{color:var(--green);background:#eaf3ed}.aside-bottom{margin-top:auto}.seed{background:#f4f7ee;border-radius:16px;padding:21px;color:#648069;font-size:21px}.seed small{font-size:12px}.aside-bottom p{font-size:10px;letter-spacing:1.2px;color:#8c9991;padding-top:15px}.shell{margin-left:245px}header{height:90px;background:#ffffffb3;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 45px;color:#6b7a72}header>div{display:flex;align-items:center;gap:20px}.chip{font-size:12px}.avatar{border-radius:50%;padding:0;width:39px;height:39px;background:#e6eee5;color:var(--green)}main{max-width:1300px;margin:auto;padding:35px 45px;min-height:80vh}h1{font-size:31px;letter-spacing:-1px;line-height:1.25;margin:8px 0 12px}h2{font-size:21px;letter-spacing:-.4px;margin:0 0 16px}h3{margin:9px 0;font-size:18px}p{margin:8px 0}.muted{color:var(--muted)}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;text-transform:uppercase;color:var(--green)}.hero{margin:27px 0;background:var(--green);color:white;border-radius:23px;padding:35px 38px;display:grid;grid-template-columns:1.5fr 1fr;overflow:hidden;position:relative}.hero p{color:#d1e3d7;max-width:450px}.hero h2{font-size:30px;line-height:1.3;margin:12px 0}.hero button{background:var(--yellow);color:#294c38;margin-top:17px}.hero .eyebrow{color:#d1e3d7}.art{display:flex;align-items:center;justify-content:center;position:relative;min-height:180px}.art:before,.art:after{content:'';position:absolute;border:1px solid #ffffff20;border-radius:50%;width:260px;height:260px}.art:after{width:330px;height:330px}.han-card{transform:rotate(8deg);background:#f8f6e9;color:var(--green);width:150px;height:175px;border-radius:18px;display:grid;place-content:center;text-align:center;box-shadow:14px 15px 0 #0b5548}.han-card b{font-size:72px;line-height:1.2}.han-card span{font-size:12px}.floating{position:absolute;background:#ffffff20;backdrop-filter:blur(5px);border:1px solid #ffffff30;border-radius:12px;padding:8px 16px;right:0;bottom:13px;font-size:12px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:25px 0}.stat,.card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:23px}.stat strong{font-size:27px;display:block;margin:5px 0}.stat small{color:var(--muted)}.grid{display:grid;grid-template-columns:2fr 1fr;gap:23px;margin-top:29px}.section-head{display:flex;align-items:center;justify-content:space-between;margin:25px 0 16px}.section-head h2{margin:0}.text-link{font-size:12px;color:var(--green);font-weight:700}.lesson-row{display:flex;align-items:center;gap:16px;border-top:1px solid var(--line);padding:16px 0}.lesson-row:last-child{padding-bottom:0}.icon{width:48px;height:48px;background:#eef4eb;display:grid;place-items:center;font-size:24px;border-radius:12px;flex-shrink:0}.lesson-row .row-body{flex:1}.lesson-row h3{font-size:15px;margin:0}.lesson-row small{color:var(--muted);font-size:11px}.lesson-row button{padding:8px 12px;font-size:12px}.word{font-size:53px;margin:18px 0 0;line-height:1.3}.tag{display:inline-block;color:var(--green);background:#eef4eb;border-radius:7px;font-size:10px;font-weight:700;padding:4px 9px}.word-card{background:#fffaf0;border-color:#f0e8d5}.word-card button{margin-top:20px}.bar{height:7px;background:#eaf0e7;border-radius:7px;overflow:hidden;margin-top:14px}.bar i{height:100%;background:var(--green);display:block}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:19px;margin-top:25px}.course-grid .card{display:flex;flex-direction:column}.course-grid button{margin-top:auto}.course-grid p{font-size:13px;margin-bottom:20px}.course-grid .icon{margin-bottom:15px}.flash{padding:40px;text-align:center;max-width:650px;margin:26px auto;min-height:280px}.flash .word{font-size:90px}.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:20px}.tone-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:25px}.tone{font-size:46px;color:var(--green)}.note{border-radius:12px;background:#edf3ed;padding:16px;margin-top:23px;font-size:13px}.settings{max-width:720px}.field{display:block;margin:15px 0}.field span{display:block;font-weight:600;font-size:13px;margin-bottom:6px}input,select{border:1px solid #cad7cb;border-radius:10px;background:white;padding:11px;width:100%;color:var(--dark)}footer{padding:20px 45px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);display:flex;justify-content:space-between}dialog{width:min(750px,95vw);max-height:90vh;border:0;border-radius:23px;padding:30px;color:var(--dark)}dialog::backdrop{background:#12382fc0}dialog .top{display:flex;justify-content:space-between;align-items:center}dialog .close{background:#eef3ee;color:var(--dark);padding:7px 13px}.vocab-row{display:flex;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.vocab-row strong{font-size:28px;min-width:110px}.vocab-row>div{flex:1}.vocab-row button{padding:8px 13px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:23px}.answers button{background:white;border:1px solid #d7e1d8;color:var(--dark);text-align:left}.answers button.correct{background:#dff2e4;border-color:#4aa875}.answers button.wrong{background:#fff0ec;border-color:#d97c65}.result{text-align:center;padding:28px}.result .word{font-size:55px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);border-radius:12px;background:#153f35;color:white;padding:12px 20px;display:none;z-index:20}.progress-list{margin-top:20px}.pill{font-size:11px;border:1px solid var(--line);padding:5px 9px;border-radius:20px;color:var(--muted)}@media(min-width:1450px){main{padding-top:45px}}@media(max-width:1100px){aside{width:205px;padding:30px 17px}.shell{margin-left:205px}main{padding:28px}.course-grid{grid-template-columns:1fr 1fr}header{padding:0 28px}.hero{padding:28px}.floating{display:none}.tone-grid{grid-template-columns:1fr 1fr}}@media(max-width:700px){aside{width:100%;height:auto;position:sticky;top:0;padding:10px 14px;z-index:5;flex-direction:row;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{margin:0}.brand b{width:35px;height:35px;font-size:23px}.brand span{font-size:22px}.brand small,.aside-bottom,nav a span{display:none}nav{display:flex;gap:2px}nav a{padding:7px;font-size:18px}.shell{margin-left:0}header{height:60px;padding:0 18px}.chip{display:none}main{padding:23px 18px}h1{font-size:27px}.hero{padding:25px;grid-template-columns:1fr}.hero h2{font-size:25px}.art{display:none}.stats{gap:8px}.stat{padding:13px}.stat strong{font-size:22px}.stat small{font-size:10px}.grid{grid-template-columns:1fr}.course-grid{grid-template-columns:1fr}.tone-grid{gap:10px}.tone-grid .card{padding:18px}footer{padding:20px;display:block}footer span{display:block;margin-top:6px}.flash{padding:25px}.vocab-row{gap:10px}.vocab-row strong{min-width:80px;font-size:23px}.vocab-row button{padding:8px}.answers{grid-template-columns:1fr}dialog{padding:23px}}
