:root{
  --radius:16px;
  --radius-lg:24px;
  --ease: cubic-bezier(.2,.8,.2,1);
  --ease-soft: cubic-bezier(.22,.61,.36,1);

  --u1:#a14cff;
  --u2:#ff5fb0;
  --u3:#ffd1ff;

  /* Light (default) */
  --bg0:#fbf2ff;
  --bg1:#efe6ff;
  --bg2:#fff0dc;

  --text:#171625;
  --muted:rgba(23,22,37,.68);
  --faint:rgba(23,22,37,.44);

  --glass: rgba(255,255,255,.60);
  --glass2: rgba(255,255,255,.44);
  --border: rgba(255,255,255,.56);
  --border2: rgba(23,22,37,.12);

  --shadow: 0 18px 50px rgba(34,20,88,.14);
  --shadow2: 0 10px 30px rgba(34,20,88,.10);

  --btn: rgba(255,255,255,.62);
  --btnBorder: rgba(23,22,37,.12);
  --btnShadow: 0 12px 30px rgba(34,20,88,.12);

  --navBg: rgba(255,255,255,.48);
  --navBorder: rgba(255,255,255,.55);

  --chartGrid: rgba(23,22,37,.12);

  --particle: rgba(30,26,45,.45);
  --particleLine: rgba(30,26,45,.12);

  --grainOpacity:.08;

  /* Transition */
  --themeDur: 800ms;
}

:root[data-theme="dark"]{
  --bg0:#070a16;
  --bg1:#0b1020;
  --bg2:#120b26;

  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.66);
  --faint:rgba(255,255,255,.42);

  --glass: rgba(14,16,28,.62);
  --glass2: rgba(14,16,28,.46);
  --border: rgba(255,255,255,.12);
  --border2: rgba(255,255,255,.08);

  --shadow: 0 22px 60px rgba(0,0,0,.55);
  --shadow2: 0 12px 36px rgba(0,0,0,.45);

  --btn: rgba(16,18,30,.70);
  --btnBorder: rgba(255,255,255,.14);
  --btnShadow: 0 16px 44px rgba(0,0,0,.55);

  --navBg: rgba(12,14,24,.55);
  --navBorder: rgba(255,255,255,.10);

  --chartGrid: rgba(255,255,255,.11);

  --particle: rgba(255,255,255,.55);
  --particleLine: rgba(255,255,255,.14);

  --grainOpacity:.10;
}

/* Global smooth theme transition */
html, body{
  background: var(--bg1);
}

body, .glass, .card, .statusCard, .chartCard, .notice, .metaCard, .formCard, .contactCard, .drawer__panel, .cmd__panel, .modal__panel{
  transition:
    background-color var(--themeDur) var(--ease),
    color var(--themeDur) var(--ease),
    border-color var(--themeDur) var(--ease),
    box-shadow var(--themeDur) var(--ease),
    transform 280ms var(--ease);
}

@media (prefers-reduced-motion: reduce){
  :root{ --themeDur: 0ms; }
}