@layer base {
  :root {
    --border-radius: 10px;

    & * {
      box-sizing: border-box;
    }
  }

  .layout-container {
    & a,
    button[data-click] {
      display: inline;
      color: var(--color-primary);
      transition: var(--transition);
      font: inherit;

      &:hover,
      &:focus-visible {
        color: var(--color-secondary);
      }
    }

    & button {
      transition: var(--transition);
      color: inherit;
    }

    & p + p {
      margin-block-start: 1em;
    }

    & svg,
    & img {
      max-inline-size: 100%;
      height: auto;
    }

    & svg {
      fill: transparent;
    }

    & ul,
    & ol {
      padding-inline-start: 2ch;
      margin-block: 1rem;

      & ul,
      & ol {
        margin-block: .25ch;
      }

      & li + li {
        margin-block-start: .25ch;
      }
    }
  }
}
