:root {
  color-scheme: light;
  --ink: #202a24;
  --leaf: #237344;
  --leaf-hover: #195c35;
  --white: #ffffff;
  --muted: #526158;
  --wash: #eef5ef;
  --rule: #c5d8c9;
  --ticket: polygon(18px 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%, 0 18px);
}

* { box-sizing: border-box; }
html { font-size: 18px; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.7;
  overflow-wrap: break-word;
}
button, summary, a { font: inherit; }
a {
  color: var(--leaf);
  text-underline-offset: 0.22em;
  text-decoration-thickness: 1.5px;
}
a:hover { color: var(--leaf-hover); text-decoration-thickness: 3px; }
a:focus-visible, summary:focus-visible, button:focus-visible {
  outline: 3px solid var(--leaf);
  outline-offset: 4px;
}
main:focus { outline: none; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-weight: 700; text-wrap: balance; }
p + p { margin-top: 1rem; }
img { display: block; max-width: 100%; height: auto; }
ul { padding-left: 1.3rem; }
li + li { margin-top: 0.65rem; }
[hidden] { display: none !important; }
.wide-width { width: min(100% - 4rem, 66rem); margin-inline: auto; }
.reading-width { width: min(100% - 4rem, 68ch); margin-inline: auto; }
.opener-width { width: min(100% - 4rem, 66rem); margin-inline: auto; }
.centered-text { text-align: center; }
.small-copy { font-size: 1rem; line-height: 1.6; }
.gold-text { color: var(--leaf); }
.muted-text { color: var(--muted); }
.wine-fill { background: var(--leaf); color: var(--white); }
.wine-fill :is(a, .gold-text, .muted-text) { color: var(--white); }
.wine-fill a:hover { color: var(--white); }
.hairline-top { border-top: 3px solid var(--rule); }
.hairline-bottom { border-bottom: 3px solid var(--leaf); }
.touch-link {
  display: inline-flex;
  min-height: 48px;
  min-width: 48px;
  max-width: 100%;
  align-items: center;
  padding-block: 0.65rem;
  line-height: 1.5;
}
.skip-link {
  position: absolute;
  z-index: 10;
  inset: 0.5rem auto auto 0.5rem;
  padding-inline: 1rem;
  background: var(--white);
  color: var(--leaf);
  transform: translateY(-180%);
}
.skip-link:focus { transform: translateY(0); }

@media (max-width: 38rem) {
  .wide-width, .reading-width, .opener-width { width: calc(100% - 2.5rem); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
  body { font-size: 16px; }
  .skip-link, .menu-width, .still-frame { display: none; }
  .wide-width, .reading-width, .opener-width { width: 100%; }
  .wine-fill { background: var(--white); color: var(--ink); }
  .wine-fill :is(a, .gold-text, .muted-text) { color: var(--leaf); }
  a { text-decoration: underline; }
  article, aside { break-inside: avoid; }
}