:root{--y:#ffd54a;--r:#c8282d;--g:#1f8a4c;--k:#121012;--c:#fff6dc}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--k);color:var(--c);font-family:'VT323',monospace;font-size:22px;overflow-x:hidden;
background-image:repeating-linear-gradient(45deg,#1a171a 0 20px,#141114 20px 40px)}
h1,h2,h3,h4,.btn,nav,.ticker,.phase span,.step b{font-family:'Press Start 2P',monospace}
a{color:var(--y)}.px{image-rendering:pixelated}
nav{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#000c;border-bottom:4px solid var(--y);font-size:12px}
nav a{text-decoration:none;color:var(--c);margin-left:14px}.brand{display:flex;align-items:center;gap:8px;color:var(--y)!important;margin:0!important}.brand img{width:32px;border-radius:50%}
.hero{position:relative;text-align:center;padding:40px 16px 50px;overflow:hidden;border-bottom:6px solid var(--r)}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.12;filter:grayscale(1)}
.hero>*{position:relative}
.logo{width:min(320px,70vw);border-radius:50%;border:6px solid var(--y);box-shadow:0 0 0 6px var(--r),0 0 40px #ffd54a88;animation:wobble 4s ease-in-out infinite}
@keyframes wobble{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg) scale(1.03)}}
.spin-in{animation:spinin 1.2s ease-out,wobble 4s 1.2s ease-in-out infinite}@keyframes spinin{from{transform:rotate(-720deg) scale(0)}}
h1{font-size:clamp(28px,7vw,64px);color:var(--y);text-shadow:4px 4px 0 var(--r),8px 8px 0 #000;margin:20px 0 6px;line-height:1.2}
.sub{font-size:26px;max-width:700px;margin:auto}
.speech{display:inline-block;background:#fff;color:#000;padding:12px 18px;border:4px solid #000;border-radius:12px;font-family:'Press Start 2P';font-size:12px;line-height:1.7;margin:16px;animation:shout 1.4s infinite}
@keyframes shout{0%,100%{transform:scale(1)}10%{transform:scale(1.08) rotate(-2deg)}20%{transform:scale(1)}}
.sprites{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.sprites img{width:clamp(110px,22vw,192px);animation:bob 1s steps(2) infinite}
.sprites img:nth-child(2){animation-delay:.3s}@keyframes bob{50%{transform:translateY(-6px)}}
.btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:18px 0}
.btn{display:inline-block;padding:14px 18px;font-size:13px;text-decoration:none;border:4px solid #000;box-shadow:5px 5px 0 #000;cursor:pointer;transition:transform .1s;color:#000}
.btn:hover{transform:translate(-2px,-2px) rotate(-1deg)}.btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 #000}
.buy{background:var(--y);animation:pulse 1.6s infinite}.x{background:#fff}.small{background:var(--r);color:#fff;font-size:11px}.big{font-size:15px;margin-top:10px}
@keyframes pulse{50%{box-shadow:5px 5px 0 #000,0 0 26px var(--y)}}
.ca{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;background:#000;border:3px dashed var(--y);padding:10px;max-width:760px;margin:0 auto 16px}
.ca code{word-break:break-all;font-size:20px;color:#9fe}.ca button{font-family:'Press Start 2P';font-size:11px;background:var(--g);color:#fff;border:3px solid #000;padding:8px 10px;cursor:pointer}
.ticker{background:var(--y);color:#000;overflow:hidden;white-space:nowrap;font-size:13px;padding:10px 0;border-bottom:4px solid #000}
.ticker div{display:inline-block;animation:tick 30s linear infinite}@keyframes tick{to{transform:translateX(-50%)}}
section{padding:50px 16px;max-width:1100px;margin:auto}
h2{font-size:clamp(18px,4vw,30px);color:var(--y);text-align:center;text-shadow:3px 3px 0 var(--r)}
h3{font-size:15px;color:var(--y)}h4{font-size:13px;margin:0 0 6px;color:var(--y)}
.lead{text-align:center;font-size:26px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center;margin:20px 0}
.poster{border:6px solid #fff;box-shadow:8px 8px 0 var(--r);transform:rotate(-1.5deg);background:#fff;transition:transform .3s}
.poster:hover{transform:rotate(1deg) scale(1.02)}.poster img{width:100%;display:block}
.poster.small{width:60%;margin:20px auto 0}.poster.wide{max-width:520px;margin:30px auto 0}
.laws ol{padding-left:22px}.laws li{margin-bottom:8px}
.min{display:flex;flex-wrap:wrap;gap:8px}.min span{background:#2a222a;border:2px solid var(--y);padding:4px 8px}
.detector{background:#000;border:4px solid var(--r);padding:20px;text-align:center;margin:30px auto;max-width:700px}
.detector input{width:100%;font:inherit;padding:10px;border:3px solid var(--y);background:#111;color:#fff}
.verdict{margin-top:12px;font-family:'Press Start 2P';font-size:12px;padding:12px;line-height:1.6}
.verdict.bad{background:var(--r);animation:alarm .3s steps(2) infinite}.verdict.good{background:var(--g)}
@keyframes alarm{50%{background:#000;color:var(--r)}}
body.alarm{animation:shake .15s infinite}@keyframes shake{25%{transform:translate(3px,-2px)}75%{transform:translate(-3px,2px)}}
.rev .poster{order:0}.bowls{display:flex;gap:20px;justify-content:center}.bowl{width:130px;cursor:pointer;animation:bob 1.2s steps(2) infinite}
.bowl:active{transform:scale(.9)}.hint{text-align:center;opacity:.8;font-size:18px}
.field{position:relative;height:180px;background:linear-gradient(#5aa0e0 0 60%,#6b4a2a 60%);border:4px solid #000;overflow:hidden;image-rendering:pixelated}
.tank{position:absolute;bottom:20px;width:150px}.t1{left:-160px;animation:drive 9s linear infinite}.t2{left:-160px;bottom:60px;width:120px;animation:drive 12s 3s linear infinite}
.t3{right:-160px;width:130px;animation:driveL 10s 1s linear infinite}
@keyframes drive{to{left:110%}}@keyframes driveL{to{right:110%}}
.ball{position:absolute;width:16px;height:16px;background:#7a3b1d;border-radius:50%;box-shadow:inset -3px -3px #4a2010;left:20%;bottom:60px;animation:shot 1.5s ease-in infinite}
@keyframes shot{0%{transform:translate(0,0)}50%{transform:translate(200px,-90px)}100%{transform:translate(400px,0)}}
.steps{display:flex;flex-direction:column;gap:14px}.step{display:flex;gap:14px;background:#221c22;border-left:6px solid var(--y);padding:12px}
.step b{font-size:24px;color:var(--r)}.step p{margin:0}
.chart{border:6px solid var(--y);box-shadow:8px 8px 0 var(--r);height:480px;background:#000}.chart iframe{width:100%;height:100%;border:0}
.mapbox{position:relative;border:6px solid #000;box-shadow:8px 8px 0 var(--g)}.worldmap{width:100%;display:block;image-rendering:pixelated}
.noodle{position:absolute;inset:0;width:100%;height:100%}.noodle path{fill:none;stroke:var(--y);stroke-width:5;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900;animation:spread 6s ease-in-out infinite alternate;filter:drop-shadow(1px 1px 0 #a07000)}
@keyframes spread{to{stroke-dashoffset:0}}
.chariot{position:absolute;width:120px;top:0;left:0;animation:fly 8s linear infinite}
@keyframes fly{0%{transform:translate(-20%,40px)}50%{transform:translate(200%,0)}100%{transform:translate(420%,50px)}}
.phases{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:20px}
.phase{flex:1 1 180px;background:#221c22;border:4px solid var(--y);padding:14px;position:relative}
.phase:nth-child(odd){transform:rotate(-1deg)}.phase:nth-child(even){transform:rotate(1deg) translateY(10px)}
.phase span{font-size:10px;background:var(--r);padding:4px 6px}.phase h4{margin-top:10px}.phase p{margin:0}.final{border-color:var(--r);background:#3a1414}
footer{text-align:center;padding:40px 16px;border-top:6px solid var(--y);background:#000}
.disc{max-width:800px;margin:auto;font-size:18px;opacity:.75}
#rain{position:fixed;inset:0;pointer-events:none;z-index:99;overflow:hidden}
.drop{position:absolute;top:-60px;font-size:30px;animation:fall linear forwards}@keyframes fall{to{transform:translateY(115vh) rotate(720deg)}}
.stink{position:fixed;font-size:60px;pointer-events:none;z-index:98;animation:stink 2s ease-out forwards}@keyframes stink{to{transform:translateY(-120px) scale(3);opacity:0}}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(200%);background:var(--y);color:#000;padding:12px 18px;border:4px solid #000;font-family:'Press Start 2P';font-size:11px;transition:transform .3s;z-index:100;max-width:90vw;text-align:center}
#toast.show{transform:translateX(-50%) translateY(0)}
@media(max-width:760px){.grid2{grid-template-columns:1fr}.navlinks{display:none}body{font-size:20px}.chart{height:380px}.poster.small{width:85%}}
.rainy{position:relative;overflow:hidden}.rainfx{position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(105deg,transparent 0 14px,#bcd8ff88 14px 15px,transparent 15px 34px);background-size:200px 200px;animation:rainfx .35s linear infinite}
@keyframes rainfx{to{background-position:-40px 200px}}
.dossier{background:#e8dcb5;color:#2a1d10;padding:20px;border:4px solid #000;box-shadow:8px 8px 0 #000;transform:rotate(1deg)}.dossier h3{color:var(--r)}
.stamp{font-family:'Press Start 2P';color:var(--r);border:4px solid var(--r);display:inline-block;padding:8px;transform:rotate(-8deg);font-size:12px}
.ration{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;margin-top:30px}.mini{width:220px}.sitter{width:170px}