:root{font-family:"DM Sans","Segoe UI","Microsoft YaHei",sans-serif;color:#182f2c;background:#f3f6f2;line-height:1.5;--ink:#182f2c;--green:#0f6e56;--dark:#103e34;--muted:#576b64;--line:#d8e3dd;--paper:#fff;--mint:#e4f0e8;--sand:#f6eacf}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button:disabled{cursor:default;opacity:.5}button,a,input,select{outline-offset:4px}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1{font-size:clamp(2rem,4vw,3.1rem);line-height:1.13;letter-spacing:-.035em}h2{font-size:1.45rem;line-height:1.25}p+p{margin-top:.6rem}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--line);text-align:start;padding:.8rem .65rem;vertical-align:middle}th{font-size:.8rem;color:var(--muted)}label{display:grid;gap:.38rem;font-weight:600}input,select{background:#fff;border:1px solid #b6c9be;border-radius:9px;color:var(--ink);padding:.65rem .75rem;min-width:0}input[type=search]{width:100%}progress{display:block;width:100%;height:.55rem;border:0;border-radius:1rem;background:var(--mint);color:var(--green);overflow:hidden}progress::-webkit-progress-bar{background:var(--mint)}progress::-webkit-progress-value{background:var(--green);border-radius:1rem}progress::-moz-progress-bar{background:var(--green)}
.topbar{background:#fff;border-bottom:1px solid var(--line)}.top-inner{max-width:1240px;margin:auto;min-height:68px;padding:.7rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.brand,.top-actions,.practice-actions,.lesson-navigation,.progress-heading,.card-head,.card-foot,.section-head,.toolbar{display:flex;align-items:center;gap:.65rem}.brand{font-weight:750;white-space:nowrap}.brand-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:white;background:var(--dark);font:700 19px "Microsoft YaHei",sans-serif}.language{display:flex;align-items:center;gap:.3rem}.language span{color:var(--green);font-size:1.2rem}.language select{border:0;padding:.4rem .15rem;background:transparent;font-size:.88rem;max-width:145px}.top-actions{flex-wrap:wrap;justify-content:end}.button{display:inline-flex;justify-content:center;align-items:center;gap:.4rem;border:1px solid transparent;border-radius:9px;padding:.62rem .92rem;font-weight:700;font-size:.9rem;line-height:1.35;min-height:42px}.button:hover:not(:disabled){filter:brightness(.95)}.primary{background:var(--green);color:#fff}.soft{background:var(--mint);color:var(--dark)}.outline{border-color:var(--line);background:#fff;color:var(--ink)}.pill{display:inline-block;padding:.24rem .58rem;border-radius:30px;font-size:.75rem;white-space:nowrap;font-weight:700}.neutral{background:var(--mint);color:var(--dark)}.locked{background:var(--sand);color:#624614}.muted{color:var(--muted)}.small{font-size:.83rem;line-height:1.5}.positive{color:var(--green);font-weight:700}.eyebrow{font-size:.74rem;font-weight:760;letter-spacing:.075em;color:var(--green);margin-bottom:.6rem;display:inline-block}.empty{padding:1.5rem;border:1px dashed #b6c9be;border-radius:12px;color:var(--muted)}.inline-error{color:#8b2828;font-weight:650}.back-link{font-size:.9rem;color:var(--green);font-weight:700;display:inline-block;margin-bottom:1.5rem}
.shell,.lesson-shell{max-width:1240px;margin:0 auto;padding:2rem 2rem 4rem}.hero{background:var(--dark);color:white;padding:2.5rem 2.75rem;border-radius:22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.5fr);gap:2rem;align-items:center;overflow:hidden;margin-bottom:2rem}.hero .eyebrow{color:#b4dac5}.hero p{color:#dfede5;margin-top:.85rem;max-width:40rem}.hero h1{max-width:23ch}.hero-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.hero-metrics div{background:#1d5145;border:1px solid #3e6b60;padding:.85rem 1rem;border-radius:12px}.hero-metrics strong{display:block;font-size:1.65rem;color:#fff;line-height:1.25}.hero-metrics span{font-size:.77rem;color:#dfede5}.library-layout{display:grid;grid-template-columns:208px minmax(0,1fr);gap:1.6rem}.sidebar,.aside-goal,.panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:1.12rem;align-self:start}.sidebar{display:grid;gap:.42rem}.sidebar button,.lesson-tabs button{border:0;border-radius:9px;padding:.72rem .78rem;text-align:start;background:transparent;color:var(--muted);font-weight:700;width:100%}.sidebar button.active,.lesson-tabs button.active{background:var(--mint);color:var(--dark)}.toolbar{gap:.75rem;margin:.9rem 0 1.15rem}.toolbar select{max-width:43%}.section-head,.card-head,.card-foot,.progress-heading,.lesson-navigation{justify-content:space-between}.section-head{align-items:baseline}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.course-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem;min-width:0;display:grid;gap:.65rem;align-content:start}.course-card h3{font-size:1.05rem;line-height:1.35;overflow-wrap:anywhere}.course-card .card-head{align-items:flex-start}.course-card .card-foot{margin-top:.25rem;flex-wrap:wrap}.course-card .button{min-height:35px;padding:.42rem .62rem}.course-card .group{font-size:.77rem;color:var(--muted);line-height:1.3}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin:1.25rem 0}.auth-layout{min-height:calc(100vh - 70px);display:grid;grid-template-columns:1fr 1fr;max-width:1180px;margin:auto;gap:1.25rem;padding:2rem}.auth-hero{background:var(--dark);border-radius:18px;padding:clamp(1.4rem,4vw,3.5rem);color:#fff;display:grid;align-content:center;gap:1.1rem}.auth-hero .eyebrow{color:#b4dac5}.auth-hero p{color:#dbece3;max-width:35ch}.auth-panel{align-self:center;width:min(100%,430px);justify-self:center;padding:1.6rem}.auth-panel h2{margin-bottom:1.2rem}.auth-panel form{display:grid;gap:.9rem}.auth-panel .mode-button{margin-top:.75rem}.admin-grid{display:grid;gap:1rem}.admin-grid .panel{overflow:auto}.admin-heading{margin-bottom:1rem}.admin-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.admin-actions input{max-width:10rem}.admin-actions .button{min-height:36px}.admin-nav{margin-bottom:1rem}
.lesson-shell{max-width:1100px}.lesson-intro{display:flex;justify-content:space-between;align-items:center;gap:.8rem;margin-bottom:1.55rem}.lesson-intro p{margin-top:.4rem}.lesson-grid{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:1.25rem}.lesson-aside{display:grid;align-content:start;gap:.8rem}.lesson-tabs{background:#fff;border:1px solid var(--line);border-radius:15px;padding:.45rem}.aside-goal p{font-size:.87rem;margin:.4rem 0 .85rem;color:var(--muted);overflow-wrap:anywhere}.aside-goal p:last-child{margin-bottom:0}.lesson-main{min-width:0}.progress-heading{margin-bottom:.45rem;font-size:.88rem}.progress-heading span{color:var(--muted)}.phrase-card{background:#fff;border:1px solid var(--line);border-radius:16px;margin:1rem 0 .65rem;padding:clamp(1rem,3vw,2rem);min-height:285px;overflow-wrap:anywhere}.phrase-meta{font-size:.8rem;color:var(--green);font-weight:750}.phrase-content{padding:.95rem 0 .45rem;text-align:left}.pinyin{color:#3e7466;font-size:1rem;line-height:1.65;margin-bottom:.2rem}.phrase-content h2{font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:clamp(1.8rem,4vw,2.45rem);line-height:1.45;letter-spacing:.02em}.meaning{font-size:1.05rem;color:var(--muted)}.practice-actions{flex-wrap:wrap;margin-top:1rem}.lesson-navigation{margin-top:1rem}.practice-status:not(:empty){margin-top:1rem}.result{display:grid;grid-template-columns:minmax(85px,.27fr) 1fr;gap:1rem;border-radius:10px;padding:1rem;background:#eff5f0}.result span{display:block;font-size:.78rem;color:var(--muted)}.result strong{font-size:2rem;color:var(--green)}.result strong small{font-size:.8rem}.result p{font-size:1.12rem;line-height:1.7;text-align:left}.result mark{background:#fbe3b6;color:#6a3315;border-radius:3px}.quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:1rem}.option{background:#fff;border-color:var(--line);text-align:start;justify-content:start}.lesson-body #lesson{min-height:100vh}
@media(max-width:1030px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:740px){.shell,.lesson-shell,.auth-layout{padding:1.1rem 1rem 2.5rem}.top-inner{padding:.55rem 1rem}.hero{padding:1.5rem;grid-template-columns:1fr;gap:1rem;border-radius:16px}.library-layout,.lesson-grid,.auth-layout{grid-template-columns:1fr;gap:1rem}.sidebar,.lesson-tabs{display:flex;flex-wrap:wrap;gap:.25rem}.sidebar button,.lesson-tabs button{width:auto}.auth-hero{padding:1.35rem}.auth-panel{justify-self:stretch;width:auto}.lesson-intro{margin-bottom:1rem}.lesson-aside{gap:.55rem}.aside-goal{padding:.8rem}.top-actions .button{min-height:35px;padding:.45rem .55rem}.top-actions .language span{display:none}}
@media(max-width:440px){.cards,.quiz-options{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar select{max-width:none}.result{grid-template-columns:1fr}.lesson-navigation{gap:.35rem}.brand{gap:.36rem;font-size:.88rem}.language select{max-width:112px}.top-actions{gap:.22rem}}
.aside-goal summary{cursor:pointer;font-weight:750}.aside-goal[open]+.quick-translation{display:none}.quick-translation p{margin-top:.4rem}.progress-heading select{font-size:.86rem;padding:.32rem .6rem}.speed-control{display:inline-flex;align-items:center;gap:.38rem;cursor:pointer;font-size:.86rem;color:var(--muted);min-height:42px;padding-inline:.3rem}.speed-control input{accent-color:var(--green);width:1.05rem;height:1.05rem}.practice-guide{margin-top:.7rem}.recording-status{color:#962d30;font-weight:700}.recording-status::before{content:"";display:inline-block;width:.55rem;height:.55rem;margin-inline-end:.4rem;border-radius:50%;background:currentColor}
@media(max-width:440px){.lesson-shell .back-link{margin-bottom:.85rem}.practice-actions .button{flex:1 1 42%;min-height:46px}.practice-actions .speed-control{flex-basis:100%;min-height:35px}.lesson-navigation .button{min-height:46px}.lesson-navigation>span{text-align:center}}
.admin-tabs,.bulk-access,.report-summary{display:flex;gap:.65rem;flex-wrap:wrap}.admin-tabs{margin:1rem 0}.bulk-access{padding:1rem;background:white;border:1px solid var(--line);border-radius:12px;align-items:end}.bulk-access>strong{align-self:center}.admin-course{align-items:end;flex-wrap:wrap}.admin-course label{flex:1 1 190px;min-width:0}.admin-course select{max-width:100%;width:100%}.admin-table{overflow:auto;margin-top:.65rem}.admin-table td,.admin-table th{min-width:5rem}.admin-table progress{min-width:5rem;margin-bottom:.25rem}.report-summary{margin-bottom:.5rem}.report-summary span{background:var(--mint);padding:.4rem .65rem;border-radius:7px}.score-items{min-width:11rem;max-height:15rem;overflow:auto}.score-items ol{padding-inline-start:1.35rem;margin:.4rem 0}.score-items li{margin:.35rem 0}.score-items strong{display:block;color:var(--green);font-size:.82rem}.admin-grid input[type=checkbox]{accent-color:var(--green);width:1.05rem;height:1.05rem}.admin-grid summary{cursor:pointer}
.recharge-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,155px),1fr));gap:.8rem;margin:1rem 0}.recharge-plan{display:grid;gap:.65rem}.recharge-price{font-size:1.6rem;font-weight:750;margin:0}.recharge-instructions{margin:1rem 0}.recharge-instructions p{white-space:pre-wrap;overflow-wrap:anywhere}.recharge-orders{list-style:none;padding:0;margin:.6rem 0}.recharge-orders li{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.65rem 0;border-top:1px solid var(--line);overflow-wrap:anywhere}.recharge-form{display:grid;gap:.6rem;margin-bottom:1rem}.recharge-form label{display:grid;gap:.35rem}.recharge-form textarea{width:100%;font:inherit;padding:.6rem;border:1px solid var(--line);border-radius:7px}.recharge-form button{justify-self:start}
