@import url("tokens.css");   /* 设计令牌唯一口径：主色/灰阶/字阶/圆角/阴影 */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased}
a{color:var(--c-accent);text-decoration:none}
a:hover{text-decoration:underline}
body{font-family:"PingFang SC","Hiragino Sans GB","Heiti SC",-apple-system,"Microsoft YaHei",sans-serif;background:var(--paper);color:var(--ink);font-variant-numeric:tabular-nums;font-size:var(--fs-2)}
.app{margin:0 auto;padding:14px 16px 10px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}
.c2{grid-column:span 2}.c3{grid-column:span 3}.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c9{grid-column:span 9}.c10{grid-column:span 10}.c11{grid-column:span 11}.c12{grid-column:span 12}
.topbar{grid-column:span 12;background:var(--c-dark);border-radius:var(--r-card);display:flex;align-items:center;gap:14px;padding:9px 14px;color:var(--c-ink-on-dark);box-shadow:none}
.mark{width:28px;height:28px;border-radius:var(--r-ctl);background:var(--c-card);color:var(--dark);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--fs-1);letter-spacing:1px;flex:0 0 auto}
.fname{font-size:var(--fs-2);font-weight:600}
.fdemo{font-weight:400;color:var(--c-ink4);font-size:var(--fs-1)}
.sub{font-size:var(--fs-1);color:var(--c-ink4);margin-top:3px}
.sline{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:var(--fs-1);color:var(--c-dark-ink2);border-left:1px solid var(--c-primary-d);padding-left:14px}
.knob{width:8px;height:8px;border-radius:var(--r-pill);background:var(--c-green);box-shadow:none}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:10px 12px;box-shadow:none}
.chead{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.ctitle{font-size:var(--fs-2);font-weight:600}
.cnote{font-size:var(--fs-1);color:var(--weak)}
.srcbtn{margin-left:auto;border:1px solid var(--line);background:var(--c-card);color:var(--sub);font-size:var(--fs-1);border-radius:var(--r-ctl);padding:2px 8px}
.hero{display:flex;align-items:flex-end;gap:10px;padding-bottom:9px;border-bottom:1px solid var(--line2)}
.hval{font-size:var(--fs-5);font-weight:700;letter-spacing:-1px;line-height:1}
.hval small{font-size:var(--fs-2);font-weight:600;color:var(--sub);letter-spacing:0;margin-left:3px}
.pill{font-size:var(--fs-1);padding:1px 6px;border-radius:var(--r-pill);font-weight:600}
.pr{background:var(--red-l);color:var(--red)}.pg{background:var(--green-l);color:var(--green)}.pa{background:var(--amber-l);color:var(--amber)}.pb{background:var(--blue-l);color:var(--blue)}
table{width:100%;border-collapse:collapse}
th{font-size:var(--fs-1);font-weight:600;color:var(--weak);text-align:right;padding:4px 6px;border-bottom:1px solid var(--line)}
th:first-child,td:first-child{text-align:left}
td{font-size:var(--fs-1);padding:5px 6px;border-bottom:1px solid var(--line2);text-align:right}
tr.hi td{background:var(--c-red-l)}
.rd{color:var(--red)}.am{color:var(--amber)}.g{color:var(--green)}.bl{color:var(--blue)}
.tot{display:flex;gap:14px;flex-wrap:wrap;font-size:var(--fs-1);color:var(--sub);margin-top:8px}
.chip{display:inline-flex;align-items:center;gap:3px;font-size:var(--fs-1);font-weight:600;padding:2px 6px;border-radius:var(--r-pill);background:var(--c-line2);color:var(--sub)}
.kv{display:flex;gap:8px;font-size:var(--fs-1);line-height:1.5;padding:4px 0;border-top:1px solid var(--line2)}
.kv:first-of-type{border-top:0}
.kv .k{flex:0 0 62px;color:var(--weak);font-weight:600}
.kv b{font-weight:600}
.code{background:var(--c-card);border-radius:var(--r-ctl);padding:7px 9px;font-size:var(--fs-1);line-height:1.6;color:var(--sub);margin-top:7px}
.chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:var(--fs-1);color:var(--sub);margin-bottom:9px}
.chain .n{border:1px solid var(--line);background:var(--c-card);border-radius:var(--r-ctl);padding:3px 8px;font-weight:600;color:var(--ink)}
.chain .n.on{border-color:var(--blue);background:var(--blue-l);color:var(--blue)}
.chain .ar{color:var(--c-ink4)}
.actbar{grid-column:span 12;display:flex;align-items:center;gap:8px;background:var(--c-card);border:1px solid var(--line);border-radius:var(--r-ctl);padding:8px 12px;font-size:var(--fs-1);color:var(--sub)}
.bpri{margin-left:auto;border:0;background:var(--dark);color:var(--c-ink-on-dark);font-size:var(--fs-1);font-weight:600;border-radius:var(--r-ctl);padding:6px 12px}
.bsec{border:1px solid var(--line);background:var(--c-card);color:var(--sub);font-size:var(--fs-1);font-weight:600;border-radius:var(--r-ctl);padding:6px 12px}
.foot{grid-column:span 12;font-size:var(--fs-1);color:var(--weak);line-height:1.5;white-space:nowrap;overflow:hidden}
.foot b{color:var(--sub);font-weight:600}
.bars{display:flex;align-items:center;gap:8px;font-size:var(--fs-1);padding:4px 0;border-top:1px solid var(--line2)}
.bars:first-of-type{border-top:0}
.bars .rlab{width:70px;color:var(--sub);flex:0 0 auto}
.track{flex:1;height:7px;background:var(--c-track);border-radius:var(--r-ctl);overflow:hidden;display:flex}
.fill{height:100%}
.rval{width:58px;text-align:right;font-weight:600;flex:0 0 auto}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.kpi{background:var(--c-card);border:1px solid var(--line);border-radius:var(--r-card);padding:9px 12px}
.kpi .k{font-size:var(--fs-1);color:var(--weak)}
.kpi .v{font-size:var(--fs-4);font-weight:700;letter-spacing:-1px;margin-top:3px}
.kpi .v small{font-size:var(--fs-1);font-weight:600;color:var(--sub);letter-spacing:0;margin-left:2px}
.dlist{display:flex;flex-direction:column;gap:0}
.drow{display:flex;align-items:center;gap:10px;font-size:var(--fs-1);padding:7px 0;border-top:1px solid var(--line2)}
.drow:first-child{border-top:0}
.drow .t{flex:1;color:var(--ink)}
.drow .s{color:var(--weak);font-size:var(--fs-1)}
.num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--r-ctl);background:var(--blue-l);color:var(--blue);font-size:var(--fs-1);font-weight:700;flex:0 0 auto}
.adv{border-left:3px solid var(--red);background:var(--c-card);border:1px solid var(--line);border-radius:var(--r-ctl);padding:9px 11px;margin-top:8px}
.adv .h{display:flex;align-items:center;gap:6px;font-size:var(--fs-2);font-weight:600}
.adv .m{font-size:var(--fs-1);color:var(--sub);line-height:1.55;margin-top:5px}
.adv .m b{color:var(--ink)}
.big{font-size:var(--fs-5);font-weight:700;letter-spacing:-1px;line-height:1}
.ghost{color:var(--weak)}
.hr{height:1px;background:var(--line2);margin:8px 0}

/* ---------- 积木墙（R1 · 0.6.0）：多块同屏 + 拖动换位 + 三态（详细/图标/关键） ---------- */
.wall{display:grid;grid-template-columns:repeat(12,1fr);gap:10px;align-items:start;min-height:120px}
.brick{grid-column:span 6;background:var(--c-card);border:1px solid var(--line);border-radius:var(--r-card);padding:8px 10px 10px;
  box-shadow:none;transition:border-color .12s,opacity .12s}
.brick.mode-icon,.brick.mode-key{grid-column:span 3}
.brick.drag{opacity:.45}
.brick.over{border-color:var(--blue);box-shadow:none}
.brick.flash{border-color:var(--blue);box-shadow:none}
.bhead{display:flex;align-items:center;gap:7px;padding-bottom:7px;border-bottom:1px solid var(--line2);cursor:grab}
.bhead:active{cursor:grabbing}
.bhandle{color:var(--c-ink4);font-size:var(--fs-2);letter-spacing:-2px;user-select:none}
.bname{font-size:var(--fs-2);font-weight:600;color:var(--ink)}
.bbad{font-size:var(--fs-1);font-weight:600;color:var(--red);background:var(--red-l);border-radius:var(--r-pill);padding:1px 5px}
.bmove{display:flex;gap:2px;margin-left:auto}
.bmv{border:1px solid var(--line);background:var(--c-card);color:var(--sub);border-radius:var(--r-ctl);font-size:var(--fs-1);line-height:1;padding:1px 5px;cursor:pointer}
.bmv:hover{background:var(--c-hover)}
.bmodes{display:flex;gap:2px}
.bm{border:1px solid var(--line);background:var(--c-card);color:var(--sub);border-radius:var(--r-ctl);font-size:var(--fs-1);padding:2px 6px;cursor:pointer}
.bm.on{background:var(--dark);border-color:var(--dark);color:var(--c-ink-on-dark);font-weight:600}
.bbody{margin-top:8px}
.bkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.bkpis+.bkpis{margin-top:7px}
.brick .kpi{padding:7px 9px;border-radius:var(--r-ctl)}
.brick .kpi .v{font-size:var(--fs-3);margin-top:2px}
/* 图标态：8 个方片，颜色只表状态 */
.bicons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.bic{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:46px;
  border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--c-card)}
.bic i{font-style:normal;font-size:var(--fs-1);color:var(--weak);white-space:nowrap;overflow:hidden;max-width:100%}
.bic em{font-style:normal;font-size:var(--fs-2);font-weight:700;color:var(--ink)}
.bic.rd{background:var(--c-red-l);border-color:var(--c-line)}.bic.rd em,.bic.rd i{color:var(--red)}
.bic.am{background:var(--c-amber-l);border-color:var(--c-line)}.bic.am em,.bic.am i{color:var(--amber)}
/* 关键态：只露最该看的一个数 */
.bkey{padding:2px 2px 0}
.bkl{font-size:var(--fs-1);color:var(--weak)}
.bkv{font-size:var(--fs-5);font-weight:700;letter-spacing:-1px;margin-top:2px;line-height:1.1}
.bkv small{font-size:var(--fs-1);font-weight:600;color:var(--sub);margin-left:3px;letter-spacing:0}
.bks{display:flex;align-items:center;gap:6px;margin-top:5px}
.bkr{font-size:var(--fs-1);color:var(--c-ink4);margin-top:6px}
.wallfoot{margin-top:9px;padding-top:8px;border-top:1px solid var(--line2)}
.wallfoot .bsec{width:100%;font-size:var(--fs-1);padding:5px 8px}
/* ---------- 第 19 场：账号页表单控件字号收到字阶 2 档 ----------
   ui_acct.html 只引 ui.css，.acctform／.acctbtn 的法在 shell.css（本页不加载），
   控件落到浏览器默认 13.3333px（半像素、超 5 档）。这里只补字号与字体，不改配色与边框。 */
.acctform input,.acctform select,.acctbtn{font-family:inherit;font-size:var(--fs-2)}

/* 第 38 场：图表数字统一等宽（SVG 文本走 CSS 属性） */
svg text{font-variant-numeric:tabular-nums}
/* 第 38 场：small/sub/sup 不自缩（浏览器默认 .83em 会把 11px 拉到 9.17px，掉出字阶档）；
   select 的 option 浏览器默认给纯黑，这里收回到正文色。 */
small,sub,sup{font-size:1em}
select option{color:var(--c-ink1);background:var(--c-card)}

/* ---------- 第 46 场：全站外壳统一（只统一壳、配色与页宽；不动任何页的内容结构） ----------
   口径：与第 39／42 场已重做的两页（经营总览 .bank39、指挥台 .cons42）对齐——
        白页头 52 高＋1px 底线、纸面 #F6F6F4、卡白＋1px 线＋10 圆角、零阴影、全站同宽 1600。
   作用域：.topbar:not(.hdr37) 与 .app:not(.cons42):not(.bank39)。
        已重做的两页走 hdr37.css／console42.css／bank39.css，本段一字不落到它们身上。 */
body{background:var(--c-paper)}
.app:not(.cons42):not(.bank39){width:1600px!important;max-width:1600px!important;margin:0 auto;padding:0 20px 20px!important}
.topbar:not(.hdr37){grid-column:1/-1;height:52px;min-height:52px;margin:0 -20px;padding:0 20px;
  background:var(--c-card);color:var(--c-ink1);border:0;border-bottom:1px solid var(--c-line);
  border-radius:0;box-shadow:none;display:flex;align-items:center;gap:14px;flex-wrap:nowrap}
.topbar:not(.hdr37) .mark{width:26px;height:26px;border-radius:7px;background:var(--c-ink1);color:var(--c-card);
  font-size:var(--fs-1);font-weight:700;letter-spacing:0}
.topbar:not(.hdr37) .fname{font-size:13.5px;font-weight:700;color:var(--c-ink1);line-height:1.15}
.topbar:not(.hdr37) .fdemo{font-size:10.5px;font-weight:400;color:var(--c-ink3)}
.topbar:not(.hdr37) .sub{font-size:10.5px;color:var(--c-ink3);margin-top:3px;line-height:1.1;
  max-width:620px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar:not(.hdr37) .sline{margin-left:auto;border-left:0;padding-left:0;font-size:11.5px;color:var(--c-ink3);white-space:nowrap}
.topbar:not(.hdr37) .sline a{color:var(--c-ink3);text-decoration:none}
.topbar:not(.hdr37) .sline a:hover{color:var(--c-ink1);text-decoration:underline}
.topbar:not(.hdr37) .knob{width:7px;height:7px}
.topbar:not(.hdr37) .nav{display:flex;align-items:center;gap:22px;margin-left:18px;flex-wrap:nowrap;min-width:0}
.topbar:not(.hdr37) .nav .navi{font-size:var(--fs-2);line-height:1;color:var(--c-ink3);font-weight:400;
  background:none;border:0;border-radius:0;padding:16px 0;position:relative;white-space:nowrap;cursor:pointer}
.topbar:not(.hdr37) .nav .navi:hover{background:none;color:var(--c-ink1)}
.topbar:not(.hdr37) .nav .navi.on{background:none;border:0;color:var(--c-ink1);font-weight:700}
.topbar:not(.hdr37) .nav .navi.on:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--c-ink1)}
.topbar:not(.hdr37) .nav a.navi{text-decoration:none}
/* 卡头／表头收紧到同一层级（两页新 UI 用的是 12.5 粗标题＋浅底表头） */
.chead{margin-bottom:10px}
.ctitle{font-weight:700}
th{background:var(--c-btn)}
