/* Act I: one task carried through four schematic explanations. */
.ai-opening-art{--oa-local:var(--green);--oa-host:#776591;--oa-host-surface:#f0edf6;--oa-alert:#98621f;--oa-alert-surface:#fff0da;display:block;width:100%;height:auto;font-family:var(--font);overflow:visible}
[data-theme=dark] .ai-opening-art{--oa-host:#c9b5e6;--oa-host-surface:#292632;--oa-alert:#eac58a;--oa-alert-surface:#372c1e}
.ai-opening-art text{fill:var(--ink);font-size:20px;font-weight:500;text-anchor:middle}.ai-opening-art .oa-small{fill:var(--muted);font-size:16px;font-weight:400}.ai-opening-art .oa-line{stroke:currentColor;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}.oa-scene{display:none}.oa-scene text{pointer-events:none}
.ai-opening-art[data-opening='1'] .oa-scene-1,.ai-opening-art[data-opening='2'] .oa-scene-2,.ai-opening-art[data-opening='3'] .oa-scene-3,.ai-opening-art[data-opening='4'] .oa-scene-4{display:block}
.oa-orbit{fill:none;stroke:var(--line);stroke-width:1;stroke-dasharray:3 9}.oa-deploy{color:var(--oa-host);fill:var(--oa-host-surface);stroke:var(--oa-host);stroke-width:2}.oa-deploy text{stroke:none;fill:var(--ink)}.oa-local{color:var(--oa-local);fill:var(--soft);stroke:var(--oa-local)}.oa-screen{fill:var(--paper)}.oa-chip{fill:var(--green);stroke:var(--paper);stroke-width:2}.oa-route{stroke:var(--oa-host);stroke-width:3;fill:none;stroke-dasharray:6 6}.oa-control{color:var(--green);fill:var(--soft);stroke:var(--green);stroke-width:2}.oa-control path{fill:none;stroke-linecap:round;stroke-linejoin:round}.oa-control text{stroke:none;text-anchor:start}
.oa-editor{transform:translate(402px,238px);transform-origin:0 0}.oa-editor-surface{fill:var(--surface);stroke:var(--line);stroke-width:2}.oa-editor-divider{stroke:var(--line);stroke-width:1}.oa-editor-dot{fill:var(--line)}.ai-opening-art .oa-editor-file{font-size:15px;fill:var(--muted);text-anchor:start}.ai-opening-art .oa-code-line{font:16px ui-monospace,SFMono-Regular,Consolas,monospace;text-anchor:start}.oa-keyword{fill:var(--oa-host)}.oa-result{fill:var(--soft)}.oa-result-check{fill:none;stroke:var(--green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.ai-opening-art .oa-result-text{text-anchor:start;font-size:16px;fill:var(--green)}
.oa-interrupt{color:var(--oa-alert);fill:var(--oa-alert-surface);stroke:none}.oa-meter-track{fill:none;stroke:var(--line);stroke-width:8}.oa-meter-fill{fill:none;stroke:var(--oa-alert);stroke-width:8;stroke-dasharray:220 26;transform:rotate(-90deg)}.ai-opening-art .oa-symbol{fill:var(--oa-alert);font-size:30px}.oa-outline{stroke:var(--oa-alert);stroke-width:3;fill:var(--oa-alert-surface);stroke-linejoin:round}.oa-fill{fill:var(--oa-alert)}.oa-break{stroke:var(--paper);stroke-width:7;fill:none}.ai-opening-art .oa-label{font-size:21px}.ai-opening-art[data-opening='2'] .oa-editor{transform:translate(402px,250px)}.ai-opening-art[data-opening='2'] .oa-result{fill:var(--oa-alert-surface)}.ai-opening-art[data-opening='2'] .oa-result-check{stroke:var(--oa-alert)}
.ai-opening-art[data-opening='3'] .oa-editor{transform:translate(490px,214px) scale(.44)}.oa-balance{fill:none;stroke:var(--line);stroke-width:2;stroke-dasharray:4 7}.ai-opening-art .oa-pair text{font-size:19px}.ai-opening-art .oa-pair .oa-facet{font-size:12px;letter-spacing:1px;fill:var(--muted)}
.oa-task circle{fill:var(--soft);stroke:var(--line);stroke-width:1.5}.oa-document{fill:var(--surface);stroke:var(--green);stroke-width:2}.oa-task-icon{stroke:var(--green);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}.oa-destination{fill:var(--soft);stroke:var(--green);stroke-width:2;transform-box:fill-box;transform-origin:center}.oa-destination use{transform:scale(.43)}.oa-destination text{stroke:none}.oa-dest-cloud{fill:var(--oa-host-surface);stroke:var(--oa-host)}.oa-choice-route{fill:none;stroke:var(--line);stroke-width:2}.ai-opening-art .oa-hybrid{font-size:16px;fill:var(--muted);paint-order:stroke;stroke:var(--surface);stroke-width:14px;stroke-linejoin:round}.ai-opening-art[data-opening='4'] .oa-editor{opacity:0;pointer-events:none}
.oa-choices{display:flex;width:fit-content;justify-content:center;margin:0 auto 12px}.oa-choice-explanation{max-width:690px;margin:8px auto 16px;padding-inline:20px;font-size:15px;line-height:1.6;text-align:center;color:var(--muted)}
.ai-opening-art[data-deployment=local] :is(.oa-dest-cloud,.oa-code),.ai-opening-art[data-deployment=cloud] :is(.oa-dest-local,.oa-private,.oa-offline){opacity:.3}.ai-opening-art[data-deployment=local] .oa-private circle,.ai-opening-art[data-deployment=local] .oa-offline circle,.ai-opening-art[data-deployment=hybrid] .oa-task circle{stroke:var(--green);stroke-width:2.5}.ai-opening-art[data-deployment=cloud] .oa-code circle{stroke:var(--oa-host);stroke-width:2.5}
/* Opacity reveals are effects; editor relocation uses the shared spatial spring. */
.ai-opening-art :is(.oa-control,.oa-deploy,.oa-interrupt,.oa-pair,.oa-task,.oa-destination,.oa-route,.oa-result){transition:opacity 240ms cubic-bezier(.2,0,0,1)}
.ai-opening-art[data-opening='1'][data-opening-step='0'] :is(.oa-control,.oa-local,.oa-host,.oa-route),.ai-opening-art[data-opening='1'][data-opening-step='1'] :is(.oa-control,.oa-local),.ai-opening-art[data-opening='1'][data-opening-step='2'] .oa-host{opacity:0}
.ai-opening-art[data-opening='1'] .oa-local{opacity:0}.ai-opening-art[data-opening='1']:is([data-opening-step='2'],[data-opening-step='3']) .oa-local{opacity:1}.ai-opening-art[data-opening='1'][data-opening-step='3'] .oa-host{opacity:0}.ai-opening-art[data-opening='1'][data-opening-step='3'] .oa-control{opacity:1}
.ai-opening-art[data-opening='2'][data-opening-step='0'] :is(.oa-context,.oa-session,.oa-timeout),.ai-opening-art[data-opening='2'][data-opening-step='1'] :is(.oa-session,.oa-timeout),.ai-opening-art[data-opening='2'][data-opening-step='2'] .oa-timeout{opacity:.08}
.ai-opening-art[data-opening='3'][data-opening-step='0'] .oa-pair:not([data-facet='0']),.ai-opening-art[data-opening='3'][data-opening-step='1'] :is([data-facet='2'],[data-facet='3']),.ai-opening-art[data-opening='3'][data-opening-step='2'] [data-facet='3']{opacity:.08}
.ai-opening-art[data-opening='4'][data-opening-step='0'] :is(.oa-repeat,.oa-code,.oa-offline,.oa-destination,.oa-choice-route,.oa-hybrid),.ai-opening-art[data-opening='4'][data-opening-step='1'] :is(.oa-code,.oa-offline,.oa-destination,.oa-choice-route,.oa-hybrid),.ai-opening-art[data-opening='4'][data-opening-step='2'] :is(.oa-destination,.oa-choice-route,.oa-hybrid){opacity:.08}
.ai-scene[data-opening-scene] .ai-scene-body{grid-template-columns:minmax(0,1fr)}.ai-scene[data-opening-scene] .ai-reading{max-width:780px}.ai-scene[data-opening-scene] .ai-figure{padding:0;position:relative}.ai-scene[data-opening-scene] .ai-figure figcaption{padding-bottom:12px}.ai-scene[data-opening-scene] .ai-opening-art{margin-top:-85px;margin-bottom:-30px}.ai-scene[data-opening-scene] .ai-scene-heading h2{font-size:clamp(32px,4.6vw,56px)}
.ai-present .ai-scene[data-opening-scene]{width:min(100%,calc((100dvh - 240px)*16/9));aspect-ratio:16/9;margin:20px auto 0;padding:0;min-height:0;position:relative;container-type:inline-size;border:1px solid var(--line);border-radius:28px;background:var(--surface);overflow:hidden}.ai-present .ai-scene[data-opening-scene] .ai-scene-heading{position:absolute;top:5%;left:4%;right:4%;z-index:1;pointer-events:none}.ai-present .ai-scene[data-opening-scene] .ai-eyebrow{font-size:clamp(10px,1.15cqw,14px);margin:0 0 12px}.ai-present .ai-scene[data-opening-scene] h2{font-size:clamp(24px,4.6cqw,54px);margin:0;line-height:1.1;pointer-events:auto}.ai-present .ai-scene[data-opening-scene] .ai-point{display:none}.ai-present .ai-scene[data-opening-scene] .ai-scene-body{height:100%}.ai-present .ai-scene[data-opening-scene] .ai-figure{border:0;border-radius:0;max-width:none;height:100%;overflow:visible;background:none}.ai-present .ai-scene[data-opening-scene] .ai-opening-art{width:100%;height:100%;margin:0}.ai-present .ai-scene[data-opening-scene] .ai-figure figcaption,.ai-present .ai-scene[data-opening-scene] .ai-notes{display:none}.ai-present .ai-scene[data-opening-scene] .ai-demo-controls{position:absolute;bottom:2%;left:3%;margin:0;gap:4px;z-index:2}.ai-present .ai-scene[data-opening-scene] .ai-demo-controls .button{min-height:44px;padding:8px 12px;font-size:12px}.ai-present .ai-scene[data-opening-scene] [data-step-count]{font-size:11px}.ai-present .ai-scene[data-opening-scene] .ai-step-text{position:absolute;bottom:11%;left:4%;right:4%;font-size:clamp(12px,1.8cqw,21px);min-height:0;margin:0;max-width:none}.ai-present .ai-scene[data-opening-scene='4'] .ai-step-text{display:none}.ai-present .ai-scene[data-opening-scene='4'] .oa-choices{position:absolute;bottom:11%;left:0;right:0;margin:0 auto;z-index:2}.ai-present .ai-scene[data-opening-scene='4'] .oa-choice-explanation{display:none}.ai-present .ai-key-help{margin:6px 0;font-size:11px}.ai-present .ai-progress{margin-top:6px}.ai-present .ai-scene-nav{padding-top:12px}
@media(max-width:760px){.ai-scene[data-opening-scene] .ai-opening-art{margin-top:-35px;margin-bottom:0}.ai-scene[data-opening-scene] .ai-figure{overflow:hidden}.ai-present .ai-scene[data-opening-scene]{width:100%;aspect-ratio:auto;min-height:0;overflow:visible;container-type:normal}.ai-present .ai-scene[data-opening-scene] .ai-scene-heading{position:relative;inset:auto;padding:24px 22px 0}.ai-present .ai-scene[data-opening-scene] .ai-eyebrow{font-size:11px}.ai-present .ai-scene[data-opening-scene] h2{font-size:32px}.ai-present .ai-scene[data-opening-scene] .ai-scene-body{height:auto}.ai-present .ai-scene[data-opening-scene] .ai-opening-art{height:auto;margin-top:-45px}.ai-present .ai-scene[data-opening-scene] .ai-demo-controls{position:relative;inset:auto;padding:0 16px 16px;justify-content:flex-start}.ai-present .ai-scene[data-opening-scene] .ai-step-text{position:relative;inset:auto;padding:0 22px 18px;text-align:left;font-size:17px}.ai-present .ai-scene[data-opening-scene='4'] .oa-choices{position:relative;inset:auto;margin:0 0 16px}.ai-present .ai-scene[data-opening-scene='4'] .oa-choice-explanation{display:block;font-size:15px}.ai-scene[data-opening-scene] .ai-reading{padding-top:0}}
@media(max-width:520px){.ai-scene[data-opening-scene] .ai-opening-art{min-width:520px;width:145%;max-width:none;margin-left:-22.5%}.ai-scene[data-opening-scene='1'] .ai-opening-art{width:160%;margin-left:-30%;min-width:0}.ai-scene[data-opening-scene='3'] .ai-opening-art{min-width:0;width:100%;margin-left:0}.ai-scene[data-opening-scene='4'] .ai-opening-art{min-width:0;width:100%;margin-left:0}.ai-scene[data-opening-scene] .ai-figure{overflow:hidden}.ai-scene[data-opening-scene] .oa-small{display:none}.ai-scene[data-opening-scene='1'] .oa-control{display:none}.ai-scene[data-opening-scene='1'] .oa-orbit{display:none}.ai-scene[data-opening-scene='1'] .oa-editor{transform:translate(210px,238px)}.ai-scene[data-opening-scene='1'] .oa-deploy{transform:translate(760px,345px)}.ai-scene[data-opening-scene='1'] .oa-route{display:none}.ai-scene[data-opening-scene='3'] .ai-opening-art text{font-size:25px}.ai-scene[data-opening-scene='3'] .ai-opening-art .oa-facet{font-size:19px}.ai-scene[data-opening-scene='3'] .oa-editor{display:none}.ai-scene[data-opening-scene='4'] .ai-opening-art text{font-size:26px}.ai-scene[data-opening-scene='4'] .oa-task{transform:translate(290px,250px)}.ai-scene[data-opening-scene='4'] .oa-repeat{transform:translate(830px,250px)}.ai-scene[data-opening-scene='4'] .oa-code{transform:translate(290px,460px)}.ai-scene[data-opening-scene='4'] .oa-offline{transform:translate(830px,460px)}.ai-scene[data-opening-scene='4'] :is(.oa-destination,.oa-choice-route,.oa-hybrid){display:none}}
@media(prefers-reduced-motion:reduce){.ai-opening-art *{transition:none!important}}
html[data-motion=reduce] .ai-opening-art *{transition:none!important}
@media print{.ai-scene[data-opening-scene]{aspect-ratio:auto!important;width:100%!important;overflow:visible!important}.ai-scene[data-opening-scene] .ai-scene-heading{position:static!important}.ai-scene[data-opening-scene] .ai-demo-controls,.oa-choices{display:none!important}.ai-opening-art *{opacity:1!important}}
/* A phone gets a readable composition of the same teaching point. */
.oa-mobile{display:none}
@media(max-width:600px){
 .ai-scene[data-opening-scene] .ai-opening-art{display:none!important}
 .oa-mobile{display:block;padding:24px 20px}
 .oa-mobile-editor{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--paper)}
 .oa-mobile-editor>span{display:block;padding:12px 16px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line)}
 .oa-mobile-editor pre{padding:16px;border:0;margin:0;background:none;font-size:13px;line-height:1.8}
 .oa-mobile-editor>p{margin:0;padding:12px 16px;background:var(--soft);font-size:14px;color:var(--green)}
 .oa-mobile-deployments{display:flex;gap:12px;justify-content:center;margin-top:20px;flex-wrap:wrap}
 .oa-mobile-deployments>span{padding:14px 18px;border:1px solid var(--line);border-radius:18px;font-size:14px}
 .oa-mobile-host{background:var(--soft);border-style:dashed!important}.oa-mobile-local{background:var(--soft);border-color:var(--green)!important}
 .oa-mobile-caption{font-size:15px;text-align:center;line-height:1.6;margin:18px 0 0}
 .oa-mobile-limits{margin:0;display:grid;gap:22px}.oa-mobile-limits>div{display:grid;grid-template-columns:1fr;gap:6px}.oa-mobile-limits dt{display:flex;gap:12px;align-items:center;font-size:17px}.oa-mobile-limits dd{margin:0 0 0 38px;color:var(--muted);font-size:15px}
 .oa-mobile-limits dt>span{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:2px solid var(--muted);color:var(--ink);flex:none;font-size:18px}
 .oa-mini-quota,.oa-mini-timeout{border-radius:50%}.oa-mini-context{border-radius:4px;background:repeating-linear-gradient(90deg,var(--muted) 0 3px,transparent 3px 6px)}.oa-mini-session{border-radius:5px}.oa-mini-timeout:after{content:'';width:7px;height:9px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translate(2px,-3px)}
 .oa-mobile-comparison table{font-size:14px;table-layout:fixed}.oa-mobile-comparison :is(th,td){padding:12px 8px;overflow-wrap:anywhere}.oa-mobile-comparison th{font-size:18px;color:var(--green)}.oa-mobile-comparison caption{font-size:12px}
 .oa-mobile-tasks{display:grid;grid-template-columns:1fr 1fr;gap:16px}.oa-mobile-tasks>div{padding:16px 12px;border:1px solid var(--line);border-radius:18px;background:var(--soft)}.oa-mobile-tasks strong{display:block;font-size:16px;line-height:1.4;font-weight:550}.oa-mobile-tasks span{display:block;margin-top:8px;font-size:14px;color:var(--muted);line-height:1.5}
 .ai-scene[data-opening-scene='4'] .ai-figure{display:flex;flex-direction:column}.ai-scene[data-opening-scene='4'] .oa-mobile{order:-1}
 .ai-scene[data-deployment=local] .oa-mobile-tasks :is(.oa-private,.oa-offline),.ai-scene[data-deployment=cloud] .oa-mobile-tasks .oa-code{border:2px solid var(--green);padding:15px 11px}
 .ai-present .ai-scene[data-opening-scene='4'] .oa-choices{left:auto;right:auto;margin-inline:auto}
 .ai-present .ai-scene[data-opening-scene] .ai-step-text{font-size:16px}
 .ai-present .ai-scene[data-opening-scene] .ai-demo-controls{gap:4px}.ai-present .ai-scene[data-opening-scene] [data-step-count]{flex-basis:100%;margin-left:8px;margin-top:4px}
}