/* TOOPIC_VISION — 顶栏搜索（保留原背景色系） */
.header,
.header .fixed,
.header .layout-r,
.header .search-form { overflow: visible; }
.header .search-form.sv-ready { position: relative; z-index: 80; }
.header .search-form.sv-ready .s-txt,
.header .search-form.sv-ready #search-keyword {
  width: 320px !important; height: 38px !important;
  padding: 0 138px 0 16px !important; font-size: 13px !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  caret-color: #fff !important; outline: none; box-sizing: border-box;
  border-radius: 19px !important;
}
.header .search-form.sv-ready .s-txt::placeholder,
.header .search-form.sv-ready #search-keyword::placeholder {
  color: rgba(255,255,255,.38) !important;
  -webkit-text-fill-color: rgba(255,255,255,.38) !important; opacity: 1;
}
/* SV_PC_ONLY_FOCUS_WIDTH_V1：`:focus` 时把输入框撑到 320px 是 PC 版设计。
 * 本条原先无媒体查询、特异性 (0,5,0)，高于窄屏段（@media max-width:960px 里的
 * `.header .search-form.sv-ready .s-txt` = (0,4,0)），于是 769~960px 区间（搜索框仍显示）
 * 一聚焦就把输入框从 200px 撑到 320px，挤压右侧登录按钮；
 * ≤768px 时因搜索页的 `#search-keyword:focus`(1,4,0) 权重更高才没暴露。
 * 故限定宽屏——窄屏聚焦不改变尺寸。 */
@media (min-width: 961px) {
  .header .search-form.sv-ready .s-txt:focus,
  .header .search-form.sv-ready #search-keyword:focus {
    width: 320px !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
  }
}
/* 搜索按钮定位：垂直居中式（与首页 home-index.css 同款做法），不要用固定的 4px。
 * 原因：已登录时 .layout-r 内多出更高的用户块（.user-data = 34px 头像 + 2×2px 边框
 * + 4+4px 内边距 = 46px），而 .layout-r 是 display:flex 且未设 align-items（=stretch），
 * 于是 .search-form 被从 38px 拉伸到 46px，输入框仍以 align-items:center 在其中居中
 * （上下各留 4px）。此时固定 top:4px 恰好把按钮顶到输入框的顶边，视觉上偏上 4px。
 * 居中定位与容器高度无关：无论 form 是 38px 还是 46px，按钮中心始终等于输入框中心。 */
.header .search-form.sv-ready .search-form-icon {
  left: auto !important; right: 4px !important;
  top: 50% !important; transform: translateY(-50%) !important;
  width: 30px !important; height: 30px !important; padding: 7px; box-sizing: border-box;
  border-radius: 50%;
  z-index: 4; display: inline-flex !important; align-items: center; justify-content: center;
}
/* SV_PC_ONLY_ICON_STATE_V1：图标的 hover/聚焦态配色（浅灰底方块）是 PC 白圆设计的一部分，
 * 必须限定宽屏——否则窄屏聚焦时会给 16px 透明图标加一块浅灰底，观感异常。 */
@media (min-width: 961px) {
  .header .search-form.sv-ready .search-form-icon:hover,
  .header .search-form.sv-ready .s-txt:focus ~ .search-form-icon,
  .header .search-form.sv-ready:focus-within .search-form-icon {
    color: #12161e !important; background: #f3f4f6 !important;
  }
}
.sv-wrap { position: static; }
.sv-btn {
  position: absolute; right: 40px; top: 4px; bottom: 4px; padding: 0 8px;
  border: 0; border-radius: 14px; background: transparent;
  color: rgba(255,255,255,.72); font-size: 12px; font-weight: 500;
  white-space: nowrap; cursor: pointer; display: inline-flex !important;
  align-items: center; gap: 5px; z-index: 3; font-family: inherit; line-height: 1;
  visibility: visible !important; opacity: 1 !important;
}
.sv-btn:hover, .header .search-form.sv-open .sv-btn {
  color: #fff; background: rgba(255,255,255,.12);
}
.sv-btn svg { flex-shrink: 0; width: 14px; height: 14px; }
.sv-btn-label { pointer-events: none; }
.sv-pop {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  width: 320px;
  padding: 14px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 36px rgba(16, 18, 24, .18);
  z-index: 90;
  text-align: left;
  box-sizing: border-box;
}
.header .search-form.sv-open .sv-pop { display: block; }
.sv-arrow {
  position: absolute;
  top: -5px;
  left: var(--arrow-x, 258px);
  width: 10px;
  height: 10px;
  margin: 0;
  background: #fff;
  transform: translateX(-50%) rotate(45deg);
  box-shadow: -1px -1px 0 rgba(16, 18, 24, .08);
  pointer-events: none;
}
.sv-hd {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.sv-hd .ico {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: rgba(20, 150, 255, .1);
  color: #1496ff;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.sv-hd h4 {
  font-size: 14px;
  font-weight: 600;
  color: #1496ff;
  margin: 0;
}
.sv-hd p {
  margin: 2px 0 0;
  font-size: 12px;
  color: #8a9099;
  line-height: 1.4;
}
.sv-drop {
  height: 132px;
  border: 1px dashed #d5dae2;
  border-radius: 10px;
  background:
    linear-gradient(#f7f8fb, #f7f8fb) padding-box,
    repeating-linear-gradient(-45deg, transparent, transparent 6px, rgba(0,0,0,.015) 6px, rgba(0,0,0,.015) 7px);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
}
.sv-drop:hover,
.sv-drop.over {
  border-color: #9aa7b8;
  background: #f1f4f8;
}
.sv-drop-ico {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #fff;
  color: #3c4450;
  display: grid;
  place-items: center;
  box-shadow: 0 1px 2px rgba(16, 18, 24, .06);
}
.sv-drop b {
  font-size: 13px;
  font-weight: 600;
  color: #242830;
}
.sv-ways {
  display: flex;
  gap: 6px;
}
.sv-ways span {
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #e6e9ee;
  font-size: 11px;
  color: #6a717c;
  display: inline-flex;
  align-items: center;
}
.sv-hint {
  margin-top: 10px;
  font-size: 11px;
  color: #9aa0a8;
  text-align: center;
}
.sv-err {
  margin-top: 8px;
  font-size: 12px;
  color: #c0392b;
  text-align: center;
  display: none;
}

/* 选图后显示在搜索胶囊内，点白圆搜索再提交 */
.sv-chip {
  display: none;
  position: absolute;
  left: 8px;
  top: 4px;
  bottom: 4px;
  right: 138px;
  align-items: center;
  gap: 8px;
  z-index: 2;
  min-width: 0;
  pointer-events: none;
}
.header .search-form.sv-has-img .sv-chip {
  display: flex;
}
.header .search-form.sv-has-img .s-txt,
.header .search-form.sv-has-img #search-keyword {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  caret-color: transparent !important;
}
.header .search-form.sv-has-img .s-txt::placeholder,
.header .search-form.sv-has-img #search-keyword::placeholder {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
.sv-chip img {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  object-fit: cover;
  flex-shrink: 0;
  background: rgba(255,255,255,.12);
}
.sv-chip-name {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,.92);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sv-chip-x {
  pointer-events: auto;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  padding: 0;
  margin: 0;
  background: rgba(255,255,255,.14);
  color: #fff;
  font-size: 14px;
  line-height: 22px;
  cursor: pointer;
  flex-shrink: 0;
  font-family: inherit;
}
.sv-chip-x:hover {
  background: rgba(0,0,0,.14);
}
@media (max-width: 960px) {
  .sv-wrap,
  .sv-btn,
  .sv-pop,
  .sv-chip { display: none !important; }
  .header .search-form.sv-ready .s-txt,
  .header .search-form.sv-ready #search-keyword {
    width: 200px !important;
    height: 36px !important;
    /* SV_NARROW_PADDING_V1：窄屏左内边距必须与图标（left:12px + 16px 宽 = 28px 处结束）
       留出清晰间隔（40-28=12px），右内边距 36px 与 .sv-clear（right:8px + 22px 宽）
       匹配（36-30=6px 安全距离）。此值必须与 search-page.css 的 __SOSO_M_SEARCH__ 段
       保持一致——搜索页那条权重更高，若两处不一致会出现"同一元素两套内边距"。 */
    padding: 0 36px 0 40px !important;
  }
  .header .search-form.sv-ready .search-form-icon {
    left: 12px !important;
    right: auto !important;
    /* 窄屏图标回到左侧、top:auto（用 flex 居中得到的静态位置），
       因此必须一并清掉基础规则的 translateY(-50%)，否则会再上移半个自身高度 */
    top: auto !important;
    transform: none !important;
    width: 16px !important;
    height: 16px !important;
    padding: 0;
    background: transparent !important;
    /* 窄屏输入框是深色半透明底，图标必须用浅色描边才可见；
       原先这里的深色 rgba(26,31,42,.35) 是配「PC 白圆底」用的，
       在透明底 + 深色输入框上等于看不见（与基础层 .search-form-icon 的浅色一致）。 */
    color: rgba(255,255,255,.42) !important;
    border-radius: 0;
    box-shadow: none;
  }
}

/* ---- 以图搜图结果页 ---- */
.sv-page { padding: 0 50px 60px; width: 100%; box-sizing: border-box; }
.sv-page-hero { display: flex; align-items: baseline; justify-content: space-between; padding: 24px 0 16px; gap: 12px; flex-wrap: wrap; }
.sv-page-hero h1 { font-size: 22px; font-weight: 700; color: #1a1a1a; margin: 0; }
.sv-page-hero p { margin: 0; font-size: 14px; color: #888; }
.sv-page-hero em { color: #1496ff; font-style: normal; font-weight: 700; }
.sv-tabs { display: flex; gap: 4px; flex-wrap: wrap; background: #fff; border-radius: 14px; padding: 8px; margin-bottom: 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.sv-tab { display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border-radius: 10px; color: #777; font-size: 14px; text-decoration: none; }
.sv-tab span, .sv-tab-on span { display: inline-flex; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 10px; font-size: 11px; font-weight: 600; background: rgba(0,0,0,0.06); color: #999; align-items: center; justify-content: center; }
.sv-tab.active, .sv-tab-on { color: #333; background: #f0f7ff; font-weight: 700; }
.sv-tab.active span, .sv-tab-on span { background: rgba(20,150,255,0.12); color: #1496ff; }
.sv-sec { margin: 0 0 28px; }
.sv-sec h2 { font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 14px; letter-spacing: .02em; }
.sv-sec + .sv-sec { padding-top: 8px; border-top: 1px solid rgba(0,0,0,.06); }
.sv-page-grid { display: block; margin: 0; padding: 0; list-style: none; }
.sv-page-grid li { list-style: none; box-sizing: border-box; padding: 0 9px 18px; width: 25%; float: left; }
.sv-page-grid.grid-mobile li, .sv-page-grid.sv-grid-mobile li { width: 16.666%; }
.sv-page-card { display: block; text-decoration: none; background: #fff; border-radius: 14px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.04); color: inherit; }
.sv-page-card img { width: 100%; height: auto; display: block; border: 0; }
.sv-page-card-t { padding: 10px 12px 12px; font-size: 14px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-page-clear { clear: both; height: 0; }
.sv-page-empty { text-align: center; padding: 80px 20px; clear: both; color: #999; }
.sv-page-empty a { color: #1496ff; text-decoration: none; margin: 0 4px; }
@media (max-width: 1200px) {
  .sv-page-grid li { width: 33.333%; }
}
@media (max-width: 768px) {
  .sv-page { padding: 0 16px 40px; }
  .sv-page-grid li,
  .sv-page-grid.grid-mobile li,
  .sv-page-grid.sv-grid-mobile li { width: 50%; }
}


.header .search-form.sv-ready .s-txt::-webkit-search-cancel-button,
.header .search-form.sv-ready #search-keyword::-webkit-search-cancel-button {
  -webkit-appearance: none; appearance: none; display: none;
}
.header .search-form.sv-ready .s-txt,
.header .search-form.sv-ready #search-keyword {
  transition: width .2s ease, padding .2s ease;
}
/* SV_PC_ONLY_FILLED_V1：这几条是 PC 版设计（输入内容后收窄输入框、给右侧按钮/清除留位）。
 * 必须用媒体查询与窄屏段（@media max-width:960px，图标回左侧、padding 0 16px 0 36px）隔离：
 * 否则它们的 !important 会盖掉窄屏的 padding，使左侧图标（left:12px/16px 宽）与文字（padding-left 16px）
 * 重叠在一起（实测症状：搜索后白圆图标压在关键词上）。 */
@media (min-width: 961px) {
  .header .search-form.sv-ready.sv-filled .s-txt,
  .header .search-form.sv-ready.sv-filled #search-keyword,
  .header .search-form.sv-ready.sv-filled .s-txt:focus,
  .header .search-form.sv-ready.sv-filled #search-keyword:focus {
    width: 280px !important;
    padding: 0 72px 0 16px !important;
  }
  .header .search-form.sv-ready.sv-filled .sv-btn,
  .header .search-form.sv-ready.sv-filled .sv-wrap { display: none !important; }
  .header .search-form.sv-filled .sv-chip { right: 72px; }
}
.sv-clear {
  display: none; position: absolute; right: 40px; top: 50%; margin-top: -11px;
  width: 22px; height: 22px; border: 0; border-radius: 50%; padding: 0;
  background: rgba(255,255,255,.14); color: #fff; font-size: 14px; line-height: 22px;
  text-align: center; cursor: pointer; z-index: 5; font-family: inherit;
}
.sv-clear.sv-clear-on { display: block; }
.sv-clear:hover { background: rgba(255,255,255,.24); }
/* SV_NARROW_CLEAR_V1：窄屏清除按钮贴右边缘。
 * 基础规则 right:40px 是 PC 设计（与 PC 的 padding-right 48/72px 匹配）；
 * 窄屏输入框 padding-right 只有 36px，若沿用 right:40px，按钮会落到「文字可用区」内部
 * （实测 clear 与文字右限 gap = -26px，关键词一长就压字），且距右边缘空出 40px，
 * 视觉上图标/文字/清除三者挤在左侧。特异性 (0,3,0) 高于基础 `.sv-clear`(0,1,0)。 */
@media (max-width: 960px) {
  .header .search-form .sv-clear { right: 8px; }
}



/* search icon: bright bg + dark outline only
 * SV_PC_ONLY_ICON_V1：白圆图标是 PC 版设计，必须限定宽屏——窄屏段（@media max-width:960px）
 * 已把图标改为「左侧 16px 深色描边、透明底」，若无条件生效这里的 background:#fff!important
 * 会盖掉窄屏的 transparent，形成白圆并压在关键词文字上。 */
@media (min-width: 961px) {
  .header .search-form.sv-ready .search-form-icon {
    background: #ffffff !important;
    color: #1a1f2a !important;
    opacity: 1 !important;
  }
  .header .search-form.sv-ready .search-form-icon svg {
    color: #1a1f2a !important;
    fill: none !important;
    stroke: #1a1f2a !important;
  }
  .header .search-form.sv-ready .search-form-icon svg * {
    fill: none !important;
    stroke: #1a1f2a !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  .header .search-form.sv-ready .search-form-icon:hover,
  .header .search-form.sv-ready:focus-within .search-form-icon {
    background: #ffffff !important;
    color: #1a1f2a !important;
  }
}
/* TOOPIC_VISION_HIDE_BTN */
.header .search-form .sv-wrap,
.header .search-form .sv-btn,
.header .search-form .sv-pop,
.header .search-form .sv-chip {
  display: none !important;
}
/* TOOPIC_VISION_HIDE_BTN（输入框尺寸部分）：PC 版尺寸/内边距。
 * SV_PC_ONLY_WIDTH_V1：本条原先无媒体查询 → 会把窄屏的 `padding: 0 16px 0 36px`
 * （左侧为 12px 处的 16px 图标留位）覆盖成 `0 48px 0 16px`，导致图标与关键词文字重叠。
 * 故限定宽屏；窄屏尺寸由 @media (max-width:960px) 段负责。 */
@media (min-width: 961px) {
  .header .search-form.sv-ready .s-txt,
  .header .search-form.sv-ready #search-keyword,
  .header .search-form.sv-ready .s-txt:focus,
  .header .search-form.sv-ready #search-keyword:focus,
  .header .search-form.sv-ready.sv-filled .s-txt,
  .header .search-form.sv-ready.sv-filled #search-keyword {
    width: 280px !important;
    padding: 0 48px 0 16px !important;
  }
}
/* TOOPIC_SG_CSS */
.header .search-form .sg-pop {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: 280px;
  padding: 6px 0 8px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid rgba(16, 18, 24, .06);
  box-shadow: 0 16px 40px rgba(16, 18, 24, .16), 0 2px 6px rgba(16, 18, 24, .06);
  z-index: 90;
  text-align: left;
  box-sizing: border-box;
  overflow: hidden;
}
.header .search-form.sg-open .sg-pop {
  display: block;
  animation: toopicSgIn .16s ease-out;
}
@keyframes toopicSgIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.header .search-form .sg-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 14px 6px;
}
.header .search-form .sg-hd b {
  font-size: 11px;
  font-weight: 600;
  color: #8a9099;
  letter-spacing: .08em;
}
.header .search-form .sg-wipe {
  border: 0;
  background: none;
  padding: 2px 0;
  font-size: 12px;
  color: #ff7e00;
  cursor: pointer;
  font-weight: 500;
  font-family: inherit;
}
.header .search-form .sg-wipe:hover { color: #f0a500; }
.header .search-form .sg-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 14px;
  border: 0;
  background: none;
  text-align: left;
  cursor: pointer;
  color: #242830;
  text-decoration: none;
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.header .search-form .sg-item:hover,
.header .search-form .sg-item.is-on { background: #f7f4ec; }
.header .search-form .sg-item.is-on { box-shadow: inset 3px 0 0 #f0a500; }
.header .search-form .sg-item .sg-ico {
  width: 22px;
  height: 22px;
  color: #9aa3ad;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  background: #f3f4f6;
  border-radius: 50%;
}
.header .search-form .sg-item .sg-ico svg { display: block; }
.header .search-form .sg-item .sg-txt {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.header .search-form .sg-item .sg-txt em {
  font-style: normal;
  font-weight: 700;
  color: #ff7e00;
}
.header .search-form .sg-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 2px 14px 10px;
}
.header .search-form .sg-chip {
  display: inline-flex;
  align-items: center;
  width: auto;
  padding: 5px 11px;
  border-radius: 999px;
  background: #f4f5f7;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
}
.header .search-form .sg-chip:hover,
.header .search-form .sg-chip.is-on {
  background: #fff6e4;
  color: #8a5a00;
  box-shadow: inset 0 0 0 1px rgba(240, 165, 0, .45);
}
.header .search-form .sg-empty {
  padding: 22px 16px 18px;
  text-align: center;
  font-size: 12px;
  color: #8a9099;
  line-height: 1.6;
}
@media (max-width: 960px) {
  .header .search-form .sg-pop { display: none !important; }
}
/* /TOOPIC_SG_CSS */


/* 以图搜图后端未开放：表单仅作占位，隐藏避免露出文件控件（提交降级为普通搜索页） */
#svPost { display: none; }


/* TOOPIC_HEADER_LAYER_FIX_V1
 * 详情页（html.studio-wide）下 .header 是 z-index:8 的层叠上下文，
 * 会把搜索下拉的 z-index:90 困在其中；而 #studioHost 内部有 z-index:20/22/30 的兄弟层，
 * 于是下拉被主体盖住。此处抬升 .header，使其整体高于详情页主体各层。
 * 同时抵消 studio-detail.css 在宽屏给 .header 的 overflow:hidden!important，否则下拉被裁掉。
 * 仅在搜索浮层打开时生效，不影响详情页其他层级表现。 */
html.studio-wide .header { z-index: 60; }
body.sv-layer-up .header,
body.sg-layer-up .header { z-index: 10050; }
body.sv-layer-up .header,
body.sv-layer-up .header .fixed,
body.sg-layer-up .header,
body.sg-layer-up .header .fixed { overflow: visible !important; }

/* TOOPIC_HEADER_DROPDOWN_LAYER_FIX_V1
 * 现象：PC 详情页（html.studio-wide）里，头部「用户中心」悬停下拉完全不显示、不可点。
 *
 * 根因（唯一）：.header / .header .fixed 被 overflow:hidden!important 裁掉，
 * 而 .drop-menu 是 position:absolute、定位包含块 .layout-r 在该裁剪盒内部，
 * 于是 top:100% 的下拉整块落到 header 的 60px 高度之外被裁。
 * 实测（无头 Edge，修复前）：menu.bottom≈238 > header.bottom=60，命中测试
 * elementFromPoint 拿到的是主体 #studioHost 而不是菜单 → 即"被页面元素遮挡"的实质。
 *
 * 层级无需再动：#studioHost 是 z-index:2，而上一段已把 .header 抬到 60，
 * 所以只需在下拉打开期间放开裁剪。
 *
 * 两个裁剪来源（都在 studio-detail.css，都是横向溢出守卫）：
 *   - STUDIO_NARROW_BASE_GUARD_V1：@media (min-width:769px) and (max-width:1199px)
 *     里的 .header, .header .fixed（裸选择器，无 html.studio-wide 前缀）
 *   - STUDIO_HORIZONTAL_GUARD_V1：@media (min-width:1200px) 里的 html.studio-wide .header(/.fixed)
 * 实测影响区间：≥769px 命中（600px 下 overflow 本来就是 visible，无此问题）。
 * 本段规则不在任何媒体查询内、且特异性高于两条守卫，故全区间生效。
 *
 * 触发条件与下拉自身的 display 规则（.header .user-box:hover .drop-menu）一致：
 * 只在下拉打开期间放开裁剪，详情页默认态仍保持 overflow:hidden（横向守卫不受影响），
 * 其它页面的 .header/.fixed 本来就没有 overflow 约束，故不受影响。
 *
 * 双通道（作用域都锁在 html.studio-wide）：
 *   - :has() 纯 CSS 通道（现代内核，无需 JS，连 wall-front.js 加载前的悬停也兜住）；
 *   - body.ud-layer-up 兜底通道，由 wall-front.js 在 .user-box 的鼠标移入/移出时切换。
 *
 * ⚠️ 两条通道必须写成**独立规则**：普通选择器列表只要含一个不被支持的选择器，
 *    整条规则都会被丢弃（:is()/:where() 才是宽容的）。若合并成一条，旧内核
 *    会因为不认识 :has() 而把 .ud-layer-up 兜底通道一起丢掉，彻底失去降级能力。 */
html.studio-wide .header:has(.user-box:hover),
html.studio-wide .header:has(.user-box:hover) .fixed { overflow: visible !important; }

html.studio-wide body.ud-layer-up .header,
html.studio-wide body.ud-layer-up .header .fixed { overflow: visible !important; }