:root {
  --bg: #050814;
  --ink: #e8f4ff;
  --muted: #8ea3c7;
  --cyan: #3ee0ff;
  --violet: #8b6bff;
  --pink: #ff4ecd;
  --line: rgba(62, 224, 255, .35);
  --panel: rgba(8, 16, 36, .78);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font-family: Sora, sans-serif;
  background: radial-gradient(1200px 600px at 80% -10%, rgba(139, 107, 255, .28), transparent 55%),
              radial-gradient(900px 500px at -10% 20%, rgba(62, 224, 255, .16), transparent 50%),
              var(--bg);
}
.sky {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(62, 224, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(62, 224, 255, .05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(circle at 50% 20%, #000 20%, transparent 75%);
}
.nav-glass {
  background: rgba(5, 8, 20, .72);
  border-bottom: 1px solid rgba(62, 224, 255, .18);
  backdrop-filter: blur(16px);
}
.navbar-toggler { border-color: var(--line); }
.navbar-toggler-icon { filter: invert(1); }
.brand {
  font-family: Orbitron, sans-serif;
  letter-spacing: .08em;
  color: var(--ink) !important;
  display: flex;
  align-items: center;
  gap: .55rem;
}
.brand-mark {
  width: 14px;
  height: 14px;
  border: 2px solid var(--cyan);
  transform: rotate(45deg);
  box-shadow: 0 0 12px var(--cyan);
}
.nav-link { color: var(--muted) !important; }
.nav-link.active, .nav-link:hover { color: var(--cyan) !important; }
.balance-pill, .btn-glow {
  border: 1px solid var(--line);
  color: var(--cyan);
  background: linear-gradient(180deg, rgba(62, 224, 255, .16), rgba(139, 107, 255, .12));
  border-radius: 999px;
  padding: .35rem .8rem;
  text-decoration: none;
  box-shadow: 0 0 18px rgba(62, 224, 255, .15);
}
.btn-glow:hover { color: #fff; }
.panel {
  background: var(--panel);
  border: 1px solid rgba(62, 224, 255, .2);
  border-radius: 18px;
  padding: 1.25rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .28);
  position: relative;
}
.panel:before, .panel:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border: 1px solid var(--cyan);
}
.panel:before { top: 8px; left: 8px; border-right: 0; border-bottom: 0; }
.panel:after { right: 8px; bottom: 8px; border-left: 0; border-top: 0; }
.hero {
  padding: 3.2rem 0 1.5rem;
}
.kicker {
  color: var(--cyan);
  letter-spacing: .22em;
  font-size: .75rem;
  text-transform: uppercase;
}
h1, h2, .font-display { font-family: Orbitron, sans-serif; }
.lede { color: var(--muted); max-width: 640px; }
.stat {
  font-family: Orbitron, sans-serif;
  font-size: 1.4rem;
  color: var(--cyan);
}
.sci-input, .form-select, .form-control {
  background: rgba(4, 10, 24, .85) !important;
  border: 1px solid rgba(62, 224, 255, .28) !important;
  color: var(--ink) !important;
}
.form-control:focus, .form-select:focus {
  box-shadow: 0 0 0 .2rem rgba(62, 224, 255, .15) !important;
}
.table { --bs-table-bg: transparent; --bs-table-color: var(--ink); --bs-table-border-color: rgba(62, 224, 255, .15); }
.table thead th { color: var(--cyan); font-weight: 500; }
.flash { border-radius: 12px; padding: .8rem 1rem; margin-bottom: 1rem; }
.flash.ok { background: rgba(62, 224, 255, .12); border: 1px solid var(--line); }
.flash.err { background: rgba(255, 78, 205, .12); border: 1px solid rgba(255, 78, 205, .45); }
.site-foot { color: var(--muted); padding: 2rem 0 2.5rem; font-size: .9rem; }
.badge-live { background: rgba(62, 224, 255, .15); color: var(--cyan); }
.badge-wait { background: rgba(139, 107, 255, .18); color: #d7cbff; }
.badge-bad { background: rgba(255, 78, 205, .15); color: #ffc0ea; }
a { color: var(--cyan); }
.service-card { height: 100%; }
.price { font-family: Orbitron, sans-serif; color: #fff; }
.muted { color: var(--muted); }
.admin-side a { display: block; padding: .45rem .2rem; color: var(--muted); text-decoration: none; }
.admin-side a.active, .admin-side a:hover { color: var(--cyan); }