/* Coordinated compute, gradient exchange and a shared update: one ten-second cycle. */
.cluster-stage{--worker-light:#f5f9ed;--worker-shade:#b8cda3;--worker-left:#8ca875;--worker-right:#526f43;--worker-edge:#8fa47d;--worker-floor:#9aaa80;--signal:#fff;--cycle:10s;background:radial-gradient(ellipse at 50% 40%,#f1f5e9,#dce6d2);border:1px solid #cdd9bf;box-shadow:inset 0 1px 0 #fff;padding:26px 34px 22px}
.cluster-stage-top{align-items:center;flex-wrap:nowrap}
.cluster-motion-toggle{width:30px;height:30px;flex-shrink:0;border:1px solid #82957466;border-radius:50%;background:#ffffff70;color:var(--ink);font-size:12px;cursor:pointer}
.cluster-stage .distributed-network{height:auto;aspect-ratio:720/440;max-height:640px;width:100%;padding:0;border:0;background:transparent}
.distributed-network svg{display:block;width:100%;height:100%}
.worker-stop-light{stop-color:var(--worker-light)}.worker-stop-shade{stop-color:var(--worker-shade)}
.worker-stop-side{stop-color:var(--worker-left)}.worker-stop-deep{stop-color:var(--worker-right)}
.floor-stop-center{stop-color:var(--worker-floor);stop-opacity:.2}.floor-stop-edge{stop-color:var(--worker-floor)}
.outer-orbit{stroke:var(--worker-edge);stroke-width:1.1;stroke-linecap:round;stroke-dasharray:1 8;opacity:.58}
.orbit-flash{stroke:var(--signal);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:12 488;filter:drop-shadow(0 0 3px #fff9);animation:orbit-travel 20s linear infinite;opacity:.8}
.orbit-sync{stroke:var(--signal);stroke-width:1.1;opacity:0;animation:orbit-unify var(--cycle) ease-in-out infinite}
.exchange-track{stroke:var(--worker-edge);stroke-width:.9;opacity:.32}
.exchange-in,.exchange-out{stroke:var(--signal);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:10 190;opacity:0;filter:drop-shadow(0 0 2px #fff8);animation:exchange-in var(--cycle) linear infinite;animation-delay:var(--exchange-delay)}
.exchange-out{stroke-dasharray:7 193;animation-name:exchange-out}
.worker-shadow{fill:#40532f;opacity:.12;filter:blur(2px);animation:shadow-breathe var(--cycle) ease-in-out infinite}
.worker-shell{fill:url(#worker-side);stroke:var(--worker-edge);stroke-width:.5}.worker-right{fill:var(--worker-right)}
.worker-top{fill:url(#worker-surface);stroke:var(--worker-edge);stroke-width:.7}
.worker-bevel{stroke:#ffffffa0;stroke-width:.9;fill:none}.worker-seam{stroke:#dbe8c644;stroke-width:.65}
.worker-circuit{stroke:var(--worker-edge);stroke-width:.6;opacity:.6}
.worker-activation{fill:none;stroke:white;stroke-width:1;opacity:0;animation-duration:var(--cycle);animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.worker-body{animation-duration:var(--cycle);animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.compute-cell{fill:white;opacity:.24;animation-duration:var(--cycle);animation-timing-function:ease-in-out;animation-iteration-count:infinite;filter:drop-shadow(0 0 2px #ffffff70)}
.cell-1{animation-delay:.1s}.cell-2{animation-delay:.2s}.cell-3{animation-delay:.3s}
.worker-indicator{stroke:#f8ffe9;stroke-width:1.5;stroke-linecap:round;opacity:.35;animation-duration:var(--cycle);animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.shared-shadow{fill:#3d522c;opacity:.13;filter:blur(2px)}
.shared-side{fill:var(--worker-right);stroke:var(--worker-edge);stroke-width:.5}.shared-face{fill:var(--worker-left);stroke:var(--worker-edge);stroke-width:.6}.shared-top{fill:var(--worker-light);stroke:var(--worker-edge);stroke-width:.65}.shared-glyph{stroke:var(--worker-right);stroke-width:1}
.shared-body{animation:shared-gather var(--cycle) ease-in-out infinite}
.shared-flash{fill:white;opacity:0;animation:shared-flash var(--cycle) ease-in-out infinite}
.shared-ripple{stroke:var(--signal);stroke-width:.8;opacity:0;transform-box:fill-box;transform-origin:center;animation:shared-ripple var(--cycle) ease-out infinite}
.cycle-legend{display:flex;gap:14px;justify-content:center;align-items:center;color:var(--muted);font-size:12px;letter-spacing:.03em;padding-top:4px}
.cycle-legend i{font-style:normal;opacity:.4}.cycle-legend span{animation-duration:var(--cycle);animation-iteration-count:infinite;animation-timing-function:ease-in-out}
.phase-compute{animation-name:phase-compute}.phase-sync{animation-name:phase-sync}.phase-update{animation-name:phase-update}
.cluster-stage .cluster-note{text-align:center;margin-top:12px;font-size:10px;opacity:.7}
[data-theme="dark"] .cluster-stage{--worker-light:#e3ecd3;--worker-shade:#9fb684;--worker-left:#6f825c;--worker-right:#344936;--worker-edge:#9db58b;--worker-floor:#657c50;background:radial-gradient(ellipse at 50% 40%,#293c30,#17261f);border-color:#3c5139;box-shadow:inset 0 1px 0 #aac18f22}
[data-theme="dark"] .cluster-motion-toggle{background:#2d402c;border-color:#7c966166}
[data-theme="dark"] .worker-shadow,[data-theme="dark"] .shared-shadow{fill:#061409;opacity:.35}
@keyframes orbit-travel{to{stroke-dashoffset:-1000}}
@keyframes orbit-unify{0%,76%,95%,100%{opacity:0}84%{opacity:.6}89%{opacity:.1}}
@keyframes exchange-in{0%,46%{opacity:0;stroke-dashoffset:200}48%{opacity:1;stroke-dashoffset:200}64%{opacity:1;stroke-dashoffset:0}66%,100%{opacity:0;stroke-dashoffset:0}}
@keyframes exchange-out{0%,76%{opacity:0;stroke-dashoffset:0}78%{opacity:1;stroke-dashoffset:0}92%{opacity:1;stroke-dashoffset:200}94%,100%{opacity:0;stroke-dashoffset:200}}
@keyframes shared-gather{0%,58%,100%{translate:0 0}68%,78%{translate:0 -6px}86%{translate:0 0}}
@keyframes shared-flash{0%,60%,83%,100%{opacity:0}68%{opacity:.8}76%{opacity:.15}}
@keyframes shared-ripple{0%,65%,100%{opacity:0;scale:.8}70%{opacity:.55;scale:1}85%{opacity:0;scale:3}}
@keyframes shadow-breathe{0%,100%{opacity:.2}60%{opacity:.14}}
@keyframes phase-compute{0%,42%{color:var(--ink);opacity:1}48%,95%{opacity:.4}100%{opacity:1}}
@keyframes phase-sync{0%,42%,80%,100%{opacity:.4}48%,74%{color:var(--ink);opacity:1}}
@keyframes phase-update{0%,74%,100%{opacity:.4}80%,95%{color:var(--ink);opacity:1}}
.worker-0 .worker-body{animation-name:worker-lift-0}.worker-0 :is(.worker-activation,.compute-cell,.worker-indicator){animation-name:worker-light-0}
@keyframes worker-lift-0{0%,3%,15%,76%,100%{translate:0 0}8%{translate:0 -4px}84%{translate:0 -3px}}
@keyframes worker-light-0{0%,3%,16%,76%,96%,100%{opacity:.08}8%{opacity:.85}11%{opacity:.24}84%{opacity:.7}}
.worker-1 .worker-body{animation-name:worker-lift-1}.worker-1 :is(.worker-activation,.compute-cell,.worker-indicator){animation-name:worker-light-1}
@keyframes worker-lift-1{0%,10%,22%,76%,100%{translate:0 0}15%{translate:0 -4px}84%{translate:0 -3px}}
@keyframes worker-light-1{0%,10%,23%,76%,96%,100%{opacity:.08}15%{opacity:.85}18%{opacity:.24}84%{opacity:.7}}
.worker-2 .worker-body{animation-name:worker-lift-2}.worker-2 :is(.worker-activation,.compute-cell,.worker-indicator){animation-name:worker-light-2}
@keyframes worker-lift-2{0%,17%,29%,76%,100%{translate:0 0}22%{translate:0 -4px}84%{translate:0 -3px}}
@keyframes worker-light-2{0%,17%,30%,76%,96%,100%{opacity:.08}22%{opacity:.85}25%{opacity:.24}84%{opacity:.7}}
.worker-3 .worker-body{animation-name:worker-lift-3}.worker-3 :is(.worker-activation,.compute-cell,.worker-indicator){animation-name:worker-light-3}
@keyframes worker-lift-3{0%,24%,36%,76%,100%{translate:0 0}29%{translate:0 -4px}84%{translate:0 -3px}}
@keyframes worker-light-3{0%,24%,37%,76%,96%,100%{opacity:.08}29%{opacity:.85}32%{opacity:.24}84%{opacity:.7}}
.worker-4 .worker-body{animation-name:worker-lift-4}.worker-4 :is(.worker-activation,.compute-cell,.worker-indicator){animation-name:worker-light-4}
@keyframes worker-lift-4{0%,31%,43%,76%,100%{translate:0 0}36%{translate:0 -4px}84%{translate:0 -3px}}
@keyframes worker-light-4{0%,31%,44%,76%,96%,100%{opacity:.08}36%{opacity:.85}39%{opacity:.24}84%{opacity:.7}}
/* Each step shows its own operation, using the same transparent hardware vocabulary. */
.training-cycle{--worker-light:#f5f9ed;--worker-shade:#b8cda3;--worker-left:#8ca875;--worker-right:#526f43;--worker-edge:#8fa47d;--signal:#fff}
.step-art{height:210px;margin-bottom:22px;border-radius:12px;background:radial-gradient(ellipse at 50% 30%,#f4f7ec,#e1eada);border:1px solid #9fb78a33;overflow:hidden}
.step-art svg{width:100%;height:100%;display:block}
.step-ground{fill:#3d5a31;opacity:.12;filter:blur(2px)}
.scene-label{fill:var(--muted);font-size:10px;letter-spacing:.025em;font-family:inherit}
.step-route{stroke:var(--worker-edge);stroke-width:1;opacity:.35;fill:none}
.prepare-route,.calculate-input,.calculate-output,.synchronize-flow,.update-flow{stroke:var(--signal);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:8 92;opacity:0;animation-duration:8s;animation-timing-function:linear;animation-iteration-count:infinite;animation-delay:var(--flow-delay,0s);filter:drop-shadow(0 0 2px #ffffff90)}
.prepare-route{animation-name:prepare-route}
.batch-tile{fill:var(--worker-left);stroke:var(--worker-edge);stroke-width:.65}.batch-tile-side{fill:var(--worker-right);stroke:var(--worker-edge);stroke-width:.5}
.source-token{fill:var(--worker-light);stroke:var(--worker-edge);stroke-width:.5}.source-token:nth-child(3n){fill:var(--worker-shade)}
.batch-token{fill:#e5efd7;stroke:var(--worker-right);stroke-width:.4;animation:batch-receive 8s ease-in-out infinite;animation-delay:var(--cell-delay)}
.packet-top{fill:#fbfff4;stroke:var(--worker-edge);stroke-width:.5}.packet-side{fill:var(--worker-left);stroke:var(--worker-edge);stroke-width:.4}
.moving-batch{opacity:0;animation:batch-split 8s ease-in-out infinite;animation-delay:var(--batch-delay)}
.calculate-input{animation-name:calculate-input}.calculate-output{animation-name:calculate-output}
.calculate-mac .compute-cell{animation:calculate-cores 8s ease-in-out infinite;animation-delay:var(--core-delay,0s)}
.calculate-mac .cell-1{--core-delay:.25s}.calculate-mac .cell-2{--core-delay:.5s}.calculate-mac .cell-3{--core-delay:.75s}
.calculate-mac .worker-activation{animation:calculate-outline 8s ease-in-out infinite}
.loss-disc{fill:var(--worker-left);stroke:var(--worker-edge);stroke-width:.8;animation:result-reveal 8s ease-in-out infinite}
.loss-mark{stroke:var(--worker-light);stroke-width:1.5;stroke-linecap:round;animation:result-reveal 8s ease-in-out infinite}
.gradient-cell{fill:var(--worker-shade);stroke:var(--worker-right);stroke-width:.4;animation:gradient-reveal 8s ease-in-out infinite;animation-delay:var(--cell-delay)}
.synchronize-flow{animation-name:synchronize-flow}
.sync-mac .compute-cell{opacity:.55;animation:none}
.combined-cell{fill:var(--worker-light);stroke:var(--worker-right);stroke-width:.4;animation:combine-tensor 8s ease-in-out infinite;animation-delay:var(--cell-delay)}
.tensor-halo{stroke:var(--signal);stroke-width:1;opacity:0;transform-origin:180px 93px;animation:combine-halo 8s ease-out infinite}
.update-flow{animation-name:update-flow}
.update-cell{fill:var(--worker-light);stroke:var(--worker-right);stroke-width:.4;animation:update-source 8s ease-in-out infinite}
.update-mac .compute-cell{animation:replica-update 8s ease-in-out infinite;animation-delay:0s}
.update-mac .worker-activation{animation:replica-update 8s ease-in-out infinite;animation-delay:0s}
[data-theme="dark"] .training-cycle{--worker-light:#e3ecd3;--worker-shade:#9fb684;--worker-left:#6f825c;--worker-right:#344936;--worker-edge:#9db58b}
[data-theme="dark"] .step-art{background:radial-gradient(ellipse at 50% 30%,#2c4033,#192a21);border-color:#78946433}
[data-theme="dark"] .step-ground{fill:#07180b;opacity:.3}
@keyframes batch-split{0%,8%{translate:0 0;opacity:0}15%{translate:0 0;opacity:1}56%{translate:var(--batch-x) var(--batch-y);opacity:1}62%,100%{translate:var(--batch-x) var(--batch-y);opacity:0}}
@keyframes prepare-route{0%,10%{stroke-dashoffset:100;opacity:0}16%{stroke-dashoffset:100;opacity:.8}56%{stroke-dashoffset:0;opacity:.8}62%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes batch-receive{0%,50%,92%,100%{fill:#b7cc9e}62%,78%{fill:#f6ffed}}
@keyframes calculate-input{0%,8%{stroke-dashoffset:100;opacity:0}12%{stroke-dashoffset:100;opacity:1}28%{stroke-dashoffset:0;opacity:1}32%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes calculate-cores{0%,25%,68%,100%{opacity:.15}34%,42%,50%{opacity:1}38%,46%,54%{opacity:.3}}
@keyframes calculate-outline{0%,22%,68%,100%{opacity:0}36%,50%{opacity:.6}}
@keyframes calculate-output{0%,58%{stroke-dashoffset:100;opacity:0}62%{stroke-dashoffset:100;opacity:1}78%{stroke-dashoffset:0;opacity:1}84%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes result-reveal{0%,60%,100%{opacity:.25}76%,90%{opacity:1}}
@keyframes gradient-reveal{0%,60%,100%{fill:#72945c}76%,90%{fill:#f0fbe3}}
@keyframes synchronize-flow{0%,14%{stroke-dashoffset:100;opacity:0}20%{stroke-dashoffset:100;opacity:1}58%{stroke-dashoffset:0;opacity:1}64%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes combine-tensor{0%,55%,100%{fill:#86a471}68%,88%{fill:#f4ffe8}}
@keyframes combine-halo{0%,61%,100%{opacity:0;scale:.8}68%{opacity:.6;scale:1}85%{opacity:0;scale:1.8}}
@keyframes update-source{0%,9%,100%{fill:#9db78a}18%,80%{fill:#f4ffe8}}
@keyframes update-flow{0%,18%{stroke-dashoffset:100;opacity:0}23%{stroke-dashoffset:100;opacity:1}56%{stroke-dashoffset:0;opacity:1}61%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes replica-update{0%,50%,95%,100%{opacity:.15}62%,76%{opacity:.9}}

.visual-motion,.icon-motion{animation-play-state:paused}
.is-moving .visual-motion,.is-moving .icon-motion{animation-play-state:running}
@media(max-width:700px){.cluster-stage{padding:22px 16px}.cluster-stage .distributed-network{aspect-ratio:720/440;max-height:none}.cluster-stage-top{gap:12px;flex-wrap:nowrap}.cluster-stage-top .eyebrow{font-size:10px}.cluster-stage .cluster-note{font-size:9px}.cycle-legend{gap:10px;font-size:10px}.training-cycle{grid-template-columns:1fr}.step-art{height:auto;aspect-ratio:360/200;margin-bottom:18px}.release-intro h1{font-size:clamp(31px,7vw,47px)}}
@media(prefers-reduced-motion:reduce){.visual-motion,.icon-motion{animation:none!important}.cluster-motion-toggle{display:none}.cycle-legend span{opacity:1}}

/* Clear rounded enclosures reveal the board, silicon, memory and cooling hardware. */
.mac-base{fill:var(--worker-right);stroke:var(--worker-edge);stroke-width:.7;opacity:.7}
.mac-left-glass{fill:#e6f4de18;stroke:var(--worker-edge);stroke-width:.7}
.mac-right-glass{fill:#c1d6ad12;stroke:var(--worker-edge);stroke-width:.7}
.mac-board{fill:#668651;stroke:#acc49a;stroke-width:.6}.mac-board-side{fill:#3d5733;stroke:#91ad7a;stroke-width:.4}
.board-trace{stroke:#adcd92;stroke-width:.5;opacity:.75}.board-pad{fill:#dceabe}
.board-activity{stroke:white;stroke-width:.9;stroke-dasharray:3 12;opacity:.3;animation:board-current 1.8s linear infinite;filter:drop-shadow(0 0 1px white)}
.memory-package{fill:#334832;stroke:#adbb91;stroke-width:.4}.memory-side{fill:#172b20}
.component-pin{stroke:#d7e2c2;stroke-width:.55}.board-capacitor{fill:#d6dfba;stroke:#5a7747;stroke-width:.3}
.chip-package-side{fill:#263d2a;stroke:#c4d6af;stroke-width:.4}.chip-package{fill:#8fa778;stroke:#dce9c7;stroke-width:.6}
.chip-die{fill:#233b2d;stroke:#bfd3aa;stroke-width:.4}.chip-pin{stroke:#dce6c3;stroke-width:.6}
.fan-housing{fill:#3c5140;stroke:#c2d0b6;stroke-width:.5}.fan-inner{fill:#182a23;stroke:#708a66;stroke-width:.5}.fan-blade{stroke:#91aa80;stroke-width:.7}.fan-hub{fill:#c3d2b4}
.mac-lid{fill:#e8f5dc16;stroke:#dceace;stroke-width:.8}.mac-rim{stroke:#eff8e5;stroke-width:.75;opacity:.8}
.mac-reflection{fill:#f8fff218;stroke:none}.front-port,.front-slot{fill:#193024;stroke:#b8c8a5;stroke-width:.4}.mac-vent{stroke:#a5b798;stroke-width:.65;opacity:.75}
[data-theme="light"] .mac-left-glass{fill:#bdd4a92c}[data-theme="light"] .mac-right-glass{fill:#acc59935}[data-theme="light"] .mac-lid{fill:#efffe922;stroke:#617d52}[data-theme="light"] .mac-rim{stroke:#668057}
@keyframes board-current{to{stroke-dashoffset:-30}}

.cluster-stage .icon-motion,.cluster-stage .visual-motion{animation-play-state:paused}.cluster-stage.is-moving .icon-motion,.cluster-stage.is-moving .visual-motion{animation-play-state:running}
@media(prefers-reduced-motion:reduce){.cluster-stage .icon-motion,.cluster-stage .visual-motion{animation:none!important}}

.fan-rotor{transform-origin:0 0;animation:fan-spin 3s linear infinite;animation-play-state:paused}
.is-moving .fan-rotor{animation-play-state:running}
@keyframes fan-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.fan-rotor{animation:none!important}}

.step-art .icon-motion,.step-art .visual-motion{animation-play-state:paused}
.step-art.is-moving .icon-motion,.step-art.is-moving .visual-motion{animation-play-state:running}
@media(prefers-reduced-motion:reduce){.step-art .icon-motion,.step-art .visual-motion{animation:none!important}.moving-batch,.prepare-route,.calculate-input,.calculate-output,.synchronize-flow,.update-flow{opacity:0}.step-art .compute-cell{opacity:.6}.loss-disc,.loss-mark{opacity:1}}
