@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Serif+SC:wght@500;600;700&display=swap";:root{color:#153c35;font-synthesis:none;--ink:#153c35;--paper:#f7f4ed;--cream:#ece7d9;--orange:#ed6a3a;--yellow:#f2b846;--mint:#bdd8ca;--line:#153c352b;background:#f7f4ed;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0}button,select{font:inherit}a{color:inherit}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;max-width:1180px;height:88px;margin:auto;padding:0 28px;display:flex}.brand{letter-spacing:.06em;grid-template-columns:auto auto;font-family:Noto Serif SC,serif;font-size:25px;line-height:.9;text-decoration:none;display:grid}.brand span{color:var(--orange)}.brand b{font-weight:700}.brand small{letter-spacing:.2em;text-transform:uppercase;grid-column:1/3;margin-top:8px;font:600 9px DM Sans}nav{align-items:center;gap:34px;font-size:14px;font-weight:600;display:flex}nav a{text-decoration:none}nav a:hover{color:var(--orange)}.streak{background:var(--cream);color:#8b4b2e;border-radius:99px;padding:9px 13px}main{max-width:1180px;margin:auto;padding:0 28px}.hero{grid-template-columns:1.2fr .8fr;align-items:center;gap:8vw;min-height:680px;padding:70px 0 90px;display:grid}.eyebrow,.section-kicker{color:var(--orange);text-transform:uppercase;letter-spacing:.22em;font-size:11px;font-weight:700}.hero h1{letter-spacing:-.03em;margin:20px 0 28px;font:600 clamp(42px,5.5vw,72px)/1.18 Noto Serif SC,serif}.hero h1 em{color:var(--orange);font-style:normal}.hero-copy>p:not(.eyebrow){color:#46655f;max-width:540px;font:500 18px/1.9 Noto Serif SC,serif}.hero-actions{align-items:center;gap:20px;margin-top:42px;display:flex}.hero-actions>span{color:#6e827e;font-size:11px}.primary-button,.check-button{background:var(--ink);color:#fff;cursor:pointer;box-shadow:5px 5px 0 var(--yellow);border:0;border-radius:2px;justify-content:center;align-items:center;gap:30px;padding:16px 22px;font-weight:700;text-decoration:none;display:inline-flex}.primary-button:hover,.check-button:hover{transform:translate(-1px,-1px)}.today-card{border:1px solid var(--line);box-shadow:12px 12px 0 var(--mint);background:#fffdf7;padding:18px 26px 26px;text-decoration:none;transition:all .2s;display:block;position:relative;transform:rotate(1deg)}.today-card:hover{transform:rotate(0)translateY(-4px)}.today-art{background:#dbe7d7;place-items:center;height:215px;display:grid;position:relative;overflow:hidden}.today-art:before{content:"";background:#f2d6a4;border-radius:50%;width:230px;height:230px;position:absolute;top:-120px;right:-70px}.today-art span{filter:drop-shadow(0 8px #153c3514);z-index:1;font-size:110px}.today-art i{background:var(--orange);color:#fff;letter-spacing:.14em;padding:6px 10px;font:700 11px DM Sans;position:absolute;top:14px;left:14px}.today-meta{letter-spacing:.1em;justify-content:space-between;margin-top:20px;font-size:11px;font-weight:700;display:flex}.today-meta span{color:var(--orange)}.today-card h2{margin:14px 0 2px;font:700 27px Noto Serif SC}.today-card>p:last-of-type{color:#627873;margin-bottom:22px}.pinyin{color:#69817b;letter-spacing:.02em;font-family:DM Sans}.progress-ring{--progress:0deg;background:conic-gradient(var(--orange) var(--progress), #e8e3d7 0);border-radius:50%;place-items:center;width:86px;height:86px;display:grid}.progress-ring:before{content:"";background:#fffdf7;border-radius:50%;width:68px;height:68px;position:absolute}.progress-ring>div{z-index:1;text-align:center;display:grid}.progress-ring strong{font-size:18px}.progress-ring span{letter-spacing:.08em;font-size:8px}.today-card .progress-ring{position:absolute;bottom:-25px;right:22px}.how{border-top:1px solid var(--line);padding:95px 0}.steps{border:1px solid var(--line);grid-template-columns:repeat(3,1fr);margin-top:28px;display:grid}.steps article{min-height:230px;padding:45px 36px;position:relative}.steps article+article{border-left:1px solid var(--line)}.steps b{color:#c9c4b8;font-size:42px;position:absolute;top:20px;right:25px}.steps span{background:var(--mint);border-radius:50%;place-items:center;width:45px;height:45px;font:700 20px Noto Serif SC;display:grid}.steps h3{margin:24px 0 8px;font:600 20px Noto Serif SC}.steps p{color:#6d817c;font-size:14px}.archive{border-top:1px solid var(--line);grid-template-columns:1fr 1.5fr;gap:80px;padding:90px 0 110px;display:grid}.archive h2{font:600 36px/1.35 Noto Serif SC}.lesson-list{border-top:1px solid var(--line)}.lesson-list a{border-bottom:1px solid var(--line);grid-template-columns:70px 1fr auto;align-items:center;gap:18px;padding:20px 0;text-decoration:none;display:grid}.lesson-list a:hover strong{color:var(--orange)}.lesson-image{background:#dce8d8;place-items:center;width:70px;height:70px;font-size:36px;display:grid}.lesson-list a>span:nth-child(2){display:grid}.lesson-list time{color:#81908d;font-size:10px}.lesson-list strong{margin:3px 0;font:600 18px Noto Serif SC}.lesson-list small{font-size:11px}.lesson-status{color:var(--orange);font-size:12px;font-weight:700}footer{border-top:1px solid var(--line);color:#758984;letter-spacing:.05em;justify-content:space-between;max-width:1180px;margin:auto;padding:28px;font-size:10px;display:flex}.lesson-page{padding-top:35px}.back-link{margin:12px 0 35px;font-size:13px;text-decoration:none;display:inline-block}.lesson-hero{background:#e6eadb;grid-template-columns:1.3fr .7fr;align-items:center;min-height:390px;padding:55px 65px;display:grid;position:relative;overflow:hidden}.lesson-hero h1{margin:20px 0 4px;font:700 clamp(38px,5vw,60px) Noto Serif SC}.title-pinyin{font-size:18px}.lesson-dek{font:500 18px Noto Serif SC}.lesson-hero time{color:#627873;font-size:12px}.lesson-tags{gap:8px;display:flex}.lesson-tags span{background:#fffdf7;padding:5px 9px;font-size:10px;font-weight:700}.lesson-tags span:first-child{background:var(--orange);color:#fff}.lesson-illustration{text-align:center;filter:drop-shadow(0 15px #153c3514);font-size:160px}.lesson-layout{grid-template-columns:minmax(0,760px) 220px;justify-content:center;gap:80px;padding:75px 0 120px;display:grid}.lesson-content>section{margin-bottom:90px}.lesson-content h2{margin:8px 0 30px;font:600 32px Noto Serif SC}.summary{border-top:3px solid var(--ink)}.summary>div{border-bottom:1px solid var(--line);padding:24px 5px}.summary p{margin:0}.summary p:first-child{font:500 22px/1.7 Noto Serif SC}.summary .pinyin{margin-top:5px;font-size:14px}.source-note{border-left:4px solid var(--yellow);background:#ebe7dc;margin-top:25px;padding:22px 24px}.source-note p{font-size:12px;line-height:1.6}.source-note a{font-size:12px;font-weight:700;display:block}.source-note small{color:#778a85;margin-top:6px;display:block}.vocab-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.vocab-grid article{border:1px solid var(--line);text-align:center;background:#fffdf8;padding:25px 15px}.vocab-grid article>span{font-size:48px}.vocab-grid h3{margin:12px 0 1px;font:600 24px Noto Serif SC}.vocab-grid p{margin:0;font-size:13px}.vocab-grid small{color:#8a9794;font-size:10px}.lesson-progress{border:1px solid var(--line);text-align:center;background:#fffdf8;height:max-content;padding:25px;position:sticky;top:25px}.lesson-progress .progress-ring{margin:0 auto 20px}.lesson-progress p{font-size:12px}.lesson-progress a{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;font-size:11px;font-weight:700;display:block}.complete-message{background:#dce9df;padding:14px;font:600 13px/1.6 Noto Serif SC}.exercise-list{gap:18px;display:grid}.exercise-card{border:1px solid var(--line);background:#fffdf8;padding:25px}.exercise-header{align-items:center;gap:12px;display:flex}.exercise-header>span:first-child{background:var(--yellow);border-radius:50%;place-items:center;width:28px;height:28px;font-size:12px;font-weight:700;display:grid}.exercise-header h3{flex:1;margin:0;font:600 18px Noto Serif SC}.done-mark{color:#2a7d55;font-weight:800}.prompt-pinyin{margin-left:40px;font-size:12px}.choice-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px;display:grid}.choice{background:var(--paper);border:1px solid var(--line);cursor:pointer;min-height:60px;font:600 18px Noto Serif SC}.choice:hover,.word-bank button:hover{border-color:var(--orange)}.choice.correct{background:#d9ecdf;border-color:#2a7d55}.choice.incorrect{border-color:var(--orange);background:#f8ddd2}.feedback{color:#9b4c31;margin:14px 0 0;font-size:12px}.feedback.positive{color:#2a7d55}.match-list{gap:8px;margin:20px 0;display:grid}.match-list label{background:var(--paper);grid-template-columns:1fr 1fr;align-items:center;padding:10px 14px;display:grid}.match-list strong{font:600 18px Noto Serif SC}.match-list select{border:1px solid var(--line);color:var(--ink);background:#fff;padding:9px}.check-button{box-shadow:none;padding:11px 17px;font-size:12px}.check-button:disabled{opacity:.4;cursor:not-allowed}.sentence-builder{border-bottom:2px solid var(--ink);align-items:center;gap:8px;min-height:60px;margin:15px 0;padding:10px;display:flex}.sentence-builder span,.word-bank button{background:#e3eadf;border:1px solid #0000;padding:8px 12px}.sentence-builder em{color:#8d9b98;font-size:12px}.word-bank{flex-wrap:wrap;gap:8px;display:flex}.word-bank button{cursor:pointer;color:var(--ink)}.exercise-actions{justify-content:space-between;align-items:center;margin-top:18px;display:flex}.text-button{color:#637a75;cursor:pointer;background:0 0;border:0;font-size:11px;text-decoration:underline}.not-found{text-align:center;place-content:center;min-height:70vh;display:grid}.not-found>span{color:var(--orange);letter-spacing:.2em;font-size:11px}.not-found h1{margin:15px;font:700 50px Noto Serif SC}.not-found .primary-button{margin:25px auto}@media (width<=800px){.site-header{height:72px}.site-header nav a{display:none}.hero{grid-template-columns:1fr;gap:65px;padding-top:45px}.steps{grid-template-columns:1fr}.steps article+article{border-left:0;border-top:1px solid var(--line)}.archive{grid-template-columns:1fr;gap:20px}.lesson-hero{grid-template-columns:1fr;padding:35px}.lesson-illustration{font-size:100px}.lesson-layout{grid-template-columns:1fr;padding-top:50px}.lesson-progress{order:-1;position:static}.vocab-grid{grid-template-columns:repeat(2,1fr)}.choice-grid{grid-template-columns:1fr}.hero-actions{flex-direction:column;align-items:flex-start}footer{flex-direction:column;gap:20px}}@media (width<=470px){main,.site-header{padding-left:18px;padding-right:18px}.hero h1{font-size:39px}.today-card{padding:13px 18px 25px}.today-art{height:175px}.lesson-hero{padding:28px 22px}.lesson-hero h1{font-size:36px}.lesson-illustration{font-size:75px}.vocab-grid{grid-template-columns:1fr 1fr}.lesson-list a{grid-template-columns:56px 1fr}.lesson-status{display:none}.lesson-image{width:56px;height:56px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
