/* An illustrated epilogue. Artwork moves; reading and navigation never do. */
.comic-epilogue{--paper:#eee7d9;--ember:#ff824c;position:relative;background:#111017;color:var(--paper);padding:76px 48px 32px;margin-top:35px;isolation:isolate;scroll-margin-top:0}
.comic-heading{max-width:1440px;margin:0 auto 38px;display:flex;align-items:flex-end;justify-content:space-between;gap:36px}.comic-kicker{font:11px 'JetBrains Mono',monospace;letter-spacing:.18em;text-transform:uppercase;color:#b6a9ca;margin:0 0 22px}.comic-kicker span{color:var(--ember);margin-right:18px}.comic-heading h2{font-size:clamp(42px,5.4vw,78px);font-weight:800;line-height:.98;letter-spacing:-.055em;margin:0}.comic-heading h2 em{font-style:normal;color:var(--ember)}.comic-intro{max-width:275px;font-size:15px;line-height:1.7;color:#beb8c9;margin:0 0 4px}
.comic-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:1440px;margin:auto}.comic-panel{position:relative;isolation:isolate;aspect-ratio:2/3;min-width:0;overflow:hidden;border:1px solid #49404f;background:#15131b}.comic-artwork{position:absolute;inset:0;overflow:hidden;z-index:-1}.comic-art,.comic-light{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.comic-light{pointer-events:none;mix-blend-mode:screen;opacity:.08}.comic-panel:nth-child(1) .comic-light{clip-path:circle(12% at 72% 35%)}.comic-panel:nth-child(2) .comic-light{clip-path:circle(10% at 39% 30%)}.comic-panel:nth-child(3) .comic-light{clip-path:circle(11% at 61% 31%)}
.comic-caption{position:absolute;left:20px;top:20px;right:20px;display:flex;justify-content:space-between;align-items:center;gap:12px;font:10px 'JetBrains Mono',monospace;letter-spacing:.13em;text-transform:uppercase}.comic-caption span{padding:8px 10px;background:#111017e8;border:1px solid #726475}.comic-caption b{color:#f9af79;font-weight:400;background:#111017e8;padding:8px}
.comic-copy{position:absolute;left:26px;right:26px;bottom:27px}.comic-copy .comic-chapter{font:10px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:#b4a5c6;margin:0 0 12px}.comic-copy h3{font-size:clamp(25px,2.5vw,39px);letter-spacing:-.045em;margin:0 0 12px;line-height:1}.comic-copy p{font-size:14px;line-height:1.6;color:#d0c7d6;margin:0 0 20px;max-width:31ch}.comic-link{display:inline-flex;gap:13px;align-items:center;color:var(--ember);font-size:13px;font-weight:600;padding:9px 0;border-bottom:1px solid #815440}.comic-link img{width:17px;filter:invert(1)}.comic-link:hover{color:#fff;border-color:#fff}.comic-secondary{display:flex;gap:20px;margin-top:12px}.comic-secondary a{font:11px 'JetBrains Mono',monospace;color:#d0c7d6;padding:8px 0;text-decoration:underline;text-underline-offset:5px}
.comic-hotspot{position:absolute;top:48%;right:20px;display:flex;align-items:center;gap:8px;background:#17131ced;border:1px solid #c69b77;color:#ffbd8f;border-radius:100px;padding:11px 14px;font:10px 'JetBrains Mono',monospace;min-height:40px;box-shadow:0 4px 18px #0004}.comic-hotspot img{width:15px;filter:invert(1)}.comic-hotspot:hover{background:#f68a53;color:#17131c}.comic-hotspot:hover img{filter:none}
.comic-panel:focus-within{border-color:var(--ember)}.comic-panel:hover{border-color:#ae795f}.comic-panel a:focus-visible,.comic-panel button:focus-visible{outline-color:#fff;outline-offset:4px}
.comic-utility{max-width:1440px;margin:25px auto 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #3d3445;padding-top:20px}.comic-ending{font:11px 'JetBrains Mono',monospace;letter-spacing:.04em;color:#aea1be;line-height:1.7}.comic-ending strong{color:#f9af79;font-weight:400}.comic-controls{display:flex;gap:22px;align-items:center}.comic-controls button,.comic-controls a{color:#e0d5e7;font:11px 'JetBrains Mono',monospace;min-height:44px;display:inline-flex;align-items:center;gap:8px}.comic-controls img{width:15px;filter:invert(1)}.comic-controls button:disabled{opacity:.45;cursor:default}
.comic-dialog{width:min(520px,calc(100% - 32px));padding:32px;border:1px solid #756078;border-radius:3px;background:#19151f;color:#eee7d9;box-shadow:0 30px 100px #0008}.comic-dialog::backdrop{background:#111017b8;backdrop-filter:blur(6px)}.comic-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#ffad79;font:10px 'JetBrains Mono',monospace;letter-spacing:.15em}.comic-dialog-top button{color:#eee7d9;min-height:44px;padding:8px}.comic-dialog h3{font-size:36px;letter-spacing:-.045em;margin:20px 0}.comic-dialog p{color:#cec2d4;font-size:16px;line-height:1.8}.comic-dialog a{margin-top:8px}
/* Motion is scoped to artwork. No entrance state hides links or copy. */
.comic-ready .comic-panel.is-revealing .comic-artwork{animation:comic-reveal 1.15s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--comic-delay,0ms)}
.comic-ready .comic-panel.is-running .comic-art{animation:comic-drift 12s ease-in-out infinite alternate}.comic-ready .comic-panel.is-running .comic-light{animation:comic-glow 4s ease-in-out infinite;animation-delay:var(--comic-delay,0ms)}
.comic-panel:not(.is-running) .comic-art,.comic-panel:not(.is-running) .comic-light{animation-play-state:paused}.comic-panel:nth-child(2){--comic-delay:180ms}.comic-panel:nth-child(3){--comic-delay:360ms}
@keyframes comic-reveal{from{clip-path:inset(0 100% 0 0);filter:brightness(1.8)}to{clip-path:inset(0);filter:brightness(1)}}
@keyframes comic-drift{from{transform:scale(1.015) translateY(0)}to{transform:scale(1.04) translateY(-.65%)}}
@keyframes comic-glow{0%,100%{opacity:.03}50%{opacity:.26}}
.motion-paused .comic-panel.is-revealing .comic-artwork{animation:none!important;clip-path:none!important}
@media(min-width:801px) and (max-width:1100px){.comic-epilogue{padding:55px 28px 28px}.comic-strip{gap:10px}.comic-panel{aspect-ratio:auto;min-height:540px}.comic-art,.comic-light{object-position:50% 0}.comic-copy{left:18px;right:18px;bottom:22px}.comic-copy p{font-size:13px}.comic-caption{left:12px;right:12px;top:12px;letter-spacing:.03em}.comic-hotspot{right:12px;padding:10px}.comic-intro{max-width:230px}}
@media(max-width:800px){.comic-epilogue{padding:48px 22px 24px}.comic-heading{display:block;margin-bottom:30px}.comic-heading h2{font-size:clamp(40px,8vw,62px)}.comic-intro{max-width:420px;margin-top:22px}.comic-strip{grid-template-columns:1fr;gap:22px;max-width:480px}.comic-panel{aspect-ratio:2/3}.comic-copy h3{font-size:34px}.comic-copy p{font-size:15px;max-width:34ch}.comic-copy{left:24px;right:24px;bottom:24px}.comic-hotspot{top:46%}.comic-utility{align-items:flex-start;flex-direction:column;gap:6px}.comic-controls{width:100%;justify-content:space-between;gap:10px}.comic-panel{--comic-delay:0ms!important}}
@media(max-width:390px){.comic-copy{left:18px;right:18px;bottom:18px}.comic-copy h3{font-size:29px}.comic-copy p{font-size:13px;margin-bottom:12px}.comic-secondary{margin-top:6px}.comic-caption{left:12px;right:12px;top:12px;font-size:9px}.comic-hotspot{font-size:9px;right:12px}.comic-kicker{font-size:9px}}
@media(prefers-reduced-motion:reduce){.comic-panel .comic-artwork,.comic-panel .comic-art,.comic-panel .comic-light{animation:none!important;transform:none!important;clip-path:none!important}}

.comic-trace{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.comic-trace path{fill:none;stroke:#ffd3a1;stroke-width:3;stroke-linecap:round;stroke-dasharray:1 99;opacity:0;filter:drop-shadow(0 0 5px #ff7335)}.comic-panel.is-running .comic-trace path{animation:comic-transmission 6s linear infinite;animation-delay:var(--comic-delay,0ms)}
@keyframes comic-transmission{0%{stroke-dashoffset:0;opacity:0}8%,65%{opacity:.85}78%,100%{stroke-dashoffset:-100;opacity:0}}
@media(min-width:1101px){.comic-copy{top:66%;bottom:auto}.comic-copy p{margin-bottom:12px}.comic-copy .comic-chapter{max-width:none;font-size:9px;margin-bottom:12px}.comic-copy h3{font-size:32px}}
@media(prefers-reduced-motion:reduce){.comic-trace{display:none}}

/* A directed motion-comic loop: establishing shot, detail, then return.
   Camera, glow and signal share a layer so illumination stays registered. */
.comic-camera{position:absolute;inset:0;transform-origin:65% 32%;animation:comic-camera-builder 16s infinite;animation-play-state:paused}
.comic-panel:nth-child(2) .comic-camera{transform-origin:40% 32%;animation-name:comic-camera-lab;animation-delay:-2s}
.comic-panel:nth-child(3) .comic-camera{transform-origin:62% 30%;animation-name:comic-camera-terminal;animation-delay:-4s}
.comic-panel.is-running .comic-camera{animation-play-state:running}
.comic-ready .comic-panel.is-running .comic-art{animation:none}
.comic-artwork{mask-image:linear-gradient(#000 0%,#000 55%,transparent 72%)}
.comic-copy{z-index:2}.comic-caption,.comic-hotspot{z-index:3}
.comic-ready .comic-panel.is-running .comic-light{animation:comic-energy 4.5s ease-in-out infinite}
.comic-panel.is-running .comic-trace path{stroke-width:5;stroke-dasharray:4 96;animation-duration:3.2s}
@keyframes comic-camera-builder{
  0%,8%{transform:scale(1) translate(0,0);animation-timing-function:cubic-bezier(.16,1,.3,1)}
  27%,40%{transform:scale(1.36) translate(-1%,2%);animation-timing-function:steps(1,end)}
  41%{transform:scale(1.13) translate(3%,-1%);animation-timing-function:ease-out}
  67%{transform:scale(1.22) translate(0,0);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  90%,100%{transform:scale(1) translate(0,0)}
}
@keyframes comic-camera-lab{
  0%,10%{transform:scale(1) translate(0,0);animation-timing-function:cubic-bezier(.16,1,.3,1)}
  32%,45%{transform:scale(1.4) translate(4%,1%);animation-timing-function:steps(1,end)}
  46%{transform:scale(1.22) translate(-5%,-2%);animation-timing-function:ease-in-out}
  70%{transform:scale(1.32) translate(2%,0);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  92%,100%{transform:scale(1) translate(0,0)}
}
@keyframes comic-camera-terminal{
  0%,10%{transform:scale(1) translate(0,0);animation-timing-function:cubic-bezier(.16,1,.3,1)}
  30%,44%{transform:scale(1.4) translate(0,2%);animation-timing-function:steps(1,end)}
  45%{transform:scale(1.18) translate(-2%,3%);animation-timing-function:ease-in-out}
  72%{transform:scale(1.28) translate(-3%,4%);animation-timing-function:cubic-bezier(.65,0,.35,1)}
  94%,100%{transform:scale(1) translate(0,0)}
}
@keyframes comic-energy{0%,100%{opacity:.04}35%{opacity:.1}52%{opacity:.48}70%{opacity:.1}}
.motion-paused .comic-camera{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.comic-camera{animation:none!important;transform:none!important}}

/* Articulated comic scenes. A fixed camera makes the character performance clear. */
.comic-rig{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.has-rig .comic-camera{display:none}
.comic-rig .rig-motion{animation-play-state:paused!important;transform-box:view-box}
.is-running .comic-rig .rig-motion{animation-play-state:running!important}
.rig-breathe{animation:rig-breathe 6s ease-in-out infinite;transform-origin:220px 610px}
.rig-head{animation:rig-head 6s ease-in-out infinite;transform-origin:290px 335px}
.rig-arm{animation:rig-arm 6s ease-in-out infinite;transform-origin:224px 590px}
.rig-blink{animation:rig-blink 6s linear infinite;opacity:0}
.rig-toss{animation:rig-toss 6s cubic-bezier(.45,0,.55,1) infinite}
.rig-dance{animation:rig-dance 5s ease-in-out infinite}
.rig-terminal-orb{animation:rig-terminal-orb 7s ease-in-out infinite}
.rig-orbit{animation:rig-orbit 9s linear infinite;transform-origin:0 0}
.rig-plane{animation:rig-plane 7s ease-in-out infinite;transform-origin:635px 125px}
.rig-wave{fill:none;stroke:#ffb66c;stroke-width:3;stroke-linejoin:round;stroke-dasharray:90 200;animation:rig-wave 2.8s linear infinite}
.rig-signal{stroke-dasharray:12 220;animation:rig-signal 3s linear infinite}
.rig-bar{transform-origin:0 56px;animation:rig-bar 1.7s ease-in-out infinite alternate}
.rig-packet{animation:rig-packet 2.6s ease-in-out infinite}
.rig-led{animation:rig-led 1.6s ease-in-out infinite}
.rig-scan{animation:rig-scan 4s linear infinite}
@keyframes rig-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes rig-head{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg)}50%{transform:rotate(-7deg)}75%{transform:rotate(2deg)}}
@keyframes rig-arm{0%,100%{transform:rotate(0)}24%{transform:rotate(-2deg)}45%{transform:rotate(-5deg)}65%{transform:rotate(-3deg)}82%{transform:rotate(.5deg)}}
@keyframes rig-blink{0%,32%,36%,78%,82%,100%{opacity:0}33%,35%,79%,81%{opacity:1}}
@keyframes rig-toss{0%,100%{transform:translate(0,0) scale(1)}24%{transform:translate(18px,-38px) scale(.96,1.05)}47%{transform:translate(-10px,-123px) scale(1)}68%{transform:translate(-31px,-57px) scale(.98,1.03)}83%{transform:translate(-14px,5px) scale(1.08,.92)}}
@keyframes rig-dance{0%,100%{transform:translate(0,0)}25%{transform:translate(45px,-37px) rotate(9deg)}50%{transform:translate(16px,38px) scale(1.08,.93)}75%{transform:translate(-25px,-10px) rotate(-9deg)}}
@keyframes rig-terminal-orb{0%,100%{transform:translate(0,0)}25%{transform:translate(45px,-26px) scale(.9)}50%{transform:translate(12px,33px) scale(1.06,.94)}75%{transform:translate(-53px,-24px) scale(.92)}}
@keyframes rig-orbit{to{transform:rotate(360deg)}}
@keyframes rig-plane{0%,100%{transform:translate(0,0) rotate(0)}30%{transform:translate(9px,-21px) rotate(-7deg)}65%{transform:translate(-40px,17px) rotate(8deg)}}
@keyframes rig-wave{to{stroke-dashoffset:-290}}
@keyframes rig-signal{to{stroke-dashoffset:-232}}
@keyframes rig-bar{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
@keyframes rig-packet{0%{transform:translateX(0);opacity:0}15%,85%{opacity:1}100%{transform:translateX(125px);opacity:0}}
@keyframes rig-led{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes rig-scan{from{transform:translateY(-45px)}to{transform:translateY(230px)}}
.motion-paused .comic-rig .rig-motion{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.comic-rig .rig-motion{animation:none!important}.rig-blink{opacity:0}}

/* Panel two: a projected agent system receives, delegates, and completes work. */
.lab-wire{opacity:.28}
.lab-beam{animation:lab-beam 8s ease-in-out infinite}
.lab-core{animation:lab-core 8s ease-in-out infinite}
.lab-chip{animation:lab-chip 8s ease-in-out infinite}
.lab-core-light{animation:lab-core-light 8s ease-in-out infinite}
.lab-worker{animation:lab-worker 8s cubic-bezier(.2,.7,.3,1) infinite}
.lab-intake{stroke:#ffdfb1;stroke-width:4;stroke-dasharray:12 88;animation:lab-intake 8s linear infinite}
.lab-route{stroke:#ffcb95;stroke-width:3;stroke-dasharray:8 92;animation:lab-route 8s linear infinite}
.lab-complete{animation:lab-complete 8s ease-in-out infinite}
@keyframes lab-beam{0%,100%{opacity:.25}20%,70%{opacity:1}85%{opacity:.35}}
@keyframes lab-core{0%,100%{transform:translateY(4px)}25%,65%{transform:translateY(-9px)}80%{transform:translateY(0)}}
@keyframes lab-chip{0%,100%{transform:translateY(0)}25%,65%{transform:translateY(-14px)}80%{transform:translateY(0)}}
@keyframes lab-core-light{0%,10%,90%,100%{opacity:.3}24%,36%,48%,62%,78%{opacity:1}30%,42%,54%{opacity:.45}}
@keyframes lab-worker{0%,8%,100%{opacity:.35;transform:translateY(20px) scale(.85)}22%,78%{opacity:1;transform:translateY(0) scale(1)}90%{opacity:.5;transform:translateY(10px) scale(.95)}}
@keyframes lab-intake{0%{opacity:0;stroke-dashoffset:12}5%,18%{opacity:1}24%,100%{opacity:0;stroke-dashoffset:-100}}
@keyframes lab-route{0%,26%{opacity:0;stroke-dashoffset:8}30%,58%{opacity:1}66%,100%{opacity:0;stroke-dashoffset:-100}}
@keyframes lab-complete{0%,60%,100%{opacity:0}68%,86%{opacity:1}94%{opacity:0}}

/* Panel three: compose, fold, launch, and invite the next conversation. */
.terminal-type{stroke-dasharray:100;animation:terminal-type 10s linear infinite}
.terminal-compose{animation:terminal-compose 10s linear infinite}
.terminal-invitation{animation:terminal-invitation 10s ease-in-out infinite;opacity:0}
.terminal-letter{animation:terminal-letter 10s ease-in-out infinite;opacity:0}
.terminal-fold{transform-origin:0 -34px;animation:terminal-fold 10s ease-in-out infinite}
.terminal-flight{transform-origin:635px 125px;animation:terminal-flight 10s linear infinite}
.terminal-flight-trail{animation:terminal-flight-trail 10s linear infinite;opacity:0}
.terminal-launch{animation:terminal-launch 10s ease-out infinite;opacity:0}
@keyframes terminal-type{0%{stroke-dashoffset:100}18%,75%{stroke-dashoffset:0}85%,100%{stroke-dashoffset:100}}
@keyframes terminal-compose{0%,24%{opacity:1}30%,91%{opacity:0}100%{opacity:1}}
@keyframes terminal-invitation{0%,56%{opacity:0}64%,89%{opacity:1}98%,100%{opacity:0}}
@keyframes terminal-letter{0%,24%{opacity:0;transform:translateY(8px) scale(.65)}31%,39%{opacity:1;transform:translateY(0) scale(1)}46%{opacity:1;transform:translateY(-8px) scale(.6,.2) rotate(-18deg)}49%,100%{opacity:0;transform:translateY(-8px) scale(.3,.1) rotate(-18deg)}}
@keyframes terminal-fold{0%,33%{transform:scaleY(-.6)}41%,100%{transform:scaleY(1)}}
@keyframes terminal-flight{0%,45%{opacity:0;transform:translate(-172px,229px) scale(.3) rotate(15deg)}49%{opacity:1;transform:translate(-164px,219px) scale(.45) rotate(5deg)}59%{opacity:1;transform:translate(-95px,151px) scale(.7) rotate(-14deg)}69%{opacity:1;transform:translate(-15px,64px) scale(.92) rotate(-6deg)}78%{opacity:1;transform:translate(79px,38px) scale(1.08) rotate(9deg)}87%,100%{opacity:0;transform:translate(206px,-23px) scale(1.3) rotate(-12deg)}}
@keyframes terminal-flight-trail{0%,47%{opacity:0;stroke-dashoffset:100}54%{opacity:.2}69%{opacity:.8}86%{opacity:0;stroke-dashoffset:0}100%{opacity:0}}
@keyframes terminal-launch{0%,45%{opacity:0}48%{opacity:1}54%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.terminal-letter,.terminal-compose,.terminal-launch,.terminal-flight-trail{display:none}.terminal-invitation{opacity:1}.terminal-flight{transform:none;opacity:1}}
@media(max-width:800px){.comic-panel:nth-child(3) .comic-artwork{mask-image:linear-gradient(#000 0%,#000 43%,transparent 57%)}}

.rig-toss[role=button]{pointer-events:all;cursor:grab;touch-action:none;outline:none}
.rig-toss[role=button]:focus-visible>circle{stroke:#fff;stroke-width:5}
.is-running .comic-rig .rig-toss[role=button]:hover,.is-running .comic-rig .rig-toss[role=button]:focus-visible{animation-play-state:paused!important}
.rig-toss.spark-borrowed{opacity:0}
.spark-hint{max-width:1440px;margin:-14px auto 24px;color:#d4b59d;font:11px/1.7 'JetBrains Mono',monospace}
.spark-dock{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;gap:10px;padding:12px 18px;border:1px solid #ffac71;background:#19151ff5;border-radius:16px;box-shadow:0 12px 60px #0008;color:#ffc997;font:12px 'JetBrains Mono',monospace;max-width:calc(100vw - 24px)}
.spark-dock[hidden],.borrowed-orb[hidden]{display:none!important}
.spark-dock span{white-space:nowrap}.spark-dock button{min-height:44px;padding:8px 12px;border:1px solid #776079;border-radius:8px;color:#f7e4d2;font:inherit;white-space:nowrap}.spark-dock button:hover,.spark-dock button:focus-visible{background:#523441;outline:2px solid #ffb379}
.borrowed-orb{position:fixed;z-index:1001;width:48px;height:48px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 35% 30%,#fff2c2,#ffae60 32%,#e96830 72%,#963723);border:1px solid #ffd49f;box-shadow:0 0 25px #ff8b4880;pointer-events:none}
.borrowed-orb:after{content:'';position:absolute;inset:11px -12px;border:1px solid #ffbc81;border-radius:50%;transform:rotate(-30deg)}
.spark-trail{position:fixed;z-index:1000;width:7px;height:7px;border-radius:50%;background:#ffd7a2;pointer-events:none}
.comic-panel.spark-target,.comic-panel.spark-energized{border-color:#ffd09b;box-shadow:inset 0 0 24px #ff9b4330}
.spark-energized .lab-network,.spark-energized .terminal-flight{filter:drop-shadow(0 0 5px #ffbb74)}
@media(max-width:600px){.spark-dock{bottom:calc(12px + env(safe-area-inset-bottom));width:calc(100% - 24px);box-sizing:border-box;display:grid;grid-template-columns:1fr 1fr;padding:12px;gap:8px}.spark-dock span{padding-left:8px}.spark-dock button{font-size:11px;white-space:normal}.spark-hint{font-size:10px}}
