:root {
  /* For color pallete exploration, see https://coolors.co */
  --dark-fg: #e8e8e8;
  --dark-bg: #111;
  --dark-border: lightgrey;
  --lite-fg: #111;
  --lite-bg: #e8e8e8;
  --lite-border: darkgrey;

  --gray-00: #f8f9faff;
  --gray-01: #e9ecefff;
  --gray-02: #dee2e6ff;
  --gray-03: #ced4daff;
  --gray-04: #adb5bdff;
  --gray-05: #6c757dff;
  --gray-06: #495057ff;
  --gray-07: #343a40ff;
  --gray-08: #212529ff;

  /* https://coolors.co/400000-531919-653231-784c4a-8a6563-9d7e7b-af9794-c2b1ad-d4cac5-e7e3de */
  --c00: #110000ff; /* Added for near black */
  --c01: #400000ff; /* black-bean */
  --c02: #531919ff; /* caput-mortuum */
  --c03: #653231ff; /* wine */
  --c04: #784c4aff; /* tuscan-red */
  --c05: #8a6563ff; /* deep-taupe */
  --c06: #9d7e7bff; /* burnished-brown */
  --c07: #af9794ff; /* tuscany */
  --c08: #c2b1adff; /* black-shadows */
  --c09: #d4cac5ff; /* pale-silver */
  --c10: #e7e3deff; /* platinum */

  --fgcolor: var(--c07);
    color: var(--fgcolor);
  --fgcolor_dim: var(--gray-03);
  --bgcolor: var(--c00);
    background-color: var(--bgcolor);
  --bdcolor: var(--c06);

  --primary-hilite-bgcolor: #ff4;
  --primary-hilite-fgcolor: var(--gray-08);
  --primary-hilite-bdcolor: var(--gray-08);

  --title-bar-bgcolor: var(--c01);
  --title-bar-fgcolor: var(--c10);

  --button-bgcolor: var(--c01);
  --button-bgcolor-hover: var(--c03);
  --button-fgcolor: var(--c10);
  --button-bdcolor: var(--bdcolor); /* border color */
  --button-bgcolor-disabled: var(--gray-03);
  --button-fgcolor-disabled: var(--gray-07);
  --button-border-radius: min(1vw, 1vh);

  --label-fgcolor: var(--c07);
  --label-bgcolor: var(--c03);

  --layout-slot-padding: 8px;
  --panel-title-font-size: 125%;
  --panel-title-weight: bold;
  --panel-margin-bottom: 2px;

  --menu-bgcolor: var(--c01);
  --menu-hilite-bgcolor: var(--c08);
  --menu-hilite-fgcolor: var(--c00);

  --panel-titlebar-height: 48px;

  --slot-underline-color: var(--c02);
  --debug-bgcolor: #ffb;
  --debug-fgcolor: var(--gray-07);

  --main-font-family: 'Open Sans', sans-serif;
    font-family: var(--main-font-family);
  --fgcolor_dim_text: var(--c05);
  --hitcount-color: var(--gray-05);
}
[data-theme="lite"] {
  --fgcolor: var(--c03);
  --bgcolor: var(--c10);
  --bdcolor: var(--c05);

  --button-bgcolor: var(--c09);
  --button-fgcolor: var(--c01);
  --button-bdcolor: var(--bdcolor);
  --button-bgcolor-disabled: var(--c09);
  --button-fgcolor-disabled: var(--c07);

  --label-fgcolor: var(--c03);
  --label-bgcolor: var(--c07);

  --menu-bgcolor: var(--c09);
  --menu-hilite-bgcolor: var(--c08);
  --menu-hilite-fgcolor: var(--c00);

  --slot-underline-color: var(--c04);
  --fgcolor_dim_text: var(--c05);
}