/* Prevent a flash of source copy while the selected catalog is loading. */
html[data-localizing] body { visibility:hidden; }
.language-control {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:76px;
  height:36px;
  flex:none;
  border-radius:8px;
  color:var(--nav-ink);
  font-size:11px;
  font-weight:550;
}
.language-control:hover { background:var(--toggle-hover); }
.language-control:focus-within { outline:3px solid var(--blue); outline-offset:3px; }
.language-control>.icon { width:16px; height:16px; }
.language-control>.language-chevron { width:11px; height:11px; }
.language-control select { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.language-control option { background:var(--nav-surface); color:var(--nav-ink); }
.nav-actions { gap:8px; }
.site-header .nav-links { gap:20px; }
.source-tab span { min-width:0; }
.source-copy, .section-heading>div, .detail-item { min-width:0; }
.section-heading h2, .detail-item h3, .source-copy h3 { overflow-wrap:break-word; hyphens:auto; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .hero h1 { font-size:clamp(34px,3.35vw,50px); letter-spacing:-1.6px; hyphens:auto; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .hero-description { font-size:14px; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .source-copy h3 br { display:initial; }
.hero-scenario-label { min-width:0; max-width:100%; white-space:normal; text-align:left; overflow-wrap:anywhere; hyphens:auto; }
.tiny-menu>span { white-space:nowrap; }
.tiny-menu kbd { flex:none; padding-left:4px; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .tiny-menu { font-size:9px; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .detail-artwork-label { font-size:8px; }
.mini-notes>span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mini-notes small { line-height:1.5; }
/* Demonstrations use a fixed artboard; keep translated chrome inside its bounds. */
.hs-float-title strong, .demo-float-top strong { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; min-width:0; }
.hs-menubar>span, .demo-desktop-menu>span, .demo-mini-menu>span { white-space:nowrap; }
html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) :is(.ha-sidebar,.hl-doc-sidebar,.hb-mail-layout>aside) { font-size:11px; }
@media (max-width:1100px) {
  .site-header .nav-links { gap:14px; font-size:12px; }
  .nav-shell { gap:18px; }
}
@media (max-width:1000px) {
  .site-header .nav-links { display:none; }
  .nav-actions { margin-left:auto; }
}
@media (max-width:850px) {
  html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .hero h1 { font-size:clamp(34px,6vw,52px); }
}
@media (max-width:540px) {
  .nav-shell { gap:10px; }
  .nav-download-label { display:none; }
  .site-header .nav-actions .button { width:36px; min-height:36px; padding:0; gap:0; }
  .source-tab span { overflow-wrap:anywhere; line-height:1.35; }
  .source-tabs { align-items:stretch; }
  .source-tab { min-height:48px; }
  .hero-scenario { font-size:10px; }
  html:not(:lang(zh)):not(:lang(ja)):not(:lang(ko)) .tiny-menu { font-size:7px; }
  .detail-footnote { justify-content:flex-start; }
}