
:root{--bg:#120d1c;--card:#fffbe8;--ink:#f4f1ff;--cink:#1b1424;--mut:#a79fbf;--alive:#2ee88a;--peak:#ffcc00;--dead:#ff3b6b;--acc:#c49bff;--pink:#ff6ad5;--comic:"Comic Sans MS","Comic Neue","Chalkboard SE","Marker Felt",cursive;--impact:Impact,"Anton","Haettenschweiler","Arial Narrow Bold","Arial Black",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);background-image:radial-gradient(circle at 15% 10%,#3a1a5c 0,transparent 40%),radial-gradient(circle at 85% 30%,#1a3a5c 0,transparent 35%),repeating-linear-gradient(45deg,transparent 0 22px,rgba(255,255,255,.025) 22px 24px);color:var(--ink);font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh;overflow-x:hidden}
a{color:var(--acc)}header{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center;padding:.9rem 1.2rem;border-bottom:3px dashed #3b2d55;background:rgba(0,0,0,.25)}
.logo{font-family:var(--impact);font-size:1.6rem;letter-spacing:.02em;color:#fff;text-decoration:none;text-transform:uppercase;-webkit-text-stroke:1px #000;text-shadow:3px 3px 0 var(--pink)}.logo .g{display:inline-block;animation:float 3s ease-in-out infinite}
nav a{color:var(--mut);text-decoration:none;margin-right:1rem;font-family:var(--comic);font-weight:700}nav a:hover{color:#fff;text-decoration:wavy underline var(--pink)}
main{max-width:980px;margin:0 auto;padding:1.2rem}.mut{color:var(--mut)}
h1,.impact{font-family:var(--impact);text-transform:uppercase;letter-spacing:.01em;color:#fff;-webkit-text-stroke:2px #000;paint-order:stroke fill;text-shadow:4px 4px 0 #000;font-size:clamp(2rem,7vw,3.6rem);line-height:1.02;margin:.5rem 0}
.hero{text-align:center;padding:1rem 0 .4rem;position:relative}.hero .sub{font-family:var(--comic);font-size:1.05rem;color:#e6dcff;max-width:620px;margin:.4rem auto}
.ghost{display:inline-block;font-size:3rem;animation:float 3.2s ease-in-out infinite}.ghost.r{animation-delay:-1.6s}
@keyframes float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}}
@keyframes wob{0%,100%{transform:rotate(var(--r,0deg))}50%{transform:rotate(calc(var(--r,0deg)*-1))}}
@keyframes bounce{0%{transform:scale(1)}30%{transform:scale(1.35) rotate(-12deg)}60%{transform:scale(.9) rotate(8deg)}100%{transform:scale(1)}}
@keyframes marq{to{transform:translateX(-50%)}}
.ticker{overflow:hidden;background:var(--peak);color:#000;font-family:var(--impact);text-transform:uppercase;white-space:nowrap;border-block:3px solid #000;transform:rotate(-1deg);margin:.6rem -1rem}.ticker div{display:inline-block;padding:.3rem 0;animation:marq 30s linear infinite}
.sponsor{border:3px dashed var(--pink);border-radius:14px;padding:.8rem;text-align:center;color:var(--mut);margin:1.4rem 0;font-family:var(--comic);font-size:.9rem;transform:rotate(.6deg)}.sponsor b{color:var(--peak)}
.ctl{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:1rem 0}
button,select,input,textarea{font:inherit;background:#241a36;color:var(--ink);border:2px solid #000;border-radius:10px;padding:.45rem .8rem;box-shadow:3px 3px 0 #000}button{cursor:pointer;font-weight:700;transition:transform .1s}button:hover{transform:translate(-1px,-1px) rotate(-1deg);box-shadow:4px 4px 0 var(--pink)}button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}
.btn-y{background:var(--peak);color:#000}
#list{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.3rem;padding:.4rem}
.card{background:var(--card);color:var(--cink);border:3px solid #000;border-radius:16px;padding:1rem;margin:.8rem 0;box-shadow:6px 6px 0 #000;position:relative;transform:rotate(var(--r,0deg));transition:transform .2s}
#list .card{margin:0}#list .card:hover{transform:rotate(0) scale(1.02);z-index:2}
.card:nth-child(4n+1){--r:-1.2deg}.card:nth-child(4n+2){--r:.9deg}.card:nth-child(4n+3){--r:-.5deg}.card:nth-child(4n){--r:1.4deg}
.card a{color:#6a2bd9}.card .mut{color:#6b6378}.card h3{margin:.2rem 0 .2rem;font-family:var(--impact);text-transform:uppercase;font-size:1.35rem;line-height:1.1;padding-right:4.5rem}.card h3 a{color:var(--cink);text-decoration:none}
.card .emo{font-size:1.8rem;line-height:1;display:inline-block}
.sticker{position:absolute;top:-12px;right:-10px;font-family:var(--impact);text-transform:uppercase;font-size:.78rem;padding:.3rem .55rem;border:2px solid #000;border-radius:8px;transform:rotate(8deg);box-shadow:2px 2px 0 #000;max-width:9.5rem;text-align:center;line-height:1.1;animation:wob 2.8s ease-in-out infinite;--r:8deg}
.s-alive{background:var(--alive);color:#000}.s-peaking{background:var(--peak);color:#000}.s-dead{background:var(--dead);color:#fff}
.bar{display:flex;height:16px;border-radius:8px;overflow:hidden;background:#ddd5c4;border:2px solid #000;margin:.6rem 0 .3rem}.bar span{transition:width .4s cubic-bezier(.5,1.8,.5,1)}.a{background:var(--alive)}.p{background:var(--peak)}.d{background:var(--dead)}
.legend{font-size:.8rem;color:#5d556b;font-family:var(--comic);margin-top:.5rem;padding:.35rem .5rem;border:2px dashed #b9ae98;border-radius:8px}.legend.voted{border-color:#000;color:#1b1424;font-weight:700}.votes{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.6rem}.votes button{font-size:.82rem;padding:.35rem .55rem;background:#fff;color:#000}
.votes button[data-v=alive].on{background:var(--alive)}.votes button[data-v=peaking].on{background:var(--peak)}.votes button[data-v=dead].on{background:var(--dead);color:#fff}.votes button.boing{animation:bounce .5s}
.badge{font-family:var(--impact);font-size:.9rem;padding:.15rem .6rem;border:2px solid #000;border-radius:8px;margin-left:.5rem;vertical-align:middle;-webkit-text-stroke:0;text-shadow:none;display:inline-block;transform:rotate(-4deg)}.b-alive{background:var(--alive);color:#000}.b-peaking{background:var(--peak);color:#000}.b-dead{background:var(--dead);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.tomb{background:linear-gradient(#cfcad6,#9e97a8);color:#221a2c;border:3px solid #000;border-radius:140px 140px 14px 14px;padding:2.2rem 1.3rem 1.3rem;text-align:center;margin:1.4rem 0;box-shadow:6px 8px 0 #000;position:relative;transform:rotate(var(--r,0deg))}
.tomb:nth-child(odd){--r:-1deg}.tomb:nth-child(even){--r:1.2deg}.tomb::after{content:"";position:absolute;left:-6%;right:-6%;bottom:-16px;height:18px;background:#3fa34d;border:3px solid #000;border-radius:50%;z-index:-1}
.tomb .icon{font-size:2.6rem;animation:float 3s ease-in-out infinite}.tomb h2{font-family:var(--impact);text-transform:uppercase;margin:.2rem 0;font-size:1.6rem;line-height:1.05}.tomb .rip{font-family:var(--impact);letter-spacing:.35em;font-size:1.2rem}
.tomb p{font-family:Georgia,serif;font-style:italic;max-width:560px;margin:.7rem auto}.tomb a{color:#4b1fa0}.tomb .dates{font-family:var(--comic);font-weight:700}
.memo{text-align:left;background:rgba(255,255,255,.55);border:2px dashed #000;border-radius:10px;padding:.5rem .7rem;font-size:.86rem;margin:.6rem 0}.memo b{font-family:var(--impact);text-transform:uppercase;font-weight:400;letter-spacing:.03em}
.candles{font-size:1.3rem;letter-spacing:.3rem}.candles span{display:inline-block;animation:flick 1.2s infinite alternate}@keyframes flick{to{opacity:.55;transform:scale(.9) rotate(3deg)}}
.cert{background:#fff7dc;color:#2a1d0e;border:6px double #6b4b1c;outline:3px solid #000;border-radius:6px;padding:1.2rem 1.3rem;margin:1.6rem 0;font-family:Georgia,serif;position:relative;box-shadow:8px 8px 0 #000;transform:rotate(-.7deg)}
.cert h2{font-family:var(--impact);text-transform:uppercase;text-align:center;letter-spacing:.06em;margin:0;font-size:clamp(1.3rem,4vw,1.9rem)}.cert .ctr{text-align:center}.cert dl{display:grid;grid-template-columns:max-content 1fr;gap:.25rem .8rem;margin:1rem 0}.cert dt{font-family:var(--impact);text-transform:uppercase;font-size:.85rem;color:#6b4b1c;padding-top:.15rem}.cert dd{margin:0;border-bottom:1px dotted #6b4b1c}
.stamp{position:absolute;right:1rem;bottom:1rem;border:4px solid var(--c,var(--dead));color:var(--c,var(--dead));font-family:var(--impact);font-size:1.3rem;padding:.2rem .6rem;border-radius:8px;transform:rotate(-14deg);opacity:.85;text-transform:uppercase}
.stamp.st-peaking{--c:#d67800}.stamp.st-alive{--c:#119650}.cert .row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.6rem}.cert button{background:#fff;color:#000}
footer{text-align:center;color:var(--mut);font-size:.85rem;padding:2rem 1rem;font-family:var(--comic)}
.news{background:var(--pink);color:#000;border:3px solid #000;border-radius:16px;box-shadow:6px 6px 0 #000;max-width:720px;margin:2rem auto;padding:1.2rem;text-align:center;transform:rotate(-.8deg)}.news h3{font-family:var(--impact);text-transform:uppercase;font-size:1.6rem;margin:.2rem 0}.news p{font-family:var(--comic);margin:.3rem 0 .8rem}
form.nf{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}form.nf input{min-width:220px;background:#fff;color:#000}.news button{background:#000;color:#fff}
.toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%) rotate(-2deg);background:var(--peak);color:#000;border:3px solid #000;box-shadow:4px 4px 0 #000;font-family:var(--impact);text-transform:uppercase;padding:.6rem 1rem;border-radius:10px;display:none;z-index:99;max-width:90vw;text-align:center}
.fx{position:fixed;pointer-events:none;z-index:98;font-size:1.6rem;left:0;top:0;will-change:transform,opacity}
.empty{text-align:center;font-family:var(--comic);padding:2rem;color:var(--mut)}
@media(max-width:600px){h1,.impact{-webkit-text-stroke:1.5px #000;text-shadow:3px 3px 0 #000}#list{grid-template-columns:1fr;padding:0 .3rem}.ghost{font-size:2.2rem}.cert dl{grid-template-columns:1fr}.cert dt{padding-top:.4rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
