/* 公司支付台 — 值班台式后台：异常先行，数字对齐，安静的其余部分。
   CSP 禁止脚本、内联样式和外部字体，所有样式只在这个文件里。 */

:root {
  --bg: #f5f5f3;
  --surface: #ffffff;
  --ink: #17191d;
  --ink-2: #464b55;
  --ink-3: #686e79;
  --line: #e2e2de;
  --line-2: #eeeeeb;
  --hover: #f9f9f7;

  --ok: #157a3c;
  --ok-bg: #e9f5ed;
  --wait: #8a5a00;
  --wait-bg: #fbf3df;
  --alert: #b93a12;
  --alert-bg: #fdefe8;
  --alert-line: #f2c9b6;
  --on-alert: #ffffff;
  --off: #6b7079;
  --off-bg: #efefec;
  --pay: #1677ff;
  --pay-hover: #0f63d6;
  --focus: #1677ff;

  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Segoe UI", sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --radius: 8px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #111214;
    --surface: #18191c;
    --ink: #ececea;
    --ink-2: #c3c5c9;
    --ink-3: #969aa2;
    --line: #2c2e33;
    --line-2: #232529;
    --hover: #1e1f23;
    --ok: #5fcf8a;
    --ok-bg: #16291e;
    --wait: #e6b450;
    --wait-bg: #2d2513;
    --alert: #ff8a63;
    --alert-bg: #321b13;
    --alert-line: #5a2c1d;
    --on-alert: #2a1209;
    --off: #9a9ea6;
    --off-bg: #25272b;
    --pay: #3d8bff;
    --pay-hover: #5a9cff;
    --focus: #5a9cff;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
.card.integration-document { line-height: 1.8; padding: 32px; overflow-wrap: anywhere; }
.integration-document h1 { font-size: 24px; }
.integration-document h2 { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line); }
.integration-document h3 { margin-top: 24px; }
.integration-document pre { padding: 18px; overflow-x: auto; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); line-height: 1.6; white-space: pre; overflow-wrap: normal; }
.integration-document code { font-family: var(--mono); font-size: .9em; }
.integration-document table { display: block; overflow-x: auto; margin: 20px 0; }
.integration-document th, .integration-document td { white-space: normal; min-width: 120px; }
@media (max-width: 640px) { .card.integration-document { padding: 18px; } }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 14px/1.6 var(--sans);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration-color: var(--line); text-underline-offset: 3px; }
a:hover { text-decoration-color: currentColor; }
h1, h2 { margin: 0; font-weight: 650; letter-spacing: -0.01em; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 3px; }
.num { font-variant-numeric: tabular-nums; }
.mono { font-family: var(--mono); font-size: 0.92em; letter-spacing: 0; }
.url { overflow-wrap: anywhere; }
.line { display: block; }
.dim { color: var(--ink-3); }
.r { text-align: right; }
.small { font-size: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 24px; }

/* ---------- 顶栏 ---------- */
.topbar { background: var(--surface); border-bottom: 1px solid var(--line); }
.topbar-inner { display: flex; align-items: stretch; gap: 32px; min-height: 56px; }
.wordmark { display: flex; align-items: center; font-weight: 700; font-size: 15px; letter-spacing: 0.02em; text-decoration: none; }
.mainnav { display: flex; gap: 4px; flex: 1; min-width: 0; overflow-x: auto; }
.mainnav a {
  display: flex; align-items: center; flex-shrink: 0; white-space: nowrap; padding: 0 12px; color: var(--ink-3);
  text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.mainnav a:hover { color: var(--ink); }
.mainnav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); font-weight: 600; }
.system-version { align-self: center; flex-shrink: 0; color: var(--ink-3); font: 12px/1 var(--mono); white-space: nowrap; }
.logout { display: flex; align-items: center; margin: 0 0 0 auto; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 0 14px; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--surface); color: var(--ink); font: inherit; font-weight: 550;
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.btn:hover { background: var(--hover); border-color: var(--ink-3); }
.btn-primary { background: var(--ink); border-color: var(--ink); color: var(--surface); }
.btn-primary:hover { background: var(--ink-2); border-color: var(--ink-2); }
.btn-pay { background: var(--pay); border-color: var(--pay); color: #fff; }
.btn-pay:hover { background: var(--pay-hover); border-color: var(--pay-hover); }
.btn-block { display: flex; width: 100%; }
.btn-lg { min-height: 48px; font-size: 16px; }
.linkbtn {
  background: none; border: 0; padding: 8px 0; min-height: 36px; font: inherit; color: var(--ink-3);
  cursor: pointer; text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px;
}
.linkbtn:hover { color: var(--ink); text-decoration-color: currentColor; }

/* ---------- 页面结构 ---------- */
.main { padding-top: 32px; padding-bottom: 64px; }
.pagehead { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; margin-bottom: 24px; }
.pagehead h1 { font-size: 24px; line-height: 1.3; }
.sub { color: var(--ink-3); font-size: 13px; margin-top: 4px; max-width: 46em; }
.pagehead-tools { display: flex; gap: 8px; flex-wrap: wrap; }
.sitepick { display: flex; gap: 8px; margin: 0; }
select, input {
  font: inherit; color: var(--ink); background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius); min-height: 36px; padding: 0 10px;
}
select { padding-right: 28px; }
input:hover, select:hover { border-color: var(--ink-3); }

.flash { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 10px 14px; margin-bottom: 20px; }
.flash-alert { border-color: var(--alert-line); background: var(--alert-bg); color: var(--alert); }

/* ---------- 状态标签 ---------- */
.pill {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  font-size: 12px; font-weight: 600; line-height: 1; padding: 5px 8px; border-radius: 999px;
  background: var(--off-bg); color: var(--off);
}
.pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pill-ok { background: var(--ok-bg); color: var(--ok); }
.pill-wait { background: var(--wait-bg); color: var(--wait); }
.pill-alert { background: var(--alert); color: var(--on-alert); }
.pill-alert::before { background: var(--on-alert); }
.tries { margin-left: 8px; font-size: 12px; color: var(--alert); font-variant-numeric: tabular-nums; }

/* ---------- 需要处理 ---------- */
.duty { border: 1px solid var(--alert-line); background: var(--surface); border-radius: var(--radius); margin-bottom: 24px; overflow: hidden; }
.duty-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; background: var(--alert-bg); border-bottom: 1px solid var(--alert-line); }
.duty-head h2 { font-size: 15px; color: var(--alert); display: flex; align-items: center; gap: 8px; }
.duty-count { font-size: 12px; background: var(--alert); color: var(--on-alert); border-radius: 999px; padding: 1px 8px; font-variant-numeric: tabular-nums; }
.duty-head a { font-size: 13px; color: var(--alert); }
.issues { list-style: none; margin: 0; padding: 0; }
.issues li + li { border-top: 1px solid var(--line-2); }
.issue {
  display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto auto; align-items: center; gap: 16px;
  padding: 12px 16px; text-decoration: none;
}
.issue:hover { background: var(--hover); }
.issue .pill { justify-self: start; }
.issue-main { min-width: 0; display: flex; flex-direction: column; }
.issue-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.issue-why { color: var(--ink-3); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.issue-site { color: var(--ink-2); font-size: 13px; white-space: nowrap; }
.issue-amt { font-weight: 600; white-space: nowrap; }
.issue-go { color: var(--alert); font-weight: 600; font-size: 13px; white-space: nowrap; }

.allclear {
  display: flex; align-items: center; gap: 10px; margin-bottom: 24px; padding: 12px 16px;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--ink-2);
}
.allclear svg { width: 18px; height: 18px; color: var(--ok); flex: none; }

/* ---------- 账面数字 ---------- */
.stats-scope { margin-bottom: 8px; font-size: 12px; color: var(--ink-3); }
.ledger { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ledger > div { padding: 14px 20px 16px; }
.ledger > div:first-child { padding-left: 0; }
.ledger > div + div { border-left: 1px solid var(--line); }
.ledger dt { font-size: 13px; color: var(--ink-3); }
.ledger dd { margin: 0; }
.ledger dd.num { font-size: 26px; font-weight: 650; letter-spacing: -0.02em; line-height: 1.3; margin-top: 2px; }
.ledger .unit { font-size: 13px; font-weight: 500; color: var(--ink-3); margin-left: 3px; letter-spacing: 0; }
.ledger-note { font-size: 12px; color: var(--ink-3); }
.ledger-alert dt, .ledger-alert dd.num { color: var(--alert); }

/* ---------- 列表 ---------- */
.order-search { margin: 0 0 20px; }
.order-search > label { display: block; font-weight: 600; margin-bottom: 6px; }
.search-controls { display: flex; flex-wrap: wrap; gap: 8px; }
.search-controls input { flex: 1 1 280px; min-width: 0; min-height: 44px; }
.search-controls .btn { min-height: 44px; }
.order-search p { margin-top: 6px; color: var(--ink-3); font-size: 12px; }

.listing { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.tabs { display: flex; gap: 4px; padding: 0 12px; border-bottom: 1px solid var(--line); overflow-x: auto; }
.tabs a {
  display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; min-height: 44px; white-space: nowrap;
  color: var(--ink-3); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.tabs a:hover { color: var(--ink); }
.tabs a[aria-current="page"] { color: var(--ink); font-weight: 600; border-bottom-color: var(--ink); }
.tab-count { font-size: 11px; font-weight: 700; background: var(--alert); color: var(--on-alert); border-radius: 999px; padding: 1px 6px; font-variant-numeric: tabular-nums; }

.orders { width: 100%; border-collapse: collapse; }
.orders th {
  text-align: left; font-size: 12px; font-weight: 500; color: var(--ink-3);
  padding: 10px 16px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.orders th.r { text-align: right; }
.orders td { padding: 10px 16px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.orders tbody tr:last-child td { border-bottom: 0; }
.orders tbody tr:hover { background: var(--hover); }
.orders tr.tone-alert { background: var(--alert-bg); }
.orders tr.tone-alert:hover { background: var(--alert-bg); }
.c-time { color: var(--ink-3); white-space: nowrap; width: 1%; }
.c-item a { font-weight: 550; text-decoration: none; }
.c-item a:hover { text-decoration: underline; }
.c-item .mono { display: block; overflow-wrap: anywhere; color: var(--ink-3); font-size: 12px; }
.c-site { color: var(--ink-2); white-space: nowrap; }
.c-amt { font-weight: 600; white-space: nowrap; }
.c-state { white-space: nowrap; width: 1%; }

.empty { padding: 56px 16px; text-align: center; color: var(--ink-3); }
.empty a { display: inline-block; margin-top: 8px; color: var(--ink); }
.pager { display: flex; justify-content: space-between; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 13px; }
.pager a { text-decoration: none; padding: 6px 0; }
.pager a:hover { text-decoration: underline; }
.pager-at { color: var(--ink-3); }

/* ---------- 订单详情 ---------- */
.back { display: inline-block; color: var(--ink-3); text-decoration: none; font-size: 13px; margin-bottom: 16px; }
.back:hover { color: var(--ink); }
.orderhead { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--line); }
.orderhead .sub { margin: 0 0 4px; }
.orderhead h1 { font-size: 24px; line-height: 1.35; }
.orderhead-amt { display: flex; align-items: center; gap: 12px; }
.big { font-size: 30px; font-weight: 650; letter-spacing: -0.02em; line-height: 1; }

.callout { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 16px 20px; margin-bottom: 20px; }
.callout h2 { font-size: 15px; margin-bottom: 4px; }
.callout p { color: var(--ink-2); max-width: 62em; overflow-wrap: anywhere; }
.callout-alert { border-color: var(--alert-line); background: var(--alert-bg); }
.callout-alert h2 { color: var(--alert); }
.callout-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.callout-actions form { margin: 0; }

.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.facts section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 20px 8px; }
.facts h2 { font-size: 14px; margin-bottom: 4px; }
.facts dl { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); margin: 0; }
.facts dt, .facts dd { padding: 9px 0; border-top: 1px solid var(--line-2); }
.facts dl > :nth-child(1), .facts dl > :nth-child(2) { border-top: 0; }
.facts dt { color: var(--ink-3); font-size: 13px; }
.facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.quiet-action { margin: 4px 0 8px; }
.footnote { color: var(--ink-3); font-size: 12px; margin-top: 16px; }

/* ---------- 网站与应用 ---------- */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 20px 18px; margin-bottom: 16px; }
.card-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.card-head h2 { font-size: 16px; }
.card-link { margin-left: auto; font-size: 13px; color: var(--ink-2); }
.tag { font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 4px; border: 1px solid var(--line); color: var(--ink-2); }
.tag-live { background: var(--ink); border-color: var(--ink); color: var(--surface); }
.tag-sandbox { background: var(--wait-bg); border-color: transparent; color: var(--wait); }
.grid-dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px 24px; margin: 0; }
.grid-dl dt { font-size: 12px; color: var(--ink-3); }
.grid-dl dd { margin: 2px 0 0; overflow-wrap: anywhere; }
.span-all { grid-column: 1 / -1; }

/* ---------- 登录 ---------- */
.login { max-width: 360px; margin: 48px auto 0; }
.login h1 { font-size: 22px; }
.hint { color: var(--ink-3); margin-top: 6px; }
.hint.small { margin-top: 20px; }
.form { display: grid; gap: 16px; margin-top: 24px; }
.field { display: grid; gap: 6px; font-size: 13px; font-weight: 550; color: var(--ink-2); }
.field input { min-height: 44px; padding: 0 12px; font-size: 15px; font-weight: 400; }
.otp { font-family: var(--mono); letter-spacing: 0.3em; }
.form .btn { margin-top: 4px; min-height: 44px; }

/* ---------- 用户付款页 ---------- */
.paybody { background: var(--bg); }
.pay { max-width: 420px; margin: 0 auto; padding: 48px 16px 40px; }
.pay-merchant { text-align: center; font-weight: 650; font-size: 16px; margin-bottom: 16px; }
.pay-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 28px 24px 24px; }
.pay-label { text-align: center; color: var(--ink-3); font-size: 13px; }
.pay-amount { text-align: center; font-size: 40px; font-weight: 650; letter-spacing: -0.02em; line-height: 1.2; margin: 4px 0 20px; }
.pay-facts { display: grid; grid-template-columns: 4em minmax(0, 1fr); margin: 0 0 24px; border-top: 1px solid var(--line-2); }
.pay-facts dt, .pay-facts dd { padding: 10px 0; border-bottom: 1px solid var(--line-2); }
.pay-facts dt { color: var(--ink-3); }
.pay-facts dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
.pay-state { color: var(--ink-2); text-align: center; margin-bottom: 16px; }
.pay-ok { display: flex; justify-content: center; align-items: center; gap: 8px; color: var(--ok); font-weight: 600; font-size: 16px; }
.pay-ok svg { width: 20px; height: 20px; }
.pay-refresh { display: block; text-align: center; margin-top: 14px; padding: 8px; color: var(--ink-2); font-size: 14px; }
.pay-foot { color: var(--ink-3); font-size: 12px; text-align: center; margin-top: 16px; padding: 0 8px; }

/* ---------- 窄屏 ---------- */
@media (max-width: 860px) {
  .issue { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "pill main amt" "pill main go"; row-gap: 2px; }
  .issue-status { grid-area: pill; }
  .issue-main { grid-area: main; }
  .issue-amt { grid-area: amt; justify-self: end; }
  .issue-go { grid-area: go; justify-self: end; }
  .issue-site { grid-column: 2; white-space: normal; overflow-wrap: anywhere; }
  .facts { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  .wrap { padding: 0 16px; }
  .topbar-inner { flex-wrap: wrap; gap: 0 16px; }
  .wordmark { min-height: 48px; }
  .mainnav { order: 3; flex-basis: 100%; margin: 0 -12px; overflow-x: auto; }
  .mainnav a { min-height: 44px; white-space: nowrap; flex-shrink: 0; }
  .main { padding-top: 20px; }
  .pagehead { align-items: stretch; flex-direction: column; }
  .pagehead-tools, .sitepick { width: 100%; }
  .sitepick select { flex: 1; min-width: 0; }
  .btn { min-height: 44px; }
  .sitepick, .pagehead-tools > .btn { flex: 1 1 auto; }

  .ledger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ledger > div { padding: 12px 12px 14px 0; }
  .ledger > div + div { border-left: 0; }
  .ledger > div:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--line); }
  .ledger > div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .ledger dd.num { font-size: 22px; }

  .issue { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "pill amt" "main main" "site site"; gap: 6px 12px; }
  .issue-go { display: none; }
  .issue-site { grid-area: site; font-size: 12px; }
  .issue-title, .issue-why { white-space: normal; }

  .orders thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .orders, .orders tbody { display: block; }
  .orders tr {
    display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; column-gap: 12px; row-gap: 4px;
    grid-template-areas: "select item amt" "select site site" "select meta state" "select action action"; padding: 12px 16px; border-bottom: 1px solid var(--line-2);
  }
  .orders tbody tr:last-child { border-bottom: 0; }
  .orders td { display: block; padding: 0; border: 0; width: auto; }
  .c-select { grid-area: select; }
  .c-action { grid-area: action; justify-self: end; }
  .c-item { grid-area: item; min-width: 0; }
  .c-item a { overflow-wrap: anywhere; }
  .c-amt { grid-area: amt; }
  .c-time { grid-area: meta; font-size: 12px; align-self: center; }
  .orders .c-site { grid-area: site; white-space: normal; overflow-wrap: anywhere; font-size: 12px; }
  .c-state { grid-area: state; justify-self: end; }

  .orderhead-amt { width: 100%; justify-content: space-between; }
  .facts dl { grid-template-columns: 6.5em minmax(0, 1fr); }
  .card-link { margin-left: 0; flex-basis: 100%; }
  .pay { padding-top: 28px; }
}

/* 支付宝配置：保留独立页面与原生表单。 */
.setup-form { max-width: 900px; }
.playground-picker { margin-bottom: 16px; flex-wrap: wrap; }
.expiry-setting { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.expiry-setting input[type=number] { width: 110px; }
.playground-form { max-width: none; }
.playground-output h2 { font-size: 16px; margin-bottom: 12px; }
.playground-output .field { margin-top: 12px; }
.playground-output details { margin-top: 12px; }
.playground-output summary { cursor: pointer; color: var(--ink-2); }
.playground-output textarea { margin-top: 6px; }
.setup-form .card > h2 { margin-bottom: 16px; }
.setup-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.setup-form .field { margin-bottom: 12px; }
textarea { width: 100%; resize: vertical; font: 13px/1.6 var(--mono); padding: 10px 12px; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.setup-form input[type=file] { width: 100%; min-width: 0; padding: 8px; }
fieldset { margin: 16px 0 0; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius); }
legend { color: var(--ink-2); padding: 0 5px; }
.check { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 4px 16px 4px 0; }
.check input { min-height: 0; width: 16px; height: 16px; padding: 0; }
.setup-mode { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.setup-mode h3 { margin: 0 0 10px; font-size: 14px; }
.setup-callbacks { display: grid; gap: 6px; }
.setup-callbacks dt { color: var(--ink-3); font-size: 13px; }
.setup-callbacks dd { margin: 0; }
@media(max-width:640px) { .setup-grid { grid-template-columns:minmax(0,1fr); } }

/* Order deletion uses native forms, including external checkbox ownership. */
.order-delete-help { margin: 14px 16px; color: var(--ink-3); font-size: 13px; }
.order-batch { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 0 16px 14px; }
.c-select input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--ink); cursor: pointer; }
.btn-danger { color: #b42318; border-color: #f0b9b1; }
.btn-danger:hover { background: #fff1ee; border-color: #b42318; }
.c-action form { margin: 0; }
.c-action .btn { padding: 5px 12px; min-height: 32px; }

.listing > #order-action-feedback { margin: 14px 16px; }
button:disabled { opacity: .55; cursor: wait; }
#order-batch button:disabled { cursor: default; }
.orders[hidden], #order-batch[hidden], #order-action-feedback[hidden] { display: none; }

[data-account-mode][hidden], [data-account-edit-feedback][hidden] { display: none; }

#alipay-query-result { margin: 28px 0; }
#alipay-query-result > .pagehead { align-items: center; margin-bottom: 12px; }
#alipay-query-result > .pagehead h2 { font-size: 18px; }
#alipay-query-result details { margin: 16px 0 12px; }
#alipay-query-result h3 { font-size: 14px; margin: 16px 0 4px; }
#alipay-query-result .facts dl { grid-template-columns: 11em minmax(0, 1fr); }
#alipay-query-result .facts dt { overflow-wrap: anywhere; padding-right: 12px; }
@media (max-width: 600px) { #alipay-query-result .facts dl { grid-template-columns: 8em minmax(0, 1fr); } }

.c-payment,.c-notification { white-space: nowrap; width: 1%; }
.notification-filter { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:12px 16px; border-bottom:1px solid var(--line); }
.notification-filter select { width:auto; }
.orderhead-amt .payment-status,.orderhead-amt .notification-status { display:flex; gap:8px; align-items:center; font-size:13px; color:var(--ink-3); }
.orderhead-amt { flex-wrap:wrap; }
.listing { overflow-x:auto; }

.issue-status { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }

.login-alternative { margin-top:24px; padding-top:16px; border-top:1px solid var(--border,#ddd); }

/* ---------- 按网站的数据报表 ---------- */
.report-main { max-width: 1600px; }
.report-eyebrow { font-size: 12px; color: var(--ink-3); letter-spacing: .06em; margin-bottom: 8px; }
.report-heading h1 { font-size: 30px; }
.report-heading .sub { max-width: none; }
.report-filters { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 20px 24px; margin-bottom: 24px; }
.report-filters form { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; }
.report-filters label { display: grid; gap: 6px; font-size: 12px; color: var(--ink-3); }
.report-filters label:first-of-type { flex: 1 1 260px; }
.report-filters select, .report-filters input { min-height: 40px; font-size: 14px; min-width: 0; max-width: 100%; }
.report-filters .btn { min-height: 40px; }
.report-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.report-presets a { padding: 5px 12px; border-radius: 6px; font-size: 12px; text-decoration: none; color: var(--ink-2); background: var(--bg); }
.report-presets a[aria-current] { color: var(--surface); background: var(--ink); }
.report-scope { margin-top: 12px; color: var(--ink-3); font-size: 12px; }
.report-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-bottom: 24px; }
.report-metric { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 20px 22px; display: flex; flex-direction: column; min-width: 0; }
.report-metric > p { font-size: 13px; color: var(--ink-3); margin-bottom: 12px; }
.report-metric strong { font-size: clamp(23px,2.3vw,36px); line-height: 1.2; letter-spacing: -.025em; margin-bottom: 12px; overflow-wrap: anywhere; }
.report-metric strong em { font-size: 14px; font-style: normal; color: var(--ink-3); font-weight: normal; }
.report-metric > span, .report-metric > small { color: var(--ink-3); font-size: 12px; line-height: 1.7; }
.report-metric > small { margin-top: auto; padding-top: 8px; }
.report-metric-primary { background: var(--ink); border-color: var(--ink); color: var(--surface); }
.report-metric-primary > p, .report-metric-primary > span, .report-metric-primary > small { color: var(--line); }
.report-metric-alert strong { color: var(--alert); }
.report-panel { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; margin-bottom: 24px; overflow: hidden; min-width: 0; }
.report-panel-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 24px; }
.report-panel-head h2 { font-size: 17px; margin-bottom: 5px; }
.report-panel-head p, .report-note { font-size: 12px; color: var(--ink-3); }
.report-chart-select { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--ink-3); }
.report-chart { display: block; width: 100%; height: auto; max-height: 430px; padding: 0 12px 16px; overflow: visible; }
.report-gridline { stroke: var(--line-2); stroke-width: 1; }
.report-axis { fill: var(--ink-3); font-size: 12px; }
.report-axis-y { text-anchor: end; dominant-baseline: middle; }
.report-axis-x { text-anchor: middle; }
.report-line { fill: none; stroke: var(--pay); stroke-width: 2.5; stroke-linejoin: round; }
.report-dot { fill: var(--surface); stroke: var(--pay); stroke-width: 2; }
.report-dot:hover { fill: var(--pay); r: 6; }
.report-trend [hidden] { display: none; }
.report-table-scroll { overflow-x: auto; }
.report-table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.report-table th, .report-table td { padding: 13px 18px; border-top: 1px solid var(--line-2); text-align: right; white-space: nowrap; }
.report-table th { background: var(--bg); color: var(--ink-3); font-size: 12px; font-weight: 500; }
.report-table th:first-child, .report-table td:first-child { text-align: left; }
.report-table tbody tr:hover { background: var(--hover); }
.report-table td > a { display: block; font-weight: 600; text-decoration: none; }
.report-table td > a:hover { text-decoration: underline; }
.report-table td > .report-note { display: block; margin-top: 4px; font-size: 11px; }
.report-table tfoot { background: var(--bg); font-weight: 600; }
.report-amount { font-weight: 600; }
.report-alert-count { color: var(--alert); font-weight: 600; }
.report-period-scroll { max-height: 550px; }
.report-period-scroll thead { position: sticky; top: 0; }
.report-period-scroll tfoot { position: sticky; bottom: 0; }
.report-breakdown-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.report-breakdown { list-style: none; padding: 0 24px 20px; margin: 0; }
.report-breakdown li { display: grid; grid-template-columns: 160px minmax(40px,1fr) 60px 60px; gap: 12px; align-items: center; padding: 10px 0; }
.report-breakdown .pill { justify-self: start; font-size: 11px; }
.report-breakdown strong, .report-breakdown .report-note { text-align: right; font-size: 12px; }
.report-breakdown svg { width: 100%; height: 8px; }
.report-bar-track { fill: var(--line-2); }
.report-bar { fill: var(--pay); }
.report-device-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; padding: 0 24px 24px; }
.report-device-grid h3 { font-size: 13px; color: var(--ink-3); margin-bottom: 8px; }
.report-device-grid strong { font-size: 26px; }
.report-device-grid strong small { font-size: 12px; font-weight: normal; color: var(--ink-3); }
.report-device-grid p { font-size: 12px; margin-top: 6px; }
.report-empty { padding: 24px; color: var(--ink-3); }
.report-definitions { font-size: 12px; color: var(--ink-3); padding: 8px 0 24px; }
.report-definitions summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.report-definitions ul { padding-left: 20px; margin-top: 14px; }
.report-definitions li { margin: 8px 0; line-height: 1.8; }
#reports-content[aria-busy="true"] { opacity: .65; }
@media(max-width: 1100px) {
 .report-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .report-breakdown-grid { grid-template-columns: 1fr; gap: 0; }
}
@media(max-width: 640px) {
 .report-heading .pagehead-tools { width: 100%; }
 .report-heading .btn { flex: 1 1 auto; font-size: 11px; }
 .report-filters, .report-panel-head { padding: 16px; }
 .report-filters label { flex: 1 1 130px; }
 .report-metrics { gap: 10px; }
 .report-metric { padding: 16px 12px; }
 .report-metric strong { font-size: 24px; }
 .report-metric > span, .report-metric > small { font-size: 11px; }
 .report-breakdown { padding: 0 16px 16px; }
 .report-breakdown li { grid-template-columns: 145px minmax(10px,1fr) 45px 48px; gap: 5px; }
 .report-chart { min-height: 170px; }
 .report-device-grid { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 16px 16px; }
}
