/* ============================================================================
   desktop.css — 电脑端（含平板）专有样式
   两端独立设计 · 批次 1 骨架
   仅在 <body data-device="desktop"> 生效
   公共样式仍在 app.css，本文件只放桌面独有布局
   ========================================================================== */

/* ---------- 桌面顶部横向 8 项导航（原抽屉菜单树搬上来，带悬停下拉） ---------- */
body[data-device="desktop"] .topnav {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 4px;
  padding: 0 24px;
  border-top: 1px solid var(--c-line);
  background: var(--c-bg);
}
body[data-device="desktop"] .topnav > a,
body[data-device="desktop"] .topnav .has-drop > a {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  letter-spacing: 2px;
  color: var(--c-sub);
  text-decoration: none;
  padding: 14px 14px;
  border-bottom: 1px solid transparent;
  transition: border-color .18s var(--ease), color .18s var(--ease);
  font-family: var(--font-sans);
  white-space: nowrap;
}
body[data-device="desktop"] .topnav > a:hover,
body[data-device="desktop"] .topnav .has-drop:hover > a {
  color: var(--c-text);
  border-bottom-color: var(--c-text);
}
body[data-device="desktop"] .topnav > a.on,
body[data-device="desktop"] .topnav .has-drop > a.on {
  color: var(--c-text);
  border-bottom-color: var(--c-text);
}
body[data-device="desktop"] .topnav .arr { font-size: 9px; margin-left: 4px; opacity: .6; }

/* 下拉容器 */
body[data-device="desktop"] .topnav .has-drop { position: relative; }
body[data-device="desktop"] .topnav .drop-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 180px;
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  border-top: none;
  padding: 8px 0;
  z-index: 800;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
body[data-device="desktop"] .topnav .has-drop:hover .drop-menu { display: block; }
body[data-device="desktop"] .topnav .drop-menu a {
  display: block;
  padding: 9px 20px;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--c-sub);
  text-decoration: none;
  transition: background .12s var(--ease), color .12s var(--ease);
  white-space: nowrap;
}
body[data-device="desktop"] .topnav .drop-menu a:hover {
  background: var(--c-bg-soft);
  color: var(--c-text);
}
body[data-device="desktop"] .topnav .drop-menu a.muted { color: var(--c-mute); pointer-events: none; }

/* ---------- 桌面隐藏左上角三横线按钮（导航已全在顶部横向） ---------- */
body[data-device="desktop"] #btn-menu { display: none !important; }

/* ---------- 桌面隐藏底部 tab（手机专属） ---------- */
body[data-device="desktop"] .botnav { display: none !important; }