/* ============================================================
   ZOKI Logo 样式覆盖（PC + 移动端共享）
   用途：覆盖 React 构建的 logo 内联样式，统一尺寸与居中
   ============================================================ */

/* ===== 顶部导航栏 logo ===== */
nav#nav .AzvNggSudjN8b9d1tUDT {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
}
nav#nav .AzvNggSudjN8b9d1tUDT a.C9JUSu6VaKM5y0Kq4sg2 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
}
nav#nav .AzvNggSudjN8b9d1tUDT img {
  width: auto !important;
  display: block !important;
  object-fit: contain;
}

/* PC 端 logo 尺寸 */
@media (min-width: 769px) {
  nav#nav .AzvNggSudjN8b9d1tUDT { min-height: 64px !important; }
  nav#nav .AzvNggSudjN8b9d1tUDT img { height: 64px !important; max-width: 90% !important; }
}

/* 移动端 logo 尺寸 */
@media (max-width: 768px) {
  nav#nav .AzvNggSudjN8b9d1tUDT { min-height: 44px !important; }
  nav#nav .AzvNggSudjN8b9d1tUDT img { height: 44px !important; max-width: 90% !important; }
}

/* ===== 底部 footer logo ===== */
footer .nFfRxeFvFwQzS_6hLEl2 > div.flex {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
}
footer .nFfRxeFvFwQzS_6hLEl2 > div.flex img {
  width: auto !important;
  display: block !important;
  margin: 0 auto !important;
  max-width: none !important;
}

/* PC 端 footer logo 尺寸 */
@media (min-width: 769px) {
  footer .nFfRxeFvFwQzS_6hLEl2 > div.flex img { height: 120px !important; }
}

/* 移动端 footer logo 尺寸 */
@media (max-width: 768px) {
  footer .nFfRxeFvFwQzS_6hLEl2 > div.flex img { height: 96px !important; }
}

/* ===== 左上角胶囊：站标在上、两个按钮在下（自成一套，不依赖构建 CSS 的断点）=====
   要点：
   1. 构建 CSS 会随断点改胶囊（≥1871px 变 204 宽横条、图标区变 46 宽竖排），
      且 Tailwind 的 preflight 把全局 border 清零 —— 所以尺寸/方向/分割线全部显式写死。
   2. 马赛克模板给胶囊留的凹槽是 2 格宽、胶囊只占 1 格，右边那格会露白。
      **不要去加宽胶囊**（用户明确不要宽胶囊）——改成让第 6 张卡补进那格，
      规则写在 pc/index.html 的 style 里（.Eu3YePRYW_jQ2bgCbNjr > div > a:first-child）。
   3. 站标是横幅图（2.44:1）。窄屏站标高 32px（≈78 宽，占满 94 宽胶囊的可用宽度）；
      宽屏高 40px（≈98 宽）。比之前的 26px 明显放大。 */

nav#nav {
  width: 94px !important;
  height: 94px !important;
  border-radius: 16px !important;
  background: #fff !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  overflow: hidden !important;
}

/* 站标区（上） */
nav#nav .AzvNggSudjN8b9d1tUDT {
  width: 100% !important;
  max-width: 100% !important;
  height: 40px !important;
  min-height: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
nav#nav .AzvNggSudjN8b9d1tUDT a {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
nav#nav .AzvNggSudjN8b9d1tUDT img {
  height: 32px !important;
  width: auto !important;
  max-width: 86px !important;
  object-fit: contain !important;
  display: block !important;
}

/* 按钮区（下）：与站标之间一条横向分割线 */
nav#nav .NuKVRCDKjJRkfpgoOKXi {
  width: 100% !important;
  flex: 1 1 auto !important;
  height: auto !important;
  display: flex !important;
  flex-direction: row !important;
  border-top: 1px solid var(--grey-7, #dfe7ec) !important;
  overflow: hidden !important;
}
/* 两个按钮各占一半，中间一条竖向分割线 */
nav#nav .NuKVRCDKjJRkfpgoOKXi > * {
  flex: 1 1 50% !important;
  width: 50% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
nav#nav .NuKVRCDKjJRkfpgoOKXi > * + * {
  border-left: 1px solid var(--grey-7, #dfe7ec) !important;
}

/* ===== 搜索结果条目的尺寸 =====
   PC 的结果容器是 94px 列的网格，移动端是"整行"列表（asList）。
   方形卡片在整行容器里会被拉成满宽的大方块（实测 313x313），
   所以统一按 94px 见方固定，两端观感一致。 */
.zoki-search-tile {
  width: 94px !important;
  height: 94px !important;
  aspect-ratio: 1;
}
