/* Japanese headline serif. The subset is the check headline and result.
   Metric overrides match the fallback so the swap does not re-wrap. */
@font-face {
  font-family: "Runnr Ja Serif";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/noto-serif-jp-600-check.woff2") format("woff2");
  size-adjust: 100%;
  ascent-override: 88%;
  descent-override: 12%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Runnr Ja Serif Fallback";
  font-style: normal;
  font-weight: 600;
  src: local("Hiragino Mincho ProN"), local("Hiragino Mincho Pro"), local("Yu Mincho"), local("YuMincho"), local("Noto Serif CJK JP");
  size-adjust: 100%;
  ascent-override: 88%;
  descent-override: 12%;
  line-gap-override: 0%;
}

/* Japanese type and the founding-price chip. Rules under :lang(ja) leave other locales alone.
   i18n-pending hides every non-English page until the dictionary applies. English never gets the class. */
html.i18n-pending body * { visibility: hidden !important; }
html.i18n-pending .brand,
html.i18n-pending .logo,
html.i18n-pending h1.home-landing-title { visibility: visible !important; }

:lang(ja) {
  --font-ui: "Inter", "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
  --font-body: var(--font-ui);
  --font-head: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
  --font-num: "Inter", "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
  --fs-cap: 13px;
  --fs-sm: 13px;
  --fs-body: 14px;
}

:lang(ja) body {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: 0;
}

:lang(ja),
:lang(ja) body,
:lang(ja) body * {
  letter-spacing: 0 !important;
}

:lang(ja) em,
:lang(ja) .italic {
  font-style: normal;
  font-weight: 600;
}

:lang(ja) h1,
:lang(ja) h2,
:lang(ja) h3,
:lang(ja) h4,
:lang(ja) .logo,
:lang(ja) .brand,
:lang(ja) .home-landing-title,
:lang(ja) .home-job-title,
:lang(ja) .ob-hero h2,
:lang(ja) .account-hero h2,
:lang(ja) .leaders-head h2,
:lang(ja) .upgrade-price,
:lang(ja) .pt-name,
:lang(ja) .pt-mark,
:lang(ja) .td-title,
:lang(ja) #trend-day-title,
:lang(ja) .desk-cmd .brand {
  font-style: normal;
  font-weight: 600;
}

/* Beat #app h1/h2 resets in pages.css. Serif only on headings that are already 24px or larger. */
:lang(ja) #app h1,
:lang(ja) #app .home-landing-title,
:lang(ja) #app .home-job-title,
:lang(ja) #app .ob-hero h2,
:lang(ja) #app .account-hero h2,
:lang(ja) #app .leaders-head h2,
:lang(ja) #app .upgrade-price {
  font-family: "Runnr Ja Serif", "Noto Serif JP", "Runnr Ja Serif Fallback", serif;
  font-weight: 600;
  font-style: normal;
}

:lang(ja) h1,
:lang(ja) h2,
:lang(ja) .brand {
  font-family: "Runnr Ja Serif", "Noto Serif JP", "Runnr Ja Serif Fallback", serif;
}

:lang(ja) #header .logo,
:lang(ja) h3,
:lang(ja) h4,
:lang(ja) .upgrade-price span {
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
  font-weight: 600;
}

@media (min-width: 1024px) {
  :lang(ja) #header .logo {
    font-family: "Runnr Ja Serif", "Noto Serif JP", "Runnr Ja Serif Fallback", serif;
    font-weight: 600;
  }
}

:lang(ja) .nav-btn span,
:lang(ja) .kicker,
:lang(ja) label,
:lang(ja) button,
:lang(ja) .btn,
:lang(ja) .header-more,
:lang(ja) .header-chat,
:lang(ja) .header-pro,
:lang(ja) .live-chip,
:lang(ja) .founding-chip,
:lang(ja) .pt-kicker,
:lang(ja) .pt-nav-btn,
:lang(ja) .pt-sec-hd,
:lang(ja) [style*="uppercase"] {
  text-transform: none !important;
}

:lang(ja) .nav-btn {
  min-width: 0;
  overflow: visible;
}

:lang(ja) .nav-btn span {
  font-size: 13px;
  font-weight: 600;
  white-space: normal;
  line-height: 1.25;
  overflow: visible;
  text-overflow: clip;
}

:lang(ja) .kicker,
:lang(ja) label,
:lang(ja) .live-chip,
:lang(ja) .founding-chip,
:lang(ja) .header-more,
:lang(ja) .header-chat,
:lang(ja) .fine,
:lang(ja) .note,
:lang(ja) .math,
:lang(ja) .quiet,
:lang(ja) .free-note,
:lang(ja) .foot,
:lang(ja) .btn,
:lang(ja) .founding-caption,
:lang(ja) .founding-terms {
  font-size: 13px;
}

:lang(ja) .btn.btn-primary {
  font-size: 17px;
}

/* Founding deadline chip — gold outline, warn under a week, never red. */
.founding-chip-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0;
  flex: 0 0 auto;
  max-width: none;
  min-height: 32px;
  white-space: nowrap;
  margin: 0;
  padding: 0 2px 0 10px;
  border-radius: 999px;
  border: 1px solid var(--gold, #D9B45A);
  background: transparent;
  color: var(--gold, #D9B45A);
}

.founding-chip-wrap[hidden] {
  display: none !important;
}

/* Chips stay on the single scrolling row, including the collapsed phone header. */
#header.header-collapsed .brand-lockup {
  flex-wrap: nowrap;
}

#header.header-collapsed .header-chips {
  display: flex !important;
  flex-wrap: nowrap;
}

html.text-lg:lang(ja) {
  --fs-cap: 15px;
  --fs-sm: 15px;
  --fs-body: 16.1px;
}

html.text-lg:lang(ja) body {
  font-size: 16.1px;
}

.pt-chip-slot,
.desk-chip-slot {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}

.desk-cmd:has(.desk-chip-slot) {
  flex-wrap: wrap;
}

#modal-upgrade.modal-overlay {
  background: rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#modal-upgrade .modal {
  background: var(--surface, #10151C) !important;
  background-image: none !important;
  opacity: 1 !important;
}

.founding-chip {
  color: inherit;
  text-decoration: none;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}

.founding-chip-wrap.is-warn {
  color: var(--warn, #F2B84B);
  border-color: var(--warn, #F2B84B);
}

.founding-chip-x {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  min-width: 28px;
  min-height: 28px;
  padding: 0 6px;
  cursor: pointer;
}

.founding-caption,
.founding-terms {
  margin: 6px 0 0;
  font-family: var(--font-body, Inter, sans-serif);
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
}

.founding-caption {
  color: var(--gold, #D9B45A);
  font-weight: 600;
}

.founding-caption.is-warn {
  color: var(--warn, #F2B84B);
}

.founding-terms {
  color: var(--text2, rgba(245, 242, 236, 0.62));
  font-weight: 400;
}

.founding-caption[hidden],
.founding-terms[hidden] {
  display: none !important;
}

.lang-pick {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--border, rgba(201, 169, 110, 0.18));
  border-radius: 999px;
  color: var(--text2, rgba(245, 242, 236, 0.62));
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  flex-shrink: 0;
}

.lang-pick select {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  font-size: 16px;
}

/* /check and /prop set Cormorant italic and Jost in the page style block.
   These rules win on :lang(ja) so Japanese does not inherit that tracking or slant. */
:lang(ja) .brand,
:lang(ja) h1,
:lang(ja) .sentence {
  font-family: "Runnr Ja Serif", "Noto Serif JP", "Runnr Ja Serif Fallback", serif;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}

:lang(ja) h1,
:lang(ja) .sentence,
:lang(ja) .kicker,
:lang(ja) .lede,
:lang(ja) .soft {
  line-height: 1.45;
  overflow-wrap: anywhere;
}

:lang(ja) .kicker,
:lang(ja) label,
:lang(ja) button,
:lang(ja) .submit,
:lang(ja) .soft,
:lang(ja) .modes button,
:lang(ja) .presets button,
:lang(ja) .ccy button {
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", sans-serif;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  text-transform: none;
  white-space: normal;
  min-width: 0;
}

:lang(ja) .kicker,
:lang(ja) .lede,
:lang(ja) .soft {
  line-height: 1.55;
}

:lang(ja) .lede,
:lang(ja) .foot {
  font-weight: 400;
}

/* Japanese line breaks. auto-phrase is the browser rule. wbr in the strings
   is the fallback, and the headline phrases do not split. */
:lang(ja) h1,
:lang(ja) .lede {
  word-break: keep-all;
  word-break: auto-phrase;
  overflow-wrap: normal;
}
:lang(ja) h1 .ja-phrase,
:lang(ja) .math .ja-phrase,
:lang(ja) .quiet .ja-phrase {
  white-space: nowrap;
}
:lang(ja) .math,
:lang(ja) .quiet {
  font-size: 14px;
  color: var(--text-2, #B6BDC9);
  word-break: keep-all;
  word-break: auto-phrase;
  overflow-wrap: normal;
  text-wrap: pretty;
}
html.light:lang(ja) .math,
html.light:lang(ja) .quiet,
body.light:lang(ja) .math,
body.light:lang(ja) .quiet {
  color: var(--text3);
}
:lang(ja) .lede {
  color: var(--text-2, #B6BDC9);
}
html.light:lang(ja) .lede,
body.light:lang(ja) .lede {
  color: var(--text2);
}

/* Home h1 keeps the metrics it had as an h2. The :lang(ja) h1 rules are for /check. */
:lang(ja) #app h1.home-landing-title {
  line-height: 1.2;
  overflow-wrap: normal;
  word-break: normal;
}
