xvm-quiz{margin:var(--space-5) 0;display:block}xvm-quiz>:first-child{margin-top:0}.quiz-options{gap:var(--space-3);margin:var(--space-4) 0 0;border:0;min-width:0;padding:0;display:grid}.quiz-option{border:1px solid var(--color-line);border-radius:var(--radius-4);background:var(--color-surface)}.quiz-option label{align-items:baseline;gap:var(--space-4);box-sizing:border-box;min-height:2.75rem;padding:var(--space-3) var(--space-4);cursor:pointer;display:flex}.quiz-option input{accent-color:var(--color-accent);flex:none;margin:0}.quiz-option:hover:not([data-mark]):not(:has(input:disabled)){border-color:var(--color-fg-muted)}.quiz-option:has(input:checked){border-color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}.quiz-option:has(input:focus-visible){outline:var(--focus-ring);outline-offset:2px}.quiz-option:has(input:disabled) label{cursor:default}.quiz-option[data-mark=wrong]{border-color:var(--color-warn)}.quiz-option:is([data-mark=right],[data-mark=answer]){border-color:var(--color-ok);box-shadow:inset 0 0 0 1px var(--color-ok)}.quiz-option:is([data-mark=right],[data-mark=answer]) label:after{content:"✓";color:var(--color-ok);margin-left:auto;font-weight:700}.quiz-fb{padding:0 var(--space-4) var(--space-3) calc(var(--space-4) * 2 + 1em);font-size:var(--text-md)}.quiz-typed{margin-top:var(--space-4);display:block}.quiz-answer{box-sizing:border-box;width:100%;padding:var(--space-3) var(--space-4);resize:vertical;font:var(--text-md)/var(--leading-ui) var(--font-mono);color:var(--color-code-strong);background:var(--color-code-bg);border:1px solid var(--color-line);border-radius:var(--radius-4);margin:0;display:block}.quiz-answer:focus-visible{outline:var(--focus-ring);outline-offset:2px}xvm-quiz[data-state=wrong] .quiz-answer,xvm-quiz[data-state=revealed] .quiz-answer{border-color:var(--color-warn)}xvm-quiz[data-state=right] .quiz-answer{border-color:var(--color-ok)}.quiz-bar,.review-bar{align-items:center;gap:var(--space-4);margin-top:var(--space-4);flex-wrap:wrap;display:flex}xvm-quiz:is([data-state=right],[data-state=revealed]) .quiz-bar{display:none}.quiz-tries{color:var(--color-fg-muted);font-size:var(--text-md)}.quiz-check,.review-next,.review-again{font:inherit;padding:var(--space-2) var(--space-5);cursor:pointer;color:var(--color-accent-fg);background:var(--color-accent-bg);border:1px solid var(--color-accent-line);border-radius:var(--radius-3);font-weight:600}.quiz-check:disabled{color:var(--color-fg-muted);background:var(--color-surface-2);border-color:var(--color-line);cursor:default}.quiz-verdict:not(:empty),.review-result:not(:empty){margin-top:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-surface);border-left:3px solid var(--color-line);border-radius:var(--radius-2)}xvm-quiz[data-state=right] .quiz-verdict,xvm-review[data-state=passed] .review-result{border-left-color:var(--color-ok)}xvm-quiz:is([data-state=wrong],[data-state=revealed]) .quiz-verdict{border-left-color:var(--color-warn)}.quiz-verdict p,.review-result p{margin:0}.quiz-verdict>*+*,.review-result>*+*{margin-top:var(--space-3)}.quiz-explain>:first-child{margin-top:0}.quiz-explain>:last-child{margin-bottom:0}.quiz-ok{color:var(--color-ok)}.quiz-no{color:var(--color-warn)}xvm-trace{margin:var(--space-5) 0;display:block}.trace-intro>:first-child{margin-top:0}:is(xvm-trace,.quiz-code) pre.listing{counter-reset:line;padding-inline:0}:is(xvm-trace,.quiz-code) pre.listing .line{box-sizing:border-box;min-width:100%;padding-right:var(--space-5);display:inline-block}:is(xvm-trace,.quiz-code) pre.listing .line:before{counter-increment:line;content:counter(line);text-align:right;width:3ch;color:var(--color-fg-muted);margin-right:1.5ch;display:inline-block}pre.listing .line:is(.next,[data-hot]){background:var(--color-accent-soft);box-shadow:inset 3px 0 var(--color-accent)}pre.listing .line:is(.next,[data-hot]):before{content:"▸" counter(line);color:var(--color-fg);font-weight:700}pre.listing .line[data-answer]:not([data-hot]){box-shadow:inset 3px 0 var(--color-ok)}pre.listing .line[data-answer]:not([data-hot]):before{content:"✓" counter(line);color:var(--color-fg)}.line:is(.next,[data-hot]) :is(.n,.a){color:inherit}.quiz-code{margin:var(--space-4) 0 0;min-width:0}.quiz-code figcaption{margin-bottom:var(--space-2);color:var(--color-fg-muted);font:var(--text-md) var(--font-mono)}.quiz-code pre{max-height:min(22rem,55vh);margin:0;overflow:auto}.trace-window{box-sizing:border-box;width:min(100%, calc(var(--trace-fw,100%) * var(--trace-scale,1) + 2 * var(--space-4)));margin:var(--space-4) auto 0;padding:var(--space-3) var(--space-4);background:var(--color-bg);border-radius:var(--radius-4);box-shadow:0 0 0 1px var(--color-line)}.trace-window:focus-visible{outline:var(--focus-ring);outline-offset:2px}.trace-window figure.trace-strip{margin:0;overflow:hidden}.trace-window figure.trace-strip svg{width:calc(var(--trace-frames,1) * 100%);max-width:none;transform:translateX(calc(var(--trace-frame,0) * -100% / var(--trace-frames,1)));transition:transform var(--duration-base) ease-out;margin:0}.trace-bar{justify-content:center;align-items:center;gap:var(--space-4);margin-top:var(--space-3);display:flex}.trace-bar button{font:inherit;font-size:var(--text-md);padding:var(--space-2) var(--space-4);cursor:pointer;color:var(--color-fg);background:var(--color-surface-2);border:1px solid var(--color-line);border-radius:var(--radius-3)}.trace-bar .trace-next:not([aria-disabled=true]){color:var(--color-accent-fg);background:var(--color-accent-bg);border-color:var(--color-accent-line)}.trace-bar button[aria-disabled=true]{color:var(--color-fg-muted);cursor:default}.trace-count{text-align:center;min-width:4.5em;color:var(--color-fg-muted);font-size:var(--text-md);font-variant-numeric:tabular-nums}xvm-trace ol.captions{margin:var(--space-3) 0 0;padding:0;list-style:none;display:grid}xvm-trace ol.captions>li{visibility:hidden;padding:var(--space-3) var(--space-4);background:var(--color-surface);border-radius:var(--radius-4);grid-area:1/1}xvm-trace:not([data-ready]) ol.captions>li:first-child,xvm-trace ol.captions>li[aria-current]{visibility:visible}@media (prefers-reduced-motion:reduce){.trace-window figure.trace-strip svg{transition:none}}@media screen and (min-width:1100px) and (pointer:fine){body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.stage-item{align-items:center;container-type:size}body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.stage-item>.trace-window{width:min(100cqw, calc(var(--trace-fw,20rem) * 2 + 2 * var(--space-4)), calc((100cqh - 11rem) * var(--trace-ratio,1) + 2 * var(--space-4)));flex:none;margin-top:0}body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.stage-item>:is(.trace-bar,ol.captions){box-sizing:border-box;flex:none;width:100%;max-width:36rem}}.review-intro{color:var(--color-fg-muted)}.review-count{margin:var(--space-5) 0 0;color:var(--color-fg-muted);font-size:var(--text-md);font-weight:600}.review-count:focus{outline:none}.review-count+.review-slot xvm-quiz{margin-top:var(--space-3)}.review-noscript{display:none}.steps:has(>.step-review:not([hidden]))>.step-page{display:none}.steps:has(>#review:target xvm-review:not([data-ready]))>.step-page{display:none}#review:target:has(xvm-review:not([data-ready])){display:block}@media (scripting:none){.quiz-bar,.trace-bar{display:none}.review-noscript{display:block}.trace-window{width:auto;overflow-x:auto}.trace-window figure.trace-strip{overflow:visible}.trace-window figure.trace-strip svg{width:calc(var(--trace-fw) * var(--trace-frames,1));transform:none}xvm-trace ol.captions{padding-left:var(--space-6);list-style:decimal;display:block}xvm-trace ol.captions>li{visibility:visible;background:0 0;padding:0}}main.steps:not([data-stage]) .steps:has(>.step-page:target)>.step-page:not(:target){display:none}main.steps:not([data-stage]) .steps>.step-page:target{display:block}main.steps .step-blocks>xvm-block:not([data-active]),main.steps .pager,main.steps:not([data-view=all]) .view-all-bar{display:none}main.steps .view-all-bar{margin:var(--space-5) 0 0;padding:var(--space-3) var(--space-5);border-radius:var(--radius-3);background:var(--color-surface);font-size:var(--text-md)}main.steps[data-view=all] .steps>.step-page{display:block}main.steps[data-view=all] :is(.rail,.step-nav,.hints,.step-blocks,.recap-skipped){display:none}main.steps[data-view=all] .steps>.step-page+.step-page{margin-top:var(--space-7);border-top:1px solid var(--color-line)}@media print{main.steps .steps>.step-page{display:block}main.steps :is(.rail,.step-nav,.hints,.step-blocks,.recap-skipped,.view-all-bar){display:none}}main.steps .lesson-ch{display:none}main.steps article>h1{margin:var(--space-5) 0 var(--space-3);font-size:var(--text-md);color:var(--color-fg-muted);letter-spacing:.01em;font-weight:600}main.steps .rail ol{margin:0;padding:0;list-style:none}main.steps .rail>ol{gap:var(--space-3);display:flex}main.steps .rail-part{flex-direction:column-reverse;flex:var(--n,1) 1 0;min-width:0;display:flex}main.steps .rail-part>ol,main.steps .rail>ol:not(.rail-parts){gap:3px;display:flex}main.steps .rail>ol:not(.rail-parts)>li,main.steps .rail-part>ol>li{flex:1 1 0;min-width:0}main.steps .rail-part-title{margin-top:var(--space-1);text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm);color:var(--color-fg-muted);overflow:hidden}main.steps .rail-part[data-current] .rail-part-title{color:var(--color-fg)}main.steps .rail a{border-radius:var(--radius-1);padding:5px 0;display:block}main.steps .rail a:before{content:"";border-radius:var(--radius-pill);background:var(--color-line);box-sizing:border-box;height:6px;transition:background-color var(--duration-fast) ease-out;display:block}main.steps .rail a:hover:before{background:var(--color-fg-muted)}main.steps .rail a[data-state=done]:before{background:var(--color-ok)}main.steps .rail a[data-state=skipped]:before{border:1px solid var(--color-fg-muted);background:0 0}main.steps .rail a:is([data-state=current],[aria-current]):before{background:var(--color-accent)}main.steps .rail a:focus-visible{outline:var(--focus-ring);outline-offset:1px}main.steps .rail-t{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}main.steps .step-page>h2{margin:var(--space-2) 0 var(--space-5);font-size:1.5rem;line-height:var(--leading-tight)}main.steps .step-page>h2:focus{outline:none}main.steps .step-page>h2:focus-visible{outline:var(--focus-ring);outline-offset:4px;border-radius:var(--radius-1)}main.steps .step-page>:is(p,ul,ol,pre,aside,figure,.table-wrap,.task,.hints,xvm-quiz,xvm-trace,h3){margin-top:0;margin-bottom:var(--space-5)}main.steps .step-page>.step-pos{margin:var(--space-7) 0 0;font-size:var(--text-ui);color:var(--color-fg-muted)}main.steps .step-page li+li{margin-top:var(--space-2)}main.steps .table-wrap{overflow-x:auto}main.steps table{border-collapse:collapse;font-size:var(--text-md);line-height:var(--leading-ui)}main.steps :is(th,td){padding:var(--space-2) var(--space-5) var(--space-2) 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--color-line)}main.steps th{font-size:var(--text-ui);color:var(--color-fg-muted);font-weight:600}main.steps tr:last-child>td{border-bottom:0}main.steps .callout{padding:var(--space-3) var(--space-5);border-left:3px solid var(--color-accent);border-radius:0 var(--radius-3) var(--radius-3) 0;background:var(--color-surface)}main.steps .callout[data-kind=watch-out]{border-left-color:var(--color-warn)}main.steps .callout>p{margin:0}main.steps .callout>p+p{margin-top:var(--space-2)}main.steps .callout-label{font-size:var(--text-ui);color:var(--color-fg-muted);font-weight:600}main.steps .callout[data-kind=watch-out] .callout-label{color:var(--color-warn)}main.steps .task{padding:var(--space-4) var(--space-5);border:1px solid var(--color-line);border-radius:var(--radius-4);background:var(--color-surface)}main.steps .task:before{content:"Task";margin-bottom:var(--space-2);font-size:var(--text-ui);color:var(--color-fg-muted);font-weight:600;display:block}main.steps .task>:first-child{margin-top:0}main.steps .task>:last-child{margin-bottom:0}main.steps .task pre{margin:var(--space-3) 0;background:var(--color-bg)}main.steps .hint-next{font:inherit;font-size:var(--text-md);color:var(--color-fg);padding:var(--space-2) var(--space-4);cursor:pointer;border:1px solid var(--color-line);border-radius:var(--radius-3);background:0 0}main.steps .hint-next:hover{background:var(--color-tint)}main.steps .hint-next[hidden]{display:none}main.steps .hint{margin-top:var(--space-4);padding:var(--space-3) var(--space-5);border-left:3px solid var(--color-fg-muted);border-radius:0 var(--radius-3) var(--radius-3) 0;background:var(--color-surface)}main.steps .hint>:is(p,pre){margin:0}main.steps .hint>*+*{margin-top:var(--space-2)}main.steps .hint-label{font-size:var(--text-ui);color:var(--color-fg-muted);font-weight:600}main.steps .hint-list:focus{outline:none}main.steps .recap-skipped{padding:var(--space-3) var(--space-5);border-left:3px solid var(--color-warn);background:var(--color-surface);border-radius:0 var(--radius-3) var(--radius-3) 0}main.steps .recap-skipped[hidden]{display:none}main.steps .step-nav{justify-content:flex-end;align-items:center;gap:var(--space-3);margin-top:var(--space-6);padding-block:var(--space-5);border-top:1px solid var(--color-line);background:var(--color-bg);flex-wrap:wrap;display:flex}main.steps .step-nav a{padding:var(--space-3) var(--space-5);border-radius:var(--radius-3);white-space:nowrap;border:1px solid #0000;text-decoration:none}main.steps .step-nav .step-back{color:var(--color-fg-muted);margin-right:auto}main.steps .step-nav :is(.step-back,.step-skip):hover{color:var(--color-fg);background:var(--color-tint)}main.steps .step-nav .step-skip{color:var(--color-fg-muted);border-color:var(--color-line)}main.steps .step-nav .step-continue{color:var(--color-accent-fg);background:var(--color-accent-bg);border-color:var(--color-accent-line);font-weight:600}main.steps .step-nav .step-continue:hover{text-decoration:underline}main.steps .step-nav .step-continue[aria-disabled=true]{color:var(--color-fg-muted);background:var(--color-surface-2);border-color:var(--color-line);cursor:not-allowed;text-decoration:none}main.steps .step-nav a[hidden]{display:none}main.steps figure.stage-item{cursor:zoom-in}main.steps figure.stage-item:focus-visible{outline:var(--focus-ring);outline-offset:2px}main.steps .step-page figure.stage-item[data-zoom]{z-index:40;padding:var(--space-7);box-sizing:border-box;background:var(--color-bg);cursor:zoom-out;place-items:center;margin:0;display:grid;position:fixed;inset:0}main.steps .step-page figure.stage-item[data-zoom] svg{width:100%;max-width:none;height:100%}@media screen and (min-width:1100px) and (pointer:fine){body.lesson-page:not([data-layout=column]) main.steps{padding:0 var(--space-6)}body.lesson-page:not([data-layout=column]) main.steps>article{box-sizing:border-box;flex-direction:column;max-width:44rem;min-height:100%;display:flex}body.lesson-page:not([data-layout=column]) main.steps>.ws-footer{display:none}body.lesson-page:not([data-layout=column]) main.steps .steps,body.lesson-page:not([data-layout=column]) main.steps .steps>.step-page:not([hidden]){flex-direction:column;flex:1 0 auto;display:flex}body.lesson-page:not([data-layout=column]) main.steps .step-nav{z-index:1;margin-top:auto;position:sticky;bottom:0}body.lesson-page:not([data-layout=column]) main.steps .step-page>.step-nav{margin-top:auto}body.lesson-page:not([data-layout=column]) main.steps .step-page>:nth-last-child(2){margin-bottom:var(--space-6)}body.lesson-page:not([data-layout=column]) main.steps .ws-head :is(.ws-prev,.ws-pos,.ws-title,.ws-next){display:none}body.lesson-page:not([data-layout=column]):has(main.steps){--ws-head-h:0px;--ws-row:1.75rem;--ws-head-bw:0;--ws-run-w:5.25rem;--ws-run-p:1px 10px;--ws-ed-r:calc(2.6rem + 5.25rem + 4px);--ws-ed-pad:calc(2.6rem + 5.25rem + 2rem);--ws-prog-t:calc(100vh - var(--con) - (var(--ws-tabs-h) + 1.3rem) / 2);--ws-prog-l:16rem;--ws-prog-r:2.5rem}body.lesson-page:not([data-layout=column]):not([data-solo]) main.steps:not([data-stage=code],[data-stage=figure],[data-stage=listing],[data-stage=trace]){right:0}body.lesson-page:not([data-layout=column]) main.steps:not([data-stage=code]) :is(.ws-head,.ws-cbar,.ws-csplit,.ws-max-ed,.ws-menu,.ws-unsolo,.terminal-box xvm-terminal,xvm-env-panel,.step-blocks>xvm-block){visibility:hidden;pointer-events:none}body.lesson-page:not([data-layout=column]) main.steps:not([data-stage=code]) .step-blocks>xvm-block::part(feedback){visibility:hidden}body.lesson-page:not([data-layout=column]):has(main.steps:not([data-stage=code])) .env-bar xvm-progress{visibility:hidden}body.lesson-page:not([data-layout=column]) main.steps:not([data-stage=code],[data-stage=figure],[data-stage=listing],[data-stage=trace]) .ws-split{visibility:hidden;pointer-events:none}body.lesson-page:not([data-layout=column]) main.steps:is([data-stage=figure],[data-stage=listing],[data-stage=trace]):after{content:"";z-index:1;top:var(--ws-top);width:var(--ws-w);background:var(--color-surface);position:fixed;bottom:0;right:0}body.lesson-page:not([data-layout=column]) main.steps[data-stage=figure] .step-page:not([hidden]) figure.stage-item:not([data-zoom]),body.lesson-page:not([data-layout=column]) main.steps[data-stage=listing] .step-page:not([hidden]) :is(xvm-quiz>.quiz-code,xvm-quiz:not(:has(>.quiz-code))>pre),body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.stage-item{z-index:2;top:var(--ws-top);width:var(--ws-w);box-sizing:border-box;padding:var(--space-7);box-shadow:none;background:0 0;border-radius:0;margin:0;position:fixed;bottom:0;right:0;overflow:auto}body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.trace-window{z-index:2;top:50%;right:calc(var(--ws-w) / 2);--trace-scale:1.25;width:min(calc(var(--ws-w) - 2 * var(--space-7)), calc(var(--trace-fw,20rem) * var(--trace-scale) + 2 * var(--space-4)));margin:0;position:fixed;transform:translate(50%,-50%)}body.lesson-page:not([data-layout=column]) main.steps[data-stage=figure] .step-page:not([hidden]) figure.stage-item:not([data-zoom]){place-items:center;display:grid}body.lesson-page:not([data-layout=column]) main.steps[data-stage=figure] .step-page:not([hidden]) figure.stage-item:not([data-zoom]) svg{width:auto;max-width:100%;height:auto;max-height:100%}body.lesson-page:not([data-layout=column]) main.steps[data-stage=trace] .step-page:not([hidden]) xvm-trace>.stage-item{--trace-scale:1.25;flex-direction:column;justify-content:center;display:flex}body.lesson-page:not([data-layout=column]) main.steps[data-stage=listing] .step-page:not([hidden]) xvm-quiz:not(:has(>.quiz-code))>pre{font-size:var(--text-body);line-height:var(--leading-body);justify-content:center;align-items:center;display:flex}body.lesson-page:not([data-layout=column]) main.steps[data-stage=listing] .step-page:not([hidden]) xvm-quiz:not(:has(>.quiz-code))>pre>code{padding:var(--space-6) var(--space-7);border:1px solid var(--color-line);border-radius:var(--radius-4);background:var(--color-code-bg);color:var(--color-code-fg);white-space:pre}body.lesson-page:not([data-layout=column]) main.steps[data-stage=listing] .step-page:not([hidden]) xvm-quiz>.quiz-code{grid-template-rows:auto minmax(0,auto);place-content:center;display:grid}body.lesson-page:not([data-layout=column]) main.steps[data-stage=listing] .step-page:not([hidden]) xvm-quiz>.quiz-code pre{max-height:none;padding-block:var(--space-5);border-radius:var(--radius-4);font-size:var(--text-body);line-height:var(--leading-body)}}body.lesson-page[data-layout=column] main.steps .step-nav,body.lesson-page:not([data-layout]) main.steps .step-nav{margin-bottom:var(--space-5)}@media (scripting:enabled) and ((max-width:767.98px) or (pointer:coarse)){body.lesson-page:not([data-layout=workspace]):has(main.steps:not([data-view=all])) :is(footer.site,.tools){display:none}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]){padding-bottom:calc(5rem + env(safe-area-inset-bottom,0px))}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) article>h1{margin:var(--space-4) 0 var(--space-3);font-size:var(--text-ui)}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .rail-part-title{display:none}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .rail>ol{gap:var(--space-2)}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .rail a{padding:var(--space-1) 0;pointer-events:none}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .rail a:before{height:4px}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-page>.step-pos{margin-top:var(--space-5)}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-page>h2{margin-bottom:var(--space-4);font-size:1.3rem}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) :is(.hint-next,.quiz-check,.trace-bar button){min-height:44px}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) xvm-trace{--trace-scale:1.3}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) figure.stage-item:not([data-zoom]) svg{max-width:100%;height:auto}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-nav{z-index:20;left:0;right:0;bottom:var(--vvb,0px);padding:var(--space-3) max(var(--space-5), env(safe-area-inset-right)) calc(var(--space-3) + env(safe-area-inset-bottom,0px)) max(var(--space-5), env(safe-area-inset-left));flex-wrap:nowrap;margin:0;position:fixed}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-nav a{box-sizing:border-box;align-items:center;min-height:44px;display:flex}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-nav a[hidden]{display:none}body.lesson-page:not([data-layout=workspace]):has(main.steps[data-stage=code]:not([data-view=all])){left:0;right:0;top:var(--vvt,0px);height:var(--vvh,100dvh);flex-direction:column;display:flex;position:fixed;overflow:hidden}body.lesson-page:not([data-layout=workspace]):has(main.steps[data-stage=code]:not([data-view=all]))>xvm-environment{flex-direction:column;flex:1;min-height:0;display:flex}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]){min-height:0;padding-bottom:calc(61px + env(safe-area-inset-bottom,0px));flex-direction:column;flex:1;display:flex}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all])>article{flex-direction:column;flex:1;min-height:0;display:flex}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) :is(article>h1,.view-all-bar){display:none}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .steps{flex:none;max-height:50%;overflow-y:auto}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page>.step-pos{margin-top:var(--space-4)}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page>h2{margin:0 0 var(--space-3);font-size:1.15rem}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page>:is(.task,.hints){margin-bottom:var(--space-3)}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .hint-next{color:var(--color-accent);border:0;padding-inline:0}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page:not([data-open])>:not(.step-pos,h2,.task,.hints,.step-nav),body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page:not([data-open]) .hint-list{display:none}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .task{padding:var(--space-3) var(--space-4);position:relative}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .task:before{content:none}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page:not([data-open]) .task{max-height:calc(2lh + 2 * var(--space-3));box-sizing:border-box;overflow:hidden}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .task-more{min-width:44px;min-height:44px;padding:var(--space-3) var(--space-4) var(--space-2) var(--space-6);border-radius:0 0 var(--radius-4) 0;font:inherit;font-size:var(--text-md);color:var(--color-accent);background:linear-gradient(to right, transparent, var(--color-surface) var(--space-6));border:0;position:absolute;bottom:0;right:0}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-page[data-open] .task-more{background:0 0;margin-left:auto;display:block;position:static}body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-blocks{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block[data-active]{gap:var(--space-2);background:0 0;border:0;flex-direction:column;flex:1;min-height:0;margin:0;padding:0;display:flex;position:relative}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block>xvm-editor{flex:1 1 0;height:auto;min-height:6rem}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block::part(head){font-size:var(--text-sm);flex-wrap:nowrap}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block::part(title){display:none}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block>xvm-runner::part(run){z-index:21;left:calc(max(var(--space-5), env(safe-area-inset-left)) + var(--run-l,5.5rem));bottom:calc(var(--vvb,0px) + var(--space-3) + env(safe-area-inset-bottom,0px));min-width:6rem;min-height:44px;padding:0 var(--space-5);border-radius:var(--radius-3);font-size:var(--text-body);visibility:visible;position:fixed}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block>xvm-editor{z-index:0;position:relative}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block>xvm-runner{box-sizing:border-box;height:60%;padding:calc(44px + var(--fb-h,0px)) var(--space-4) var(--space-3);border:1px solid var(--color-line);border-radius:var(--radius-4) var(--radius-4) 0 0;background:var(--color-surface) linear-gradient(var(--color-line), var(--color-line)) 50% 20px / 2.5rem 4px no-repeat;box-shadow:var(--shadow-popover);visibility:hidden;transition:top var(--duration-base) ease-out, visibility 0s var(--duration-base);border-bottom:0;position:absolute;top:100%;left:0;right:0}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block[data-sheet]>xvm-runner{visibility:visible;transition:top var(--duration-base) ease-out;top:40%}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block>xvm-runner::part(output){flex:1;height:auto;min-height:0}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block::part(feedback){z-index:1;left:var(--space-4);right:var(--space-4);visibility:hidden;position:absolute;top:calc(40% + 44px)}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block[data-sheet]::part(feedback){visibility:visible}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block[data-sheet]:after{content:"";background:var(--color-bg);opacity:.5;position:absolute;inset:0 0 60%}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .sheet-edit{z-index:2;min-width:44px;min-height:44px;padding:0 var(--space-5);font:inherit;font-size:var(--text-md);color:var(--color-accent);background:0 0;border:0;font-weight:600;position:absolute;top:40%;right:0}body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks:not(:has(>xvm-block[data-active][data-sheet]))>.sheet-edit{display:none}html[data-kb] body.lesson-page:not([data-layout=workspace]):has(main.steps[data-stage=code]:not([data-view=all])) :is(header.site,.env-bar,.rail,.step-page>:not(.step-nav),.step-nav>a){display:none}html[data-kb] body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]) .step-blocks>xvm-block::part(head){display:none}html[data-kb] body.lesson-page:not([data-layout=workspace]) main.steps:not([data-view=all]){--run-l:0px}html:not([data-kb]) body.lesson-page:not([data-layout=workspace]):has(main.steps:not([data-view=all])) .xvm-keybar{display:none}html[data-kb] body.lesson-page:not([data-layout=workspace]) main.steps[data-stage=code]:not([data-view=all]) .step-nav{box-sizing:border-box;min-height:61px}html[data-kb] body.lesson-page:not([data-layout=workspace]):has(main.steps[data-stage=code]:not([data-view=all])) .xvm-keybar{bottom:var(--vvb,0px);left:calc(var(--space-5) + 6.5rem);box-sizing:border-box;background:0 0;border:0;align-items:center;height:60px;top:auto!important}}.outline .ol-steps .ol-part{padding:var(--space-3) var(--space-3) var(--space-1);font-size:var(--text-sm);color:var(--color-fg-muted);font-weight:600}.outline .ol-steps .ol-all>a{color:var(--color-accent)}
