* { box-sizing: border-box; }
body {
      margin: 0;
      background: #f4f5f7;
      color: #242a31;
      font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
    }
@keyframes dashSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
input[type="date"] { font-family: inherit; }
table tbody tr:hover td { background: #fafcfc; }
header.topbar {
      position: sticky; top: 0; z-index: 50;
      background: #ffffff; border-bottom: 1px solid #e5e7ea;
    }
.topbar-inner {
      max-width: 1280px; margin: 0 auto; padding: 10px 20px;
      display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
    }
.brand { display: flex; align-items: baseline; gap: 10px; margin-right: auto; }
.brand h1 { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: .02em; }
.brand .sub { font-size: 12px; color: #8a919c; }
.seg { display: flex; align-items: center; gap: 2px; background: #f1f3f5; border-radius: 6px; padding: 2px; }
.seg button {
      border: none; border-radius: 5px; padding: 5px 16px; font-size: 13px;
      cursor: pointer; font-family: inherit; background: transparent; color: #5c6470;
    }
.seg button.active { background: #fff; color: #111; font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.10); }
.dates { display: flex; align-items: center; gap: 6px; }
.dates input {
      border: 1px solid #dcdfe3; border-radius: 6px; padding: 5px 8px;
      font-size: 12px; color: #3b4048; background: #fff;
    }
.dates .to { color: #aab0b8; font-size: 12px; }
.actions { display: flex; align-items: center; gap: 8px; }
.btn-ghost {
      display: flex; align-items: center; gap: 6px; border: 1px solid #dcdfe3;
      background: #fff; color: #3b4048; border-radius: 6px; padding: 6px 12px;
      font-size: 13px; cursor: pointer; font-family: inherit;
    }
.btn-ghost:hover { border-color: #b8bec6; }
.btn-primary {
      display: flex; align-items: center; gap: 7px; border: none; background: #111111;
      color: #fff; border-radius: 6px; padding: 7px 14px; font-size: 13px;
      font-weight: 500; cursor: pointer; font-family: inherit;
    }
.btn-primary:disabled { background: #858585; cursor: default; }
.spin { display: inline-block; animation: dashSpin .8s linear infinite; }
.spinner {
      display: inline-block; width: 12px; height: 12px;
      border: 2px solid rgba(255,255,255,.35); border-top-color: #fff;
      border-radius: 50%; animation: dashSpin .8s linear infinite;
    }
.syncinfo { font-size: 12px; color: #8a919c; white-space: nowrap; }
.cmp-switch {
      display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
      font-size: 12.5px; color: #5c6470; user-select: none; white-space: nowrap;
    }
.cmp-switch .track {
      position: relative; width: 34px; height: 18px; border-radius: 9px;
      background: #111111; transition: background .15s;
    }
.cmp-switch .track::after {
      content: ""; position: absolute; top: 2px; left: 18px; width: 14px; height: 14px;
      border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: left .15s;
    }
body.cmp-off .cmp-switch .track { background: #c4c9d0; }
body.cmp-off .cmp-switch .track::after { left: 2px; }
body.cmp-off .cmp { display: none !important; }
.gpos { color: #1f7a37; font-weight: 600; }
.gneg { color: #c5320b; font-weight: 600; }
main { max-width: 1280px; margin: 0 auto; padding: 16px 20px 48px; display: flex; flex-direction: column; gap: 14px; }
.cache-note {
      display: flex; align-items: center; gap: 8px; background: #fdf6e3;
      border: 1px solid #f0e2b6; border-radius: 6px; padding: 8px 14px;
      font-size: 12.5px; color: #8a6d0b;
    }
.cache-note b { font-weight: 600; }
.cache-note button {
      margin-left: auto; border: none; background: none; color: #8a6d0b;
      font-size: 12.5px; text-decoration: underline; cursor: pointer;
      white-space: nowrap; font-family: inherit;
    }
.card { background: #ffffff; border: 1px solid #e5e7ea; border-radius: 8px; overflow: hidden; }
.card-head {
      display: flex; align-items: baseline; gap: 10px;
      padding: 13px 20px; border-bottom: 1px solid #eef0f2;
    }
.card-head h2 { margin: 0; font-size: 14.5px; font-weight: 600; }
.card-head .sub { font-size: 12px; color: #8a919c; }
.card-head .right { margin-left: auto; font-size: 12px; color: #8a919c; }
.consult-dept-cell { min-width: 150px; }
.consult-dept-cell .detail { display: block; margin-top: 3px; color: #8a919c; font-size: 10.5px; font-weight: 400; }
.ai-card { padding: 16px 20px; }
.ai-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.ai-badge {
      display: inline-flex; align-items: center; justify-content: center;
      width: 22px; height: 22px; border-radius: 5px; background: #111111;
      color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .02em;
    }
.ai-head h2 { margin: 0; font-size: 14.5px; font-weight: 600; }
.ai-head .sub { font-size: 12px; color: #8a919c; }
.ai-text { margin: 0 0 12px; font-size: 14px; line-height: 1.75; color: #3b4048; max-width: 960px; }
.ai-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
      display: inline-block; padding: 1px 8px; border-radius: 4px;
      font-size: 12px; font-weight: 500; white-space: nowrap;
    }
.chip.ok { color: #1f7a37; background: #ecf6ee; }
.chip.warn { color: #b98005; background: #fdf6e3; }
.chip.err { color: #c5320b; background: #fceceb; }
.chip.info { color: #111111; background: #f2f2f2; }
.chip.muted { color: #5c6470; background: #f1f3f5; }
.chip.sev-crit { color: #fff; background: #c5320b; }
.chip.sev-warn { color: #8a6d0b; background: #f8e8b8; }
.chip.sev-info { color: #111111; background: #e5e5e5; }
.delta {
      display: inline-block; padding: 1px 6px; border-radius: 4px; font-size: 12px;
      font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap;
    }
.delta.up { color: #1f7a37; background: #ecf6ee; }
.delta.down { color: #c5320b; background: #fceceb; }
.delta.none { color: #8a919c; background: #f1f3f5; font-weight: 400; }
.anomaly-bar { padding: 5px 20px; font-size: 12px; color: #7a8a99; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; border-bottom: 1px solid #eceff1; line-height: 1.5; }
.anomaly-bar.has { color: #b26a00; background: #fff8ec; border-bottom-color: #f0dcc0; }
.anomaly-bar .ab-badge { font-weight: 600; }
.anomaly-bar .ab-item { color: #b26a00; cursor: pointer; }
.anomaly-bar .ab-item:hover { text-decoration: underline; }
.anomaly-bar .ab-sep { color: #d3c0a4; }
.anomaly-bar .ab-ok { color: #8a919c; }
.anomaly-badge {
      display: inline-flex; align-items: center; justify-content: center;
      min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px;
      background: #fceceb; color: #c5320b; font-size: 12px; font-weight: 600;
    }
.anomaly-row {
      display: flex; align-items: flex-start; gap: 12px;
      padding: 11px 20px; border-bottom: 1px solid #f3f4f6; cursor: pointer;
    }
.anomaly-row:hover { background: #fafbfc; }
.anomaly-row:last-child { border-bottom: none; }
.anomaly-title { font-size: 13.5px; font-weight: 600; color: #242a31; }
.anomaly-detail { font-size: 12.5px; color: #5c6470; margin-top: 2px; }
.anomaly-action { font-size: 12px; color: #8a919c; margin-top: 2px; }
.anomaly-go { font-size: 12px; color: #111111; white-space: nowrap; padding-top: 2px; }
.kpi-dept-sel { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.kpi-dept-sel .kds-label { font-size: 12.5px; color: #6b7280; margin-right: 2px; }
.kpi-dept-sel .kds-btn { font-size: 12.5px; padding: 4px 14px; border: 1px solid #d3d6d9; background: #fff; color: #5f6368; border-radius: 999px; cursor: pointer; }
.kpi-dept-sel .kds-btn:hover { border-color: #111111; color: #111111; }
.kpi-dept-sel .kds-btn.active { background: #111111; color: #fff; border-color: #111111; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(272px, 1fr)); gap: 14px; }
.kpi {
      background: #ffffff; border: 1px solid #e5e7ea; border-radius: 8px;
      padding: 14px 16px; display: flex; flex-direction: column; gap: 2px;
    }
.kpi-body { display: flex; align-items: center; gap: 14px; margin-top: 4px; }
.kpi-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.kpi-labelrow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kpi-label { font-size: 12.5px; color: #6b7280; }
.kpi-value {
      font-size: 21px; font-weight: 600; font-variant-numeric: tabular-nums;
      letter-spacing: -.01em; white-space: nowrap;
    }
.kpi-ly { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: #8a919c; font-variant-numeric: tabular-nums; }
.kpi-mom { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: #9aa1ab; font-variant-numeric: tabular-nums; margin-top: 2px; }
.stored-foot { padding: 0 20px 4px; display: flex; flex-direction: column; gap: 6px; }
.stored-foot .kpi { border: none; background: none; padding: 0; }
.stored-foot .kpi-ring { display: none; }
.stored-foot .kpi-value { font-size: 22px; }
.stored-meta { font-size: 12.5px; color: #6b727c; padding: 2px 2px 0; font-variant-numeric: tabular-nums; }
.kpi-ring { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: none; }
.kpi-ring-wrap { position: relative; width: 62px; height: 62px; }
.kpi-ring-center {
      position: absolute; inset: 0; display: flex; flex-direction: column;
      align-items: center; justify-content: center;
    }
.kpi-ring-text { font-size: 10.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: #3b4048; line-height: 1; }
.kpi-ring-hint { font-size: 10px; color: #aab0b8; white-space: nowrap; }
.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 14px; align-items: start; }
.grid2-stretch { align-items: stretch; }
.grid2-stretch > .card { display: flex; flex-direction: column; }
#storedBody { flex: 1; display: flex; flex-direction: column; }
table { width: 100%; border-collapse: collapse; }
th {
      padding: 8px 12px; font-size: 12px; font-weight: 500; color: #8a919c;
      border-bottom: 1px solid #eef0f2; background: #fafbfc; text-align: right; white-space: nowrap;
    }
td {
      padding: 10px 12px; font-size: 13px; color: #242a31;
      border-bottom: 1px solid #f3f4f6; text-align: right;
      font-variant-numeric: tabular-nums; white-space: nowrap;
    }
th.l, td.l { text-align: left; }
th:first-child, td:first-child { padding-left: 20px; text-align: left; }
th:last-child, td:last-child { padding-right: 20px; }
td.dim { color: #8a919c; }
td.mid { color: #5c6470; }
tr.total td { background: #fafbfc; font-weight: 600; border-bottom: none; }
tr.total td.dim { font-weight: 400; }
.tscroll { overflow-x: auto; }
.tscroll table { min-width: 540px; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 8px; vertical-align: baseline; }
.rank { color: #aab0b8; font-size: 12px; margin-right: 8px; font-variant-numeric: tabular-nums; }
.sharebar { height: 5px; background: #eef0f2; border-radius: 3px; overflow: hidden; min-width: 70px; }
.sharebar > div { height: 5px; border-radius: 3px; background: #111111; }
.ratio-wrap { display: inline-flex; align-items: center; gap: 6px; }
.ratio-txt { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.dept-flex { display: flex; flex-wrap: wrap; align-items: stretch; }
.dept-table { flex: 1 1 620px; min-width: 0; overflow-x: auto; }
.dept-table table { min-width: 720px; }
.dept-side {
      flex: 0 0 300px; border-left: 1px solid #eef0f2; padding: 16px 20px;
      display: flex; flex-direction: column; gap: 12px; justify-content: center;
    }
.dept-side-title { font-size: 12.5px; color: #6b7280; font-weight: 500; }
.donut-row { display: flex; align-items: center; gap: 16px; }
.donut-wrap { position: relative; flex: none; }
.donut-center {
      position: absolute; inset: 0; display: flex; flex-direction: column;
      align-items: center; justify-content: center;
    }
.donut-center .cap { font-size: 11px; color: #8a919c; }
.donut-center .val { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.legend { display: flex; flex-direction: column; gap: 8px; }
.legend-item { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: #3b4048; }
.legend-item .pct { color: #8a919c; font-variant-numeric: tabular-nums; }
.newold-top { display: flex; align-items: center; gap: 20px; padding: 16px 20px 4px; }
.empty { padding: 24px 20px; color: #8a919c; text-align: center; font-size: 13px; }
.footnote { margin: 4px 2px 0; font-size: 12px; color: #aab0b8; }
.an-head { cursor: pointer; user-select: none; }
.an-head:hover { background: #fafbfc; }
.an-caret { color: #8a919c; font-size: 11px; align-self: center; width: 10px; }
#sec-anomaly.collapsed #anomalyBody { display: none; }
#sec-anomaly.collapsed .card-head { border-bottom: none; }
#anomalySummary.has { color: #b26a00; font-weight: 600; }
#sec-caliber.collapsed #caliberBody { display: none; }
#sec-caliber.collapsed .card-head { border-bottom: none; }
.caliber-body { padding: 4px 20px 18px; font-size: 12.5px; color: #3c4043; line-height: 1.65; }
.caliber-body h3 { margin: 14px 0 6px; font-size: 13px; color: #202124; }
.caliber-body h3 .cal-chip { margin-left: 6px; }
.cal-chip { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 11px; font-weight: 600; vertical-align: 1px; }
.cal-chip.ruled { background: #e6f4ea; color: #1a7f4b; }