v3 design: animated space canvas (parallax stars + drifting nebulae, per-page color variants), centered layout, cohesive palette, mobile hamburger sitemap drawer, global progress bar, REACH THE DEV button

app.py

@@ -102,7 +102,7 @@ def param(name):
 
 def esc(s): return html.escape(str(s))
 
-BASE = """<!doctype html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1">
+BASE = """<!doctype html><html lang=en><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1">
 <title>DARK0RBITS — No-KYC Network Toolbox: IP Intel, Stego, Burner Mail, SMS Rentals, Proxy Lab</title>
 <meta name=description content="DARK0RBITS: a no-KYC toolbox for operators and AI agents. IP intelligence, card BIN validation, burner mail, SMS number rentals, steganography, trackable files, email & image forensics, canary traps, residential proxy testing. BTC only.">
 <meta name=keywords content="dark0rbits, no kyc tools, ip lookup, bin check, burner email, sms rental, steganography, stego, email forensics, image forensics, canary trap, proxy, bitcoin only, agent api">
@@ -111,68 +111,173 @@ BASE = """<!doctype html><html><head><meta charset=utf-8><meta name=viewport con
 <meta property="og:type" content="website">
 <meta property="og:url" content="https://dark0rbits.thetempleofdoom.com">
 <meta name=robots content="index,follow">
+<meta name=theme-color content="#070a13">
 <link rel=canonical href="https://dark0rbits.thetempleofdoom.com">
 <style>
-:root{--bg:#0b0e17;--card:#141a2b;--fg:#e8ecf7;--dim:#8b95b3;--acc:#f0b429;--acc2:#7dd3fc;--ok:#3ecf8e;--bad:#ff5d5d}
-*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 ui-monospace,Menlo,Consolas,monospace}
-body::before{content:"";position:fixed;inset:0;background:radial-gradient(1px 1px at 20% 30%,#fff8,transparent),radial-gradient(1px 1px at 80% 20%,#fff6,transparent),radial-gradient(1px 1px at 60% 70%,#fff5,transparent),radial-gradient(1px 1px at 40% 80%,#fff7,transparent),radial-gradient(2px 2px at 90% 60%,#fff4,transparent);pointer-events:none;animation:tw 6s ease-in-out infinite alternate}
-@keyframes tw{from{opacity:.5}to{opacity:1}}
-nav{display:flex;flex-wrap:wrap;gap:.4rem;padding:1rem 1.4rem;border-bottom:1px solid #232b45;position:sticky;top:0;background:rgba(11,14,23,.92);backdrop-filter:blur(8px);z-index:5}
-nav a{color:var(--dim);text-decoration:none;padding:.45rem .9rem;border:1px solid #232b45;border-radius:999px;transition:.2s}
-nav a.on,nav a:hover{color:var(--acc);border-color:var(--acc)}
-main{max-width:960px;margin:0 auto;padding:2rem 1.4rem;position:relative}
-h1{font-size:1.7rem;letter-spacing:.2em}h1 span{color:var(--acc)}
-.sub{color:var(--dim);margin:.3rem 0 1.6rem}
-.card{background:var(--card);border:1px solid #232b45;border-radius:14px;padding:1.2rem 1.4rem;margin:1rem 0;position:relative}
-.card.glow{box-shadow:0 0 24px -12px var(--acc)}
-.kv{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:.3rem 1rem}
-.kv div:nth-child(odd){color:var(--dim)}
-input,select,button,textarea{font:inherit;background:#0e1424;color:var(--fg);border:1px solid #2a3555;border-radius:8px;padding:.6rem .8rem}
-button{background:var(--acc);color:#111;border:0;font-weight:700;cursor:pointer;transition:.2s}
-button:hover{filter:brightness(1.15);transform:translateY(-1px)}
+:root{--bg:#070a13;--card:rgba(19,25,44,.82);--line:#242e4d;--fg:#e9edf8;--dim:#93a0c2;--acc:#ffc94d;--acc2:#6fd6ff;--acc3:#a78bfa;--ok:#42e8a4;--bad:#ff6161}
+*{box-sizing:border-box}
+html{scroll-behavior:smooth}
+body{margin:0;min-height:100vh;color:var(--fg);font:16px/1.6 ui-monospace,Menlo,Consolas,monospace;text-align:center;overflow-x:hidden;background:var(--bg)}
+#space{position:fixed;inset:0;z-index:0;display:block}
+.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% -10%,var(--neb1,rgba(120,85,255,.16)),transparent 55%),radial-gradient(ellipse at 80% 110%,var(--neb2,rgba(0,190,255,.10)),transparent 50%),radial-gradient(ellipse at 50% 50%,transparent 60%,rgba(0,0,5,.55) 100%)}
+main{position:relative;z-index:2;max-width:920px;margin:0 auto;padding:1.6rem 1.1rem 4rem;text-align:center}
+#lbar{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--acc),var(--acc3));z-index:50;transition:width .3s;box-shadow:0 0 10px var(--acc)}
+#lbar.done{width:100%;opacity:0;transition:opacity .5s}
+header{position:sticky;top:0;z-index:40;background:rgba(7,10,19,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
+.hbar{max-width:920px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.55rem 1rem}
+.logo{color:var(--acc);text-decoration:none;font-weight:800;letter-spacing:.28em;font-size:1rem;text-shadow:0 0 18px rgba(255,201,77,.35)}
+.burger{background:none;border:1px solid var(--line);color:var(--fg);font-size:1.15rem;border-radius:8px;padding:.35rem .7rem;cursor:pointer}
+.burger:hover{border-color:var(--acc);color:var(--acc)}
+.dnav{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:center}
+.dnav a{color:var(--dim);text-decoration:none;font-size:.72rem;padding:.3rem .55rem;border:1px solid var(--line);border-radius:999px;white-space:nowrap;transition:.15s}
+.dnav a.on,.dnav a:hover{color:var(--acc);border-color:var(--acc)}
+.drawer{position:fixed;inset:0;z-index:60;background:rgba(7,10,19,.96);backdrop-filter:blur(6px);display:none;flex-direction:column;padding:1.2rem;overflow-y:auto}
+.drawer.open{display:flex}
+.drawer .dhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem}
+.drawer h4{color:var(--dim);font-size:.75rem;letter-spacing:.25em;text-align:left;margin:1rem 0 .4rem;text-transform:uppercase}
+.drawer a.dl{color:var(--fg);text-decoration:none;padding:.65rem .8rem;border:1px solid var(--line);border-radius:10px;margin:.25rem 0;text-align:left;font-size:.95rem}
+.drawer a.dl:hover,.drawer a.dl.on{border-color:var(--acc);color:var(--acc)}
+.drawer a.dl small{display:block;color:var(--dim);font-size:.72rem}
+@media(min-width:860px){.burger{display:none}}
+@media(max-width:859px){.dnav{display:none}}
+h1{font-size:1.55rem;letter-spacing:.18em;margin:.8rem 0 .2rem}
+h1 span{color:var(--acc)}
+.sub{color:var(--dim);margin:.2rem 0 1.4rem;font-size:.95rem}
+.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1.15rem 1.2rem;margin:.9rem 0;backdrop-filter:blur(4px)}
+.card.glow{box-shadow:0 0 34px -16px var(--acc)}
+.kv{display:grid;grid-template-columns:1fr;gap:.25rem;text-align:left}
+.kv div:nth-child(odd){color:var(--dim);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;padding-top:.45rem}
+.kv div:nth-child(even){background:rgba(255,255,255,.03);border-radius:8px;padding:.35rem .6rem}
+@media(min-width:640px){.kv{grid-template-columns:180px 1fr}.kv div:nth-child(odd){padding-top:.35rem}}
+input,select,button,textarea{font:inherit;background:rgba(10,15,30,.9);color:var(--fg);border:1px solid #2c3860;border-radius:10px;padding:.6rem .8rem;max-width:100%}
+button{background:linear-gradient(135deg,var(--acc),#ff9d3c);color:#161000;border:0;font-weight:800;cursor:pointer;transition:.2s;letter-spacing:.05em}
+button:hover{filter:brightness(1.12);box-shadow:0 0 18px -4px var(--acc)}
 button.ghost{background:transparent;color:var(--acc);border:1px solid var(--acc)}
-button.big{font-size:1.05rem;padding:.7rem 1.4rem;margin:.25rem}
-.term{font-size:1.05rem;line-height:1.7}
-.term .crt{color:var(--acc);animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
-.cta{margin-top:1rem}
-.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
-@media(max-width:700px){.grid2{grid-template-columns:1fr}.kv{grid-template-columns:1fr}}
-.tag{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.8rem;border:1px solid}
+button.big{font-size:1.02rem;padding:.75rem 1.4rem;margin:.25rem}
+.grid2{display:grid;grid-template-columns:1fr;gap:.9rem;text-align:center}
+@media(min-width:700px){.grid2{grid-template-columns:1fr 1fr}}
+.tag{display:inline-block;padding:.14rem .6rem;border-radius:999px;font-size:.74rem;border:1px solid;margin:.15rem}
 .tag.ok{color:var(--ok);border-color:var(--ok)}.tag.bad{color:var(--bad);border-color:var(--bad)}.tag.warn{color:var(--acc);border-color:var(--acc)}
-table{width:100%;border-collapse:collapse}td,th{padding:.4rem;border-bottom:1px solid #232b45;text-align:left;font-size:.9rem}
-footer{color:var(--dim);text-align:center;padding:2rem;font-size:.85rem}footer a{color:var(--acc)}
-code{background:#0e1424;padding:.1rem .4rem;border-radius:4px}
+table{width:100%;border-collapse:collapse;font-size:.85rem}
+td,th{padding:.4rem;border-bottom:1px solid var(--line);text-align:left}
+th{color:var(--dim);text-transform:uppercase;font-size:.7rem;letter-spacing:.14em}
+footer{color:var(--dim);padding:2.2rem 1rem 5rem;font-size:.8rem;position:relative;z-index:2;text-align:center}
+footer a{color:var(--acc)}
+code{background:rgba(10,15,30,.9);padding:.08rem .4rem;border-radius:5px;font-size:.86em;word-break:break-all}
 a{color:var(--acc2)}
-.drop{border:2px dashed #2a3555;border-radius:12px;padding:2rem;text-align:center;cursor:pointer;transition:.2s}
-.drop:hover,.drop.over{border-color:var(--acc);background:#f0b42908}
-.msg{background:#0e1424;border-left:3px solid var(--acc);border-radius:0 8px 8px 0;padding:.7rem 1rem;margin:.6rem 0}
+pre{text-align:left;white-space:pre-wrap;overflow-x:auto}
+.drop{border:2px dashed #33406b;border-radius:14px;padding:1.8rem 1rem;cursor:pointer;transition:.2s}
+.drop:hover,.drop.over{border-color:var(--acc);background:rgba(255,201,77,.05)}
+.msg{background:rgba(10,15,30,.75);border-left:3px solid var(--acc);border-radius:0 10px 10px 0;padding:.6rem .9rem;margin:.55rem 0;text-align:left}
 .msg.me{border-left-color:var(--acc2)}
-.msg .who{color:var(--dim);font-size:.8rem}
-.bar{height:6px;background:#0e1424;border-radius:3px;overflow:hidden}.bar>i{display:block;height:100%;background:var(--acc);width:0;transition:width .6s}
+.msg .who{color:var(--dim);font-size:.74rem}
+.bar{height:7px;background:rgba(10,15,30,.9);border-radius:4px;overflow:hidden}.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc3));width:0;transition:width .5s}
+#dev{position:fixed;bottom:14px;right:14px;z-index:45;background:rgba(19,25,44,.92);border:1px solid var(--acc);color:var(--acc);border-radius:999px;padding:.5rem .9rem;font-size:.8rem;text-decoration:none;box-shadow:0 0 18px -6px var(--acc)}
+#dev:hover{background:var(--acc);color:#161000}
+img{max-width:100%;border-radius:10px}
+li{text-align:left;margin:.2rem 0}
 </style></head><body>
-<nav>
-<a href=/ class={{o(home)}}>◈ DARK0RBITS</a><a href=/ip class={{o(ip)}}>◈ IP INTEL</a><a href=/card class={{o(card)}}>◈ CARD CHECK</a>
-<a href=/sms class={{o(sms)}}>◈ SMS RENTAL</a><a href=/proxy class={{o(proxy)}}>◈ PROXY LAB</a>
-<a href=/steg class={{o(steg)}}>◈ STEGO</a><a href=/track class={{o(track)}}>◈ TRACK FILE</a>
-<a href=/eh class={{o(eh)}}>◈ MAIL FORENSICS</a><a href=/forensics class={{o(forensics)}}>◈ IMG FORENSICS</a>
-<a href=/canary class={{o(canary)}}>◈ CANARY</a>
-<a href=/mail class={{o(steg2)}}>◈ MAIL</a><a href=/inbox class={{o(inbox)}}>◈ INBOX</a>
-<a href=/passport class={{o(passport)}}>◈ PASSPORT</a><a href=/pass class={{o(sms2)}}>◈ PASS</a><a href=/keys class={{o(keys)}}>◈ KEYS</a><a href=/tools class={{o(tools)}}>◈ TOOLS</a>
-</nav><main>{{body}}</main>
-<footer>Built for agents &amp; humans · <a href="{{bmac}}" target=_blank rel=noopener>☕ fuel the lab</a></footer>
+<div id="lbar"></div>
+<canvas id="space"></canvas><div class="vignette" style="--neb1:{{n1}};--neb2:{{n2}}"></div>
+<header><div class="hbar">
+<a class=logo href=/ >◈ DARK0RBITS</a>
+<div class="dnav">
+<a href=/ class={{o(home)}}>HOME</a><a href=/ip class={{o(ip)}}>IP</a><a href=/card class={{o(card)}}>CARD</a>
+<a href=/sms class={{o(sms)}}>SMS</a><a href=/proxy class={{o(proxy)}}>PROXY</a>
+<a href=/steg class={{o(steg)}}>STEGO</a><a href=/track class={{o(track)}}>TRACK</a>
+<a href=/eh class={{o(eh)}}>MAIL-FORENSICS</a><a href=/forensics class={{o(forensics)}}>IMG-FORENSICS</a>
+<a href=/canary class={{o(canary)}}>CANARY</a><a href=/mail class={{o(mail)}}>BURNER-MAIL</a>
+<a href=/inbox class={{o(inbox)}}>INBOX</a><a href=/passport class={{o(passport)}}>PASSPORT</a>
+<a href=/pass class={{o(pass)}}>PASS</a><a href=/keys class={{o(keys)}}>KEYS</a><a href=/tools class={{o(tools)}}>TOOLS</a>
+</div>
+<button class=burger id=burger onclick="drw()">☰</button>
+</div></header>
+<div class=drawer id=drawer>
+<div class=dhead><span class=logo style=font-size:.85rem>DARK0RBITS — MAP</span><button class=burger onclick="drw()">✕</button></div>
+<h4>Intel</h4>
+<a class="dl {{o(ip)}}" href=/ip>◈ IP INTEL <small>geo, ASN, ISP, VPN flags — any target</small></a>
+<a class="dl {{o(card)}}" href=/card>◈ CARD CHECK <small>luhn + BIN issuer intelligence</small></a>
+<a class="dl {{o(eh)}}" href=/eh>◈ MAIL FORENSICS <small>origin + SPF/DKIM/DMARC + spoof flags</small></a>
+<a class="dl {{o(forensics)}}" href=/forensics>◈ IMAGE FORENSICS <small>EXIF, GPS, ELA, edit detection</small></a>
+<h4>Operate</h4>
+<a class="dl {{o(sms)}}" href=/sms>◈ SMS RENTAL <small>30-min numbers, refundable</small></a>
+<a class="dl {{o(proxy)}}" href=/proxy>◈ PROXY LAB <small>residential egress, geo builder</small></a>
+<a class="dl {{o(steg)}}" href=/steg>◈ STEGO LAB <small>hide words in pictures</small></a>
+<a class="dl {{o(mail)}}" href=/mail>◈ BURNER MAIL <small>receive-only mailboxes, countdown</small></a>
+<h4>Hunt</h4>
+<a class="dl {{o(track)}}" href=/track>◈ TRACK FILE <small>opens report back: IP, city, ISP</small></a>
+<a class="dl {{o(canary)}}" href=/canary>◈ CANARY TRAPS <small>tripwires with instant alerts</small></a>
+<a class="dl {{o(tools)}}" href=/tools>◈ FREE TOOLS <small>DNS, headers, JWT, hasher</small></a>
+<h4>Account</h4>
+<a class="dl {{o(inbox)}}" href=/inbox>◈ INBOX <small>no-KYC messaging</small></a>
+<a class="dl {{o(keys)}}" href=/keys>◈ API KEYS <small>metered access, balance</small></a>
+<a class="dl {{o(pass)}}" href=/pass>◈ PASS <small>$10/mo all-access</small></a>
+<a class="dl {{o(passport)}}" href=/passport>◈ AGENT PASSPORT <small>machine-readable badge</small></a>
+</div>
+<main>{{body}}</main>
+<footer>DARK0RBITS · built for agents &amp; humans · <a href="{{bmac}}" target=_blank rel=noopener>☕ fuel the lab</a></footer>
+<a id=dev href="mailto:makemoneys8@proton.me?subject=Dark0rbits%20support">✦ REACH THE DEV</a>
 <script defer src="https://analytics.thetempleofdoom.com/script.js" data-website-id="953c15df-ba4c-453a-a7c6-465fa9e3f202"></script>
 <script>
+function drw(){document.getElementById('drawer').classList.toggle('open')}
 function cp(t){navigator.clipboard.writeText(t).then(function(){toast('Copied ✓')})}
-function toast(m){var d=document.createElement('div');d.textContent=m;d.style.cssText='position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--acc);color:#111;padding:.5rem 1rem;border-radius:8px;font-weight:700;z-index:99';document.body.appendChild(d);setTimeout(function(){d.remove()},1800)}
+function toast(m){var d=document.createElement('div');d.textContent=m;d.style.cssText='position:fixed;bottom:60px;left:50%;transform:translateX(-50%);background:var(--acc);color:#161000;padding:.55rem 1.1rem;border-radius:10px;font-weight:800;z-index:99';document.body.appendChild(d);setTimeout(function(){d.remove()},1800)}
+var lb=document.getElementById('lbar');
+function lbGo(){lb.classList.remove('done');lb.style.width='12%';var w=12;var t=setInterval(function(){w=Math.min(w+6,88);lb.style.width=w+'%'},250);window._lbt=t}
+function lbDone(){if(window._lbt)clearInterval(window._lbt);lb.style.width='100%';setTimeout(function(){lb.style.width='0';lb.classList.remove('done')},600)}
+document.addEventListener('submit',lbGo,true);
+document.addEventListener('click',function(e){var a=e.target.closest('a[href]');if(a&&a.getAttribute('href')&&a.getAttribute('href').charAt(0)==='/'){lbGo();setTimeout(lbDone,1200)}},true);
+window.addEventListener('load',lbDone);
+(function(){
+var c=document.getElementById('space'),x=c.getContext('2d'),W,H,stars=[],dust=[];
+function rs(){W=c.width=innerWidth;H=c.height=innerHeight;
+stars=[];var n=Math.min(220,Math.floor(W*H/7000));
+for(var i=0;i<n;i++)stars.push({x:Math.random()*W,y:Math.random()*H,z:Math.random()+.3,tw:Math.random()*6.28});
+dust=[];for(i=0;i<14;i++)dust.push({x:Math.random()*W,y:Math.random()*H,r:40+Math.random()*90,vx:(Math.random()-.5)*.08,vy:(Math.random()-.5)*.06,h:Math.random()<.5?120:265,a:.05+Math.random()*.05});}
+rs();addEventListener('resize',rs);
+var mx=0,my=0,tx=0,ty=0;
+addEventListener('mousemove',function(e){tx=(e.clientX/W-.5);ty=(e.clientY/H-.5)});
+addEventListener('touchmove',function(e){if(e.touches[0]){tx=(e.touches[0].clientX/W-.5);ty=(e.touches[0].clientY/H-.5)}},{passive:true});
+function frame(){
+x.clearRect(0,0,W,H);
+for(var i=0;i<dust.length;i++){var d=dust[i];d.x+=d.vx;d.y+=d.vy;
+if(d.x<-100)d.x=W+80;if(d.x>W+100)d.x=-80;if(d.y<-100)d.y=H+80;if(d.y>H+100)d.y=-80;
+var g=x.createRadialGradient(d.x,d.y,0,d.x,d.y,d.r);
+g.addColorStop(0,'hsla('+d.h+',70%,60%,'+d.a+')');g.addColorStop(1,'transparent');
+x.fillStyle=g;x.beginPath();x.arc(d.x,d.y,d.r,0,6.29);x.fill();}
+mx+=(tx-mx)*.03;my+=(ty-my)*.03;
+for(i=0;i<stars.length;i++){var s=stars[i];s.tw+=.02;
+var px=s.x+mx*s.z*40, py=s.y+my*s.z*40;
+var a=.35+.45*Math.abs(Math.sin(s.tw));
+x.fillStyle='rgba(220,228,255,'+(a*s.z)+')';
+x.beginPath();x.arc(px,py,s.z*1.25,0,6.29);x.fill();}
+requestAnimationFrame(frame);}
+frame();
+})();
 </script>
-</body></html>"""
-
-def page(sec, body):
-    return render_template_string(BASE, body=body, bmac=BMAC, o=lambda s: "on" if s == sec else "")
+</body></html>
+"""
 
+NEBULAS = {
+ "home": ("rgba(120,85,255,.17)", "rgba(0,190,255,.10)"),
+ "ip": ("rgba(255,170,60,.13)", "rgba(120,85,255,.10)"),
+ "card": ("rgba(66,232,164,.10)", "rgba(0,190,255,.09)"),
+ "sms": ("rgba(0,190,255,.13)", "rgba(167,139,250,.10)"),
+ "proxy": ("rgba(167,139,250,.14)", "rgba(255,170,60,.08)"),
+ "steg": ("rgba(255,110,180,.11)", "rgba(120,85,255,.11)"),
+ "track": ("rgba(255,90,90,.11)", "rgba(255,170,60,.08)"),
+ "mail": ("rgba(66,232,164,.10)", "rgba(0,190,255,.08)"),
+ "forensics": ("rgba(0,210,255,.12)", "rgba(255,110,180,.07)"),
+ "canary": ("rgba(255,201,77,.12)", "rgba(255,90,90,.08)"),
+}
 def kv(pairs):
     rows = "".join(f"<div>{k}</div><div>{v}</div>" for k, v in pairs)
-    return f'<div class="card glow"><div class="kv">{rows}</div></div>'
+    return '<div class="card glow"><div class="kv">' + rows + "</div></div>"
+
+def page(sec, body):
+    n1, n2 = NEBULAS.get(sec, ("rgba(120,85,255,.16)", "rgba(0,190,255,.10)"))
+    return render_template_string(BASE, body=body, bmac=BMAC, o=lambda s: "on" if s == sec else "",
+                                  n1=n1, n2=n2)
 
 def how(steps):
     lis = "".join(f"<li>{esc(s)}</li>" for s in steps)