:root {
  --grid: rgba(0, 255, 153, 0.08);
  --accent: #00dfa2;
  --accent-2: #00ff95;
}

* { box-sizing: border-box; }

body {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: radial-gradient(1200px 600px at 20% -10%, rgba(0, 223, 162, .07), transparent),
              radial-gradient(1200px 600px at 100% 10%, rgba(0, 223, 162, .05), transparent),
              #0b0d0f;
  color: #e6f5ee;
  min-height: 100vh;
}

.navbar.bg-dark-opaque {
  background: rgba(7,9,10,0.7);
  backdrop-filter: blur(6px);
}

.brand-glyph {
  font-family: 'Fira Code', monospace;
  color: var(--accent);
  text-shadow: 0 0 10px rgba(0, 255, 149, .45);
}

.hero .terminal {
  background: #0b0f0c;
  color: #baf3da;
  border: 1px solid rgba(0, 255, 149, .25);
  border-radius: 14px;
  padding: 14px;
  box-shadow: inset 0 0 35px rgba(0,0,0,.5), 0 0 40px rgba(0, 255, 149, .07);
}

.glass-card {
  background: rgba(10, 12, 11, 0.65);
  border: 1px solid rgba(0, 255, 149, .18);
  border-radius: 18px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.4) inset,
    0 8px 30px rgba(0, 0, 0, .3),
    0 0 60px rgba(0, 255, 149, .03);
}

.section-title {
  font-family: 'Fira Code', monospace;
  letter-spacing: .5px;
  color: #d7ffe8;
  text-shadow: 0 0 12px rgba(0, 255, 149, .3);
}

.region-list {
  max-height: 320px;
  overflow: auto;
  border: 1px dashed rgba(0, 255, 149, .22);
  border-radius: 10px;
  padding: 8px;
}

.table thead th {
  font-family: 'Fira Code', monospace;
  font-weight: 500;
  color: #afffdd;
}

.badge.text-bg-dark {
  background: rgba(12, 14, 14, 0.75);
}

.mono { font-family: 'Fira Code', monospace; }
.big-ip { font-size: clamp(20px, 4vw, 42px); line-height: 1.2; }

/* subtle 90s hacker grid */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background:
    linear-gradient(0deg, var(--grid) 1px, transparent 1px) 0 0 / 0.5rem 0.5rem,
    linear-gradient(90deg, var(--grid) 1px, transparent 1px) 0 0 / 0.5rem 0.5rem;
  pointer-events: none;
  mask: radial-gradient(70% 30% at 50% -10%, rgba(255,255,255,.9), transparent 60%);
}

.glitch {
  position: relative;
  display: inline-block;
}
.glitch::before, .glitch::after {
  content: attr(data-text);
  position: absolute;
  left: 0;
}
.glitch::before {
  text-shadow: -1px 0 var(--accent);
  clip-path: polygon(0 2%, 100% 2%, 100% 44%, 0 44%);
  animation: noise-1 3s infinite linear alternate-reverse;
}
.glitch::after {
  text-shadow: 1px 0 #62ffd1;
  clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0 100%);
  animation: noise-2 2.7s infinite linear alternate-reverse;
}
@keyframes noise-1 { 0% { transform: translate(0);} 100% { transform: translate(2px);}}
@keyframes noise-2 { 0% { transform: translate(0);} 100% { transform: translate(-2px);}}

a.link-success { text-decoration: none; }
a.link-success:hover { text-decoration: underline; }

.vr{width:1px;background:rgba(0,255,149,.2);}
/* Readability for results table */
#resultsTable td.num, #resultsTable th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
#resultsTable td.host { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#resultsTable td.region { white-space: nowrap; }