html:lang(ja) {
  --font-ja: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, "Noto Sans JP", sans-serif;
  line-break: strict;
}

html:lang(ja) body {
  font-family: var(--font-ja);
  font-kerning: normal;
  overflow-wrap: anywhere;
}

html:lang(ja) h1,
html:lang(ja) h2,
html:lang(ja) h3,
html:lang(ja) h4 {
  overflow-wrap: normal;
  word-break: auto-phrase;
}

html:lang(ja) h1,
html:lang(ja) h2,
html:lang(ja) h3,
html:lang(ja) h4,
html:lang(ja) label,
html:lang(ja) button,
html:lang(ja) .button,
html:lang(ja) .text-action,
html:lang(ja) .stage-stat,
html:lang(ja) .return-link,
html:lang(ja) .quiet-action,
html:lang(ja) .site-footer {
  font-family: var(--font-ja);
  letter-spacing: 0;
  text-transform: none;
}

html:lang(ja) .brand,
html:lang(ja) .hero-title,
html:lang(ja) .lockup {
  font-family: var(--font-display, "agency-fb", "Arial Narrow", sans-serif);
}

html:lang(ja) .hero-title { letter-spacing: -.04em; }
html:lang(ja) .brand,
html:lang(ja) .lockup { letter-spacing: .26em; text-transform: uppercase; }
html:lang(ja) .hero-belief,
html:lang(ja) .story-intro h2,
html:lang(ja) .beta h2,
html:lang(ja) .intro h1,
html:lang(ja) .release-notes-intro h2 { line-height: 1.12; }
html:lang(ja) .hero-belief {
  max-width: none;
  font-size: clamp(2rem, 3.4vw, 3.4rem);
}
html:lang(ja) .hero-belief > span {
  display: block;
  white-space: nowrap;
}
html:lang(ja) .hero-description .ja-term {
  display: inline;
  margin: 0;
  color: inherit;
  white-space: nowrap;
}
html:lang(ja) body > main > h1,
html:lang(ja) .signup-dialog h2,
html:lang(ja) .portal-content h2 {
  max-width: none;
  line-height: 1.18;
}
html:lang(ja) body > main > h1 {
  font-size: clamp(2.4rem, 8vw, 4.5rem);
}
html:lang(ja) .signup-dialog h2,
html:lang(ja) .portal-content h2 {
  font-size: clamp(2.1rem, 5vw, 3.6rem);
}
html:lang(ja) .portal-content h2 {
  font-size: clamp(2.1rem, 5vw, 3.3rem);
  overflow-wrap: anywhere;
  word-break: normal;
}

html:lang(ja) .portal-stage,
html:lang(ja) .stage-body,
html:lang(ja) .portal-content {
  min-width: 0;
}
html:lang(ja) .intro h1 {
  max-width: none;
  font-size: clamp(3.4rem, 6.2vw, 5rem);
}
html:lang(ja) .intro h1 > span {
  display: block;
  white-space: nowrap;
}
html:lang(ja) .story-intro h2,
html:lang(ja) .beta h2,
html:lang(ja) .intro h1,
html:lang(ja) .release-notes-intro h2 { max-width: 13ch; }

@media (max-width: 440px) {
  html:lang(ja) .site-nav { gap: .72rem; }
  html:lang(ja) .site-nav a { font-size: .78rem; }
}

@media (max-width: 600px) {
  html:lang(ja) .release-notes-intro h2 {
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

@media (max-width: 360px) {
  html:lang(ja) .intro h1 { font-size: 2.7rem; }
}
