
:root {
  --bg: #05060d;
  --fg: #E6F7FF;
  --muted:#8ad7ff;
  --neon: #00E5FF;
  --neon2:#00FF88;
  --panel: rgba(0,0,0,.35);
  --border: rgba(0,229,255,.35);
}
html, body { background: var(--bg); color: var(--fg); }
a { color: var(--neon); }
.tron-hero {
  background: url('./assets/tron-grid.png') center/cover no-repeat, linear-gradient(180deg, rgba(0,229,255,.12), rgba(0,255,136,.06));
  border:1px solid var(--border);
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 10px 40px rgba(0,0,0,.5), 0 0 30px rgba(0,229,255,.15) inset;
}
.tron-panel {
  background: var(--panel);
  border:1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.tron-btn {
  display:inline-block; padding:12px 18px; border-radius: 14px;
  background: linear-gradient(90deg, var(--neon), var(--neon2));
  color:#031015; font-weight:900; text-decoration:none;
  border:1px solid rgba(230,247,255,.25);
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
pre, code {
  background: #0b0f1e !important; color: #eaffff !important;
  border:1px solid rgba(0,229,255,.25); border-radius: 10px; padding:8px 10px;
  box-shadow: 0 0 12px rgba(0,229,255,.15) inset;
}
hr { border:none; border-top:1px solid var(--border); }
.badges img { margin-right:6px }
