/* ============================================================
   LDA · 大模型与 MCP 全景指南
   深色极光科技风格 · 移动端自适应
   ============================================================ */
:root{
  --bg:#0a0e1a;
  --bg2:#0d1424;
  --panel:#111a30;
  --panel2:#0e1628;
  --line:rgba(120,180,255,.14);
  --text:#eaf2ff;
  --muted:#8ba3c7;
  --cyan:#39d6ff;
  --violet:#8b7bff;
  --magenta:#ff5ad1;
  --blue:#4d8dff;
  --green:#34e0a1;
  --amber:#ffb547;
  --red:#ff5d6c;
  --card:rgba(15,22,42,.72);
  --shadow:0 18px 50px rgba(0,0,0,.5);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:"Microsoft YaHei","PingFang SC","Segoe UI",system-ui,sans-serif;
  background:var(--bg);color:var(--text);line-height:1.7;overflow-x:hidden;
}

/* ---------- 极光背景 ---------- */
.aurora{position:fixed;inset:0;z-index:-2;overflow:hidden;background:var(--bg);}
.aurora i{position:absolute;border-radius:50%;filter:blur(120px);opacity:.25;}
.aurora .a1{width:64vw;height:64vw;top:-18vw;left:-12vw;background:radial-gradient(circle,var(--blue),transparent 62%);animation:dr1 26s ease-in-out infinite alternate;}
.aurora .a2{width:60vw;height:60vw;bottom:-22vw;right:-14vw;background:radial-gradient(circle,var(--violet),transparent 62%);animation:dr2 32s ease-in-out infinite alternate;}
.aurora .a3{width:40vw;height:40vw;top:24vh;right:6vw;background:radial-gradient(circle,var(--magenta),transparent 60%);animation:dr3 38s ease-in-out infinite alternate;}
.aurora .a4{width:36vw;height:36vw;bottom:6vh;left:16vw;background:radial-gradient(circle,var(--cyan),transparent 60%);animation:dr1 30s ease-in-out infinite alternate;}
@keyframes dr1{from{transform:translate(0,0) scale(1);}to{transform:translate(12vw,8vh) scale(1.15);}}
@keyframes dr2{from{transform:translate(0,0) scale(1.1);}to{transform:translate(-10vw,-6vh) scale(.95);}}
@keyframes dr3{from{transform:translate(0,0);}to{transform:translate(-9vw,10vh);}}

.wrap{max-width:1180px;margin:0 auto;padding:0 26px;}

/* ---------- 导航 ---------- */
nav{position:sticky;top:0;z-index:60;backdrop-filter:blur(14px);background:rgba(10,14,26,.62);border-bottom:1px solid var(--line);}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:62px;}
.logo{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:2px;font-size:20px;cursor:pointer;}
.logo .dot{width:30px;height:30px;border-radius:8px;background:conic-gradient(from 180deg,var(--cyan),var(--violet),var(--magenta),var(--cyan));box-shadow:0 0 16px rgba(139,123,255,.6);}
.logo b{background:linear-gradient(90deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.menu{display:flex;gap:6px;font-size:14px;}
.menu a{color:var(--muted);text-decoration:none;padding:8px 13px;border-radius:10px;transition:.25s;cursor:pointer;position:relative;}
.menu a:hover{color:#fff;background:rgba(139,123,255,.1);}
.menu a.active{color:#fff;background:rgba(139,123,255,.16);}
.menu a.active::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--cyan),var(--violet));}
.menu-toggle{display:none;color:#fff;font-size:24px;cursor:pointer;background:none;border:none;}

/* ---------- 区段 ---------- */
.page{position:relative;padding:52px 0 84px;}
.page.hide{display:none;}
.sec-head{margin-bottom:34px;}
.kicker{font-size:13px;letter-spacing:3px;color:var(--cyan);text-transform:uppercase;margin-bottom:10px;font-weight:600;}
h1.title{font-size:clamp(28px,4.6vw,42px);font-weight:900;letter-spacing:.5px;line-height:1.2;}
.sec-sub{color:var(--muted);margin-top:12px;font-size:15px;max-width:820px;}
h3{font-size:22px;font-weight:800;margin-bottom:14px;}
h4{font-size:16px;font-weight:700;margin-bottom:8px;}

/* Hero（首页） */
.hero{padding:70px 0 40px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:6px 16px;border-radius:100px;font-size:13px;color:var(--cyan);background:rgba(57,214,255,.06);letter-spacing:2px;margin-bottom:24px;}
.hero-badge .pulse{width:8px;height:8px;border-radius:50%;background:var(--cyan);animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(57,214,255,.7);}70%{box-shadow:0 0 0 12px rgba(57,214,255,0);}100%{box-shadow:0 0 0 0 rgba(57,214,255,0);}}
.hero h1{font-size:clamp(34px,6vw,62px);font-weight:900;line-height:1.12;letter-spacing:1px;}
.hero h1 .grad{background:linear-gradient(120deg,var(--cyan),var(--violet) 52%,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-sub{margin-top:22px;font-size:clamp(15px,2vw,19px);color:var(--muted);max-width:760px;}
.hero-sub b{color:#fff;}
.hero-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;}
.tag{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:8px 16px;border-radius:12px;font-size:13px;background:var(--card);color:var(--muted);}
.tag b{color:#fff;font-weight:700;}

/* 卡片网格 */
.grid{display:grid;gap:20px;}
.g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}
.g3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.g4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));}
.card{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:18px;padding:24px;transition:.35s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;}
.card:hover{transform:translateY(-5px);border-color:rgba(139,123,255,.5);box-shadow:var(--shadow);}
.card .ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:24px;margin-bottom:14px;background:linear-gradient(140deg,rgba(57,214,255,.15),rgba(139,123,255,.15));}
.pill{display:inline-block;font-size:11px;padding:2px 9px;border-radius:100px;letter-spacing:.5px;margin-left:8px;vertical-align:middle;font-weight:700;}
.pi-auto{background:rgba(52,224,161,.14);color:var(--green);}
.pi-hand{background:rgba(255,181,71,.14);color:var(--amber);}
.pi-mix{background:rgba(77,141,255,.14);color:#8fb6ff;}

/* 数据看板（首页速览） */
.dash-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:26px;}
.dash{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:18px;padding:22px;transition:.3s;cursor:pointer;position:relative;overflow:hidden;}
.dash:hover{transform:translateY(-4px);border-color:rgba(57,214,255,.5);}
.dash .num{font-size:34px;font-weight:900;background:linear-gradient(120deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.dash .cap{color:var(--muted);font-size:13px;margin-top:4px;}
.dash a{position:absolute;inset:0;border-radius:18px;}

/* 榜单/列表 */
.chart-card{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:18px;padding:24px;}
.rank-row{display:flex;align-items:center;gap:14px;padding:13px 12px;border-radius:12px;border-bottom:1px dashed var(--line);transition:.2s;}
.rank-row:hover{background:rgba(139,123,255,.06);}
.rank-row.on{background:rgba(57,214,255,.1);box-shadow:inset 3px 0 0 var(--cyan);}
.rank-row.on .rn{color:var(--cyan);}
/* 坐标页排行行可点击跳到一周热度 */
#coordinateRank .rank-row{cursor:pointer;}
.rank-row.flash{animation:rankFlash 2.2s ease;}
@keyframes rankFlash{0%{background:rgba(57,214,255,.28);}60%{background:rgba(57,214,255,.28);}100%{background:rgba(57,214,255,.1);}}
.rank-num{flex:0 0 34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:900;font-size:16px;background:rgba(57,214,255,.1);color:var(--cyan);}
.rank-num.t1,.rank-num.t2,.rank-num.t3{background:linear-gradient(140deg,var(--cyan),var(--violet));color:#fff;box-shadow:0 4px 14px rgba(139,123,255,.4);}
.rank-body{flex:1;min-width:0;}
.rank-body .rn{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rank-body .rm{color:var(--muted);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rank-metric{flex:0 0 auto;text-align:right;}
.rank-metric .rv{font-weight:800;font-size:16px;}
.rank-metric .rl{color:var(--muted);font-size:11px;}
.bar{height:6px;border-radius:4px;background:rgba(255,255,255,.06);overflow:hidden;margin-top:6px;}
.bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--cyan),var(--violet));}

/* 表格 */
.table-card{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:18px;padding:0;overflow:auto;}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px;}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap;}
th{color:var(--cyan);font-weight:700;background:rgba(57,214,255,.05);position:sticky;top:0;}
tr:hover td{background:rgba(139,123,255,.05);}
.up{color:var(--green);}.down{color:var(--red);}

/* 筛选控件 */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px;align-items:center;}
.fbtn{border:1px solid var(--line);background:var(--card);color:var(--muted);padding:7px 15px;border-radius:100px;font-size:13px;cursor:pointer;transition:.2s;}
.fbtn:hover{color:#fff;border-color:rgba(139,123,255,.5);}
.fbtn.active{background:linear-gradient(140deg,rgba(57,214,255,.2),rgba(139,123,255,.2));color:#fff;border-color:rgba(139,123,255,.6);font-weight:700;}
.search{flex:1;min-width:200px;position:relative;}
.search input{width:100%;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 14px;color:#fff;font-size:14px;outline:none;}
.search input:focus{border-color:rgba(139,123,255,.6);}

/* MCP 分类 */
.mcp-cat{margin-bottom:34px;}
.cat-head{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:800;margin-bottom:16px;}
.cat-head .em{width:12px;height:12px;border-radius:3px;background:linear-gradient(135deg,var(--cyan),var(--violet));}
.mcp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;}
.mcp-card{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:16px;padding:18px;transition:.3s;}
.mcp-card:hover{transform:translateY(-4px);border-color:rgba(57,214,255,.5);}
.mcp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.mcp-name{font-weight:800;font-size:15px;}
.mcp-star{color:var(--amber);font-size:13px;font-weight:700;}
.mcp-desc{color:var(--muted);font-size:13px;min-height:40px;}
.mcp-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.mini{font-size:11px;padding:2px 8px;border-radius:100px;border:1px solid var(--line);color:var(--muted);}
.mini-aa{color:var(--green);border-color:rgba(52,224,161,.35);}
.mini-proxy{color:#f5b04c;border-color:rgba(245,176,76,.35);}
.mini.tag-life{color:var(--cyan);border-color:rgba(57,214,255,.3);}
.mini.tag-tech{color:var(--violet);border-color:rgba(139,123,255,.3);}
.mini.tag-other{color:var(--green);border-color:rgba(52,224,161,.3);}
.mini a{color:var(--muted);text-decoration:none;}

/* 口碑 */
.voice-card{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:16px;border-left:3px solid var(--red);}
.voice-card.good{border-left-color:var(--green);}
.voice-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px;}
.voice-model{font-weight:800;font-size:16px;}
.voice-type{font-size:11px;padding:2px 9px;border-radius:100px;background:rgba(255,93,108,.14);color:var(--red);font-weight:700;}
.voice-type.good{background:rgba(52,224,161,.14);color:var(--green);}
.voice-quote{color:var(--text);font-size:14px;line-height:1.8;margin-bottom:10px;font-style:italic;border-left:2px solid rgba(255,93,108,.4);padding-left:12px;}
.voice-src{color:var(--muted);font-size:12px;}
.voice-src a{color:var(--cyan);text-decoration:none;}
.voice-src a:hover{text-decoration:underline;}

/* 标签/分节 */
.section-title{font-size:26px;font-weight:900;margin-bottom:8px;}
.note{border-left:3px solid var(--violet);background:rgba(139,123,255,.07);border-radius:0 12px 12px 0;padding:16px 20px;margin:18px 0;font-size:14px;color:var(--muted);word-break:keep-all;line-height:1.8;}
.note b{color:#fff;}
.warn{border-left:3px solid var(--amber);background:rgba(255,181,71,.08);border-radius:0 12px 12px 0;padding:16px 20px;margin:18px 0;font-size:14px;color:#ffe3bd;}
.warn b{color:#fff;}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);margin:6px 0 20px;}

/* 页脚 */
footer{border-top:1px solid var(--line);padding:36px 0 56px;color:var(--muted);font-size:13px;text-align:center;}

/* 骨架屏/加载 */
.skeleton{color:var(--muted);padding:30px;text-align:center;}
.empty{color:var(--muted);padding:30px;text-align:center;}

/* 进场动画 */
.reveal{opacity:0;transform:translateY(24px);transition:.7s cubic-bezier(.2,.8,.2,1);}
.reveal.in{opacity:1;transform:none;}

/* 响应式 */
@media(max-width:820px){
  .menu{position:fixed;top:62px;left:0;right:0;flex-direction:column;background:rgba(10,14,26,.97);padding:10px;display:none;border-bottom:1px solid var(--line);}
  .menu.open{display:flex;}
  .menu-toggle{display:block;}
}

/* 价格更新日志 */
.cl-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--bg);padding:8px 10px;border-radius:10px;border:1px solid var(--line);font-size:13px;}
.cl-i{font-weight:700;color:#fff;min-width:130px;}
.cl-f{color:var(--muted);min-width:56px;}
.cl-from{color:var(--muted);text-decoration:line-through;}
.cl-arrow{color:var(--muted);}
.cl-to{color:var(--green);font-weight:600;}
.cl-src{margin-left:auto;color:var(--muted);font-size:12px;}

/* 选型参谋 */
.pick-group{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:18px;padding:22px;margin-bottom:18px;}
.pick-head{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.pick-ic{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,rgba(139,123,255,.18),rgba(57,214,255,.14));display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;}
.pick-task{font-size:19px;font-weight:800;color:#fff;}
.pick-roles{color:var(--muted);font-size:12px;margin-top:2px;}
.pick-scenes{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center;font-size:12px;color:var(--muted);}
.pick-recs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;}
.pick-rec{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;}
.pick-rec b{font-size:14px;color:#fff;}
.pick-why{color:var(--muted);font-size:13px;line-height:1.6;}
.pick-note{margin-top:12px;color:var(--muted);font-size:12px;border-top:1px dashed var(--line);padding-top:10px;}

/* 入门：成本速算 + 术语 */
.calc-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.calc-row label{color:var(--muted);font-size:13px;}
.calc-result{margin-top:14px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:16px;}
.calc-line{display:flex;justify-content:space-between;color:var(--muted);font-size:14px;padding:4px 0;border-bottom:1px dashed rgba(120,180,255,.08);}
.calc-total{margin-top:12px;font-size:15px;color:#fff;}
.calc-total b{font-size:24px;background:linear-gradient(120deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.glossary{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;}
.gloss-item{background:linear-gradient(160deg,var(--card),rgba(12,18,34,.5));border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:6px;transition:.3s;}
.gloss-item:hover{border-color:rgba(139,123,255,.5);transform:translateY(-2px);}
.gloss-item b{color:#fff;font-size:14px;display:flex;align-items:center;gap:6px;}
.gloss-item b::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(120deg,var(--cyan),var(--violet));flex-shrink:0;}
.gloss-item span{color:var(--muted);font-size:13px;line-height:1.7;}

/* 性价比坐标 —— 真正的二维散点 */
.coord-scatter{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);}
.coord-dots{position:relative;height:300px;margin:0 34px 0 40px;background:
  repeating-linear-gradient(0deg,rgba(120,180,255,.06) 0 1px,transparent 1px 33.33%),
  repeating-linear-gradient(90deg,rgba(120,180,255,.06) 0 1px,transparent 1px 25%),
  linear-gradient(180deg,rgba(139,123,255,.07),rgba(12,18,34,.45));
  overflow:hidden;}
.coord-point{position:absolute;transform:translate(-50%,-50%);width:13px;height:13px;border-radius:50%;background:linear-gradient(120deg,var(--cyan),var(--violet));box-shadow:0 0 12px rgba(57,214,255,.5);cursor:pointer;z-index:2;}
.coord-point.zgood{background:linear-gradient(120deg,#34d399,#10b981);box-shadow:0 0 12px rgba(52,211,153,.55);}
.coord-point.zhot{background:linear-gradient(120deg,#fb923c,#ea580c);box-shadow:0 0 12px rgba(251,146,60,.55);}
.coord-point.zmid{background:linear-gradient(120deg,var(--cyan),var(--violet));box-shadow:0 0 12px rgba(57,214,255,.5);}
.coord-point i{position:absolute;inset:-6px;border-radius:50%;background:radial-gradient(circle,rgba(57,214,255,.18),transparent 70%);}
.coord-point:hover{transform:translate(-50%,-50%) scale(1.5);box-shadow:0 0 18px rgba(57,214,255,.85);z-index:5;}
/* 纵轴刻度（左） */
.coord-tick-y{position:absolute;top:0;left:0;width:38px;height:300px;pointer-events:none;}
.coord-tick-y .cy{position:absolute;right:6px;transform:translateY(-50%);color:rgba(120,180,255,.55);font-size:10px;}
/* 横轴刻度（底部，与 dots 同 margin 保证对齐） */
.coord-tick-x{position:relative;height:26px;margin:4px 34px 0 40px;pointer-events:none;}
.coord-tick-x .cx{position:absolute;transform:translateX(-50%);color:rgba(120,180,255,.55);font-size:10px;white-space:nowrap;}
.coord-axis-label{position:absolute;color:rgba(120,180,255,.4);font-size:10px;pointer-events:none;z-index:1;}
.coord-tick-y .axis{position:absolute;left:4px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;letter-spacing:2px;}
.coord-tick-x .axis{position:absolute;right:0;bottom:6px;letter-spacing:2px;}
.coord-legends{display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:rgba(10,14,26,.6);border-top:1px dashed rgba(120,180,255,.15);}
.coord-legend{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:2px 4px;border-left:3px solid var(--cyan);}
.coord-legend .cl{width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px currentColor;}
.coord-legend.on{background:rgba(57,214,255,.08);border-radius:6px;}
.coord-legend b{color:#fff;font-size:12px;min-width:130px;}
.coord-legend span{color:var(--muted);font-size:11px;line-height:1.6;}
