:root{--tile:32px;--accent:#ff9a1f;--off:#ff4d3d;--bg:#0a0a0a;--fg:#fff;--line:#ffffffc7;--cargo-w:calc(var(--tile) * 7);--cargo-h:calc(var(--tile) * 1.75);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (max-width:1023.98px),(max-height:639.98px){:root{--tile:28px}}@media (max-width:519.98px){:root{--tile:24px;--cargo-w:calc(var(--tile) * 7);--cargo-h:calc(var(--tile) * 1.75)}}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);height:100%;margin:0;overflow:clip}body{height:100vh;height:100dvh;color:var(--fg);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:var(--tile) var(--tile);font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.factory{position:fixed;inset:0}.factory canvas{display:block}.page{pointer-events:none;flex-direction:column;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.intro{isolation:isolate;text-align:center;pointer-events:auto;max-width:min(46rem,100%);position:relative}.intro:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(closest-side,#0a0a0af5 0%,#0a0a0ae6 50%,#0a0a0a8c 78%,#0a0a0a00 100%);position:absolute;inset:-55% -22% -40%}h1{letter-spacing:-.02em;text-wrap:balance;margin:0 0 .55rem;font-family:Space Grotesk,JetBrains Mono,system-ui,sans-serif;font-size:clamp(1.75rem,min(1rem + 2.9vw,1rem + 3.3vh),3.4rem);font-weight:700;line-height:1.04}.role{--chars:40;width:min(100%, calc((var(--chars) + 4) * 1ch));font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:500;font-size:min(clamp(.76rem, min(.68rem + .45vw, .6rem + .75vh), 1.05rem), calc((100vw - 2.25rem) / (var(--chars) + 4) / .65));color:#ffffffeb;white-space:nowrap;align-items:center;gap:.6ch;margin:0 auto 1rem;line-height:1.4;display:flex;overflow:hidden}.role__prompt{color:var(--accent);font-weight:600}.role__text{flex:none;overflow:hidden}.role:after{content:"";background:var(--accent);flex:none;width:.6em;height:1.1em;animation:1.05s step-end infinite caret-blink}.js .role__text{width:0}.js.is-ready .role__text{animation:role-type 1.2s steps(var(--chars), end) .3s forwards}@keyframes role-type{to{width:calc(var(--chars) * 1ch + .25ch)}}@keyframes caret-blink{50%{opacity:0}}.intro__text{color:#ffffffdb;text-wrap:pretty;max-width:38rem;margin:0 auto;font-family:IBM Plex Sans,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:clamp(.92rem,min(.84rem + .35vw,.78rem + .55vh),1.12rem);line-height:1.6}.station{width:calc(var(--tile) * 11);max-width:100%;height:calc(var(--tile) * 4);margin-top:calc(var(--tile) * 1.1);flex:none;position:relative}.cargo{left:50%;top:calc((var(--tile) * 2 - var(--cargo-h)) / 2);width:var(--cargo-w);height:var(--cargo-h);margin-left:calc(var(--cargo-w) / -2);--roller:calc(var(--tile) * .28);--roller-full:calc(var(--tile) * .42);pointer-events:auto;will-change:transform;font-size:calc(var(--tile) * .47);position:absolute}.cargo.is-transit{pointer-events:none}.js:not(.is-ready) .cargo{visibility:hidden}.cargo:after{--c:var(--accent);--l:calc(var(--tile) * .36);content:"";z-index:4;pointer-events:none;background:linear-gradient(var(--c), var(--c)) top left / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) top left / 2px var(--l) no-repeat, linear-gradient(var(--c), var(--c)) top right / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) top right / 2px var(--l) no-repeat, linear-gradient(var(--c), var(--c)) bottom left / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) bottom left / 2px var(--l) no-repeat, linear-gradient(var(--c), var(--c)) bottom right / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) bottom right / 2px var(--l) no-repeat;transition:filter .2s;position:absolute;inset:-3px}.cargo.is-lifted:after,.cargo:hover:after{filter:drop-shadow(0 0 4px #ff9a1fe6)}.cargo__toggle{z-index:2;color:var(--fg);font:inherit;cursor:pointer;background:0 0;border:0;margin:0;padding:0;position:absolute;inset:0;overflow:hidden}.cargo__toggle:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.cargo__roof{top:0;bottom:0;left:0;right:var(--roller);isolation:isolate;border:1.5px solid var(--line);background:repeating-linear-gradient(90deg, transparent 0 calc(var(--tile) * .22), #ffffff21 0 calc(var(--tile) * .22 + 1px)), #0b0b0b;border-right:0;transition:transform .65s cubic-bezier(.55,0,.25,1),border-color .2s;position:absolute}.cargo__roof:before{content:"";top:10%;bottom:10%;left:calc(var(--tile) * .12);width:calc(var(--tile) * .12);background:#0b0b0b;border:1.5px solid #fff9;position:absolute}.cargo__roller{z-index:1;width:var(--roller);border:1.5px solid var(--line);background:linear-gradient(90deg,#070707,#2a2a2a 45%,#0b0b0b);transition:width .65s cubic-bezier(.55,0,.25,1),border-color .2s;position:absolute;top:0;bottom:0;right:0}.cargo__label{font-size:calc(var(--tile) * .54);color:var(--accent);letter-spacing:.03em;white-space:nowrap;text-shadow:0 0 6px #0b0b0b,0 0 3px #0b0b0b;pointer-events:none;place-items:center;font-weight:600;display:grid;position:absolute;inset:0}.cargo__label:before{content:"";z-index:-1;background:#0b0b0b;border:1px solid #ffffff59;position:absolute;inset:22% 12%}@media (hover:hover){.cargo:not([data-open=true]):not(.is-closing) .cargo__toggle:hover :is(.cargo__roof,.cargo__roller){border-color:var(--accent)}.cargo:not([data-open=true]):not(.is-closing):hover{animation:1.4s ease-in-out infinite cargo-pulse}}@keyframes cargo-pulse{0%,to{filter:drop-shadow(0 0 #ff9a1f00)}50%{filter:drop-shadow(0 0 7px #ff9a1f8c)}}.cargo[data-open=true] .cargo__roof{transform:translate(calc(100% + 2px))}.cargo[data-open=true] .cargo__roller{width:var(--roller-full)}.cargo[data-open=true] .cargo__toggle{pointer-events:none}.cargo[data-open=true] .cargo__roller{pointer-events:auto}.cargo__inside{z-index:1;justify-content:center;align-items:center;gap:calc(var(--tile) * .3);padding:0 calc(var(--tile) * .35 + var(--roller-full)) 0 calc(var(--tile) * .35);background:linear-gradient(#ff9a1f12,#ff9a1f12),#050505;border:1.5px solid #ffffff80;margin:0;list-style:none;display:flex;position:absolute;inset:0}.cargo__inside li{display:contents}.cargo__inside a{width:calc(var(--cargo-h) - 8px);height:calc(var(--cargo-h) - 8px);color:var(--fg);border:1px solid #0000;place-items:center;transition:color .15s,border-color .15s;display:grid}.cargo__inside a:hover,.cargo__inside a:focus-visible{color:var(--accent);border-color:#ff9a1f99;outline:none}.cargo svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:56%;height:56%}.crane{--crane-w:calc(var(--cargo-w) + var(--tile) * 2);z-index:3;width:var(--crane-w);height:0;margin-left:calc(var(--crane-w) / -2);pointer-events:none;transform:translate3d(0, calc(var(--tile) * -.25), 0);will-change:transform;position:absolute;top:0;left:50%}.crane:before,.crane:after{content:"";top:calc(var(--tile) * -.3);width:calc(var(--tile) * .44);height:calc(var(--tile) * .6);border:1.5px solid var(--line);background:#0b0b0b;position:absolute}.crane:before{left:calc(var(--tile) * .03)}.crane:after{right:calc(var(--tile) * .03)}.crane__beam{left:calc(var(--tile) * .25);right:calc(var(--tile) * .25);top:calc(var(--tile) * -.16);height:calc(var(--tile) * .32);border-block:1.5px solid var(--line);background:repeating-linear-gradient(60deg, transparent 0 calc(var(--tile) * .2), #ffffff47 0 calc(var(--tile) * .2 + 1px)), #0b0b0b;position:absolute}.crane__trolley{left:50%;top:calc(var(--tile) * -.3);width:calc(var(--tile) * 1.1);height:calc(var(--tile) * .6);margin-left:calc(var(--tile) * -.55);border:1.5px solid var(--line);background:#0b0b0b;position:absolute}.crane__trolley:after{content:"";background:#fff9;height:1.5px;margin-top:-.75px;position:absolute;top:50%;left:25%;right:25%}.crane.is-gripping .crane__trolley:after{background:var(--accent)}.crane__spreader{--c:var(--accent);--s:calc(var(--tile) * .2);left:50%;top:calc(var(--cargo-h) / -2);width:var(--cargo-w);height:var(--cargo-h);margin-left:calc(var(--cargo-w) / -2);background:linear-gradient(var(--c), var(--c)) top left / var(--s) var(--s) no-repeat, linear-gradient(var(--c), var(--c)) top right / var(--s) var(--s) no-repeat, linear-gradient(var(--c), var(--c)) bottom left / var(--s) var(--s) no-repeat, linear-gradient(var(--c), var(--c)) bottom right / var(--s) var(--s) no-repeat;opacity:0;border:1px solid #fff9;position:absolute}.lang{top:max(.9rem, env(safe-area-inset-top));right:max(1rem, env(safe-area-inset-right));z-index:6;letter-spacing:.06em;background:#0a0a0ad1;border:1px solid #ffffff38;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem;font-weight:500;display:flex;position:fixed;box-shadow:0 0 0 1px #000}.lang__opt{color:#ffffff73;border:1px solid #0000;align-items:center;gap:.45rem;padding:.45rem .7rem;text-decoration:none;transition:color .15s,border-color .15s;display:flex}.lang__opt+.lang__opt{box-shadow:inset 1px 0 #ffffff38}.lang__opt:before{content:"";background:#ffffff2e;border-radius:50%;width:6px;height:6px}.lang__opt[aria-current=page]{color:var(--fg)}.lang__opt[aria-current=page]:before{background:var(--accent);box-shadow:0 0 6px var(--accent)}.lang__opt:hover{color:var(--fg);border-color:#ff9a1f99}.lang__opt:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tooltip{z-index:10;white-space:nowrap;color:#ffffffe6;pointer-events:none;opacity:0;background:#181818f5;border:1px solid #ffffff47;padding:.3rem .55rem;font-size:.72rem;transition:opacity .12s;position:fixed;top:0;left:0;box-shadow:0 0 0 1px #000,0 8px 20px #0009}.tooltip.is-visible{opacity:1}@media (max-width:519.98px){.page{padding:.75rem 1rem}.role{margin-bottom:.8rem}.intro__text{line-height:1.55}}@media (max-height:560px){h1{margin-bottom:.35rem;font-size:1.6rem}.role{margin-bottom:.5rem}.intro__text{font-size:.8rem;line-height:1.45}.station{margin-top:calc(var(--tile) * .5)}}@media (prefers-reduced-motion:reduce){.js .role__text,.js.is-ready .role__text{width:auto;animation:none}.role:after{animation:none}.cargo__roof,.cargo__roller{transition-duration:10ms!important}.cargo:hover{animation:none!important}}
