:root{
  --bg-deep:#0a0f24;
  --bg-elevated:#111a36;
  --bg-elevated-2:#1a2342;
  --accent:#4f7df5;
  --accent-2:#22d3a7;
  --accent-glow:rgba(79,125,245,0.35);
  --text-primary:#e8ecf4;
  --text-secondary:#8a93ad;
  --text-dim:#5b6480;
  --border:rgba(140,160,220,0.10);
  --border-strong:rgba(140,160,220,0.18);
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --shadow-lg:0 24px 60px rgba(0,0,0,0.5);
  --shadow-glow:0 0 0 1px rgba(79,125,245,0.35), 0 8px 28px rgba(79,125,245,0.25);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-deep);color:var(--text-primary);min-height:100vh;-webkit-font-smoothing:antialiased}

.contact-entry{
  position:relative;
  min-height:100vh;
  padding:80px 24px 60px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.entry-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.grid-layer{
  position:absolute;inset:-2px;
  background-image:
    linear-gradient(rgba(79,125,245,0.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(79,125,245,0.06) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse at center, black 30%, transparent 75%);
  animation:gridDrift 30s linear infinite;
}
@keyframes gridDrift{from{background-position:0 0}to{background-position:48px 48px}}

.orb{position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(110px);opacity:.45}
.orb-a{background:radial-gradient(circle,var(--accent) 0%,transparent 70%);top:-10%;left:-10%;animation:float 14s ease-in-out infinite}
.orb-b{background:radial-gradient(circle,var(--accent-2) 0%,transparent 70%);bottom:-15%;right:-12%;animation:float 18s ease-in-out infinite reverse}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,-30px)}}

.scanline{
  position:absolute;left:0;right:0;height:120px;
  background:linear-gradient(180deg,transparent,rgba(79,125,245,0.08),transparent);
  animation:scan 6s linear infinite;
}
@keyframes scan{0%{top:-10%}100%{top:110%}}

.entry-container{
  position:relative;z-index:1;
  max-width:1040px;width:100%;
  text-align:center;
}

.entry-tag{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px;
  background:rgba(79,125,245,0.08);
  border:1px solid rgba(79,125,245,0.25);
  border-radius:999px;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);
  backdrop-filter:blur(8px);
  margin-bottom:28px;
}
.tag-dot{width:6px;height:6px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 10px var(--accent-2);animation:pulse 1.6s ease-in-out infinite}
.tag-id{color:var(--text-dim);font-family:'JetBrains Mono',monospace;border-left:1px solid var(--border-strong);padding-left:10px}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}

.entry-title{
  font-size:clamp(48px,8vw,96px);
  font-weight:700;line-height:1;letter-spacing:-.04em;
  display:flex;justify-content:center;align-items:baseline;gap:.25em;flex-wrap:wrap;
  margin-bottom:24px;
}
.title-line{display:inline-block;opacity:0;transform:translateY(20px);animation:rise .8s ease forwards}
.title-line:nth-child(1){animation-delay:.1s}
.title-amp{color:var(--text-dim);font-weight:300;opacity:0;animation:rise .8s ease forwards;animation-delay:.25s;font-size:.7em}
.title-line:nth-child(3){animation-delay:.4s}
.gradient{
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 30px rgba(79,125,245,0.35));
}
@keyframes rise{to{opacity:1;transform:translateY(0)}}

.entry-subtitle{
  font-size:clamp(15px,1.6vw,18px);
  color:var(--text-secondary);
  max-width:620px;margin:0 auto 40px;line-height:1.65;
  opacity:0;animation:rise .8s ease forwards;animation-delay:.55s;
}
.hl{color:var(--text-primary);font-weight:600;border-bottom:1px dashed var(--border-strong)}

.channel-bar{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  max-width:780px;margin:0 auto 28px;
  background:rgba(17,26,54,0.6);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:14px;
  backdrop-filter:blur(12px);
  opacity:0;animation:rise .8s ease forwards;animation-delay:.7s;
}
.channel{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:10px 8px;
  background:var(--bg-elevated);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  cursor:pointer;
  transition:all .25s ease;
  position:relative;
}
.channel:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-glow)}
.ch-pulse{
  width:8px;height:8px;border-radius:50%;
  background:var(--accent-2);
  box-shadow:0 0 0 0 var(--accent-2);
  animation:ringPulse 2s ease-out infinite;
}
@keyframes ringPulse{
  0%{box-shadow:0 0 0 0 rgba(34,211,167,.7)}
  70%{box-shadow:0 0 0 10px rgba(34,211,167,0)}
  100%{box-shadow:0 0 0 0 rgba(34,211,167,0)}
}
.ch-label{font-size:11px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.1em}
.ch-state{font-size:12px;color:var(--text-primary);font-weight:600;font-family:'JetBrains Mono',monospace}

.entry-meta{
  display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:12px;color:var(--text-dim);
  font-family:'JetBrains Mono',monospace;
  opacity:0;animation:rise .8s ease forwards;animation-delay:.85s;
}
.dot-sep{opacity:.5}

@media (max-width:640px){
  .channel-bar{grid-template-columns:repeat(2,1fr)}
  .entry-title{font-size:48px}
}