/* ============================================================
   四川上市公司热度指数 SCHI · 工业级网站样式系统
   ============================================================ */
:root{
  --navy:#13294b; --navy2:#1f3d6e; --blue:#2e5496; --blue2:#4a7ac0; --sky:#6fa8e6;
  --orange:#d2691e; --orange2:#e8923e; --gold:#c79a3b; --green:#2e7d4f; --red:#c0392b;
  --bg:#eef2f7; --bg2:#e6ecf4; --card:#ffffff; --ink:#16202e; --ink2:#415064;
  --mut:#6f7e92; --line:#e1e7f0; --line2:#d4dcea;
  --shadow:0 4px 18px rgba(19,41,75,.08); --shadow-lg:0 12px 36px rgba(19,41,75,.16);
  --radius:14px; --radius-sm:10px;
  --grad-hero:linear-gradient(135deg,#13294b 0%,#1f3d6e 45%,#2e5496 100%);
  --grad-bar:linear-gradient(90deg,#4a7ac0,#13294b);
  --grad-warm:linear-gradient(90deg,#d2691e,#e8923e);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"PingFang SC","Microsoft YaHei","Segoe UI",-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;
  font-size:14.5px}
a{color:inherit;text-decoration:none}
.wrap{max-width:1240px;margin:0 auto;padding:0 20px}

/* ---------- 顶部导航 ---------- */
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);box-shadow:0 2px 12px rgba(19,41,75,.05)}
.nav-in{max-width:1240px;margin:0 auto;padding:0 20px;height:62px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:17px;color:var(--navy)}
.brand .logo{width:34px;height:34px;border-radius:9px;background:var(--grad-hero);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;box-shadow:var(--shadow)}
.brand .sub{font-size:10.5px;color:var(--mut);font-weight:500;letter-spacing:.5px}
.nav-links{display:flex;gap:4px;margin-left:auto}
.nav-links a{padding:8px 15px;border-radius:9px;font-size:14px;color:var(--ink2);font-weight:600;transition:.16s}
.nav-links a:hover{background:var(--bg2);color:var(--navy)}
.nav-links a.active{background:var(--navy);color:#fff}
.nav-toggle{display:none;margin-left:auto;font-size:24px;background:none;border:none;color:var(--navy);cursor:pointer}

/* ---------- Hero ---------- */
.hero{background:var(--grad-hero);color:#fff;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 82% 18%,rgba(111,168,230,.32),transparent 46%),
             radial-gradient(circle at 12% 92%,rgba(210,105,30,.20),transparent 42%)}
.hero::after{content:"川";position:absolute;right:3%;top:-44px;font-size:300px;font-weight:800;
  opacity:.06;font-family:serif;line-height:1;pointer-events:none}
.hero-in{position:relative;max-width:1240px;margin:0 auto;padding:46px 20px 40px}
.hero h1{font-size:34px;font-weight:800;letter-spacing:1px;line-height:1.25}
.hero h1 small{font-size:16px;font-weight:600;opacity:.82;letter-spacing:.5px}
.hero .tagline{margin-top:12px;font-size:15.5px;opacity:.93;max-width:680px}
.hero .meta-row{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px}
.chip{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);border-radius:20px;
  padding:6px 14px;font-size:12.5px;backdrop-filter:blur(4px)}
.chip b{color:#ffd9a8}

/* ---------- 免责声明条 ---------- */
.disclaimer{background:#fff7ed;border:1px solid #f3d3aa;color:#9a4a00;border-radius:var(--radius-sm);
  padding:11px 16px;font-size:12.8px;margin:18px 0;display:flex;gap:9px;align-items:flex-start;line-height:1.5}
.disclaimer .ic{font-size:15px;flex:0 0 auto}

/* ---------- KPI 卡 ---------- */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:13px;margin:20px 0}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 17px;
  box-shadow:var(--shadow);position:relative;overflow:hidden;transition:.2s}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.kpi::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--grad-bar)}
.kpi .n{font-size:27px;font-weight:800;color:var(--navy);font-variant-numeric:tabular-nums}
.kpi .n small{font-size:13px;font-weight:600;color:var(--mut)}
.kpi .l{font-size:12px;color:var(--mut);margin-top:3px}

/* ---------- 卡片/区块 ---------- */
.section{margin:26px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 22px;box-shadow:var(--shadow)}
.card-h{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.card-h .bar{width:4px;height:18px;background:var(--orange);border-radius:2px}
.card-h h2{font-size:17px;color:var(--navy);font-weight:800}
.card-h .more{margin-left:auto;font-size:12.5px;color:var(--blue);font-weight:600;cursor:pointer}
.card-h .more:hover{text-decoration:underline}
.hint{font-size:12px;color:var(--mut);margin-bottom:14px}
.grid2{display:grid;grid-template-columns:1.34fr 1fr;gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* ---------- 排行榜 ---------- */
.rank{list-style:none}
.rank li{display:flex;align-items:center;gap:11px;padding:9px 6px;border-bottom:1px dashed var(--line);
  cursor:pointer;border-radius:8px;transition:.13s}
.rank li:hover{background:#f6f9fd}
.rank li.act{background:#eef3fb}
.rank .no{width:26px;height:26px;border-radius:8px;background:#eaf0f9;color:var(--blue);font-weight:800;
  font-size:13px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.rank li:nth-child(1) .no{background:var(--gold);color:#fff}
.rank li:nth-child(2) .no{background:#9aa7b5;color:#fff}
.rank li:nth-child(3) .no{background:#cd7f32;color:#fff}
.rank .nm{font-weight:700;font-size:14px;min-width:78px}
.rank .tag{font-size:11px;color:var(--mut);min-width:96px;flex:0 0 auto}
.rank .track{flex:1;height:9px;background:#eef1f6;border-radius:5px;overflow:hidden}
.rank .fill{height:100%;background:var(--grad-bar);border-radius:5px;width:0;transition:width 1s cubic-bezier(.2,.7,.3,1)}
.rank .sc{width:46px;text-align:right;font-weight:800;font-size:13px;color:var(--navy);flex:0 0 auto;font-variant-numeric:tabular-nums}
.warn{color:var(--orange);font-size:11px;font-weight:800;margin-left:3px}

/* ---------- 雷达 ---------- */
#radarName{font-weight:800;color:var(--navy);font-size:16px}
#radarMeta{font-size:11.5px;color:var(--mut);margin:3px 0 4px}
.dimlist{margin-top:8px}
.dimlist .row{display:flex;align-items:center;gap:9px;margin:6px 0;font-size:12px}
.dimlist .dn{width:96px;color:var(--ink2)}
.dimlist .dt{flex:1;height:8px;background:#eef1f6;border-radius:4px;overflow:hidden}
.dimlist .df{height:100%;border-radius:4px;width:0;transition:width .8s ease}
.dimlist .dv{width:34px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}

/* ---------- 表格 ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-sm)}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{background:var(--navy);color:#fff;padding:10px 12px;text-align:left;font-weight:600;
  white-space:nowrap;cursor:pointer;position:sticky;top:0;user-select:none}
thead th:hover{background:var(--blue)}
thead th .ar{opacity:.5;font-size:10px;margin-left:3px}
tbody td{padding:9px 12px;border-bottom:1px solid var(--line)}
tbody tr:nth-child(even) td{background:#fafbfd}
tbody tr:hover td{background:#eef3fb;cursor:pointer}
.num{text-align:right;font-variant-numeric:tabular-nums}
.heat-cell{font-weight:800;color:var(--navy)}

/* ---------- 标签 ---------- */
.pill{display:inline-block;padding:2px 9px;border-radius:11px;font-size:11px;font-weight:700;white-space:nowrap}
.p-soe{background:#e7f0fb;color:#1f5aa8}.p-pri{background:#eaf7ee;color:#2e7d4f}
.p-for{background:#f3eafc;color:#7b3fb5}.p-nq{background:#fff3e0;color:#c55a11}
.p-risk{background:#fde8e8;color:#c0392b}.p-obs{background:#eef1f6;color:#6f7e92}
.p-act{background:#e7f5ee;color:#2e7d4f}

/* ---------- 搜索/筛选 ---------- */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.search-box{flex:1;min-width:200px;position:relative}
.search-box input{width:100%;padding:10px 14px 10px 38px;border:1px solid var(--line2);border-radius:10px;
  font-size:14px;background:#fff;transition:.16s}
.search-box input:focus{outline:none;border-color:var(--blue2);box-shadow:0 0 0 3px rgba(74,122,192,.14)}
.search-box .ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--mut);font-size:15px}
.selectbox{padding:9px 12px;border:1px solid var(--line2);border-radius:10px;font-size:13px;background:#fff;
  color:var(--ink2);cursor:pointer;font-weight:600}
.selectbox:focus{outline:none;border-color:var(--blue2)}
.count-tag{font-size:12.5px;color:var(--mut);margin-left:auto}
.count-tag b{color:var(--navy)}

/* ---------- 标签切换 ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.tab{padding:8px 16px;border:1px solid var(--line2);background:#fff;border-radius:21px;font-size:13px;
  cursor:pointer;color:var(--mut);transition:.15s;font-weight:600}
.tab:hover{border-color:var(--blue2);color:var(--blue)}
.tab.act{background:var(--navy);color:#fff;border-color:var(--navy)}

/* ---------- 条形图 ---------- */
.hbar{display:flex;align-items:center;gap:9px;margin:7px 0;font-size:12.5px}
.hbar .hn{width:150px;color:var(--ink);flex:0 0 auto}
.hbar .ht{flex:1;height:16px;background:#eef1f6;border-radius:4px;overflow:hidden}
.hbar .hf{height:100%;background:var(--grad-warm);border-radius:4px;width:0;transition:width 1s ease}
.hbar .hf.blue{background:var(--grad-bar)}
.hbar .hv{width:40px;text-align:right;font-weight:700;color:var(--orange);flex:0 0 auto}
.hbar .hv.blue{color:var(--blue)}

/* ---------- 洞察 ---------- */
.insights{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.insight{display:flex;gap:11px;padding:13px 15px;background:linear-gradient(135deg,#f7faff,#eef3fb);
  border:1px solid var(--line);border-radius:var(--radius-sm);font-size:13px;line-height:1.55}
.insight .ic{width:30px;height:30px;border-radius:8px;background:var(--navy);color:#fff;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;font-size:15px}

/* ---------- 公司详情 ---------- */
.co-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.co-badge{width:64px;height:64px;border-radius:16px;background:var(--grad-hero);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;flex:0 0 auto;box-shadow:var(--shadow)}
.co-title h1{font-size:25px;color:var(--navy);font-weight:800}
.co-title .code{font-size:13px;color:var(--mut);font-family:monospace}
.co-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:7px}
.co-heat{margin-left:auto;text-align:center}
.co-heat .v{font-size:40px;font-weight:800;color:var(--navy);line-height:1;font-variant-numeric:tabular-nums}
.co-heat .l{font-size:11.5px;color:var(--mut)}
.timeline{position:relative;padding-left:24px}
.timeline::before{content:"";position:absolute;left:7px;top:4px;bottom:4px;width:2px;background:var(--line2)}
.tl-item{position:relative;padding:9px 0 9px 4px}
.tl-item::before{content:"";position:absolute;left:-21px;top:14px;width:11px;height:11px;border-radius:50%;
  background:var(--blue2);border:2px solid #fff;box-shadow:0 0 0 2px var(--line2)}
.tl-item.risk::before{background:var(--red)}
.tl-date{font-size:11.5px;color:var(--mut);font-family:monospace}
.tl-type{font-weight:700;color:var(--navy);font-size:13.5px;margin:1px 0}
.tl-abs{font-size:12.5px;color:var(--ink2);line-height:1.5}

/* ---------- 方法论页 ---------- */
.doc{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:32px 40px;box-shadow:var(--shadow)}
.doc h2{font-size:21px;color:var(--navy);margin:26px 0 10px;padding-bottom:7px;border-bottom:2px solid var(--blue2)}
.doc h2:first-child{margin-top:0}
.doc h3{font-size:16px;color:var(--blue);margin:18px 0 7px}
.doc p{margin:8px 0;color:var(--ink2);line-height:1.75}
.doc ul{margin:8px 0 8px 22px;color:var(--ink2)}
.doc li{margin:5px 0;line-height:1.7}
.doc .formula{background:#f5f8fc;border-left:3px solid var(--blue2);padding:10px 16px;margin:10px 0;
  font-family:monospace;font-size:13.5px;color:var(--navy);border-radius:0 8px 8px 0}
.doc table{margin:12px 0}
.weight-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:16px 0}
.wcard{background:linear-gradient(135deg,#f7faff,#eef3fb);border:1px solid var(--line);border-radius:12px;
  padding:16px;text-align:center}
.wcard .w{font-size:30px;font-weight:800;color:var(--navy)}
.wcard .d{font-size:12.5px;color:var(--ink2);margin-top:5px;font-weight:600}
.wcard .x{font-size:11px;color:var(--mut);margin-top:3px}

/* ---------- 页脚 ---------- */
.footer{background:var(--navy);color:#cdd8e8;margin-top:46px;padding:30px 0 24px}
.footer-in{max-width:1240px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}
.footer h4{color:#fff;font-size:14px;margin-bottom:10px}
.footer p,.footer a{font-size:12.5px;line-height:1.9;color:#aebbcf;display:block}
.footer a:hover{color:#fff}
.footer .copy{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);margin-top:14px;padding-top:14px;
  font-size:12px;color:#8a99b0;text-align:center}

/* ---------- 工具 ---------- */
.skeleton{background:linear-gradient(90deg,#eef1f6 25%,#e2e8f1 50%,#eef1f6 75%);background-size:200% 100%;
  animation:sk 1.3s infinite;border-radius:6px}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}
.fade-in{animation:fade .5s ease}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.empty{text-align:center;padding:40px;color:var(--mut);font-size:13.5px}

/* ---------- 响应式 ---------- */
@media(max-width:980px){
  .kpis{grid-template-columns:repeat(3,1fr)}
  .grid2,.grid3{grid-template-columns:1fr}
  .weight-grid{grid-template-columns:repeat(2,1fr)}
  .insights{grid-template-columns:1fr}
  .footer-in{grid-template-columns:1fr}
}
@media(max-width:680px){
  .nav-links{display:none;position:absolute;top:62px;left:0;right:0;background:#fff;flex-direction:column;
    padding:10px;box-shadow:var(--shadow-lg);gap:2px}
  .nav-links.open{display:flex}
  .nav-toggle{display:block}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size:26px}
  .doc{padding:22px 20px}
  .co-heat{margin-left:0;width:100%;text-align:left}
}