/* Match the studio palette while keeping navigation and language controls distinct. */
.studio-home header { gap: 28px; flex-wrap: wrap; }
.studio-home header > nav:first-of-type { margin-left: auto; }
.studio-home .language-switcher { position: relative; flex-shrink: 0; width: 112px; font-size: 12px; }
/* Keep the native picker and the no-JS dropdown visually consistent with the studio palette. */
.language-switcher select,
.language-switcher summary { width: 100%; min-height: 36px; padding: 8px 30px 8px 12px; border: 1px solid var(--line); border-radius: 20px; background-color: var(--paper); color: var(--ink); font: inherit; line-height: 18px; cursor: pointer; }
.language-switcher select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%23292e27' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
.language-switcher summary { list-style: none; position: relative; }
.language-switcher summary::-webkit-details-marker { display: none; }
.language-switcher summary::after { content: ""; position: absolute; right: 14px; top: 13px; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.language-switcher select:focus-visible,
.language-switcher summary:focus-visible { outline: 3px solid var(--rust); outline-offset: 3px; }
.language-switcher details > nav { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; display: flex; flex-direction: column; gap: 2px; min-width: 132px; padding: 6px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); box-shadow: 0 8px 24px #292e2718; font-size: 12px; }
.language-switcher a { padding: 7px 10px; border-radius: 6px; white-space: nowrap; }
.language-switcher a[aria-current="true"] { background: var(--ink); color: var(--paper); }
.language-switcher a:hover { text-decoration: underline; text-underline-offset: 3px; }
/* Chinese needs appropriate reading metrics rather than English heading letter spacing. */
html[lang="zh-CN"] .studio-home { font-family: "Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif; }
html[lang="zh-CN"] .studio-home h1,
html[lang="zh-CN"] .studio-home h2,
html[lang="zh-CN"] .studio-home h3,
html[lang="zh-CN"] .studio-home h4 { font-family: "Songti SC", "Noto Serif CJK SC", "SimSun", serif; letter-spacing: 0; line-height: 1.2; }
html[lang="zh-CN"] .label { letter-spacing: .08em; }
@media (max-width: 760px) {
  .studio-home header { flex-direction: row; align-items: center; gap: 16px; }
  .studio-home header > .brand { margin-right: auto; }
  .studio-home header > nav:first-of-type { order: 3; margin-left: 0; width: 100%; }
}
@media (max-width: 360px) {
  .studio-home header > .brand { font-size: 18px; gap: 8px; }
}