/* 方案 2：纯白高效表格风。仅覆盖视觉，不改变页面结构与业务布局。 */
:root {
  --blue: #1769e0;
  --blue-2: #0f5dcc;
  --ink: #172033;
  --muted: #7d879a;
  --line: #e1e6ee;
  --soft: #f6f8fb;
  --green: #13a976;
  --red: #e94b62;
}

html,
body {
  color: #172033;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  background: #f7f9fc;
}

button,
input,
select,
textarea {
  color: inherit;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #1769e033;
  outline-offset: 2px;
}

.topbar {
  border-bottom-color: #e4e9f0;
  background: #ffffff;
  box-shadow: none;
}

.brand {
  color: #172033;
}

.brand-mark {
  border-radius: 8px;
  background: #1769e0;
  box-shadow: none;
}

.brand b {
  font-weight: 750;
  letter-spacing: .01em;
}

.brand small,
.page-heading p,
.section-toolbar span,
.subline {
  color: #8993a5;
}

.main-nav {
  position: relative;
  align-self: stretch;
  padding: 0;
  gap: 10px;
  border-radius: 0;
  background: transparent;
}

.nav-item {
  position: relative;
  height: 100%;
  padding: 0 18px;
  border-radius: 0;
  color: #5f697c;
  font-weight: 600;
  transition: color .16s, background .16s;
}

.nav-item:hover {
  color: #1769e0;
  background: #f7faff;
}

.nav-item.active {
  color: #1769e0;
  background: transparent;
  box-shadow: none;
}

.nav-item.active::after {
  content: "";
  position: absolute;
  right: 16px;
  bottom: 0;
  left: 16px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: #1769e0;
}

.nav-item i {
  background: #ff6b61;
}

.account-menu {
  color: #384357;
  font-weight: 600;
}

.account-menu button {
  border-color: #dfe5ed;
  border-radius: 6px;
  color: #677287;
  background: #fff;
}

.account-menu button:hover {
  border-color: #b9c9df;
  color: #1769e0;
  background: #f8fbff;
}

.workspace {
  background: transparent;
}

.page-heading {
  border-bottom: 1px solid #e8ecf2;
}

.eyebrow {
  color: #1769e0;
  font-weight: 600;
  letter-spacing: .04em;
}

.page-heading h1 {
  color: #111827;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: 32px;
  font-weight: 750;
  letter-spacing: -.02em;
}

.new-order,
.primary,
.confirm,
.approve-account {
  border-radius: 7px;
  background: #1769e0;
  box-shadow: none;
}

.new-order:hover,
.primary:hover,
.confirm:hover,
.approve-account:hover {
  background: #0f5dcc;
}

.order-tools {
  padding: 10px 12px;
  border: 1px solid #e1e6ee;
  border-radius: 8px;
  background: #fff;
}

.search {
  border-color: #dfe5ed;
  border-radius: 6px;
  background: #fff;
}

.search:focus-within {
  border-color: #1769e0;
  box-shadow: 0 0 0 3px #1769e012;
}

.status-tabs {
  border: 1px solid #e3e8ef;
  border-radius: 7px;
  background: #f6f8fb;
}

.status-tabs button {
  border-radius: 5px;
  color: #687386;
}

.status-tabs button:hover {
  color: #1769e0;
}

.status-tabs button.active {
  color: #1769e0;
  background: #fff;
  box-shadow: 0 1px 3px #17203312;
}

.batch-download,
.batch-download-help {
  border-color: #cbd8ea;
  border-radius: 6px;
  color: #1769e0;
  background: #f7faff;
  box-shadow: none;
}

.table-shell {
  border-color: #dfe5ed;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

.orders-table th {
  color: #465267;
  border-right-color: #e5eaf1;
  border-bottom-color: #dce3ec;
  background: #f6f8fb;
  font-weight: 650;
}

.orders-table td {
  color: #2e394d;
  border-right-color: #e8ecf2;
  border-bottom-color: #e5eaf1;
  background: #fff;
}

.orders-table tbody tr:hover td {
  background: #f9fbfe;
}

.order-number {
  color: #22304a;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-weight: 650;
}

.mini-avatar {
  border-radius: 50%;
  background: #edf4ff;
  color: #1769e0;
  box-shadow: inset 0 0 0 1px #d6e5fb;
  font-weight: 700;
}

.table-input,
.table-select,
.speed,
.voice-select {
  border-color: #d8e0ea;
  border-radius: 6px;
  color: #354158;
  background-color: #fff;
}

.table-input:hover,
.table-select:hover,
.speed:hover,
.voice-select:hover {
  border-color: #b6c6db;
}

.table-input:focus,
.table-select:focus,
.speed:focus,
.voice-select:focus {
  border-color: #1769e0;
  box-shadow: 0 0 0 3px #1769e012;
}

.control-cell.selected,
.text-cell.selected,
.grid-cell.selected {
  background: #f0f6ff !important;
  box-shadow: inset 0 0 0 1px #78aef5;
}

.grid-cell.active-cell {
  box-shadow: inset 0 0 0 2px #1769e0;
}

.text-cell,
.cell-content {
  color: #2f3b50;
}

.text-cell:hover {
  background: #f9fbfe;
}

.cell-content.placeholder,
.text-cell.readonly,
.error-none,
.local-voice-waiting {
  color: #98a2b3;
}

.expand-cell {
  border-color: #cbd8ea;
  border-radius: 5px;
  color: #1769e0;
  box-shadow: 0 2px 8px #173a6814;
}

.expand-cell:hover {
  border-color: #1769e0;
  background: #1769e0;
}

.confirm {
  font-weight: 650;
}

.confirm:disabled {
  color: #0b8d64;
  background: #e4f7ef;
  border-radius: 999px;
}

.audio-upload {
  border-color: #cfd9e8;
  border-radius: 6px;
  color: #1769e0;
  background: #fbfdff;
}

.audio-upload.has-file {
  color: #1769e0;
}

.audio-action {
  border-radius: 5px;
  color: #1769e0;
}

.times {
  color: #78849a;
}

.times b {
  color: #344158;
}

.order-delete,
.voice-delete-button,
.audio-delete,
.reject-account,
.delete-account {
  border-color: #f0b7bf !important;
  border-radius: 6px !important;
  color: #dc4358;
  background: #fff !important;
  box-shadow: none;
}

.section-toolbar,
.voice-card,
.worker-health-panel,
.studio-completion-card,
.studio-recent-panel,
.account-review-panel,
.admin-card {
  border-color: #dfe5ed;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

.voice-card:hover,
.admin-card:hover {
  border-color: #c9d6e7;
}

.voice-icon,
.card-icon {
  border-radius: 7px;
  color: #1769e0;
  background: #edf4ff;
}

.voice-order-number {
  background: #1769e0;
}

.voice-order-control select,
.cleanup-row select,
.admin-table select {
  border-color: #d8e0ea;
  border-radius: 6px;
}

.worker-online-state.ok,
.account-status.approved,
.available {
  color: #0c8c64;
  background: #e5f7f0;
}

.worker-interface-card {
  border-color: #dfe5ed;
  border-radius: 7px;
  background: #fafbfd;
}

.worker-interface-card.ok {
  border-color: #cce9de;
  background: #f4fbf8;
}

.worker-interface-card.error {
  border-color: #f2c9cf;
  background: #fff7f8;
}

.studio-total-progress > div,
.progress-track {
  background: #e8edf4;
}

.studio-total-progress i,
.progress-track i {
  background: #1769e0;
}

.admin-table th {
  color: #4d596d;
  background: #f6f8fb;
}

.admin-table th,
.admin-table td {
  border-bottom-color: #e5eaf1;
}

.modal {
  border: 1px solid #dfe5ed;
  border-radius: 10px;
  box-shadow: 0 24px 70px #1720332b;
}

.modal::backdrop {
  background: #17203366;
  backdrop-filter: blur(2px);
}

.modal header,
.modal footer {
  border-color: #e5eaf1;
}

.modal header button,
.ghost {
  border-color: #dfe5ed;
  border-radius: 6px;
  color: #5f6b80;
  background: #f7f9fc;
}

.auth-screen {
  background: #f5f8fc;
}

.auth-card {
  border-color: #dfe5ed;
  border-radius: 12px;
  box-shadow: 0 18px 55px #24334d14;
}

.auth-form input {
  border-color: #d8e0ea;
  border-radius: 6px;
}

.auth-form input:focus {
  border-color: #1769e0;
  box-shadow: 0 0 0 3px #1769e012;
}

.toast {
  border: 1px solid #334158;
  border-radius: 7px;
  background: #1f2937;
  box-shadow: 0 10px 28px #1720332b;
}

@media (max-width: 720px) {
  .main-nav {
    background: #fff;
  }

  .nav-item.active::after {
    right: 8px;
    left: 8px;
  }

  .order-tools {
    padding: 10px;
  }
}