/* GravitySearch — Color tokens
   Dark, cosmic, techy. Near-black background with a deep space-blue undertone.
   Accent: a nebula gradient from violet to cyan. */

:root {
  /* ---- Base space palette (backgrounds → surfaces) ---- */
  --space-1000: #04060e; /* deepest void, page base */
  --space-950:  #070a15; /* app background */
  --space-900:  #0b0f1d; /* raised background */
  --space-850:  #0f1425; /* surface / card */
  --space-800:  #141b30; /* elevated surface */
  --space-750:  #1b233c; /* hover surface */
  --space-700:  #232d4a; /* strong surface / input */

  /* ---- Nebula accent ramp ---- */
  --violet-600: #6b4cff;
  --violet-500: #7b61ff; /* primary accent */
  --violet-400: #9a86ff;
  --magenta-500: #b15cff; /* nebula midtone */
  --cyan-500:   #1fc9e6;
  --cyan-400:   #35e0f0; /* accent bright */
  --cyan-300:   #7cf0f8;

  /* ---- Text ---- */
  --white-soft: #f5f7fc; /* headings, strong text */
  --grey-100:   #ced5e6; /* body */
  --grey-200:   #aab2c9; /* secondary body */
  --grey-300:   #8189a3; /* muted / captions */
  --grey-400:   #5a6178; /* faint / disabled */

  /* ---- Semantic status ---- */
  --success-400: #3fdda6;
  --warning-400: #f7c95a;
  --danger-400:  #fb7185;
  --info-400:    #35e0f0;

  /* ---- Lines & overlays ---- */
  --line-soft:   rgba(154, 172, 255, 0.09);
  --line:        rgba(154, 172, 255, 0.14);
  --line-strong: rgba(154, 172, 255, 0.24);
  --scrim:       rgba(4, 6, 14, 0.72);

  /* ---- Gradients ---- */
  --grad-nebula: linear-gradient(120deg, #b15cff 0%, #7b61ff 42%, #22d3ee 100%); /* @kind color */
  --grad-brand:  linear-gradient(135deg, #7b61ff 0%, #35e0f0 100%); /* @kind color */
  --grad-brand-soft: linear-gradient(135deg, rgba(123,97,255,0.18) 0%, rgba(53,224,240,0.18) 100%); /* @kind color */
  --grad-surface: linear-gradient(180deg, rgba(154,172,255,0.05) 0%, rgba(154,172,255,0) 100%); /* @kind color */
  --glow-violet: radial-gradient(circle at 50% 50%, rgba(123,97,255,0.45) 0%, rgba(123,97,255,0) 70%); /* @kind color */
  --glow-cyan:   radial-gradient(circle at 50% 50%, rgba(53,224,240,0.40) 0%, rgba(53,224,240,0) 70%); /* @kind color */

  /* ---- Semantic aliases ---- */
  --bg-base:        var(--space-1000);
  --bg-app:         var(--space-950);
  --surface-raised: var(--space-900);
  --surface-card:   var(--space-850);
  --surface-elev:   var(--space-800);
  --surface-hover:  var(--space-750);
  --surface-input:  var(--space-700);

  --text-strong: var(--white-soft);
  --text-body:   var(--grey-100);
  --text-secondary: var(--grey-200);
  --text-muted:  var(--grey-300);
  --text-faint:  var(--grey-400);
  --text-on-accent: #050713;

  --accent:        var(--violet-500);
  --accent-bright: var(--cyan-400);
  --accent-hover:  var(--violet-400);

  --border-subtle: var(--line-soft);
  --border:        var(--line);
  --border-strong: var(--line-strong);

  --focus-ring: rgba(53, 224, 240, 0.55);
}