* { margin:0; padding:0; box-sizing:border-box; }
body {
  background:#000; color:#0f0; font-family:'Inter',sans-serif;
  overflow-x:hidden; position:relative;
}
.matrix {
  position:fixed; top:0; left:0; width:100%; height:100%;
  background:linear-gradient(to bottom, rgba(0,0,0,0.8), #000);
  z-index:-1; opacity:0.3;
}
.matrix::before {
  content:""; position:absolute; top:0; left:0; right:0; bottom:0;
  background:repeating-linear-gradient(0deg, transparent, transparent 50px, #0f0 50px, #0f0 51px);
  animation:rain 10s linear infinite; opacity:0.1;
}
@keyframes rain { 0% { transform:translateY(-100px); } 100% { transform:translateY(100vh); } }

.container { max-width:800px; margin:10vh auto; padding:2rem; text-align:center; }
h1 {
  font-family:'Orbitron',sans-serif; font-size:4rem; margin-bottom:1rem;
  background:linear-gradient(90deg, #0f0, #ff0, #0ff);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow:0 0 20px #0f0;
}
.dollar {
  color:#ff0; cursor:pointer; position:relative;
}
.dollar:hover::after {
  content:" Registered 6:47 PM MST • Live 7:30 PM";
  position:absolute; bottom:-2rem; left:50%; transform:translateX(-50%);
  font-size:0.8rem; color:#0ff; white-space:nowrap;
}
.tagline { font-size:1.5rem; margin:1rem 0; color:#0ff; }
.tagline a { color:#ff0; text-decoration:underline; }

.proof-grid {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:1rem; margin:3rem 0;
}
.proof {
  background:rgba(0,255,0,0.1); padding:1rem; border:1px solid #0f0;
  border-radius:12px;
}
.proof img {
  width:100%; max-height:150px; object-fit:contain;
  border:1px dashed #0f0; margin-bottom:0.5rem;
}
.proof p { font-size:0.9rem; margin-top:0.5rem; }

.challenge { margin:3rem 0; font-weight:bold; font-size:1.3rem; }
.challenge input {
  background:#111; color:#0f0; border:2px solid #0f0;
  padding:0.5rem 1rem; font-size:1.2rem; width:80px; text-align:center;
  margin:0 1rem; border-radius:8px;
}
.challenge a { color:#ff0; }

.easter { margin-top:4rem; font-size:0.9rem; color:#0ff; opacity:0.7; }

/* Fake Grok AI Styling */
.xai-query {
  margin: 3rem 0;
  background: rgba(0,255,0,0.1);
  padding: 2rem;
  border: 1px solid #0f0;
  border-radius: 12px;
}
.xai-query h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 2rem;
  color: #0ff;
  margin-bottom: 1rem;
}
#query-form {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}
#query-input {
  background: #111;
  color: #0f0;
  border: 2px solid #0f0;
  padding: 0.5rem 1rem;
  font-size: 1.2rem;
  width: 60%;
  min-width: 200px;
  border-radius: 8px;
}
#query-form button {
  background: #0f0;
  color: #000;
  border: none;
  padding: 0.5rem 1rem;
  font-size: 1.2rem;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.3s;
}
#query-form button:hover {
  background: #ff0;
}
#response-container {
  margin-top: 2rem;
  background: #111;
  padding: 1rem;
  border: 1px dashed #0f0;
  border-radius: 8px;
  color: #0ff;
  min-height: 100px;
  text-align: left;
}
#response-container p {
  margin: 0.5rem 0;
  line-height: 1.5;
}
#response-container strong {
  color: #0f0;
}
.note {
  font-size: 0.8rem;
  color: #0ff;
  margin-top: 1rem;
  opacity: 0.8;
}
.note a {
  color: #ff0;
  text-decoration: underline;
}

/* Typing Animation */
.typing {
  color: #0ff;
  font-style: italic;
}
.dots {
  display: inline-block;
  width: 1.5em;
  text-align: left;
}
.dots::after {
  content: '';
  animation: dots 1.5s infinite;
}
@keyframes dots {
  0%, 20% { content: ''; }
  40% { content: '.'; }
  60% { content: '..'; }
  80%, 100% { content: '...'; }
}
