@import url('./experiments.css?v=0.8');
/* Documentation foundation — content first, with a separate interactive surface. */
:root{color-scheme:light;--bg:#fff;--bg-soft:#f5f5f7;--surface:#f5f5f7;--surface-2:#ededf0;--text:#1d1d1f;--muted:#64646b;--line:#e3e3e8;--line-strong:#c7c7ce;--accent:#0066cc;--on-accent:#fff;--accent-soft:#eaf3fc;--duck:#a46a00;--mint:#16734c;--cyan:#427da3;--coral:#b14b23;--violet:#7650b6;--red:#bd3340;--header:#ffffffee;--sidebar:256px;--max:1040px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB',sans-serif}
:root[data-theme=dark]{color-scheme:dark;--bg:#1d1d1f;--bg-soft:#252528;--surface:#29292c;--surface-2:#333337;--text:#f5f5f7;--muted:#adadb5;--line:#3a3a3e;--line-strong:#56565c;--accent:#70b7ff;--on-accent:#14283e;--accent-soft:#23364a;--duck:#f1c665;--mint:#72d5ab;--cyan:#75abc8;--coral:#f39e7d;--violet:#c2a2f3;--red:#ff8994;--header:#1d1d1fee}
@media(prefers-color-scheme:dark){:root[data-theme=auto]{color-scheme:dark;--bg:#1d1d1f;--bg-soft:#252528;--surface:#29292c;--surface-2:#333337;--text:#f5f5f7;--muted:#adadb5;--line:#3a3a3e;--line-strong:#56565c;--accent:#70b7ff;--on-accent:#14283e;--accent-soft:#23364a;--duck:#f1c665;--mint:#72d5ab;--cyan:#75abc8;--coral:#f39e7d;--violet:#c2a2f3;--red:#ff8994;--header:#1d1d1fee}}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.7 -apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button,input,select,a,summary{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--accent)!important;outline-offset:3px}h1,h2,h3,h4,p{overflow-wrap:break-word}button,select{max-width:100%}::selection{background:var(--accent-soft)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip-link{position:fixed;left:20px;top:-70px;z-index:100;padding:12px;background:var(--bg);border:1px solid var(--accent);border-radius:8px}.skip-link:focus{top:12px}.icon{display:inline-block;width:18px;height:18px;flex-shrink:0;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat}
/* The chapter tree stays separate from the reading scroll. */
.course-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:var(--bg-soft);border-right:1px solid var(--line);z-index:40;display:flex;flex-direction:column;padding:0 14px 18px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}.brand{height:65px;min-height:65px;display:flex;align-items:center;gap:10px;color:var(--text);font-size:13px;font-weight:600;padding:0 10px;border-bottom:1px solid var(--line);white-space:nowrap}.brand:hover{text-decoration:none}.brand-mark{width:29px;height:29px;display:grid;place-items:center;background:var(--accent);color:#fff;border-radius:7px}.brand-mark .icon{width:18px;height:18px}.sidebar-title{font-size:18px;font-weight:650;margin:27px 12px 1px;letter-spacing:-.02em}.sidebar-subtitle{font-size:12px;color:var(--muted);margin:0 12px 20px}.chapter-filter{margin:0 8px 12px;display:flex;align-items:center;gap:8px;border:1px solid var(--line-strong);border-radius:7px;background:var(--bg);padding:7px 9px;color:var(--muted)}.chapter-filter .icon{width:14px;height:14px}.chapter-filter input{width:100%;min-width:0;padding:0;border:0;background:transparent;color:var(--text);font-size:12px;outline:none}.chapter-filter:focus-within{outline:2px solid var(--accent);outline-offset:2px}#chapterSidebar{flex:1}.sidebar-group{color:var(--muted);font-size:11px;font-weight:600;padding:20px 12px 8px}#chapterSidebar button{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border:0;background:transparent;text-align:left;line-height:1.45;font-size:12px;color:var(--text);border-radius:6px;margin:2px 0}#chapterSidebar button span{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0}#chapterSidebar button:hover{background:var(--surface-2)}#chapterSidebar button[aria-current=page]{background:var(--accent-soft);color:var(--accent);font-weight:600}#chapterSidebar button[aria-current=page] span{color:var(--accent)}#chapterSidebar button i{margin-left:auto;width:5px;height:5px;border-radius:50%;flex-shrink:0}#chapterSidebar button.passed i{background:var(--mint)}.sidebar-bottom{border-top:1px solid var(--line);padding:18px 10px 0;margin-top:24px;display:grid;gap:8px;font-size:11px;color:var(--muted)}.sidebar-bottom a{color:var(--muted)}#sidebarToggle,.sidebar-close,.sidebar-backdrop{display:none}
.reader-main{margin-left:var(--sidebar);width:calc(100% - var(--sidebar))}.reader-bar{height:65px;position:sticky;top:0;z-index:25;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 40px;border-bottom:1px solid var(--line);background:var(--header);backdrop-filter:blur(20px);font-size:13px}.reader-identity,.reader-tools,.reader-tools a,.reader-tools button{display:flex;align-items:center;gap:8px}.reader-identity{font-weight:600}.nav-divider{color:var(--line-strong);padding:0 7px}.nav-subtitle{font-size:12px;color:var(--muted);font-weight:400}.reader-tools{gap:23px}.reader-tools a,.reader-tools button{font-size:12px;color:var(--muted);text-decoration:none}.reader-tools button{border:0;background:transparent;padding:8px 0}.reader-tools .icon{width:16px;height:16px}.reader-tools a:hover,.reader-tools button:hover{color:var(--accent)}kbd{font:10px/1.4 inherit;border:1px solid var(--line-strong);border-radius:4px;padding:1px 4px;color:var(--muted)}.theme-control select{font-size:11px;background:transparent;color:var(--muted);border:0;padding:5px 1px;cursor:pointer}
.course{max-width:980px;padding:46px 48px 64px;margin:0 auto}.course-content{display:flex;flex-direction:column;gap:0}.chapter-story{padding:0;border:0;border-radius:0;background:transparent;max-width:none}.chapter-header{border-bottom:1px solid var(--line);padding:0 0 28px;margin-bottom:0}.section-number{font-size:11px;letter-spacing:.08em;color:var(--muted);font-weight:500;margin-bottom:12px}.chapter-story h1{font-size:26px;line-height:1.35;font-weight:650;letter-spacing:-.03em;margin:0 0 12px}.chapter-intro{font-size:15px;line-height:1.8;color:var(--muted);margin:0;max-width:720px}#chapterQuestions{border:0;max-width:none;margin:0}.question-index-heading{border:0;padding:16px 0;gap:12px;font-size:11px;color:var(--muted)}.course .question-index-heading button{font-size:11px;border:0;background:none;padding:5px 0;color:var(--accent);border-radius:0}.question-reading{max-width:none;padding:20px 0 0}.eyebrow{font-size:10px;font-weight:600;letter-spacing:.09em;color:var(--muted)}.question-reading>.eyebrow{color:var(--accent)}.question-reading h2{font-size:36px;letter-spacing:-.035em;line-height:1.3;font-weight:650;margin:10px 0 20px}.question-reading .lesson-lead{font-size:19px;line-height:1.85;color:var(--text);margin:0 0 34px}.question-reading section{margin:36px 0}.question-reading h3{font-size:22px;letter-spacing:-.02em;line-height:1.5;font-weight:650;color:var(--text);margin:0 0 15px}.question-reading p{font-size:16px;line-height:1.95;letter-spacing:.005em;color:var(--text);margin:0 0 18px}.question-reading .worked-example{background:var(--bg-soft);border:0;border-radius:10px;padding:26px 28px}.question-reading .worked-example h3{font-size:18px}.question-reading .worked-example p:last-child{margin-bottom:0}.question-reading .lesson-sources{font-size:12px;color:var(--muted);margin-top:24px}.lesson-sources a{color:var(--accent)}#questionOutline{background:var(--bg-soft);padding:8px;border:1px solid var(--line);border-radius:8px;margin:0 0 10px}#questionOutline button{color:var(--text);border:0;border-radius:5px;font-size:13px;padding:10px;background:transparent}#questionOutline button span{color:var(--muted)}#questionOutline button[aria-current=page]{background:var(--accent-soft);color:var(--accent)}#questionOutline button:hover{background:var(--surface-2)}#questionAnswers,#understand,#example,#interpret,#activities,#check,#questionSearchPanel{scroll-margin-top:88px}
.page-toc{display:none}.learning-steps{border-top:1px solid var(--line);border-left:0;padding:32px 0 12px;margin:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:none}.learning-steps b{font-size:12px;color:var(--accent);font-weight:600}.learning-steps p{color:var(--muted);font-size:13px;line-height:1.8;margin:8px 0 20px}.activity-panel{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:28px;max-width:none}.activity-panel h3{font-size:22px;font-weight:650;letter-spacing:-.025em;color:var(--text)}.activity-panel p{color:var(--text);font-size:14px}.activity-panel .hint,.hint{color:var(--muted);font-size:12px}.course button{border:1px solid var(--line-strong);background:var(--bg);color:var(--text);border-radius:7px;font-size:12px;padding:9px 12px;line-height:1.5}.course button:hover{border-color:var(--accent);color:var(--accent)}.course button[aria-pressed=true],#continueChapter,.play-controls button{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.course button:disabled:hover{border-color:var(--line-strong);color:var(--muted)}select{background:var(--bg);border:1px solid var(--line-strong);color:var(--text);border-radius:6px;padding:8px;font-size:13px}input[type=range]{accent-color:var(--accent);width:100%}.course input[type=checkbox]{accent-color:var(--accent)}.activity-panel output{color:var(--accent)}.control-grid label,.lab-controls label{color:var(--text)}.course summary{color:var(--text)}.course details p{color:var(--muted)}.feedback{background:var(--accent-soft);border-left:3px solid var(--accent);color:var(--text);font-size:13px;border-radius:0 7px 7px 0}.feedback b{color:var(--text)}.message-pair>div,.comparison-grid>section{background:var(--bg);border:1px solid var(--line);border-radius:8px}.message-pair h4,.comparison-grid h4{color:var(--muted);font-size:12px}.message-pair pre{color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.mini-flow{background:var(--bg);border-color:var(--line);color:var(--accent)}.metric-strip>span{background:var(--bg);border:1px solid var(--line);color:var(--muted);border-radius:7px}.metric-strip b{color:var(--text)}.extra-lab{background:var(--bg-soft);border-color:var(--line)!important}.job-tokens{background:var(--bg);border-color:var(--line)}.job{background:var(--surface-2);color:var(--duck)}.job.running{background:var(--surface);color:var(--mint)}.job.retry{background:var(--surface);color:var(--coral)}.event-record{background:var(--bg);border-color:var(--line-strong);color:var(--violet)}.event-record b{color:var(--text)}.case-card{background:var(--bg);border-color:var(--line)}.decision-map>div{background:var(--bg);border-color:var(--accent)}.cheat-table th,.cheat-table td{border-color:var(--line)}.cheat-table td:first-child{color:var(--accent)}.percentile-plot{border-color:var(--line-strong)}.percentile-plot .selected{background:var(--accent);outline-color:var(--accent)}.percentile-ranks li{background:var(--bg);color:var(--muted)}.percentile-ranks .chosen{outline-color:var(--accent);color:var(--accent)}.timing-readout strong{color:var(--accent)}.timing-readout>span,.timing-key{color:var(--muted)!important}.timing-plot span{background:var(--line-strong)}.timing-plot span.included{background:var(--accent)}.timing-table tr.included{color:var(--accent)}.timing-table tr:not(.included){color:var(--muted)}.timing-table caption{color:var(--muted)}.time-bar{background:linear-gradient(to right,var(--accent) var(--portion),var(--surface-2) var(--portion));color:var(--text)}.time-bar.full{background:var(--accent-soft)}
/* Simulation, graph, and token colors are shared with the canvas renderer. */
.visual-shell{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;overflow:hidden}.visual-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid var(--line)}.visual-title{font-size:17px;font-weight:600}.metric-row{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-row strong{font-size:25px}.metric-row span{font-size:10px;color:var(--muted)}.instrument-grid{grid-template-columns:1fr}.canvas-wrap{position:relative;aspect-ratio:5/3;background:var(--bg);border-color:var(--line);border-radius:8px}.three-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#systemCanvas{width:100%;height:100%}.scene-labels{color:var(--text)}.scene-labels small{color:var(--muted)}.scene-labels .label-return{color:var(--mint)}.flow-legend,.sim-status,.lab-controls label small{color:var(--muted)}.dot.outbound{background:var(--duck)}.dot.queued{background:var(--coral)}.dot.returning{background:var(--mint)}.dot.timeout{background:var(--violet)}#metricTimeout{color:var(--violet)}.chart-key.incoming{color:var(--duck)}.chart-key.p95{color:var(--violet)}.lab-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}.lab-controls output{color:var(--accent)}.deadline-control{color:var(--text);border-color:var(--line)}.deadline-control p,.deadline-control output{color:var(--muted)}.monitor-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;background:var(--bg);border-left:0;border-top:1px solid var(--line);padding:22px}.monitor-heading,.capacity-summary{grid-column:1/-1}.monitor-heading{margin:0;display:flex;align-items:center;justify-content:space-between}.monitor-heading h3{font-size:15px;margin:0}.monitor h4{font-size:11px}.monitor p{font-size:10px;flex-wrap:wrap}.monitor p>span:last-child{width:100%;margin:0}.monitor svg text{fill:var(--muted)}.capacity-summary{grid-template-columns:1fr auto 1fr auto;gap:8px 18px}.measurement-notes,.measurement-notes summary{color:var(--muted)}.world-context{border:0;padding:0;background:transparent;margin:0;max-width:none}.world-context>p{display:none}.world-map{height:275px;border:1px solid var(--line);border-radius:8px;background:var(--bg);margin:18px 0}.course .map-node{background:var(--bg);color:var(--text);border-color:var(--line-strong);font-size:10px;padding:5px 7px}.course .map-node.focused{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.question-pager{max-width:none;margin:36px 0;padding:24px 0;border-block:1px solid var(--line)}.question-pager span{color:var(--muted)}.question-pager button{background:transparent;color:var(--accent);border:0;padding:8px 0}.question-practice{max-width:none}.question-practice h3,.chapter-check h3{font-size:21px;line-height:1.6;font-weight:600}.chapter-check{border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;padding:32px 0}.chapter-bottom-nav{display:flex;justify-content:space-between;margin-top:24px;gap:12px}.course-sources{margin-top:30px;border-top:1px solid var(--line);font-size:12px}.course-sources a{color:var(--accent)}body>footer{max-width:none;margin-left:var(--sidebar);padding:24px 48px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted);background:var(--bg-soft)}
/* Search opens above the document, without changing the lesson route. */
.question-search:not([open]){display:none}.question-search[open]{position:fixed;top:82px;left:calc(var(--sidebar) + 32px);right:32px;margin:0 auto;max-width:640px;z-index:50;padding:24px!important;background:var(--bg);border:1px solid var(--line-strong)!important;border-radius:12px;box-shadow:0 18px 80px #0003;max-height:calc(100dvh - 110px);overflow:auto}.question-search summary{font-size:15px;font-weight:600}.question-search label{font-size:12px;color:var(--muted)}.course input[type=search]{background:var(--bg-soft);color:var(--text);border:1px solid var(--line-strong);font-size:15px;padding:12px}.question-search button{background:transparent;border:0;border-radius:5px;font-size:13px}.question-search button:hover{background:var(--accent-soft)}#searchResults p{font-size:12px;margin-bottom:15px}
@media(min-width:1280px){.course{margin-right:196px;max-width:1000px;padding-inline:56px}.page-toc{display:flex;position:fixed;right:30px;top:114px;width:152px;flex-direction:column;gap:0;font-size:12px;border-left:1px solid var(--line);padding-left:20px}.page-toc>span{color:var(--text);font-weight:600;margin-bottom:12px}.page-toc a{color:var(--muted);font-size:11px;padding:7px 0;line-height:1.5}.page-toc a[aria-current=true]{color:var(--accent)}.toc-note{border-top:1px solid var(--line);padding-top:22px;margin-top:20px;color:var(--muted)}.toc-note .icon{width:16px;height:16px}.toc-note p{font-size:11px;line-height:1.8;margin:8px 0}}
@media(min-width:1600px){.course{margin-left:auto;margin-right:auto;transform:translateX(-90px);max-width:970px}.page-toc{right:max(30px,calc((100vw - 1550px)/2))}}
@media(max-width:1100px) and (min-width:801px){:root{--sidebar:224px}.course{padding:36px 36px 60px}.reader-bar{padding:0 30px}.reader-tools{gap:18px}.reader-tools kbd{display:none}.question-reading h2{font-size:32px}}
@media(max-width:800px){.course-sidebar{transform:translateX(-100%);width:min(300px,88vw);transition:transform .18s ease}.sidebar-open .course-sidebar{transform:none}.sidebar-open .sidebar-backdrop{display:block;position:fixed;inset:0;background:#0005;border:0;z-index:35}.sidebar-open{overflow:hidden}.sidebar-close{display:block;position:absolute;right:12px;top:72px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;width:30px;height:30px;font-size:21px;padding:0}.reader-main{margin:0;width:100%}.reader-bar{height:58px;padding:0 22px;gap:12px}#sidebarToggle{display:flex;border:0;background:none;color:var(--text);align-items:center;padding:8px 5px 8px 0}.reader-identity{font-size:13px;gap:8px}.nav-subtitle,.nav-divider,.reader-tools kbd{display:none}.reader-tools{gap:20px}.reader-tools a span,.reader-tools button span{display:none}.theme-control select{font-size:11px}.course{padding:30px 26px 48px}.chapter-story h1{font-size:24px}.chapter-intro{font-size:14px}.chapter-header{padding-bottom:22px}.question-reading h2{font-size:32px}.question-reading .lesson-lead{font-size:18px}.question-reading p{font-size:16px}.question-reading h3{font-size:21px}.question-reading section{margin:30px 0}.question-reading .worked-example{padding:22px}.learning-steps{grid-template-columns:1fr;gap:0;padding-top:25px}.learning-steps p{margin-bottom:16px}.activity-panel{padding:22px}.question-search[open]{left:16px;right:16px;top:74px;padding:20px!important}body>footer{margin-left:0;padding:22px 26px;font-size:10px}.question-pager button{font-size:12px}.question-pager span{font-size:11px}}
@media(max-width:520px){.course{padding:24px 20px 40px}.reader-bar{padding:0 17px}.reader-tools{gap:15px}.chapter-story h1{font-size:22px}.question-reading h2{font-size:29px}.question-reading .lesson-lead{font-size:17px}.question-reading .worked-example{padding:20px}.question-reading{padding-top:15px}.question-index-heading{font-size:10px;gap:5px}.question-index-heading button{font-size:10px!important}.activity-panel{padding:18px}.activity-panel h3{font-size:20px}.control-grid,.timing-controls,.message-pair,.comparison-grid{grid-template-columns:1fr}.timing-controls{gap:18px}.world-map{height:290px}.course .map-node{font-size:9px;max-width:75px;padding:4px}.metric-row{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-toolbar{padding:17px}.visual-title{font-size:15px}.lab-controls{grid-template-columns:1fr;gap:12px;padding:18px}.lab-controls>div{display:grid;grid-template-columns:1fr auto;gap:0 12px}.lab-controls input{grid-column:1/-1}.lab-controls label{font-size:12px}.lab-controls output{font-size:13px;margin:0}.monitor-rail{grid-template-columns:1fr;padding:18px}.monitor{padding-top:14px}.monitor p{flex-wrap:nowrap}.monitor p>span:last-child{margin-left:auto;width:auto}.monitor h4{font-size:12px}.monitor svg{max-height:115px}.capacity-summary{grid-template-columns:1fr auto}.timing-table td,.timing-table th{font-size:11px;padding:9px 5px}.question-pager{gap:8px}.question-pager button{max-width:44%;text-align:left}.question-pager button:last-child{text-align:right}.question-pager span{flex-shrink:0}.canvas-wrap{aspect-ratio:5/3}.scene-labels{font-size:9px}.scene-labels small{font-size:8px}.scene-labels .label-return{font-size:8px}.chapter-bottom-nav button{font-size:12px}body>footer{flex-direction:column;gap:4px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
@media print{.course-sidebar,.reader-bar,.page-toc,.sidebar-backdrop,.question-search,.question-index-heading,.question-pager,body>footer{display:none!important}.reader-main{margin:0!important;width:100%!important}.course{margin:0!important;transform:none!important;padding:0!important;max-width:none!important}.question-reading p{color:black!important}.chapter-story{display:block!important}.activity-panel{break-inside:avoid}}

.chapter-filter-empty{padding:8px 12px;font-size:12px;color:var(--muted)}

.course-sidebar{overflow:hidden}#chapterSidebar{min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}.brand,.sidebar-title,.sidebar-subtitle,.chapter-filter,.sidebar-bottom{flex-shrink:0}

.activity-panel[data-kind=api] .control-grid{align-items:end}.activity-panel[data-kind=api] .control-grid>label{margin-bottom:9px}.message-pair+.mini-flow{margin-top:18px}
