:root{
      color-scheme:light;
      --navy:#131d38;
      --navy-2:#1b2850;
      --ink:#29234f;
      --ink-2:#4f496d;
      --muted:#7a7493;
      --canvas:#fbfaff;
      --sidebar:#faf8ff;
      --surface:#ffffff;
      --surface-2:#f6f2ff;
      --surface-3:#eee8ff;
      --border:#e2dcef;
      --border-2:#d0c4e8;
      --purple:#6742d7;
      --purple-2:#5230b6;
      --purple-3:#8f72e8;
      --teal:#0f766e;
      --teal-soft:#e8f7f4;
      --amber:#a35a00;
      --amber-soft:#fff5e5;
      --red:#b42318;
      --red-soft:#fff0ef;
      --blue:#3157b7;
      --shadow-1:0 1px 2px rgba(35,26,69,.06),0 8px 22px rgba(60,39,107,.06);
      --shadow-2:0 18px 42px rgba(47,31,88,.16);
      --radius-s:10px;
      --radius-m:16px;
      --radius-l:22px;
      --sidebar-w:268px;
      --rail-w:324px;
      --demo-h:46px;
      --top-h:68px;
    }