:root{
  --ink:#05010a;
  --magenta:#ff2e97;
  --cyan:#22e6ff;
  --yellow:#ffe14d;
  --green:#44ff9f;
  --purple:#b15cff;
  --glow: 1;            /* tweakable glow intensity multiplier */
  --scanline-op: 0.22;  /* tweakable scanline opacity */
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--ink);
  color:#f4f0ff;
  font-family:'JetBrains Mono', ui-monospace, monospace;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{ background:var(--magenta); color:#05010a; }

.font-arcade{ font-family:'Press Start 2P', 'JetBrains Mono', monospace; }
.font-mono{ font-family:'JetBrains Mono', ui-monospace, monospace; }

/* ---- neon text glows ---- */
.neon-mag{ color:#ffd8ec; text-shadow:0 0 calc(6px*var(--glow)) var(--magenta), 0 0 calc(18px*var(--glow)) var(--magenta), 0 0 calc(40px*var(--glow)) rgba(255,46,151,.55); }
.neon-cy{ color:#d7fbff; text-shadow:0 0 calc(6px*var(--glow)) var(--cyan), 0 0 calc(18px*var(--glow)) var(--cyan), 0 0 calc(40px*var(--glow)) rgba(34,230,255,.5); }
.neon-yl{ color:#fff6d2; text-shadow:0 0 calc(6px*var(--glow)) var(--yellow), 0 0 calc(16px*var(--glow)) var(--yellow), 0 0 calc(34px*var(--glow)) rgba(255,225,77,.5); }
.neon-gr{ color:#daffe9; text-shadow:0 0 calc(6px*var(--glow)) var(--green), 0 0 calc(16px*var(--glow)) var(--green), 0 0 calc(34px*var(--glow)) rgba(68,255,159,.5); }

/* ---- force-field gradient borders ---- */
.ff{
  background:linear-gradient(120deg,var(--magenta),var(--purple) 38%,var(--cyan) 70%,var(--green));
  background-size:280% 280%;
  padding:2px;
}
.ff-anim{ animation:ffshift 7s linear infinite; }
.ff-inner{ background:#08030f; height:100%; }
@keyframes ffshift{ 0%{background-position:0% 50%} 100%{background-position:280% 50%} }

.panel{ background:linear-gradient(180deg,#0c0517,#070210); }

/* ---- scanline + crt overlay ---- */
.scanlines::after{
  content:""; position:fixed; inset:0; z-index:60; pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,var(--scanline-op)) 0px, rgba(0,0,0,var(--scanline-op)) 1px, transparent 2px, transparent 3px);
  mix-blend-mode:multiply;
}
.vignette::before{
  content:""; position:fixed; inset:0; z-index:59; pointer-events:none;
  background:radial-gradient(125% 95% at 50% 35%, transparent 55%, rgba(0,0,0,.55) 100%);
}

/* ---- animations ---- */
@keyframes beamPulse{ 0%,100%{opacity:.55; filter:brightness(1)} 50%{opacity:1; filter:brightness(1.5)} }
@keyframes scanbar{ 0%{transform:translateX(-100%)} 100%{transform:translateX(100%)} }
@keyframes ledBlink{ 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes btnFlash{ 0%,100%{box-shadow:0 0 calc(10px*var(--glow)) var(--magenta), 0 0 calc(34px*var(--glow)) rgba(255,46,151,.65); }
                     50%{box-shadow:0 0 calc(20px*var(--glow)) var(--magenta), 0 0 calc(62px*var(--glow)) rgba(255,46,151,.95); } }
@keyframes shipBob{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }
@keyframes marquee{ 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes ringPulse{ 0%{transform:scale(.6);opacity:.9} 100%{transform:scale(1.5);opacity:0} }

.scanbar-track{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.scanbar{ position:absolute; top:0; bottom:0; width:42%;
  background:linear-gradient(90deg, transparent, rgba(34,230,255,.12), rgba(34,230,255,.28), transparent);
  animation:scanbar 5.5s linear infinite; }

.btn-flash{ animation:btnFlash 1.6s ease-in-out infinite; }

/* arcade nav buttons */
.arc-btn{ position:relative; letter-spacing:.05em; transition:.18s ease; }
.arc-btn:hover{ color:#08030f; }
.arc-btn::before{ content:""; position:absolute; inset:0; background:var(--cyan); transform:scaleY(0); transform-origin:bottom; transition:.18s ease; z-index:-1; }
.arc-btn:hover::before{ transform:scaleY(1); box-shadow:0 0 18px var(--cyan); }

/* portfolio rainbow hover */
.cargo:hover .ff{ animation:ffshift 2.4s linear infinite; }
.cargo .thumb{ filter:grayscale(.55) brightness(.7); transition:.3s ease; }
.cargo:hover .thumb{ filter:grayscale(0) brightness(1); }

/* placeholder thumbs */
.thumb-stripe{
  background-image:repeating-linear-gradient(45deg, rgba(177,92,255,.16) 0 10px, rgba(34,230,255,.10) 10px 20px);
}

/* form fields */
.console-field{
  background:#0a0414; border:1px solid #2a1840; color:#eafff7;
  font-family:'JetBrains Mono', monospace; letter-spacing:.03em;
  outline:none; transition:.18s ease;
}
.console-field:focus{ border-color:var(--cyan); box-shadow:0 0 0 1px var(--cyan), 0 0 22px rgba(34,230,255,.35); background:#0b0618; }
.console-field::placeholder{ color:#5a4a76; }
select.console-field option{ background:#0a0414; }

/* led */
.led{ width:11px; height:11px; border-radius:50%; display:inline-block; }
.led-on-g{ background:var(--green); box-shadow:0 0 8px var(--green),0 0 16px rgba(68,255,159,.7); }
.led-on-r{ background:#ff3b6b; box-shadow:0 0 8px #ff3b6b,0 0 16px rgba(255,59,107,.7); }
.led-off{ background:#3a1f33; box-shadow:inset 0 0 4px #000; }

/* toggle switch */
.tgl{ width:54px; height:26px; background:#16091f; border:1px solid #3a2350; position:relative; cursor:pointer; transition:.2s; }
.tgl-knob{ position:absolute; top:1px; left:1px; width:22px; height:22px; background:linear-gradient(180deg,#3a2350,#1a0d28); transition:.2s ease; }
.tgl.on{ border-color:var(--green); box-shadow:0 0 14px rgba(68,255,159,.4) inset; }
.tgl.on .tgl-knob{ left:29px; background:linear-gradient(180deg,var(--green),#1f9a63); box-shadow:0 0 10px var(--green); }

.hr-grad{ height:2px; background:linear-gradient(90deg, transparent, var(--magenta), var(--purple), var(--cyan), transparent); }

.grid-floor{
  background:
    linear-gradient(transparent 0, transparent calc(100% - 1px), rgba(34,230,255,.25) 100%),
    linear-gradient(90deg, rgba(177,92,255,.18) 1px, transparent 1px);
  background-size: 100% 100%, 44px 44px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; }
}

/* anchor offset for fixed header */
section[id]{ scroll-margin-top:96px; }

@media (max-width: 900px){
  .hero-grid{ grid-template-columns:1fr !important; }
  .comms-grid{ grid-template-columns:1fr !important; }
}

/* standalone-page intro band */
.page-intro{ padding:54px 24px 8px; text-align:center; }