/* Compact language control shared by the marketing and product headers. */
.language-picker, .account-picker { position: relative; flex-shrink: 0; }
.lang-toggle,
.product-header .lang-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(6 * var(--psv-u));
  width: calc(76 * var(--psv-u));
  min-width: calc(64 * var(--psv-u));
  height: var(--psv-control-size);
  min-height: max(44px, calc(44 * var(--psv-u)));
  padding: 0;
  border: 1px solid transparent;
  border-radius: calc(24 * var(--psv-u));
  color: var(--psv-text);
  background: transparent;
  font-family: var(--psv-font-sans);
  font-size: max(13px, calc(14 * var(--psv-u)));
  font-weight: 600;
  letter-spacing: normal;
  cursor: pointer;
}
.lang-toggle:hover,
.lang-toggle[aria-expanded="true"],
.product-header .lang-toggle:hover {
  color: var(--psv-text);
  border-color: transparent;
  background: rgb(var(--psv-accent-rgb) / .08);
}
.language-globe { width: calc(23 * var(--psv-u)); height: calc(23 * var(--psv-u)); flex-shrink: 0; }
.language-menu, .account-menu {
  position: absolute;
  z-index: 110;
  top: calc(100% + 8 * var(--psv-u));
  left: 50%;
  transform: translateX(-50%);
  width: calc(156 * var(--psv-u));
  min-width: calc(144 * var(--psv-u));
  max-width: calc(100vw - (32 * var(--psv-u)));
  max-height: calc(100dvh - var(--psv-header-height) - (24 * var(--psv-u)));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: calc(4 * var(--psv-u));
  border: 1px solid rgb(var(--psv-line-rgb) / .18);
  border-radius: calc(9 * var(--psv-u));
  background: var(--psv-white);
  box-shadow: 0 calc(12 * var(--psv-u)) calc(36 * var(--psv-u)) rgb(var(--psv-brand-rgb) / .14);
}
.language-menu[hidden], .account-menu[hidden] { display: none; }
.language-option, .account-login {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: max(44px, calc(44 * var(--psv-u)));
  padding: calc(8 * var(--psv-u)) calc(10 * var(--psv-u));
  border: 0;
  border-radius: calc(7 * var(--psv-u));
  background: transparent;
  color: var(--psv-text);
  font-family: var(--psv-font-sans);
  font-size: max(14px, calc(14 * var(--psv-u)));
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
}
.language-option:hover, .account-login:hover { background: rgb(var(--psv-accent-rgb) / .075); }
.language-option[aria-checked="true"] { background: var(--psv-brand); color: var(--psv-white); }
.lang-toggle:focus-visible,
.language-option:focus-visible, .account-login:focus-visible, .account-toggle:focus-visible { outline: 2px solid var(--psv-focus); outline-offset: 2px; }
/* The account control remains available on narrow screens. */
.account-toggle.header-cta {
  display: inline-flex;
  width: var(--psv-control-size);
  min-width: var(--psv-control-size);
  height: var(--psv-control-size);
  padding: 0;
  border-color: transparent;
  border-radius: 50%;
  cursor: pointer;
}
.account-toggle.header-cta:hover { color: var(--psv-text); background: rgb(var(--psv-accent-rgb) / .08); }
.account-icon { width: calc(24 * var(--psv-u)); height: calc(24 * var(--psv-u)); }
@media (min-width: 601px) {
  /* Both headers on desktop, identical so the controls never shift between the
     site and the Terminal: the language control hugs "globe TR", the account
     icon matches the globe and follows at a balanced distance. */
  :is(.site-header, .product-header) .lang-toggle { width: auto; min-width: 0; padding-inline: calc(8 * var(--psv-u)); }
  /* 2 units between the two controls in both headers (their action gaps are 10 and 6). */
  .site-header .language-picker + .account-picker { margin-inline-start: calc(-8 * var(--psv-u)); }
  .product-header .language-picker + .account-picker { margin-inline-start: calc(-4 * var(--psv-u)); }
  /* A fixed slot for the two-letter code, so changing language never nudges the globe. */
  :is(.site-header, .product-header) .language-code { min-width: calc(20 * var(--psv-u)); text-align: left; }
  /* Same size as the globe. */
  :is(.site-header, .product-header) .account-icon { width: calc(23 * var(--psv-u)); height: calc(23 * var(--psv-u)); }
  /* Compact language menu whose right edge lines up with its control (app.js sets left). */
  :is(.site-header, .product-header) .language-menu { left: 0; transform: none; width: calc(128 * var(--psv-u)); min-width: 0; }
  :is(.site-header, .product-header) .language-option {
    min-height: max(32px, calc(34 * var(--psv-u)));
    padding: calc(6 * var(--psv-u)) calc(10 * var(--psv-u));
    font-size: max(13px, calc(13 * var(--psv-u)));
  }
}
.account-login { text-decoration: none; white-space: nowrap; }
@media (max-width: 600px) {
  .header-actions { gap: 6px; }
  .lang-toggle { width: 64px; }
}
@media (max-width: 380px) {
  .site-header .brand-logo { width: 104.75px; }
  .header-inner { gap: 6px; }
  .header-actions { gap: 4px; }
  .lang-toggle { width: 60px; min-width: 60px; }
}
html:is(:lang(de),:lang(fr),:lang(es)) :is(h1,h2,h3) {
  hyphens: auto;
  overflow-wrap: anywhere;
}
@media (max-width: 380px) {
  .purchase-progress li,
  .auth-scene .purchase-progress li {
    flex-direction: column;
    gap: 2px;
    padding-inline: 2px;
  }
  .purchase-progress__number { margin-inline: 0; }
}

.account-login[hidden], .account-status[hidden] { display: none; }
.account-status { margin: 0; padding: calc(10 * var(--psv-u)); font-size: max(12px, calc(13 * var(--psv-u))); line-height: 1.5; }
.account-login { white-space: normal; }
.product-header__actions { display: flex; align-items: center; gap: calc(6 * var(--psv-u)); }
