/*
 * Definitions...
 */
:root {
  --background: rgba(0%, 1%, 2%, 1);
  --main-bg:        linear-gradient(0.25turn, transparent, rgba(0,0,0,.95) 5%, rgba(0,0,0,.95) 95%, transparent);
  --mobile-main-bg: linear-gradient(0.25turn, transparent, rgba(0,0,0,.95) 3%, rgba(0,0,0,.95) 97%, transparent);
  --text: rgb(80%, 82%, 84%);
  --black-fade-bg: radial-gradient(farthest-corner, black, black 50%, transparent);

  --bg-highlight: rgba(18%, 20%, 22%, 0.95);
  --bg-footer: linear-gradient(transparent, black 75%, black);

  --table-head: rgb(10%, 12%, 14%);
  --row1: rgb(14%, 16%,  18%);
  --row2: rgb(24%, 26%,  28%);

  --pre-border: rgb(16%, 20%, 24%);
  --pre-bg: rgb(16%, 16%, 16%);

  --main-width: 40em;

  --link-color: rgb(5%, 75%, 5%);
  --visited-color: rgb(78%, 75%, 5%);
}

/*
 * starfield canvas for background
 */
canvas#glcanvas {
  width: 100%;
  height: 100%;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -9999;
}

/*
 * basic settings...
 */
@font-face {
  font-family: "sj";
  src: url("starjedi-webfont.woff2");
}
html {
  font-size: 1.3em;
  line-height: 1.55em;
  font-family: sans-serif;
}
html, body {
  color: var(--text);
  margin: 0;
  padding: 0;

  box-sizing: border-box;
  height: 100%;
}
body {
  background-attachment: scroll;
  background: var(--background);
}
.wrapper {
  box-sizing: border-box;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}


/*
 * link coloration...
 */
a {
  color: var(--link-color);
}
a:visited {
  color: var(--visited-color);
}
a:hover {
  text-decoration: none;
}

/*
 * main column
 */
header {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--bg-header);
  padding: 0;
  margin: 0;
  flex-grow: 0;
}
main {
  width: var(--main-width);
  max-width: calc(100% - 6em);
  margin: 0 auto;
  flex-grow: 1;
  background: var(--main-bg);
  padding: 0 3em 1em 3em;
}
footer {
  background: var(--bg-footer);
  width: 100%;
  padding: 1em 0 1.5em 0;
  flex-grow: 0;
}
footer div {
  margin: 0 auto;
  background: var(--black-fade-bg);
  width: max-content;
  min-width: 10em;
  text-align: center;
}

/*
 * Header - link to home
 */
#main-title-link {
  text-decoration: none;
  padding: 0;
}
#main-title-link h1 {
  margin: 0;
  padding: 0.5em;
  font-size: 3em;
  font-family: "sj";
  color: yellow;
  text-shadow: 0 0 0.4em #dc0;
  letter-spacing: 2.5px;
  width: min-content;
  background: var(--black-fade-bg);
}
#main-title-link span {
  letter-spacing: 1px;
}


/*
 * Header nav menu - UNIVERSAL
 */
#top-nav ul li {
  list-style: none;
}
#top-nav ul {
  padding: 0;
}


/*
 * Header nav menu - DESKTOP
 */
#top-nav {
  text-align: center;
  margin: auto;
  width: calc(var(--main-width) + 2em);
  max-width: calc(100% - 6em);
}
#top-nav-on-off-button {
  display: none;
}
#top-nav-on-off-toggle {
  display: none;
}
#main-menu {
  display: flex;
  justify-content: space-between;
  border-top: thick double yellow;
  border-bottom: thick double yellow;
  background: rgba(0, 0, 0, 0.7);
  /*gap: 1.0em;*/
}
#main-menu button, 
.cta a {
  font-family: "sj";
  text-transform: lowercase;
  background: var(--black-fade-bg);
  font-size: 1.1em;
  letter-spacing: 0.05em;
  border: none;
  color: var(--text);
}
#main-menu > li {
  padding: 0.1em 0.1em;
  margin:  0.35em 0.35em;
  border-radius: 1.00em;
}
#top-nav li:hover button,
#top-nav li:focus-within button {
  cursor: default;
  color: yellow;
  text-shadow: 0 0 0.4em #dc0;
}
.cta:hover > a {
  color: #1f1 !important;
  text-shadow: 0 0 0.4em #1f1;
}
.cta > a {
  color: #1f1 !important;
  text-decoration: none;
  vertical-align: middle;
}

@keyframes fade {
  from {opacity: 0;}
  to   {opacity: 1;}
}
/*
 * Submenu off of top menu...
 */
#top-nav li:hover .sub-menu,
#top-nav li:focus-within .sub-menu {
  display: flex;
  animation: 0.3s fade;
}
.sub-menu {
  display: none;
  /*Aanimation: 0.3s reverse backwards fade;*/
  text-align: left;
  border: thick double yellow;
  border-radius: 1.2em;
  width: max-content;
  min-width: 10em;
  position: absolute;
  flex-direction: column;
  background: var(--background);
  z-index: 2;
}
.sub-menu a,
.sub-menu a:visited {
  padding: 0.5em;
  text-decoration: none;
  color: var(--text);
  font-family: "sj";
  text-transform: lowercase;
  letter-spacing: 0.1em;
  font-size: 0.8em;
}
.sub-menu a:focus,
.sub-menu a:hover {
  background: linear-gradient(0.5turn, #0e0, #afa, #0e0);
  box-shadow: 0 0 1em #0f0;
  border-radius: 1em;
  /*padding-left: 2em;*/
  color: #252;
  text-shadow: 0 0 0.5em #252;
}



.testcolumn {
  columns: 8em auto;
}

/*
 * Stuff for "skill facts"
 */
.skill_data {
  display: inline-block;
}
.skill_data pre {
  line-height: 1.5em;
  background: var(--pre-bg);
  padding: 0.1em 0.4em;
  border-radius: 0.5em;
  margin: 0;
}
.skill_stat {
  width: 8em;
  font-weight: bold;
  display: inline-block;
  vertical-align: top;
}
.skill-facts {
  margin: 1em 0;
}

/*
 * see also
 */
.see-also {
  margin-top: 1em;
}
.see-also nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.see-also nav a {
  border: 1px solid yellow;
  border-radius: 0.5em;
  padding: 0.1em 0.5em;
  margin: 0.5em 0.25em;
  text-decoration: none;
}



/*
 * Generic table stuff...
 */
table {
  width: auto;
  max-width: 100%;
  table-layout: fixed;
  /*border-collapse: collapse;*/
  border: 1px solid yellow;
}
ul {
  margin: 0;
}
td, th {
  padding: 0.25em 0.25em;
}
thead tr:nth-child(2n+1) {
  background: var(--table-head);
  font-weight: bold;
  font-style: italic;
}
tr:nth-child(2n+1) {
  background: var(--row2);
}
tr:nth-child(2n+2) {
  background: var(--row1);
}

.generic-table td {
  padding-left: 0.25em;
}


/*
 * Race list table (for do_races() /adm/daemon/site_d)
 */
table.race_table {
  border-collapse: separate;
}
.race_table td:nth-child(8n+8),
.race_table td:nth-child(8n+1) {
}
.race_table td, .race_table th {
  text-align: center;
}
.race_table td:nth-child(8n+1),
.race_table td:nth-child(8n+8) {
  text-align: left;
  padding-left: 0.25em;
}
.race_table thead,
.exp-table thead
{
  position: sticky;
  top: 0;
  background-color: var(--highlight-bg);
  user-select: none;
}
.race_table thead th:nth-child(1){
  max-width: 7em;
  cursor: pointer;
}
.race_table thead th:nth-child(8) {
  max-width: 25%;
}
.race_table thead th:nth-child(2),
.race_table thead th:nth-child(3),
.race_table thead th:nth-child(4),
.race_table thead th:nth-child(5),
.race_table thead th:nth-child(6),
.race_table thead th:nth-child(7) {
  width: 8%;
  cursor: pointer;
}
.race_table .plus-two {
  text-shadow: 0 0 0.5em #0f0;
}
.race_table .plus-one {
  text-shadow: 0 0 0.5em #099;
}
.race_table .minus-one {
  text-shadow: 0 0 0.5em #909;
}
.race_table .minus-two {
  text-shadow: 0 0 0.5em #f00;
}
.race_table .sort-ascending:after,
.race_table .sort-descending:after {
  margin-left: 0.25em;
  font-size: 0.8em;
  text-shadow: 0 0 0.333em white;
}
.race_table .sort-ascending:after {
  content: '▲';
}
.race_table .sort-descending:after {
  content: '▼';
}

/*
 * Stat table config (for /bin/panic/race_info.c)
 */
table.stat_table {
  width: auto;
  min-width: 20em;
}
.stat_table td {
  text-align: center;
}
.stat_table td:nth-child(4n+1) {
  text-align: left;
  padding-left: 1.0em;
}

/*
 * Recipe table config (for /std/build)
 */
table.recipes {
}
.recipe-basic td:nth-child(3n+1) {
  text-align: center;
}
.recipes th:nth-child(1) {
  width: 15%;
}
.recipes th:nth-child(2),
.recipes th:nth-child(3) {
  text-align: left;
}
.recipes tr.full-recipe {
  display: none;
}
#show-recipes {
  cursor: pointer;
}
#show-recipes:checked ~ table tbody tr.full-recipe {
  display: table-row;
  font-style: italic;
}
.full-recipe td {
  text-align: left;
}
.recipes tbody tr:nth-child(4n+1),
.recipes tbody tr:nth-child(4n+2) {
  background: var(--row2);
}
.recipes tbody tr:nth-child(4n+3),
.recipes tbody tr:nth-child(4n+4) {
  background: var(--row1);
}
table.recipe-items-only {
  width: auto;
  min-width: 30em;
}
.recipe-items-only td:nth-child(2n+1) {
  text-align: center;
}
.recipe-items-only th:nth-child(1) {
  width: 25%;
}
.recipe-items-only th:nth-child(2) {
  text-align: left;
}

/*
 * Guild skill list stuff (for /adm/daemon/skills_d)
 */
.skill_list {
  width: auto;
  border: 2px solid yellow;
}
.skill_list td {
  padding-left: 1.0em;
  padding-right: 1.0em;
}
.skill_list th:nth-child(1) {
  width: 7em;
}
.skill_list th:nth-child(2) {
  text-align: left;
  padding-left: 1em;
}
.skill_list th:nth-child(3) {
  width: 30%;
  text-align: left;
  padding-left: 1em;
}
.skill_list td:nth-child(3n+1) {
  text-align: center;
  padding: 0;
}
.last-mort-skill {
  border-bottom: thick double yellow;
}

.generic-skill-list {
  margin: 0;
}

/*
 * planet stuff (from /adm/daemon/located)
 */
/*
table.planet_table {
  max-width: 30em;
}
*/
.planet_table th:nth-child(1) {
  width: 40%;
}
.planet_table th:nth-child(2) {
  width: 15%;
}
.planet_table th:nth-child(3) {
  width: 15%;
}
.planet_table th:nth-child(4) {
  width: 30%;
}
.planet_table th, .planet_table td {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.planet_table td:nth-child(4n+2),
.planet_table td:nth-child(4n+3) {
  text-align: center;
}
.planet_table thead {
  position: sticky;
  top: 0;
  background-color: var(--highlight-bg);
}

.area_table th:nth-child(1) {
  width: 40%;
}
.area_table th:nth-child(2) {
  width: 15%;
}
.area_table th:nth-child(3) {
  width: 15%;
}
.area_table th:nth-child(4) {
  width: 30%;
}
.area_table th, .area_table td {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.area_table td:nth-child(4n+2),
.area_table td:nth-child(4n+3) {
  text-align: center;
}

.quote {
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 3em;
  text-align: center;
  color: red;
}
.quote div {
  margin-left: 6em;
  font-style: italic;
}
.quote div::before {
  content: "—";
}



#lore-header {
  width: max-content;
  cursor: pointer;
  user-select: none;
}
.lore-hidden {
  display: none;
}
.lore-header:after {
  content: '▼';
  font: 1.2em monospace;
  margin-left: 0.4em;
}
.lore-hidden-header:after {
  content: '▷';
  font: 1.0em monospace;
  margin-left: 0.4em;
}
.lore img {
  max-width: 25%;
  padding: 0.25em;
  margin: 0.25em;
  float: right;
  border: 1px solid yellow;
}


.exp-table td {
  text-align: right;
}


/*
h2 {
  background: linear-gradient(0.5turn, #e00, #faa, #e00);
  box-shadow: 0 0 1em #f00;
  border-radius: 1em;
  padding-left: 2em;
  color: #411;
  text-shadow: 0 0 0.5em blue;
}
*/

/*
 * mobile settings
 */
@media screen and (max-width: 800px) {
  /*
  html {
    background: var(--background);
  }
  */
  body {
    font: 0.8em sans-serif;
  }
  header h1 {
    font-size: 2.5em;
    padding: 0.1em;
  }
  main {
    width: calc(100% - 3.0em);
    max-width: unset;
    padding: 0 1.5em;
    background: var(--mobile-main-bg);
    /*background: rgba(0,0,0,0.98);*/
  }

  /*
   * Header nav menu - MOBILE
   */
  #top-nav-on-off-button {
    align-self: end;
    width: max-content;
    display: flex;
    margin: -3.5em 0.5em 1em 0;
    font-size: 1.3em;
    border-radius: 0.5em;
    border: 1px solid gray;
    background: #111;
    width: 1.4em;
    justify-content: center;
    vertical-align: center;
    padding: 0.1em;
  }
  #top-nav-on-off-toggle:checked ~ #top-nav-on-off-button {
    background: #555;
  }
  #top-nav-on-off-toggle ~ #top-nav {
    display: none;

    text-align: unset;
    margin: unset;
    max-width: unset;
  }
  #top-nav-on-off-toggle:checked ~ #top-nav {
    display: flex;
    /*display: none;*/
  }
  #top-nav {
    width: 100%;
  }
  #top-nav > ul {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  #main-menu {
    flex: 1 1 20em;
    /*background: red;*/
    background: transparent;
    gap: 0em;
    text-align: right;
  }
  #main-menu button {
    font-family: "sj";
    text-transform: lowercase;
    background: var(--black-fade-bg);
    font-size: 1.2em;
  }
  .sub-menu {
    min-width: unset;
    width: 100%;
    position: unset;
    margin: unset;
    z-index: 0;
    gap: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: center;

    padding: 0;
    list-style: none;
    border: none;
  }
  .sub-menu li {
    /*text-align: unset;*/
    background: var(--background);
    border-radius: 0.9em;
    border: 1px solid yellow;
    width: 100%;
    padding: 0.5em;
    margin: 0.2em;
  }
  .sub-menu a,
  .sub-menu a:visited {
    display:flex;
    justify-content: end;
    font-family: unset;
    text-transform: unset;
    padding: unset;
    width: 100%;
  }
  .sub-menu a:focus,
  .sub-menu a:hover {
    box-shadow: unset;
    border-radius: unset;
    background: unset;
    /*padding-left: 2em;*/
    color: unset;
    text-shadow: unset;
  }
  #top-nav li:focus ul.sub-menu,
  #top-nav li:hover ul.sub-menu {
    display: unset;
    text-align: unset;
    border: unset;
    border-radius: unset;
    width: unset;
    min-width: unset;
    position: unset;
    flex-direction: unset;
    background: unset;
    z-index: unset;
  }
  #top-nav li:hover button,
  #top-nav li:focus button {
    color: unset;
    text-shadow: unset;
  }

  .quote {
    margin: 1em;
  }
  .quote div {
    margin-left: 2em;
  }

  .race_table thead tr {
    height: 3em;
  }
  .race_table thead th:nth-child(2),
  .race_table thead th:nth-child(3),
  .race_table thead th:nth-child(4),
  .race_table thead th:nth-child(5),
  .race_table thead th:nth-child(6),
  .race_table thead th:nth-child(7) {
    transform: rotate(90deg);
    text-align: left;
  }

  .lore img {
    max-width: 45%;
  }

}

.black,
.color0 { color: #010101 !important; }

.red,
.assassin,
.color1 { color: #aa0000 !important; }

.green,
.merchant,
.color2 { color: #00aa00 !important; }

.orange,
.color3 { color: #aaaa00 !important; }

.blue,
.color4 { color: #0000aa !important; }

.magenta,
.slicer,
.color5 { color: #aa00aa !important; }

.cyan,
.bounty_hunter,
.color6 { color: #00aaaa !important; }

.white,
.scout,
.color7 { color: #aaaaaa !important; }

.bblack,
.color8 { color: #555555 !important; }

.bred,
.smuggler,
.color9 { color: #ff5555 !important; }

.bgreen,
.pilot,
.color10 { color: #55ff55 !important; }

.byellow,
.yellow,
.scientist,
.color11 { color: #ffff55 !important; }

.bblue,
.newbie,
.color12 { color: #5555ff !important; }

.bmagenta,
.mercenary,
.color13 { color: #ff55ff !important; }

.bcyan,
.jedi,
.color14 { color: #55ffff !important; }

.bwhite,
.color15 { color: #ffffff !important; }



.color16 { color: #010101 !important; }
.color17 { color: #000066 !important; }
.color18 { color: #000088 !important; }
.color19 { color: #0000bb !important; }
.color20 { color: #0000dd !important; }
.color21 { color: #0000ff !important; }

.color22 { color: #006600 !important; }
.color23 { color: #006666 !important; }
.color24 { color: #006688 !important; }
.color25 { color: #0066bb !important; }
.color26 { color: #0066dd !important; }
.color27 { color: #0066ff !important; }

.color28 { color: #008800 !important; }
.color29 { color: #008866 !important; }
.color30 { color: #008888 !important; }
.color31 { color: #0088bb !important; }
.color32 { color: #0088dd !important; }
.color33 { color: #0088ff !important; }

.color34 { color: #00bb00 !important; }
.color35 { color: #00bb66 !important; }
.color36 { color: #00bb88 !important; }
.color37 { color: #00bbbb !important; }
.color38 { color: #00bbdd !important; }
.color39 { color: #00bbff !important; }

.color40 { color: #00dd00 !important; }
.color41 { color: #00dd66 !important; }
.color42 { color: #00dd88 !important; }
.color43 { color: #00ddbb !important; }
.color44 { color: #00dddd !important; }
.color45 { color: #00ddff !important; }

.color46 { color: #00ff00 !important; }
.color47 { color: #00ff66 !important; }
.color48 { color: #00ff88 !important; }
.color49 { color: #00ffbb !important; }
.color50 { color: #00ffdd !important; }
.color51 { color: #00ffff !important; }



.color52 { color: #660000 !important; }
.color53 { color: #660066 !important; }
.color54 { color: #660088 !important; }
.color55 { color: #6600bb !important; }
.color56 { color: #6600dd !important; }
.color57 { color: #6600ff !important; }

.color58 { color: #666600 !important; }
.color59 { color: #666666 !important; }
.color60 { color: #666688 !important; }
.color61 { color: #6666bb !important; }
.color62 { color: #6666dd !important; }
.color63 { color: #6666ff !important; }

.color64 { color: #668800 !important; }
.color65 { color: #668866 !important; }
.color66 { color: #668888 !important; }
.color67 { color: #6688bb !important; }
.color68 { color: #6688dd !important; }
.color69 { color: #6688ff !important; }

.color70 { color: #66bb00 !important; }
.color71 { color: #66bb66 !important; }
.color72 { color: #66bb88 !important; }
.color73 { color: #66bbbb !important; }
.color74 { color: #66bbdd !important; }
.color75 { color: #66bbff !important; }

.color76 { color: #66dd00 !important; }
.color77 { color: #66dd66 !important; }
.color78 { color: #66dd88 !important; }
.color79 { color: #66ddbb !important; }
.color80 { color: #66dddd !important; }
.color81 { color: #66ddff !important; }

.color82 { color: #66ff00 !important; }
.color83 { color: #66ff66 !important; }
.color84 { color: #66ff88 !important; }
.color85 { color: #66ffbb !important; }
.color86 { color: #66ffdd !important; }
.color87 { color: #66ffff !important; }



.color88 { color: #880000 !important; }
.color89 { color: #880066 !important; }
.color90 { color: #880088 !important; }
.color91 { color: #8800bb !important; }
.color92 { color: #8800dd !important; }
.color93 { color: #8800ff !important; }

.color94 { color: #886600 !important; }
.color95 { color: #886666 !important; }
.color96 { color: #886688 !important; }
.color97 { color: #8866bb !important; }
.color98 { color: #8866dd !important; }
.color99 { color: #8866ff !important; }

.color100 { color: #888800 !important; }
.color101 { color: #888866 !important; }
.color102 { color: #888888 !important; }
.color103 { color: #8888bb !important; }
.color104 { color: #8888dd !important; }
.color105 { color: #8888ff !important; }

.color106 { color: #88bb00 !important; }
.color107 { color: #88bb66 !important; }
.color108 { color: #88bb88 !important; }
.color109 { color: #88bbbb !important; }
.color110 { color: #88bbdd !important; }
.color111 { color: #88bbff !important; }

.color112 { color: #88dd00 !important; }
.color113 { color: #88dd66 !important; }
.color114 { color: #88dd88 !important; }
.color115 { color: #88ddbb !important; }
.color116 { color: #88dddd !important; }
.color117 { color: #88ddff !important; }

.color118 { color: #88ff00 !important; }
.color119 { color: #88ff66 !important; }
.color120 { color: #88ff88 !important; }
.color121 { color: #88ffbb !important; }
.color122 { color: #88ffdd !important; }
.color123 { color: #88ffff !important; }



.color124 { color: #bb0000 !important; }
.color125 { color: #bb0066 !important; }
.color126 { color: #bb0088 !important; }
.color127 { color: #bb00bb !important; }
.color128 { color: #bb00dd !important; }
.color129 { color: #bb00ff !important; }

.color130 { color: #bb6600 !important; }
.color131 { color: #bb6666 !important; }
.color132 { color: #bb6688 !important; }
.color133 { color: #bb66bb !important; }
.color134 { color: #bb66dd !important; }
.color135 { color: #bb66ff !important; }

.color136 { color: #bb8800 !important; }
.color137 { color: #bb8866 !important; }
.color138 { color: #bb8888 !important; }
.color139 { color: #bb88bb !important; }
.color140 { color: #bb88dd !important; }
.color141 { color: #bb88ff !important; }

.color142 { color: #bbbb00 !important; }
.color143 { color: #bbbb66 !important; }
.color144 { color: #bbbb88 !important; }
.color145 { color: #bbbbbb !important; }
.color146 { color: #bbbbdd !important; }
.color147 { color: #bbbbff !important; }

.color148 { color: #bbdd00 !important; }
.color149 { color: #bbdd66 !important; }
.color150 { color: #bbdd88 !important; }
.color151 { color: #bbddbb !important; }
.color152 { color: #bbdddd !important; }
.color153 { color: #bbddff !important; }

.color154 { color: #bbff00 !important; }
.color155 { color: #bbff66 !important; }
.color156 { color: #bbff88 !important; }
.color157 { color: #bbffbb !important; }
.color158 { color: #bbffdd !important; }
.color159 { color: #bbffff !important; }



.color160 { color: #dd0000 !important; }
.color161 { color: #dd0066 !important; }
.color162 { color: #dd0088 !important; }
.color163 { color: #dd00bb !important; }
.color164 { color: #dd00dd !important; }
.color165 { color: #dd00ff !important; }

.color166 { color: #dd6600 !important; }
.color167 { color: #dd6666 !important; }
.color168 { color: #dd6688 !important; }
.color169 { color: #dd66bb !important; }
.color170 { color: #dd66dd !important; }
.color171 { color: #dd66ff !important; }

.color172 { color: #dd8800 !important; }
.color173 { color: #dd8866 !important; }
.color174 { color: #dd8888 !important; }
.color175 { color: #dd88bb !important; }
.color176 { color: #dd88dd !important; }
.color177 { color: #dd88ff !important; }

.color178 { color: #ddbb00 !important; }
.color179 { color: #ddbb66 !important; }
.color180 { color: #ddbb88 !important; }
.color181 { color: #ddbbbb !important; }
.color182 { color: #ddbbdd !important; }
.color183 { color: #ddbbff !important; }

.color184 { color: #dddd00 !important; }
.color185 { color: #dddd66 !important; }
.color186 { color: #dddd88 !important; }
.color187 { color: #ddddbb !important; }
.color188 { color: #dddddd !important; }
.color189 { color: #ddddff !important; }

.color190 { color: #ddff00 !important; }
.color191 { color: #ddff66 !important; }
.color192 { color: #ddff88 !important; }
.color193 { color: #ddffbb !important; }
.color194 { color: #ddffdd !important; }
.color195 { color: #ddffff !important; }



.color196 { color: #ff0000 !important; }
.color197 { color: #ff0066 !important; }
.color198 { color: #ff0088 !important; }
.color199 { color: #ff00bb !important; }
.color200 { color: #ff00dd !important; }
.color201 { color: #ff00ff !important; }

.color202 { color: #ff6600 !important; }
.color203 { color: #ff6666 !important; }
.color204 { color: #ff6688 !important; }
.color205 { color: #ff66bb !important; }
.color206 { color: #ff66dd !important; }
.color207 { color: #ff66ff !important; }

.diplomat,
.color208 { color: #ff8800 !important; }
.color209 { color: #ff8866 !important; }
.color210 { color: #ff8888 !important; }
.color211 { color: #ff88bb !important; }
.color212 { color: #ff88dd !important; }
.color213 { color: #ff88ff !important; }

.color214 { color: #ffbb00 !important; }
.color215 { color: #ffbb66 !important; }
.color216 { color: #ffbb88 !important; }
.color217 { color: #ffbbbb !important; }
.color218 { color: #ffbbdd !important; }
.color219 { color: #ffbbff !important; }

.color220 { color: #ffdd00 !important; }
.color221 { color: #ffdd66 !important; }
.color222 { color: #ffdd88 !important; }
.color223 { color: #ffddbb !important; }
.color224 { color: #ffdddd !important; }
.color225 { color: #ffddff !important; }

.color226 { color: #ffff00 !important; }
.color227 { color: #ffff66 !important; }
.color228 { color: #ffff88 !important; }
.color229 { color: #ffffbb !important; }
.color230 { color: #ffffdd !important; }
.color231 { color: #ffffff !important; }

.color232 { color: #010101 !important; }
.color233 { color: #0b0b0b !important; }
.color234 { color: #161616 !important; }
.color235 { color: #212121 !important; }
.color236 { color: #2c2c2c !important; }
.color237 { color: #373737 !important; }
.color238 { color: #424242 !important; }
.color239 { color: #4d4d4d !important; }
.color240 { color: #585858 !important; }
.color241 { color: #636363 !important; }
.color242 { color: #6e6e6e !important; }
.color243 { color: #797979 !important; }
.color244 { color: #848484 !important; }
.color245 { color: #8f8f8f !important; }
.color246 { color: #9a9a9a !important; }
.color247 { color: #a5a5a5 !important; }
.color248 { color: #b0b0b0 !important; }
.color249 { color: #bbbbbb !important; }
.color250 { color: #c6c6c6 !important; }
.color251 { color: #d1d1d1 !important; }
.color252 { color: #dcdcdc !important; }
.color253 { color: #e7e7e7 !important; }
.color254 { color: #f2f2f2 !important; }
.color255 { color: #ffffff !important; }

.underline { text-decoration: underline; }

.xmap {
  line-height: 1.1em;
}

#damage-table {
}
#damage-table tr:nth-child(2n+1) {
  background: var(--background);
}
#damage-table tr:nth-child(2n+2) {
  background: var(--background);
}

.sub-areas {
  visibility: collapse;
}

.mud-output {
  white-space: pre-wrap;
  background: var(--pre-bg);
  border-radius: 0.25em;
  border: 1px solid var(--pre-border);
  padding: 0.5em;
  line-height: 1.5em;
  font: 1.0em monospace;
}

.bottom {
  flex-grow: 1;
}