figure.vr-diagram{--vr-surface:#211b29;--vr-purple:#4b3056;--vr-purple-ink:#f8efff;--vr-purple-line:#c3a3de;--vr-green:#1c5145;--vr-green-ink:#effff9;--vr-green-line:#80ceba;--vr-change:#245780;--vr-change-ink:#edf7ff;--vr-change-line:#79bfff;--vr-canary:#633b4c;--vr-canary-ink:#fff1f6;--vr-canary-line:#dca7bc;--stack-add-bg:var(--vr-green);--stack-add-ink:var(--vr-green-ink);--stack-add-line:var(--vr-green-line);--meta-bg:var(--vr-purple);--meta-ink:var(--vr-purple-ink);--meta-line:var(--vr-purple-line);--change-bg:var(--vr-change);--change-ink:var(--vr-change-ink);--change-line:var(--vr-change-line);border:0;border-block:1px solid var(--sl-color-gray-4);background:var(--vr-surface);color:var(--sl-color-white);--vr-content-width:60rem;--vr-padding:clamp(.75rem,2vw,1.25rem);margin:1.75rem 0;border-radius:0;max-width:none;margin-inline:0;padding:clamp(.75rem,2vw,1.25rem)}figure.vr-diagram>:not(.sm-defs){max-width:calc(var(--vr-content-width) - var(--vr-padding) - var(--vr-padding));margin-inline:auto}:root[data-theme=light] figure.vr-diagram{--vr-surface:#fdfaff;--vr-purple:#be9dd3;--vr-purple-ink:#30203d;--vr-purple-line:#86559f;--vr-green:#94bead;--vr-green-ink:#123e34;--vr-green-line:#28715e;--vr-change:#80b3e2;--vr-change-ink:#153b60;--vr-change-line:#286aa6;--vr-canary:#d8adc0;--vr-canary-ink:#402031;--vr-canary-line:#8b4a68;--meta-bg:var(--vr-purple);--meta-ink:var(--vr-purple-ink);--meta-line:var(--vr-purple-line);--change-bg:var(--vr-change);--change-ink:var(--vr-change-ink);--change-line:var(--vr-change-line);--stack-add-bg:var(--vr-green);--stack-add-ink:var(--vr-green-ink);--stack-add-line:var(--vr-green-line)}figure.vr-diagram figcaption{text-align:left;margin:0 0 .6rem;font-size:1.1rem}figure.vr-diagram :is(.intro,.key,.note,.change,.panel-key,.pointer,.figure-note,.boundary){font-size:.85rem;line-height:1.5}figure.vr-diagram :is(.state,.state-boundary){border:0;border-radius:0;padding:0}figure.vr-diagram :is(.registers,.register-grid){gap:0}figure.vr-diagram :is(.registers,.register-grid)>div{border:0;border-bottom:1px solid var(--sl-color-gray-4);color:var(--sl-color-white);background:0 0;border-radius:0;grid-template-columns:3.5rem minmax(0,1fr);gap:.65rem;margin:0;padding:.5rem .3rem;display:grid}figure.vr-diagram :is(.registers,.register-grid) code{color:inherit;overflow-wrap:anywhere;background:0 0;border:0;padding:0;font-size:.9rem}figure.vr-diagram :is(.registers,.register-grid) :is(dt,dd){margin:0;font-size:.9rem}figure.vr-diagram :is(.registers,.register-grid)>div:is(.changed,.moved){background:var(--vr-change);color:var(--vr-change-ink);box-shadow:inset 0 -2px var(--vr-change-line);outline:0}figure.vr-diagram .registers .pointer-register{border-left:3px solid var(--register-line,var(--function-line,var(--sl-color-gray-3)))}figure.vr-diagram .registers .pointer-register code{color:inherit}figure.vr-diagram.ret2win-stack-diagram .registers .pointer-register[data-owner],figure.vr-diagram.frame-diagram .registers .pointer-register{color:var(--sl-color-white);border-color:var(--sl-color-gray-4);border-left-color:var(--register-line,var(--function-line,var(--sl-color-gray-3)));background:0 0}figure.vr-diagram.ret2win-stack-diagram .registers .pointer-register[data-owner] code{color:inherit}figure.vr-diagram.ret2win-stack-diagram .registers .pointer-register[data-owner].moved{background:var(--vr-change);color:var(--vr-change-ink)}figure.vr-diagram .function-key span{border:0;border-radius:0;padding:.2rem .6rem}figure.vr-diagram .controls{background:0 0;border:0;border-radius:0;padding:0}figure.vr-diagram .controls>*{margin-top:0}figure.vr-diagram .action,figure.vr-diagram .snapshot>h3{max-width:none;margin-left:0;margin-right:0}figure.vr-diagram .slot code{color:inherit;background:0 0;border:0}figure.vr-diagram .stack-column{--stack-add-bg:var(--vr-green);--stack-add-ink:var(--vr-green-ink);--stack-add-line:var(--vr-green-line)}figure.vr-diagram .changed .slot{box-shadow:inset 0 -3px var(--vr-change-line)}figure.vr-diagram :is(.register-tag,.pointers b).moved{outline-color:var(--vr-change-line)}figure.vr-diagram.stack-transition-diagram .panels{border:0;padding:0}figure.vr-diagram.course-memory-diagram .rows{border:0}figure.vr-diagram.course-memory-diagram .with-stack-pointer{margin-bottom:1rem;padding-right:5rem}figure.vr-diagram.course-memory-diagram .with-stack-pointer .memory-row{position:relative}figure.vr-diagram.course-memory-diagram .stack-cursor{width:5rem;color:var(--sl-color-white);font:700 .9rem var(--sl-font-mono);align-items:center;margin:0;display:flex;position:absolute;bottom:0;left:100%;transform:translateY(50%)}figure.vr-diagram.course-memory-diagram .stack-cursor i{background:currentColor;flex-shrink:0;width:1.5rem;height:2px;position:relative}figure.vr-diagram.course-memory-diagram .stack-cursor i:before{content:"";border-block:5px solid #0000;border-right:7px solid;position:absolute;top:-4px;left:0}figure.vr-diagram.course-memory-diagram .stack-cursor b{border:1px solid var(--vr-purple-line);background:var(--vr-surface);border-radius:.2rem;margin:0;padding:.25rem .4rem;line-height:1.1}figure.vr-diagram.course-memory-diagram .memory-row{border:0;border-left:3px solid var(--sl-color-gray-3);border-bottom:1px solid var(--sl-color-gray-4);padding:.6rem .75rem}figure.vr-diagram.course-memory-diagram .memory-row.metadata{border-left-color:var(--vr-purple-line)}figure.vr-diagram.course-memory-diagram .memory-row.data{border-left-color:var(--vr-green-line)}figure.vr-diagram.course-memory-diagram .value{font-size:.9rem}figure.vr-diagram.course-memory-diagram .byte{border:0;border-bottom:1px solid color-mix(in srgb,currentColor 30%,transparent);font:500 .95rem/2 var(--sl-font-mono);border-radius:0}figure.vr-diagram.course-memory-diagram .changed{box-shadow:inset 0 -2px var(--vr-change-line)}figure.vr-diagram.course-memory-diagram .byte.active{background:color-mix(in srgb,var(--vr-purple) 80%,var(--vr-purple-ink));color:var(--vr-purple-ink);outline-offset:-2px;outline:2px solid;font-weight:750}figure.vr-diagram.course-memory-diagram .readout{border:0;border-bottom:1px solid var(--sl-color-gray-4);color:var(--sl-color-white);background:0 0;border-radius:0;grid-template-columns:minmax(4rem,.7fr) minmax(0,1fr);align-items:baseline;gap:.5rem;padding:.5rem .25rem;display:grid}figure.vr-diagram.course-memory-diagram .readout :is(dt,dd){margin:0;font-size:.85rem}figure.vr-diagram.course-memory-diagram dl{gap:0}figure.vr-diagram.course-memory-diagram{--vr-content-width:48rem}figure.vr-diagram.course-memory-diagram .panels{grid-template-columns:1fr;gap:.8rem}figure.vr-diagram.course-memory-diagram [data-registers]{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.25rem;display:grid}figure.vr-diagram.course-memory-diagram .memory-row{padding:.45rem .65rem}figure.vr-diagram.course-memory-diagram .bytes{margin-top:.35rem}figure.vr-diagram.course-memory-diagram .value{margin-top:.2rem}figure.vr-diagram.course-memory-diagram .state-label{text-transform:none;margin-bottom:.75rem}figure.vr-diagram.assembly-diagram .listing{border:0;border-left:3px solid var(--vr-purple-line)}figure.vr-diagram.assembly-diagram .listing li{grid-template-columns:3.7rem minmax(0,1fr);padding-inline:.75rem}figure.vr-diagram.assembly-diagram .listing li.changed{color:inherit;box-shadow:none;background:0 0}figure.vr-diagram.assembly-diagram .listing li.changed .pointer{font-weight:500}figure.vr-diagram.assembly-diagram code{font-size:.85rem}figure.vr-diagram.assembly-diagram dl{gap:0}figure.vr-diagram.assembly-diagram .register{border:0;border-bottom:1px solid var(--sl-color-gray-4);border-radius:0;grid-template-columns:3rem minmax(0,1fr);align-items:baseline;gap:.5rem;padding:.5rem .3rem;display:grid}figure.vr-diagram.assembly-diagram .register dd{margin:0;font-size:.85rem}figure.vr-diagram.assembly-diagram .changed{box-shadow:inset 0 -2px var(--vr-change-line)}figure.vr-diagram.assembly-diagram :is(.request,.stdout){border:0;border-left:3px solid var(--sl-color-gray-3);padding:.35rem .75rem}figure.vr-diagram.assembly-diagram .message{border:0;border-left:3px solid var(--vr-green-line)}figure.vr-diagram.assembly-diagram .pointed{outline:0}figure.vr-diagram.process-diagram .memory{background:0 0;border:0}figure.vr-diagram.process-diagram :is(th,td){padding:.6rem .5rem}figure.vr-diagram.process-diagram .gap td{height:1.5rem;padding:.15rem}figure.vr-diagram.process-diagram .cpu{border:0;border-left:3px solid var(--vr-purple-line);text-align:left;background:0 0;border-radius:0;padding:.4rem .75rem}figure.vr-diagram.process-diagram .connection{text-align:left}figure.vr-diagram.process-diagram .role-note{white-space:normal;min-width:10rem;font-size:.85rem}figure.vr-diagram.process-diagram .role-code{background:var(--vr-purple);color:var(--vr-purple-ink)}figure.vr-diagram.process-diagram .role-data{background:var(--vr-green);color:var(--vr-green-ink)}figure.vr-diagram.process-diagram tr code{color:inherit}figure.vr-diagram.process-diagram code{background:0 0;border:0;padding:0}figure.vr-diagram.process-diagram .register-grid{grid-template-columns:1fr}figure.vr-diagram :is(.sm-node,.sm-cell){fill:var(--vr-purple);stroke:var(--vr-purple-line);stroke-width:1px}figure.vr-diagram .sm-node.accent{fill:var(--vr-green);stroke:var(--vr-green-line);stroke-width:2px}figure.vr-diagram .sm-label,figure.vr-diagram .sm-sub{fill:var(--vr-purple-ink)}figure.vr-diagram .sm-panel p{text-align:left;font-size:.85rem}figure.vr-diagram .state-canvas{overflow-x:auto}figure.vr-diagram .state-canvas svg{min-width:31rem}figure.vr-diagram.ret2win-state-diagram{overflow:visible}figure.vr-diagram.ret2win-state-diagram .state-canvas{min-width:0}@media (width<=45rem){figure.vr-diagram :is(.registers,.register-grid){grid-template-columns:1fr}figure.vr-diagram.course-memory-diagram .panels{gap:.75rem}figure.vr-diagram.assembly-diagram dl{grid-template-columns:1fr}figure.vr-diagram :is(.state,.state-boundary){padding:0}figure.vr-diagram.course-memory-diagram [data-registers]{grid-template-columns:1fr}}@media (width<=30rem){figure.vr-diagram.ret2win-stack-diagram .stack-column{--slot-height:4.5rem}}figure.vr-diagram :is(stack-carousel,ret2win-carousel,assembly-execution)>.controls,figure.vr-diagram .step-toolbar{flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:.5rem;max-width:none;margin:0 0 .85rem;display:flex}figure.vr-diagram :is(stack-carousel,ret2win-carousel)>.controls .step-count{text-align:left;flex-basis:100%;margin:0}figure.vr-diagram .step-toolbar button{min-width:5rem}figure.vr-diagram .controls button{flex-shrink:0}figure.vr-diagram .stack-column{--slot-height:3.5rem}figure.vr-diagram .slot strong{font-size:.85rem}figure.vr-diagram{container-type:inline-size}figure.vr-diagram:is(.frame-diagram,.stack-transition-diagram,.ret2win-stack-diagram,.assembly-diagram) .panels,figure.vr-diagram.process-diagram .storage{gap:1.5rem 2rem}figure.vr-diagram.sm-transition-shapes .sm-panels.three{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem}figure.vr-diagram.sm-transition-shapes .sm-panel:last-child{grid-column:1/-1}figure.vr-diagram.sm-transition-shapes .sm-panel svg{max-width:30rem;margin-inline:auto}figure.vr-diagram.sm-transition-shapes .sm-panel:last-child svg{max-width:36rem}@container (width<=48rem){figure.vr-diagram.process-roles .storage,figure.vr-diagram:is(.frame-diagram,.stack-transition-diagram,.ret2win-stack-diagram,.assembly-diagram) .panels,figure.vr-diagram:is(.frame-diagram,.stack-transition-diagram,.ret2win-stack-diagram) .registers{grid-template-columns:1fr}figure.vr-diagram:is(.stack-transition-diagram,.ret2win-stack-diagram) .snapshot{flex-direction:column;display:flex}figure.vr-diagram:is(.stack-transition-diagram,.ret2win-stack-diagram) .snapshot>.action{order:0}figure.vr-diagram:is(.stack-transition-diagram,.ret2win-stack-diagram) .snapshot>h3{order:1}figure.vr-diagram:is(.stack-transition-diagram,.ret2win-stack-diagram) .snapshot>.change{order:2;margin:0 0 1rem}figure.vr-diagram:is(.stack-transition-diagram,.ret2win-stack-diagram) .snapshot>:is(.panels,.state){order:3}figure.vr-diagram.stack-transition-diagram .panels>.registers,figure.vr-diagram.ret2win-stack-diagram .panels>.register-panel{grid-row:1}}@container (width<=42rem){figure.vr-diagram.process-diagram .storage{grid-template-columns:1fr}}@container (width<=36rem){figure.vr-diagram.sm-transition-shapes .sm-panels.three{grid-template-columns:1fr}}@media (width<=30rem){figure.vr-diagram .stack-column{--slot-height:4.5rem}}@media (width<=22rem){figure.vr-diagram .stack-column{--slot-height:5rem}}
