:root {
  color-scheme: dark;
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  color: #f2eee5;
  background: #080808;
  --bg: #080808;
  --surface: #111112;
  --surface-2: #171719;
  --surface-3: #202023;
  --line: #303033;
  --line-gold: #715c31;
  --gold: #d3b56f;
  --gold-bright: #efd58d;
  --text: #f2eee5;
  --muted: #99958d;
  --danger: #e27878;
  --success: #85c79f;
}

* { box-sizing: border-box; }
body { display: flex; flex-direction: column; margin: 0; min-width: 320px; height: 100vh; overflow: hidden; background: var(--bg); }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--surface-2);
  color: var(--text);
  padding: 6px 12px;
  cursor: pointer;
  overflow-wrap: anywhere;
}
button:hover { border-color: var(--line-gold); color: var(--gold-bright); background: var(--surface-3); }
button:disabled { cursor: not-allowed; opacity: .42; }
button.gold-button { border-color: var(--gold); background: var(--gold); color: #12100b; font-weight: 700; }
button.gold-button:hover { border-color: var(--gold-bright); background: var(--gold-bright); color: #080808; }
button.danger { border-color: #5d3535; color: var(--danger); }
button.danger:hover { border-color: var(--danger); background: #241414; }
.full-button { width: 100%; }
[hidden] { display: none !important; }

.topbar {
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 22px;
  border-bottom: 1px solid var(--line-gold);
  background: #0d0d0e;
}
.brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--gold); color: var(--gold-bright); font-size: 12px; font-weight: 800; }
h1 { margin: 0; font-size: 17px; font-weight: 700; }
.brand-subtitle, .section-kicker { display: block; margin-top: 2px; color: var(--gold); font-size: 9px; font-weight: 700; }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.status { margin-right: 6px; color: var(--success); font-size: 12px; }
.status.error { color: var(--danger); }

.workspace { display: grid; grid-template-rows: minmax(0, 1fr) clamp(210px, 42vh, 340px); flex: 1; min-height: 0; overflow: hidden; }
.tasks, .logs { min-width: 0; background: var(--surface); }
.tasks { display: flex; flex-direction: column; min-height: 0; padding: 20px; overflow: hidden; }
.logs { display: flex; flex-direction: column; min-height: 0; border-top: 1px solid var(--line); padding: 20px; background: #0d0d0e; overflow: hidden; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; min-height: 42px; margin-bottom: 12px; }
.compact-heading { align-items: center; }
h2 { margin: 2px 0 0; font-size: 18px; font-weight: 650; }
h3 { margin: 0 0 18px; color: var(--gold-bright); font-size: 13px; font-weight: 650; }
.task-toolbar, .row-action-buttons, .button-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.task-toolbar { justify-content: flex-end; }
.toolbar-select { width: 145px; height: 34px; padding-block: 4px; }
.action-status, .batch-status { margin: 4px 0; min-height: 17px; color: var(--gold); font-size: 11px; overflow-wrap: anywhere; }
.batch-status { color: var(--muted); }

input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 7px 9px;
  background: #0d0d0e;
  color: var(--text);
}
input, select { height: 36px; }
textarea { min-height: 110px; resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { outline: 1px solid var(--gold); border-color: var(--gold); }
label { display: grid; gap: 6px; margin-bottom: 13px; color: var(--muted); font-size: 11px; }
.inline-check { display: flex; align-items: center; gap: 8px; }
.inline-check input, .task-select-cell input, #select-all-activation-accounts { width: 16px; height: 16px; margin: 0; accent-color: var(--gold); }
.inline-number { display: grid; grid-template-columns: auto 74px; align-items: center; gap: 8px; margin: 0; flex: 1; }
.inline-number input { height: 34px; }
.number-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.button-row > button { flex: 1; min-width: 0; }
.button-row > input { flex: 2; min-width: 0; }
.button-row + .button-row { margin-top: 8px; }
.field-output { display: flex; align-items: center; height: 36px; color: var(--gold-bright); font-size: 14px; font-weight: 700; }
.muted { min-height: 18px; margin: 9px 0 0; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }

.table-wrap { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: #0d0d0e; }
table { width: 100%; min-width: 1600px; table-layout: fixed; border-collapse: collapse; font-size: 11px; }
col.column-select { width: 2%; }
col.column-account { width: 16%; }
col.column-group { width: 7%; }
col.column-account-status { width: 6%; }
col.column-credentials { width: 5%; }
col.column-cpa { width: 6%; }
col.column-quota { width: 11%; }
col.column-lifetime { width: 7%; }
col.column-stage { width: 7%; }
col.column-run-status { width: 6%; }
col.column-updated { width: 7%; }
col.column-diagnostic { width: 6%; }
col.column-actions { width: 14%; }
th, td { padding: 10px 8px; text-align: left; border-bottom: 1px solid #262628; vertical-align: middle; }
th { position: sticky; top: 0; z-index: 1; background: #171719; color: #bdb8ae; font-weight: 650; }
tbody tr { outline: none; }
tbody tr.task-selectable { cursor: pointer; }
tbody tr:hover > td { background: #151516; }
tbody tr.task-checked > td, tbody tr.task-focused > td { background: #1b1914; }
tbody tr.task-checked > td:first-child, tbody tr.task-focused > td:first-child { box-shadow: inset 3px 0 0 var(--gold); }
.task-select-cell { width: 42px; text-align: center; }
.account-identity { min-width: 190px; white-space: pre-line; line-height: 1.55; color: #fffaf0; }
.account-group-cell { width: 96px; max-width: 96px; }
.row-group-select { width: 88px; min-width: 88px; max-width: 88px; height: 31px; padding-block: 3px; text-overflow: ellipsis; }
.row-actions { min-width: 0; }
.row-action-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; }
.row-action-buttons button { min-width: 0; min-height: 30px; padding: 4px 6px; white-space: nowrap; }
td.error { max-width: 240px; color: var(--danger); overflow-wrap: anywhere; }
.badge { display: inline-block; border: 1px solid #4a4436; border-radius: 4px; padding: 2px 6px; background: #211e17; color: var(--gold-bright); white-space: nowrap; }
.badge.danger { border-color: #603636; background: #241515; color: var(--danger); }
.badge.neutral { border-color: var(--line); background: #1c1c1e; color: #aaa69e; }
.cpa-cell { width: 96px; min-width: 96px; }
.quota-cell { width: 220px; min-width: 220px; }
.cpa-summary { display: grid; align-items: center; gap: 7px; }
.cpa-summary .badge { justify-self: start; }
.cpa-meta { display: block; color: var(--muted); line-height: 1.35; white-space: nowrap; }
.cpa-quota { display: grid; gap: 5px; width: 100%; color: var(--gold-bright); }
.cpa-quota-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #d8d4ca; font-size: 10px; }
.cpa-quota-header strong { color: var(--success); font-size: 11px; font-variant-numeric: tabular-nums; }
.cpa-quota-track { position: relative; width: 100%; height: 7px; overflow: hidden; border: 1px solid #34363a; border-radius: 4px; background: #25272a; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .55); }
.cpa-quota-fill { display: block; height: 100%; min-width: 2px; border-radius: inherit; background: var(--success); transition: width .25s ease; }
.cpa-quota-reset { color: var(--muted); font-size: 10px; line-height: 1.2; }
.cpa-quota.warning .cpa-quota-fill { background: var(--gold); }
.cpa-quota.warning .cpa-quota-header strong { color: var(--gold-bright); }
.cpa-quota.exhausted .cpa-quota-fill { background: var(--danger); }
.cpa-quota.exhausted .cpa-quota-header strong { color: var(--danger); }
.cpa-quota.error, .cpa-quota.exhausted { color: var(--danger); }
.cpa-lifetime-cell { width: 108px; min-width: 108px; }
.cpa-lifetime { display: grid; gap: 3px; color: var(--muted); white-space: nowrap; }
.cpa-lifetime strong { color: #fffaf0; font-size: 12px; font-weight: 650; font-variant-numeric: tabular-nums; }

.pagination { min-height: 48px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--muted); font-size: 11px; }
.pagination label { display: flex; align-items: center; gap: 6px; margin: 0; }
.pagination select { width: 70px; height: 32px; padding-block: 4px; }
#log-list { flex: 1; min-height: 0; overflow: auto; list-style: none; margin: 0; padding: 0; font: 11px/1.55 Consolas, "Microsoft YaHei", monospace; }
#log-list li { padding: 8px 0; border-bottom: 1px solid #222224; color: #c5c1b8; overflow-wrap: anywhere; }
#log-list .警告 { color: var(--gold-bright); }
#log-list .错误 { color: var(--danger); }

dialog { width: min(1120px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid var(--line-gold); border-radius: 8px; background: var(--surface); color: var(--text); box-shadow: 0 24px 80px rgba(0, 0, 0, .68); }
dialog::backdrop { background: rgba(0, 0, 0, .76); }
.compact-dialog { width: min(640px, calc(100vw - 32px)); }
.dialog-shell { min-width: 0; }
.dialog-header { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--line); background: #101011; }
.icon-button { display: grid; place-items: center; width: 34px; min-height: 34px; padding: 0; font-size: 22px; line-height: 1; }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: calc(100vh - 108px); overflow: auto; }
.mailbox-list { display: grid; gap: 5px; max-height: 190px; margin-top: 10px; overflow: auto; }
.mailbox-list-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 8px; border: 1px solid var(--line); border-radius: 4px; background: #151516; }
.mailbox-list-item span:first-child { min-width: 0; overflow: hidden; color: #ddd8ce; text-overflow: ellipsis; white-space: nowrap; }
.mailbox-list-item[data-status="registered"] .badge, .mailbox-list-item[data-status="completed"] .badge { color: var(--success); }
.settings-grid > section { min-width: 0; padding: 20px; }
.settings-grid > section + section { border-left: 1px solid var(--line); }

@media (max-width: 1080px) {
  .settings-grid { grid-template-columns: 1fr 1fr; }
  .settings-grid > section:last-child { grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; }
}

@media (max-width: 720px) {
  .topbar { padding: 10px 12px; }
  .brand-subtitle { display: none; }
  .status { display: none; }
  .tasks, .logs { padding: 14px 12px; }
  .section-heading { align-items: flex-start; flex-direction: column; }
  .task-toolbar { width: 100%; justify-content: flex-start; }
  .task-toolbar > * { flex: 1 1 140px; }
  .settings-grid { display: block; }
  .settings-grid > section + section { border-top: 1px solid var(--line); border-left: 0; }
  .number-grid { grid-template-columns: 1fr; }
  .button-row { display: grid; grid-template-columns: 1fr 1fr; }
}
