.lesson-studio{padding-top:28px!important;max-width:1440px}.studio-hero{display:grid;grid-template-columns:1fr 220px;gap:40px;background:#102f52;color:#fff;padding:40px;border-radius:22px;margin:22px 0}.studio-kicker{color:#83e4cf!important;font:700 12px/1.5 system-ui;letter-spacing:.13em}.studio-count{font:14px/1.6 system-ui;color:#d2e3f5}.studio-count span{color:#a3c2df}.studio-hero h1{font-size:clamp(30px,3.5vw,52px);line-height:1.12;color:#fff;margin:18px 0 24px;max-width:900px}.studio-pills{display:flex;gap:8px;flex-wrap:wrap}.studio-pills span{border:1px solid #4d7596;border-radius:30px;padding:7px 12px;font:12px system-ui;color:#e3f2ff}.studio-progress{border-left:1px solid #44627e;padding-left:26px;align-self:center;font-family:system-ui}.studio-progress strong{font-size:40px;color:#8ce8d1}.studio-progress strong span{font-size:20px;color:#b4cde0}.studio-progress p{margin:4px 0 12px}.studio-progress small{color:#c4d8e9;font-size:12px;line-height:1.6;display:block}.studio-progress progress{width:100%;accent-color:#80e2ca;height:9px;margin-bottom:12px}.studio-demo{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;background:#e3eee9;border:1px solid #bfd6cd;padding:30px;border-radius:20px;margin-bottom:32px}.studio-demo h2{font-size:28px;line-height:1.2;margin:8px 0 12px}.studio-demo p{font-family:system-ui;line-height:1.65}.studio-demo .button{font:600 13px system-ui}.studio-result{border-left:4px solid #127563;padding:10px 14px;background:#fff;border-radius:0 8px 8px 0}.studio-window{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 12px 24px #153e4a16;border:1px solid #acc7c4;font-family:system-ui}.studio-window-bar{padding:14px 18px;background:#123c55;color:#fff;font-size:12px;display:flex;gap:22px}.studio-window-bar span{color:#89dbca;letter-spacing:3px}.studio-diagram{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.studio-diagram>div{border:1px solid #c5dad6;border-radius:10px;padding:16px 12px;background:#f5faf8;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:650}.studio-diagram b{display:grid;place-items:center;border-radius:50%;background:#0e7064;color:#fff;width:28px;height:28px;flex-shrink:0}.studio-window-foot{border-top:1px solid #d5e4e1;padding:14px 22px;font-size:12px;color:#496176}.lesson-studio .learngrid{grid-template-columns:270px minmax(0,1fr);gap:30px;align-items:start}.lesson-studio .lessonnav{background:#fff;border:1px solid #d1dfeb;border-radius:16px;padding:22px;position:sticky;top:18px;max-height:85vh;overflow:auto}.lesson-studio .lessonnav h2{font-size:23px}.lesson-studio .lessonnav summary{font:650 13px/1.5 system-ui;padding:14px 0;cursor:pointer}.lesson-studio .lessonnav a{font:13px/1.55 system-ui;padding:10px 9px;border-radius:8px}.lesson-studio .lessonnav a.active{background:#123b65;color:#fff}.lesson-state{padding-right:7px;color:#168475}.lessonnav a.active .lesson-state{color:#8ee9ce}.lesson-studio .lessoncontent{min-width:0}.lesson-studio .lessoncontent>.badge{margin-top:0}.lesson-studio .prose{max-width:none;font:17px/1.8 system-ui;color:#223b50}.studio-outline{border:1px solid #c7d9e9;background:#fff;border-radius:12px;margin:12px 0 24px;padding:16px 20px;font:14px/1.7 system-ui}.studio-outline summary{font-weight:650;cursor:pointer}.studio-outline nav{display:grid;gap:7px;padding-top:12px}.studio-outline a{color:#174e80}.studio-card{background:#fff;border:1px solid #d4dfeb;border-radius:16px;padding:26px 30px;margin:0 0 22px;scroll-margin-top:24px}.studio-card-label{font:750 11px/1.4 system-ui!important;letter-spacing:.11em;color:#537294;margin:0 0 12px!important}.lesson-studio .studio-card h2{font-size:27px;line-height:1.25;margin:0 0 16px;color:#123556}.studio-card p:last-child{margin-bottom:0}.studio-card-practice{background:#fff3d9;border:1px solid #e7c479;border-left:5px solid #c17a12}.studio-card-practice .studio-card-label{color:#78510d}.studio-card-caution{background:#edf4fa;border-left:5px solid #6489b0}.lesson-studio .studio-card ol{list-style:none;counter-reset:actions;padding:0}.lesson-studio .studio-card ol li{counter-increment:actions;position:relative;padding-left:42px;margin:16px 0}.lesson-studio .studio-card ol li:before{content:counter(actions);position:absolute;left:0;top:2px;border-radius:9px;background:#163f65;color:#fff;font:700 14px/30px system-ui;width:30px;text-align:center}.lesson-studio .correction{background:#e3f4ee;border:1px solid #91c8b7;border-radius:16px;padding:22px 28px;margin-bottom:24px;font-family:system-ui}.lesson-studio .correction summary{font-weight:750;cursor:pointer;color:#145c4b}.lesson-studio .coursequiz{background:#142f50;color:#edf5ff;border-radius:18px;padding:28px}.lesson-studio .coursequiz h2,.lesson-studio .coursequiz .eyebrow{color:#fff}.lesson-studio .quiz-option{background:#fff;color:#19394e;border-radius:9px}.lesson-studio .quiz-feedback{color:#dcf7ee}.lesson-studio .coursequiz [data-result=review] .quiz-feedback{color:#ffe2a3}.lesson-studio .coursequiz fieldset{border-color:#476987}.lesson-studio .coursequiz .button{background:#e4f5ee;color:#143e44}.lesson-studio .progressform{background:#fff;border:2px solid #2b8775;padding:24px;border-radius:16px;margin-top:24px;font-family:system-ui}.lesson-studio .progressform .button{background:#146e5e;border-color:#146e5e}.lesson-studio .lesson-tools{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;padding:24px 0}.lesson-studio .lesson-capture{background:#fff;padding:14px;border:1px solid #cbdbe8;border-radius:16px}.lesson-studio .lesson-capture img{border-radius:9px;max-width:100%}.lesson-studio .lesson-capture figcaption{font:13px/1.6 system-ui;margin:12px 0 0}.lesson-studio :focus-visible{outline:3px solid #d68814;outline-offset:4px}.studio-result[hidden],[data-studio-reveal][hidden]{display:none}
@media(max-width:960px){.lesson-studio .learngrid{grid-template-columns:220px minmax(0,1fr)}.studio-hero{gap:24px;padding:28px;grid-template-columns:1fr 170px}.studio-demo{gap:24px;padding:24px}.studio-diagram{padding:16px;gap:9px}.studio-diagram>div{padding:12px 9px;font-size:12px}.studio-card{padding:24px}}
@media(max-width:700px){.studio-hero{grid-template-columns:1fr;padding:24px;border-radius:16px;gap:20px}.studio-progress{border-left:0;border-top:1px solid #44627e;padding:16px 0 0}.studio-progress strong{font-size:28px}.studio-progress p{display:inline;margin-left:8px}.studio-progress progress{display:block;margin-top:12px}.studio-demo{grid-template-columns:1fr;padding:20px}.lesson-studio .learngrid{grid-template-columns:1fr}.lesson-studio .lessonnav{position:static;max-height:280px;padding:18px}.studio-card{padding:22px 19px}.lesson-studio .prose{font-size:16px}.lesson-studio .studio-card h2{font-size:24px}.lesson-studio .coursequiz{padding:22px 16px}.studio-diagram{grid-template-columns:1fr 1fr}.studio-pills span{font-size:11px}.lesson-studio .progressform{padding:18px}.lesson-studio .lesson-tools .button{width:100%;text-align:center}}
@media(prefers-reduced-motion:no-preference){.lesson-studio .button{transition:transform .18s,background .18s}.lesson-studio .button:hover{transform:translateY(-2px)}.studio-result:not([hidden]){animation:studio-appear .25s ease-out}@keyframes studio-appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}}

.studio-challenge{background:#fff;border:1px solid #c1d5e2;border-radius:16px;padding:26px 30px;margin-bottom:30px;font-family:system-ui}.studio-challenge h2{font-size:24px;line-height:1.4;max-width:900px}.studio-challenge fieldset{border:0;padding:0;display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.studio-challenge legend{font-size:13px;color:#516b7e;margin-bottom:12px}.studio-challenge label{display:flex;gap:8px;align-items:center;border:1px solid #b8ccda;background:#f3f7fb;border-radius:9px;padding:14px;font:15px/1.5 system-ui;cursor:pointer}.studio-challenge input{width:18px;height:18px;accent-color:#146e5e}.studio-challenge [role=status]{font-size:14px;line-height:1.7;max-width:1000px}.studio-challenge[data-result=correct]{border-color:#21816d;background:#edf9f4}.studio-challenge[data-result=review]{border-color:#c08a30;background:#fff7e7}.studio-challenge [hidden]{display:none}@media(max-width:700px){.studio-challenge{padding:22px 19px}.studio-challenge h2{font-size:21px}.studio-challenge fieldset{display:grid}}