Walrus blob · mainnet
On-chain registration not yet visible.
The aggregator served this blob, but we couldn't locate a matching BlobRegistered event in our scan window. It may not be certified yet, or live further back than we paged.
Lifecycle data is unavailable until the blob registration is visible on-chain.
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calavera — The Wrong Website</title>
<style>
:root{
--bg:#020617;
--ink:#f8fafc;
--muted:#94a3b8;
--purple:#a855f7;
--blue:#38bdf8;
--pink:#ec4899;
--card:rgba(255,255,255,.055);
--line:rgba(255,255,255,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
min-height:100vh;
overflow-x:hidden;
font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
color:var(--ink);
background:
radial-gradient(circle at 72% 42%, rgba(168,85,247,.30), transparent 32%),
radial-gradient(circle at 30% 10%, rgba(56,189,248,.18), transparent 28%),
radial-gradient(circle at 55% 90%, rgba(236,72,153,.16), transparent 35%),
var(--bg);
cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'%3E%3Ctext y='30' font-size='28'%3E%F0%9F%A6%B4%3C/text%3E%3C/svg%3E") 8 8, auto;
}
body:before{
content:"";
position:fixed;inset:0;
background-image:url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='28' y='78' font-size='58' opacity='.08'%3E%F0%9F%92%80%3C/text%3E%3C/svg%3E");
opacity:.8;
pointer-events:none;
animation:drift 22s linear infinite;
}
@keyframes drift{from{background-position:0 0}to{background-position:240px 120px}}
.float-skull{position:fixed;font-size:54px;opacity:.07;filter:blur(.2px);animation:float 12s ease-in-out infinite;pointer-events:none}
.s1{left:8%;top:18%;animation-delay:-2s}.s2{right:12%;top:16%;animation-delay:-5s}.s3{left:18%;bottom:12%;animation-delay:-8s}.s4{right:24%;bottom:16%;animation-delay:-1s}.s5{left:48%;top:8%;animation-delay:-10s}
@keyframes float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-34px) rotate(8deg)}}
nav{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:28px clamp(22px,5vw,70px)}
.logo{font-weight:950;letter-spacing:-.04em;font-size:28px;text-shadow:0 0 28px rgba(168,85,247,.9)}
.logo span{background:linear-gradient(90deg,var(--purple),var(--blue));-webkit-background-clip:text;color:transparent}
.pill{border:1px solid var(--line);background:rgba(255,255,255,.04);padding:10px 16px;border-radius:999px;color:var(--muted);font-weight:700}
main{position:relative;z-index:2;min-height:calc(100vh - 92px);display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:30px;padding:30px clamp(22px,5vw,70px) 70px}
.tag{display:inline-flex;gap:10px;align-items:center;border:1px solid rgba(168,85,247,.35);background:rgba(168,85,247,.10);padding:10px 16px;border-radius:999px;color:#d8b4fe;font-weight:800;margin-bottom:24px}
h1{font-size:clamp(54px,8vw,120px);line-height:.88;letter-spacing:-.075em;margin-bottom:28px;max-width:860px}
h1 .grad{display:block;background:linear-gradient(90deg,var(--purple),var(--blue));-webkit-background-clip:text;color:transparent;text-shadow:none}
p.lead{font-size:clamp(18px,2vw,25px);line-height:1.55;color:var(--muted);max-width:720px;margin-bottom:34px}
.buttons{display:flex;gap:18px;align-items:center;flex-wrap:wrap;min-height:96px}
button,a{cursor:inherit}
.run-btn{position:relative;border:0;border-radius:22px;padding:20px 32px;font-size:20px;font-weight:950;color:#020617;background:linear-gradient(135deg,var(--blue),var(--purple));box-shadow:0 0 40px rgba(168,85,247,.55),0 12px 40px rgba(56,189,248,.25);transition:transform .16s ease;min-width:190px}
.ghost{border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:19px 28px;color:var(--ink);text-decoration:none;background:rgba(255,255,255,.045);font-weight:850;box-shadow:inset 0 0 30px rgba(168,85,247,.08)}
.stage{display:grid;place-items:center;min-height:560px;position:relative}
.glow{position:absolute;width:min(72vw,600px);aspect-ratio:1;border-radius:999px;background:radial-gradient(circle,rgba(168,85,247,.38),rgba(56,189,248,.20),transparent 68%);filter:blur(8px);animation:pulse 3s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.08);opacity:.78}}
.calavera{position:relative;width:min(76vw,430px);aspect-ratio:1;border:6px solid rgba(168,85,247,.9);border-radius:48% 48% 44% 44%;box-shadow:0 0 42px rgba(168,85,247,.8), inset 0 0 55px rgba(56,189,248,.12);background:rgba(2,6,23,.78);display:grid;place-items:center;animation:bob 4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-18px)}}
.eye-row{display:flex;gap:34px;margin-top:-42px}.eye{width:112px;height:134px;border:5px solid rgba(56,189,248,.7);border-radius:50%;position:relative;background:#020617}.pupil{position:absolute;left:50%;top:50%;width:26px;height:26px;border-radius:50%;background:var(--blue);box-shadow:0 0 20px var(--blue);transform:translate(-50%,-50%)}
.nose{position:absolute;bottom:155px;width:42px;height:34px;border:4px solid rgba(168,85,247,.75);border-radius:12px 12px 50% 50%;transform:rotate(45deg)}
.teeth{position:absolute;bottom:38px;width:240px;height:92px;border:5px solid rgba(168,85,247,.75);border-radius:25px;background:rgba(2,6,23,.96);display:flex;justify-content:center;align-items:center;gap:8px}.tooth{width:38px;height:60px;border:3px solid rgba(168,85,247,.6);border-radius:8px}
.ornament{position:absolute;top:-72px;font-size:82px;color:var(--purple);filter:drop-shadow(0 0 20px var(--purple))}
.cards{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:20px}.card{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:26px;backdrop-filter:blur(16px);box-shadow:0 0 40px rgba(56,189,248,.08)}.card h3{font-size:22px;margin-bottom:10px}.card p{color:var(--muted);line-height:1.55;font-weight:600}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(120px);z-index:5;background:rgba(15,23,42,.9);border:1px solid rgba(168,85,247,.45);box-shadow:0 0 40px rgba(168,85,247,.35);border-radius:18px;padding:16px 20px;font-weight:900;transition:.35s ease}.toast.show{transform:translateX(-50%) translateY(0)}
@media(max-width:900px){main{grid-template-columns:1fr;text-align:center}.lead{margin-inline:auto}.buttons{justify-content:center}.cards{grid-template-columns:1fr}.stage{min-height:470px}.pill{display:none}}
</style>
<link rel="icon" href="https://aggregator.walrus-mainnet.walrus.space/v1/blobs/IylJBdYtyB6XWt4nvB5Ao1ZqIvkj4z6pHhCBkMhrhik"></head>
<body>
<div class="float-skull s1">💀</div><div class="float-skull s2">☠️</div><div class="float-skull s3">💀</div><div class="float-skull s4">☠️</div><div class="float-skull s5">💀</div>
<nav><div class="logo">CALA<span>VERA</span></div><div class="pill">built with questionable decisions</div></nav>
<main>
<section>
<div class="tag">💀 wrong turn detected</div>
<h1>Welcome to the <span class="grad">funny graveyard.</span></h1>
<p class="lead">A completely unnecessary landing page with floating skulls, neon chaos, a dramatic calavera, and one button that absolutely refuses to be clicked.</p>
<div class="buttons">
<button class="run-btn" id="runBtn">Invest Now</button>
<a class="ghost" href="#cards">Why am I here?</a>
</div>
</section>
<section class="stage" aria-label="interactive calavera">
<div class="glow"></div>
<div class="calavera" id="skull">
<div class="ornament">☼</div>
<div class="eye-row"><div class="eye"><div class="pupil"></div></div><div class="eye"><div class="pupil"></div></div></div>
<div class="nose"></div>
<div class="teeth"><div class="tooth"></div><div class="tooth"></div><div class="tooth"></div><div class="tooth"></div></div>
</div>
</section>
<section class="cards" id="cards">
<div class="card"><h3>🦴 Extremely serious</h3><p>Protected by one angry skeleton, two candles, and a suspicious amount of purple glow.</p></div>
<div class="card"><h3>⚡ Fast-ish</h3><p>Loads quickly unless the calavera decides to stare into your soul for dramatic effect.</p></div>
<div class="card"><h3>💀 100% vibes</h3><p>No boring corporate promises. Just bones, jokes, neon, and internet culture.</p></div>
</section>
</main>
<div class="toast" id="toast">💀 You poked the skeleton.</div>
<script>
const pupils = document.querySelectorAll('.pupil');
document.addEventListener('mousemove', e => {
pupils.forEach(p => {
const eye = p.parentElement.getBoundingClientRect();
const x = e.clientX - (eye.left + eye.width/2);
const y = e.clientY - (eye.top + eye.height/2);
const angle = Math.atan2(y,x);
p.style.transform = `translate(calc(-50% + ${Math.cos(angle)*22}px), calc(-50% + ${Math.sin(angle)*28}px))`;
});
});
const btn = document.getElementById('runBtn');
const texts = ['Invest Now','Nope','Too slow','Try again','Bro 😂','Almost','Fine. Click.'];
let escapes = 0;
btn.addEventListener('mouseenter', () => {
if (escapes < 6) {
escapes++;
btn.textContent = texts[escapes];
const x = (Math.random() > .5 ? 1 : -1) * (20 + Math.random()*38);
const y = (Math.random() > .5 ? 1 : -1) * (20 + Math.random()*28);
btn.style.transform = `translate(${x}px, ${y}px) rotate(${(Math.random()*8)-4}deg)`;
}
});
btn.addEventListener('click', () => showToast('🦴 The button has accepted your courage.'));
const skullLines = ['💀 You poked the skeleton.','💀 Please stop.','💀 I am telling Walrus.','💀 Okay, we are friends now.'];
let skullClicks = 0;
document.getElementById('skull').addEventListener('click', () => {
showToast(skullLines[skullClicks % skullLines.length]);
skullClicks++;
});
function showToast(text){
const toast = document.getElementById('toast');
toast.textContent = text;
toast.classList.add('show');
clearTimeout(window.__toastTimer);
window.__toastTimer = setTimeout(()=>toast.classList.remove('show'), 1900);
}
</script>
</body></html>