:root{--course-ink:#10271d;--course-green:#1f7a50;--course-coral:#f36f55;--course-cream:#fffdf9;--course-muted:#66756d;--course-line:rgba(16,39,29,.12);--course-radius:24px;--course-shadow:0 18px 50px rgba(16,39,29,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--course-cream);color:var(--course-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.7rem 1rem;z-index:99}.course-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:14px max(20px,calc((100vw - 1180px)/2));background:rgba(255,253,249,.94);backdrop-filter:blur(16px);border-bottom:1px solid var(--course-line)}.course-top .brand{font-weight:900;color:var(--course-ink);text-decoration:none}.course-top nav{display:flex;flex-wrap:wrap;gap:.35rem}.course-top nav a{padding:.48rem .7rem;border-radius:999px;text-decoration:none;color:var(--course-ink);font-weight:700;font-size:.86rem}.course-top nav a:hover,.course-top nav a:focus-visible{background:#eaf7ef;outline:2px solid transparent}.course-footer{max-width:1180px;margin:4rem auto 0;padding:2rem 20px;border-top:1px solid var(--course-line);color:var(--course-muted)}.course-footer a{color:var(--course-green);font-weight:800}main{max-width:1180px;margin:auto;padding:0 20px}.hero{padding:clamp(4rem,8vw,8rem) 0 4rem}.hero.compact{padding:3.8rem 0 2.2rem}.eyebrow{font-size:.75rem;letter-spacing:.12em;font-weight:900;color:var(--course-green);text-transform:uppercase}.hero h1,.lesson h1{font-size:clamp(3rem,7vw,6.4rem);line-height:.92;letter-spacing:-.06em;margin:.5rem 0 1.2rem;max-width:900px}.hero.compact h1{font-size:clamp(2.8rem,6vw,5rem)}.hero-lede,.intro{font-size:clamp(1.05rem,1.7vw,1.3rem);color:var(--course-muted);max-width:820px}.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.72rem 1rem;border:1px solid var(--course-line);border-radius:999px;background:#fff;color:var(--course-ink);font-weight:850;text-decoration:none;cursor:pointer}.btn:hover,.btn:focus-visible{transform:translateY(-1px);box-shadow:0 8px 24px rgba(16,39,29,.08);outline:3px solid rgba(31,122,80,.18)}.btn.primary{background:var(--course-green);color:#fff;border-color:var(--course-green)}.btn.soft{background:#eaf7ef}.section{padding:2rem 0 4rem}.section>h2,.deep>h2,.related>h2{font-size:clamp(2rem,4vw,3.2rem);letter-spacing:-.04em}.level-grid,.unit-grid,.lab-grid,.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.level-card,.unit-card,.three article{background:#fff;border:1px solid var(--course-line);border-radius:var(--course-radius);padding:1.4rem;box-shadow:var(--course-shadow)}.level-card.is-roadmap{background:linear-gradient(145deg,#fff,#fff7f2)}.level-pill{display:inline-flex;padding:.3rem .55rem;border-radius:999px;background:#eaf7ef;color:var(--course-green);font-weight:900}.level-card h2,.unit-card h2{font-size:1.55rem;margin:.65rem 0}.level-card p,.unit-card p{color:var(--course-muted)}.level-card .btn,.unit-card .btn{margin-top:.8rem}.three b{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--course-coral);color:#fff}.roadmap{margin:1rem 0 3rem;padding:2rem;border-radius:var(--course-radius);background:#fff0e8;border:1px solid rgba(243,111,85,.25)}.competencies{display:flex;flex-wrap:wrap;gap:.6rem;padding:0;list-style:none}.competencies li{background:#fff;border:1px solid var(--course-line);border-radius:999px;padding:.45rem .75rem}.breadcrumbs{padding-top:2rem;color:var(--course-muted);font-size:.9rem}.breadcrumbs a{color:var(--course-green)}.lesson-list{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}.lesson-list li{display:grid;grid-template-columns:48px 1fr;gap:1rem;align-items:center;padding:1rem;background:#fff;border:1px solid var(--course-line);border-radius:18px}.lesson-list li>span{font-weight:900;color:var(--course-coral)}.lesson-list a{font-size:1.1rem;font-weight:850;color:var(--course-ink);text-decoration:none}.lesson-list small{display:block;color:var(--course-muted)}.lesson{max-width:900px;margin:auto}.lesson-head{padding:3rem 0 1rem}.objective{display:grid;gap:.25rem;margin:1.5rem 0;padding:1.2rem 1.4rem;border-radius:20px;background:#eaf7ef;border:1px solid rgba(31,122,80,.15)}.objective span{font-size:.75rem;font-weight:900;letter-spacing:.08em;color:var(--course-green);text-transform:uppercase}.lesson-section{padding:1.4rem 0}.lesson-section h2{font-size:clamp(1.7rem,3vw,2.35rem);letter-spacing:-.035em}.lesson-section p{font-size:1.05rem;color:#33443c}.examples{display:grid;gap:.7rem}.example{display:grid;gap:.2rem;padding:1rem 1.2rem;background:#fff;border:1px solid var(--course-line);border-radius:16px}.example b{font-size:1.08rem}.example span{color:var(--course-muted)}.mistakes{display:grid;gap:.8rem}.mistake{padding:1rem 1.2rem;border-radius:18px;background:#fff;border:1px solid var(--course-line)}.mistake p{margin:.3rem 0}.mistake p:first-child span{color:#b83232}.mistake p:nth-child(2) span{color:var(--course-green)}.mistake small{color:var(--course-muted)}.remember{margin:2rem 0;padding:1.5rem;border-radius:22px;background:#fff0e8;border:1px solid rgba(243,111,85,.25)}.remember span{font-size:.75rem;font-weight:900;letter-spacing:.1em;color:#ba4e39}.remember p{font-size:1.08rem;margin:.45rem 0 0}.practice{padding:2.5rem 0}.section-head{display:flex;justify-content:space-between;gap:1rem;align-items:end}.section-head h2{font-size:clamp(2rem,4vw,3rem);margin:.2rem 0}.score{font-size:1.4rem;font-weight:900;color:var(--course-green)}.exercise-card{position:relative;margin:1rem 0;padding:1.35rem;background:#fff;border:1px solid var(--course-line);border-radius:20px}.qnum{position:absolute;right:1rem;top:1rem;color:var(--course-coral);font-weight:900}.exercise-card h3{padding-right:2.4rem}.options{display:grid;gap:.5rem;margin:1rem 0}.options label{display:flex;gap:.65rem;align-items:center;padding:.75rem;border:1px solid var(--course-line);border-radius:14px;cursor:pointer}.options label:hover{background:#faf8f3}.exercise-card input[type="text"]{width:100%;min-height:46px;border:1px solid var(--course-line);border-radius:12px;padding:.7rem;font:inherit}.feedback{min-height:1.5rem;margin-top:.7rem;font-weight:800}.feedback.is-correct{color:var(--course-green)}.feedback.is-wrong{color:#a83d32}.tokens{display:flex;flex-wrap:wrap;gap:.5rem}.tokens button{min-height:44px;border:1px solid var(--course-line);background:#fff;border-radius:10px;padding:.5rem .7rem}.finish{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:1.2rem;border-radius:18px;background:#f5faf7}.finish p{flex:1;min-width:240px}.lab-card{display:grid;gap:.3rem;min-height:150px;padding:1.2rem;border-radius:18px;background:#10271d;color:#fff;text-decoration:none}.lab-card span{color:#9ae3b8;font-weight:900}.lab-card small{color:#d0ded7}.related>div{display:flex;flex-wrap:wrap;gap:.6rem}.related a{padding:.55rem .8rem;background:#fff;border:1px solid var(--course-line);border-radius:999px;color:var(--course-ink)}.prev-next{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:3rem 0}.prev-next a{padding:1rem;background:#fff;border:1px solid var(--course-line);border-radius:16px;color:var(--course-ink);font-weight:800;text-decoration:none}.prev-next a:last-child{text-align:right}
@media(max-width:900px){.level-grid,.unit-grid,.three,.lab-grid{grid-template-columns:1fr 1fr}.course-top{align-items:flex-start}.course-top nav{justify-content:flex-end}}
@media(max-width:720px){main{padding:0 16px}.course-top{position:relative;display:block;padding:12px 16px}.course-top nav{margin-top:.6rem;display:flex;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:.35rem}.course-top nav a{white-space:nowrap}.hero{padding:3.2rem 0 2.5rem}.hero h1,.lesson h1{font-size:clamp(2.7rem,14vw,4.6rem)}.level-grid,.unit-grid,.three,.lab-grid{grid-template-columns:1fr}.section-head{display:block}.score{margin-top:.5rem}.prev-next{grid-template-columns:1fr}.prev-next a:last-child{text-align:left}.exercise-card{padding:1.05rem}.btn{width:100%}.hero-actions .btn{width:auto}.finish .btn{width:100%}}
