/* 企业可视化图示页 · 设计令牌 v1.0
   用法：<body data-theme="light|dark">，不设则跟随系统。所有组件只引用变量，不写死颜色。 */
:root, [data-theme="light"] {
  color-scheme: light;
  --bg: #f3f5f8;        /* 页面底色 */
  --panel: #ffffff;     /* 卡片 */
  --fg: #17202e;        /* 正文 */
  --mute: #5d6b7e;      /* 次要文字、缺失、空状态 */
  --line: #d5dce6;      /* 分隔线、虚线框 */
  --cool: #0b8f86;  --cool-bg: #d6efec;   /* 青绿：正面、存续、资质、原告 */
  --warm: #c9891a;  --warm-bg: #fbefd2;   /* 琥珀：涉诉、处罚、联系档位、被告、供应商 */
  --acc:  #6b4a9e;  --acc-bg:  #ebe3f5;   /* 紫：品牌主色、商号、本公司 */
  --bad:  #b83a3a;  --bad-bg:  #f6dede;   /* 红：仅 异常/失信/冻结 */
  --blue: #3b6fb0;                        /* 辅助：纳税 B 级、对外投资 */
  --onacc: #ffffff;                       /* 紫底上的文字 */
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0f1520; --panel: #171f2d; --fg: #e6ebf2; --mute: #9fadc0; --line: #2b3648;
    --cool: #3cc3b8; --cool-bg: #12403d; --warm: #e5b04c; --warm-bg: #463716;
    --acc: #b497e0; --acc-bg: #2c2342; --bad: #ee7b7b; --bad-bg: #47232a;
    --blue: #7fa6dd; --onacc: #0f1520;
  }
}
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f1520; --panel: #171f2d; --fg: #e6ebf2; --mute: #9fadc0; --line: #2b3648;
  --cool: #3cc3b8; --cool-bg: #12403d; --warm: #e5b04c; --warm-bg: #463716;
  --acc: #b497e0; --acc-bg: #2c2342; --bad: #ee7b7b; --bad-bg: #47232a;
  --blue: #7fa6dd; --onacc: #0f1520;
}

/* 字体 */
:root {
  --font-sans: 'Noto Sans SC', 'PingFang SC', system-ui, sans-serif;
  --font-serif: 'Noto Serif SC', 'Songti SC', serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
}

/* 字号（px） */
:root {
  --fs-h1: clamp(24px, 4.5vw, 36px);  /* 企业名称，Serif 900 */
  --fs-h2: 18px;                      /* 卡片标题，Serif 600 */
  --fs-body: 14px;                    /* 正文，最小 */
  --fs-small: 13px;                   /* 说明、表格行 */
  --fs-label: 12px;                   /* 徽标、图例 */
  --fs-mono: 11px;                    /* 数据来源行、组标签、图内注释（最小 10px） */
  --lh-body: 1.6;
}

/* 间距与圆角 */
:root {
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
  --radius-card: 12px; --radius-tile: 10px; --radius-ctl: 8px; --radius-pill: 99px;
  --content-max: 1000px;  /* 内容区最大宽度 */
  --page-pad: 16px;       /* 手机左右留白 */
  --card-pad: 20px;
  --card-gap: 16px;
}

/* 基础组件骨架（可按需取用） */
.cv-page { background: var(--bg); color: var(--fg); font: var(--fs-body)/var(--lh-body) var(--font-sans); }
.cv-wrap { max-width: var(--content-max); margin: 0 auto; display: flex; flex-direction: column; gap: var(--card-gap); }
.cv-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-card); padding: var(--card-pad); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.cv-card h2 { margin: 0; font: 600 var(--fs-h2) var(--font-serif); }
.cv-card .lead { margin: 0; font-size: var(--fs-small); color: var(--mute); }
.cv-card .src { font: var(--fs-mono) var(--font-mono); color: var(--mute); }
.cv-group { font: var(--fs-mono) var(--font-mono); letter-spacing: .1em; color: var(--mute); margin-top: var(--space-2); }
.cv-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: var(--card-gap); }
.cv-scroll { overflow-x: auto; }           /* 宽图/宽表只在卡片内横滚 */
.cv-empty { padding: 14px; border: 1px dashed var(--line); border-radius: var(--radius-ctl); color: var(--mute); font-size: var(--fs-small); }
.cv-detail { padding: 10px 12px; border-radius: var(--radius-ctl); background: var(--bg); font-size: var(--fs-small); }
.cv-pill { font-size: var(--fs-mono); padding: 1px 8px; border-radius: var(--radius-pill); white-space: nowrap; }
.cv-pill.neutral { background: var(--bg); color: var(--mute); }
.cv-pill.rare-ok { background: var(--cool-bg); color: var(--cool); }
.cv-pill.rare-hit { background: var(--bad-bg); color: var(--bad); }
.cv-badge { font-size: var(--fs-label); font-weight: 500; padding: 3px 10px; border-radius: var(--radius-pill); white-space: nowrap; border: 1px solid transparent; }
.cv-badge.cool { background: var(--cool-bg); color: var(--cool); }
.cv-badge.warm { background: var(--warm-bg); color: var(--warm); }
.cv-badge.acc  { background: var(--acc-bg);  color: var(--acc); }
.cv-badge.bad  { background: var(--bad-bg);  color: var(--bad); }
.cv-badge.plain { border-color: var(--line); color: var(--fg); }
.cv-btn { font: 13px var(--font-sans); padding: 6px 14px; border-radius: var(--radius-ctl); border: 1px solid var(--acc); background: var(--acc); color: var(--onacc); cursor: pointer; white-space: nowrap; }
.cv-btn.secondary { background: transparent; color: var(--acc); }
.cv-btn.ghost { border-color: var(--line); background: transparent; color: var(--fg); }
.cv-btn:focus-visible, .cv-row:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.cv-row { display: grid; align-items: center; width: 100%; text-align: left; padding: 8px 10px; border-radius: var(--radius-ctl); border: none; background: transparent; color: var(--fg); cursor: pointer; font: inherit; }
.cv-row:hover { background: var(--bg); }
.cv-topbar { position: sticky; top: 0; z-index: 5; background: var(--panel); border-bottom: 1px solid var(--line); padding: 10px var(--page-pad); }
.cv-source { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-label); font-weight: 500; padding: 4px 10px; border-radius: var(--radius-pill); white-space: nowrap; }
.cv-source::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.cv-source.sample { background: var(--warm-bg); color: var(--warm); }
.cv-source.real   { background: var(--cool-bg); color: var(--cool); }
svg text { font-family: var(--font-sans); }
