:root{--teal:#64e5df;--amber:#ffda7d;--red:#ff737b;--ink:#101a22;--stage:#142029;--line:#91b9c32c;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;background:var(--stage);color:#edf6fb;font-family:Arial,sans-serif;overflow-x:hidden}body{padding:24px 20px 5px}
[hidden],.motion-fallback[hidden],.lxa8-animation[hidden],.motion-controls[hidden],.vacuum-indicator[hidden],.anti-loupe[hidden]{display:none!important}
.hero-machine-scene{position:relative;isolation:isolate;max-width:1100px;margin:auto;--scene-light:100,229,223}
.hero-machine-scene[data-edge-color="yellow"]{--scene-light:255,218,125}.hero-machine-scene[data-edge-color="red"]{--scene-light:255,115,123}
.hero-machine-scene::before{content:"";position:absolute;z-index:-1;pointer-events:none;left:6%;right:6%;top:35%;bottom:15%;background:radial-gradient(ellipse at 50% 72%,rgba(var(--scene-light),.075),transparent 67%);transition:background .5s}
.hero-machine-link{position:relative;display:block;margin:0}.hero-machine,.lxa8-animation{display:block;width:100%;height:auto;max-height:none;min-height:0}
/* Control dock: the machine stays the focal point. */
.motion-controls{position:relative;display:flex;flex-direction:column;align-items:center;gap:15px;margin:18px auto 0;padding:19px 22px 15px;width:max-content;max-width:100%;border:1px solid #96c8d522;border-radius:14px;background:linear-gradient(130deg,#1b2d36d9,#10212bca);box-shadow:inset 0 1px #ffffff0a,0 15px 38px #050d142b;color:#aec4ce}
.motion-controls::after{content:"";position:absolute;left:24%;right:24%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--scene-light),.58),transparent);pointer-events:none}
.motion-actions{display:flex;align-items:center;justify-content:center;gap:12px}
.motion-controls>[data-motion-status]{order:2;font-size:10px;line-height:1.5;letter-spacing:.11em;text-align:center;color:#a9c1cc;min-height:15px}
.motion-toggle,.motion-stop,.motion-initialize{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:11px 19px;border:1px solid;border-radius:7px;font:600 14px Arial,sans-serif;cursor:pointer;transition:background .25s,border-color .25s,box-shadow .25s,transform .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.motion-toggle{min-width:160px;color:#e6ffff;background:linear-gradient(135deg,#185f6c,#103c4a);border-color:#5ed2db66;--motion-ring-color:#52e3f2;--motion-ring-hot:#e5ffff}
.motion-toggle span,.motion-stop span,.motion-initialize span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;flex-shrink:0;font-size:0!important;line-height:1;background:#b5f9ff19;color:#baf8ff}
.motion-toggle span svg{display:block;width:14px;height:14px}.motion-toggle span::before{content:none!important}
.motion-toggle[aria-pressed="true"]{--motion-ring-color:#ffcd42;--motion-ring-hot:#fff9da;background:linear-gradient(135deg,#665521,#473d20);border-color:#e6c55a70;color:#fff0ba}
.motion-toggle[aria-pressed="true"] span{background:#ffe99f20;color:#ffe99f}
@property --motion-ring-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes motion-edge-orbit{to{--motion-ring-angle:360deg}}
.motion-toggle::before,.motion-initialize[data-active="true"]::before{content:"";position:absolute;inset:-1px;padding:1.3px;border-radius:inherit;background:conic-gradient(from var(--motion-ring-angle),transparent 0deg,transparent 200deg,var(--motion-ring-color) 270deg,var(--motion-ring-hot) 305deg,var(--motion-ring-color) 325deg,transparent 360deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;opacity:.9;animation:motion-edge-orbit 5s linear infinite}
.motion-toggle:disabled::before{animation-play-state:paused;opacity:.25}
.motion-stop{min-width:110px;border-color:#ff929075;background:linear-gradient(135deg,#a63e3e,#752b32);color:#fff1ee}
.motion-stop span{background:#ff8f8f26;color:#ffd7cf;position:relative}.motion-stop span::before{content:"";position:absolute;width:9px;height:9px;border-radius:1px;background:currentColor}
.motion-stop:not(:disabled)::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1;background:#080e18;border:1px solid #080e18;animation:stop-pulse 2.2s ease-in-out infinite}
@keyframes stop-pulse{0%,100%{opacity:0}50%{opacity:.45}}
.motion-initialize{min-width:156px;margin-left:22px;border-color:#eac96d88;background:linear-gradient(135deg,#6c5321,#3a3020);color:#ffe6a4;--motion-ring-color:#ffd568;--motion-ring-hot:#fff2bc}.motion-initialize b{font-weight:600}.motion-initialize span{background:#ffe99f20;color:#ffe99f}
.motion-toggle:disabled,.motion-stop:disabled,.motion-initialize:disabled{cursor:default;transform:none;box-shadow:none}.motion-toggle:disabled{opacity:.62}.motion-stop:disabled,.motion-initialize:disabled{opacity:.32;background:#27323a;border-color:#65768340;color:#a0afb9}.motion-stop:disabled span,.motion-initialize:disabled span{background:#a0afb91a;color:#a0afb9}
.motion-toggle:focus-visible,.motion-stop:focus-visible,.motion-initialize:focus-visible,.anti-demo:focus-visible{outline:2px solid #e7fbff;outline-offset:4px}
@media(hover:hover){.motion-toggle:not(:disabled):hover{border-color:#a6f5f4;box-shadow:0 4px 24px #3fe8e529;transform:translateY(-2px)}.motion-toggle[aria-pressed="true"]:not(:disabled):hover,.motion-initialize:not(:disabled):hover{border-color:#fff1bd;box-shadow:0 4px 24px #ffe48720}.motion-stop:not(:disabled):hover{border-color:#ffc2ae;box-shadow:0 4px 20px #ff6f7a20;transform:translateY(-2px)}}
.motion-toggle:not(:disabled):active,.motion-stop:not(:disabled):active,.motion-initialize:not(:disabled):active{transform:translateY(0)}
/* Auto vacuum remains on the machine fascia. */
.vacuum-indicator{position:absolute;left:50%;top:76%;transform:translate(-50%,-50%);z-index:4;display:flex;align-items:center;min-width:250px;gap:13px;padding:13px 17px;border:1px solid #66d5df62;border-radius:7px;background:linear-gradient(135deg,#155569d9,#103744c7);box-shadow:inset 0 1px #fff1,0 6px 20px #020b1429;color:#baf5fc;pointer-events:none;line-height:1.15}
.vacuum-rotor{display:block;width:38px;height:38px;flex-shrink:0;will-change:transform}.vacuum-icon{display:block;width:100%;height:100%}.vacuum-copy{display:flex;flex:1;flex-direction:column;gap:8px}.vacuum-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.vacuum-title{white-space:nowrap;font-size:10px;font-weight:600;color:#b6d8df;letter-spacing:.15em}
.vacuum-switch{position:relative;display:flex;align-items:center;justify-content:space-around;width:68px;height:23px;border-radius:12px;background:#071c29a6;border:1px solid #91d9de38;font-size:8px;letter-spacing:.03em;color:#71929b;isolation:isolate}.vacuum-switch-thumb{position:absolute;left:2px;top:2px;width:30px;height:17px;border-radius:10px;background:#6ad9d0;box-shadow:0 1px 5px #0003;z-index:-1;transition:transform .25s,background .25s}.vacuum-switch-on{color:#123940}.vacuum-indicator[data-state="off"]{color:#9baeb6;border-color:#adc2ce38;background:#243743d9}.vacuum-indicator[data-state="off"] .vacuum-switch-thumb{transform:translateX(32px);background:#a4b4bf}.vacuum-indicator[data-state="off"] .vacuum-switch-on{color:#71929b}.vacuum-indicator[data-state="off"] .vacuum-switch-off{color:#172d39}
.vacuum-progress{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:8px;font-weight:500;letter-spacing:.05em;color:#a5cdd5}.vacuum-progress>span:last-child{font-size:11px;font-variant-numeric:tabular-nums;min-width:8px;white-space:nowrap;color:#d8f8fb}
/* Perspective-mounted anti-crash button: restrained electrical short effect. */
/* Preserve the table anchor at photo y=432.8 after adding 96 units above it. */
.anti-demo{position:absolute;left:50%;top:44.89%;z-index:4;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:8px 12px;border:1px solid #f6cc8ca6;border-radius:5px;background:linear-gradient(115deg,#806025eb,#54352ae6);box-shadow:0 0 17px #ffd66a1c,inset 0 1px #ffe6bc26;color:#ffe6ae;font:500 13px Arial,sans-serif;cursor:pointer;white-space:nowrap;transform:translate(-50%,-50%) perspective(600px) rotateX(55deg) scale(1.15);transition:border-color .2s,background .2s}
.anti-demo svg{display:block;width:16px;height:16px;flex-shrink:0;color:#ffd8a5}.anti-demo:disabled{opacity:.36;cursor:default;box-shadow:none}.anti-demo:not(:disabled){animation:anti-electric 5.4s linear infinite}.anti-demo::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;border:1px solid #ffe4a6;opacity:0;box-shadow:0 0 14px #ffd567,0 0 28px #ef806777}.anti-demo:not(:disabled)::after{animation:anti-spark 5.4s linear infinite}
@keyframes anti-electric{0%,18%,25%,100%{opacity:.95}19%{opacity:.16}20%{opacity:1}21%{opacity:.22}22%{opacity:1}23%{opacity:.35}24%{opacity:.86}}
@keyframes anti-spark{0%,19%,21%,23%,25%,100%{opacity:0}20%,22%{opacity:.9}24%{opacity:.3}}
@media(hover:hover){.anti-demo:not(:disabled):hover{border-color:#fff3cb;background:linear-gradient(115deg,#9c7730,#865559)}}
.anti-note{text-align:center;color:#b9cbd4;font-size:12px;line-height:1.6;min-height:39px;max-width:620px;margin:15px auto 0;padding:0 10px}
/* A close-up stays on the clear side, follows the real contact point and never captures input. */
.anti-loupe{position:absolute;left:14%;top:1%;width:30%;aspect-ratio:240/250;border:1px solid #ffdb8099;border-radius:12px;background:#10212b;box-shadow:0 0 0 4px #ffda7d08,0 16px 38px #0006;pointer-events:none;overflow:hidden;z-index:3;animation:detail-enter .32s ease-out both}
.anti-loupe[data-side="right"]{left:60%}.anti-loupe svg{width:100%;height:100%;display:block}.anti-loupe-label{position:absolute;top:0;left:0;right:0;padding:12px 10px;background:linear-gradient(#12232bf7,#12232bd9);border-bottom:1px solid #ffdf731c;color:#ffe4a6;font-size:12px;font-weight:600;letter-spacing:.01em}.anti-step{display:inline-flex;margin-right:8px;color:#f6c96a;font-size:10px;font-variant-numeric:tabular-nums;opacity:.75}.anti-detail-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;background:linear-gradient(#10212bcc,#10212bf7);padding:10px 8px;color:#d4e0e4;font-size:10px;line-height:1.5;border-top:1px solid #ffdf731c}
@keyframes detail-enter{from{transform:translateY(7px) scale(.97)}to{transform:none}}
#anti-contact circle:first-child{animation:none} .hero-machine-scene:is([data-motion-mode="lifting"],[data-motion-mode="crash"]) #anti-contact[data-visible="true"] circle:first-child{transform-box:fill-box;transform-origin:center;animation:contact-beacon 1.6s ease-out infinite}
@keyframes contact-beacon{0%{opacity:1;transform:scale(.85)}80%,100%{opacity:0;transform:scale(1.5)}}
@media(max-width:760px){body{padding:74px 5px 6px}.motion-controls{gap:12px;margin-top:10px;padding:14px 10px 12px;border-radius:11px;width:max-content}.motion-actions{gap:8px}.motion-toggle,.motion-stop,.motion-initialize{min-height:48px;padding:9px 10px;font-size:12px;gap:7px}.motion-toggle{min-width:110px}.motion-stop{min-width:80px}.motion-initialize{min-width:113px;margin-left:12px}.motion-toggle span,.motion-stop span,.motion-initialize span{width:25px;height:25px}.motion-controls>[data-motion-status]{font-size:9px;letter-spacing:.07em}.vacuum-indicator{top:79%;min-width:180px;padding:7px 9px;gap:9px}.vacuum-rotor{width:29px;height:29px}.vacuum-title{font-size:8px}.vacuum-copy{gap:5px}.vacuum-heading{gap:10px}.vacuum-progress{font-size:7px;gap:8px}.vacuum-switch{width:64px;height:21px}.vacuum-switch-thumb{height:15px;width:28px}.vacuum-indicator[data-state="off"] .vacuum-switch-thumb{transform:translateX(30px)}.anti-demo{min-height:36px;padding:7px 10px;font-size:12px}.anti-loupe{top:-29%;left:3%;width:43%;border-radius:8px}.anti-loupe[data-side="right"]{left:54%}.anti-loupe-label{font-size:9px;padding:7px 6px}.anti-step{font-size:8px;margin-right:5px}.anti-detail-caption{font-size:8px;padding:6px 4px}.anti-note{font-size:11px;min-height:52px;max-width:340px;margin-top:13px}}
@media(max-width:370px){.motion-actions{gap:5px}.motion-toggle{min-width:100px}.motion-stop{min-width:70px}.motion-initialize{min-width:101px;margin-left:7px}.motion-controls{padding-inline:7px}.motion-toggle,.motion-stop,.motion-initialize{gap:5px}}
@media(max-width:340px){.motion-controls{padding-inline:6px}.motion-toggle{min-width:95px}.motion-stop{min-width:64px}.motion-initialize{min-width:94px}.motion-toggle,.motion-stop,.motion-initialize{padding-inline:7px;font-size:11px}.motion-toggle span,.motion-stop span,.motion-initialize span{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.vacuum-rotor{will-change:auto}}
