*{margin:0;padding:0;box-sizing:border-box}
html{cursor:none;background:#000}
body{
  background:#000;
  color:#fff;
  font-family:"Times New Roman",Times,serif;
  font-size:17px;
  line-height:1.5;
  overflow-x:hidden;
  min-height:100vh;
}
a{color:#00e0ff;text-decoration:underline}
a:hover{color:#ff2d95}
::selection{background:#ff2d95;color:#000}
hr{border:none;border-top:1px solid #2a2a2a;margin:18px 0}
img{image-rendering:pixelated}

/* scanlines + flicker overlay */
.crt{position:fixed;inset:0;pointer-events:none;z-index:9998;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.18) 2px 3px);
  mix-blend-mode:multiply}
.flicker{position:fixed;inset:0;pointer-events:none;z-index:9997;
  background:rgba(255,45,149,0);animation:flk 3.2s steps(2) infinite}
@keyframes flk{0%,97%{background:rgba(0,0,0,0)}98%{background:rgba(120,0,80,.05)}100%{background:rgba(0,0,0,.03)}}

/* custom cursor (microphone) */
.cur-dot{position:fixed;left:0;top:0;width:26px;height:26px;font-size:24px;
  line-height:26px;text-align:center;transform:translate(-50%,-50%);
  pointer-events:none;z-index:10000;will-change:transform;
  filter:drop-shadow(0 0 6px rgba(255,45,149,.7)) drop-shadow(0 0 2px rgba(0,224,255,.6))}
.cur-dot::after{content:"🎤"}
.cur-ring{position:fixed;left:0;top:0;width:40px;height:40px;border-radius:50%;
  border:2px solid #ff2d95;z-index:9999;pointer-events:none;
  transform:translate(-50%,-50%);transition:width .18s,height .18s,border-color .18s,opacity .18s;
  opacity:.5}
.cur-ring.hot{width:60px;height:60px;border-color:#00e0ff;opacity:.9}
.cur-trail{position:fixed;left:0;top:0;width:5px;height:5px;border-radius:50%;
  background:#ff2d95;z-index:9996;pointer-events:none;transform:translate(-50%,-50%);opacity:.5}

/* layout */
.wrap{max-width:680px;margin:0 auto;padding:0 16px 80px;
  background:rgba(5,3,10,0.94);box-shadow:0 0 0 1px rgba(255,45,149,0.12),0 0 60px rgba(0,0,0,0.6)}
.topbar{font-size:12px;letter-spacing:.02em;text-align:center;padding:8px 0;
  color:#5a5a5a;border-bottom:1px solid #1c1c1c;word-spacing:2px;
  background:rgba(5,3,10,0.82);position:relative;z-index:5}
.topbar a{color:#7ab8d8;text-decoration:none}
.topbar a:hover{color:#00e0ff}
.topbar .g{color:#ffb700}

/* title */
.title-wrap{text-align:center;padding:40px 0 6px}
.wordart{
  font-family:"Times New Roman",serif;font-weight:bold;font-size:clamp(48px,15vw,96px);
  line-height:.9;letter-spacing:-.02em;
  background:linear-gradient(180deg,#fff 0%,#ffe680 28%,#ffb700 55%,#ff2d95 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:2px #000;
  filter:drop-shadow(3px 3px 0 #000) drop-shadow(0 0 18px rgba(255,45,149,.5));
  display:inline-block;
}
.wordart.glitch{animation:gl 2.4s infinite}
@keyframes gl{0%,88%,100%{transform:translate(0,0);filter:drop-shadow(3px 3px 0 #000) drop-shadow(0 0 18px rgba(255,45,149,.5))}
 90%{transform:translate(-2px,0);filter:drop-shadow(3px 3px 0 #000) drop-shadow(2px 0 0 #00e0ff) drop-shadow(-2px 0 0 #ff2d95)}
 93%{transform:translate(2px,1px);filter:drop-shadow(3px 3px 0 #000) drop-shadow(-2px 0 0 #00e0ff) drop-shadow(2px 0 0 #ff2d95)}
 96%{transform:translate(-1px,-1px)}}
.subtitle{text-align:center;color:#cfcfcf;font-size:14px;margin-top:2px;letter-spacing:.04em;
  text-shadow:0 2px 8px #000,0 0 3px #000,1px 1px 0 #000}
.tagline{text-align:center;margin-top:14px;font-size:20px;text-shadow:0 2px 8px #000,1px 1px 0 #000}
.tagline .teal{color:#0fb;font-weight:bold;text-shadow:1px 1px 0 #000}
.tagline .w{color:#fff;background:#000;padding:1px 8px;border:2px solid #00e0ff;
  box-shadow:2px 2px 0 #ff2d95;display:inline-block;margin-left:4px}

/* hero image */
.hero-img{display:block;margin:22px auto 6px;width:min(86%,440px);
  border:3px solid #000;outline:2px solid #00e0ff;box-shadow:6px 6px 0 #ff2d95;
  image-rendering:auto}

/* badge row */
.badges{text-align:center;margin:14px 0;background:rgba(5,3,10,0.55);
  padding:8px 4px;border-radius:2px;display:block;width:100%;box-sizing:border-box}
.badge{display:inline-block;border:1px solid #00e0ff;color:#00e0ff;font-family:monospace;
  font-size:11px;padding:2px 8px;margin:2px;letter-spacing:.06em}
.badge.pink{border-color:#ff2d95;color:#ff2d95}

/* dialog popup */
.dialog{max-width:420px;margin:24px auto 0;background:#c0c0c0;color:#000;
  border:2px outset #fff;box-shadow:4px 4px 0 #000;font-family:"Times New Roman",serif}
.dialog .dt{background:#0000aa;color:#fff;font-weight:bold;font-size:13px;padding:3px 8px;
  display:flex;justify-content:space-between}
.dialog .db{padding:16px;font-size:15px;text-align:center}
.dialog .db b{color:#7a1a5e}
.dialog .db .y{display:inline-block;background:#000;color:#fff;border:2px outset #fff;
  padding:3px 16px;margin:0 6px;cursor:pointer;font-family:monospace}
.dialog .db .y:hover{background:#ff2d95}
.dialog .db .n{display:inline-block;background:#c0c0c0;color:#000;border:2px outset #fff;
  padding:3px 16px;margin:0 6px;cursor:pointer;font-family:monospace}
.dialog .db .n:hover{background:#00e0ff}

/* headings */
h2{color:#ffb700;font-size:22px;font-weight:bold;margin:28px 0 6px;letter-spacing:.02em}
h2 .cy{color:#00e0ff}
h3{color:#fff;font-size:16px;margin:14px 0 4px}
p{margin:8px 0;color:#dcdcdc}
p .r{color:#ff4d4d}
p .o{color:#ffb700}
p .g{color:#0fb;font-style:italic}
p .cy{color:#00e0ff;font-family:monospace;font-size:15px}
p .b{color:#fff;font-weight:bold}

/* terminal box */
.term{border:1px solid #00e0ff;background:#001016;color:#0fa;padding:12px 14px;
  font-family:monospace;font-size:13px;line-height:1.6;margin:12px 0;
  box-shadow:inset 0 0 18px rgba(0,224,255,.12)}
.term .k{color:#ff2d95}
.term .v{color:#00e0ff;word-break:break-all}
.term .c{color:#5a7a8a}

/* steps */
ol.steps{margin:6px 0 6px 22px;color:#dcdcdc}
ol.steps li{margin:5px 0}
ol.steps li b{color:#ffb700}

/* roadmap */
.rm{margin:6px 0}
.rm .ph{color:#ff2d95;font-weight:bold;font-family:monospace;font-size:13px}
.rm .row{margin:6px 0;padding-bottom:6px;border-bottom:1px dashed #333}
.rm .row span{color:#8a8a8a}

/* scattered images */
.scatter{position:relative;margin:14px 0;text-align:center;min-height:120px}
.scatter img{display:inline-block;width:120px;margin:4px;border:2px solid #000;
  outline:1px solid #2a2a2a}
.scatter img.l{float:left;width:150px;margin-right:10px}
.scatter img.r{float:right;width:140px;margin-left:10px}
.scatter img.s{width:90px}
.scatter:after{content:"";display:block;clear:both}
.jitter{display:inline-block;animation:jt 4s infinite}
@keyframes jt{0%,94%,100%{transform:translate(0,0) rotate(0)}96%{transform:translate(2px,-1px) rotate(-1deg)}98%{transform:translate(-1px,1px) rotate(1deg)}}

/* CA slot (top, live from portal) */
.ca-slot{display:flex;align-items:center;gap:10px;margin:14px 0 4px;padding:10px 12px;
  border:1px solid #00e0ff;background:#001016;box-shadow:3px 3px 0 #000;flex-wrap:wrap}
.ca-slot .ca-lab{font-family:monospace;font-size:11px;color:#ff2d95;letter-spacing:.14em;white-space:nowrap}
.ca-slot .ca-addr{flex:1;min-width:140px;font-family:monospace;font-size:14px;color:#5a7a8a;
  word-break:break-all;letter-spacing:.02em}
.ca-slot .ca-addr.live{color:#00e0ff;text-shadow:0 0 8px rgba(0,224,255,.5)}
.ca-slot .ca-copy{font-family:monospace;font-size:11px;letter-spacing:.1em;color:#000;background:#00e0ff;
  border:2px solid #00e0ff;padding:3px 10px;cursor:pointer;text-transform:uppercase;box-shadow:2px 2px 0 #ff2d95}
.ca-slot .ca-copy:hover{background:#ff2d95;border-color:#ff2d95;color:#fff;box-shadow:2px 2px 0 #00e0ff}
.ca-slot .ca-copy:disabled{background:#1a1a1a;border-color:#2a2a2a;color:#5a5a5a;cursor:not-allowed;box-shadow:none}
@media(max-width:520px){.ca-slot .ca-addr{font-size:12px}}

/* full-page bg image (pitbull-dog studio shot) + dark overlay for readability */
body{
  background-color:#05030a;
  background-image:url("assets/bg.jpg");
  background-repeat:no-repeat;background-size:cover;background-position:center;
  background-attachment:fixed;
}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(5,3,10,0.96) 0%,rgba(5,3,10,0.90) 30%,rgba(5,3,10,0.90) 100%)}

/* big anthem button */
.anthem-big{text-align:center;margin:22px 0 6px}
.play-btn{display:inline-flex;align-items:center;gap:14px;cursor:pointer;
  font-family:monospace;font-size:26px;font-weight:bold;letter-spacing:.12em;
  color:#000;background:linear-gradient(180deg,#ffe680 0%,#ffb700 55%,#ff2d95 100%);
  border:3px solid #000;padding:18px 38px;text-transform:uppercase;
  box-shadow:7px 7px 0 #000,0 0 24px rgba(255,45,149,.55);transition:transform .08s}
.play-btn:hover{transform:translate(2px,2px);box-shadow:5px 5px 0 #000,0 0 30px rgba(0,224,255,.6)}
.play-btn:active{transform:translate(7px,7px);box-shadow:0 0 0 #000}
.play-btn .pb-icon{font-size:30px;line-height:1}
.now-playing{font-family:monospace;font-size:12px;color:#5a7a8a;letter-spacing:.1em;margin-top:10px}
.now-playing.on{color:#00e0ff;text-shadow:0 0 8px rgba(0,224,255,.5)}
@media(max-width:520px){.play-btn{font-size:20px;padding:14px 24px}.play-btn .pb-icon{font-size:24px}}

/* anthem player (legacy small, unused) */
.anthem{border:1px solid #ff2d95;background:#0a0008;padding:14px 16px;margin:18px 0;
  box-shadow:3px 3px 0 #000;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.anthem .lab{font-family:monospace;font-size:12px;color:#ff2d95;letter-spacing:.12em;white-space:nowrap}
.anthem .lab b{color:#00e0ff}
.anthem audio{flex:1;min-width:200px;height:32px;filter:invert(.9) hue-rotate(170deg) saturate(2)}
.anthem .skull{font-size:20px}
@media(max-width:520px){.anthem audio{min-width:160px}}
footer{border-top:1px solid #2a2a2a;margin-top:30px;padding:18px 0;text-align:center;
  color:#5a5a5a;font-size:12px;line-height:1.7}
footer .b{color:#ffb700}
footer .cy{color:#3a6a8a}
.shout{text-align:center;font-size:13px;color:#7a1a5e;letter-spacing:.16em;
  margin:18px 0;font-family:monospace}

@media(max-width:520px){
  body{font-size:16px}
  .scatter img.l,.scatter img.r{float:none;width:130px}
}