:root {
  color-scheme: dark;
  --bg: #050805;
  --green: #35e835;
  --dim-green: #197719;
  --red: #ff3045;
  --yellow: #d6b700;
  --blue: #1267ff;
  --magenta: #d000d0;
  --cyan: #5ee8e8;
  --white: #dddddd;
}

html,
body {
  min-height: 100%;
  margin: 0;
  background: var(--bg);
  color: var(--green);
  font-family: Consolas, "Courier New", monospace;
}

#app {
  min-height: 100vh;
  box-sizing: border-box;
  padding: 10px 10px 42px;
  overflow-x: auto;
}

#screen {
  margin: 0;
  white-space: pre;
  overflow-wrap: normal;
  font: inherit;
  line-height: 1.18;
}

#commandForm {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.4rem;
  padding-bottom: 2rem;
  font: inherit;
}

#promptLabel {
  white-space: nowrap;
}

#commandInput {
  flex: 1;
  min-width: 8rem;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--green);
  font: inherit;
  caret-color: var(--white);
}

.red { color: var(--red); }
.green { color: var(--green); }
.dim { color: var(--dim-green); }
.yellow { color: var(--yellow); }
.blue { color: var(--blue); }
.magenta { color: var(--magenta); }
.cyan { color: var(--cyan); }
.white { color: var(--white); }
.bold { font-weight: 700; }