@mixin dark {
  --f1: #ccc;// Font Color Primary (ccc)
  --f2: #ddd;// Font color Headers (ddd)
  --c1: #111;// Background Color Primary (111)
  --c2: #222;// Background Color Secondary (222)
  --c3: #333;// Table Rows, Block quote edge, Borders (333)
  --c4: #888;// Disabled Buttons, Borders, mark background (888)
  --a1: #09f;// link color (09f)
  --a2: #0bf;// link hover/focus color (0bf)
  --a3: #0af;// link h1-h2 hover/focus color (0af)
  --cg: #593;// ins green, success (593)
  --cr: #e33;// del red, errors (e33)
}
@mixin light {
  --f1: #444;// Font Color Primary (444)
  --f2: #333;// Font color Headers (333)
  --c1: #fff;// Background Color Primary (fff)
  --c2: #eee;// Background Color Secondary (eee)
  --c3: #ddd;// Table Rows, Block quote edge, Borders (ddd)
  --c4: #677;// Disabled Buttons, Borders, mark background (677)
  --a1: #06e;// link color (06e)
  --a2: #09f;// link hover/focus color (09f)
  --a3: #07f;// link h1-h2 hover/focus color (07f)
  --cg: #373;// ins green, success (373)
  --cr: #d33;// del red, errors (d33)
}