*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#1a1a1f;--bg-2:#1e1e25;--panel:#23232b;--card:#272730;--card-h:#2e2e38;
  --border:#33333f;--border-s:#44445a;
  --fg:#f0f0f5;--fg-2:#c8c8d4;--muted:#8a8a9a;--muted-2:#6a6a7a;
  --accent:#e8853a;--accent-s:rgba(232,133,58,.15);
  --success:#4ecca3;--success-s:rgba(78,204,163,.14);
  --warning:#e8c44a;--warning-s:rgba(232,196,74,.14);
  --danger:#e85a5a;--danger-s:rgba(232,90,90,.14);
  --info:#5a9ce8;--info-s:rgba(90,156,232,.14);
  --radius:8px;--radius-l:12px;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

/* Light theme: same tokens, daytime values. Applied via [data-theme="light"]. */
:root[data-theme="light"]{
  --bg:#f5f6f8;--bg-2:#eef0f3;--panel:#ffffff;--card:#ffffff;--card-h:#f4f6f9;
  --border:#d9dde3;--border-s:#c4cad3;
  --fg:#1c2126;--fg-2:#3a4148;--muted:#6b7480;--muted-2:#8a93a0;
  --accent:#c96a1f;--accent-s:rgba(201,106,31,.12);
  --success:#188a63;--success-s:rgba(24,138,99,.10);
  --warning:#a07d12;--warning-s:rgba(160,125,18,.12);
  --danger:#c23a3a;--danger-s:rgba(194,58,58,.10);
  --info:#2e6fb7;--info-s:rgba(46,111,183,.10);
}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:14px;line-height:1.5;min-height:100vh}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:var(--mono);font-size:.9em}
.muted{color:var(--muted)}
.small{font-size:.82em}
.sha{color:var(--muted-2)}

/* topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:var(--bg-2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.brand{font-size:15px}
.brand strong{color:var(--accent)}
.topbar nav{display:flex;gap:18px}
.topbar nav a{color:var(--fg-2);font-weight:500}
.topbar nav a:hover{color:var(--fg)}

/* layout */
.container{max-width:1100px;margin:0 auto;padding:28px}
h1{font-size:22px;font-weight:600;margin-bottom:18px}
h2{font-size:17px;font-weight:600;margin:28px 0 12px}
h3{font-size:15px;font-weight:600;margin-bottom:10px;color:var(--fg-2)}

/* stat row */
.stat-row{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap;align-items:center}

/* stats metric cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:22px}
.card-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-l);padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-height:92px}
.card-num{font-size:24px;font-weight:600;font-family:var(--mono);line-height:1.2}
.card-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.card-sub{font-size:12px;color:var(--muted)}
.card-center{margin-top:auto}
.card-verdict{grid-column:span 2;justify-content:center}
@media (max-width:720px){.card-verdict{grid-column:span 1}}

/* verdict donut + daily trend (server-rendered SVG; colors via CSS vars) */
.donut-wrap{display:flex;gap:14px;align-items:center}
.donut{width:84px;height:84px;flex:none}
.seg-track{stroke:var(--bg-2)}
.seg-success{stroke:var(--success)}
.seg-warning{stroke:var(--warning)}
.seg-danger{stroke:var(--danger)}
.seg-muted{stroke:var(--muted)}
.donut-center{font-size:12px;font-weight:600;fill:var(--fg);font-family:var(--mono)}
.donut-legend{list-style:none;font-size:12px;display:flex;flex-direction:column;gap:2px}
.donut-legend .muted{color:var(--muted-2);font-family:var(--mono)}
.dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:baseline}
/* trend chart: ECharts canvas host (see static/charts.js); fixed height so
   layout is stable before the canvas initializes */
.trend{width:100%;height:280px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-l)}
/* repo comparison chart host: height is sized per repo count by charts.js */
.repobar{width:100%;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-l);margin-bottom:18px}
/* metric chips (#265): trend + repo charts' metric switch */
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 8px}
.chip{padding:2px 10px;border-radius:99px;font-size:11px;font-family:var(--mono);background:var(--bg-2);color:var(--muted);border:1px solid var(--border);cursor:pointer}
.chip:hover{color:var(--fg);border-color:var(--border-s)}
.chip-active{background:var(--accent-s);color:var(--accent);border-color:transparent}

/* stats filter form (repo dropdown + days links row) */
.stats-filter{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.stats-filter select,.stats-filter button{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;font-size:12px;color:var(--fg-2);font-family:var(--mono)}
.stats-filter button{cursor:pointer}
.stats-filter button:hover{border-color:var(--border-s)}
a.badge{text-decoration:none}

/* badges */
.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:500;font-family:var(--mono)}
.badge-queued{background:var(--info-s);color:var(--info)}
.badge-running{background:var(--warning-s);color:var(--warning)}
.badge-done{background:var(--success-s);color:var(--success)}
.badge-failed{background:var(--danger-s);color:var(--danger)}
.badge-stopped{background:var(--bg-2);color:var(--muted)}
.badge-forge{background:var(--bg-2);color:var(--muted);border:1px solid var(--border);font-size:11px;vertical-align:middle;margin-left:6px}
/* index status-filter badges (issue #58): the active filter gets an outline
   ring; link badges respond to hover like buttons */
a.badge:hover{outline:1px solid var(--border-s)}
.badge-active{outline:2px solid currentColor;outline-offset:1px}

/* table */
table.reviews{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-l);overflow:hidden}
/* 宽表小屏兜底(#244):窄屏下表格在容器内横向滚动;桌面表格不溢出,此规则无感 */
.table-wrap{overflow-x:auto}
.reviews th,.reviews td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--border);font-size:13px}
.reviews th{background:var(--bg-2);color:var(--muted);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.reviews tbody tr:last-child td{border-bottom:none}
.reviews tbody tr:hover{background:var(--card-h)}
.reviews tbody tr.row-running{background:var(--warning-s)}
.reviews tbody tr.row-failed{background:rgba(232,90,90,.05)}

/* index pagination strip */
.pagination{display:flex;gap:6px;justify-content:center;align-items:center;flex-wrap:wrap;margin:20px 0 0}
.page-btn{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:28px;padding:0 9px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--fg-2);font-family:var(--mono);font-size:12px}
a.page-btn:hover{border-color:var(--border-s);color:var(--fg);text-decoration:none}
.page-active{background:var(--accent-s);border-color:var(--accent);color:var(--accent);font-weight:600}
.page-disabled{opacity:.4}

/* index search box (issue #57) */
.search{display:flex;align-items:center;gap:.4rem;margin:0 0 18px}
.search input[type=search]{flex:0 1 22rem;padding:7px 11px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--fg);font-size:13px;font-family:var(--sans)}
.search input[type=search]:focus{outline:none;border-color:var(--accent)}
.search select{padding:7px 8px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--fg-2);font-size:12px;font-family:var(--sans);max-width:11rem}
.search select:hover{border-color:var(--border-s)}
.search button{margin-left:2px}
.search-clear{color:var(--muted);text-decoration:none;font-size:14px;line-height:1;padding:4px}
.search-clear:hover{color:var(--fg)}
.page-dots{color:var(--muted-2);padding:0 2px}

/* cards */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-l);padding:18px;margin-bottom:16px}
.card-error{border-color:var(--danger)}
.verdict{white-space:pre-wrap;font-family:var(--mono);font-size:13px;line-height:1.6;color:var(--fg)}
.posted{margin-top:12px;font-size:12px;color:var(--muted)}
.raw{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px;font-family:var(--mono);font-size:12px;line-height:1.55;white-space:pre-wrap;word-break:break-word;overflow-x:auto;max-height:520px;color:var(--fg-2)}

/* meta */
.detail-meta{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-bottom:22px}
.meta-item{font-size:13px;color:var(--muted)}
.gh-link{font-weight:600}
.empty{color:var(--muted);padding:32px 0;text-align:center}

/* Theme toggle button */
.theme-toggle{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:4px 10px;cursor:pointer;font-size:14px;line-height:1;margin-left:6px}
.theme-toggle:hover{border-color:var(--border-s)}

/* Rendered markdown inside review cards */
.md{white-space:normal;font-family:var(--sans);font-size:13.5px}
.md :is(h1,h2,h3){margin:12px 0 6px;color:var(--fg)}
.md h3{font-size:15px}
.md p{margin:8px 0}
.md ul,.md ol{margin:8px 0;padding-left:22px}
.md li{margin:4px 0}
.md code{font-family:var(--mono);font-size:.88em;background:var(--bg-2);border:1px solid var(--border);border-radius:4px;padding:1px 5px}
.md pre{background:var(--bg-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;overflow-x:auto}
.md pre code{background:none;border:none;padding:0}
.md blockquote{border-left:3px solid var(--border-s);margin:8px 0;padding:2px 12px;color:var(--muted)}
.md hr{border:none;border-top:1px solid var(--border);margin:12px 0}
.md a{color:var(--accent)}
.md table{border-collapse:collapse;margin:8px 0}
.md th,.md td{border:1px solid var(--border);padding:4px 10px;font-size:13px}

/* Team reviewer rows: one full-width row per persona — state stripe +
   status chip + one-line excerpt on the collapsed summary, so a scan tells
   OK from BLOCKING without expanding and heights never fight in a grid. */
.reviewers-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.reviewers-head h3{margin:0}
.reviewers-head h3 .count{color:var(--muted-2);font-weight:400;font-family:var(--mono);font-size:.85em}
.summary-chips{display:flex;gap:6px;flex-wrap:wrap}
.schip{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:2px 9px;border-radius:99px;background:var(--bg-2);color:var(--fg-2);border:1px solid var(--border)}
.schip b{font-family:var(--mono);font-weight:600}
.schip.ok b{color:var(--success)} .schip.warn b{color:var(--warning)}
.schip.issue b{color:var(--danger)} .schip.failed b{color:var(--muted)}
.schip.empty b{color:var(--muted-2)}
.head-actions{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.fbtn{font-size:12px;padding:4px 11px;border-radius:99px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer}
.fbtn:hover{color:var(--fg);border-color:var(--border-s)}
.fbtn.on{background:var(--accent-s);border-color:var(--accent);color:var(--accent)}
.abtn{font-size:12px;padding:4px 11px;border-radius:6px;border:1px solid var(--border);background:var(--card);color:var(--fg-2);cursor:pointer}
.abtn:hover{background:var(--card-h);color:var(--fg)}

.personas{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.persona{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-l);border-left:3px solid var(--border);overflow:hidden}
.persona[data-state="ok"]{border-left-color:var(--success)}
.persona[data-state="warn"]{border-left-color:var(--warning)}
.persona[data-state="issue"]{border-left-color:var(--danger)}
.persona[data-state="failed"]{border-left-color:var(--muted)}
.persona[data-state="empty"]{border-left-color:var(--border);opacity:.85}
.persona.hide{display:none}
.persona summary{list-style:none;display:flex;align-items:center;gap:12px;padding:11px 16px;cursor:pointer;user-select:none}
.persona summary::-webkit-details-marker{display:none}
.persona summary:hover{background:var(--card-h)}
.p-badge{flex:none;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:6px;background:var(--accent-s);color:var(--accent)}
.persona[data-state="ok"] .p-badge{background:var(--success-s);color:var(--success)}
.persona[data-state="warn"] .p-badge{background:var(--warning-s);color:var(--warning)}
.persona[data-state="issue"] .p-badge{background:var(--danger-s);color:var(--danger)}
.persona[data-state="failed"] .p-badge{background:var(--bg-2);color:var(--muted)}
.persona[data-state="empty"] .p-badge{background:var(--bg-2);color:var(--muted-2)}
.p-status{flex:none;display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:2px 9px;border-radius:99px}
.p-status.ok{background:var(--success-s);color:var(--success)}
.p-status.warn{background:var(--warning-s);color:var(--warning)}
.p-status.issue{background:var(--danger-s);color:var(--danger)}
.p-status.failed{background:var(--bg-2);color:var(--muted)}
.p-status.empty{background:transparent;border:1px dashed var(--border-s);color:var(--muted-2);font-weight:400}
.p-excerpt{flex:1;min-width:0;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-chev{flex:none;width:16px;height:16px;color:var(--muted-2);transition:transform .18s}
.persona[open] .p-chev{transform:rotate(180deg)}
.p-body{border-top:1px solid var(--border);padding:14px 18px 16px}
.p-body .conclusion{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--fg);background:var(--bg-2);border:1px solid var(--border);border-radius:8px;padding:8px 12px;margin-bottom:10px}
.conclusion .dot{width:8px;height:8px;border-radius:50%;flex:none;margin-right:0}
.conclusion.ok .dot{background:var(--success)} .conclusion.warn .dot{background:var(--warning)}
.conclusion.issue .dot{background:var(--danger)} .conclusion.failed .dot{background:var(--muted)}
.p-empty-note{font-size:13px;color:var(--muted-2);padding:4px 2px}
.p-md{line-height:1.7;color:var(--fg-2);max-width:78ch}
.p-md code{padding:.1em .4em}
/* file:line references (JS-tagged) get an accent pill so paths scan fast */
.p-md code.file{background:var(--accent-s);border-color:transparent;color:var(--accent);white-space:nowrap}
.meta-line{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px dashed var(--border);font-size:12px;color:var(--muted-2)}

/* stats: consumption bar (width set inline per row) */
.reviews td.bar-cell{width:20%;}
.tokens-bar{height:8px;background:var(--accent);border-radius:4px;min-width:0;opacity:.85;}
.row-empty td{opacity:.45;}

/* manual stop/retry buttons (#74/#92): semantic tints so the destructive stop
   (danger red) and the rerun retry (info blue) are told apart at a glance,
   same soft-bg + colored-text language as the status badges */
.stop-btn{border:1px solid transparent;background:var(--danger-s);color:var(--danger);
  font-size:12px;padding:2px 8px;border-radius:6px;cursor:pointer}
.stop-btn:hover{border-color:var(--danger)}
.retry-btn{border:1px solid transparent;background:var(--info-s);color:var(--info);
  font-size:12px;padding:2px 8px;border-radius:6px;cursor:pointer}
.retry-btn:hover{border-color:var(--info)}
/* 登录体系 (#208):topbar 登出按钮 + 登录卡片 */
.logout-btn{border:1px solid var(--border);background:none;color:var(--fg-2);
  font-size:12px;padding:3px 10px;border-radius:6px;cursor:pointer}
.logout-btn:hover{color:var(--fg);border-color:var(--border-s)}
.login-wrap{display:flex;justify-content:center}
.login-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-l);
  padding:28px 32px;width:min(360px,100%)}
.login-card h1{font-size:18px;margin-bottom:16px}
.login-form{display:flex;flex-direction:column;gap:6px}
.login-form label{font-size:12px;color:var(--fg-2);margin-top:6px}
.login-form input{padding:8px 10px;background:var(--bg);border:1px solid var(--border);
  border-radius:var(--radius);color:var(--fg);font-size:14px;font-family:var(--sans)}
.login-form input:focus{outline:none;border-color:var(--accent)}
.login-form button{margin-top:14px;padding:8px 10px;background:var(--accent);border:none;
  border-radius:var(--radius);color:#fff;font-weight:600;cursor:pointer}
.login-error{background:var(--danger-s);color:var(--danger);border-radius:6px;
  padding:6px 10px;font-size:13px;margin-bottom:12px}
/* version footer (#98): quiet, centered, on every page */
.site-footer {
  margin-top: 2rem;
  padding: 0.6rem 0 0.8rem;
  border-top: 1px solid var(--border);
  text-align: center;
  font-size: 0.78rem;
  color: var(--muted-2);
}

/* footer source link (#128): quiet — inherits the footer's muted tone,
   tints + underlines on hover so it reads as a link only on approach */
a.footer-link {
  color: var(--muted-2);
  text-decoration: none;
}
a.footer-link:hover {
  color: var(--fg-2);
  text-decoration: underline;
}

/* 执行日志 (#25): bounded, scrollable, pinned to the bottom while live.
   折叠化:运行/排队时展开跟日志,出结果后收起让位给评审结果;
   summary 复用 persona 折叠行的手感(hover 底色 + 旋转 chevron)。 */
.runlog {
  max-height: 320px;
  overflow-y: auto;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
}
.runlog-card{padding:0;overflow:hidden}
.runlog-card summary{list-style:none;display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;user-select:none}
.runlog-card summary::-webkit-details-marker{display:none}
.runlog-card summary:hover{background:var(--card-h)}
.runlog-card summary h3{flex:1;margin:0}
.runlog-card[open] .p-chev{transform:rotate(180deg)}
.runlog-card .runlog{margin:0 18px 18px}

/* 行尾动作区 (#112): details / stop / retry 同列 button,不再挤占状态列;
   details 保持 quiet,stop/retry 加语义色 modifier(危险红/信息蓝)以便区分 */
.row-actions{white-space:nowrap;text-align:right}
.row-form{display:inline;margin:0}
.row-btn{display:inline-block;border:1px solid var(--border);background:var(--card);color:var(--fg-2);
	padding:1px 8px;border-radius:6px;font-size:12px;line-height:1.6;text-decoration:none;cursor:pointer}
.row-btn:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.row-btn-stop{border-color:transparent;background:var(--danger-s);color:var(--danger)}
.row-btn-stop:hover{border-color:var(--danger);color:var(--danger)}
.row-btn-retry{border-color:transparent;background:var(--info-s);color:var(--info)}
.row-btn-retry:hover{border-color:var(--info);color:var(--info)}

/* config 页重排(#):开关卡片是页面焦点——大状态徽标 + 开启时 accent 描边;
   长说明压成一行 cfg-note,env 键值降为底部紧凑条(cfg-env)。 */
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:16px;margin:4px 0 8px}
.cfg-card{margin-bottom:0;display:flex;flex-direction:column;gap:10px;border-left:3px solid transparent}
.cfg-card-on{border-left-color:var(--accent)}
.cfg-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cfg-card-head h2{margin:0;font-size:18px}
.cfg-desc{color:var(--fg-2);font-size:13px}
.cfg-form{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:auto}
.cfg-check{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;cursor:pointer}
.cfg-check input{width:17px;height:17px;accent-color:var(--accent);cursor:pointer}
.cfg-select{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--fg-2)}
.cfg-select select{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:5px 10px;color:var(--fg);font-family:var(--mono);font-size:13px}
.cfg-select select:hover{border-color:var(--border-s)}
.cfg-save{margin-left:auto;padding:6px 18px;border:1px solid var(--accent);border-radius:8px;background:var(--accent-s);color:var(--accent);font-size:13px;font-weight:600;cursor:pointer}
.cfg-save:hover{background:var(--accent);color:#fff}
.cfg-check input:focus-visible,.cfg-select select:focus-visible,.cfg-save:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cfg-note{margin:0;font-size:12px;color:var(--muted-2)}
.cfg-env{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-l);padding:14px 18px;margin-bottom:10px}
.cfg-env-item{display:flex;flex-direction:column;gap:2px;min-width:0}
.cfg-env-k{font-size:11px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.05em}
.cfg-env-v{font-size:14px;color:var(--fg-2);word-break:break-all}

/* ===== 响应式断点规范(#244) =====
   全站两档:≤720px 窄屏(平板竖屏/分屏)——导航与筛选栏换行堆叠、留白收紧;
   ≤430px 手机——更紧的留白与字号、长串可断行。只做布局降级(换行/堆叠/
   容器内滚动),不改交互行为;宽表的横向滚动由 .table-wrap 提供。 */
@media (max-width:720px){
  .topbar{flex-wrap:wrap;gap:10px 16px;padding:12px 16px}
  .topbar nav{flex-wrap:wrap;gap:10px 16px}
  .container{padding:18px 16px}
  .search{flex-wrap:wrap}
  .search input[type=search]{flex:1 1 100%}
  .reviews th,.reviews td{padding:9px 10px}
  .md{overflow-x:auto}
}
@media (max-width:430px){
  .container{padding:14px 12px}
  h1{font-size:19px;overflow-wrap:anywhere}
  .posted{overflow-wrap:anywhere}
  /* persona 摘要行:徽标/状态/箭头留第一行,截断摘行独占第二行 */
  .persona summary{flex-wrap:wrap}
  .p-excerpt{order:1;flex-basis:100%}
}
