@layer base {
    body {
      color: #333;
      background: var(--color-theme-cinnamon-bg);
    }

  .page-container {
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
    margin-left: auto;
    margin-right: auto;
  }

  .main {
    --main-min-width: 320px;
    --preferred-main-width: 100%;

    width: clamp(var(--main-min-width), var(--preferred-main-width, 960px), var(--main-width, 960px));
    max-width: var(--main-width);
    padding: var(--block-space-half);
    margin-left: auto;
    margin-right: auto;
    flex: 1;
  }

  @media (min-width: 640px) {
    .main {
      padding: var(--block-space);
    }
  }
}

/* Override lexxy's text-wrap: pretty, which doesn't work well for Japanese.
   Specificity matches lexxy's (0,2,1) and source order favors us. */
.lexxy-content :is(p, ul, ol, dl, blockquote, figure, .attachment, .attachment-gallery):not(lexxy-editor *) {
  text-wrap: wrap;
}