/* ============================================================
   Excel 表格高级设计感指南 · 站点外部样式表（cfo580 专用）
   抽离自内联 <style>，规避 Goldmark typographer(--→&ndash;)
   与 style 块空行截断两个坑。class 统一 dg- 前缀防主题冲突。
   ============================================================ */
:root{
  --primary:#1F3864;
  --primary-soft:#EAF0F8;
  --accent:#2E75B6;
  --ink:#404040;
  --muted:#7C7C7C;
  --line:#D9D9D9;
  --head-bg:#F2F2F2;
  --zebra:#F7F7F7;
  --card:#FFFFFF;
  --bad:#B33939;
  --ok:#2E7D5B;
}
.dg-wrap{font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",sans-serif;color:var(--ink);line-height:1.78;font-size:15px;-webkit-font-smoothing:antialiased;max-width:960px;margin:0 auto;padding:0 20px 56px;}

/* 头部 */
.dg-header{background:var(--primary);color:#fff;border-radius:14px;padding:44px 36px 38px;margin:8px 0 0;}
.dg-kicker{font-size:13px;letter-spacing:2px;color:#B9C6DE;margin-bottom:12px;}
.dg-header h1{font-size:28px;font-weight:700;line-height:1.4;letter-spacing:1px;}
.dg-sub{margin-top:14px;font-size:15px;color:#D4DCEA;max-width:640px;line-height:1.8;}
.dg-pills{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;}
.dg-pill{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.22);padding:6px 14px;border-radius:999px;font-size:13px;}

/* 章节 */
.dg-section{margin-top:48px;}
.dg-sec-head{display:flex;align-items:baseline;gap:14px;border-bottom:2px solid var(--primary);padding-bottom:10px;margin-bottom:22px;}
.dg-sec-num{font-size:14px;font-weight:700;color:var(--accent);letter-spacing:1px;}
.dg-section h2{font-size:21px;font-weight:700;color:var(--primary);}
.dg-intro{font-size:15px;color:var(--muted);margin-bottom:20px;max-width:740px;}
.dg-lead{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);padding:18px 22px;font-size:16px;font-weight:600;color:var(--primary);margin-bottom:22px;}
.dg-h3{font-size:18px;font-weight:700;color:var(--primary);margin:26px 0 10px;}
.dg-h4{font-size:15px;font-weight:700;color:var(--ink);margin:18px 0 8px;}
.dg-p{margin-bottom:14px;}
.dg-ul{margin:0 0 16px 20px;}
.dg-ul li{margin-bottom:9px;}
.dg-ul li b{color:var(--primary);}
.dg-ol{margin:0 0 16px 22px;}
.dg-ol li{margin-bottom:9px;}
.dg-strong{color:var(--primary);font-weight:700;}

/* 对比表 */
.dg-compare{display:flex;flex-wrap:wrap;gap:20px;}
.dg-panel{flex:1 1 380px;min-width:300px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px;}
.dg-panel h3{font-size:15px;font-weight:700;margin-bottom:4px;}
.dg-panel .cap{font-size:13px;color:var(--muted);margin-bottom:14px;}
table.dg-demo{width:100%;border-collapse:collapse;font-size:14px;table-layout:fixed;}
table.dg-demo col{width:40%;}
table.dg-demo col.c2{width:32%;}
table.dg-demo col.c3{width:28%;}
table.dg-default td{border:1px solid #BFBFBF;padding:4px 6px;text-align:center;color:#333;}
table.dg-default thead td{background:#D9D9D9;font-weight:700;}
table.dg-default .total td{background:#E6E6E6;font-weight:700;}
table.dg-fine thead td{background:var(--primary);color:#fff;font-weight:700;padding:8px 10px;text-align:left;}
table.dg-fine td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);}
table.dg-fine td.num{text-align:right;font-variant-numeric:tabular-nums;}
table.dg-fine td.pct{text-align:right;color:var(--muted);}
table.dg-fine tbody tr:nth-child(even){background:var(--zebra);}
table.dg-fine .total td{background:var(--primary-soft);font-weight:700;color:var(--primary);}
.dg-note{margin-top:12px;font-size:13px;color:var(--muted);line-height:1.7;}
.dg-tag{display:inline-block;font-size:13px;font-weight:700;padding:2px 10px;border-radius:4px;margin-bottom:10px;}
.dg-tag-bad{background:#FBE9E9;color:var(--bad);}
.dg-tag-good{background:#E4F0EA;color:var(--ok);}

/* 通用表（层次/配色/数字） */
table.dg-tbl{width:100%;border-collapse:collapse;font-size:14px;margin:6px 0 18px;background:var(--card);}
table.dg-tbl thead td,table.dg-tbl th{background:var(--head-bg);color:var(--primary);font-weight:700;padding:10px 12px;text-align:left;border-bottom:2px solid var(--line);}
table.dg-tbl td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
table.dg-tbl tbody tr:nth-child(even){background:var(--zebra);}
table.dg-tbl td code{background:var(--primary-soft);color:var(--primary);padding:1px 6px;border-radius:4px;font-family:Consolas,monospace;font-size:13px;}

/* 色板 */
.dg-swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.dg-swatch{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.dg-swatch .chip{height:64px;}
.dg-swatch .meta{padding:10px 12px;}
.dg-swatch .meta .name{font-size:14px;font-weight:600;}
.dg-swatch .meta .hex{font-size:13px;color:var(--muted);font-family:Consolas,monospace;}
.dg-swatch .meta .use{font-size:13px;color:var(--muted);margin-top:4px;line-height:1.5;}

/* 自查 */
.dg-check{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 22px;}
.dg-check li{list-style:none;display:flex;gap:10px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--line);font-size:15px;}
.dg-check li:last-child{border-bottom:none;}
.dg-check .box{flex:none;width:20px;height:20px;border:2px solid var(--primary);border-radius:4px;margin-top:3px;}
.dg-check .q{font-weight:600;color:var(--ink);}
.dg-check .hint{color:var(--muted);font-size:13px;margin-top:2px;}

.dg-footer{margin-top:56px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);line-height:1.8;}

@media (max-width:600px){
  .dg-header{padding:34px 22px 30px;}
  .dg-header h1{font-size:23px;}
  .dg-section h2{font-size:19px;}
  .dg-swatches{grid-template-columns:repeat(2,1fr);}
  .dg-wrap{font-size:14px;}
}