/* ---------- 整页背景：干净白底 + 顶部柔和粉蓝→薰衣草渐变 mesh（对标 Powerdrill） ---------- */
html, body{ background:#ffffff; }
body{ position:relative; }

/* 顶部装饰渐变 mesh：用目标站真实粉蓝→淡薰衣草配方，清晰可见但不刺眼 */
body::before{
  content:""; position:absolute; left:0; right:0; top:0; height:580px; z-index:0; pointer-events:none;
  background:
    radial-gradient(46% 440px at 12% -80px, rgba(169,198,255,.62), rgba(169,198,255,0) 70%),
    radial-gradient(46% 440px at 88% -100px, rgba(221,211,251,.62), rgba(221,211,251,0) 70%),
    radial-gradient(62% 400px at 50% -50px, rgba(194,214,255,.46), rgba(194,214,255,0) 72%),
    linear-gradient(180deg, rgba(255,255,255,0) 58%, #ffffff 100%);
}
/* 内容层抬到背景之上 */
.topbar{ position:relative; z-index:1; }
.container{ position:relative; z-index:1; }
.foot{ position:relative; z-index:1; }

/* 注：.pd-toptip（顶部公告条）样式已统一迁移至 nav.css（全站 megaNav 页共用，含仅加载 share.css 的报告页）。 */

/* ---------- 顶部导航：对标目标站 —— 初始透明无边框/阴影/背景，滚动后才浮现玻璃胶囊 ---------- */
.topbar{
  position:sticky; top:12px; z-index:50;
  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; }
.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; }
.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-cat-panel{ min-width:290px; max-width:340px; }
.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-mega-item{ display:flex; align-items:flex-start; gap:12px; padding:13px 14px; border-radius:12px;
  text-decoration:none; color:#334155; transition:.15s; }
.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-mega-sub{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; text-decoration:none; color:#334155; transition:.15s; }
.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-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; }

/* ---------- 容器放宽到 1200 ---------- */
.container{ max-width:1200px; padding:0 24px 90px; }

/* ---------- Hero（居中） ---------- */
.pd-hero{ text-align:center; padding:66px 0 36px; --hero-grad:linear-gradient(92deg, #380359 0%, #4209a4 30%, #9523f1 48%, #400460 66%); }
.pd-pill{
  display:inline-flex; align-items:center; gap:2px; background:#f1ecff; color:#5b2ac4;
  font-size:13px; font-weight:600; padding:6px 14px; border-radius:999px; margin-bottom:28px;
  border:1px solid #dac3f5;
}
.pd-pill .pd-ico{ width:14px; height:14px; flex:0 0 auto; }
.pd-hero .pd-pill-note{ margin:45px auto 0;
  font-weight:400; font-family:"Microsoft YaHei","微软雅黑",sans-serif;
  color:#6e4bbe; background:#fcf6ff; max-width:680px; line-height:1.6;
  padding:7px 34px; border:solid 1px #b7aae5; }
.pd-hero h1{
  font-size:55px; line-height:1.14; font-weight:800;
  margin:0 0 18px; letter-spacing:-.5px;
  color:#0f172a; /* 不支持文字渐变时兜底 */
  background-image:var(--hero-grad);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.pd-hero h1 .grad{
  background-image:var(--hero-grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pd-hero .pd-sub{ font-size:15px; color:#64748b; max-width:680px; margin:0 auto 30px; line-height:1.7; }
.pd-cta{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.pd-btn-primary{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:4px; background:linear-gradient(135deg,#6d28ff,#8b5cf6); color:#fff;
  font-weight:600; font-size:18px; padding:13px 28px; border-radius:999px; border:none; cursor:pointer;
  box-shadow:0 6px 18px rgba(109,40,255,.28); transition:.18s; text-decoration:none;
}
/* 阿里云「立即免费体验」式：鼠标聚光跟随光晕 */
.pd-btn-primary .pd-btn-label{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:4px; }
.pd-btn-primary::before{
  content:""; position:absolute; width:170px; height:170px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.55) 0%, rgba(255,255,255,.20) 38%, rgba(255,255,255,0) 70%);
  left:var(--mx, 50%); top:var(--my, 50%); transform:translate(-50%, -50%);
  opacity:0; transition:opacity .3s ease; pointer-events:none; z-index:0;
}
.pd-btn-primary:hover::before{ opacity:1; }
.pd-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(109,40,255,.36); }
.pd-btn-ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:4px; background:#fff; color:#0f172a; font-weight:600; font-size:18px;
  padding:13px 26px; border-radius:999px; border:1px solid #e2e6ee; cursor:pointer; transition:.18s; text-decoration:none;
}
.pd-btn-ghost:hover{ border-color:#c9b8ff; color:#6d28ff; }
.pd-btn-primary .pd-ico{ width:23px; height:23px; flex:0 0 auto; }
.pd-btn-ghost .pd-ico{ width:17px; height:17px; flex:0 0 auto; }

/* ---------- 区块标题（对标 Powerdrill 分类头） ---------- */
.pd-sec{ margin-top:35px; }
.pd-sec-head{ display:flex; align-items:baseline; gap:12px; margin-bottom:22px; }
.pd-sec-head h2{ font-size:18px; font-weight:800; color:#0f172a; margin:0; letter-spacing:-.3px; }
.pd-sec-head .pd-count{
  display:inline-flex; align-items:center; justify-content:center;
  background:#f1ecff; color:#6d28ff; font-size:13px; font-weight:700;
  min-width:24px; height:24px; padding:0 8px; border-radius:999px;
}
.pd-sec-head .pd-viewall{ margin-left:auto; color:#6d28ff; font-size:14px; font-weight:600; text-decoration:none; }
.pd-sec-head .pd-viewall:hover{ text-decoration:underline; }

/* ---------- 精选工作流（3 大卡） ---------- */
.pd-feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pd-feat{ display:block; text-decoration:none; color:inherit;
  background:linear-gradient(155deg, rgba(169,198,255,.24) 0%, rgba(221,211,251,.16) 52%, #ffffff 100%);
  border:1px solid rgba(139,92,246,.12);
  border-radius:14px; padding:26px 24px; transition:.2s; }
.pd-feat:hover{ transform:translateY(-4px); border-color:#c9b8ff;
  background:linear-gradient(155deg, rgba(169,198,255,.34) 0%, rgba(221,211,251,.24) 55%, #ffffff 100%);
  box-shadow:0 16px 36px rgba(109,40,255,.14); }
.pd-feat .pd-ic{ width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#6d28ff,#8b5cf6); margin-bottom:16px; }
.pd-feat .pd-ic svg{ stroke:#fff; }
.pd-feat h3{ font-size:18px; font-weight:700; color:#0f172a; margin:0 0 8px; }
.pd-feat p{ font-size:14px; color:#64748b; line-height:1.65; margin:0 0 16px; }
.pd-feat .pd-eg{ display:inline-flex; align-items:center; gap:6px; color:#6d28ff; font-size:14px; font-weight:600; }
.pd-feat .pd-eg .arr{ transition:.18s; }
.pd-feat:hover .pd-eg .arr{ transform:translateX(4px); }

/* ---------- 普通工具卡网格（4 列） ---------- */
.pd-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.pd-card{ display:block; text-decoration:none; color:inherit; background:#fff; border:1px solid #eceef3;
  border-radius:12px; padding:20px; transition:.2s; }
.pd-card:hover{ transform:translateY(-3px); border-color:#c9b8ff; box-shadow:0 12px 28px rgba(109,40,255,.10); }
.pd-card .pd-ic{ width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  background:#f1ecff; margin-bottom:14px; }
.pd-card .pd-ic svg{ stroke:#6d28ff; }
.pd-card h3{ font-size:15.5px; font-weight:700; color:#0f172a; margin:0 0 6px; }
.pd-card p{ font-size:13px; color:#64748b; line-height:1.6; margin:0; }
.pd-card .pd-go{ display:block; margin-top:12px; color:#6d28ff; font-size:13px; font-weight:600; }
.pd-card .pd-go .arr{ display:inline-block; transition:.18s; }
.pd-card:hover .pd-go .arr{ transform:translateX(4px); }

/* ---------- 三步上手 ---------- */
.pd-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:24px; }
.pd-step{ background:#f7f8fb; border:1px solid #eceef3; border-radius:14px; padding:24px; }
.pd-step .pd-no{ width:34px; height:34px; border-radius:999px; background:linear-gradient(135deg,#6d28ff,#8b5cf6);
  color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.pd-step h4{ font-size:16px; font-weight:700; color:#0f172a; margin:0 0 6px; }
.pd-step p{ font-size:13.5px; color:#64748b; line-height:1.65; margin:0; }

/* ---------- 状态 / 说明条 ---------- */
.pd-note{ margin-top:56px; background:#f7f8fb; border:1px solid #eceef3; border-radius:12px; padding:16px 18px; font-size:13px; color:#64748b; }
.pd-note .badge.llm{ background:#eaf0ff; color:#2563eb; }
.pd-note .badge.sim{ background:#fff4e6; color:#b86b00; }
.pd-disclaimer{ background:#fff8ec; border:1px solid #ffe2b8; color:#8a5a00; border-radius:10px; padding:12px 14px; font-size:13px; margin-top:16px; }

/* ---------- 页脚（覆盖全局 .foot，仅首页） ---------- */
.foot{ background:#fff; border-top:1px solid #eceef3; color:#94a3b8; font-size:12.5px; padding:28px 24px; }

/* ---------- 响应式 ---------- */
/* 平板：精选卡 2 列 */
@media(max-width:1080px){
  .pd-feat-grid{ grid-template-columns:repeat(2,1fr); }
}
/* 手机/小平板：折叠为汉堡菜单 —— 隐藏中间平铺菜单，保留右侧「会员登录」（置于汉堡左边），显示汉堡；下拉面板全宽且取消桌面 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:760px){
  .pd-feat-grid{ grid-template-columns:1fr; }
  .pd-grid{ grid-template-columns:repeat(2,1fr); }
  .pd-steps{ grid-template-columns:1fr; }
  .pd-hero{ padding:54px 0 28px; }
  .pd-hero h1{ font-size:32px; }
  .pd-hero .pd-sub{ font-size:15px; }
  .pd-sec-head h2{ font-size:18px; }
}
/* 手机竖屏：单列、CTA 竖排、字号再缩 */
@media(max-width:520px){
  .pd-grid{ grid-template-columns:1fr; }
  .pd-hero h1{ font-size:27px; }
  .container{ padding:0 16px 56px; }
  .pd-drop-panel{ padding:14px; }
  .topbar .brand{ font-size:15px; }
  .topbar .nav-right a{ padding:6px 9px; font-size:12.5px; }
  .pd-cta{ flex-direction:column; }
  .pd-cta a{ width:100%; text-align:center; box-sizing:border-box; }
  .pd-sec-head{ flex-wrap:wrap; gap:8px; }
  .pd-sec-head .pd-viewall{ margin-left:0; }
  .pd-feat, .pd-card{ padding:20px 18px; }
}
/* 超窄屏 / 超低分辨率（如 360×640）：进一步收紧字号与间距，杜绝溢出 */
@media(max-width:400px){
  .pd-hero{ padding:40px 0 22px; }
  .pd-hero h1{ font-size:23px; }
  .pd-hero .pd-sub{ font-size:14px; }
  .pd-hero .pd-pill{ font-size:12px; padding:5px 12px; }
  .topbar .brand{ font-size:14px; }
  .topbar .nav-right a{ padding:6px 8px; font-size:12px; }
  .pd-sec-head h2{ font-size:18px; }
  .pd-sec-head .pd-count{ min-width:22px; height:22px; font-size:12px; }
  .pd-drop-panel{ padding:12px; }
  .pd-mega-t{ font-size:13.5px; }
  .pd-mega-d{ font-size:12px; }
}

/* ===================== 全部工具板块（Powerdrill All · N 风格） ===================== */
.pd-tools-all{ display:flex; gap:32px; align-items:flex-start; margin-top:64px; }
.pd-tools-sidebar{ position:sticky; top:90px; width:250px; flex:0 0 250px; background:#fff; border:1px solid #e8ecf3; border-radius:16px; padding:14px; box-shadow:0 10px 30px rgba(20,24,70,.06); max-height:none; overflow:visible; }
.pd-tools-sidebar-head{ display:flex; align-items:center; justify-content:space-between; font-size:13px; font-weight:700; color:#0f172a; padding:10px 12px 14px; border-bottom:1px solid #eef2f7; margin-bottom:8px; }
.pd-tools-cat{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; color:#475569; font-size:13px; text-decoration:none; transition:.15s; }
.pd-tools-cat:hover{ background:#f8fafc; color:var(--cat-color,#2563eb); }
.pd-tools-cat.active{ background:color-mix(in srgb, var(--cat-color,#2563eb) 14%, #fff); color:var(--cat-color,#2563eb); font-weight:600; }
.pd-tools-cat-ico{ width:20px; height:20px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.pd-tools-cat-count{ margin-left:auto; font-size:12px; font-weight:600; color:#94a3b8; background:#f1f5f9; padding:2px 8px; border-radius:999px; }
.pd-tools-cat.active .pd-tools-cat-count{ background:color-mix(in srgb, var(--cat-color,#2563eb) 20%, #fff); color:var(--cat-color,#2563eb); }

.pd-tools-main{ flex:1; min-width:0; }
.pd-tools-group{ margin-bottom:26px; scroll-margin-top:100px; }
.pd-tools-group-head{ display:flex; align-items:center; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.pd-tools-group-ico{ width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; }
.pd-tools-group-ico svg{ width:22px; height:22px; }
.pd-tools-group-title{ font-size:16px; font-weight:700; color:#0f172a; }
.pd-tools-group-count{ font-size:13px; font-weight:700; padding:3px 10px; border-radius:999px; }
.pd-tools-group-desc{ font-size:13px; color:#64748b; text-align:left; }
.pd-tools-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.pd-tools-card{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #e8ecf3; border-radius:16px; padding:18px; text-decoration:none; color:inherit; transition:.18s; box-shadow:0 4px 14px rgba(20,24,70,.04); min-height:140px; }
.pd-tools-card:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(20,24,70,.10); border-color:color-mix(in srgb, var(--cat-color, #6d28ff) 45%, #fff); background:var(--cat-grad, linear-gradient(155deg, rgba(169,198,255,.34) 0%, rgba(221,211,251,.24) 55%, #ffffff 100%)); }
.pd-tools-card-top{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.pd-tools-card-ico{ width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.pd-tools-card-ico svg{ width:18px; height:18px; }
.pd-tools-card-title{ flex:1; font-size:13px; font-weight:500; color:#0f172a; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pd-tools-card-star{ width:18px; height:18px; stroke:#cbd5e1; fill:none; flex:0 0 auto; transition:.15s; }
.pd-tools-card:hover .pd-tools-card-star{ stroke:var(--cat-color, #6d28ff); fill:color-mix(in srgb, var(--cat-color, #6d28ff) 16%, #fff); }
.pd-tools-card-desc{ font-size:13px; color:#64748b; line-height:1.6; margin:0 0 14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:42px; }
.pd-tools-card-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; }
.pd-tools-card-tag{ display:inline-block; font-size:13px; color:#475569; background:#f1f5f9; padding:4px 10px; border-radius:999px; }
.pd-tools-card-arrow{ width:28px; height:28px; border-radius:50%; background:var(--cat-color, #6d28ff); color:#fff; display:flex; align-items:center; justify-content:center; font-size:14px; opacity:0; transform:translateX(-6px); transition:.18s; }
.pd-tools-card:hover .pd-tools-card-arrow{ opacity:1; transform:translateX(0); }
.pd-tools-viewall{ display:flex; align-items:center; gap:8px; color:#536174; font-size:13px; font-weight:500; text-decoration:none; margin-top:18px; }
.pd-tools-viewall-dot{ width:6px; height:6px; background:#2563eb; border-radius:1px; flex:0 0 auto; }
.pd-tools-viewall-text{ color:#536174; }
.pd-tools-viewall:hover .pd-tools-viewall-text{ text-decoration:underline; }
.pd-tools-viewall-line{ flex:1; height:1px; background:#e2e8f0; margin-left:4px; }

@media(max-width:1020px){
  .pd-tools-all{ flex-direction:column; }
  .pd-tools-sidebar{ position:relative; top:auto; width:100%; flex:auto; display:flex; flex-wrap:wrap; gap:8px; max-height:none; overflow-x:auto; padding:12px; }
  .pd-tools-sidebar-head{ width:100%; border-bottom:none; margin-bottom:0; padding:8px 0; }
  .pd-tools-cat{ white-space:nowrap; flex:0 0 auto; }
  .pd-tools-grid{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:640px){
  .pd-tools-grid{ grid-template-columns:1fr; }
  .pd-tools-group-desc{ width:100%; margin-left:0; margin-top:6px; }
}

/* ===================== 首页底部 footer（参照 redfox.hk 多列布局，mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8） ===================== */
.rf-foot{ background:linear-gradient(135deg,#15123a 0%,#241a5e 55%,#3b1d6e 100%); color:#cbd5e1; margin-top:56px; }
.rf-foot-inner{ max-width:80rem; margin:0 auto; padding:3rem 1rem; }            /* mx-auto max-w-7xl px-4 py-12 */
@media(min-width:640px){ .rf-foot-inner{ padding-left:1.5rem; padding-right:1.5rem; } }   /* sm:px-6 */
@media(min-width:1024px){ .rf-foot-inner{ padding-left:2rem; padding-right:2rem; } }       /* lg:px-8 */
.rf-foot-top{ display:grid; grid-template-columns:1.4fr 2.6fr; gap:44px; }
.rf-foot-brand{ max-width:360px; }
.rf-foot-logo{ font-size:20px; font-weight:700; color:#fff; letter-spacing:.5px; }
.rf-foot-tag{ margin:14px 0 8px; font-size:15px; color:#e9e6f7; font-weight:600; }
.rf-foot-desc{ margin:0; font-size:13px; line-height:1.7; color:#a9a3c9; }
.rf-foot-social{ display:flex; gap:10px; margin-top:18px; }
.rf-foot-soc{ width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; color:#d8d2f0; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); transition:all .2s ease; }
.rf-foot-soc svg{ width:18px; height:18px; }
.rf-foot-soc:hover{ background:rgba(139,92,246,.25); color:#fff; border-color:rgba(167,139,250,.5); transform:translateY(-2px); }
.rf-foot-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.rf-foot-col h4{ margin:0 0 14px; font-size:13px; font-weight:700; color:#fff; letter-spacing:.4px; }
.rf-foot-col a{ display:block; font-size:13px; line-height:2; color:#b9b3d6; text-decoration:none; transition:color .18s ease; }
.rf-foot-col a:hover{ color:#c4b5fd; }
.rf-foot-bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-top:36px; padding-top:22px; border-top:1px solid rgba(255,255,255,.10); font-size:12px; color:#8e88ad; }
.rf-foot-note{ color:#8e88ad; }
@media(max-width:880px){
  .rf-foot-top{ grid-template-columns:1fr; gap:30px; }
  .rf-foot-cols{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:480px){
  .rf-foot-cols{ grid-template-columns:1fr; }
  .rf-foot-bottom{ flex-direction:column; }
}

/* ===================== 精选工作流（两行小卡片自动滚动 · 第二行反向，仿 redfox.hk） ===================== */
.wf-scroll{ position:relative; margin-top:22px; }
/* 每行：横向溢出隐藏（滚动用），纵向留白避免卡片阴影 / hover 位移被裁切 */
.wf-row{ overflow:hidden; padding:5px 2px 9px; }
.wf-row + .wf-row{ margin-top:0; }
.wf-row-track{ display:flex; gap:12px; width:max-content; will-change:transform; animation:wf-scroll-x var(--wf-dur,60s) linear infinite; }
.wf-row-rev .wf-row-track{ animation-name:wf-scroll-x-rev; }
.wf-row-copy{ display:flex; gap:12px; }
/* 鼠标悬停暂停，便于点击卡片 */
.wf-row:hover .wf-row-track{ animation-play-state:paused; }
@keyframes wf-scroll-x{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(calc(var(--wf-shift,0px) * -1),0,0); } }
@keyframes wf-scroll-x-rev{ from{ transform:translate3d(calc(var(--wf-shift,0px) * -1),0,0); } to{ transform:translate3d(0,0,0); } }
/* 卡片：横向排布 —— 图标居左，标题 + 描述并列于图标右侧，均单行省略 */
.wf-card{ flex:0 0 260px; width:260px; display:flex; flex-direction:row; align-items:center; gap:12px; text-decoration:none; color:inherit; border:1px solid #d6d6e7; border-radius:16px; background:#fff; padding:16px 15px; filter:grayscale(0.5); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease, filter .25s ease; }
/* 悬停：背景亮出该卡图标对应的色系（主色按 6% 混入白色，比图标自身浅底更淡，图标仍可凸显）；前一条为不支持 color-mix 时的降级值 */
.wf-card:hover{
  transform:translateY(-2px);
  box-shadow:0 3px 8px rgba(99,102,241,.13);
  box-shadow:0 3px 8px color-mix(in srgb, var(--wf-color, #6d28ff) 14%, transparent);
  border-color:#d9cdfb;
  border-color:color-mix(in srgb, var(--wf-color, #6d28ff) 30%, #ffffff);
  background-color:#f7f8ff;
  background-color:color-mix(in srgb, var(--wf-color, #6d28ff) 6%, #ffffff);
  filter:grayscale(0);
}
.wf-card-ico{ flex:0 0 auto; width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; }
.wf-card-ico svg{ width:20px; height:20px; }
/* 文字列：标题与描述之间 gap 2px */
.wf-card-body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
.wf-card-titlerow{ display:flex; align-items:center; gap:6px; min-width:0; }
.wf-card-title{ flex:0 1 auto; min-width:0; font-size:14.5px; font-weight:600; color:#1f1147; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .2s ease; }
.wf-card:hover .wf-card-title{ color:#6d28d9; }
.wf-card-badge{ flex:0 0 auto; display:inline-flex; align-items:center; padding:1px 8px; border-radius:999px; font-size:11px; font-weight:600; line-height:1.6; }
.wf-card-desc{ margin:0; font-size:12.5px; line-height:1.5; color:#6b7280; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* 两侧淡出遮罩：自动滚动时两侧始终有内容进出，故常驻显示（背景纯白，用白色渐变） */
.wf-fade{ position:absolute; top:0; bottom:0; width:44px; pointer-events:none; opacity:1; z-index:3; }
.wf-fade-left{ left:0; background:linear-gradient(to right, #ffffff 0%, rgba(255,255,255,0) 100%); }
.wf-fade-right{ right:0; background:linear-gradient(to left, #ffffff 0%, rgba(255,255,255,0) 100%); }
@media(max-width:680px){ .wf-card{ flex:0 0 230px; width:230px; } .wf-fade{ width:30px; } }
/* 尊重系统「减少动态效果」偏好：停止自动滚动，改为可手动横向滑动 */
@media(prefers-reduced-motion: reduce){
  .wf-row-track{ animation:none; }
  .wf-row{ overflow-x:auto; }
}
