/* Architecture showcase — the "Powered by Aegis Stack" 3D assembly.
   Everything is scoped under .aegis-assembly and keyframes are asm-*
   prefixed so none of these generic class names (.node, .core, .box,
   .slab, .beam, .ring …) collide with DaisyUI or other pages. */

.aegis-assembly {
  --teal: #17CCBF;
  --teal-hi: #5BF6EC;
  --amber: #F59E0B;
  --border: #272C36;
}

/* Two-column layout (stage | HUD). Owned here rather than via Tailwind
   col-span utilities so the split is robust regardless of the precompiled
   JIT build (where col-span-8/4 weren't resolving). ~8:4 = 2fr:1fr. */
.aegis-assembly .asm-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) {
  .aegis-assembly .asm-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
}

/* ----- 3D STAGE ---------------------------------------------------- */
.aegis-assembly .stage { perspective: 1500px; perspective-origin: 50% 50%; cursor: grab; touch-action: pan-y; user-select: none; }  /* pan-y lets the page scroll past on touch; horizontal drag still spins */
/* fullscreen player (/architecture/stage): full-bleed black - no card
   chrome (border/rounding), stage takes the whole viewport height, and
   the boot rail sits flush right at a fixed width so the scene gets
   every remaining pixel. Two-class selectors outrank the Tailwind
   utilities on the divs. */
.aegis-assembly--max > div { border: 0; border-radius: 0; background: transparent; }
.aegis-assembly--max .stage { height: 100vh; min-height: 480px; }
@media (min-width: 1024px) {
  .aegis-assembly--max .asm-grid { grid-template-columns: minmax(0, 1fr) 460px; }
}
.aegis-assembly .stage.grabbing { cursor: grabbing; }

/* zoom layers: macro ring warps past the camera, sub-world warps in */
.aegis-assembly .macro {
  position: absolute; inset: 0;
  transition: transform .7s cubic-bezier(.6,0,.18,1), opacity .55s ease, filter .55s ease;
}
.aegis-assembly .macro.is-zoomed { transform: scale(2.7); opacity: 0; filter: blur(9px); pointer-events: none; }

.aegis-assembly .subworld {
  position: absolute; inset: 0;
  opacity: 0; transform: scale(calc(.78 * var(--fit, 1))); pointer-events: none;
  transition: transform .7s cubic-bezier(.2,.7,.2,1), opacity .5s ease;
}
.aegis-assembly .subworld.is-active { opacity: 1; transform: scale(var(--fit, 1)); pointer-events: auto; }

/* rotation driven from JS (drag + inertia + idle drift) — no CSS keyframe */
.aegis-assembly .world { position: absolute; inset: 0; transform-style: preserve-3d; }

.aegis-assembly .floor {
  position: absolute; left: 50%; top: 50%;
  width: 1800px; height: 1800px; margin-left: -900px; margin-top: -900px;
  transform: translateY(170px) rotateX(84deg);
  background-image:
    linear-gradient(to right, rgba(39,44,54,.6) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(39,44,54,.6) 1px, transparent 1px);
  background-size: 70px 70px;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0%, #000 26%, transparent 58%);
  mask-image: radial-gradient(circle at 50% 50%, #000 0%, #000 26%, transparent 58%);
  opacity: .85;
}
.aegis-assembly .floor::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 50%, rgba(23,204,191,calc(.22 * var(--pwr,0))) 0%, transparent 36%);
  transition: background .8s ease;
}

/* ----- CORE REACTOR ----------------------------------------------- */
/* Decorations never intercept clicks — the big ring boxes (transparent
   centers, still hit-testable) would otherwise swallow the far nodes'
   clicks. Only .node is interactive. */
.aegis-assembly .floor,
.aegis-assembly .core-wrap,
.aegis-assembly .ring,
.aegis-assembly .shock { pointer-events: none; }
.aegis-assembly .core-wrap { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); transform-style: preserve-3d; }
.aegis-assembly .ring { position: absolute; left: 50%; top: 50%; border-radius: 50%; transform: translate(-50%,-50%); }
.aegis-assembly .ring--mid   { width: 216px; height: 216px; border: 1px solid rgba(23,204,191,calc(.10 + .30 * var(--pwr,0))); box-shadow: 0 0 calc(40px * var(--pwr,0)) rgba(23,204,191,.25) inset; animation: asm-spin 80s linear infinite reverse; }
@keyframes asm-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }

.aegis-assembly .core {
  position: relative; width: 100px; height: 100px; border-radius: 26px;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 38% 30%, #1a2026, #0c1014);
  border: 1px solid rgba(23,204,191,calc(.25 + .5 * var(--pwr,0)));
  box-shadow: 0 0 0 1px rgba(0,0,0,.4), 0 24px 40px rgba(0,0,0,.55),
    0 0 calc(20px + 90px * var(--pwr,0)) rgba(23,204,191,calc(.15 + .45 * var(--pwr,0)));
  transition: box-shadow .8s ease, border-color .8s ease, transform .8s ease;
  transform: scale(calc(.9 + .1 * var(--pwr,0)));
}
.aegis-assembly .core__chip {
  width: 54px; height: 54px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(150deg, var(--teal-hi), var(--teal) 45%, #0c8e85);
  box-shadow: 0 0 26px rgba(23,204,191,calc(.4 + .5 * var(--pwr,0)));
  opacity: calc(.55 + .45 * var(--pwr,0)); transition: opacity .8s ease, box-shadow .8s ease;
}
.aegis-assembly .core__chip svg { width: 28px; height: 28px; color: #04110f; }
/* shield absorbs the charge when a bolt lands (fires with the shock ring) */
.aegis-assembly .core__chip.is-absorb { animation: asm-absorb .55s ease-out; }
@keyframes asm-absorb {
  0%   { transform: scale(1); filter: none; }
  28%  { transform: scale(1.14); filter: brightness(1.7) drop-shadow(0 0 18px rgba(91,246,236,.95)); }
  100% { transform: scale(1); filter: none; }
}

.aegis-assembly .shock { position: absolute; left: 50%; top: 50%; width: 100px; height: 100px; margin: -50px 0 0 -50px; border-radius: 50%; border: 1.5px solid rgba(23,204,191,.6); opacity: 0; }
.aegis-assembly .shock.go { animation: asm-shock .9s ease-out; }
@keyframes asm-shock { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(4.2); opacity: 0; } }

/* ----- 3D ENERGY CONDUITS (macro beams) --------------------------- */
.aegis-assembly .beam {
  position: absolute; left: 50%; top: 50%; height: 2px; transform-origin: 0 50%;
  background: linear-gradient(90deg, rgba(23,204,191,.95) 0%, rgba(23,204,191,.5) 55%, rgba(23,204,191,0) 100%);
  box-shadow: 0 0 8px rgba(23,204,191,.7); opacity: 0; transition: opacity .5s ease; pointer-events: none;
}
.aegis-assembly .beam::after { content: ""; position: absolute; top: -1px; left: 0; width: 26px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, transparent, var(--teal-hi), transparent); animation: asm-packet 1.4s linear infinite; }
.aegis-assembly .beam.is-live { opacity: .9; }
@keyframes asm-packet { 0% { left: 0; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { left: calc(100% - 26px); opacity: 0; } }

/* One-shot lightning bolt fired the instant a component locks. A flat 2D
   overlay (paths in stage-pixel coords) so the jagged strike reads crisply
   regardless of the 3D scene. */
.aegis-assembly .boltlayer { position: absolute; inset: 0; z-index: 25; pointer-events: none; overflow: visible; }
.aegis-assembly .bolt {
  fill: none; stroke: #e6fffb; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(91,246,236,.95)) drop-shadow(0 0 13px rgba(23,204,191,.75));
  animation: asm-bolt .5s ease-out forwards;
}
@keyframes asm-bolt {
  0%   { opacity: 0; }
  8%   { opacity: 1; stroke-width: 3.5; }
  20%  { opacity: .25; }
  32%  { opacity: 1; stroke-width: 2.2; }
  55%  { opacity: .8; }
  100% { opacity: 0; stroke-width: 1.2; }
}

/* ----- SLABS (shared by macro + sub-worlds) ----------------------- */
.aegis-assembly .node { position: absolute; left: 50%; top: 50%; width: 156px; transform-style: preserve-3d; transition: transform .85s cubic-bezier(.16,1.04,.3,1), opacity .5s ease; will-change: transform, opacity; }
.aegis-assembly .node--svc { width: 128px; }   /* services are compact plug modules */
.aegis-assembly .node--clickable { cursor: pointer; }
/* billboard: cancels the world's spin so card faces stay readable
   (text never mirrors) while their positions still orbit in 3D. */
.aegis-assembly .billboard { transform-style: preserve-3d; transform: rotateY(var(--brY, 0deg)) rotateX(var(--brX, 0deg)); }
.aegis-assembly .node__float { transform-style: preserve-3d; animation: asm-float 6s ease-in-out infinite; }
@keyframes asm-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.aegis-assembly .box { position: relative; transform-style: preserve-3d; }

.aegis-assembly .slab {
  position: relative; border-radius: 13px; padding: 11px 13px 13px; transform: translateZ(16px);
  background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%);
  border: 1px solid var(--border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 22px rgba(0,0,0,.5);
  transition: border-color .3s ease, box-shadow .35s ease, background .3s ease, transform .22s ease;
}
.aegis-assembly .slab::before { content: ""; position: absolute; inset: 0; border-radius: 13px; background: linear-gradient(157deg, rgba(255,255,255,.07), transparent 45%); pointer-events: none; }
/* electricity flowing through a card while it descends + links; clears the
   moment it goes online (the charge has dispersed into the shield). */
.aegis-assembly .charge { position: absolute; inset: 0; border-radius: 13px; pointer-events: none; opacity: 0; z-index: 1; }
.aegis-assembly .node.is-incoming .charge,
.aegis-assembly .node.is-booting .charge { opacity: 1; }
.aegis-assembly .charge::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(115deg, transparent 40%, rgba(91,246,236,.5) 49%, rgba(224,255,253,.92) 51%, rgba(91,246,236,.5) 53%, transparent 62%); background-size: 260% 100%; animation: asm-charge 2.7s linear infinite; }
.aegis-assembly .charge::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 10px rgba(91,246,236,.45), 0 0 16px rgba(91,246,236,.45); animation: asm-flick 2.4s ease-in-out infinite; }
@keyframes asm-charge { 0% { background-position: 130% 0; } 100% { background-position: -130% 0; } }
@keyframes asm-flick { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
/* Hover highlight is applied to the real 3D card (driven by the flat
   hit-plate via JS ``hoverId``) so the glow hugs the perspective-tilted
   slab exactly, instead of a flat box around its bounding rect. */
.aegis-assembly .node.is-hover .slab { border-color: #5BF6EC; background: linear-gradient(157deg, #163029 0%, #0c1a16 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 18px 30px rgba(0,0,0,.55), 0 0 46px rgba(23,204,191,.7); transform: translateZ(30px) scale(1.05); }

.aegis-assembly .node.is-incoming .slab { border-color: rgba(239,68,68,.7); background: linear-gradient(157deg, #2a1414 0%, #160a0a 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 22px rgba(0,0,0,.5), 0 0 30px rgba(239,68,68,.4); }
.aegis-assembly .node.is-booting .slab { border-color: rgba(245,158,11,.65); background: linear-gradient(157deg, #2a2114 0%, #16100a 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 22px rgba(0,0,0,.5), 0 0 28px rgba(245,158,11,.32); }
.aegis-assembly .node.is-online .slab { border-color: rgba(23,204,191,.65); background: linear-gradient(157deg, #122421 0%, #0a1513 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 24px rgba(0,0,0,.5), 0 0 30px rgba(23,204,191,.32); }

.aegis-assembly .pill { font: 700 7px/1 ui-monospace, monospace; letter-spacing: .22em; padding: 3px 6px; border-radius: 999px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.06); }

/* Service differentiator: a connector "plug" tab on top. */
.aegis-assembly .plug { position: absolute; left: 50%; top: -9px; width: 38px; height: 10px; transform: translateX(-50%) translateZ(16px); pointer-events: none; }
.aegis-assembly .plug::before { content: ""; position: absolute; inset: 0 9px; border: 1px solid rgba(23,204,191,.45); border-bottom: 0; border-radius: 5px 5px 0 0; background: linear-gradient(#11201e, #0a1411); }
.aegis-assembly .plug::after  { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 20px; height: 2px; background: rgba(23,204,191,.7); box-shadow: 0 0 7px rgba(23,204,191,.6); }
.aegis-assembly .icon { display: block; width: 100%; height: 100%; }

/* Flat 2D hit-plates (reliable clicks, glued to the moving 3D cards). */
.aegis-assembly .hitlayer { position: absolute; inset: 0; z-index: 30; pointer-events: none; }
.aegis-assembly .hitplate { position: absolute; pointer-events: auto; cursor: pointer; background: transparent; border: 0; }

/* ----- SUB-WORLD pipeline ----------------------------------------- */
.aegis-assembly .swstage { perspective: 1500px; perspective-origin: 50% 42%; }
.aegis-assembly .swscene { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateX(6deg) rotateY(-3deg) scale(1.08); }
.aegis-assembly .colhead { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); white-space: nowrap; }

.aegis-assembly .snode { position: absolute; left: 50%; top: 50%; width: 184px; transform-style: preserve-3d; }
.aegis-assembly .scard {
  position: relative; border-radius: 12px; padding: 12px 14px 13px; transform: translateZ(10px);
  background: linear-gradient(157deg, #161d26 0%, #0c1014 100%);
  border: 1px solid var(--border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 18px rgba(0,0,0,.5);
  /* a brightness pulse cascades column-by-column (delay set per column in
     the template) so the flow reads like a live request passing through. */
  animation: asm-sweep 4.4s ease-in-out infinite;
  animation-delay: var(--sweep, 0s);
}
@keyframes asm-sweep {
  0%, 80%, 100% { filter: brightness(1); }
  88%           { filter: brightness(1.4) saturate(1.15); }
}
.aegis-assembly .scard--teal { border-color: rgba(23,204,191,.55); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 18px rgba(0,0,0,.5), 0 0 22px rgba(23,204,191,.22); }
.aegis-assembly .scard--hub  { border-color: rgba(91,246,236,.5); background: linear-gradient(157deg, #0e2a28 0%, #08110f 100%); box-shadow: 0 0 26px rgba(23,204,191,.3); }

.aegis-assembly .rail { position: absolute; top: 50%; height: 2px; transform: translateY(-50%); background: linear-gradient(90deg, rgba(23,204,191,.05), rgba(23,204,191,.5) 50%, rgba(23,204,191,.05)); box-shadow: 0 0 6px rgba(23,204,191,.4); }
.aegis-assembly .rail__dot { position: absolute; top: -2px; width: 6px; height: 6px; border-radius: 50%; background: var(--teal-hi); box-shadow: 0 0 8px var(--teal-hi); animation: asm-railflow linear infinite; }
@keyframes asm-railflow { from { left: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } to { left: 100%; opacity: 0; } }

/* ----- CLOCK world (Scheduler) ------------------------------------ */
.aegis-assembly .clock { position: relative; width: 470px; height: 470px; flex: none; border-radius: 50%; border: 1px solid rgba(23,204,191,.16); box-shadow: inset 0 0 90px rgba(23,204,191,.06); }
.aegis-assembly .clock__tick { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: rgba(126,138,154,.35); }
.aegis-assembly .clock__tick--major { width: 7px; height: 7px; background: rgba(23,204,191,.5); }
.aegis-assembly .clock__hour { position: absolute; font: 600 12px/1 ui-monospace, monospace; color: #687485; white-space: nowrap; }
.aegis-assembly .clock__job { position: absolute; width: 18px; height: 18px; border-radius: 50%; background: rgba(23,204,191,.25); border: 1px solid rgba(23,204,191,.55); animation: clock-fire var(--cycle, 16s) linear infinite; }
.aegis-assembly .clock__hand { position: absolute; left: 50%; bottom: 50%; width: 3px; height: 222px; transform-origin: 50% 100%; background: linear-gradient(to top, rgba(23,204,191,.95), rgba(23,204,191,0)); box-shadow: 0 0 12px rgba(23,204,191,.5); animation: clock-sweep var(--cycle, 16s) linear infinite; }
.aegis-assembly .clock__hand::after { content: ""; position: absolute; top: -5px; left: -4px; width: 11px; height: 11px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 12px #5BF6EC; }
.aegis-assembly .clock__hub { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-align: center; }
.aegis-assembly .clock__litdot { width: 12px; height: 12px; border-radius: 50%; flex: none; background: rgba(23,204,191,.3); border: 1px solid rgba(23,204,191,.5); animation: clock-litdot var(--cycle, 16s) linear infinite; }
@keyframes clock-sweep { from { transform: translateX(-50%) rotate(0deg); } to { transform: translateX(-50%) rotate(360deg); } }
@keyframes clock-fire {
  0%        { transform: translate(-50%,-50%) scale(1.7); background: #5BF6EC; box-shadow: 0 0 20px #5BF6EC; border-color: #5BF6EC; }
  9%        { transform: translate(-50%,-50%) scale(1); }
  18%, 100% { transform: translate(-50%,-50%) scale(1); background: rgba(23,204,191,.25); box-shadow: none; border-color: rgba(23,204,191,.55); }
}
@keyframes clock-litdot {
  0%        { transform: scale(1.7); background: #5BF6EC; box-shadow: 0 0 14px #5BF6EC; }
  9%        { transform: scale(1); }
  18%, 100% { transform: scale(1); background: rgba(23,204,191,.3); box-shadow: none; }
}

/* ----- CACHE world (Redis): live keyspace + role motifs ----------- */
.aegis-assembly .keyspace { display: grid; grid-template-columns: repeat(7, 58px); gap: 12px; }
.aegis-assembly .keychip { height: 38px; border-radius: 6px; background: rgba(23,204,191,.06); border: 1px solid rgba(23,204,191,.15); animation: cache-flash 5s ease-in-out infinite; }
.aegis-assembly .keychip--ttl { animation: cache-ttl 6s ease-in-out infinite; }
.aegis-assembly .cache-motif { width: 48px; flex: none; display: flex; align-items: center; justify-content: center; }
.aegis-assembly .m-ttl { width: 26px; height: 18px; border-radius: 4px; border: 1px solid rgba(23,204,191,.5); animation: cache-ttl 3.4s ease-in-out infinite; }
.aegis-assembly .m-rail { position: relative; width: 44px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, rgba(23,204,191,.08), rgba(23,204,191,.4), rgba(23,204,191,.08)); }
.aegis-assembly .m-dot { position: absolute; top: -2px; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 6px #5BF6EC; animation: asm-railflow 1.5s linear infinite; }
.aegis-assembly .m-fan { position: relative; width: 9px; height: 9px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 7px #5BF6EC; }
.aegis-assembly .m-fan::before, .aegis-assembly .m-fan::after { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 1px solid rgba(23,204,191,.6); animation: cache-ripple 2s ease-out infinite; }
.aegis-assembly .m-fan::after { animation-delay: 1s; }
@keyframes cache-flash {
  0%, 100% { background: rgba(23,204,191,.06); border-color: rgba(23,204,191,.15); box-shadow: none; }
  6%       { background: rgba(91,246,236,.5); border-color: #5BF6EC; box-shadow: 0 0 10px rgba(23,204,191,.45); }
  16%      { background: rgba(23,204,191,.12); border-color: rgba(23,204,191,.28); box-shadow: none; }
}
@keyframes cache-ttl {
  0%   { opacity: 1; background: rgba(91,246,236,.5); border-color: #5BF6EC; }
  60%  { opacity: 1; background: rgba(23,204,191,.18); border-color: rgba(23,204,191,.3); }
  82%  { opacity: .06; }
  100% { opacity: 1; background: rgba(91,246,236,.5); border-color: #5BF6EC; }
}
@keyframes cache-ripple { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(3.4); opacity: 0; } }

/* ----- API world: request pipeline + lifecycle boot rail ---------- */
.aegis-assembly .apiconn { color: rgba(23,204,191,.4); font: 700 13px/1 ui-monospace, monospace; }
.aegis-assembly .apigate,
.aegis-assembly .apinode,
.aegis-assembly .apigroup,
.aegis-assembly .apihook,
.aegis-assembly .apihealthy {
  border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.04); border-radius: 8px;
  animation: api-pulse 3.6s ease-in-out infinite; animation-delay: var(--d, 0s);
}
.aegis-assembly .apigate { padding: 8px 11px; font: 600 12px/1 ui-monospace, monospace; color: #cdd6e0; }
.aegis-assembly .apinode { padding: 10px 15px; font: 700 12px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .apinode--router { border-color: rgba(91,246,236,.5); }
.aegis-assembly .apinode--end { color: #7E8A9A; }
.aegis-assembly .apigroup { padding: 5px 10px; font: 500 12px/1 ui-monospace, monospace; color: #9aa5b2; }
.aegis-assembly .apihook { padding: 7px 11px; font: 500 12px/1 ui-monospace, monospace; color: #9aa5b2; animation-duration: 6s; }
.aegis-assembly .apihealthy { padding: 7px 13px; font: 700 12px/1 ui-monospace, monospace; color: #17CCBF; border-color: rgba(23,204,191,.4); animation-duration: 6s; }
.aegis-assembly .api-spark { display: inline-flex; align-items: flex-end; gap: 3px; height: 28px; }
.aegis-assembly .api-spark span { width: 5px; border-radius: 2px; background: rgba(23,204,191,.5); animation: api-bar 1.6s ease-in-out infinite; }
@keyframes api-pulse {
  0%, 72%, 100% { border-color: rgba(23,204,191,.25); background: rgba(23,204,191,.04); box-shadow: none; }
  10%           { border-color: #5BF6EC; background: rgba(23,204,191,.16); box-shadow: 0 0 14px rgba(23,204,191,.45); }
}
@keyframes api-bar { 0%, 100% { height: 28%; } 50% { height: 95%; } }

/* ----- HOST world (API Server): FastAPI host + mounts ------------- */
.aegis-assembly .host { display: flex; align-items: center; justify-content: center; gap: 10px; transform: scale(1.4); }
.aegis-assembly .host-col { display: flex; flex-direction: column; gap: 7px; }
.aegis-assembly .host-lbl { font: 600 9px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .16em; color: #5a6573; text-align: center; margin-bottom: 5px; }
.aegis-assembly .host-mw { width: 142px; text-align: center; padding: 8px 10px; border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.04); border-radius: 7px; font: 600 11px/1 ui-monospace, monospace; color: #cdd6e0; animation: api-pulse 3.2s ease-in-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .host-arrow { align-self: center; color: rgba(23,204,191,.4); font: 700 16px/1 ui-monospace, monospace; }
.aegis-assembly .host-appcol { display: flex; flex-direction: column; align-items: center; gap: 11px; }
.aegis-assembly .host-app { width: 152px; text-align: center; padding: 16px 14px; border: 1px solid rgba(91,246,236,.55); border-radius: 13px; background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); box-shadow: 0 0 34px rgba(23,204,191,.2); font: 800 16px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .host-app span { display: block; font: 500 9px/1 ui-monospace, monospace; color: #9aa5b2; margin-top: 5px; }
.aegis-assembly .host-life { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; max-width: 178px; }
.aegis-assembly .host-life__lbl { width: 100%; text-align: center; font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .15em; color: #5a6573; margin-bottom: 2px; }
.aegis-assembly .host-hook { font: 500 9px/1 ui-monospace, monospace; color: #9aa5b2; border: 1px solid rgba(126,138,154,.3); border-radius: 5px; padding: 4px 7px; }
.aegis-assembly .host-hook--ok { color: #17CCBF; border-color: rgba(23,204,191,.4); }
.aegis-assembly .host-mount { width: 204px; padding: 9px 13px; border: 1px solid rgba(126,138,154,.25); border-radius: 9px; background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); }
.aegis-assembly .host-mount.is-flet { border-color: rgba(23,204,191,.5); box-shadow: 0 0 18px rgba(23,204,191,.15); }
.aegis-assembly .host-mount__name { font: 700 12px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .host-mount__sub { font: 500 9px/1.3 ui-monospace, monospace; color: #687485; margin-top: 4px; }
.aegis-assembly .host-mount.is-flet .host-mount__sub { color: #b6f3ee; }

/* ----- TRACE world (Observability): span waterfall ---------------- */
.aegis-assembly .trace__row { display: grid; grid-template-columns: 200px 1fr; align-items: center; height: 30px; }
.aegis-assembly .trace__name { font: 600 12px/1 ui-monospace, monospace; color: #8b96a4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 12px; }
.aegis-assembly .trace__name--root { color: #fff; }
.aegis-assembly .trace__track { position: relative; height: 14px; }
.aegis-assembly .trace__span { position: absolute; top: 0; height: 14px; border-radius: 3px; background: rgba(23,204,191,.16); border: 1px solid rgba(23,204,191,.28); animation: trace-flash var(--cycle, 4s) linear infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .trace__span--root { background: rgba(23,204,191,.08); border-color: rgba(23,204,191,.2); }
@keyframes trace-flash {
  0%        { background: rgba(91,246,236,.5); border-color: #5BF6EC; box-shadow: 0 0 12px rgba(23,204,191,.5); }
  12%       { box-shadow: none; }
  24%, 100% { background: rgba(23,204,191,.16); border-color: rgba(23,204,191,.28); box-shadow: none; }
}

/* ----- ER world (Database): tables + relationship lines ----------- */
.aegis-assembly .er { position: relative; width: 720px; height: 440px; transform: scale(1.18); }
.aegis-assembly .er-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .er-line { stroke: rgba(23,204,191,.35); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }
@keyframes er-flow { to { stroke-dashoffset: -24; } }
.aegis-assembly .er-table { position: absolute; width: 150px; transform: translate(-50%,-50%); z-index: 1; background: linear-gradient(157deg, #161d26 0%, #0c1014 100%); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 20px rgba(0,0,0,.5); overflow: hidden; }
.aegis-assembly .er-table__head { padding: 7px 11px; font: 700 12px/1 ui-monospace, monospace; color: #fff; background: rgba(23,204,191,.1); border-bottom: 1px solid rgba(23,204,191,.2); }
.aegis-assembly .er-table__col { padding: 5px 11px; font: 500 11px/1.3 ui-monospace, monospace; color: #8b96a4; border-top: 1px solid rgba(39,44,54,.4); }
.aegis-assembly .er-table__col--key { color: #5BF6EC; }

/* ----- LOOP world (Payments): billing cycle ----------------------- */
.aegis-assembly .loop { position: relative; width: 500px; height: 500px; }
.aegis-assembly .loop-ring { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.aegis-assembly .loop-ring circle { fill: none; stroke: rgba(23,204,191,.3); stroke-width: 1.5; stroke-dasharray: 6 8; animation: er-flow 1.4s linear infinite; }
.aegis-assembly .loop-orbit { position: absolute; left: 50%; top: 50%; width: 0; height: 0; animation: loop-orbit var(--cycle, 8s) linear infinite; }
.aegis-assembly .loop-packet { position: absolute; left: -7px; top: -175px; width: 14px; height: 14px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 16px #5BF6EC; }
@keyframes loop-orbit { to { transform: rotate(360deg); } }
.aegis-assembly .loop-hub { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-align: center; width: 170px; }
.aegis-assembly .loop-step { position: absolute; width: 142px; text-align: center; padding: 10px 12px; border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.04); border-radius: 10px; animation: api-pulse var(--cycle, 8s) ease-in-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .loop-evt { width: 182px; padding: 9px 13px; border: 1px solid rgba(23,204,191,.22); background: rgba(23,204,191,.04); border-radius: 9px; animation: api-pulse 4s ease-in-out infinite; animation-delay: var(--d, 0s); }

/* ----- FUNNEL world (Ingress): edge gateway ----------------------- */
.aegis-assembly .funnel { position: relative; width: 520px; height: 460px; transform: scale(1.35); }
.aegis-assembly .funnel-in { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); font: 600 11px/1 ui-monospace, monospace; color: #687485; letter-spacing: .08em; }
.aegis-assembly .funnel-walls { position: absolute; top: 40px; left: 0; width: 100%; height: 220px; overflow: visible; z-index: 0; }
.aegis-assembly .funnel-walls line { stroke: rgba(23,204,191,.28); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }
.aegis-assembly .funnel-drop { position: absolute; top: 50px; left: 50%; margin-left: -4px; width: 8px; height: 8px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 8px #5BF6EC; z-index: 1; animation: funnel-trip 5s ease-in-out infinite; }
.aegis-assembly .funnel-out { top: 346px; }
/* Round-trip: one drop falls in (converging) then rises back out (diverging) —
   physically one-in-then-one-out, so the funnel can never show more out than in.
   funnel-out reuses it with --fall:58/--dx:0 → a Traefik⇆webserver bounce. */
@keyframes funnel-trip {
  0%   { transform: translate(var(--dx), 0); opacity: 0; }   /* client (top) */
  6%   { opacity: 1; }
  24%  { transform: translate(0, 198px); opacity: 1; }        /* converged into Traefik */
  40%  { transform: translate(0, 354px); opacity: 1; }        /* reached the webserver */
  52%  { transform: translate(0, 354px); opacity: 1; }        /* handled */
  68%  { transform: translate(0, 198px); opacity: 1; }        /* response back through Traefik */
  92%  { transform: translate(var(--dx), 0); opacity: 1; }    /* back out to client */
  100% { transform: translate(var(--dx), 0); opacity: 0; }
}
.aegis-assembly .funnel-gate { position: absolute; top: 248px; left: 50%; transform: translateX(-50%); width: 224px; text-align: center; padding: 12px 14px; border: 1px solid rgba(23,204,191,.5); background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); border-radius: 12px; box-shadow: 0 0 32px rgba(23,204,191,.2); z-index: 2; animation: traefik-react 5s ease-out infinite; }
/* Traefik reacts when a round-trip drop converges into it (~38% of the 5s
   trip). One beat per cycle so it reads as intake, not a strobe. */
@keyframes traefik-react {
  0%, 18%, 100% { border-color: rgba(23,204,191,.5); box-shadow: 0 0 32px rgba(23,204,191,.2); transform: translateX(-50%) scale(1); }
  26%           { border-color: #5BF6EC; box-shadow: 0 0 46px rgba(91,246,236,.75); transform: translateX(-50%) scale(1.04); }
}
.aegis-assembly .funnel-gate__title { font: 800 15px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .funnel-gate__port { color: #17CCBF; font-weight: 600; }
.aegis-assembly .funnel-gate__fn { font: 500 11px/1.4 ui-monospace, monospace; color: #9aa5b2; margin-top: 5px; }
.aegis-assembly .funnel-app { position: absolute; top: 404px; left: 50%; transform: translateX(-50%); padding: 9px 18px; border: 1px solid var(--border); background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); border-radius: 10px; font: 700 13px/1 ui-monospace, monospace; color: #fff; }
/* websocket: a persistent full-duplex connection Traefik keeps open (its
   config holds these alive with readTimeout 0). Dots stream BOTH directions
   continuously on one lit line — distinct from the open/close round-trips. */
.aegis-assembly .ws-lane { position: absolute; left: 50%; margin-left: 54px; top: 56px; height: 352px; width: 24px; z-index: 1; }  /* runs client→webserver, passing behind the Traefik gate (z below it) */
.aegis-assembly .sse-lane { margin-left: -78px; }  /* mirror lane, left of center (up-only) */
.aegis-assembly .ws-line { position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; transform: translateX(-50%); background: linear-gradient(to bottom, rgba(23,204,191,.05), rgba(23,204,191,.4) 50%, rgba(23,204,191,.05)); }
.aegis-assembly .ws-dot { position: absolute; left: 50%; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 7px #5BF6EC; }
.aegis-assembly .ws-dot--down { top: 0; animation: ws-down 2.2s linear infinite; }
.aegis-assembly .ws-dot--up { bottom: 0; animation: ws-up 2.2s linear infinite; }
@keyframes ws-down { 0% { transform: translateY(0); opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateY(340px); opacity: 0; } }
@keyframes ws-up { 0% { transform: translateY(0); opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateY(-340px); opacity: 0; } }
.aegis-assembly .ws-label { position: absolute; top: -24px; left: 50%; transform: translateX(-50%); white-space: nowrap; font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .12em; color: #5a6573; }

/* ----- INSIGHTS world: source swimlanes → normalize → dashboard --- */
.aegis-assembly .insight { position: relative; width: 820px; height: 460px; transform: scale(1.06); }
.aegis-assembly .insight-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .insight-line { stroke: rgba(23,204,191,.3); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }
.aegis-assembly .insight-lane { position: absolute; left: 0; width: 360px; display: flex; align-items: center; transform: translateY(-50%); z-index: 1; }
.aegis-assembly .insight-lane__label { width: 152px; flex: none; }
.aegis-assembly .insight-lane__name { font: 700 15px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .insight-lane__yields { font: 500 10px/1.3 ui-monospace, monospace; color: #687485; margin-top: 4px; }
.aegis-assembly .insight-rail { position: relative; flex: 1; height: 2px; border-radius: 2px; background: linear-gradient(90deg, rgba(23,204,191,.08), rgba(23,204,191,.38)); }
.aegis-assembly .insight-dot { position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 8px #5BF6EC; animation: asm-railflow 2s linear infinite; }
.aegis-assembly .insight-node { position: absolute; transform: translate(-50%,-50%); z-index: 2; text-align: center; padding: 14px 18px; border: 1px solid rgba(23,204,191,.4); background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); border-radius: 12px; box-shadow: 0 0 26px rgba(23,204,191,.16); }
.aegis-assembly .insight-node--out { border-color: rgba(91,246,236,.5); }
.aegis-assembly .insight-node__title { font: 800 15px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .insight-node__sub { font: 500 10px/1.3 ui-monospace, monospace; color: #9aa5b2; margin-top: 5px; }

/* ----- OUTBOX world (Comms): events → outbox → channels ----------- */
.aegis-assembly .outbox-d { position: relative; width: 860px; height: 440px; transform: scale(1.18); }
.aegis-assembly .outbox-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .outbox-line { stroke: rgba(23,204,191,.3); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }
.aegis-assembly .outbox-line--in { stroke: rgba(126,138,154,.45); stroke-dasharray: 3 6; }
.aegis-assembly .outbox-trig { position: absolute; left: 60px; transform: translateY(-50%); font: 600 11px/1 ui-monospace, monospace; color: #8b96a4; white-space: nowrap; }
.aegis-assembly .outbox-hub { position: absolute; left: 430px; top: 220px; transform: translate(-50%,-50%); z-index: 2; text-align: center; width: 150px; padding: 13px 14px; border: 1px solid rgba(23,204,191,.5); background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); border-radius: 12px; box-shadow: 0 0 30px rgba(23,204,191,.2); }
.aegis-assembly .outbox-hub__title { font: 800 15px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .outbox-hub__sub { font: 500 9px/1.3 ui-monospace, monospace; color: #9aa5b2; margin-top: 4px; }
.aegis-assembly .outbox-chan { position: absolute; left: 620px; transform: translateY(-50%); z-index: 2; width: 180px; padding: 9px 13px; border: 1px solid rgba(23,204,191,.3); background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); border-radius: 10px; }
.aegis-assembly .outbox-chan__name { font: 700 13px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .outbox-chan__via { font: 500 9px/1.3 ui-monospace, monospace; color: #687485; margin-top: 3px; }
.aegis-assembly .outbox-fly { position: absolute; left: 500px; top: 220px; width: 11px; height: 11px; border-radius: 2.5px; background: #5BF6EC; box-shadow: 0 0 10px #5BF6EC; z-index: 1; animation: comms-fly 2.4s ease-in-out infinite; }
@keyframes comms-fly {
  0%   { transform: translate(0, 0); opacity: 0; }
  12%  { opacity: 1; }
  84%  { opacity: 1; }
  100% { transform: translate(var(--dx, 230px), var(--dy, 0)); opacity: 0; }
}

/* ----- AUTHCHAIN world (Auth): rotation + reuse detection ---------- */
.aegis-assembly .auth-chain { display: flex; align-items: center; gap: 6px; transform: scale(1.4); }
.aegis-assembly .auth-signin { align-self: center; display: flex; flex-direction: column; gap: 6px; margin-right: 2px; }
.aegis-assembly .auth-signin__lbl { font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .18em; color: #5a6573; text-align: center; margin-bottom: 2px; }
.aegis-assembly .auth-method { padding: 8px 13px; border: 1px solid var(--border); border-radius: 8px; font: 600 11px/1 ui-monospace, monospace; color: #cdd6e0; background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); text-align: center; white-space: nowrap; }
.aegis-assembly .auth-method--oauth { border-color: rgba(23,204,191,.3); color: #b6f3ee; }
.aegis-assembly .auth-arrow { align-self: center; color: rgba(23,204,191,.4); font: 700 16px/1 ui-monospace, monospace; }
.aegis-assembly .auth-seg { display: flex; align-items: center; gap: 6px; }
.aegis-assembly .auth-col { position: relative; display: flex; flex-direction: column; align-items: center; }
.aegis-assembly .auth-tok { width: 98px; padding: 14px 10px; border-radius: 12px; border: 1px solid transparent; text-align: center; transition: all .45s ease; }
.aegis-assembly .auth-tok__id { font: 800 16px/1 ui-monospace, monospace; }
.aegis-assembly .auth-tok__lbl { font: 500 9px/1 ui-monospace, monospace; opacity: .7; margin-top: 4px; }
.aegis-assembly .auth-tok.is-pending { border: 1px dashed rgba(126,138,154,.3); color: #4a5563; }
.aegis-assembly .auth-tok.is-active  { border-color: #5BF6EC; background: rgba(23,204,191,.16); color: #fff; box-shadow: 0 0 26px rgba(23,204,191,.5); }
.aegis-assembly .auth-tok.is-spent   { border-color: rgba(23,204,191,.22); background: rgba(23,204,191,.04); color: #6b7785; }
.aegis-assembly .auth-tok.is-reused  { border-color: #f59e0b; background: rgba(245,158,11,.16); color: #fbbf24; box-shadow: 0 0 26px rgba(245,158,11,.45); }
.aegis-assembly .auth-tok.is-revoked { border-color: #ef4444; background: rgba(239,68,68,.14); color: #f87171; box-shadow: 0 0 22px rgba(239,68,68,.4); }
.aegis-assembly .auth-tok.is-reset   { border: 1px dashed rgba(126,138,154,.2); color: #3a4350; opacity: .4; }
.aegis-assembly .auth-acc { position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); font: 600 9px/1 ui-monospace, monospace; color: #17CCBF; opacity: 0; transition: opacity .4s ease; padding: 3px 8px; border: 1px solid rgba(23,204,191,.3); border-radius: 6px; white-space: nowrap; }
.aegis-assembly .auth-acc.is-on { opacity: 1; }
.aegis-assembly .auth-rot { color: rgba(126,138,154,.4); font: 700 15px/1 ui-monospace, monospace; transition: color .3s ease, text-shadow .3s ease; }
.aegis-assembly .auth-rot.is-on { color: #5BF6EC; text-shadow: 0 0 10px rgba(23,204,191,.6); }
.aegis-assembly .auth-caption { font: 600 12px/1.3 ui-monospace, monospace; color: #8b96a4; transition: color .4s ease; min-height: 16px; }
.aegis-assembly .auth-caption.is-warn { color: #fbbf24; }
.aegis-assembly .auth-caption.is-bad { color: #f87171; }
.aegis-assembly .auth-authz { display: flex; align-items: center; gap: 11px; font: 600 12px/1 ui-monospace, monospace; color: #8b96a4; }
.aegis-assembly .auth-authz__lbl { font-size: 9px; text-transform: uppercase; letter-spacing: .16em; color: #5a6573; }
.aegis-assembly .auth-org { padding: 6px 11px; border: 1px solid rgba(23,204,191,.3); border-radius: 7px; color: #cdd6e0; transition: opacity .4s ease; }
.aegis-assembly .auth-roles { display: flex; gap: 5px; transition: opacity .4s ease; }
.aegis-assembly .auth-role { padding: 6px 11px; border: 1px solid var(--border); border-radius: 7px; color: #6b7785; }
.aegis-assembly .auth-role.is-current { border-color: #5BF6EC; color: #fff; background: rgba(23,204,191,.14); box-shadow: 0 0 14px rgba(23,204,191,.3); }
.aegis-assembly .auth-org.is-dim, .aegis-assembly .auth-roles.is-dim { opacity: .3; }
.aegis-assembly .auth-revoked { padding: 5px 10px; border: 1px solid rgba(239,68,68,.45); border-radius: 7px; color: #f87171; font-size: 10px; }

/* ----- POOL world (Workers): broker queue → worker pool ----------- */
.aegis-assembly .wkpool { display: flex; align-items: center; gap: 38px; transform: scale(1.18); }
.aegis-assembly .wk-queue { width: 172px; }
.aegis-assembly .wk-queue__lbl { font: 700 12px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .wk-queue__sub { font: 500 10px/1 ui-monospace, monospace; color: #687485; margin-top: 4px; }
.aegis-assembly .wk-stack { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }
.aegis-assembly .wk-job { height: 22px; border-radius: 6px; border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.06); animation: wk-job-pulse 2.4s ease-in-out infinite; }
@keyframes wk-job-pulse { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
.aegis-assembly .wk-arrow { color: rgba(23,204,191,.4); font: 700 18px/1 ui-monospace, monospace; }
.aegis-assembly .wk-slots { width: 410px; position: relative; }
.aegis-assembly .wk-below { position: absolute; top: 100%; left: 0; margin-top: 16px; }
.aegis-assembly .wk-slots__lbl { font: 700 12px/1 ui-monospace, monospace; color: #fff; margin-bottom: 5px; }
.aegis-assembly .wk-stats { display: flex; gap: 16px; font: 500 9px/1 ui-monospace, monospace; color: #687485; margin-bottom: 16px; }
.aegis-assembly .wk-stats b { color: #17CCBF; font-weight: 700; }
.aegis-assembly .wk-slot { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.aegis-assembly .wk-slot__job { width: 168px; flex: none; font: 500 10px/1 ui-monospace, monospace; color: #9aa5b2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aegis-assembly .wk-slot.is-idle .wk-slot__job { color: #4a5563; }
.aegis-assembly .wk-track { position: relative; flex: 1; height: 10px; border-radius: 5px; background: rgba(126,138,154,.12); overflow: hidden; }
.aegis-assembly .wk-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 5px; background: rgba(23,204,191,.7); animation: wk-run 3.5s linear infinite; }
.aegis-assembly .wk-fill.is-retry { animation-name: wk-run-retry; }
.aegis-assembly .wk-slot.is-idle .wk-fill { animation: none; width: 0; }
.aegis-assembly .wk-badge { width: 16px; flex: none; text-align: center; font: 700 13px/1 ui-monospace, monospace; opacity: 0; }
.aegis-assembly .wk-badge.is-ack { color: #5BF6EC; animation: wk-ack 3.5s linear infinite; }
.aegis-assembly .wk-badge.is-retry { color: #fbbf24; animation: wk-retry 3.5s linear infinite; }
@keyframes wk-run { 0% { width: 0; } 70% { width: 100%; } 84% { width: 100%; } 100% { width: 0; } }
@keyframes wk-run-retry {
  0%   { width: 0;   background: rgba(23,204,191,.7); }
  28%  { width: 52%; background: rgba(23,204,191,.7); }
  32%  { width: 52%; background: rgba(245,158,11,.85); }
  38%  { width: 0;   background: rgba(23,204,191,.7); }
  82%  { width: 100%; }
  92%  { width: 100%; }
  100% { width: 0; }
}
@keyframes wk-ack { 0%, 66% { opacity: 0; } 72% { opacity: 1; } 84% { opacity: 1; } 90% { opacity: 0; } 100% { opacity: 0; } }
@keyframes wk-retry { 0%, 28% { opacity: 0; } 33% { opacity: 1; } 42% { opacity: 1; } 48% { opacity: 0; } 100% { opacity: 0; } }
.aegis-assembly .wk-dlq { font: 600 11px/1 ui-monospace, monospace; color: #8b96a4; padding: 8px 12px; border: 1px dashed rgba(239,68,68,.35); border-radius: 8px; display: inline-flex; align-items: center; gap: 6px; }
.aegis-assembly .wk-dlq__skull { color: #f87171; }
.aegis-assembly .wk-dlq__note { color: #5a6573; font-weight: 500; }
.aegis-assembly .wk-foot { margin-top: 12px; font: 500 9px/1 ui-monospace, monospace; color: #5a6573; }

/* ----- FRONTEND world: two renderers (web stack + Flet/Overseer) -- */
.aegis-assembly .fe { position: relative; width: 820px; height: 440px; transform: scale(1.42); }
.aegis-assembly .fe-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .fe-line { stroke: rgba(23,204,191,.3); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }
.aegis-assembly .fe-node { position: absolute; transform: translate(-50%,-50%); z-index: 1; text-align: center; border: 1px solid rgba(23,204,191,.35); border-radius: 11px; background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); padding: 11px 15px; }
.aegis-assembly .fe-node--root { border-color: rgba(91,246,236,.55); box-shadow: 0 0 26px rgba(23,204,191,.18); font: 800 14px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .fe-node__title { font: 800 13px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .fe-node__sub { font: 500 9px/1.3 ui-monospace, monospace; color: #9aa5b2; margin-top: 4px; }
.aegis-assembly .fe-mount { font: 600 8px/1 ui-monospace, monospace; color: #687485; margin-top: 7px; padding-top: 6px; border-top: 1px dashed rgba(126,138,154,.25); }
.aegis-assembly .fe-techs { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin-top: 8px; max-width: 210px; }
.aegis-assembly .fe-tech { font: 600 9px/1 ui-monospace, monospace; color: #b6f3ee; border: 1px solid rgba(23,204,191,.25); border-radius: 6px; padding: 4px 7px; }
.aegis-assembly .fe-screen { position: absolute; transform: translate(-50%,-50%); z-index: 1; width: 120px; border: 1px solid rgba(126,138,154,.25); border-radius: 8px; overflow: hidden; background: #0d1115; }
.aegis-assembly .fe-screen--ops { width: 150px; border-color: rgba(23,204,191,.5); }
.aegis-assembly .fe-screen__bar { height: 15px; display: flex; align-items: center; gap: 3px; padding: 0 7px; background: rgba(255,255,255,.04); border-bottom: 1px solid rgba(126,138,154,.18); }
.aegis-assembly .fe-dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(126,138,154,.4); }
.aegis-assembly .fe-screen__body { padding: 9px 11px; }
.aegis-assembly .fe-screen__name { font: 700 12px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .fe-screen__sub { font: 500 9px/1.3 ui-monospace, monospace; color: #687485; margin-top: 4px; }

/* ----- HUD / OVERLAYS --------------------------------------------- */
.aegis-assembly .scanline { position: absolute; inset: 0; pointer-events: none; opacity: .5; background: repeating-linear-gradient(to bottom, rgba(255,255,255,.012) 0 1px, transparent 1px 3px); mix-blend-mode: overlay; }
.aegis-assembly .vignette { position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 160px 30px rgba(0,0,0,.6); }
.aegis-assembly .particle { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: rgba(23,204,191,.6); animation: asm-drift linear infinite; }
@keyframes asm-drift { from { transform: translateY(20px); opacity: 0; } 10% { opacity: .8; } 90% { opacity: .8; } to { transform: translateY(-200px); opacity: 0; } }

/* ----- FLAT GRID (aegis-stack.io landing: component/service catalog) ---- */
/* The same slab cards in normal document flow instead of the 3D ring.
   .node keeps its phase machinery (charge sweep, red→amber→teal ramp,
   float bob) but loses the absolute positioning; the entrance is a
   rise-and-settle driven by the base .node transition via .is-dormant. */
/* visibility rides the transition at 0s so a card leaving dormant is
   focusable/clickable the instant its fade-in starts; while dormant the
   links are out of the tab order and not hit-testable at opacity 0. */
.aegis-assembly--flat .node { position: relative; left: auto; top: auto; width: auto; transition: transform .85s cubic-bezier(.16,1.04,.3,1), opacity .5s ease, visibility 0s; }
.aegis-assembly--flat .node.is-dormant { opacity: 0; transform: translateY(26px) scale(.96); visibility: hidden; pointer-events: none; }
.aegis-assembly--flat .slab { transform: none; height: 100%; }
.aegis-assembly--flat .box, .aegis-assembly--flat .node__float { height: 100%; }
/* hover lift only once a card is settled - mid-boot the red/amber phase
   skin must win, matching the 3D assembly where only online nodes hover. */
.aegis-assembly--flat .node:not(.is-incoming):not(.is-booting):not(.is-dormant):hover .slab { border-color: #5BF6EC; background: linear-gradient(157deg, #163029 0%, #0c1a16 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 18px 30px rgba(0,0,0,.55), 0 0 46px rgba(23,204,191,.45); transform: translateY(-3px); }
.aegis-assembly--flat .plug { transform: translateX(-50%); }

/* ----- AILAB world (AI service): inputs | Illiana+context | outputs -- */
.aegis-assembly .ailab { position: relative; width: 880px; height: 500px; }
.aegis-assembly .ailab-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .ai-line { stroke: rgba(23,204,191,.3); stroke-width: 1.5; stroke-dasharray: 5 7; animation: er-flow 1.4s linear infinite; }

/* small column tags */
.aegis-assembly .ai-coltag { position: absolute; z-index: 1; font: 600 9px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .18em; color: #5a6573; }
.aegis-assembly .ai-coltag--right { text-align: right; }

/* cards (inputs, output, voice) */
.aegis-assembly .ai-node { position: absolute; z-index: 1; border-radius: 12px; border: 1px solid var(--border); background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); padding: 13px 15px; }
.aegis-assembly .ai-in { width: 232px; }
.aegis-assembly .ai-out { width: 232px; border-color: rgba(23,204,191,.3); }
.aegis-assembly .ai-bubble__who { font: 700 9px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .18em; color: #5a6573; margin-bottom: 7px; }
.aegis-assembly .ai-bubble__who--her { color: #17CCBF; }
.aegis-assembly .ai-bubble__txt { font: 600 14px/1.45 ui-monospace, monospace; color: #cdd6e0; }
.aegis-assembly .ai-voicecard { width: 232px; display: flex; align-items: center; gap: 9px; }

/* MIDDLE: Illiana wrapped in her live context */
.aegis-assembly .ai-brain { position: absolute; z-index: 2; width: 280px; padding: 16px; border-radius: 18px; border: 1px solid rgba(23,204,191,.28); background: rgba(8,18,16,.6); box-shadow: 0 0 50px rgba(23,204,191,.12); }
.aegis-assembly .ai-core { text-align: center; padding: 14px 14px 13px; border-radius: 13px; border: 1px solid rgba(91,246,236,.55); background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); box-shadow: 0 0 30px rgba(23,204,191,.25); }
.aegis-assembly .ai-core__name { font: 800 19px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .ai-core__sub { font: 500 9px/1 ui-monospace, monospace; color: #9aa5b2; margin-top: 5px; }
/* the model chip reads as a swappable SLOT (pill + caret), with example
   models cycling inside it - sells "any of the catalog" without dating
   the diagram to one model name. */
.aegis-assembly .ai-chip { position: relative; height: 24px; margin: 11px auto 0; width: 204px; border: 1px solid rgba(23,204,191,.35); border-radius: 7px; background: rgba(23,204,191,.08); }
.aegis-assembly .ai-chip::after { content: ""; position: absolute; right: 10px; top: 50%; margin-top: -2px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid rgba(91,246,236,.8); }
/* the slot cycles every provider's flagship on its own 16s cadence (one id
   readable at a time); decoupled from the scene --cycle so adding providers
   stays clean. */
.aegis-assembly .ai-chip__m { position: absolute; left: 8px; right: 18px; text-align: center; opacity: 0; font: 700 11px/24px ui-monospace, monospace; color: #5BF6EC; white-space: nowrap; animation: ai-model 16s linear infinite; animation-delay: var(--md, 0s); }
.aegis-assembly .ai-ctx { display: flex; flex-direction: column; gap: 7px; }
.aegis-assembly .ai-ctx__lbl { font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .14em; color: #5a6573; text-align: center; margin: 14px 0 9px; }
.aegis-assembly .ai-ctxrow { display: flex; align-items: center; gap: 8px; padding: 8px 11px; border-radius: 8px; border: 1px solid rgba(23,204,191,.2); background: rgba(23,204,191,.04); animation: api-pulse var(--cycle, 9s) ease-in-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .ai-ctxrow__dot { width: 7px; height: 7px; border-radius: 50%; background: #5BF6EC; box-shadow: 0 0 7px #5BF6EC; flex: none; }
.aegis-assembly .ai-ctxrow__name { font: 700 11px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .ai-ctxrow__sub { font: 500 9px/1 ui-monospace, monospace; color: #687485; margin-left: auto; }

/* output: streamed, cited answer */
.aegis-assembly .ai-answer { font: 600 13px/1.6 ui-monospace, monospace; }
.aegis-assembly .ai-tok { color: #aeb8c4; opacity: .5; animation: ai-token var(--cycle, 9s) ease-in-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .ai-cursor { display: inline-block; width: 7px; height: 14px; vertical-align: text-bottom; background: #5BF6EC; box-shadow: 0 0 8px #5BF6EC; animation: ai-cursor 1s step-end infinite; }
.aegis-assembly .ai-src { margin-top: 10px; padding-top: 8px; border-top: 1px dashed rgba(126,138,154,.25); display: flex; flex-direction: column; gap: 4px; }
.aegis-assembly .ai-srcref { font: 500 9px/1.3 ui-monospace, monospace; color: #687485; }
.aegis-assembly .ai-srcref b { color: #17CCBF; }

/* voice accent (STT in / TTS out) */
.aegis-assembly .ai-voice { position: absolute; z-index: 1; display: flex; align-items: center; gap: 8px; }
.aegis-assembly .ai-glyph { width: 18px; height: 18px; color: rgba(23,204,191,.7); flex: none; }
.aegis-assembly .ai-wave { display: inline-flex; align-items: flex-end; gap: 3px; height: 20px; }
.aegis-assembly .ai-wave span { width: 3px; border-radius: 2px; background: rgba(23,204,191,.55); animation: api-bar 1s ease-in-out infinite; }
.aegis-assembly .ai-voice__lbl { font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .12em; color: #5a6573; white-space: nowrap; }

/* cost meter */
.aegis-assembly .ai-cost { position: absolute; z-index: 1; width: 360px; }
.aegis-assembly .ai-cost__track { height: 8px; border-radius: 4px; background: rgba(126,138,154,.12); overflow: hidden; }
.aegis-assembly .ai-cost__fill { display: block; height: 100%; width: 0; border-radius: 4px; background: linear-gradient(90deg, rgba(23,204,191,.6), #5BF6EC); box-shadow: 0 0 12px rgba(23,204,191,.5); animation: ai-cost-fill var(--cycle, 9s) ease-in-out infinite; }
.aegis-assembly .ai-cost__stats { display: flex; gap: 18px; margin-top: 10px; font: 500 11px/1 ui-monospace, monospace; color: #687485; }
.aegis-assembly .ai-cost__stat b { color: #17CCBF; font-weight: 700; }

@keyframes ai-model {
  0%, 2%   { opacity: 0; transform: translateY(3px); }
  4%       { opacity: 1; transform: none; }
  13%      { opacity: 1; }
  15%, 100%{ opacity: 0; }
}
@keyframes ai-token {
  0%, 6%   { opacity: .45; color: #aeb8c4; }
  10%      { opacity: 1; color: #eafffb; text-shadow: 0 0 9px rgba(91,246,236,.6); }
  24%, 100%{ opacity: .85; color: #d3dae2; text-shadow: none; }
}
@keyframes ai-cursor { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
@keyframes ai-cost-fill {
  0%, 38%  { width: 0; }
  82%      { width: 100%; }
  95%      { width: 100%; }
  100%     { width: 0; }
}

/* ----- CLILAB world (CLI): terminal inspection + subsystem strip ---- */
.aegis-assembly .clilab { position: relative; width: 720px; height: 460px; }
.aegis-assembly .cli-term { position: absolute; left: 80px; top: 28px; width: 560px; border: 1px solid var(--border); border-radius: 12px; background: #0a0e12; overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,.5); }
.aegis-assembly .cli-bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--border); background: rgba(255,255,255,.03); }
.aegis-assembly .cli-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--border); }
.aegis-assembly .cli-bar__t { margin-left: 8px; font: 600 10px/1 ui-monospace, monospace; color: #687485; }
.aegis-assembly .cli-body { padding: 17px 19px 20px; min-height: 232px; }
.aegis-assembly .cli-prompt { font: 600 14px/1.5 ui-monospace, monospace; color: #cdd6e0; }
.aegis-assembly .cli-dollar { color: #17CCBF; }
.aegis-assembly .cli-cmd { color: #fff; }
.aegis-assembly .cli-cursor { display: inline-block; width: 8px; height: 15px; margin-left: 2px; vertical-align: text-bottom; background: #5BF6EC; box-shadow: 0 0 8px #5BF6EC; animation: ai-cursor 1s step-end infinite; }
.aegis-assembly .cli-out { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.aegis-assembly .cli-row { display: flex; justify-content: space-between; gap: 16px; font: 500 12px/1.5 ui-monospace, monospace; opacity: 0; animation: cli-reveal var(--cycle, 7s) ease-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .cli-row__k { color: #8b96a4; }
.aegis-assembly .cli-row__v { color: #17CCBF; }
.aegis-assembly .cli-subs { position: absolute; left: 60px; right: 60px; bottom: 20px; text-align: center; }
.aegis-assembly .cli-subs__lbl { font: 600 9px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .14em; color: #5a6573; margin-bottom: 11px; }
.aegis-assembly .cli-subs__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; }
.aegis-assembly .cli-sub { font: 600 11px/1 ui-monospace, monospace; color: #9aa5b2; padding: 6px 10px; border-radius: 7px; border: 1px solid rgba(23,204,191,.2); background: rgba(23,204,191,.04); animation: api-pulse var(--cycle, 7s) ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes cli-reveal { 0%, 4% { opacity: 0; transform: translateY(3px); } 9% { opacity: 1; transform: none; } 100% { opacity: 1; } }

/* ----- INFERLAB world (Inference): local boundary + Ollama --------- */
.aegis-assembly .inferlab { position: relative; width: 880px; height: 500px; }
.aegis-assembly .inf-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 0; }
.aegis-assembly .inf-cut { stroke: rgba(239,68,68,.5); stroke-width: 1.5; stroke-dasharray: 6 9; }
.aegis-assembly .inf-machine { position: absolute; left: 40px; top: 56px; width: 560px; padding: 22px 24px; border: 1.5px dashed rgba(23,204,191,.45); border-radius: 18px; background: rgba(8,18,16,.45); box-shadow: 0 0 50px rgba(23,204,191,.1); }
.aegis-assembly .inf-machine__lbl { font: 600 10px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .16em; color: #687485; margin-bottom: 16px; }
.aegis-assembly .inf-mode { color: #17CCBF; }
.aegis-assembly .inf-ollama { display: inline-block; padding: 11px 16px; border-radius: 12px; border: 1px solid rgba(91,246,236,.5); background: linear-gradient(157deg, #16302c 0%, #0c1a17 100%); box-shadow: 0 0 26px rgba(23,204,191,.2); }
.aegis-assembly .inf-ollama__name { font: 800 15px/1 ui-monospace, monospace; color: #fff; }
.aegis-assembly .inf-ollama__sub { font: 500 9px/1 ui-monospace, monospace; color: #9aa5b2; margin-top: 4px; }
.aegis-assembly .inf-rack { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.aegis-assembly .inf-model { font: 600 11px/1 ui-monospace, monospace; color: #b6f3ee; padding: 6px 11px; border-radius: 7px; border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.05); animation: api-pulse var(--cycle, 8s) ease-in-out infinite; animation-delay: var(--d, 0s); }
.aegis-assembly .inf-gen { margin-top: 16px; }
.aegis-assembly .inf-gen__lbl { font: 600 8px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .15em; color: #5a6573; margin-bottom: 7px; }
.aegis-assembly .inf-gen__txt { font: 600 13px/1.5 ui-monospace, monospace; }
.aegis-assembly .inf-local { margin-top: 16px; font: 600 11px/1 ui-monospace, monospace; color: #17CCBF; }
.aegis-assembly .inf-cloud { position: absolute; right: 40px; top: 196px; width: 168px; text-align: center; padding: 16px 14px; border: 1px dashed rgba(126,138,154,.35); border-radius: 12px; background: rgba(20,24,30,.4); opacity: .5; }
.aegis-assembly .inf-cloud__name { font: 700 13px/1 ui-monospace, monospace; color: #8b96a4; }
.aegis-assembly .inf-cloud__x { font: 600 9px/1 ui-monospace, monospace; color: #f87171; margin-top: 8px; text-decoration: line-through; }

/* ----- BLOGLAB world (Blog): Markdown -> published ----------------- */
.aegis-assembly .bloglab { position: relative; width: 760px; height: 440px; }
.aegis-assembly .blog-lanes { position: absolute; top: 16px; left: 70px; right: 70px; display: flex; justify-content: space-between; }
.aegis-assembly .blog-lane { font: 600 10px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .16em; color: #5a6573; }
.aegis-assembly .blog-lane--pub { color: #17CCBF; }
.aegis-assembly .blog-post { position: absolute; top: 54px; left: 64px; width: 392px; padding: 16px 18px; border-radius: 14px; border: 1px solid var(--border); background: linear-gradient(157deg, #1b212a 0%, #0d1115 100%); box-shadow: 0 16px 34px rgba(0,0,0,.5); animation: blog-slide var(--cycle, 8s) ease-in-out infinite; }
.aegis-assembly .blog-status { position: absolute; top: 14px; right: 16px; height: 18px; }
.aegis-assembly .blog-status span { position: absolute; right: 0; top: 0; font: 700 8px/18px ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; padding: 0 9px; border-radius: 999px; white-space: nowrap; }
.aegis-assembly .blog-status__d { color: #fbbf24; border: 1px solid rgba(245,158,11,.4); background: rgba(245,158,11,.1); animation: blog-d var(--cycle, 8s) ease-in-out infinite; }
.aegis-assembly .blog-status__p { color: #17CCBF; border: 1px solid rgba(23,204,191,.45); background: rgba(23,204,191,.12); opacity: 0; animation: blog-p var(--cycle, 8s) ease-in-out infinite; }
.aegis-assembly .blog-fm { font: 500 10px/1.5 ui-monospace, monospace; color: #687485; }
.aegis-assembly .blog-fm__rule { color: #4a5563; }
.aegis-assembly .blog-fm__k { color: #8b96a4; }
.aegis-assembly .blog-fm__v { color: #b6f3ee; }
.aegis-assembly .blog-panes { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.aegis-assembly .blog-md { flex: 1; font: 500 11px/1.5 ui-monospace, monospace; color: #8b96a4; }
.aegis-assembly .blog-md__l { white-space: pre; }
.aegis-assembly .blog-arrow { color: rgba(23,204,191,.5); font: 700 14px/1 ui-monospace, monospace; }
.aegis-assembly .blog-render { flex: 1; animation: asm-sweep var(--cycle, 8s) ease-in-out infinite; }
.aegis-assembly .blog-render__h { font: 700 14px/1.2 sans-serif; color: #fff; }
.aegis-assembly .blog-render__p { font: 400 11px/1.45 sans-serif; color: #cdd6e0; margin-top: 6px; }
.aegis-assembly .blog-tags { display: flex; gap: 7px; margin-top: 14px; }
.aegis-assembly .blog-tag { font: 600 10px/1 ui-monospace, monospace; color: #b6f3ee; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(23,204,191,.25); background: rgba(23,204,191,.05); animation: api-pulse var(--cycle, 8s) ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes blog-slide { 0%, 18% { transform: translateX(0); } 58%, 100% { transform: translateX(232px); } }
@keyframes blog-d { 0%, 46% { opacity: 1; } 54%, 100% { opacity: 0; } }
@keyframes blog-p { 0%, 46% { opacity: 0; } 54%, 100% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .aegis-assembly .world,
  .aegis-assembly .ring--mid,
  .aegis-assembly .node__float,
  .aegis-assembly .particle,
  .aegis-assembly .beam::after,
  .aegis-assembly .rail__dot,
  .aegis-assembly .scard,
  .aegis-assembly .clock__hand,
  .aegis-assembly .clock__job,
  .aegis-assembly .clock__litdot,
  .aegis-assembly .keychip,
  .aegis-assembly .m-ttl,
  .aegis-assembly .m-dot,
  .aegis-assembly .m-fan::before,
  .aegis-assembly .m-fan::after,
  .aegis-assembly .apigate,
  .aegis-assembly .apinode,
  .aegis-assembly .apigroup,
  .aegis-assembly .apihook,
  .aegis-assembly .apihealthy,
  .aegis-assembly .host-mw,
  .aegis-assembly .api-spark span,
  .aegis-assembly .trace__span,
  .aegis-assembly .er-line,
  .aegis-assembly .loop-ring circle,
  .aegis-assembly .loop-orbit,
  .aegis-assembly .loop-step,
  .aegis-assembly .loop-evt,
  .aegis-assembly .funnel-walls line,
  .aegis-assembly .funnel-drop,
  .aegis-assembly .ws-dot,
  .aegis-assembly .funnel-gate,
  .aegis-assembly .insight-line,
  .aegis-assembly .insight-dot,
  .aegis-assembly .outbox-line,
  .aegis-assembly .outbox-fly,
  .aegis-assembly .wk-job,
  .aegis-assembly .wk-fill,
  .aegis-assembly .wk-badge,
  .aegis-assembly .fe-line,
  .aegis-assembly .ai-line,
  .aegis-assembly .ai-ctxrow,
  .aegis-assembly .ai-wave span,
  .aegis-assembly .ai-cursor,
  .aegis-assembly .ai-cost__fill,
  .aegis-assembly .cli-row,
  .aegis-assembly .cli-cursor,
  .aegis-assembly .cli-sub,
  .aegis-assembly .inf-model,
  .aegis-assembly .blog-tag,
  .aegis-assembly .blog-render,
  .aegis-assembly .charge::before,
  .aegis-assembly .charge::after,
  .aegis-assembly .core__chip { animation: none !important; }
  /* AILAB: with motion off, settle to a readable end-state - the answer
     fully written, the first model shown, the cost bar full. */
  .aegis-assembly .ai-tok { opacity: 1 !important; color: #d3dae2 !important; animation: none !important; }
  .aegis-assembly .ai-chip__m { animation: none !important; opacity: 0; }
  .aegis-assembly .ai-chip__m:first-child { opacity: 1; }
  .aegis-assembly .ai-cost__fill { width: 100% !important; }
  /* CLI/Inference: rows + generation settle visible. */
  .aegis-assembly .cli-row { opacity: 1 !important; }
  /* Blog: motion off -> the post sits Published, status flipped. */
  .aegis-assembly .blog-post { animation: none !important; transform: translateX(232px) !important; }
  .aegis-assembly .blog-status__d { animation: none !important; opacity: 0 !important; }
  .aegis-assembly .blog-status__p { animation: none !important; opacity: 1 !important; }
  .aegis-assembly .node,
  .aegis-assembly .macro,
  .aegis-assembly .subworld { transition: opacity .4s ease !important; }
  /* the catalog hover lift rides .slab's transform transition, which the
     JS reduce flag can't gate - drop the lift entirely (selector mirrors
     the hover rule above so it wins on source order, not specificity). */
  .aegis-assembly--flat .node:not(.is-incoming):not(.is-booting):not(.is-dormant):hover .slab { transform: none; }
}