@layer utilities {
  body {
    margin: 0;
    padding: 0;
    line-height: 1.5em;
    background-color: var(--colour-background);
    min-height: 100vh;
    overflow-x: hidden;
    font-size: 100%;
    font-family: "Montserrat", serif;
    color: var(--text-colour);
    line-height: 1.6;
  }

  body > .default-layout {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
  }

  body > .default-layout > footer,
  body > .default-layout > header {
    flex: 0 1;
  }

  body > .default-layout > * {
    flex: 1 0;
  }

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

  .PageHeader {
    margin-bottom: calc(2 * var(--base-size));
  }

  @media (min-width: 920px) {
    .sanstream-grid-layout {
      margin: auto;
      display: grid;
      grid-template-rows: auto;
      grid-template-columns: repeat(8, calc(4 * var(--base-size)));
      row-gap: calc(2 * var(--base-size));
      column-gap: calc(2 * var(--base-size));
    }

    .sanstream-fluid-layout {
      width: calc(46 * var(--base-size));
    }
  }

  @media (max-width: 920px) {
    .sanstream-grid-layout {
      margin: auto;
      display: initial;
      width: var(--min-content-width);
    }

    .sanstream-fluid-layout {
      width: var(--min-content-width);
    }
  }

  .sanstream-grid-layout-full-viewport {
    display: flex;
    flex-direction: column;
  }

  .sanstream-grid-layout-full-viewport > * {
    flex: 1 0 auto;
    align-self: center;
  }

  @media screen {
    .hide-on-screen {
      display: none;
    }
  }

  @media print {
    @page {
      margin: 2cm;
    }

    .hide-on-print {
      display: none;
    }

    .sanstream-fluid-layout {
      width: auto;
    }
  }

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
  }

  pre.astro-code {
    padding: 1rem;
    border-radius: 0.2rem;
    border: 1px solid var(--toned-down-border-colour);
    font-family: "Fira Code", monospace;
    font-feature-settings: "calt" 1;
    font-variant-ligatures: contextual;
    letter-spacing: 0;
  }

  /* Shiki/Monokai uses font-style:italic on tokens; Fira Code has no italic
     face, so the browser synthesizes oblique and breaks ligatures. */
  pre.astro-code span {
    font-style: normal !important;
    font-synthesis: none;
  }
}