*{box-sizing:border-box;margin:0}body{background:#070906;color:#c9d2c1;font:17px/1.7 'Courier New',monospace;min-height:100vh;padding:70px 20px 40px;display:grid;place-items:center;animation:fl 6s infinite}
body:before{content:"";position:fixed;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.35) 0 1px,transparent 1px 3px);pointer-events:none;z-index:9}
body:after{content:"";position:fixed;inset:0;background:radial-gradient(transparent 55%,#000 120%);pointer-events:none;z-index:8}
@keyframes fl{0%,94%,100%{opacity:1}95%{opacity:.82}97%{opacity:.95}}
.bar{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:14px 22px;font-size:12px;letter-spacing:3px;color:#667061;border-bottom:1px solid #232a1f;background:#0b0d0a;z-index:10}.bar b{color:#2fff00}.rec{color:#ff3c3c;animation:bl 1.2s infinite}@keyframes bl{50%{opacity:0}}
main{max-width:660px;width:100%;position:relative;z-index:2}h1{font-size:clamp(30px,8vw,56px);letter-spacing:2px;color:#2fff00;position:relative;margin-bottom:10px;text-shadow:0 0 18px rgba(47,255,0,.45)}
h1:before,h1:after{content:attr(data-t);position:absolute;left:0;top:0;width:100%;overflow:hidden}h1:before{color:#ff3c3c;animation:g1 3.5s infinite;text-shadow:none}h1:after{color:#3cf;animation:g2 3s infinite;text-shadow:none}
@keyframes g1{0%,90%,100%{clip-path:inset(0 0 100% 0)}92%{clip-path:inset(20% 0 50% 0);transform:translate(-4px)}96%{clip-path:inset(60% 0 10% 0);transform:translate(3px)}}@keyframes g2{0%,88%,100%{clip-path:inset(0 0 100% 0)}90%{clip-path:inset(50% 0 20% 0);transform:translate(4px)}94%{clip-path:inset(10% 0 70% 0);transform:translate(-3px)}}
.lore{color:#8e998a;border-left:2px solid #2fff00;padding-left:14px;margin:18px 0 26px;min-height:3.4em}.lore.on:after{content:"█";animation:bl 1s infinite;color:#2fff00}
p{margin:14px 0}.dim{color:#667061;font-size:14px}.code{font-size:19px;line-height:2;color:#2fff00;background:#0f120d;border:1px solid #323b2d;padding:18px;word-break:break-word;box-shadow:inset 0 0 30px rgba(47,255,0,.05)}
.hid{color:transparent!important;text-shadow:none;font-size:13px;user-select:text;opacity:1}::selection{background:#2fff00;color:#000!important;-webkit-text-fill-color:#000}.hid{-webkit-text-fill-color:transparent}.hid::selection{-webkit-text-fill-color:#000}
.poem{background:#0f120d;border:1px solid #323b2d;padding:18px;line-height:2.1}.poem i{color:#ffc43c;font-style:normal;margin-right:8px;font-size:12px}
details{color:#667061;font-size:13px;margin:22px 0 0}summary{cursor:pointer;letter-spacing:2px}details[open] summary{color:#ffc43c}
form{display:flex;align-items:center;gap:10px;margin-top:30px;border:1px solid #323b2d;padding:6px 6px 6px 14px;background:#0f120d}form span{color:#2fff00}input{flex:1;background:0;border:0;color:#eef3ea;font:inherit;outline:0;padding:10px 0}form:focus-within{border-color:#2fff00;box-shadow:0 0 20px rgba(47,255,0,.15)}
button,.go{background:#2fff00;color:#000;border:0;padding:12px 18px;font:700 12px monospace;letter-spacing:2px;cursor:pointer;text-decoration:none;display:inline-block}
#m{min-height:30px;color:#ff3c3c;font-size:14px}#m.ok{color:#2fff00}.shake{animation:s .3s}@keyframes s{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
#cd{display:flex;gap:10px;margin:34px 0 14px}#cd div{flex:1;text-align:center;background:#0f120d;border:1px solid #323b2d;padding:14px 4px}#cd b{display:block;font-size:clamp(30px,10vw,64px);color:#2fff00;text-shadow:0 0 20px rgba(47,255,0,.6)}#cd small{color:#667061;letter-spacing:3px;font-size:11px}
body{overflow-x:hidden}#bg{position:fixed;inset:0;z-index:0;pointer-events:none}#spot{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle 320px at var(--mx,50%) var(--my,40%),rgba(47,255,0,.08),transparent)}
main{padding:34px 30px;background:rgba(9,11,8,.76);border:1px solid #232a1f;backdrop-filter:blur(3px);box-shadow:0 0 70px rgba(47,255,0,.07);animation:on .8s both}
main:before,main:after{content:"";position:absolute;width:18px;height:18px;border:2px solid #2fff00;opacity:.8}main:before{top:-1px;left:-1px;border-right:0;border-bottom:0}main:after{bottom:-1px;right:-1px;border-left:0;border-top:0}
@keyframes on{0%{transform:scaleY(.01) scaleX(.2);filter:brightness(5);opacity:0}45%{transform:scaleY(.01) scaleX(1);opacity:1}100%{transform:none;filter:none}}
#wv{width:100%;height:48px;display:block;margin:6px 0 4px;opacity:.85}
.sn{background:0;border:1px solid #323b2d;color:#8e998a;padding:3px 10px;font:11px monospace;letter-spacing:2px;margin-left:auto;margin-right:18px}.sn:hover{color:#2fff00;border-color:#2fff00}
.bar{gap:10px;align-items:center}.prog{position:fixed;top:44px;left:0;right:0;display:flex;gap:4px;padding:0 22px;z-index:10}.prog span{flex:1;height:3px;background:#1a1f17}.prog .on{background:#2fff00;box-shadow:0 0 10px #2fff00}
.fl{position:fixed;inset:0;z-index:20;pointer-events:none;animation:fo .7s forwards}.fl.g{background:radial-gradient(circle,rgba(47,255,0,.4),transparent 70%)}.fl.r{background:rgba(255,50,50,.22);box-shadow:inset 0 0 120px rgba(255,0,0,.5)}@keyframes fo{to{opacity:0}}
.solved main{box-shadow:0 0 90px rgba(47,255,0,.25);border-color:#2fff00}.solved .go{animation:pu 1s infinite}@keyframes pu{50%{box-shadow:0 0 22px #2fff00}}
.code{position:relative;overflow:hidden}.code:after{content:"";position:absolute;left:0;right:0;height:40%;top:-40%;background:linear-gradient(transparent,rgba(47,255,0,.07),transparent);animation:sc 4s linear infinite}@keyframes sc{to{top:110%}}
.fin main{box-shadow:0 0 120px rgba(47,255,0,.2)}.fin h1{font-size:clamp(26px,6vw,46px)}#cd b.tk,#s.tk{animation:tk .5s}@keyframes tk{0%{transform:scale(1.12);color:#fff;text-shadow:0 0 36px #2fff00}100%{transform:none}}
#cd div{box-shadow:inset 0 0 24px rgba(47,255,0,.06),0 0 24px rgba(47,255,0,.05)}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
.pre main{display:none}#md{position:fixed;inset:0;z-index:5;display:grid;place-items:center;padding:20px;background:rgba(4,6,3,.93);backdrop-filter:blur(6px)}
.mp{position:relative;max-width:460px;width:100%;text-align:center;border:1px solid #2fff00;background:rgba(9,11,8,.9);padding:38px 28px;box-shadow:0 0 80px rgba(47,255,0,.2),inset 0 0 40px rgba(47,255,0,.05);animation:on .7s both}
.mp:before,.mp:after{content:"";position:absolute;inset:-14px;border:1px solid rgba(47,255,0,.35);animation:rg 2.4s infinite}.mp:after{animation-delay:1.2s}@keyframes rg{0%{transform:scale(.97);opacity:.8}100%{transform:scale(1.12);opacity:0}}
.ml{color:#ff3c3c;font-size:12px;letter-spacing:4px;animation:bl 1s infinite}.mt{font-size:clamp(26px,7vw,38px);font-weight:700;color:#2fff00;letter-spacing:3px;margin:14px 0;text-shadow:0 0 22px rgba(47,255,0,.6);animation:fl2 3s infinite}@keyframes fl2{0%,92%,100%{transform:none}94%{transform:translate(-4px,1px);text-shadow:3px 0 #ff3c3c,-3px 0 #3cf}96%{transform:translate(3px,-1px)}}
.mp p{color:#8e998a;font-size:15px;margin:10px 0 26px}#mg{padding:16px 30px;font-size:14px;animation:pu 1.4s infinite}#mg:hover{background:#fff}
.mp:before,.mp:after,main:before,main:after,.code:after{pointer-events:none}#mg{position:relative;z-index:3;cursor:pointer}

.fin main{max-width:980px;background:none;border:0;box-shadow:none;backdrop-filter:none;text-align:center}.fin main:before,.fin main:after,.fin #wv{display:none}
.fin h1{font-size:clamp(28px,7vw,64px);letter-spacing:6px}.fin .lore{text-align:left;max-width:560px;margin:14px auto}
#fr{position:fixed;left:50%;top:50%;width:min(80vw,640px);transform:translate(-50%,-50%);opacity:.07;filter:grayscale(1) brightness(2) drop-shadow(0 0 70px #2fff00);z-index:1;pointer-events:none;animation:br 6s ease-in-out infinite}@keyframes br{50%{opacity:.13;transform:translate(-50%,-50%) scale(1.05)}}
#fx:before,#fx:after{content:"";position:fixed;left:50%;top:50%;width:200px;height:200px;margin:-100px;border:1px solid rgba(47,255,0,.5);border-radius:50%;pointer-events:none;z-index:1;animation:rp 5s linear infinite}#fx:after{animation-delay:2.5s}@keyframes rp{0%{transform:scale(.3);opacity:.8}100%{transform:scale(7);opacity:0}}
#log{text-align:left;color:#2fff00;font-size:14px;min-height:110px;max-width:560px;margin:0 auto;opacity:.8}#zt{letter-spacing:8px;font-size:13px;color:#8e998a;margin:10px 0 24px}
#fx:not(.rv) #cd,#fx:not(.rv) #pg,#fx:not(.rv) .dim,#fx:not(.rv) #zt{opacity:0;transform:scale(.9)}#cd,#pg,.fin .dim,#zt{transition:opacity 1.4s,transform 1.4s}
.fin #cd{gap:clamp(8px,3vw,28px)}.fin #cd div.u{flex:1;background:0;border:0;padding:0;box-shadow:none}.rw{position:relative}.rw svg{width:100%;display:block;transform:rotate(-90deg)}
circle.t,circle.r{fill:none;stroke-width:3}circle.t{stroke:#1a1f17}circle.r{stroke:#2fff00;stroke-linecap:round;stroke-dasharray:289;stroke-dashoffset:289;transition:stroke-dashoffset 1s linear;filter:drop-shadow(0 0 5px #2fff00)}
.fin #cd b{position:absolute;left:0;right:0;top:50%;transform:translateY(-52%);font:700 clamp(24px,7.5vw,72px) monospace;border:0;padding:0;background:0;color:#eef3ea;text-shadow:0 0 24px rgba(47,255,0,.9)}
.fin #cd b#s.tk{animation:tk2 .5s}@keyframes tk2{0%{transform:translateY(-52%) scale(1.15);color:#2fff00}100%{transform:translateY(-52%)}}.fin #cd small{display:block;margin-top:10px}
#pg{height:6px;background:#1a1f17;margin:34px 0 14px;position:relative}#pg i{display:block;height:100%;background:#2fff00;box-shadow:0 0 14px #2fff00;transition:width 1s}
.hot #cd b{color:#ff3c3c;text-shadow:0 0 24px rgba(255,60,60,.9)}.hot circle.r{stroke:#ff3c3c;filter:drop-shadow(0 0 6px #ff3c3c)}.hot #pg i{background:#ff3c3c;box-shadow:0 0 14px #ff3c3c}
.zero h1,.zero #zt{color:#fff;text-shadow:0 0 40px #2fff00}.zero #zt{font-size:26px}
.rx{margin:26px 0 0;border:1px solid #323b2d;background:#0f120d;padding:18px;box-shadow:inset 0 0 30px rgba(47,255,0,.05)}
#eq{display:flex;align-items:center;gap:3px;height:54px}#eq i{flex:1;height:3px;background:#1f2a1b;transition:background .3s}
.rx.on #eq i{background:#2fff00;box-shadow:0 0 8px #2fff00;animation:eqb 1s ease-in-out infinite}
.rx.on #eq i:nth-child(3n){animation-duration:.7s;animation-delay:-.2s}.rx.on #eq i:nth-child(3n+1){animation-duration:1.3s;animation-delay:-.6s}.rx.on #eq i:nth-child(5n){animation-duration:.9s;animation-delay:-.4s}
@keyframes eqb{0%,100%{height:3px}50%{height:46px}}
.rr{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}#pl{padding:14px 20px}#pl:hover{background:#fff}#tm{color:#667061;font-size:13px;letter-spacing:2px}
.rx .dim{margin:14px 0 0}.rx.on .dim{color:#2fff00}