@import url(./theme.css);

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Quattrocento&display=swap');

:root {
  --vs-font-family: baskerville, 'Libre Baskerville', Georgia, serif;

  --vs-theme--dropcap-font-weight: initial;

  --vs--heading-font-family: 'Quattrocento', baskerville, 'Libre Baskerville',
    Georgia, serif;
  --vs--heading-font-weight: initial;
  --vs--heading-letter-spacing: 0.05em;
  --vs--heading-margin-block: 2rem;
  --vs--heading-text-align: center;
  --vs--h2-font-size: 1.2rem;
  --vs--h3-font-size: 1rem;
  --vs--h1-line-height: 1.25;
  --vs--h2-line-height: 1.333;
  --vs--h3-line-height: 1.5;

  --vs-page--mbox-font-family: var(--vs--heading-font-family);
  --vs-page--mbox-letter-spacing: 0.1em;
}

.part {
  --vs-section--h2-marker-display: inline;
  --vs-section--h2-marker-content: 'Adventure '
    counter(vs-counter-part, upper-roman) '. ';

  --vs-section--h3-marker-display: inline;
  --vs-section--h3-marker-content: counter(vs-counter-sec-h3, upper-roman) '.';
}
.part.part-adventure {
  --vs-section--h2-marker-content: counter(vs-counter-part, upper-roman) '. ';
}

header {
  font-family: var(--vs--heading-font-family);
  font-size-adjust: none;
  font-size: 1.2em;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  text-align: center;
  color: #333;
  margin: -1rem;
}
header > * {
  font-weight: normal;
  margin: 1.7em 0;
  break-inside: avoid;
}
header h1 {
  break-after: auto;
}
header h1 span {
  display: inline-block;
}
header div {
  break-before: auto;
  font-size: 1.2em;
}
header .author {
  break-before: avoid;
  font-size: 1.5em;
}

@media (max-width: 400px) {
  header {
    font-size: 1.1em;
    letter-spacing: 0.2em;
  }
  header > * {
    margin: 1.5em 0;
  }
  header h1 {
    font-size: 1.8em;
  }
}
@media (max-width: 350px) {
  header {
    font-size: 1em;
    letter-spacing: 0.1em;
  }
  header > * {
    margin: 1em 0;
  }
}
h2,
h3 {
  font-size-adjust: none;
  text-transform: uppercase;
}

.sign {
  break-before: avoid;
  margin: 1em 1em 2em auto;
}

.to {
  break-after: avoid;
  margin: 2em 1em -1em auto;
}

.sign,
.to {
  display: table;
  width: max-content;
  text-align: center;
  white-space: pre-wrap;
  break-inside: avoid;
  line-height: normal;
}

blockquote {
  margin: 2em 1em 1em 2em;
}
blockquote p:first-of-type::first-letter {
  font-size: 1em;
  padding-right: 0;
  font-weight: normal;
}
blockquote p:first-of-type:before {
  content: '“';
  font-weight: bold;
  float: left;
  font-size: 3em;
  margin-left: -1.5ch;
  line-height: 1;
}