*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse at top,#3b1d6e 0%,#1b1446 45%,#0b0820 100%) fixed;color:#fff;font-family:"Courier New",ui-monospace,monospace;min-height:100vh;overflow-x:hidden}
.stars{position:fixed;inset:0;pointer-events:none;z-index:0}
.s1{background-image:radial-gradient(1px 1px at 20px 30px,#fff,transparent),radial-gradient(1px 1px at 90px 120px,#fff,transparent),radial-gradient(1.5px 1.5px at 160px 60px,#ffd23f,transparent),radial-gradient(1px 1px at 230px 170px,#fff,transparent);background-size:260px 220px;opacity:.8}
.s2{background-image:radial-gradient(2px 2px at 50px 80px,#fff,transparent),radial-gradient(1.5px 1.5px at 300px 200px,#33e0ff,transparent);background-size:380px 300px;animation:tw 3s ease-in-out infinite alternate}
.s3{background-image:radial-gradient(2px 2px at 120px 40px,#ff5fa2,transparent),radial-gradient(2px 2px at 400px 330px,#fff,transparent);background-size:520px 420px;animation:tw 4.5s ease-in-out infinite alternate-reverse}
@keyframes tw{from{opacity:.25}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.s2,.s3{animation:none}}
header,main,footer{position:relative;z-index:1}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;max-width:1100px;margin:0 auto}
.logo img{display:block;height:64px;width:auto}
nav a{color:#ffd23f;text-decoration:none;font-weight:700;margin-left:16px;letter-spacing:1px}
nav a:hover{color:#fff}
main{max-width:1100px;margin:0 auto;padding:0 16px}
.hero{text-align:center;padding:40px 0 30px}
h1{font-size:clamp(26px,5vw,54px);margin:0 0 12px;line-height:1.15;letter-spacing:2px;text-shadow:3px 3px 0 #e0218a}
h1 span{color:#ffd23f}
.hero p{font-size:clamp(15px,2vw,19px);max-width:620px;margin:0 auto;color:#d9d2ff}
.hero .btn{margin:clamp(26px,4vw,36px) 0 clamp(28px,4vw,40px)}
.btn{display:inline-block;background:#ffd23f;color:#1b1446;font-weight:900;font-size:20px;padding:14px 28px;border-radius:6px;text-decoration:none;box-shadow:0 6px 0 #b8860b,0 0 24px #ffd23f66;letter-spacing:1px;transition:transform .08s}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #b8860b}
.tiny{font-size:13px;opacity:.75}
h2{text-align:center;color:#33e0ff;letter-spacing:4px;margin:40px 0 20px;text-shadow:2px 2px 0 #3a5fcd}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.cab{display:flex;flex-direction:column;background:linear-gradient(#2c1f66,#1a1240);border:4px solid #7b5cff;border-radius:18px 18px 8px 8px;padding:10px;text-decoration:none;color:#fff;box-shadow:0 8px 0 #0d0926,0 0 0 2px #0d0926 inset;transition:transform .12s,box-shadow .12s}
.cab.live:hover{transform:translateY(-4px) rotate(-.5deg);box-shadow:0 12px 0 #0d0926,0 0 30px #ff5fa288}
.marquee{background:linear-gradient(90deg,#e0218a,#ff8a00,#ffd23f);color:#1b1446;font-weight:900;text-align:center;padding:8px;border-radius:10px 10px 4px 4px;letter-spacing:3px;font-size:20px}
.screen{margin:10px 0;aspect-ratio:16/10;background:#000;border:6px solid #0d0926;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.screen img{width:100%;height:100%;object-fit:cover;display:block;image-rendering:auto}
.screen span{color:#7b5cff;font-weight:900;font-size:22px;text-align:center;letter-spacing:3px;animation:blink 1.2s steps(2) infinite}
@keyframes blink{50%{opacity:.25}}
.panel{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.panel p{margin:0;font-size:14px;color:#d9d2ff;line-height:1.4}
.play{align-self:center;background:#2ecc71;color:#0b2a16;font-weight:900;padding:6px 18px;border-radius:20px;letter-spacing:1px}
.play.off{background:#444;color:#aaa}
.soon{opacity:.8;border-color:#4a3a99}
.about{max-width:700px;margin:0 auto 20px;text-align:center;color:#d9d2ff;line-height:1.5}
.crew{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px}
.mem{background:#ffffff10;border:2px dashed #7b5cff;border-radius:12px;padding:14px;text-align:center}
.av{width:84px;height:84px;display:block;margin:0 auto;filter:drop-shadow(0 3px 0 #0006)}.float{animation:flt 3s ease-in-out infinite}@keyframes flt{50%{transform:translateY(-5px) rotate(3deg)}}.glow{filter:drop-shadow(0 0 3px currentColor)}.blink{animation:blink 1s steps(2) infinite}.mem h3{margin:6px 0 2px;color:#ffd23f;font-size:16px}.mem p{margin:0;font-size:13px;opacity:.8}
footer{text-align:center;padding:40px 16px 30px;color:#bdb3ff;font-size:14px}
footer img{opacity:.9}footer p{margin:6px 0}
@media (max-width:560px){.logo img{height:44px}nav a{margin-left:10px;font-size:14px}.hero{padding-top:24px}}

.coinbox{margin:0 auto;max-width:300px;background:linear-gradient(#2c1f66,#1a1240);border:4px solid #7b5cff;border-radius:14px;padding:14px 16px 10px;box-shadow:0 6px 0 #0d0926}
.cb-led{font-weight:900;letter-spacing:3px;color:#ff4fd8;text-shadow:0 0 8px #ff4fd8;animation:blink 1.4s steps(2) infinite;min-height:1.3em}
.cb-led.on{color:#39ff88;text-shadow:0 0 10px #39ff88;animation:none}
.cb-row{display:flex;align-items:center;justify-content:center;gap:26px;margin:12px 0 8px}
.coin{width:46px;height:46px;border-radius:50%;border:3px solid #b8860b;background:radial-gradient(circle at 35% 30%,#fff6b0,#ffd23f 45%,#d4a017);color:#8a5a00;font-size:20px;font-weight:900;cursor:grab;touch-action:none;position:relative;z-index:3;padding:0}
.coin.drag{cursor:grabbing;position:fixed;margin:0;pointer-events:none}
.slot{width:70px;height:96px;background:linear-gradient(#444,#222);border:3px solid #888;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;cursor:pointer;padding:0}
.slot .slit{width:8px;height:40px;background:#000;border-radius:3px;box-shadow:0 0 0 3px #666,0 0 12px #ff4fd8}
.slot .ret{color:#ffd23f;font:bold 12px monospace}.slot.hot{border-color:#39ff88;box-shadow:0 0 14px #39ff88}
.cb-credits{font:bold 18px monospace;color:#ffd23f}
.dropcoin{position:fixed;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6b0,#ffd23f 45%,#d4a017);border:3px solid #b8860b;z-index:20;pointer-events:none;animation:drop .55s ease-in forwards}
@keyframes drop{0%{transform:translateY(-70px) scaleX(1)}25%{transform:translateY(-50px) scaleX(.15)}50%{transform:translateY(-30px) scaleX(1)}75%{transform:translateY(-10px) scaleX(.15)}100%{transform:translateY(10px) scaleX(.05);opacity:0}}
#egg{position:fixed;left:0;top:0;width:0;height:0;z-index:30;pointer-events:none}
.eggrocket{position:fixed;left:-140px;width:110px;height:110px;animation:fly 3.2s linear forwards}
.eggrocket img{width:100%;height:100%}
.puff{position:fixed;width:26px;height:26px;border-radius:50%;background:#ffd0b0;opacity:.85;animation:puff 1.4s ease-out forwards}
@keyframes fly{to{transform:translateX(calc(100vw + 280px)) translateY(-120px) rotate(10deg)}}
@keyframes puff{to{transform:scale(2.6);opacity:0}}
.eggmsg{position:fixed;left:50%;top:18%;transform:translateX(-50%);background:#1b1446;border:3px solid #ffd23f;color:#ffd23f;font:900 18px monospace;padding:10px 16px;border-radius:10px;z-index:31}
@media (prefers-reduced-motion:reduce){.cb-led,.float,.blink{animation:none}.dropcoin{animation:none;opacity:0}}
