:root {
    --bg-0: #0a0e1a;
    --bg-1: #111729;
    --panel: rgba(30, 41, 59, 0.55);
    --panel-border: rgba(148, 163, 184, 0.12);
    --text: #e8eef9;
    --muted: #8da0bb;
    --accent: #38bdf8;
    --accent-2: #818cf8;

    --bar-grad-top: #6b7a93;
    --bar-grad-bot: #3b4659;
    --sorted-top: #4ade80;
    --sorted-bot: #15803d;
    --key-top: #fbbf24;
    --key-bot: #d97706;
    --compare-top: #f87171;
    --compare-bot: #b91c1c;
    --shift-top: #c4b5fd;
    --shift-bot: #6d28d9;
    --pivot-top: #67e8f9;
    --pivot-bot: #0891b2;

    --pointer-i: #fbbf24;
    --pointer-i-glow: rgba(251, 191, 36, 0.55);
    --pointer-j: #f87171;
    --pointer-j-glow: rgba(248, 113, 113, 0.55);

    --slot-w: 60px;
    --slot-gap: 14px;
    --spring: cubic-bezier(.34,1.56,.64,1);
    --ease: cubic-bezier(.5,.05,.3,1);
    --pad-x: 24px;
  }