@layer base {
  body {
    display: grid;
    grid-template-rows: auto 1fr auto 9em;

    &.public {
      grid-template-rows: auto 1fr auto;
    }
  }

  :where(main) {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: 100dvw;
    overflow-x: clip;
    padding-inline:
      calc(var(--main-padding) + env(safe-area-inset-left))
      calc(var(--main-padding) + env(safe-area-inset-right));
    text-align: center;
  }

  .page-content {
    max-inline-size: 100%;
    min-inline-size: 0;

    /* Ensure all children can shrink */
    > * {
      max-inline-size: 100%;
      min-inline-size: 0;
    }
  }

  /* Prevent flex/grid items from overflowing */
  .panel {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  :where(footer) {
    max-inline-size: 100dvw;
  }

  :is(.header, #header, #footer) {
    @media print {
      display: none;
    }
  }
}