html,
body {
  min-height: 100%;
  padding: 0;
  margin: 0;
}

:root {
  --border-size: 2px;
  --border-color: #ddd;
}

body {
  font-family: monospace;

  wa-divider {
    --width: var(--border-size);
  }

  wa-page {
    --menu-width: 20%;
    --main-width: 80%;
  }

  wa-page[view="mobile"] {
    --menu-width: auto;
    --main-width: 100%;
  }

  wa-page::part(body) {
    inline-size: min(100%, 80rem);
    margin-inline: auto;
  }

  #header {
    text-align: center;
  }

  #navbar {
    wa-button.current::part(label) {
      text-decoration: underline;
    }
  }

  main {
    form.sign-in {
      max-width: 80ch;
    }
  }
}
