/* Source-locked desktop reset. The three supplied screenshots are the authority. */
:root {
  --navy: #06285f; --navy-2: #064381; --blue: #075ff5; --green: #07944f;
  --orange: #f26a00; --red: #ef272d; --ink: #0b2149; --muted: #586b89;
  --line: #d6e1ee; --canvas: #f7fafe; --surface: #fff;
  font-family: "Arial Narrow", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}
/* The source desktop frame is 1487px wide. Keep the live preview on that
   exact canvas so minmax columns cannot squeeze the source-sized cards. */
html,body{width:1487px;min-width:1487px;background:var(--canvas)}
body{font-size:12px;font-weight:500;line-height:1.3}
.app-shell{width:1487px;min-width:1487px;grid-template-columns:160px 1327px}
.app-shell:has(.overview-body){grid-template-columns:172px 1315px}
.app-shell:has(.gsc-page){width:1484px;min-width:1484px;grid-template-columns:160px 1324px}
.app-shell:has(.site-page){grid-template-columns:162px 1325px}
.app-shell:has(.workflow-workspace){grid-template-columns:165px 1322px}
.sidebar{padding:16px 8px 10px;overflow-y:auto;background:linear-gradient(180deg,#00265b 0%,#002354 56%,#00285d 100%);box-shadow:none;scrollbar-width:none}
.sidebar-site-brand{background:linear-gradient(180deg,#00295f 0%,#00275a 56%,#002b61 100%)}
.sidebar-workflow{background:linear-gradient(180deg,#00316b 0%,#002f68 56%,#00346f 100%)}
.sidebar::-webkit-scrollbar{display:none}
.brand-block{padding:2px 7px 14px;gap:4px}.brand-block strong{font-size:17px}.brand-block span{font-size:12px}
.side-nav{gap:1px;flex:none}.side-link,.data-shell .side-link{min-height:36px;flex:none;padding:6px 7px;border-radius:6px;transition:none}.side-link>span{gap:9px}.side-link>span b{font-size:12px;font-weight:600}.side-link .icon{width:17px;height:17px}.side-link em{font-size:10px;padding:2px 6px;background:rgba(255,255,255,.15)}.side-link.active{background:linear-gradient(90deg,#075ff5,#0455df);box-shadow:none}
.system-card{min-height:193px;flex:none;padding:10px;border-radius:6px;background:rgba(0,18,48,.22)}.system-card h2{font-size:13px;margin-bottom:6px}.system-card p{min-height:22px;font-size:10.5px;align-items:center}.system-card p strong,.system-card p b{font-size:10.5px}.system-card button{height:34px;font-size:11px}
.workspace,.data-workspace,.site-workspace,.workflow-workspace{background:var(--canvas)}
.topbar{height:50px;padding:0 18px;gap:16px;background:#fff;border-color:#dce5ef}.topbar h1{font-size:18px;font-weight:700;letter-spacing:0}.scope-tabs{height:34px;border-color:#d6e1ee;border-radius:5px}.scope-tabs button{min-width:74px;padding:0 13px;font-size:11.5px}.top-actions>button{height:34px;border-color:#d6e1ee;border-radius:5px;font-size:11px}
.data-page{padding:12px 14px 10px;font-size:11px;font-weight:500;line-height:1.3}
.data-card,.data-kpi,.site-filterbar,.site-table,.site-drawer,.work-queue,.seo-task-board,.issue-detail>section,.issue-columns>section{border:1px solid #d4e0ed;border-radius:6px;background:#fff;box-shadow:none}
.data-card h2,.section-title{font-size:14px;font-weight:700}.data-kpi{padding:11px 11px 8px}.data-kpi>span{min-height:18px;font-size:11px;font-weight:700}.data-kpi>strong{margin-top:5px;font-size:27px;line-height:1.05}.data-kpi>strong small{font-size:11px}.data-kpi>p{margin-top:7px;font-size:10px}
.data-kpi.success{border-color:#b9dfce;background:#f2fbf7}.data-kpi.blue{border-color:#bfd4f4;background:#f1f6fd}.data-kpi.warning{border-color:#efd2a5;background:#fff9ef}.data-kpi.danger{border-color:#efbfc1;background:#fff4f4}
.data-kpi.blue>strong{color:var(--blue)}
.data-kpi.text-value>strong{font-size:14px;line-height:1.2;letter-spacing:0;white-space:nowrap}
.data-card button,.site-page button,.workflow-page button,.site-filterbar label{border-color:#cedbea;border-radius:5px;box-shadow:none}.dense-table th,.dense-table td{font-size:10px}.dense-table thead th{background:#f4f8fd}

/* Portfolio overview: use the measured source columns, not responsive fr units. */
.overview-body{padding:10px 23px 12px 20px}
.overview-kpis{width:1269px}
.overview-kpis .kpi-group-title{height:13px}
.overview-grid{grid-template-columns:216px 166px 148px 434px 241px;gap:16px}
.overview-grid .kpi-card{min-height:113px}
.metric-toolbar{width:1272px}
.overview-main{width:1272px;grid-template-columns:1098px 156px;gap:18px}
.programs-grid{width:1098px;grid-template-columns:540px 538px;gap:20px}
.priority-rail{width:156px;padding:12px 10px}

/* SEO / GSC */
.gsc-page{width:1324px;grid-template-columns:974px 300px;grid-template-rows:124px 266px 322px 153px 42px;column-gap:10px;row-gap:12px;padding:13px 26px 10px 14px}.gsc-kpis{grid-column:1 / -1;gap:15px;grid-template-columns:239px 215px 216px 155px 125px 124px 118px}.gsc-kpis .data-kpi{padding:11px 12px 8px}.gsc-kpis .data-kpi>span{font-size:11px}.gsc-kpis .data-kpi>strong{font-size:29px}.gsc-kpis .data-kpi:first-child>strong{font-size:34px}.gsc-kpis .data-kpi>p{font-size:10px}
.gsc-trend-card{grid-column:1;grid-row:2}.gsc-compare{grid-column:2;grid-row:2}.gsc-mid{grid-column:1 / -1;grid-row:3}.gsc-bottom{grid-column:1 / -1;grid-row:4;width:650px}.gsc-risk{grid-column:1 / -1;grid-row:4;width:624px;margin-left:660px}.data-footer{grid-column:1 / -1;grid-row:5}
.gsc-trend-card{padding:0 9px;background:#f4f8fe;border-color:#c6d9f1}.gsc-trend-card>header{height:39px}.tiny-tabs button{height:30px;padding:0 15px;font-size:11px}.gsc-date button,.gsc-date b{height:30px;font-size:11px}.gsc-chart-wrap{height:222px;background:#f5f9fe;border-color:#d4e1ef}.gsc-legend{top:7px;left:13px;font-size:9.5px}.gsc-trend-svg{height:194px}.gsc-value,.gsc-x,.gsc-y{font-size:10px}.gsc-chart-wrap>p{font-size:9px}
.gsc-compare{padding:9px 7px;background:#f3f7fd;border-color:#c6d9f1}.gsc-compare h2{font-size:13px}.gsc-compare th,.gsc-compare td{height:48px;font-size:10px}.gsc-compare td{font-size:15px}
.gsc-mid{gap:10px;grid-template-columns:.97fr 1.03fr}.query-card,.batch-performance{height:322px}.query-card>header,.batch-performance>header{height:39px}.query-card .tiny-tabs button{height:28px;padding:0 11px;font-size:9px}.query-card .dense-table{height:251px}.query-card th,.query-card td{height:20px;padding:1px 6px;font-size:9.5px;line-height:1}.batch-performance .dense-table{height:224px}.batch-performance th,.batch-performance td{height:24px;padding:2px 6px;font-size:9.5px;line-height:1}.card-link{padding:6px 10px;font-size:10px}
.gsc-bottom{padding:9px 7px;border-color:#b9dfce;background:#f2fbf7}.gsc-bottom>div{gap:10px;margin-top:9px}.gsc-bottom .data-kpi{min-height:104px;padding:9px;background:rgba(255,255,255,.42)}.gsc-bottom .data-kpi>strong{font-size:22px}.gsc-risk{padding:9px 7px;border-color:#efbfc1;background:#fff3f2}.gsc-risk th,.gsc-risk td{height:36px;font-size:9px}.data-footer{font-size:9px}

/* The realtime title and its source note are two independent columns in the
   reference. Never position the note over the title with a guessed offset. */
.realtime-card{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:16px 1fr;column-gap:12px;align-items:center}
.realtime-card>h3{grid-column:1;white-space:nowrap}
.realtime-card>p{grid-column:2;position:static;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:center}
.realtime-card>div{grid-column:1 / -1;margin-top:2px}

/* Site and brand */
.site-page{grid-template-columns:959px 314px;column-gap:28px;padding:8px 9px 10px 15px}.section-title{height:28px;padding-left:2px}.site-kpis{height:104px;gap:5px;grid-template-columns:1.28fr 1.18fr 1fr .82fr .88fr 1fr .8fr .7fr .72fr .8fr}.site-kpis .data-kpi{padding:10px 8px 8px}.site-kpis .data-kpi>span{font-size:10px}.site-kpis .data-kpi>strong{font-size:23px}.site-kpis .data-kpi:nth-child(5)>strong{font-size:19px;white-space:nowrap}.site-kpis .data-kpi:nth-child(6)>strong{font-size:13px;line-height:1.35;white-space:nowrap}.site-kpis .data-kpi>p{font-size:9px}
.batch-title{margin-top:8px}.batch-tabs{height:42px;gap:7px;margin-bottom:10px}.batch-tabs button{height:35px;width:79px;padding:0 8px;font-size:10px}.batch-tabs button:nth-child(1),.batch-tabs button:nth-child(2){width:128px}.site-filterbar{height:58px;padding:10px;gap:7px;background:#f8fbff}.site-filterbar label{width:150px;height:36px}.site-filterbar input{font-size:9.5px}.site-filterbar button{height:36px;padding:0 9px;font-size:9.5px}
.brand-overview{height:114px;margin-top:10px;background:#fff}.brand-overview>header{height:35px}.brand-overview>div{height:78px;grid-template-columns:.9fr 1.15fr 1fr 1.05fr 1fr 1.15fr 1fr .9fr 1fr .8fr}.brand-overview p{padding:9px 5px}.brand-overview p span{min-height:24px;font-size:9px}.brand-overview p b{font-size:14px}.site-actionbar{height:46px;margin-top:8px}.site-actionbar>span{font-size:9px}.site-actionbar>div button{height:34px}
.site-table{height:425px;border-radius:6px}.site-table th,.site-table td{height:38px;font-size:9.5px}.site-table thead th{height:34px;font-size:9.5px}.site-table tbody tr:nth-child(even) td{background:#fbfdfd}.site-table tbody tr:has(.status-pill.待审计) td{background:#fffdf8}.site-table tbody tr.selected td{background:#f2f6ff!important}.table-pagination{height:55px}
.site-drawer{height:940px;padding:10px 12px;background:#fff}.site-drawer>header{height:35px}.site-drawer h2{font-size:16px}.site-drawer dl{font-size:9.5px}.site-drawer h3{font-size:11px}.health-list,.event-list{font-size:9.5px}.drawer-note{font-size:9px;background:#f5f8fd}.drawer-chart{height:128px;position:relative}.drawer-chart-legend{position:absolute;top:0;left:3px;display:flex;gap:14px;font-size:8px;color:#536783}.drawer-chart-legend span:before{content:'';display:inline-block;width:12px;height:2px;margin-right:4px;vertical-align:middle;background:#075ff5}.drawer-chart-legend span:last-child:before{background:#07944f}.drawer-trend-svg{width:100%;height:122px;margin-top:5px}.drawer-grid line{stroke:#dbe5f0;stroke-width:.6}.drawer-y text,.drawer-x{fill:#5b6d87;font-size:6px}.drawer-x{text-anchor:middle}.drawer-line{fill:none;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.drawer-line.impressions,.drawer-dot.impressions{stroke:#075ff5}.drawer-line.clicks,.drawer-dot.clicks{stroke:#07944f}.drawer-dot{fill:#fff;stroke-width:1}.drawer-value{font-size:6px;text-anchor:middle}.drawer-value.impressions{fill:#075ff5}.drawer-value.clicks{fill:#07944f}

/* Workflow */
.workflow-page{grid-template-columns:696px 590px;gap:10px;padding:12px 13px 10px}.workflow-kpis{height:92px;gap:10px}.workflow-kpis .data-kpi{padding:10px}.workflow-kpis .data-kpi>span{font-size:10px}.workflow-kpis .data-kpi>strong{font-size:26px;line-height:1.15}.workflow-kpis .data-kpi>p{font-size:9px}.work-queue{height:336px;margin-top:10px}.work-queue>header{height:43px}.work-queue>p,.work-queue>footer{font-size:8.5px}.work-queue th,.work-queue td{height:49px;font-size:9px;line-height:1.25}.seo-task-board{height:316px;margin-top:9px}.seo-task-board>header{height:48px}.task-batches article{height:256px}.task-batches h3{height:38px;font-size:11px}.task-batches p{height:36px;font-size:9px;line-height:1.2}.key-data h2{height:29px;font-size:12px}.key-data .data-kpi{height:127px;padding:10px}.key-data .data-kpi>span{font-size:9px}.key-data .data-kpi>strong{font-size:21px}.key-data .data-kpi.text-value>strong{font-size:14px;line-height:1.2;white-space:nowrap}
.rank-bar{width:75px;margin-right:6px}
.key-data .data-kpi.blue>p{color:var(--blue)}
.issue-detail{height:1000px;margin-top:-4px;padding:0 8px 10px;background:#fff}.issue-detail>header{height:32px}.issue-detail>header h2{font-size:14px}.issue-title{height:47px}.issue-title h3{font-size:17px}.issue-title>span,.issue-title button{font-size:9.5px}.issue-detail>section,.issue-columns>section{padding:8px 9px;margin-bottom:8px}.issue-detail>section:nth-of-type(1){height:65px}.issue-detail>section:nth-of-type(2){height:158px}.issue-columns{margin-bottom:8px}.issue-columns>section{height:256px}.owner-card{height:95px!important}.issue-detail>section:nth-of-type(4){height:137px}.issue-detail>section:nth-of-type(5){height:166px}.issue-detail section h3{font-size:11px}.issue-detail section h4{font-size:9.5px}.issue-detail section p,.issue-columns dt,.issue-columns dd{font-size:9.5px}.timeline li{grid-template-columns:53px 1fr;font-size:9px}.timeline b{padding-top:1px}.timeline span{position:relative;border-left:1px solid #d7e2ee;padding-left:15px}.timeline span:before{content:"";position:absolute;left:-4px;top:3px;width:7px;height:7px;border:1.5px solid #48658a;border-radius:50%;background:#fff;box-sizing:border-box}.timeline li.done span:before{border-color:#075ff5;border-width:2px}.checklist li{font-size:9px}

/* v44 source material lock.
   Keep the measured grid untouched; only restore the flatter source surfaces,
   quieter borders and consistent KPI content baselines. */
.sidebar{background:#002451}
.data-shell .sidebar{background:#002356}
.sidebar-site-brand{background:#002856}
.sidebar-workflow{background:#04346c}

.data-card,
.data-kpi,
.site-filterbar,
.site-table,
.site-drawer,
.work-queue,
.seo-task-board,
.issue-detail>section,
.issue-columns>section{
  border-color:#dce5ef;
  border-radius:4px;
  box-shadow:none;
}
.data-card button,
.site-page button,
.workflow-page button,
.site-filterbar label{
  border-color:#d7e1ec;
  border-radius:4px;
  box-shadow:none;
}
.dense-table thead th{background:#f2f7fc}

/* The seven GSC cards use one content grid. Value size may no longer move the
   note line; every label, value and note now shares the same baseline. */
.gsc-kpis .data-kpi{border-radius:4px}
.gsc-kpis .data-kpi>strong,
.gsc-kpis .data-kpi:first-child>strong{
  height:36px;
  margin-top:5px;
  font-size:29px;
  line-height:36px;
}
.gsc-kpis .data-kpi>p{margin-top:7px}
.gsc-kpis .data-kpi.success{border-color:#c8e5d7;background:#f3fbf7}
.gsc-kpis .data-kpi.blue{border-color:#cbdcf1;background:#f2f8fe}
.gsc-kpis .data-kpi.warning{border-color:#ead7b5;background:#fdfbf3}
.gsc-kpis .data-kpi.danger{border-color:#edc9ca;background:#fff2f1}
.gsc-trend-card,.gsc-compare{background:#f2f8fe}
.gsc-chart-wrap{background:#f4f9fe}
.gsc-mid .data-card{background:#fdfdfe}
.gsc-bottom .data-kpi{background:rgba(255,255,255,.58)}

/* The source uses softly tinted document surfaces rather than one large,
   glossy white sheet. */
.site-workspace,.workflow-workspace{background:#fbfcfe}
.site-workspace .data-card,
.site-workspace .site-filterbar,
.site-workspace .site-table,
.site-workspace .site-drawer{background:#fdfefe}
.workflow-workspace .issue-detail{background:#fbfcfe}
.workflow-workspace .work-queue,
.workflow-workspace .seo-task-board,
.workflow-workspace .task-batches article,
.workflow-workspace .issue-detail>section,
.workflow-workspace .issue-columns>section,
.workflow-workspace .owner-card{background:#fdfdfe}

/* QA capture uses a narrow browser viewport. Keep desktop source rules. */
html.qa-capture .app-shell{grid-template-columns:160px minmax(0,1fr)}
html.qa-capture .sidebar{padding-left:8px;padding-right:8px}
html.qa-capture .topbar{height:50px;min-height:50px;gap:16px;padding:0 18px;flex-wrap:nowrap}
html.qa-capture .topbar h1{font-size:18px}
html.qa-capture .top-actions .date-pill{display:inline-flex}
html.qa-capture.qa-fit{zoom:var(--qa-fit-scale)}
html.qa-capture.qa-fit .sidebar{height:var(--qa-logical-height);min-height:var(--qa-logical-height);position:relative}
html.qa-capture.qa-frame,
html.qa-capture.qa-frame body,
html.qa-capture.qa-frame #app{width:var(--qa-frame-width);min-width:var(--qa-frame-width);max-width:var(--qa-frame-width);height:var(--qa-frame-height);min-height:var(--qa-frame-height);overflow:hidden}
html.qa-capture.qa-frame .app-shell{width:var(--qa-logical-width);min-width:var(--qa-logical-width);height:var(--qa-logical-height);min-height:var(--qa-logical-height);transform:scale(var(--qa-frame-scale-x),var(--qa-frame-scale-y));transform-origin:0 0}
html.qa-capture.qa-frame .sidebar{height:var(--qa-logical-height);min-height:var(--qa-logical-height);position:relative}

/* The supplied references are desktop screens. Keep that desktop composition
   in the narrow in-app review viewport instead of mixing mobile and desktop rules. */
@media (max-width:820px){
  html,body{width:1487px;min-width:1487px}
  .app-shell{display:grid;width:1487px;min-width:1487px;grid-template-columns:160px 1327px}
  .app-shell:has(.overview-body){grid-template-columns:172px 1315px}
  .app-shell:has(.gsc-page){width:1484px;min-width:1484px;grid-template-columns:160px 1324px}
  .app-shell:has(.site-page){grid-template-columns:162px 1325px}
  .app-shell:has(.workflow-workspace){grid-template-columns:165px 1322px}
  .sidebar{position:sticky;left:auto;width:auto;transition:none}
  .mobile-menu{display:none}
  .topbar{height:50px;min-height:50px;flex-wrap:nowrap;padding:0 18px;gap:16px}
  .topbar h1{width:auto;white-space:nowrap}
  .scope-tabs{order:0;width:auto}
  .scope-tabs button{flex:none}
  .top-actions{width:auto}
  .top-actions>button{flex:none;justify-content:center}
}
