body, html {
  width: 100dvw;  
  height: 100dvh;  
}

body {
  background-image:url('/static/bg_main.jpg');
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
}

.outer {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.flexed {
  flex: 1 0 0;
  min-width: 0;
  overflow: hidden;
}

.flexed-scroll {
  flex: 1 0 0;
  min-width: 0;
  overflow: scroll;
}

.inner {
  height: 100%;
  max-width: min(55em, 100%);
}

.innerinner {
  height: 100%;
}

.dialog-code .overlay {
  border-radius: 1em;
}

.error-container {
  padding: 1em;
}

.tooltip.wrap {
  white-space: normal;
  max-width: 20em;
}

.glow.black {
  box-shadow: 0px 0px 10px 3px #000000;
}

.glow.amber {
  box-shadow: 0px 0px 10px 3px #ffbf00;
}

.glow.green {
  box-shadow: 0px 0px 10px 3px #00ff00;
}

.glow.red {
  box-shadow: 0px 0px 10px 3px #ff0000;
}

.logs-dialog {
  min-height: 80vh;
  width: 80vw;
  max-width: 80vw;
  display: flex;
  flex-direction: column;
}

.logs-dialog code.scroll {
  flex: 1;
  overflow-y: auto;
  overflow-anchor: auto;
  min-height: 0;
}