@font-face{font-family:"Michroma";src:url(fonts/michroma.woff2) format("woff2");font-display:swap}@font-face{font-family:"Share Tech Mono";src:url(fonts/share-tech-mono.woff2) format("woff2");font-display:swap}
#mon{position:fixed;left:0;top:0;z-index:50;width:64px;height:64px;margin:-32px 0 0 -32px;cursor:pointer;touch-action:manipulation;will-change:transform}
#mon .flip{width:100%;height:100%}#mon .bob{width:100%;height:100%}
#mon svg{width:100%;height:100%;overflow:visible;display:block}
#mon.run .bob{animation:bob .26s ease-in-out infinite}
#mon.hop .bob{animation:hop .55s ease-out 1}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes hop{0%{transform:translateY(0)}40%{transform:translateY(-34px) rotate(-8deg)}100%{transform:translateY(0)}}

:root{--c:#7df9ff;--v:#b38cff;--p:#ff8ad6;--bg:#03020f}
*{box-sizing:border-box}html,body{margin:0}
body{background:radial-gradient(ellipse at 50% 0,#14104a,var(--bg) 60%);color:var(--c);font:19px/1.4 "Share Tech Mono","Courier New",Courier,monospace;min-height:100vh;text-shadow:0 0 6px #7df9ff77;overflow-x:hidden}
canvas#sky{position:fixed;inset:0;z-index:0}
.neb{position:fixed;border-radius:50%;filter:blur(70px);opacity:.3;z-index:0;animation:drift 40s ease-in-out infinite alternate}
.n1{width:55vmax;height:55vmax;left:-18vmax;top:-8vmax;background:radial-gradient(#5b3cff,transparent 65%)}
.n2{width:50vmax;height:50vmax;right:-18vmax;bottom:-10vmax;background:radial-gradient(#ff5fc8,transparent 65%);animation-duration:55s}
@keyframes drift{to{transform:translate(7vw,5vh) scale(1.2)}}
.ring{position:fixed;left:50%;top:50vh;width:min(140vw,900px);transform:translate(-50%,-50%);z-index:0;opacity:.28;animation:spin 300s linear infinite}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
body:before{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;background:repeating-linear-gradient(#0000 0 2px,#0005 3px)}
body:after{content:"";position:fixed;inset:0;z-index:61;pointer-events:none;background:radial-gradient(ellipse at center,#0000 60%,#000b 100%)}
.w{position:relative;z-index:2;max-width:820px;margin:0 auto;padding:22px 18px 80px}
.hd{border:1px solid var(--c);padding:8px 14px;margin-bottom:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;font-size:17px;background:#03020fb0}
.dim{color:#6f8fb8}.vio{color:var(--v);text-shadow:0 0 6px #b38cff88}.pk{color:var(--p);text-shadow:0 0 6px #ff8ad688}
pre{margin:0;white-space:pre-wrap;word-break:break-word;font:inherit}
.big{font:400 clamp(26px,7vw,64px)/1.15 Michroma,"Arial Black",Verdana,sans-serif;letter-spacing:1px;color:#fff;text-shadow:0 0 28px #8a6cffaa,0 0 60px #ff8ad655;margin:16px 0}
.box{border:1px solid var(--v);background:#0a0630aa;padding:16px 18px;margin:22px 0;position:relative}
.box:before,.box:after{content:"";position:absolute;width:12px;height:12px;border:2px solid var(--p)}
.box:before{left:-2px;top:-2px;border-right:0;border-bottom:0}.box:after{right:-2px;bottom:-2px;border-left:0;border-top:0}
.plan{font:400 28px Michroma,"Arial Black",Verdana,sans-serif;color:#f3d58a;text-shadow:0 0 18px #f3d58a66;margin:0 0 6px}
a.cmd{color:#03020f;background:var(--c);text-decoration:none;padding:2px 12px;display:inline-block;margin-top:10px;text-shadow:none}
a.cmd:hover{background:var(--p)}
.cur{display:inline-block;width:.6em;height:1em;background:var(--c);vertical-align:-2px;animation:bl 1s steps(1) infinite}@keyframes bl{50%{opacity:0}}
.top{text-align:center;padding:12vh 0 4vh}.top h1{margin:0}.tagline{font-size:clamp(15px,3.6vw,22px);letter-spacing:3px;text-transform:uppercase;color:var(--c);margin:10px 0 0}.box{animation:rise 1.2s ease both .3s}@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.px1{animation:p1 .3s steps(1) infinite}.px2{animation:p2 .3s steps(1) infinite}#mon:not(.run) .px2{opacity:0}#mon:not(.run) .px1{animation:none;opacity:1}@keyframes p1{0%{opacity:1}50%{opacity:0}}@keyframes p2{0%{opacity:0}50%{opacity:1}}
.glitch{animation:gl 4s infinite}@keyframes gl{0%,92%,100%{transform:none}93%{transform:translate(2px,-1px) skewX(6deg)}95%{transform:translate(-3px,1px)}97%{transform:translate(1px,0)}}
.box pre{font-size:16px}body{display:flex;flex-direction:column}.w{flex:1;width:100%}
.foot{position:relative;z-index:2;margin-top:40px;border-top:1px solid #7df9ff55;background:linear-gradient(#03020f00,#03020fd0 40%);padding:30px 18px 44px;text-align:center;font-size:16px}
.foot:before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#b38cff,#ff8ad6,#7df9ff,transparent);box-shadow:0 0 14px #b38cff}
.fb{font:400 17px Michroma,"Arial Black",Verdana,sans-serif;color:#fff;letter-spacing:1px;margin-bottom:12px}
.fn{display:flex;flex-wrap:wrap;gap:6px 22px;justify-content:center;margin-bottom:14px}
.fn a{color:var(--c);text-decoration:none;letter-spacing:2px;text-transform:uppercase;font-size:15px}.fn a:hover{color:var(--p)}
.fc{color:#6f8fb8;font-size:15px;line-height:1.6}
.sec{margin:34px 0 8px}.sh{font:400 13px Michroma,"Arial Black",Verdana,sans-serif;letter-spacing:3px;color:var(--v);margin:0 0 10px;text-transform:uppercase;text-shadow:0 0 10px #b38cff88}.sh:before{content:"// ";color:var(--p)}
.map{border:1px solid #b38cff66;background:#0a0630aa;position:relative;padding:6px 6px 12px}.map svg{width:100%;height:auto;display:block;overflow:visible}
.ro{margin:6px 10px 0;min-height:2.6em;color:var(--c)}.ro b{color:var(--p);font-weight:400}
.st{cursor:pointer;outline:none}.st .core{transition:.2s}.st:hover .core,.st:focus .core{fill:#fff}
.tw{animation:tw 3.2s ease-in-out infinite}.tw2{animation-delay:1.1s}.tw3{animation-delay:2.2s}@keyframes tw{50%{opacity:.35}}
.pulse{transform-box:fill-box;transform-origin:center;animation:pu 2.4s ease-out infinite}@keyframes pu{from{transform:scale(1);opacity:.9}to{transform:scale(3.2);opacity:0}}
.log{border-left:2px solid var(--v);padding:2px 0 2px 14px}.log .e{margin:0 0 12px}.log .d{color:var(--p);letter-spacing:1px}.log .t{color:#cfe8ff}.log .m{color:#6f8fb8}

.back{display:inline-block;margin:6vh 0 18px;font:400 14px Michroma,"Arial Black",Verdana,sans-serif;letter-spacing:2px;color:var(--c);text-decoration:none}.back:hover{color:var(--p)}
.doc{background:#0a0630c8;border:1px solid #b38cff66;padding:24px 20px 20px;position:relative}
.doc h1{font:400 clamp(22px,6vw,34px)/1.2 Michroma,"Arial Black",Verdana,sans-serif;color:#fff;margin:0 0 6px;text-shadow:0 0 20px #8a6cff88}
.doc .eff{color:var(--p);margin:0 0 18px}
.doc h2{font:400 14px Michroma,"Arial Black",Verdana,sans-serif;letter-spacing:2px;color:#f3d58a;margin:26px 0 8px;text-transform:uppercase;text-shadow:none}
.doc p,.doc li{color:#d8e6ff;text-shadow:none;font-size:17px;line-height:1.55;margin:0 0 10px}
.doc ul{padding-left:20px;margin:0 0 10px}.doc a{color:var(--c)}.doc a:hover{color:var(--p)}
.doc .note{border-left:2px solid var(--p);padding-left:12px;color:#a9bde0}
