/* Generated file. DO NOT EDIT. */
body.auto {
  --primary-color: #000000;
  --strong-color: #000000;
  --grey-1-color: #111111;
  --grey-2-color: #222222;
  --grey-3-color: #333333;
  --grey-4-color: #444444;
  --grey-5-color: #555555;
  --grey-6-color: #666666;
  --grey-7-color: #777777;
  --grey-8-color: #888888;
  --grey-9-color: #999999;
  --grey-a-color: #aaaaaa;
  --grey-b-color: #bbbbbb;
  --grey-c-color: #cccccc;
  --grey-d-color: #dddddd;
  --grey-e-color: #eeeeee;
  --grey-e7-color: #e7e7e7;
  --grey-f9-color: #f9f9f9;
  --layout-bg-color: #cccccc;
  --secondary-bg-color: #f5f5f5;
  --primary-bg-color: #ffffff;
  --window-modal-bg-color: #00000044;
  --error-color: #d00000;
  --error-color-faded: #ff1111;
  --link-color: #0066ee;
  --online-green-color: #00c220;
  --danger-button-color: #ffffff;
  --danger-button-background: linear-gradient(#ff0000, #cc0000);
  --danger-button-hover-background: linear-gradient(#dd0000, #aa0000);
  --danger-button-active-background: linear-gradient(#cc0000, #880000);
  --danger-button-shadow: 0 4px 8px -3px #00000026, 0 0.4px 0 0.8px #880000ff, 0 0 0 1px #00000012;
  --danger-button-hover-shadow: 0 6px 8px -4px #00000033, 0 0.4px 0 0.8px #660000ff, 0 0 0 1px #00000012;
  --danger-button-active-shadow: 0 4px 6px -3px #00000026, 0 0.4px 0 0.8px #660000ff, 0 0 0 1px #00000012;
  --nav-bg-color: #e7e7e7;
  --nav-button-active-bg-color: #d5d5d5;
  --nav-button-active-hover-bg-color: #cccccc;
  --code-bg-color: #44444411;
  --code-shadow: 0 6px 9px -4px #00000033, 0 0.4px 0 0.8px #0000001a, 0 0 0 1px #00000012;
  --sparkline-stroke: #ee0000;
  --sparkline-fill: #ee000044;
  --spinner-grey: #777777ff;
  --spinner-grey-light: #77777733;
  --checkbox-color: #777777ff;
  --checkbox-bg-color: #77777700;
  --checkbox-border-color: #77777777;
  --checkbox-hover-color: #444444;
  --checkbox-hover-bg-color: #77777711;
  --checkbox-focus-bg-color: #77777722;
  --checkbox-active-hover-bg-color: #55ccff22;
  --checkbox-active-focus-bg-color: #55ccff44;
  --checkbox-active-color: #008ac5;
  --checkbox-active-border-color: #008ac577;
  --icon-button-bg-color: #00000000;
  --icon-button-hover-bg-color: #00000010;
  --icon-button-focus-bg-color: #00000018;
  --button-background: linear-gradient(#fff, #f5f5f5);
  --button-hover-background: linear-gradient(#fafafa, #e7e7e7);
  --button-active-background: linear-gradient(#f7f7f7, #e0e0e0);
  --button-inset-background: linear-gradient(#00000022, #00000011);
  --button-shadow: 0 4px 8px -3px #00000022, 0px 0.4px 0 0.8px #00000040, 0 0 0 1px #00000012;
  --button-hover-shadow: 0 6px 8px -4px #00000030, 0px 0.4px 0 0.8px #00000059, 0 0 0 1px #00000012;
  --button-active-shadow: 0 4px 6px -3px #00000024, 0px 0.4px 0 0.8px #00000073, 0 0 0 1px #00000012;
  --button-inset-shadow: 0 4px 8px -3px #00000022 inset, 0px 0.4px 0 0.8px #00000040 inset, 0 0 0 1px #00000012 inset;
  --heavy-3d-box-shadow: 0 8px 12px -6px #0000004d, 0px 0.5px 0 1px #00000030, 0 0 0 1px #00000012;
  --text-input-shadow: 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #00000012 inset;
  --text-input-shadow-focus: 0 0px 0 1px #0066ee, 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #00000012 inset;
  --shadow-focus: 0 0px 0 1px #0066ee;
  --dropdown-shadow: 0 12px 12px -4px #00000033, 0px 0.4px 0 0.8px #00000052, 0 0 0 1px #00000012;
  --card-shadow: 0 4px 8px -3px #00000022, 0.2px 0.3px 0 0.7px #00000030, 0 0 0 1px #00000012;
  --card-hover-shadow: 0 6px 8px -4px #00000044, 0.2px 0.25px 0 0.85px #00000050, 0 0 0 1px #00000012;
}
body.auto * {
  --log-color: var(--light-log-color);
  --log-bg-color: var(--light-log-bg-color);
  --log-hover-color: var(--light-log-hover-color);
  --log-bg-hover-color: var(--light-log-bg-hover-color);
}
@media (prefers-color-scheme: dark) {
body.auto {
  --primary-color: #ffffff;
  --strong-color: #ffffff;
  --grey-1-color: #eeeeee;
  --grey-2-color: #dddddd;
  --grey-3-color: #cccccc;
  --grey-4-color: #bbbbbb;
  --grey-5-color: #aaaaaa;
  --grey-6-color: #999999;
  --grey-7-color: #888888;
  --grey-8-color: #777777;
  --grey-9-color: #666666;
  --grey-a-color: #555555;
  --grey-b-color: #444444;
  --grey-c-color: #333333;
  --grey-d-color: #222222;
  --grey-e-color: #111111;
  --grey-e7-color: #0c0c0c;
  --grey-f9-color: #070707;
  --layout-bg-color: #222222;
  --secondary-bg-color: #050505;
  --primary-bg-color: #000000;
  --window-modal-bg-color: #000000aa;
  --error-color: #ff1111;
  --error-color-faded: #d00000;
  --link-color: #22aaff;
  --online-green-color: #00c220;
  --danger-button-color: #ffffff;
  --danger-button-background: linear-gradient(#dd0000, #aa0000);
  --danger-button-hover-background: linear-gradient(#bb0000, #880000);
  --danger-button-active-background: linear-gradient(#aa0000, #660000);
  --danger-button-shadow: 0 -0.33px 0 1px #ff555533, 0 0 0 1px #ffffff15;
  --danger-button-hover-shadow: 0 -0.33px 0 1px #ff555555, 0 0 0 1px #ffffff15;
  --danger-button-active-shadow: 0 -0.33px 0 1px #ff555544, 0 0 0 1px #ffffff15;
  --nav-bg-color: #050505;
  --nav-button-active-bg-color: #111111;
  --nav-button-active-hover-bg-color: #1c1c1c;
  --code-bg-color: #aaaaaa11;
  --code-shadow: 0 0.33px 0 1px #ffffff26, 0 0 0 1px #ffffff15;
  --sparkline-stroke: #ee0000;
  --sparkline-fill: #ee000044;
  --spinner-grey: #777777ff;
  --spinner-grey-light: #77777733;
  --checkbox-color: #999999ff;
  --checkbox-bg-color: #99999900;
  --checkbox-border-color: #99999977;
  --checkbox-hover-color: #777777;
  --checkbox-hover-bg-color: #99999922;
  --checkbox-focus-bg-color: #99999944;
  --checkbox-active-hover-bg-color: #19baff22;
  --checkbox-active-focus-bg-color: #19baff44;
  --checkbox-active-color: #19baff;
  --checkbox-active-border-color: #19baff77;
  --icon-button-bg-color: #eeeeee00;
  --icon-button-hover-bg-color: #eeeeee18;
  --icon-button-focus-bg-color: #eeeeee33;
  --button-background: linear-gradient(#141414, #040404);
  --button-hover-background: linear-gradient(#242424, #111111);
  --button-active-background: linear-gradient(#111111, #000000);
  --button-inset-background: linear-gradient(#222222, #333333);
  --button-shadow: 0px -0.33px 0 1px #ffffff30, 0 0 0 1px #ffffff15;
  --button-hover-shadow: 0px -0.33px 0 1px #ffffff50, 0 0 0 1px #ffffff15;
  --button-active-shadow: 0px -0.33px 0 1px #ffffff40, 0 0 0 1px #ffffff15;
  --button-inset-shadow: 0px -0.33px 0 1px #ffffff40 inset, 0 0 0 1px #ffffff15 inset;
  --heavy-3d-box-shadow: 0px -0.33px 0 1px #ffffff23, 0 8px 12px -6px #0000004d, 0 0 0 1px #ffffff15;
  --text-input-shadow: 0px -0.33px 0 1px #ffffff26, 0 6px 9px -4px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --text-input-shadow-focus: 0 0px 0 1px #22aaff, 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --shadow-focus: 0 0px 0 1px #22aaff;
  --dropdown-shadow: 0px -0.33px 0 1px #ffffff55, 0 12px 12px -4px #00000033, 0 0 0 1px #ffffff15;
  --card-shadow: 0.25px -0.25px 0 0.75px #ffffff30, 0 4px 8px -3px #00000022, 0 0 0 1px #ffffff15;
  --card-hover-shadow: 0.25px -0.25px 0 1px #ffffff50, 0 6px 8px -4px #00000044, 0 0 0 1px #ffffff15;
}
body.auto * {
  --log-color: var(--dark-log-color);
  --log-bg-color: var(--dark-log-bg-color);
  --log-hover-color: var(--dark-log-hover-color);
  --log-bg-hover-color: var(--dark-log-bg-hover-color);
}}
body.light {
  --primary-color: #000000;
  --strong-color: #000000;
  --grey-1-color: #111111;
  --grey-2-color: #222222;
  --grey-3-color: #333333;
  --grey-4-color: #444444;
  --grey-5-color: #555555;
  --grey-6-color: #666666;
  --grey-7-color: #777777;
  --grey-8-color: #888888;
  --grey-9-color: #999999;
  --grey-a-color: #aaaaaa;
  --grey-b-color: #bbbbbb;
  --grey-c-color: #cccccc;
  --grey-d-color: #dddddd;
  --grey-e-color: #eeeeee;
  --grey-e7-color: #e7e7e7;
  --grey-f9-color: #f9f9f9;
  --layout-bg-color: #cccccc;
  --secondary-bg-color: #f5f5f5;
  --primary-bg-color: #ffffff;
  --window-modal-bg-color: #00000044;
  --error-color: #d00000;
  --error-color-faded: #ff1111;
  --link-color: #0066ee;
  --online-green-color: #00c220;
  --danger-button-color: #ffffff;
  --danger-button-background: linear-gradient(#ff0000, #cc0000);
  --danger-button-hover-background: linear-gradient(#dd0000, #aa0000);
  --danger-button-active-background: linear-gradient(#cc0000, #880000);
  --danger-button-shadow: 0 4px 8px -3px #00000026, 0 0.4px 0 0.8px #880000ff, 0 0 0 1px #00000012;
  --danger-button-hover-shadow: 0 6px 8px -4px #00000033, 0 0.4px 0 0.8px #660000ff, 0 0 0 1px #00000012;
  --danger-button-active-shadow: 0 4px 6px -3px #00000026, 0 0.4px 0 0.8px #660000ff, 0 0 0 1px #00000012;
  --nav-bg-color: #e7e7e7;
  --nav-button-active-bg-color: #d5d5d5;
  --nav-button-active-hover-bg-color: #cccccc;
  --code-bg-color: #44444411;
  --code-shadow: 0 6px 9px -4px #00000033, 0 0.4px 0 0.8px #0000001a, 0 0 0 1px #00000012;
  --sparkline-stroke: #ee0000;
  --sparkline-fill: #ee000044;
  --spinner-grey: #777777ff;
  --spinner-grey-light: #77777733;
  --checkbox-color: #777777ff;
  --checkbox-bg-color: #77777700;
  --checkbox-border-color: #77777777;
  --checkbox-hover-color: #444444;
  --checkbox-hover-bg-color: #77777711;
  --checkbox-focus-bg-color: #77777722;
  --checkbox-active-hover-bg-color: #55ccff22;
  --checkbox-active-focus-bg-color: #55ccff44;
  --checkbox-active-color: #008ac5;
  --checkbox-active-border-color: #008ac577;
  --icon-button-bg-color: #00000000;
  --icon-button-hover-bg-color: #00000010;
  --icon-button-focus-bg-color: #00000018;
  --button-background: linear-gradient(#fff, #f5f5f5);
  --button-hover-background: linear-gradient(#fafafa, #e7e7e7);
  --button-active-background: linear-gradient(#f7f7f7, #e0e0e0);
  --button-inset-background: linear-gradient(#00000022, #00000011);
  --button-shadow: 0 4px 8px -3px #00000022, 0px 0.4px 0 0.8px #00000040, 0 0 0 1px #00000012;
  --button-hover-shadow: 0 6px 8px -4px #00000030, 0px 0.4px 0 0.8px #00000059, 0 0 0 1px #00000012;
  --button-active-shadow: 0 4px 6px -3px #00000024, 0px 0.4px 0 0.8px #00000073, 0 0 0 1px #00000012;
  --button-inset-shadow: 0 4px 8px -3px #00000022 inset, 0px 0.4px 0 0.8px #00000040 inset, 0 0 0 1px #00000012 inset;
  --heavy-3d-box-shadow: 0 8px 12px -6px #0000004d, 0px 0.5px 0 1px #00000030, 0 0 0 1px #00000012;
  --text-input-shadow: 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #00000012 inset;
  --text-input-shadow-focus: 0 0px 0 1px #0066ee, 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #00000012 inset;
  --shadow-focus: 0 0px 0 1px #0066ee;
  --dropdown-shadow: 0 12px 12px -4px #00000033, 0px 0.4px 0 0.8px #00000052, 0 0 0 1px #00000012;
  --card-shadow: 0 4px 8px -3px #00000022, 0.2px 0.3px 0 0.7px #00000030, 0 0 0 1px #00000012;
  --card-hover-shadow: 0 6px 8px -4px #00000044, 0.2px 0.25px 0 0.85px #00000050, 0 0 0 1px #00000012;
}
body.light * {
  --log-color: var(--light-log-color);
  --log-bg-color: var(--light-log-bg-color);
  --log-hover-color: var(--light-log-hover-color);
  --log-bg-hover-color: var(--light-log-bg-hover-color);
}
body.dark {
  --primary-color: #ffffff;
  --strong-color: #ffffff;
  --grey-1-color: #eeeeee;
  --grey-2-color: #dddddd;
  --grey-3-color: #cccccc;
  --grey-4-color: #bbbbbb;
  --grey-5-color: #aaaaaa;
  --grey-6-color: #999999;
  --grey-7-color: #888888;
  --grey-8-color: #777777;
  --grey-9-color: #666666;
  --grey-a-color: #555555;
  --grey-b-color: #444444;
  --grey-c-color: #333333;
  --grey-d-color: #222222;
  --grey-e-color: #111111;
  --grey-e7-color: #0c0c0c;
  --grey-f9-color: #070707;
  --layout-bg-color: #222222;
  --secondary-bg-color: #050505;
  --primary-bg-color: #000000;
  --window-modal-bg-color: #000000aa;
  --error-color: #ff1111;
  --error-color-faded: #d00000;
  --link-color: #22aaff;
  --online-green-color: #00c220;
  --danger-button-color: #ffffff;
  --danger-button-background: linear-gradient(#dd0000, #aa0000);
  --danger-button-hover-background: linear-gradient(#bb0000, #880000);
  --danger-button-active-background: linear-gradient(#aa0000, #660000);
  --danger-button-shadow: 0 -0.33px 0 1px #ff555533, 0 0 0 1px #ffffff15;
  --danger-button-hover-shadow: 0 -0.33px 0 1px #ff555555, 0 0 0 1px #ffffff15;
  --danger-button-active-shadow: 0 -0.33px 0 1px #ff555544, 0 0 0 1px #ffffff15;
  --nav-bg-color: #050505;
  --nav-button-active-bg-color: #111111;
  --nav-button-active-hover-bg-color: #1c1c1c;
  --code-bg-color: #aaaaaa11;
  --code-shadow: 0 0.33px 0 1px #ffffff26, 0 0 0 1px #ffffff15;
  --sparkline-stroke: #ee0000;
  --sparkline-fill: #ee000044;
  --spinner-grey: #777777ff;
  --spinner-grey-light: #77777733;
  --checkbox-color: #999999ff;
  --checkbox-bg-color: #99999900;
  --checkbox-border-color: #99999977;
  --checkbox-hover-color: #777777;
  --checkbox-hover-bg-color: #99999922;
  --checkbox-focus-bg-color: #99999944;
  --checkbox-active-hover-bg-color: #19baff22;
  --checkbox-active-focus-bg-color: #19baff44;
  --checkbox-active-color: #19baff;
  --checkbox-active-border-color: #19baff77;
  --icon-button-bg-color: #eeeeee00;
  --icon-button-hover-bg-color: #eeeeee18;
  --icon-button-focus-bg-color: #eeeeee33;
  --button-background: linear-gradient(#141414, #040404);
  --button-hover-background: linear-gradient(#242424, #111111);
  --button-active-background: linear-gradient(#111111, #000000);
  --button-inset-background: linear-gradient(#222222, #333333);
  --button-shadow: 0px -0.33px 0 1px #ffffff30, 0 0 0 1px #ffffff15;
  --button-hover-shadow: 0px -0.33px 0 1px #ffffff50, 0 0 0 1px #ffffff15;
  --button-active-shadow: 0px -0.33px 0 1px #ffffff40, 0 0 0 1px #ffffff15;
  --button-inset-shadow: 0px -0.33px 0 1px #ffffff40 inset, 0 0 0 1px #ffffff15 inset;
  --heavy-3d-box-shadow: 0px -0.33px 0 1px #ffffff23, 0 8px 12px -6px #0000004d, 0 0 0 1px #ffffff15;
  --text-input-shadow: 0px -0.33px 0 1px #ffffff26, 0 6px 9px -4px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --text-input-shadow-focus: 0 0px 0 1px #22aaff, 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --shadow-focus: 0 0px 0 1px #22aaff;
  --dropdown-shadow: 0px -0.33px 0 1px #ffffff55, 0 12px 12px -4px #00000033, 0 0 0 1px #ffffff15;
  --card-shadow: 0.25px -0.25px 0 0.75px #ffffff30, 0 4px 8px -3px #00000022, 0 0 0 1px #ffffff15;
  --card-hover-shadow: 0.25px -0.25px 0 1px #ffffff50, 0 6px 8px -4px #00000044, 0 0 0 1px #ffffff15;
}
body.dark * {
  --log-color: var(--dark-log-color);
  --log-bg-color: var(--dark-log-bg-color);
  --log-hover-color: var(--dark-log-hover-color);
  --log-bg-hover-color: var(--dark-log-bg-hover-color);
}
body.black {
  --primary-color: #ffffff;
  --strong-color: #ffffff;
  --grey-1-color: #eeeeee;
  --grey-2-color: #dddddd;
  --grey-3-color: #cccccc;
  --grey-4-color: #bbbbbb;
  --grey-5-color: #aaaaaa;
  --grey-6-color: #999999;
  --grey-7-color: #888888;
  --grey-8-color: #777777;
  --grey-9-color: #666666;
  --grey-a-color: #555555;
  --grey-b-color: #444444;
  --grey-c-color: #333333;
  --grey-d-color: #222222;
  --grey-e-color: #111111;
  --grey-e7-color: #0c0c0c;
  --grey-f9-color: #070707;
  --layout-bg-color: #222222;
  --secondary-bg-color: #050505;
  --primary-bg-color: #000000;
  --window-modal-bg-color: #000000aa;
  --error-color: #ff1111;
  --error-color-faded: #d00000;
  --link-color: #22aaff;
  --online-green-color: #00c220;
  --danger-button-color: #ffffff;
  --danger-button-background: linear-gradient(#dd0000, #aa0000);
  --danger-button-hover-background: linear-gradient(#bb0000, #880000);
  --danger-button-active-background: linear-gradient(#aa0000, #660000);
  --danger-button-shadow: 0 -0.33px 0 1px #ff555533, 0 0 0 1px #ffffff15;
  --danger-button-hover-shadow: 0 -0.33px 0 1px #ff555555, 0 0 0 1px #ffffff15;
  --danger-button-active-shadow: 0 -0.33px 0 1px #ff555544, 0 0 0 1px #ffffff15;
  --nav-bg-color: #050505;
  --nav-button-active-bg-color: #111111;
  --nav-button-active-hover-bg-color: #1c1c1c;
  --code-bg-color: #aaaaaa11;
  --code-shadow: 0 0.33px 0 1px #ffffff26, 0 0 0 1px #ffffff15;
  --sparkline-stroke: #ee0000;
  --sparkline-fill: #ee000044;
  --spinner-grey: #777777ff;
  --spinner-grey-light: #77777733;
  --checkbox-color: #999999ff;
  --checkbox-bg-color: #99999900;
  --checkbox-border-color: #99999977;
  --checkbox-hover-color: #777777;
  --checkbox-hover-bg-color: #99999922;
  --checkbox-focus-bg-color: #99999944;
  --checkbox-active-hover-bg-color: #19baff22;
  --checkbox-active-focus-bg-color: #19baff44;
  --checkbox-active-color: #19baff;
  --checkbox-active-border-color: #19baff77;
  --icon-button-bg-color: #eeeeee00;
  --icon-button-hover-bg-color: #eeeeee18;
  --icon-button-focus-bg-color: #eeeeee33;
  --button-background: linear-gradient(#141414, #040404);
  --button-hover-background: linear-gradient(#242424, #111111);
  --button-active-background: linear-gradient(#111111, #000000);
  --button-inset-background: linear-gradient(#222222, #333333);
  --button-shadow: 0px -0.33px 0 1px #ffffff30, 0 0 0 1px #ffffff15;
  --button-hover-shadow: 0px -0.33px 0 1px #ffffff50, 0 0 0 1px #ffffff15;
  --button-active-shadow: 0px -0.33px 0 1px #ffffff40, 0 0 0 1px #ffffff15;
  --button-inset-shadow: 0px -0.33px 0 1px #ffffff40 inset, 0 0 0 1px #ffffff15 inset;
  --heavy-3d-box-shadow: 0px -0.33px 0 1px #ffffff23, 0 8px 12px -6px #0000004d, 0 0 0 1px #ffffff15;
  --text-input-shadow: 0px -0.33px 0 1px #ffffff26, 0 6px 9px -4px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --text-input-shadow-focus: 0 0px 0 1px #22aaff, 0 6px 9px -4px #0000001a inset, 0px 0.4px 0 0.8px #0000001a inset, 0 0 0 1px #ffffff15 inset;
  --shadow-focus: 0 0px 0 1px #22aaff;
  --dropdown-shadow: 0px -0.33px 0 1px #ffffff55, 0 12px 12px -4px #00000033, 0 0 0 1px #ffffff15;
  --card-shadow: 0.25px -0.25px 0 0.75px #ffffff30, 0 4px 8px -3px #00000022, 0 0 0 1px #ffffff15;
  --card-hover-shadow: 0.25px -0.25px 0 1px #ffffff50, 0 6px 8px -4px #00000044, 0 0 0 1px #ffffff15;
}
body.black * {
  --log-color: var(--dark-log-color);
  --log-bg-color: var(--dark-log-bg-color);
  --log-hover-color: var(--dark-log-hover-color);
  --log-bg-hover-color: var(--dark-log-bg-hover-color);
}
