@layer components {
.title-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-family: "Noto Sans JP", sans-serif;
  }

  /* Modifier: Alignments */
  .title-type-a {
    align-items: flex-start;
  }

  .title-type-b,
  .title-type-c {
    align-items: center;
  }

  /* Border Red */
  .title-border-red {
    width: 40px;
    height: 0;
    outline: 1px solid var(--semantic-accent-red);
    outline-offset: -0.5px;
    margin-top: 16px;
  }

  /* Title Blur Effects */
  .title-blur-100 {
    color: var(--colors-special-white);
    text-shadow: 1px 1px 0 #000;
  }

  .title-blur-50 {
    color: var(--colors-special-white);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
  }
}