.learn-page{--learn-line:#dce2d3;--learn-muted:#627367;background:#f5f4ee;color:#18332d;font-family:Inter,"Segoe UI","Microsoft YaHei",system-ui,sans-serif;line-height:1.8}.learn-page *{box-sizing:border-box}.learn-main{max-width:1264px;margin:auto;padding:46px 48px 64px}.learn-page a:focus-visible,.learn-page button:focus-visible,.learn-page input:focus-visible,.learn-page select:focus-visible{outline:3px solid #476ec4;outline-offset:4px}.learn-kicker{font-size:11px;letter-spacing:.18em;font-weight:650;color:#5b7652}.learn-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;padding:30px 0 40px}.learn-hero h1{font-size:clamp(32px,4.3vw,55px);letter-spacing:-.04em;line-height:1.25;margin:15px 0 20px}.learn-hero h1 span{color:#738b4f}.learn-hero p{color:var(--learn-muted);font-size:15px;max-width:620px}.learn-tags{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.learn-tags span{background:#e4ebd9;border:1px solid #d2ddc5;border-radius:24px;padding:4px 12px;font-size:12px}.learn-art{background:#e6ebde;border:1px solid #d6decf;border-radius:28px;position:relative;overflow:hidden}.learn-art svg{display:block;width:100%;height:auto}.learn-art-label{position:absolute;top:18px;left:22px;font-size:10px;letter-spacing:.12em;color:#65805b}.learn-actions{display:flex;gap:12px;flex-wrap:wrap}.learn-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;gap:8px;padding:10px 18px;border:1px solid #c3d1b5;border-radius:12px;background:#183c30;color:#f8f9ee;font-family:inherit;font-size:14px;font-weight:600;line-height:1.5;text-decoration:none;cursor:pointer}.learn-button.secondary{background:#fffef9;color:#314d3b}.learn-button:disabled{opacity:.55;cursor:default}.learn-note{padding:20px 24px;border:1px solid var(--learn-line);background:#fffef9;border-radius:16px;color:var(--learn-muted);font-size:13px}.learn-note strong{color:#284938}.learn-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:40px 0 20px}.learn-heading h2{font-size:24px;margin:0}.learn-heading span{color:#627367;font-size:12px}.learn-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.lesson-card{display:flex;gap:19px;align-items:flex-start;padding:25px;border:1px solid var(--learn-line);border-radius:18px;background:#fffef9;text-decoration:none;transition:transform .15s,box-shadow .15s}.lesson-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #18332d0d}.lesson-number{display:flex;align-items:center;justify-content:center;flex:none;width:46px;height:46px;border-radius:14px;background:#e7efdb;color:#526b43;font-size:20px;font-weight:650}.lesson-card h3{font-size:19px;margin:0 0 8px;line-height:1.4}.lesson-card p{color:var(--learn-muted);font-size:13px;margin:0 0 15px}.lesson-card small{font-size:11px;color:#687e53}.lesson-complete .lesson-number{background:#d7e8c4}.learn-route{font-size:12px;color:#687b61;margin:0 0 22px}.learn-route a{text-decoration:underline;text-underline-offset:4px}.lesson-layout{display:grid;grid-template-columns:235px minmax(0,1fr);gap:32px;align-items:start}.lesson-outline{position:sticky;top:20px;border:1px solid var(--learn-line);border-radius:18px;background:#fffef9;padding:20px}.lesson-outline h2{font-size:15px;margin:0 0 12px}.lesson-outline ol{list-style:none;padding:0;margin:0}.lesson-outline a{display:flex;gap:10px;border-radius:9px;padding:11px 9px;font-size:12px;line-height:1.65;min-height:44px}.lesson-outline a[aria-current=page]{background:#e3ecd6;color:#274a34;font-weight:650}.lesson-outline [data-completion-badge]{font-size:10px;display:block;color:#718367}.lesson-outline>p{font-size:11px;color:#778875;margin:18px 0 0}.lesson-content{min-width:0}.lesson-intro{margin-bottom:26px}.lesson-intro h1{font-size:clamp(29px,3.7vw,43px);line-height:1.35;letter-spacing:-.03em;margin:12px 0 16px}.lesson-intro>p{color:var(--learn-muted);font-size:15px}.lesson-objective{padding:17px 21px;background:#e7eedc;border-left:3px solid #7f965e;border-radius:0 12px 12px 0;font-size:14px}.lesson-section{background:#fffef9;border:1px solid var(--learn-line);border-radius:18px;padding:27px;margin:20px 0}.lesson-section h2{font-size:21px;line-height:1.5;margin:0 0 14px}.lesson-section p,.lesson-section li{font-size:14px;color:#536858}.lesson-section ol,.lesson-section ul{padding-left:24px}.lesson-section li{margin:14px 0}.lesson-section li strong{display:block;color:#294735}.lesson-section figure{margin:0 0 20px;border-radius:12px;background:#eef1e6;overflow:hidden}.lesson-section svg{display:block;width:100%;max-height:320px}.lesson-section figcaption{padding:10px 18px;color:#6a7e62;font-size:12px}.learn-mistakes{display:grid;gap:12px}.learn-mistakes p{margin:0;padding:15px 17px;border-radius:12px;background:#f3f1e6}.learn-mistakes strong{display:block;color:#705a3d;margin-bottom:4px}.learn-practice{margin:28px 0;background:#e8ecdf;border:1px solid #d1ddc5;border-radius:20px;overflow:hidden}.learn-practice-heading{padding:23px 25px 12px}.learn-practice h2{font-size:21px;margin:0 0 8px}.learn-practice-heading p{font-size:13px;color:#64765b;margin:0}.model-view{position:relative;height:340px;isolation:isolate}.model-canvas{position:absolute;inset:0;touch-action:none}.model-canvas canvas{display:block;width:100%;height:100%;border-radius:0!important}.model-poster{position:absolute;inset:0;pointer-events:none}.model-poster svg{width:100%;height:100%;display:block}.model-launch{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap}.model-status{min-height:32px;font-size:12px;color:#546b4a;margin:0;padding:8px 25px}.model-controls{border:0;padding:14px 25px 22px;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 23px;min-width:0}.model-controls label{display:block;font-size:12px;color:#3c5636}.model-controls label span{display:flex;justify-content:space-between;gap:12px}.model-controls input[type=range]{width:100%;min-height:36px;accent-color:#607e4c}.model-controls select{width:100%;padding:9px 12px;min-height:44px;border:1px solid #bbcfab;border-radius:8px;background:#fafbf5;color:#284b37;font:inherit}.model-controls .model-checkbox{display:flex;align-items:center;gap:10px;min-height:44px}.model-checkbox input{width:18px;height:18px;accent-color:#607e4c}.model-footer{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:0 25px 23px}.model-stats{flex-basis:100%;font-size:11px;color:#6d7f64}.lesson-bottom{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:24px}.lesson-pagination{display:flex;justify-content:space-between;gap:16px;margin-top:25px;padding-top:20px;border-top:1px solid #d5ddca;font-size:13px}.learn-page footer{margin-top:42px;line-height:1.8}.learn-page [hidden]{display:none!important}
@media(max-width:960px){.learn-main{padding-inline:28px}.learn-hero{gap:24px}.lesson-layout{grid-template-columns:190px minmax(0,1fr);gap:23px}.lesson-outline{padding:14px}.lesson-section{padding:23px}}
@media(max-width:700px){.learn-main{padding:25px 20px 45px}.learn-hero{grid-template-columns:1fr;gap:25px;padding:12px 0 26px}.learn-hero h1{font-size:36px}.learn-art{max-width:500px}.learn-grid{grid-template-columns:1fr}.lesson-layout{grid-template-columns:1fr;gap:22px}.lesson-outline{position:static}.lesson-outline ol{display:grid;grid-template-columns:1fr 1fr;gap:4px}.lesson-outline>p{margin-top:12px}.lesson-section{padding:22px}.model-view{height:290px}.model-controls{padding-inline:20px;gap:13px}.learn-heading h2{font-size:22px}.lesson-card{padding:22px;gap:16px}.learn-note{padding:18px 20px}}
@media(max-width:380px){.model-controls{grid-template-columns:1fr}.lesson-outline ol{grid-template-columns:1fr}.learn-heading{align-items:flex-start;flex-direction:column;gap:7px}.learn-button{padding-inline:14px}.model-footer{padding-inline:20px}.lesson-card{padding:18px;gap:13px}}
@media(prefers-reduced-motion:reduce){.lesson-card{transition:none}.lesson-card:hover{transform:none}}

.learn-page .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.narration-settings{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-top:18px}.narration-settings label{display:block;color:#536858;font-size:13px;min-width:0}.narration-settings select{display:block;width:100%;min-height:46px;padding:9px 12px;border:1px solid #c3d1b5;border-radius:10px;background:#f7f8ef;font:inherit;color:#284b37}.narration-panel details{padding-top:12px;border-top:1px solid #dce2d3}.narration-panel summary{cursor:pointer;min-height:44px;display:list-item;line-height:44px;font-size:13px;color:#526b43}.narration-panel [data-narration-status]{font-size:12px;min-height:24px}.narration-panel [data-narration-text]{overflow-wrap:anywhere}@media(max-width:700px){.narration-settings{grid-template-columns:1fr}}