<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">:root {
  --onevh: 1vh;
  --npad: var(--onevh);
  --nmar: var(--onevh);
  --iconh: calc(var(--onevh) * 12);
  --bg:black;
  --fg:white;
  --mg:gray;
}

@media (min-aspect-ratio: 1) {
  :root {
    --iconh: calc(var(--onevw) * 12);
  }
}

html, body {
  background-color: var(--bg);
  color: var(--fg);
  font-family: monospace;
  font-size: 14px;
  min-height: -webkit-fill-available;
}

textarea, input, div { font-size: 1rem; }
textarea, input { background-color: var(--bg); color: var(--fg); border-color: transparent; }

.inputrangewrapper {
  height: 3vh;
  background-color: var(--fg);
  width: 100%;
}

.inputrange {
  position: relative;
  width: calc(100% - 3vh);
  height: 100%;
}

.inputthumb {
  position: absolute;
  background-color: var(--bg);
  height: calc(3vh - 2px);
  border: 1px solid var(--fg);
  width: 3vh;
  left: 0; top: 0;
}

.boxed { border: 1px solid var(--fg); }
.boxed-top { border-top: 1px solid var(--fg); }
.boxed-left { border-left: 1px solid var(--fg); }
.boxed-right { border-right: 1px solid var(--fg); }
.boxed-bottom { border-bottom: 1px solid var(--fg); }

.modal-button { flex: 1 1 auto; margin: var(--nmar); }
.choicebutton { margin: 0 var(--nmar) 0 0; }
.choicerow .choicebutton { margin: 0 var(--nmar) var(--nmar) 0; }
.choicecol .choicebutton { margin: 0 0 var(--nmar); 0 }

.menubutton { margin: var(--nmar) 5% 0 5%; }
@media (min-width: 1024px) {
  .menubutton { margin: var(--nmar) auto var(--nmar) auto; min-width: 80%; max-width: 1024px; }
}

.padded { padding: var(--npad); }

@media (max-width: 500px) {
  html, body { font-size: 12px; }
}

@media (min-width: 726px) {
  @media (-Webkit-min-device-pixel-ratio: 2), (-moz-min-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) {
    html, body { font-size: 150%; }
  }
}

@media (orientation: portrait) { body {} }
@media (orientation: landscape) { body {} }

.centered {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hcentered { width: 100%; display: flex; align-items: center; justify-content: center; }

.unstyledlink { text-emphasis: none; text-decoration: none; }
.wrapped { }
.option { width: calc(100% - 2 * var(--nmar)); flex: 1 1 auto; margin: var(--nmar); display: flex; flex-direction: column; flex-wrap: nowrap; }
.button, .button * {
  user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -khtml-user-select: none; -webkit-touch-callout: none;
  /* touch-action: none; */
  text-align: center;
}
.selected { background-color: var(--fg); color: var(--bg); }

.hover { background-color: var(--mg); color: var(--bg); }
.button:active { background-color: var(--mg); color: var(--bg); }
.button:active * { background-color: inherit; color: inherit; }
/* .bigbutton { margin: var(--nmar); display: grid; width: 20vw; flex: 1 1 auto; text-align: center; } */
.bigbutton { margin: var(--nmar); display: grid; flex: 1 1 auto; text-align: center; }
.bottombutton { margin: var(--nmar); display: grid; width: 20vw; flex: 1 1 auto; text-align: center; }
.labelbutton { margin: var(--nmar); display: grid; min-width: 10vw; flex: 1 1 auto; text-align: center; }
.tinput { background-color: var(--bg); color: var(--fg); border: 1px solid var(--fg); padding: var(--npad); }
.gameicon * { background-color: inherit; }
.gameicon:hover * { background-color: inherit; }
.bb, .bb * { background-color: var(--bg) !important; color: var(--fg) !important; }
.bw, .bw * { background-color: var(--fg) !important; color: var(--bg) !important; }
.bg, .bg * { background-color: var(--mg) !important; color: var(--bg) !important; }

.main-padding { width: 90%; }
@media (max-width: 768px) {
  .main-padding { width: 100%; }
}

#gamescreen, #screen, #screen &gt; * {
  user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -khtml-user-select: none; -webkit-touch-callout: none;
  touch-action: none;
}
#gamescreen { background-color: var(--bg); }

* &gt; { touch-action: none; }

.hovertip { display: block; }
.hovertip-content { display: none; background-color: var(--bg); color: var(--fg); width: 100%; position: absolute; }
.hovertip:hover &gt; .hovertip-content, .hovertip:active &gt; .hovertip-content {
  top: 0px; left: 0px;
  display: inherit;
  cursor: help;
}

.horizontal { display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; }
.vertical { display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: wrap; }
.spaced { justify-content: space-evenly; }

.mless { margin: 0; }
.med { margin: var(--nmar); }

.griddo {
  width: 40vw;
  height: 40vh;
  /*display: grid;
  grid: repeat(10, 20%) / auto-flow;*/
}
</pre></body></html>