.agent-machine{width:min(100%,1000px);margin:35px auto 0;display:flex;align-items:center;position:relative;isolation:isolate;font-family:inherit;text-align:left;color:#e4e4e7}.machine-orbit{position:relative;width:680px;max-width:100%;aspect-ratio:680/600;flex:0 0 68%;}.machine-halo{position:absolute;width:58%;height:58%;left:21%;top:17%;background:radial-gradient(ellipse,#ef8f3b24,transparent 68%);filter:blur(15px);pointer-events:none}.machine-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.machine-ring{fill:none;stroke:#595c6125;stroke-width:1.2}.machine-wires{stroke:#4d4f5335;stroke-width:1.2;fill:none}.machine-orbit-spin{transform-origin:340px 280px;animation:machine-orbit 20s linear infinite}.machine-orbit-spin-inner{animation-direction:reverse;animation-duration:15s}.machine-particles circle{fill:#ef8e39;filter:drop-shadow(0 0 4px #ef8f3b70)}.machine-node{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-32px);border:0;background:none;padding:0;display:flex;align-items:center;flex-direction:column;cursor:pointer;font:inherit;z-index:2;color:#dddee1;min-width:100px;transition:filter .3s}.machine-tile{width:64px;height:64px;display:grid;place-items:center;border:1px solid #131313;border-radius:20px;background:linear-gradient(145deg,#131313,#161618);box-shadow:0 10px 24px #00000028,inset 0 1px 1px #131313;transition:transform .35s,box-shadow .35s,border-color .35s}.machine-tile svg{width:31px;height:31px;color:var(--node-color);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.machine-node-label{white-space:nowrap;display:block;margin-top:10px;font-size:12px;line-height:1.2;font-weight:650;background:#131313df;padding:9px 15px;border-radius:30px;box-shadow:0 7px 16px #00000023;transition:color .3s}.machine-node:hover .machine-tile,.machine-node:focus-visible .machine-tile{transform:translateY(-5px);box-shadow:0 14px 25px #ef8e3920}.machine-node:focus-visible{outline:2px solid #ef8d39;outline-offset:8px;border-radius:20px}.machine-node.is-current .machine-tile{border-color:#f2a764;box-shadow:0 0 0 3px #ef913f08,0 11px 26px #ef8d3920}.machine-node.is-current .machine-node-label{color:#ef8e39}.machine-hub{position:absolute;left:50%;top:46.667%;transform:translate(-50%,-50%);z-index:3;display:flex;flex-direction:column;align-items:center;margin-top:19px;pointer-events:none}.machine-hub-tile{width:118px;height:118px;display:grid;place-items:center;position:relative;border-radius:34px;background:linear-gradient(145deg,#f49a4c 0%,#ef8e39 55%,#ef8e39 100%);box-shadow:0 15px 38px #ef8e3930,inset 0 1px 1px #13131370,inset 0 -5px 12px #00000046}.machine-hub-tile>svg{width:54px;height:54px;stroke:#131313;stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 3px 7px #00000051)}.machine-hub-label{background:#131313ed;border:1px solid #131313;padding:10px 17px;border-radius:30px;box-shadow:0 7px 20px #00000023;font-size:12px;font-weight:750;margin-top:12px;white-space:nowrap}.machine-hub-pulse{position:absolute;inset:-9px;border:1px solid #ef8f3a25;border-radius:42px;animation:machine-pulse 3.6s ease-out infinite;pointer-events:none}.machine-activity{position:relative;flex:1;min-width:0;margin-left:-5px;top:-9px;z-index:4}.machine-activity-heading{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:600;letter-spacing:1.6px;color:#9e9fa2;margin:0 0 13px 7px}.machine-activity-heading>span{height:6px;width:6px;border-radius:50%;background:#91a197;box-shadow:0 0 0 3px #91a1970b}.machine-feed{display:grid;gap:10px}.machine-event{min-height:64px;display:flex;align-items:center;gap:12px;background:#131313b8;border:1px solid #131313df;border-radius:16px;padding:14px 16px;box-shadow:0 10px 25px #0000000d;opacity:.67;transition:opacity .4s,transform .4s,background .4s}.machine-event.is-highlight{opacity:1;border-color:#30261e;background:#131313ed;box-shadow:0 9px 27px #00000016;transform:translateX(-9px)}.machine-event-icon{display:grid;place-items:center;flex:0 0 28px;height:28px;border-radius:9px;background:#1b1818;color:#ef8f39;font-size:21px}.machine-event strong{font-size:12px;line-height:1.35;font-weight:650;display:block;letter-spacing:-.1px}.machine-event p{font-size:11px;line-height:1.4;margin:4px 0 0;color:#9c9c9f}.machine-pause{border:0;background:transparent;display:flex;align-items:center;gap:7px;color:#ababad;font:inherit;font-size:10px;padding:9px 5px;cursor:pointer;margin-top:13px;min-height:30px}.machine-pause:hover{color:#ef8d39}.machine-pause:focus-visible{outline:2px solid #ef8d39;outline-offset:3px;border-radius:5px}.machine-hint{font-size:10px;color:#919295;margin:0 0 0 5px}.agent-machine.is-paused .machine-orbit-spin,.agent-machine.is-paused .machine-hub-pulse{animation-play-state:paused}@keyframes machine-orbit{to{transform:rotate(360deg)}}@keyframes machine-pulse{0%{opacity:.6;transform:scale(.95)}80%,100%{opacity:0;transform:scale(1.2)}}
@media(max-width:760px){.agent-machine{flex-direction:column;margin-top:20px;max-width:600px}.machine-orbit{width:100%;flex:none}.machine-activity{width:min(90%,400px);top:0;margin:-5px 0 20px}.machine-feed{gap:7px}.machine-event{min-height:58px}.machine-event.is-highlight{transform:none}.machine-activity-heading{font-size:9px}.machine-pause{margin-top:8px}.machine-hint{position:absolute;right:0;bottom:9px}.machine-node{transform:translate(-50%,-28px);min-width:85px}.machine-tile{width:56px;height:56px;border-radius:18px}.machine-node-label{font-size:11px;padding:7px 12px;margin-top:8px}.machine-hub-tile{width:100px;height:100px;border-radius:29px}.machine-hub-tile>svg{width:46px;height:46px}.machine-hub-label{font-size:11px;padding:8px 13px}.machine-hub{margin-top:16px}}
@media(max-width:420px){.machine-tile{width:47px;height:47px;border-radius:15px}.machine-tile svg{width:26px;height:26px}.machine-node{transform:translate(-50%,-23.5px);min-width:70px}.machine-node-label{font-size:9px;padding:7px 9px;margin-top:7px}.machine-hub-tile{width:78px;height:78px;border-radius:24px}.machine-hub-tile>svg{width:38px;height:38px}.machine-hub-label{font-size:9px;padding:8px 10px;margin-top:8px}.machine-hub{margin-top:13px}.machine-event strong{font-size:12px}.machine-event p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.machine-orbit-spin,.machine-hub-pulse{animation:none}.machine-particles{display:none}.machine-node,.machine-tile,.machine-event{transition:none}}
@media(max-width:760px){.machine-activity{margin-top:17px}.machine-pause:disabled{cursor:default;opacity:.7}}
/* Gauntlet review: keep inactive examples readable. */
.machine-event{opacity:1!important}.machine-event p{color:#b8b9bc}.machine-hint,.machine-pause{font-size:11px}@media(max-width:600px){.machine-hint,.machine-pause{font-size:12px}}
/* Interactive scenario studio */
.agent-machine{flex-wrap:wrap;width:min(1080px,calc(100% - 40px));margin-top:48px;padding:28px 24px 18px;border:1px solid #131313ed;border-radius:36px;background:linear-gradient(130deg,#13131370,#15151728 60%,#13131399);box-shadow:0 26px 80px #00000012;overflow:hidden}
.machine-toolbar{flex:0 0 100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 8px 5px}.machine-toolbar strong{display:block;font-size:17px;letter-spacing:-.5px;margin-top:5px}.machine-eyebrow{font-size:9px;font-weight:650;letter-spacing:1.7px;color:#aaabae}.machine-scenarios{display:flex;gap:4px;background:#1c1c1d9c;border:1px solid #131313;padding:5px;border-radius:30px}.machine-scenarios button{font-size:11px;font-weight:600;padding:10px 14px;border-radius:24px;background:transparent;white-space:nowrap;transition:background .2s,color .2s}.machine-scenarios button[aria-pressed=true]{background:#131313;color:#ef8e39;box-shadow:0 4px 12px #00000028}
.machine-orbit{flex-basis:65%;background-image:radial-gradient(#9192972d .8px,transparent .8px);background-size:20px 20px}.machine-halo{background:radial-gradient(ellipse,#f19d5430,transparent 65%);width:85%;height:85%;left:7%;top:4%}.machine-ring{stroke:#595c614a}.machine-wires{stroke:#5a5b615c;stroke-width:1.4}.machine-wires .is-active{stroke:#f19d54;stroke-width:2.4;stroke-dasharray:7 7;animation:flow 1.8s linear infinite}.machine-particles circle{fill:#f19d54}.machine-hub-tile{background:linear-gradient(145deg,#f7c192,#f19d54 48%,#ef8e39);box-shadow:0 22px 44px #ef8e3938,inset 0 2px 2px #13131380,inset -6px -8px 18px #00000054;border:1px solid #13131355;transform:rotate(-6deg)}.machine-hub-tile>svg{transform:rotate(6deg)}.machine-tile{box-shadow:0 13px 24px #00000033,inset 0 -4px 8px #27272a1c;border-radius:21px;animation:float 6s ease-in-out infinite}.machine-node:nth-of-type(2n) .machine-tile{animation-delay:-3s}.machine-node.is-current .machine-tile{border-color:#f19d5499;background:#171212;box-shadow:0 0 0 5px #f19d5410,0 17px 30px #ef8d3929}.machine-node.is-current .machine-node-label{color:#ef8d39}.machine-activity{margin-left:0;padding:24px 15px 20px 0}.machine-task{font-family:inherit;font-size:23px!important;line-height:1.25!important;letter-spacing:-.8px;margin:12px 0 14px!important;max-width:300px}.machine-step{font-size:10px;letter-spacing:1px;color:#ef8e39;font-weight:650;margin-bottom:20px}.machine-activity-heading{font-size:9px;margin-left:0}.machine-event{border-radius:14px;padding:13px 12px;min-height:78px;background:#131313b8}.machine-event.is-highlight{transform:translateX(-8px);border-color:#f19d544a;box-shadow:0 10px 28px #00000023}.machine-event-icon{color:#ef8f39;background:#1b1818}.machine-event strong{font-size:12px}.machine-event p{font-size:11px}.machine-hint{font-size:10px;color:#aaabae}.machine-pause{font-size:11px;min-height:42px;margin-top:10px}.agent-machine.is-paused .machine-tile,.agent-machine.is-paused .machine-wires .is-active{animation-play-state:paused}@keyframes flow{to{stroke-dashoffset:-28}}@keyframes float{50%{translate:0 -5px}}
@media(max-width:760px){.agent-machine{padding:22px 12px;width:calc(100% - 28px);border-radius:25px}.machine-toolbar{flex-direction:column;align-items:center;text-align:center;gap:16px}.machine-toolbar strong{font-size:18px}.machine-scenarios{width:100%;justify-content:center}.machine-scenarios button{padding:10px 12px}.machine-orbit{flex:none;width:100%;margin-top:12px}.machine-activity{padding:0 12px 4px;margin-top:8px;width:100%;max-width:460px}.machine-task{max-width:none;font-size:22px!important}.machine-feed{gap:8px}.machine-event.is-highlight{transform:none}.machine-hint{position:static}.machine-step{margin-bottom:14px}.machine-hub-label{font-size:10px}.machine-pause{font-size:12px}.machine-node-label{font-size:10px}}
@media(prefers-reduced-motion:reduce){.machine-tile,.machine-wires .is-active{animation:none}}
@media(max-width:420px){.machine-connections{height:100%}.machine-hub{margin-top:0}.machine-node-label{font-size:9px;padding:7px 9px}.machine-hub-label{font-size:9px}.machine-tile{width:44px;height:44px}}
@media(max-width:420px){.machine-orbit{mask-image:none}.machine-hub-label{padding:7px 8px}}
/* Handy: Linien, Bögen und Impulse in echter Größe zeichnen, damit die Bewegung sichtbar bleibt (29.10.2026) */
.machine-connections path,.machine-connections circle.machine-ring{vector-effect:non-scaling-stroke}
@media (max-width:760px){
  .machine-orbit-spin path{stroke-width:2.5}
  .machine-wires{stroke-width:1.4}
  .machine-wires .is-active{stroke-width:2.2}
  .machine-particles circle{filter:drop-shadow(0 0 5px rgba(255,148,47,.85))}
}
@media (max-width:420px){.machine-hub-tile{width:64px;height:64px;border-radius:20px}.machine-hub-tile svg{width:32px;height:32px}.machine-hub-label{font-size:10px;padding:6px 10px}.machine-orbit{margin-bottom:34px}}