.site-page {
  padding-block: var(--s-5);
}

.sheet {
  background: var(--paper);
  box-shadow: var(--sheet-shadow);
}

.masthead {
  padding-block: var(--s-3);
  margin-block-end: var(--s-6);
  border-block-end: var(--rule-heavy) double var(--rule);
}

.masthead__wordmark {
  text-transform: uppercase;
  letter-spacing: 0.24em;
}

.masthead__meta {
  color: var(--ink-soft);
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
}

.access-button {
  font: inherit;
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
  padding: var(--s-2) var(--s-3);
  border: var(--rule-thin) dashed var(--ink-soft);
  border-radius: 0;
  background: transparent;
  color: var(--ink-soft);
}

.access-button:disabled {
  cursor: not-allowed;
}

.access-button--live {
  display: inline-block;
  border-style: solid;
  border-color: var(--rule);
  color: var(--ink);
  text-decoration: none;
}

.access-button--live:hover,
.access-button--live[aria-current="page"] {
  background: var(--ink);
  color: var(--paper);
}

.masthead__wordmark a {
  color: inherit;
  text-decoration: none;
}

.notice {
  background: var(--paper-band);
}

.notice--error {
  border-color: var(--signal);
}

.colophon {
  margin-block-start: var(--s-6);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--s-2) var(--s-4);
  padding-block-start: var(--s-3);
  border-block-start: var(--rule-heavy) double var(--rule);
  color: var(--ink-soft);
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
}

.masthead__link {
  padding-block: var(--s-2);
  margin-inline-end: var(--s-3);
  color: var(--ink);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
}

.masthead__link:hover {
  text-decoration: underline;
  text-underline-offset: 0.3em;
}