/* MEILI AI v5.27 · 语言切换器
   ------------------------------------------------------------
   导航栏内「中 / EN」文字切换。当前语言是静态文字（aria-current），
   另一种语言是普通 <a> 链接 —— 没有 JS 也能跳，SEO 也能识别。

   桌面一处（导航右侧 .v4-nav__aside），移动一处（抽屉菜单里），
   两者互斥显示：桌面看 aside 那个，抽屉里看 menu 那个。
*/
.v5-lang {
  display: inline-flex; align-items: center; gap: 5px;
  font: 500 12px/1 var(--v4-sans); letter-spacing: .04em;
  white-space: nowrap; user-select: none;
}
.v5-lang__opt {
  color: var(--t4); text-decoration: none;
  padding: 7px 4px; border-radius: 6px;
  transition: color .3s var(--v4-ease), background .3s var(--v4-ease);
}
a.v5-lang__opt:hover { color: var(--t1); background: rgba(255, 255, 255, .06); }
.v5-lang__opt[aria-current="true"] { color: var(--t1); }
.v5-lang__opt:focus-visible { outline: 2px solid var(--t-accent); outline-offset: 2px; }
.v5-lang__sep { color: rgba(255, 255, 255, .2); font-weight: 400; }

/* 移动端那个在抽屉菜单里，默认藏起来 */
.v5-lang--m { display: none; }
@media (max-width: 1023px) {
  .v5-lang--d { display: none; }
  .v5-lang--m {
    display: inline-flex; align-self: flex-start;
    margin-bottom: var(--sp-2); padding-left: 14px;
  }
  .v5-lang--m .v5-lang__opt { padding: 8px 6px; }
}

/* ================================================================
   v5.30 · 英文文案更长的排版适配（只作用于 html[lang="en"]）

   背景：英文页多处文案比中文长 1.5~2 倍，而容器是照中文定宽的。
   实测（Chrome CDP，360~1920 共 8 个宽度）英文页被 ellipsis 切掉内容：
     .c-write__meta  「Writing desk · long-form · site / WeChat」  切 132px（8/8 宽）
     .c-lamp__chip   「peace」/「good luck」                        切 17px（8/8 宽）
     .c-browser__url 「Sample campaign site (not yet live)」        切 69px
     .c-write__tab   「Main copy」                                 切 23px
     .c-views__tab   「Main character」                            切 22px
   中文页同位置只切 22px 一处 —— 是文案长度问题，不是窄屏问题。
   下面的规则只在英文页生效，中文页排版一行不改。
   ================================================================ */

/* 写作台那行元信息：允许折行 */
html[lang="en"] .c-write__meta {
  white-space: normal; overflow: visible; text-overflow: clip;
}

/* 推荐词胶囊：按内容取宽，放不下就换行，不再各自被切 */
html[lang="en"] .c-lamp__chips { flex-wrap: wrap; }
html[lang="en"] .c-lamp__chip { flex: 0 0 auto; }

/* 浏览器地址栏：允许折到两行，工具条高度跟着长 */
html[lang="en"] .c-browser__bar { height: auto; min-height: 30px; padding-block: 5px; }
html[lang="en"] .c-browser__url {
  white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
}

/* 平台 / 标签分段控件：按内容取宽，放不下就换行 */
html[lang="en"] .c-lamp__plats,
html[lang="en"] .c-write__tabs,
html[lang="en"] .c-views__tabs { flex-wrap: wrap; }
html[lang="en"] .c-lamp__plat,
html[lang="en"] .c-write__tab,
html[lang="en"] .c-views__tab { flex: 0 0 auto; }

/* 步骤 HUD 的当前步骤标题：英文标题更长，允许折到两行 */
html[lang="en"] .v5-steps__hud span {
  white-space: normal; overflow: visible; text-overflow: clip;
}