/* 公式サイト・プレスキットの多言語の部品（11-13）。言葉ごとの書体・言葉の選び・X のリンク。style.css の後に読む。 */

/* 書体: 日本語と英語・欧州の言葉は Zen Kaku Gothic New。字の無い言葉は Google Fonts の Noto を先に置く */
html:lang(zh-Hant) body { font-family: "Noto Sans TC", "Zen Kaku Gothic New", system-ui, sans-serif; }
html:lang(ko) body { font-family: "Noto Sans KR", "Zen Kaku Gothic New", system-ui, sans-serif; }
html:lang(th) body { font-family: "Noto Sans Thai", "Zen Kaku Gothic New", system-ui, sans-serif; }
html:lang(vi) body { font-family: "Noto Sans", system-ui, sans-serif; }
/* 字の長い言葉で見出しがはみ出さないように */
h1, h2, h3, h4, p, dd, li { overflow-wrap: anywhere; }
html:lang(th) p, html:lang(th) li, html:lang(th) dd { line-break: auto; word-break: normal; }

/* 言葉の選び（上の帯の右） */
.lang-sel { margin-left: auto; position: relative; display: flex; align-items: center; }
.lang-sel select {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  font: 700 12px/1 "Chakra Petch", "Zen Kaku Gothic New", "Noto Sans TC", "Noto Sans KR", "Noto Sans Thai", "Noto Sans", sans-serif;
  letter-spacing: .04em; color: #fff; padding: 9px 30px 9px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .9);
  background: linear-gradient(180deg, var(--navy1), var(--navy2));
  box-shadow: 0 2px 8px rgba(26, 33, 82, .2); max-width: 46vw;
}
.lang-sel::after {
  content: ""; position: absolute; right: 12px; top: 50%; width: 6px; height: 6px; margin-top: -5px; pointer-events: none;
  border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg);
}
.lang-sel select option { color: var(--ink); background: #fff; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (min-width: 900px) { .lang-sel { margin-left: 24px; } }

/* 公式 X のリンク（足もと） */
.foot-x {
  display: inline-flex; align-items: center; gap: 8px; margin: 6px auto 4px; padding: 8px 16px; border-radius: 999px;
  text-decoration: none; font-weight: 700; font-size: 14px; color: #fff; background: #0f1419;
  box-shadow: 0 2px 8px rgba(15, 20, 25, .2);
}
.foot-x:hover { background: #26303a; }