/* Presentation only. Colors and proportions follow the 公益upi workspace. */
:root {
  --bg:#f4f5f6; --bg-soft:#edf0f0; --surface:#fff; --surface-2:#fafbfb; --surface-3:#eef1ef;
  --ink:#172c30; --muted:#84909f; --faint:#8b96a3; --line:#dfe5e9; --line-strong:#cbd5d9;
  --brand:#13755e; --brand-2:#338971; --signal:#a8dac1; --success:#13755e;
  --danger:#bd3c54; --warning:#b27d2b;
  --shadow:0 2px 5px #203c3308; --shadow-soft:0 2px 5px #203c3310;
  --radius-xl:8px; --radius-lg:8px; --radius-md:6px;
  --sans:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif;
  --display:var(--sans);
}
body,.dark body { background:var(--bg); -webkit-font-smoothing:antialiased; }
button,a,input,select,textarea { touch-action:manipulation; }
button:focus-visible,a:focus-visible { outline:3px solid #75b99b; outline-offset:3px; }
.topbar { position:relative; height:80px; padding:0 28px; justify-content:space-between; background:var(--surface); border-color:var(--line); backdrop-filter:none; }
.brand { flex:none; gap:12px; }
.brand-mark { width:34px; height:38px; border-radius:3px; color:#fff; background:#172c30; box-shadow:none; font:28px Georgia,serif; }
.brand-mark::after,.brand-mark::before { display:none; }
.brand-name { color:var(--ink); font-size:20px; font-weight:600; letter-spacing:2px; }
.top-actions { gap:14px; }
.workspace-label { color:#6d7d7e; font-size:12px; }
.workspace-label>span { margin-left:14px; color:#bcc5c3; }
.service-dot { padding:0; border:0; background:transparent; border-radius:0; color:#6d7d7e; font-size:12px; font-weight:400; }
.service-dot i { width:6px; height:6px; box-shadow:none; background:var(--brand); }
.icon-button { width:36px; height:36px; border-radius:6px; font-size:17px; box-shadow:none; }
.shell { width:min(2280px,100%); padding:0 28px 56px; }
.workspace-heading { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:32px 0 28px; }
.workspace-eyebrow { margin:0 0 9px; color:var(--brand); font:700 10px/1.5 var(--sans); letter-spacing:2px; }
.workspace-heading h1 { margin:0; font:600 30px/1.35 var(--sans); letter-spacing:-.7px; }
.workspace-intro { margin:10px 0 0; font-size:13px; line-height:1.65; color:var(--muted); }
.capacity-panel { padding:12px 0 12px 18px; max-width:390px; border:0; border-left:1px solid var(--line); background:transparent; border-radius:0; box-shadow:none; }
.capacity-panel strong { font:500 11px/1.7 var(--sans); white-space:normal; }
.capacity-panel i { flex:none; background:var(--brand); box-shadow:none; }
.link-success-pulse { padding:26px 30px 20px; margin-bottom:28px; background:var(--surface); border-radius:8px; box-shadow:none; backdrop-filter:none; }
.link-success-copy { display:flex; justify-content:space-between; gap:20px; margin-bottom:0; }
.link-success-copy .workspace-eyebrow { margin:0 0 6px; color:var(--brand); font-size:10px; }
.link-success-copy h2 { font:600 24px/1.4 var(--sans); letter-spacing:-.5px; }
.link-success-copy p { margin:6px 0 0; font-size:12px; line-height:1.6; }
.activity-summary { padding:6px 12px; color:var(--brand); background:#edf7f1; border-radius:20px; font-size:11px; line-height:1.5; }
.activity-metrics { display:flex; gap:48px; margin:26px 0 24px; }
.activity-metrics>div { min-width:96px; }
.activity-metrics span { display:block; color:var(--muted); font-size:12px; }
.activity-metrics strong { display:block; margin-top:7px; font:32px/1.3 var(--mono); letter-spacing:-1.7px; }
.activity-metrics>div:first-child strong { color:var(--success); }
.activity-chart-wrap { overflow-x:auto; padding:4px 3px 6px; }
.link-success-grid { grid-template-columns:repeat(24,minmax(0,1fr)); grid-template-rows:repeat(6,18px); grid-auto-flow:column; gap:4px; min-width:576px; }
.link-success-grid i { aspect-ratio:auto; min-width:0; border-radius:3px; background:var(--surface-3); outline:0; }
.link-success-grid i.success { background:#4eac88; }
.link-success-grid i.failed { background:#ee9b91; }
.link-success-grid i:last-child { box-shadow:inset 0 0 0 2px #596468; }
.link-success-grid i:hover { transform:scale(1.08); box-shadow:0 0 0 2px var(--ink); }
.activity-axis { display:flex; justify-content:space-between; min-width:576px; gap:20px; margin-top:12px; color:var(--muted); font-size:10px; }
.activity-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.6; }
.link-success-legend { font-size:10px; font-weight:400; gap:12px; flex:none; }
.link-success-legend i { width:10px; height:10px; border-radius:2px; }
.link-success-legend i.success { background:#4eac88; }
.link-success-legend i.failed { background:#ee9b91; }
.workspace-grid-batch { grid-template-columns:320px minmax(0,1fr); align-items:start; gap:24px; }
.panel { background:var(--surface); border-radius:8px; box-shadow:none; backdrop-filter:none; }
.panel::before,.batch-job-card::before { display:none; }
.form-panel { padding:22px 20px; }
.panel-heading { margin-bottom:22px; gap:12px; flex-wrap:wrap; }
.panel-heading>div { gap:8px; }
.panel-heading h2 { font-size:18px; font-weight:600; }
.section-index { width:auto; height:auto; padding:0; border:0; background:none; border-radius:0; font:500 10px var(--mono); color:var(--muted); }
.quiet { padding:0; border-radius:0; background:none; color:var(--muted); font-size:10px; font-weight:400; letter-spacing:0; }
.public-limit-note,.private-mode .public-limit-note { display:block; margin:0 0 22px; padding:12px; border-color:var(--line); border-radius:6px; background:var(--surface-2); font-size:11px; }
.public-limit-note b { display:block; margin-bottom:3px; color:var(--brand); font-size:11px; }
.field { margin-bottom:18px; }
.field>span,.field .label-row { font-size:12px; font-weight:600; line-height:1.5; flex-wrap:wrap; gap:4px 10px; }
.field>span small,.label-row small { font-size:10px; font-weight:400; }
input,select,textarea { padding:11px 12px; border-radius:6px; font-size:12px; line-height:1.6; background:var(--surface); }
input:focus,select:focus,textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px #13755e14; }
.token-field textarea,.dark .token-field textarea { min-height:145px; background:var(--surface); font:11px/1.7 var(--mono); }
.token-action-row { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.primary-button,.secondary-button { min-height:38px; border-radius:6px; font-size:11px; font-weight:600; box-shadow:none; }
.primary-button { background:var(--brand); color:white; border:1px solid var(--brand); }
.primary-button:hover { background:#0e624e; box-shadow:none; transform:none; }
.secondary-button { background:var(--surface); border-color:var(--line); color:var(--ink); }
.secondary-button:hover { border-color:var(--brand); color:var(--brand); box-shadow:none; transform:none; }
.token-action-button { padding:0 10px; width:100%; }
.two-cols { gap:10px; }
.proxy-block,.conditional-fields,.dark .proxy-block,.dark .conditional-fields { margin:20px 0; padding:16px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
.block-heading { gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.block-heading>div { gap:8px; }
.block-heading h3 { font-size:15px; font-weight:600; }
.block-heading p { font-size:11px; line-height:1.65; }
.block-tags { gap:6px; }
.required-tag,.optional-tag,.local-save-tag { font-size:9px; letter-spacing:0; font-weight:500; border-radius:4px; padding:4px 6px; }
.required-tag { background:#fff6f7; border-color:#efb4bf; color:var(--danger); }
.local-save-tag { background:#edf7f1; border-color:#c6e2d7; color:var(--brand); }
.optional-tag { color:var(--muted); background:var(--surface-3); }
.proxy-pool-input { min-height:96px; background:var(--surface); font-size:11px; }
.retry-setting { margin-top:16px; }
.toggle-line { padding:14px 0; gap:12px; border-color:var(--line); }
.toggle-line b { font-size:12px; font-weight:600; }
.toggle-line small,.inline-note { font-size:11px; line-height:1.65; }
.switch { width:38px; height:22px; flex:0 0 38px; }
.switch span { width:38px; height:22px; background:#bec7cb; box-shadow:none; }
.switch span::after { width:16px; height:16px; top:3px; left:3px; box-shadow:0 1px 3px #172c301a; }
.switch input:checked+span { background:var(--brand); }
.switch input:checked+span::after { transform:translateX(16px); }
.compact-fields .field { margin-bottom:0; }
.chongyun-config>.field { margin-top:16px; }
.batch-panel { min-height:0; padding:0; border:0; overflow:visible; background:transparent; }
.batch-panel>.workspace-eyebrow { margin:0 0 7px; font-weight:800; letter-spacing:.8px; }
.batch-panel>.panel-heading { margin:0 0 20px; padding:0 0 16px; border-bottom:1px solid var(--line); }
.batch-panel .panel-heading h2 { font-size:24px; letter-spacing:-.5px; }
.batch-heading-actions { flex-wrap:wrap; }
#batchSummary { font:11px/1.6 var(--mono); }
.batch-job-grid { grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:16px; overflow:visible; padding:0; }
.batch-empty { min-height:340px; display:grid; place-content:center; padding:40px; border:1px dashed var(--line-strong); border-radius:7px; background:var(--surface); font-size:13px; line-height:1.9; text-wrap:pretty; }
.batch-job-card { height:416px; min-height:416px; aspect-ratio:auto; padding:16px; border-radius:7px; box-shadow:var(--shadow-soft); background:var(--surface); }
.batch-job-card:hover { background:var(--surface); border-color:var(--line-strong); }
.batch-job-card.done,.batch-job-card.has-qr { border-color:#9dcebd; }
.batch-job-card.error,.batch-job-card.cancelled { border-color:#efb4bf; }
.batch-job-card.running { border-color:#b3cbe8; }
.batch-job-card.queued { border-color:#d9cfb4; }
.batch-card-head { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px 8px; }
.batch-card-identity { display:contents; }
.batch-card-identity>b { grid-column:1; grid-row:1; display:grid; place-items:center; min-width:30px; min-height:30px; padding:0 8px; background:var(--surface-3); border-radius:5px; color:#46545e; font:600 10px var(--mono); }
.batch-card-email-line { grid-column:1/-1; grid-row:2; width:100%; gap:8px; }
.batch-card-email-line>span { font-size:11px; font-weight:400; line-height:1.6; color:var(--muted); }
.card-email-copy { padding:0 7px; min-height:26px; font-size:10px; border-radius:4px; font-weight:500; }
.batch-card-head-state { grid-column:2; grid-row:1; justify-content:flex-start; flex-wrap:wrap; gap:6px; }
.batch-card-head-state>strong { margin-left:auto; font:500 10px var(--mono); color:var(--muted); }
.status-badge { padding:3px 0; border-radius:0; font-size:11px; font-weight:600; letter-spacing:0; background:transparent!important; }
.status-badge.done { color:var(--success); }
.status-badge.running { color:#507aab; }
.status-badge.queued { color:var(--warning); }
.batch-retry-count { padding:2px 4px; border-radius:4px; font-size:9px; font-weight:500; }
.batch-card-body { margin-top:12px; gap:0; }
.batch-task-tile:not(.has-qr) .batch-tile-status-text { display:none; }
.batch-tile-content { min-height:90px; margin:10px 0; display:flex; flex:1; }
.batch-tile-waiting { width:100%; height:auto; flex:1; border:0; border-radius:0; background:transparent; padding:10px 0; gap:7px; }
.batch-tile-waiting strong { font-size:12px; font-weight:600; }
.batch-tile-waiting>span { font-size:10px; color:var(--muted); }
.task-state-symbol { display:block; font:600 34px/1.2 var(--sans); font-style:normal; color:var(--muted); margin-bottom:7px; }
.task-state-symbol::before { content:'·'; }
.error .task-state-symbol::before { content:'!'; }
.done .task-state-symbol::before { content:'✓'; }
.queued .task-state-symbol::before { content:'…'; }
.cancelled .task-state-symbol::before { content:'−'; }
.batch-state-detail { margin:0; font-size:11px; line-height:1.7; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }
.error .batch-tile-waiting,.error .batch-tile-waiting strong,.error .task-state-symbol { color:var(--danger); }
.done .batch-tile-waiting,.done .batch-tile-waiting strong,.done .task-state-symbol { color:var(--success); }
.running .batch-tile-waiting { display:flex; flex-direction:column; justify-content:center; align-items:stretch; text-align:left; gap:12px; }
.running .batch-tile-waiting strong { color:#507aab; }
.running .batch-state-detail { color:var(--muted); }
.batch-payment-truth { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 0; border:0; border-radius:0; background:transparent; }
.batch-payment-truth span { font-size:10px; font-weight:400; letter-spacing:0; }
.batch-payment-truth strong { font-size:11px; font-weight:500; text-align:right; }
.batch-last-attempt { padding:5px 7px; margin:2px 0 5px; border-radius:4px; font-size:10px; line-height:1.6; max-height:53px; overflow:auto; }
.batch-card-progress { height:3px; margin:6px 0 0; flex:none; }
.batch-card-progress::-webkit-progress-value { background:var(--brand); }
.batch-card-progress::-moz-progress-bar { background:var(--brand); }
.running .batch-card-progress { width:100%; height:6px; margin:2px 0 0; border:0; border-radius:999px; overflow:hidden; background:#eef0f8; appearance:none; }
.running .batch-card-progress::-webkit-progress-bar { background:#eef0f8; border-radius:999px; }
.running .batch-card-progress::-webkit-progress-value { background:linear-gradient(90deg,#7746ff 0%,#426af3 25%,#00b6bd 55%,#b3ef46 100%); border-radius:999px; }
.running .batch-card-progress::-moz-progress-bar { background:linear-gradient(90deg,#7746ff 0%,#426af3 25%,#00b6bd 55%,#b3ef46 100%); border-radius:999px; }
.error .batch-card-progress::-webkit-progress-value { background:var(--danger); }
.error .batch-card-progress::-moz-progress-bar { background:var(--danger); }
.cancelled .batch-card-progress::-webkit-progress-value { background:var(--muted); }
.cancelled .batch-card-progress::-moz-progress-bar { background:var(--muted); }
.batch-tile-qr { margin:auto; width:100%; height:100%; border:0; border-radius:5px; min-height:110px; padding:8px; }
.batch-tile-qr img { max-height:208px; }
.batch-card-actions { flex:none; display:flex; flex-wrap:wrap; margin-top:auto; padding-top:10px; border-top:1px solid var(--line); gap:6px; }
.batch-card-actions a,.batch-card-actions button { min-height:35px; flex:1; padding:6px; border-radius:5px; font-size:10px; font-weight:600; white-space:nowrap; }
.batch-card-actions [data-job-copy],.batch-card-actions a { color:var(--brand); border-color:#a9d6c8; background:#f3faf7; }
.batch-card-actions [data-job-cancel] { border-color:#efb4bf; background:#fff8f9; }
.batch-tile-log { width:100%; height:auto; flex:1; border-color:var(--line); border-radius:5px; color:var(--ink); background:var(--surface-2); font-size:10px; line-height:1.6; }
.batch-tile-log time,.batch-card-log-title { color:var(--brand); }
.batch-tile-log>div:not(.batch-card-log-title) { border-color:var(--line); overflow-wrap:anywhere; }
.batch-job-card.staged .batch-card-head { grid-template-columns:auto minmax(0,1fr); }
.staged-row-index { display:none; }
.batch-staged-body strong { font-size:13px; font-weight:500; }
footer { width:min(2280px,100%); padding:24px 28px 32px; border-top:1px solid var(--line); }
.dark { --bg:#111a1b; --surface:#182426; --surface-2:#1c292b; --surface-3:#253537; --ink:#e4eeeb; --muted:#a1afae; --faint:#899b98; --line:#344548; --line-strong:#4b6262; --brand:#72c6a8; --success:#72c6a8; --danger:#f198a8; }
.dark .topbar,.dark .panel,.dark .link-success-pulse,.dark .batch-job-card,.dark input,.dark select,.dark textarea,.dark .secondary-button,.dark .card-email-copy { background:var(--surface); border-color:var(--line); }
.dark .batch-panel { background:transparent; }
.dark .capacity-panel,.dark .service-dot { background:transparent; }
.dark .workspace-label,.dark .service-dot { color:var(--muted); }
.dark .primary-button { background:#13755e; border-color:#13755e; color:#fff; }
.dark .activity-summary,.dark .local-save-tag { color:var(--brand); background:#253c34; border-color:#3b5d51; }
.dark .batch-card-identity>b { color:var(--ink); }
.dark .batch-card-actions a,.dark .batch-card-actions button { background:var(--surface-2); }
.dark .batch-job-card.done,.dark .batch-job-card.has-qr { border-color:#4f8b76; }
.dark .batch-job-card.error,.dark .batch-job-card.cancelled { border-color:#a36070; }
@media(min-width:1800px) { .workspace-grid-batch { grid-template-columns:350px minmax(0,1fr); gap:28px; } }
@media(max-width:1120px) { .workspace-grid-batch { grid-template-columns:290px minmax(0,1fr); gap:20px; } .batch-job-grid { grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); } .workspace-heading { align-items:flex-start; } .capacity-panel { max-width:265px; } }
@media(max-width:900px) { .workspace-grid-batch { grid-template-columns:1fr; gap:28px; } .batch-job-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .workspace-heading { flex-wrap:wrap; gap:14px; } .capacity-panel { border:0; padding:0; max-width:none; } .form-panel { padding:22px; } .proxy-block #proxyGrid { grid-template-columns:1fr 1fr; } }
@media(max-width:620px) {
  .topbar { height:68px; padding:0 16px; gap:12px; } .brand-name { font-size:17px; } .brand { gap:9px; } .top-actions { gap:8px; } .workspace-label,.service-dot { display:none; } .icon-button { width:40px; height:40px; }
  .shell { padding:0 16px 36px; } .workspace-heading { padding:26px 0 22px; } .workspace-heading h1 { font-size:26px; } .workspace-intro { font-size:12px; }
  .link-success-pulse { padding:20px 16px 16px; margin-bottom:24px; } .link-success-copy { align-items:flex-start; gap:12px; flex-wrap:wrap; } .link-success-copy h2 { font-size:21px; } .link-success-copy p { font-size:11px; } .activity-summary { padding:5px 9px; font-size:10px; }
  .activity-metrics { gap:20px; margin:22px 0; } .activity-metrics>div { flex:1; min-width:0; } .activity-metrics strong { font-size:26px; } .activity-metrics span { font-size:11px; }
  .activity-footer { align-items:flex-start; flex-direction:column; gap:10px; margin-top:12px; } .activity-axis>span:nth-child(2) { display:none; }
  .form-panel { padding:20px 16px; } .proxy-block #proxyGrid { grid-template-columns:1fr; } .two-cols { grid-template-columns:1fr 1fr; }
  .batch-panel { padding:0; } .batch-panel>.panel-heading { align-items:flex-start; gap:10px; } .batch-heading-actions { align-items:flex-start!important; } .batch-job-grid { grid-template-columns:1fr; gap:16px; }
  .batch-job-card { height:430px; min-height:430px; padding:16px; } .batch-card-actions a,.batch-card-actions button,.card-email-copy { min-height:44px; } .card-email-copy { padding:0 10px; }
  .token-action-button,.primary-button,.secondary-button { min-height:44px; } .batch-empty { min-height:260px; padding:26px; } footer { padding:22px 16px; }
}

.cdk-input-row { display:flex; gap:10px; align-items:stretch; }
.cdk-input-row input { flex:1; min-width:0; }
.cdk-input-row button { flex:none; white-space:nowrap; padding:10px 14px; }
#cdkBalance { text-align:right; line-height:1.6; }