/* White page, black text, nothing loaded from anywhere else. Every font named
   here already exists on the reader's machine, so the page needs exactly two
   requests: the document and this file. */

:root {
  /* The brief is a white page with black text, so the page does not follow the
     reader's dark preference. Declaring the scheme keeps the scrollbar and the
     canvas light instead of leaving the browser to guess. */
  color-scheme: light;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: #ffffff;
  color: #000000;
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", Times, serif;
  font-size: 1.0625rem;
  line-height: 1.62;
  text-rendering: optimizeLegibility;
}

main {
  /* Centred across the page, aligned to the top of it. The entry reads as a
     page in a book, so it starts where the text of a page starts rather than
     floating in the middle of the viewport. */
  width: 100%;
  max-width: 33rem;
  margin: 0 auto;
  padding: 4.5rem 1.5rem 6rem;
}

h1 {
  margin: 0;
  font-size: 3.25rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.015em;
}

.pron {
  /* A serif face is not guaranteed to carry the IPA length mark or the stress
     mark, and a substituted glyph makes the pronunciation unreadable. Every
     system UI face on every target platform covers the IPA Extensions block,
     so name that stack here. It also sets the pronunciation apart from the
     definition text, which is what a printed dictionary does. */
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  margin: 0.75rem 0 0;
  font-size: 1rem;
  letter-spacing: 0.01em;
}

.pos {
  margin: 0.15rem 0 0;
  font-style: italic;
}

.qual {
  font-style: italic;
}

.senses {
  margin: 2.25rem 0 0;
  padding: 0;
  list-style: none;
  counter-reset: sense;
}

.senses li {
  position: relative;
  margin: 0 0 0.85rem;
  padding-left: 1.8rem;
  counter-increment: sense;
}

.senses li:only-child {
  /* A dictionary does not number a sense when there is only one of them. */
  padding-left: 0;
}

.senses li:only-child::before {
  content: none;
}

.senses li::before {
  content: counter(sense) ".";
  position: absolute;
  left: 0;
  font-variant-numeric: tabular-nums;
}

blockquote {
  margin: 2rem 0 0;
  padding: 0 0 0 1.1rem;
  border-left: 2px solid #000000;
  font-style: italic;
}

blockquote p {
  margin: 0;
}

.origin {
  margin: 2.5rem 0 0;
  padding-top: 1.35rem;
  border-top: 1px solid #000000;
  font-size: 0.95rem;
}

.origin .label {
  font-variant: small-caps;
  letter-spacing: 0.05em;
}

a {
  color: #000000;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
}

::selection {
  background: #000000;
  color: #ffffff;
}

@media (max-width: 30rem) {
  main {
    padding: 3rem 1.35rem 4rem;
  }

  h1 {
    font-size: 2.5rem;
  }
}
