/* ============================================================
   BASE — reset, design tokens, typography, global a11y rules
   ============================================================ */

:root{
  /* backgrounds */
  --bg:#05060e;
  --panel:#10162a;
  --panel-2:#080c19;
  --panel-3:#141b31;
  --panel-4:#0a0e1d;
  --panel-translucent: rgba(13,18,36,0.55);

  /* brand */
  --accent:#3B82F6;
  --accent-2:#1d4ed8;
  --success:#34D399;

  /* text (contrast-checked against --bg, WCAG AA) */
  --text-primary:#eef1fa;
  --text-secondary:#c9d2ea;
  --text-tertiary:#9aa5c7;
  --text-muted:#8590b3;

  --link:#8FB4FF;
  --link-hover:#CFE0FF;

  /* borders */
  --border-soft: rgba(140,170,255,0.10);
  --border: rgba(140,170,255,0.16);
  --border-strong: rgba(140,170,255,0.25);
  --border-accentish: rgba(140,170,255,0.22);

  /* type */
  --mono: 'JetBrains Mono', monospace;
  --display: 'Space Grotesk', sans-serif;
}

*{ box-sizing:border-box }

html,body{ margin:0; padding:0; background:var(--bg) }
html{ scroll-padding-top:92px }

body{
  color:var(--text-primary);
  font-family:var(--display);
  overflow-x:hidden;
  padding-top:72px;
}

@media (max-width:860px){
  body{ padding-top:68px }
}

@media (max-width:520px){
  body{ padding-top:64px }
}

a{ color:var(--link); text-decoration:none }
a:hover{ color:var(--link-hover) }

::selection{ background:rgba(59,130,246,.35) }

input::placeholder{ color:rgba(150,170,210,.4) }

button{ font:inherit }

img{ max-width:100%; display:block }

/* accessible focus ring for keyboard users */
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:4px;
}

@keyframes vxBlink{ 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes vxMarquee{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes vxFloat{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }

/* respect users who've asked the OS for less motion */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
  }
}
