main {
  position: fixed;
  top: 48px;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: auto;
  padding-top: 2px;
  padding-left: 18px;
  padding-right: 12px;
  padding-bottom: 12px;
}

main.vertical {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  padding-top: 18px;
  padding-left: 12px;
  padding-right: 2px;
}

main.upright {
  text-orientation: upright;
}

main div p {
  margin: 0.4em auto 0.4em;
}

main.vertical div p {
  margin: auto 0.4em auto;
}

.title p {
  font-size: 1.4em;
  font-weight: bold;
}

.author p {
  font-size: 0.9em;
  text-align: right;
}

.chars-headline p {
  font-weight: bold;
}

.character p:first-child {
  margin-left: 1em;
  margin-bottom: 0.1em;
}

main.vertical .character p:first-child {
  margin-top: 1em;
  margin-left: 0.1em;
  margin-bottom: auto;
}

.character p:nth-child(2) {
  font-size: 0.9em;
  margin-left: 3em;
  margin-top: 0.1em;
}

main.vertical .character p:nth-child(2) {
  margin-left: auto;
  margin-top: 3em;
  margin-right: 0.1em;
}

.headline-1 p {
  font-size: 1.2em;
  font-weight: bold;
  margin: 1em auto 1em;
}

main.vertical .headline-1 p {
  margin: auto 1em auto;
}

.headline-2 p {
  font-size: 1.1em;
  font-weight: bold;
  margin: 1em auto 1em;
}

main.vertical .headline-2 p {
  margin: auto 1em auto;
}

.headline-3 p {
  font-weight: bold;
  margin: 1em auto 1em;
}

main.vertical .headline-3 p {
  margin: auto 1em auto;
}

.direction p {
  margin: 1em auto 1em 3.5em;
}

main.vertical .direction p {
  margin: 3.5em 1em auto 1em;
}

.dialogue p:first-child {
  font-size: 0.9em;
  font-weight: bold;
  margin-bottom: 0.1em;
}

main.vertical .dialogue p:first-child {
  margin-left: 0.1em;
  margin-bottom: auto;
}

.dialogue p:nth-child(2) {
  margin-left: 1em;
  margin-top: 0.1em;
}

main.vertical .dialogue p:nth-child(2) {
  margin-left: auto;
  margin-top: 1em;
  margin-right: 0.1em;
}

.endmark p {
  font-size: 0.9em;
  text-align: right;
}

span.matched {
  background: #ee8;
}

span.matched.current {
  background: #ec8
}
