:root, .inverted-undo {          /* red */        /* yellow */     /* green */
--z0: #111827;  --a0: #2a1c26; --b0: #2a2429;  --c0: #162730;
--z1: #1e2433;  --a1: #421f24; --b1: #45322a;  --c1: #1c3b3b;
--z2: #2b313f;  --a2: #5a2122; --b2: #60422b;  --c2: #1f4f47;
--z3: #393e4c;  --a3: #71231f; --b3: #7b522a;  --c3: #226452;
--z4: #474c59;  --a4: #89221c; --b4: #976328;  --c4: #227a5e;
--z5: #565a66;  --a5: #a22018; --b5: #b47424;  --c5: #20906a;
--z6: #656974;  --a6: #bb1b13; --b6: #d1861d;  --c6: #1ba776;
--z7: #747782;  --a7: #d4100b; --b7: #f0990f;  --c7: #0ebf82;
--z8: #848790;  --a8: #e62b18; --b8: #ffa723;  --c8: #31ce8f;
--z9: #94969f;  --a9: #ee5035; --b9: #ffb146;  --c9: #59d49c;
--z10: #a4a6ae; --a10: #f66d50;--b10: #ffbc63; --c10: #76dbaa;
--z11: #b4b7bd; --a11: #fb866c;--b11: #ffc67d; --c11: #8fe0b7;
--z12: #c5c7cc; --a12: #ff9f88;--b12: #ffd197; --c12: #a7e6c5;
--z13: #d6d8db; --a13: #ffb7a5;--b13: #ffdbb1; --c13: #bdecd3;
--z14: #e7e9eb; --a14: #ffcfc3;--b14: #ffe6cb; --c14: #d2f1e1;
--z15: #f9fafb; --a15: #fee6e1;--b15: #fef1e5; --c15: #e8f6ef;

--d0: #2a1517;  --e0: #181e39; --f0: #1f1d39;  --g0: #0d2818;
--d1: #3d1a1c;  --e1: #202651; --f1: #2f2251;  --g1: #133d24;
--d2: #521e20;  --e2: #282e69; --f2: #3f2769;  --g2: #1a5230;
--d3: #6b2022;  --e3: #303782; --f3: #502b82;  --g3: #20683c;
--d4: #891f1f;  --e4: #383f9d; --f4: #622e9d;  --g4: #267e49;
--d5: #a91b1b;  --e5: #4047b8; --f5: #7430b8;  --g5: #2c9556;
--d6: #cc1414;  --e6: #4750d4; --f6: #8732d4;  --g6: #31ac63;
--d7: #f20000;  --e7: #4e59f0; --f7: #9933f0;  --g7: #34c470;
--d8: #ff3333;  --e8: #6366ff; --f8: #aa43ff;  --g8: #4ade80;
--d9: #ff5c5c;  --e9: #7e78ff; --f9: #b85fff;  --g9: #6ee7b7;
--d10: #ff7f7f; --e10: #958aff; --f10: #c477ff;--g10: #86efac;
--d11: #ff9f9f; --e11: #a99cff; --f11: #cf8fff;--g11: #a7f3c7;
--d12: #ffbaba; --e12: #bbafff; --f12: #daa5ff;--g12: #bbf7d6;
--d13: #ffd1d1; --e13: #cdc2fe; --f13: #e3bbfe;--g13: #d1fae5;
--d14: #ffe5e5; --e14: #ddd6fd; --f14: #ebd1fd;--g14: #e6fcee;
--d15: #fff5f5; --e15: #ece9fc; --f15: #f3e8fc;--g15: #f0fdf6;
-webkit-font-smoothing: antialiased;
--shadow-bg: 0 var(--x2) var(--x4) var(--z0);
--shadow: 0 var(--x1) var(--x8) rgba(0,0,0,0.4);
--accent0:  var(--d0);  --comp0:  var(--g0);
--accent1:  var(--d1);  --comp1:  var(--g1);
--accent2:  var(--d2);  --comp2:  var(--g2);
--accent3:  var(--d3);  --comp3:  var(--g3);
--accent4:  var(--d4);  --comp4:  var(--g4);
--accent5:  var(--d5);  --comp5:  var(--g5);
--accent6:  var(--d6);  --comp6:  var(--g6);
--accent7:  var(--d7);  --comp7:  var(--g7);
--accent8:  var(--d8);  --comp8:  var(--g8);
--accent9:  var(--d9);  --comp9:  var(--g9);
--accent10: var(--d10); --comp10: var(--g10);
--accent11: var(--d11); --comp11: var(--g11);
--accent12: var(--d12); --comp12: var(--g12);
--accent13: var(--d13); --comp13: var(--g13);
--accent14: var(--d14); --comp14: var(--g14);
--accent15: var(--d15); --comp15: var(--g15);

}

.inverted {
--z0: #f8fafc;  --a0: #fff1ee;  --b0: #fff8f1;  --c0: #f0fdf6;
--z1: #f1f5f9;  --a1: #ffddd4;  --b1: #ffedda;  --c1: #dcfce8;
--z2: #e2e8f0;  --a2: #ffc9ba;  --b2: #ffe2c3;  --c2: #bbf7d6;
--z3: #cbd5e1;  --a3: #ffb49f;  --b3: #ffd7ab;  --c3: #86efb8;
--z4: #94a3b8;  --a4: #ff9e84;  --b4: #ffcc93;  --c4: #4ade80;
--z5: #64748b;  --a5: #f97066;  --b5: #ffc17b;  --c5: #22c55e;
--z6: #475569;  --a6: #ef4444;  --b6: #f59e0b;  --c6: #16a34a;
--z7: #334155;  --a7: #dc2626;  --b7: #d97706;  --c7: #15803d;
--z8: #1e293b;  --a8: #b91c1c;  --b8: #b45309;  --c8: #166534;
--z9: #0f172a;  --a9: #991b1b;  --b9: #92400e;  --c9: #14532d;
--z10: #0c1222; --a10: #7f1d1d; --b10: #78350f; --c10: #052e16;
--z11: #090e1a; --a11: #6b1515; --b11: #632c09; --c11: #042511;
--z12: #060a13; --a12: #571010; --b12: #4e2305; --c12: #031c0c;
--z13: #040710; --a13: #43090a; --b13: #3a1a03; --c13: #021408;
--z14: #02050a; --a14: #2f0506; --b14: #261202; --c14: #010c04;
--z15: #010204; --a15: #1b0203; --b15: #130a01; --c15: #000502;

--d0: #fef2f2;  --e0: #f0f0ff;  --f0: #faf5ff;  --g0: #ecfdf5;
--d1: #fee2e2;  --e1: #e0e0ff;  --f1: #f3e8ff;  --g1: #d1fae5;
--d2: #fecaca;  --e2: #c7c7fe;  --f2: #e9d5ff;  --g2: #a7f3d0;
--d3: #fca5a5;  --e3: #a5a5fd;  --f3: #d8b4fe;  --g3: #6ee7b7;
--d4: #f87171;  --e4: #8484fc;  --f4: #c084fc;  --g4: #34d399;
--d5: #f20000;  --e5: #6366f1;  --f5: #a855f7;  --g5: #10b981;
--d6: #dc2626;  --e6: #4f46e5;  --f6: #9333ea;  --g6: #059669;
--d7: #bc0000;  --e7: #4338ca;  --f7: #7e22ce;  --g7: #047857;
--d8: #991b1b;  --e8: #3730a3;  --f8: #6b21a8;  --g8: #065f46;
--d9: #7f1d1d;  --e9: #312e81;  --f9: #581c87;  --g9: #064e3b;
--d10: #6b1515; --e10: #282565; --f10: #4a1772; --g10: #053e30;
--d11: #571010; --e11: #211e52; --f11: #3c135f; --g11: #042f24;
--d12: #430a0a; --e12: #1a1740; --f12: #2e0f4c; --g12: #032018;
--d13: #2f0506; --e13: #141030; --f13: #210b3a; --g13: #02110c;
--d14: #1b0203; --e14: #0e0a20; --f14: #140728; --g14: #010804;
--d15: #0a0101; --e15: #080511; --f15: #080417; --g15: #000301;
-webkit-font-smoothing: auto;
--shadow-bg: 0 var(--x2) var(--x4) rgba(0,0,0,0.05);
--shadow: 0 var(--x1) var(--x8) rgba(0,0,0,0.08);
--accent0:  var(--d0);  --comp0:  var(--g0);
--accent1:  var(--d1);  --comp1:  var(--g1);
--accent2:  var(--d2);  --comp2:  var(--g2);
--accent3:  var(--d3);  --comp3:  var(--g3);
--accent4:  var(--d4);  --comp4:  var(--g4);
--accent5:  var(--d5);  --comp5:  var(--g5);
--accent6:  var(--d6);  --comp6:  var(--g6);
--accent7:  var(--d7);  --comp7:  var(--g7);
--accent8:  var(--d8);  --comp8:  var(--g8);
--accent9:  var(--d9);  --comp9:  var(--g9);
--accent10: var(--d10); --comp10: var(--g10);
--accent11: var(--d11); --comp11: var(--g11);
--accent12: var(--d12); --comp12: var(--g12);
--accent13: var(--d13); --comp13: var(--g13);
--accent14: var(--d14); --comp14: var(--g14);
--accent15: var(--d15); --comp15: var(--g15);
}

:root {
  --x1:  4px;
  --x2:  8px;
  --x3:  12px;
  --x4:  16px;
  --x5:  20px;
  --x6:  24px;
  --x7:  28px;
  --x8:  32px;
  --x9:  36px;
  --x10: 40px;
  --x11: 44px;
  --x12: 48px;
  --x13: 52px;
  --x14: 56px;
  --x15: 60px;
  --x16: 64px;
  --mono-font: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
  --ui-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  --panel-width: calc(var(--x10)*2*2 + var(--x1));
  --transition-duration: 200ms;
  --transition:  all var(--transition-duration) ease;
}