:root { --ink:#182126; --muted:#637077; --line:#d9e1df; --canvas:#f4f6f3; --paper:#fff; --teal:#167c74; --amber:#ba6a18; --red:#b1443d; }
* { box-sizing:border-box; }
body { margin:0; background:var(--canvas); color:var(--ink); font-family:"Microsoft YaHei", "Noto Sans SC", Arial, sans-serif; font-size:14px; letter-spacing:0; }
.topbar { height:58px; display:flex; align-items:center; justify-content:space-between; padding:0 max(20px, calc((100vw - 1320px)/2)); background:var(--paper); border-bottom:1px solid var(--line); }
.brand,.topbar-actions { display:flex; align-items:center; gap:10px; }.brand { font-size:18px; font-weight:700; }.brand svg { width:21px; color:var(--teal); }.status-dot { color:var(--muted); font-size:13px; display:flex; align-items:center; gap:7px; }.status-dot i,.source-state { width:8px; height:8px; border-radius:50%; background:var(--teal); display:inline-block; }.icon-button { width:34px; height:34px; border:1px solid var(--line); color:var(--ink); background:var(--paper); border-radius:4px; display:grid; place-items:center; cursor:pointer; }.icon-button:hover { background:#eef4f2; }.icon-button:disabled { cursor:wait; opacity:.65; }.icon-button svg { width:16px; }.icon-button.is-loading svg { animation:button-spin .8s linear infinite; }@keyframes button-spin { to { transform:rotate(360deg); } }
main { max-width:1320px; margin:auto; padding:34px 24px 52px; }.headline-band { display:flex; align-items:end; justify-content:space-between; margin-bottom:26px; }.eyebrow { color:var(--teal); font-weight:700; font-size:12px; margin:0 0 7px; }.headline-band h1 { font-size:30px; margin:0; font-weight:700; }.generated-at { margin:0; color:var(--muted); font-size:13px; }.metrics { display:grid; grid-template-columns:repeat(4,1fr); background:var(--paper); border:1px solid var(--line); margin-bottom:22px; }.metrics div { min-height:92px; padding:18px 20px; border-right:1px solid var(--line); }.metrics div:last-child { border-right:0; }.metrics span { color:var(--muted); display:block; }.metrics strong { display:block; margin-top:8px; font-size:27px; font-weight:650; }
.content-section { background:var(--paper); border:1px solid var(--line); padding:21px; }.section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:17px; }.section-heading h2 { margin:0; font-size:18px; }.count-label { color:var(--muted); font-size:13px; }.table-wrap { overflow:auto; } table { width:100%; border-collapse:collapse; min-width:620px; } th { color:var(--muted); font-weight:500; text-align:left; font-size:12px; padding:0 10px 11px; border-bottom:1px solid var(--line); } td { padding:15px 10px; border-bottom:1px solid #edf0ef; } tr:last-child td { border-bottom:0; }.divergence { color:var(--teal); font-weight:700; }.empty-cell { text-align:center; color:var(--muted); padding:32px; }.split-section { display:grid; grid-template-columns:1.25fr .75fr; gap:22px; margin-top:22px; }.signal-list article,.source-list article { padding:13px 0; border-bottom:1px solid #edf0ef; }.signal-list article:last-child,.source-list article:last-child { border-bottom:0; }.signal-list article > div { display:flex; gap:8px; align-items:center; }.signal-list article strong { float:right; margin-top:-21px; font-size:18px; }.signal-theme { font-weight:700; }.signal-metric { color:var(--teal); font-size:12px; background:#e7f3f1; padding:3px 6px; }.signal-list p,.source-list p { margin:7px 0 0; color:var(--muted); font-size:12px; word-break:break-word; }.signal-list a { color:var(--teal); margin-left:6px; }.source-list article > div { display:flex; align-items:center; gap:8px; }.source-state.partial { background:var(--amber); }.source-state.failed { background:var(--red); }.empty-text { color:var(--muted); margin:30px 0; text-align:center; }
.signal-list h3 { font-size:14px; line-height:1.45; font-weight:500; margin:9px 34px 0 0; }
.source-row { width:100%; padding:13px 0; border:0; border-bottom:1px solid #edf0ef; text-align:left; color:inherit; background:transparent; cursor:pointer; font:inherit; }.source-row:last-child { border-bottom:0; }.source-row:hover { background:#f5faf8; }.source-row > div { display:flex; align-items:center; gap:8px; }.source-row p { margin:7px 0 0; color:var(--muted); font-size:12px; word-break:break-word; }.source-state.empty { background:#9aa5a8; }.source-dialog { width:min(940px, calc(100vw - 28px)); max-height:min(760px, calc(100vh - 48px)); border:1px solid var(--line); padding:22px; color:var(--ink); background:var(--paper); }.source-dialog::backdrop { background:rgba(24,33,38,.32); }.dialog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); padding-bottom:15px; }.dialog-heading h2 { margin:0; font-size:19px; }.dialog-meta { margin:14px 0; color:var(--muted); font-size:13px; }.source-detail-list { max-height:560px; overflow:auto; }.source-detail-table-wrap { overflow:auto; border:1px solid #edf0ef; }.source-detail-table { min-width:760px; font-size:13px; }.source-detail-table th { position:sticky; top:0; z-index:1; padding:10px; background:#f7faf8; white-space:nowrap; }.source-detail-table td { padding:11px 10px; vertical-align:top; }.source-detail-table td:first-child,.source-detail-table td:nth-child(5),.source-detail-table td:last-child { white-space:nowrap; }.source-detail-table td:nth-child(2) { min-width:190px; }.source-detail-table small { display:block; margin-top:4px; color:var(--muted); font-size:12px; font-weight:400; line-height:1.4; }.source-detail-table a { color:var(--teal); }.detail-value { font-weight:700; white-space:nowrap; }.detail-metric { color:#92500d; font-size:12px; background:#fff0dd; padding:3px 6px; white-space:nowrap; }
.watch-section { margin-bottom:22px; }.watch-table td:nth-child(2) { color:var(--muted); }.watch-status { color:var(--amber); font-weight:700; }
.project-section { margin-bottom:22px; }.project-table { min-width:900px; }.project-table td { vertical-align:top; }.project-table small { display:block; margin-top:4px; color:var(--muted); font-size:12px; line-height:1.4; }.project-table td:nth-child(1) { min-width:190px; }.project-table td:nth-child(2) { min-width:140px; }.project-table td:last-child { width:54px; }.project-number { font-size:15px; font-weight:700; white-space:nowrap; }.project-positive { color:var(--teal) !important; font-weight:700; }.project-status { display:inline-block; color:#92500d; background:#fff0dd; padding:2px 6px; font-size:12px; }.project-dialog { width:min(600px, calc(100vw - 28px)); border:1px solid var(--line); padding:22px; color:var(--ink); background:var(--paper); }.project-dialog::backdrop { background:rgba(24,33,38,.32); }.project-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.project-form-grid label { display:grid; gap:7px; color:var(--muted); font-size:13px; }.project-form-grid input,.project-form-grid textarea { width:100%; border:1px solid var(--line); border-radius:4px; padding:9px 10px; color:var(--ink); background:var(--paper); font:inherit; outline:none; }.project-form-grid input:focus,.project-form-grid textarea:focus { border-color:var(--teal); box-shadow:0 0 0 2px #e7f3f1; }.project-form-grid textarea { resize:vertical; }.span-two { grid-column:span 2; }.form-error { min-height:18px; margin:12px 0 0; color:var(--red); font-size:13px; }.dialog-actions { display:flex; justify-content:flex-end; margin-top:16px; }.command-button { border:1px solid var(--teal); border-radius:4px; padding:9px 14px; background:var(--teal); color:#fff; cursor:pointer; font:inherit; }.command-button:hover { background:#116861; }
.confirmation-section { margin-top:22px; }.confirmation-list article { padding:13px 0; border-bottom:1px solid #edf0ef; }.confirmation-list article:last-child { border-bottom:0; }.confirmation-list article > div { display:flex; gap:8px; align-items:center; }.confirmation-list article strong { float:right; margin-top:-21px; font-size:18px; }.confirmation-list h3 { font-size:14px; line-height:1.45; font-weight:500; margin:9px 34px 0 0; }.confirmation-list p { margin:7px 0 0; color:var(--muted); font-size:12px; word-break:break-word; }.confirmation-list a { color:var(--teal); margin-left:6px; }.confirmation-metric { color:#92500d; font-size:12px; background:#fff0dd; padding:3px 6px; }.positive-flow { color:var(--teal); }.negative-flow { color:var(--red); }
@media (max-width:760px) { .topbar { padding:0 16px; } main { padding:24px 16px 36px; }.headline-band { align-items:start; gap:12px; flex-direction:column; }.metrics { grid-template-columns:repeat(2,1fr); }.metrics div:nth-child(2) { border-right:0; }.metrics div:nth-child(-n+2) { border-bottom:1px solid var(--line); }.metrics div { min-height:78px; padding:14px; }.metrics strong { font-size:23px; }.split-section { grid-template-columns:1fr; }.content-section { padding:16px; }.project-form-grid { grid-template-columns:1fr; }.span-two { grid-column:auto; } }
