/* Shared by every sample: the "sample" banner and the EN/FR switch. Each sample has its own look otherwise. */
html[data-lang="en"] [lang="fr"]:not(html), html[data-lang="fr"] [lang="en"]:not(html) { display: none !important; }
.tsc-bar {
  position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 16px; background: #0F2A3D; color: #F4EFE6; font: 500 13px/1.3 system-ui, -apple-system, "Segoe UI", sans-serif;
}
.tsc-bar b { color: #F5B942; font-weight: 700; letter-spacing: .04em; }
.tsc-bar a { color: #F4EFE6; }
.tsc-bar .tsc-grow { flex: 1; min-width: 160px; }
.tsc-bar button {
  font: 600 12px system-ui, sans-serif; letter-spacing: .06em; color: #F4EFE6; background: transparent;
  border: 1px solid #3E6684; border-radius: 999px; padding: 5px 10px; cursor: pointer;
}
.tsc-bar button:hover { border-color: #F5B942; color: #F5B942; }
.tsc-bar button:focus-visible, .tsc-bar a:focus-visible { outline: 2px solid #F5B942; outline-offset: 2px; }