/* =====================================================================
   星见GEO · 共享导航样式（对标 powerdrill.ai/tools）
   由 lib/ui.php 的 page_head(..., $megaNav=true) 渲染的玻璃导航专属样式。
   仅在启用 megaNav 的页面加载（首页 + 表单页），与其它页面的 style.css 并存：
   本文件选择器特异性更高（.topbar .nav a 等）且在 style.css 之后加载，
   可干净覆盖 style.css 的旧深色导航，且不触碰 .container/.foot/页面背景。
   不含首页专属的 mesh 背景、.container、.foot、Hero 等内容样式（那些留在 home.css）。
   ===================================================================== */

/* ---------- 全局重置：消除浏览器默认 body 的 8px 外边距（否则每个页面顶部多出白边） ---------- */
body{ margin:0; }

/* ---------- 顶部导航：初始透明无边框/阴影/背景，滚动后才浮现玻璃胶囊 ---------- */
.topbar{
  position:sticky; top:12px; z-index:60;
  max-width:1160px; margin:12px auto 0;
  height:60px; padding:0 22px;
  display:flex; align-items:center; justify-content:space-between;
  /* 初始：完全透明，无背景/边框/阴影/模糊（对标 powerdrill.ai/tools 顶部透明导航） */
  background:transparent;
  -webkit-backdrop-filter:none;
          backdrop-filter:none;
  border:1px solid transparent;
  border-radius:999px;
  box-shadow:none;
  transition:background .3s ease, box-shadow .3s ease, border-color .3s ease,
             backdrop-filter .3s ease, -webkit-backdrop-filter .3s ease;
}
/* 向下滚动后浮现的玻璃胶囊效果 */
.topbar.scrolled{
  background:rgba(255,255,255,.62);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
          backdrop-filter:blur(14px) saturate(160%);
  border-color:rgba(255,255,255,.55);
  box-shadow:0 8px 30px rgba(76,29,149,.10);
}
.topbar .brand{ color:#111418; font-weight:800; letter-spacing:.2px; font-size:17px; }
.topbar .nav{ display:flex; align-items:center; gap:2px; }
.topbar .nav a{ color:#475569; margin-left:0; font-size:14px; padding:8px 13px; border-radius:999px; transition:.16s; text-decoration:none; }
.topbar .nav a:hover{ color:#4c1d95; background:rgba(109,40,255,.08); }
.topbar .nav a.on{ color:#4c1d95; background:rgba(109,40,255,.12); font-weight:600; }
/* 导航分栏：中间菜单居中、右侧仅「会员登录」 */
.topbar .nav-center{ flex:1 1 auto; display:flex; align-items:center; justify-content:center; gap:2px; }
.topbar .nav-right{ display:flex; align-items:center; gap:2px; flex:0 0 auto; margin-left:auto; }
.topbar .nav-right a{ display:inline-flex; align-items:center; gap:6px; color:#475569; font-size:14px; padding:8px 13px; border-radius:999px; transition:.16s; text-decoration:none; }
.topbar .nav-right a svg{ width:17px; height:17px; stroke:#475569; transition:.16s; }
.topbar .nav-right a:hover{ color:#6d28ff; background:rgba(109,40,255,.08); }
.topbar .nav-right a:hover svg{ stroke:#6d28ff; }
.topbar .nav-right a.on{ color:#6d28ff; background:rgba(109,40,255,.12); font-weight:600; }
.topbar .nav-right a.on svg{ stroke:#6d28ff; }

/* 下拉导航：居中 + 透明毛玻璃 */
.pd-drop-btn{
  display:inline-flex; align-items:center; gap:6px; cursor:pointer;
  color:#475569; font-size:14px; line-height:1.6; padding:8px 14px; border-radius:999px;
  background:transparent; border:1px solid transparent; transition:.16s; font-family:inherit;
}
.pd-drop-btn:hover, .pd-drop-btn.open{ color:#6d28ff; background:rgba(109,40,255,.08); }
.pd-caret{ transition:transform .2s; font-size:19px; margin-left:-3px; line-height:1; }
.pd-drop-btn.open .pd-caret{ transform:rotate(180deg); }
.pd-drop-panel{
  position:absolute; top:calc(100% + 14px); left:50%;
  width:auto; min-width:0; max-width:92vw; z-index:80;
  background:rgba(255,255,255,.98);
  -webkit-backdrop-filter:blur(20px) saturate(170%);
          backdrop-filter:blur(20px) saturate(170%);
  border:1px solid rgba(255,255,255,.92);
  border-radius:18px;
  box-shadow:0 26px 60px rgba(20,24,70,.22);
  padding:18px 20px;
  display:flex; flex-direction:column; align-items:stretch; gap:0;
  /* 未触发前彻底不可见：没有任何边框/阴影/背景显形（双保险，对标 Powerdrill） */
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateX(-50%) translateY(-8px) scale(.98);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  /* 面板内容过多时允许内部滚动，避免超出视口导致底部项不可见 */
  max-height:calc(100vh - 100px);
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(109,40,255,.25) transparent;
}
.pd-drop-panel::-webkit-scrollbar{ width:6px; }
.pd-drop-panel::-webkit-scrollbar-thumb{ background:rgba(109,40,255,.25); border-radius:3px; }
.pd-drop-panel.open{
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateX(-50%) translateY(0) scale(1);
}
#pdDropPanel{ min-width:440px; }
.pd-mega-group{ width:100%; }
.pd-mega-group + .pd-mega-group{ border-top:1px solid #eef2f7; margin-top:16px; padding-top:16px; margin-left:0; padding-left:0; border-left:none; }
.pd-mega-cat{ font-size:12px; font-weight:700; color:#94a3b8; letter-spacing:.4px; margin:0 0 10px; padding-bottom:7px; border-bottom:1px solid #eef2f7; }
/* 分类内条目：横向 2 列网格；grid 轨道对齐，杜绝错位/错开 */
.pd-mega-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px; align-items:start; }
/* 全部工具按钮前置网格图标（放大显示） */
.pd-drop-btn .pd-grid-ico{ flex:0 0 auto; margin-right:1px; }
/* 全部工具文字相对图标轻微上移，使文字与主网格图标视觉居中对齐 */
.pd-btn-label{ display:inline-block; transform:translateY(-1px); }
.pd-drop-panel .pd-mega-item{ display:flex; align-items:flex-start; gap:12px; padding:13px 14px; border-radius:12px;
  text-decoration:none; color:#334155; transition:.15s; }
.pd-drop-panel .pd-mega-item:hover{ background:rgba(109,40,255,.08); }
.pd-mega-ico{ flex:0 0 auto; width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  background:#f1ecff; }
.pd-mega-ico svg{ stroke:#6d28ff; }
.pd-mega-txt{ display:flex; flex-direction:column; min-width:0; }
.pd-mega-t{ font-weight:600; font-size:14.5px; color:#0f172a; }
.pd-mega-d{ font-size:12.5px; color:#64748b; line-height:1.5; margin-top:3px; }
/* 顶级项自带的二级子菜单面板：与「全部工具」面板同基准（均为 topbar 直接子元素，
   top:100%+14px → 距导航栏底部均为 14px；宽度同取 440px 起） */
.pd-sub-panel{ position:absolute; top:calc(100% + 14px); left:0; right:auto; min-width:440px; max-width:560px;
  transform:translateY(-8px) scale(.98); }
.pd-sub-panel.open{ transform:translateY(0) scale(1); }
/* 全部工具内嵌套的二级子菜单：两列排列，与上级网格对齐 */
.pd-mega-children{ grid-column:1 / -1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px 10px; margin:4px 0 2px; padding:7px 0 7px 12px; border-left:2px solid #ece8fb; }
.pd-drop-panel .pd-mega-sub{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; text-decoration:none; color:#334155; transition:.15s; }
.pd-drop-panel .pd-mega-sub:hover{ background:rgba(109,40,255,.06); }
.pd-mega-sub-ico{ flex:0 0 auto; width:26px; height:26px; border-radius:7px; display:flex; align-items:center; justify-content:center; background:#f1ecff; }
.pd-mega-sub-ico svg{ width:15px; height:15px; stroke:#6d28ff; }
.pd-mega-sub .pd-mega-t{ font-weight:600; font-size:13.5px; color:#0f172a; }
.pd-mega-sub .pd-mega-d{ font-size:12px; color:#64748b; margin-top:1px; }

/* ---------- 顶部公告条（星见公告 .pd-toptip） ---------- */
/* 迁移自 home.css 并新增「星见公告」标签；供全部 megaNav 页（含仅加载 share.css 的报告页）复用 */
.pd-toptip{
  position:relative; z-index:60;
  background:linear-gradient(90deg, rgba(109,40,255,.14), rgba(139,92,246,.05) 50%, rgba(109,40,255,.14));
  border-bottom:1px solid rgba(109,40,255,.18);
  color:#5b21b6; font-size:13px; line-height:1.5; text-align:center;
  padding:9px 38px 9px 16px;
}
.pd-toptip .pd-tip-label{
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; margin-right:8px; border-radius:50%;
  background:rgba(109,40,255,.12); vertical-align:middle; flex:0 0 auto;
}
.pd-toptip .pd-tip-label svg{ width:14px; height:14px; stroke:#6d28ff; display:block; }
.pd-toptip .pd-tip-ico{
  display:inline-grid; place-items:center; width:22px; height:22px; margin-right:8px;
  border-radius:999px; background:rgba(109,40,255,.14); vertical-align:middle;
}
.pd-toptip .pd-tip-ico svg{ stroke:#6d28ff; }
.pd-toptip b{ color:#4c1d95; font-weight:700; }
.pd-toptip a{ color:#6d28ff; font-weight:700; text-decoration:underline; }
.pd-toptip a:hover{ opacity:.82; }
/* 窄屏：公告条字号收紧，避免与导航拥挤 */
@media(max-width:520px){
  .pd-toptip{ font-size:12.5px; padding:8px 34px 8px 14px; }
  .pd-toptip .pd-tip-label{ width:20px; height:20px; margin-right:6px; }
  .pd-toptip .pd-tip-label svg{ width:13px; height:13px; }
}
/* 公告条关闭按钮（×）：绝对定位在右侧，不干扰居中正文 */
.pd-tip-close{
  position:absolute; top:50%; right:10px; transform:translateY(-50%);
  width:22px; height:22px; padding:0; border:none; border-radius:50%;
  background:transparent; color:#5b21b6; cursor:pointer;
  font-size:18px; line-height:1; display:inline-flex; align-items:center; justify-content:center;
  opacity:.5; transition:opacity .15s, background .15s;
}
.pd-tip-close:hover{ opacity:1; background:rgba(109,40,255,.16); }
@media(max-width:520px){ .pd-tip-close{ right:6px; } }

/* ---------- 公告条未发布/下架时收紧顶部（消除白色空白） ----------
   仅当页面不含 .pd-toptip（前端脚本给 body 加 .no-tip）时生效；
   有公告条打开时该 class 不存在，顶部布局完全不变 */
body.no-tip .topbar{ margin-top:0; }
body.no-tip .pd-hero{ padding-top:44px; }
body.no-tip .nw-hero{ padding-top:40px; }

/* 汉堡按钮（仅手机端显示，折叠导航） */
.pd-burger{ display:none; align-items:center; justify-content:center; cursor:pointer;
  width:40px; height:40px; border-radius:12px; background:transparent; border:1px solid transparent; transition:.16s; }
.pd-burger svg{ stroke:#475569; }
.pd-burger:hover, .pd-burger.open{ background:rgba(109,40,255,.08); }
.pd-burger.open svg{ stroke:#6d28ff; }

/* ---------- 响应式（仅导航相关） ---------- */
/* 手机/小平板：折叠为汉堡菜单 —— 隐藏中间平铺菜单，保留右侧「会员登录」（置于汉堡左边），显示汉堡；下拉面板全宽且取消桌面 min-width，避免窄屏溢出 */
@media(max-width:860px){
  .topbar{ max-width:calc(100% - 24px); padding:0 14px; }
  /* 仅隐藏中间平铺菜单；右侧「会员登录」保留（DOM 顺序在汉堡之前，自然位于其左边） */
  .topbar .nav-center{ display:none; }
  .pd-burger{ display:inline-flex; }
  /* 会员登录在手机端紧凑显示，避免与品牌 / 汉堡拥挤 */
  .topbar .nav-right{ gap:4px; }
  .topbar .nav-right a{ padding:7px 11px; font-size:13px; }
  .topbar .nav-right a svg{ width:16px; height:16px; }
  /* 窄屏：面板全宽；分类竖向堆叠（核心工具在上、深度分析在下）；取消桌面 min-width 防溢出 */
  .pd-drop-panel{ left:0; right:0; transform:none; width:auto; max-width:none; top:calc(100% + 10px); min-width:0; }
  #pdDropPanel{ min-width:0; }
  .pd-sub-panel{ min-width:0; max-width:none; }
  .pd-drop-panel.open{ transform:none; }
  .pd-mega-item{ align-items:center; }
}
/* 极窄屏（手机）：分类内条目改为单列，但分类块之间仍并排 */
@media(max-width:560px){
  .pd-mega-grid{ grid-template-columns:1fr; }
  .pd-mega-children{ grid-template-columns:1fr; }
}
/* 手机竖屏：导航字号再缩、下拉面板内边距收紧 */
@media(max-width:520px){
  .pd-drop-panel{ padding:14px; }
  .topbar .brand{ font-size:15px; }
  .topbar .nav-right a{ padding:6px 9px; font-size:12.5px; }
}
/* 超窄屏 / 超低分辨率（如 360×640）：进一步收紧导航字号与面板间距，杜绝溢出 */
@media(max-width:400px){
  .topbar .brand{ font-size:14px; }
  .topbar .nav-right a{ padding:6px 8px; font-size:12px; }
  .pd-drop-panel{ padding:12px; }
  .pd-mega-t{ font-size:13.5px; }
  .pd-mega-d{ font-size:12px; }
}
