/* Kepler Insights — Design Tokens */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy:     #1B3A6B;
  --navy-deep:#0F2347;
  --blue:     #2E6DB4;
  --blue-lt:  #EDF3FB;
  --ink:      #000000;
  --ink-mid:  #0A0F1A;
  --ink-lt:   #111827;
  --border:   #1A1A1A;
  --bg:       #D6E2F0;
  --white:    #FFFFFF;
  --green:    #15803D;
  --green-lt: #DCFCE7;
  --amber:    #B45309;
  --amber-lt: #FEF3C7;
  --red:      #B91C1C;
  --red-lt:   #FEE2E2;

  /* Semantic surface & glass */
  --surface:       #F0F2F7;
  --track:         #EEF1F6;
  --glass:         rgba(255,255,255,0.95);
  --glass-border:  #1A1A1A;
  --overlay-bg:    rgba(6,3,17,0.45);

  /* Status borders */
  --green-border:  #BBF7D0;
  --amber-border:  #FDE68A;
  --red-border:    #FECACA;

  /* Purple (KI brand accent) */
  --purple:        #7c3aed;
  --purple-lt:     #F5F3FF;
  --purple-border: #DDD6FE;

  /* Tooltip */
  --tooltip-bg:    #111827;
  --tooltip-text:  #FFFFFF;

  /* Tag border */
  --tag-border:    #C3D9F5;

  /* Shadow tints */
  --shadow-color:  rgba(27,58,107,0.16);
  --shadow-accent: rgba(27,58,107,0.08);

  --font:     'Jost', system-ui, sans-serif;
  --mono:     'DM Mono', monospace;
}

/* ── DARK MODE (Galaxy theme) ─────────────────────────────────────────────── */
body.dark {
  --navy:     #c4b5fd;
  --navy-deep:#a78bfa;
  --blue:     #818cf8;
  --blue-lt:  rgba(99,102,241,0.14);
  --ink:      #ffffff;
  --ink-mid:  #f1f5f9;
  --ink-lt:   #e2e8f0;
  --border:   rgba(255,255,255,0.45);
  --bg:       #060d1f;
  --white:    #0d1330;
  --green:    #4ade80;
  --green-lt: rgba(74,222,128,0.12);
  --amber:    #fbbf24;
  --amber-lt: rgba(251,191,36,0.12);
  --red:      #f87171;
  --red-lt:   rgba(248,113,113,0.12);

  --surface:       rgba(13,19,48,0.6);
  --track:         rgba(255,255,255,0.08);
  --glass:         rgba(13,19,48,0.92);
  --glass-border:  rgba(124,58,237,0.30);
  --overlay-bg:    rgba(6,3,17,0.65);

  --green-border:  rgba(74,222,128,0.2);
  --amber-border:  rgba(251,191,36,0.2);
  --red-border:    rgba(248,113,113,0.2);

  --purple:        #a78bfa;
  --purple-lt:     rgba(124,58,237,0.14);
  --purple-border: rgba(124,58,237,0.35);

  --tooltip-bg:    #1e293b;
  --tooltip-text:  #e2e8f0;

  --tag-border:    rgba(129,140,248,0.3);

  --shadow-color:  rgba(0,0,0,0.4);
  --shadow-accent: rgba(124,58,237,0.12);

  background: var(--bg);
  color: var(--ink);
}

/* Smooth transition only while switching themes */
body.theme-switch,
body.theme-switch * {
  transition:
    background-color 0.28s ease,
    color            0.28s ease,
    border-color     0.28s ease,
    box-shadow       0.28s ease !important;
}

html, body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--ink);
  min-height: 100vh;
  overflow-x: hidden;
}
body::after { content: none; }
body.dark::after { content: none; }