/* CYBERMINDCOLONY — NEXUS Dimensional (Claude html + Master Blueprint) */
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;600;700&family=Space+Mono:wght@400;700&display=swap');

:root {
  --neon-cyan: #00ffe7;
  --neon-violet: #bf00ff;
  --neon-gold: #ffb700;
  --neon-rose: #ff2d6b;
  --glass-bg: rgba(8, 8, 20, 0.55);
  --glass-border: rgba(255,255,255,0.08);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { min-height: 400vh; overflow-x: hidden; scroll-behavior: smooth; }
html, body {
  width: 100%;
  background: #000005;
  color: #e8f4ff;
  font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}
#nexus-canvas { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.nexus-ui { position: relative; z-index: 10; min-height: 100vh; }
.nexus-hud {
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 100vh; padding: clamp(12px, 3vw, 28px);
  pointer-events: none;
}
.nexus-hud a, .nexus-hud button, .nexus-hud input, .agent-orbit-card { pointer-events: auto; }
.nexus-brand {
  font-family: 'Space Mono', monospace;
  font-size: clamp(11px, 2vw, 16px);
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.92);
}
.nexus-brand span { color: var(--neon-cyan); }
.scanlines {
  position: fixed; inset: 0; pointer-events: none; z-index: 5;
  background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, rgba(0,0,0,0.04) 3px, rgba(0,0,0,0.04) 4px);
}
.vignette {
  position: fixed; inset: 0; pointer-events: none; z-index: 4;
  background: radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,0.88) 100%);
}
.status-dot {
  display: flex; align-items: center; gap: 8px;
  font-family: 'Space Mono', monospace; font-size: 10px;
  color: rgba(255,255,255,0.45); letter-spacing: 0.2em;
}
.status-dot .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--neon-cyan); box-shadow: 0 0 8px var(--neon-cyan);
  animation: nexus-pulse 2s ease-in-out infinite;
}
.nexus-nav { display: flex; flex-wrap: wrap; gap: 8px; }
.nexus-nav a {
  font-size: 10px; letter-spacing: 0.12em; text-decoration: none; color: #b8d4e8;
  border: 1px solid rgba(126, 232, 255, 0.35); padding: 6px 12px; border-radius: 999px;
  backdrop-filter: blur(8px); background: rgba(0, 40, 80, 0.25);
}
.nexus-nav a:hover { color: #fff; border-color: #ffd87a; box-shadow: 0 0 20px rgba(255, 216, 122, 0.35); }
.nexus-nav a.nexus-cta-active { border-color: #ffd87a; color: #fff; box-shadow: 0 0 16px rgba(255, 216, 122, 0.3); }
.nexus-hero { text-align: center; max-width: 720px; margin: 0 auto; }
.nexus-hero h1 { font-size: clamp(20px, 4.5vw, 40px); font-weight: 300; }
.nexus-hero p { font-size: clamp(11px, 1.8vw, 14px); opacity: 0.85; line-height: 1.6; margin-top: 8px; }
.scroll-orbit-hint {
  text-align: center; font-size: 10px; letter-spacing: 0.25em; opacity: 0.55;
  animation: nexus-pulse 2s ease-in-out infinite;
}
@keyframes nexus-pulse { 50% { opacity: 1; } }
.nexus-panel {
  position: fixed; right: 12px; top: 50%; transform: translateY(-50%);
  width: min(300px, 44vw); padding: 16px;
  background: rgba(0, 12, 28, 0.6); border: 1px solid rgba(126, 232, 255, 0.45);
  border-radius: 14px; backdrop-filter: blur(14px);
  box-shadow: 0 0 50px rgba(0, 180, 255, 0.12);
}
.nexus-panel h2 { font-size: 12px; letter-spacing: 0.2em; color: #7ee8ff; }
.nexus-panel p { font-size: 12px; line-height: 1.5; opacity: 0.9; margin-top: 6px; }
.nexus-main-content {
  max-width: 640px; margin: 2rem auto; padding: 1.5rem;
  background: rgba(0, 12, 28, 0.5); border: 1px solid rgba(126, 232, 255, 0.25);
  border-radius: 12px; backdrop-filter: blur(10px);
}
.lang-bar { display: flex; gap: 6px; margin-top: 8px; }
.lang-bar button {
  font-size: 10px; padding: 4px 10px; border-radius: 999px;
  border: 1px solid rgba(126,232,255,.4); background: transparent; color: #b8d4e8; cursor: pointer;
}
.lang-bar button.active { background: rgba(126,232,255,.2); color: #fff; }