:root{--js-teal: #0c6b5e;--js-teal-soft: #e2efeb;--js-ink: #16221f;--js-muted: #748682;--js-line: #e4eae8;--js-bg: #f2f5f4}html,body,#app{height:100%;margin:0}body{background:var(--js-bg);color:var(--js-ink);font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif}.page-head{margin-bottom:16px}.page-head h2{margin:0;font-size:20px;font-weight:700}.page-head p{margin:4px 0 0;color:var(--js-muted);font-size:13px;max-width:70ch;line-height:1.7}.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}.stat-card{background:#fff;border:1px solid var(--js-line);border-radius:8px;padding:14px 16px}.stat-card .label{font-size:12px;color:var(--js-muted)}.stat-card .value{font-size:24px;font-weight:600;line-height:1.4;font-variant-numeric:tabular-nums}.stat-card .sub{font-size:12px;color:var(--js-muted)}.up{color:#2c7a4b;font-weight:700}.down{color:#a3342c;font-weight:700}.chart{width:100%;height:300px}.mono{font-family:SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums}.hint{color:var(--js-muted);font-size:12px;line-height:1.75}.demo-tag{margin-left:8px}