body {
  cursor: not-allowed;
  background: var(--z0);
  font: 1em/160% sans-serif;
}

.container {
  position: absolute;
  margin: 0 calc(50vw - 340px);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-left: solid var(--z1) 1px;
  border-right: solid var(--z1) 1px;
}

.line {
  position: absolute;
  height: 32px;
  background: var(--a2);
  right: 0;
  font-family: "Andale Mono", monospace;
  letter-spacing: -0.45px;
}

.line.green {
  background: var(--d2);
  color: var(--d13);
  padding: 0 var(--x1);
  font: 18px/33px Andale Mono, monospace;
}

.header .line.green {
  line-height: inherit;
}

.header .line {
  position: static;
  display: inline-block;
  padding: 0 var(--x1);
  margin: 0 var(--y1);
  height: var(--x3);
}


.sheet {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  resize: none;
  border: none;
  overflow: auto;
  outline: none;
  box-shadow: none;
  font: 18px/33px Andale Mono, monospace;
  caret-color: var(--f6);
  background: transparent;
  color: var(--z12);
  box-sizing: border-box;
  user-select: auto;
  scroll-behavior: smooth;
  letter-spacing: -0.45px;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  padding: 64px calc(50vw - 340px);
  min-height: 100%;
  scrollbar-color: var(--z2) transparent;
  scrollbar-width: thin;
  overflow-y: scroll;
  pointer-events: none;
}

.sheet::-webkit-scrollbar {
    background: transparent;
    width: var(--dobl);
    padding-right: 4px;
}
 
.sheet::-webkit-scrollbar-track {
    background: transparent;
}
 
.sheet::-webkit-scrollbar-thumb {
  background-color: var(--z2);
  border-radius: var(--unit);
}

.sheet.jump {
  scroll-behavior: auto;
}
 
.copied .sheet {
  color: var(--z1);
}

.sheet.disabled {
  user-select: none;
  opacity: 0.2;
}

.sheet.hidden {
  opacity: 0;
  pointer-events: none;
}

.sheet::placeholder {
  color: var(--z4);
}

.highlight {
  position: absolute;
  top: 64px;
  left: 0;
  right: 0;
}



.header, .footer {
  text-align: center;
}

.header span {
  color: var(--z15);
}

.header span.highlight {
  background: var(--a6);
}

.footer {
  top: 32px;
  padding: 32px;
}

.counter {
  background: var(--z1);
  display: inline-block;
  color: var(--z10);
  border-radius: 20px;
  padding: 0 var(--x2);
  line-height: var(--x4);
}

.header .instructions {
  color: var(--z6);
  padding: var(--x2);
}

@media only screen and (max-width: 980px) {
  
  .sheet {
    line-height: 160%;
    padding: var(--header-height) 5vw;
  }



}