:root{--nav:#132e4f;--blue:#2878d4;--ink:#172b4d;--muted:#728197;--line:#e7edf5;--bg:#f5f7fb;--green:#16835b;--orange:#c57412}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#27364b;font:14px "Microsoft YaHei",Arial,sans-serif}a{text-decoration:none;color:#2878d4}button,.primary,.secondary{font:inherit;border:0;border-radius:6px;padding:10px 16px;cursor:pointer}.app{display:flex;min-height:100vh}.sidebar{background:var(--nav);color:#c7d3e2;width:222px;flex:none;padding:20px 12px;position:fixed;inset:0 auto 0 0;overflow-y:auto}.brand{display:block;padding:10px 14px 28px;color:#fff;font-size:19px;font-weight:700;line-height:1.1}.brand em{font-size:13px;font-style:normal;letter-spacing:2px;color:#77b8ff}.sidebar .menu-title{font-size:11px;letter-spacing:1px;color:#7890aa;padding:18px 13px 7px}.sidebar a:not(.brand){display:block;color:#cad5e2;border-radius:6px;padding:9px 13px;margin:2px 0}.sidebar a:not(.brand):hover{background:#244c78;color:#fff}.page{margin-left:222px;min-width:0;width:calc(100% - 222px)}.topbar{height:68px;padding:0 32px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.topbar strong{display:block;font-size:17px;color:var(--ink);margin-top:3px}.crumb{display:block;color:#91a0b5;font-size:12px}.user{color:#68778c}.workspace{max-width:1360px;margin:0 auto;padding:28px 32px}.workspace.narrow{max-width:980px}.welcome,.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.welcome h1,.toolbar h1{font-size:24px;margin:0 0 7px;color:var(--ink)}.welcome p,.toolbar p,.section-head p{margin:0;color:var(--muted)}.primary{background:var(--blue);color:#fff;box-shadow:0 3px 8px #b9d6f8}.secondary{background:#eef3f9;color:#47617e}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.cards article,.panel,.grid article{background:#fff;border:1px solid var(--line);border-radius:9px}.cards article{padding:19px}.cards small,.cards span{display:block;color:var(--muted)}.cards b{font-size:24px;color:var(--ink);display:block;margin:9px 0}.cards span{font-size:12px}.grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:16px;margin-top:16px}.grid article{padding:21px}.section-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:17px}.section-head h2{font-size:16px;margin:0 0 5px;color:var(--ink)}.badge{background:#e9f3ff;color:var(--blue);padding:5px 9px;border-radius:20px}.shortcut{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.shortcut a{background:#f5f8fc;border:1px solid #ebf0f5;color:#45617e;padding:13px;border-radius:6px}.data-table{width:100%;border-collapse:collapse}.data-table th{font-weight:normal;color:#7c8ba0;background:#f7f9fc}.data-table th,.data-table td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.data-table tr:last-child td{border-bottom:0}.state{padding:4px 8px;border-radius:12px;font-size:12px}.state-draft{background:#eef2f6;color:#69798c}.state-submitted,.state-dept_approved{background:#fff1d7;color:var(--orange)}.state-effective{background:#e5f7f0;color:var(--green)}.state-rejected{background:#fee9eb;color:#c3374c}.actions{display:flex;gap:7px}.actions form{display:inline}.actions button{background:#e8f2ff;color:#2878d4;padding:6px 9px}.actions .plain{background:#f4f6f8;color:#78889b}.muted,.empty{color:#8a98a9}.empty{text-align:center;padding:38px!important}.form-panel{padding:26px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px}.form-field{display:flex;flex-direction:column;gap:7px}.form-field.wide,.form-actions{grid-column:1/-1}.form-field label{font-weight:600;color:#42546b}.form-field label i{color:#d14b57;font-style:normal;margin-left:3px}.form-field input,.form-field select,.form-field textarea{border:1px solid #d9e1eb;border-radius:6px;padding:10px;background:#fff;font:inherit;color:#27364b;width:100%}.form-field textarea{min-height:80px}.form-field small{color:#91a0b5}.error{color:#d14b57;font-style:normal}.form-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:20px}.messages{max-width:1360px;margin:18px auto -12px;padding:0 32px}.notice{padding:11px 14px;border-radius:6px}.notice.success{background:#e5f7f0;color:#167152}.notice.error{background:#fee9eb;color:#b53549}.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#eaf3ff,#f7f9fc)}.login main{width:390px;max-width:calc(100vw - 36px);padding:40px;background:#fff;border:1px solid #e6edf5;border-radius:14px;box-shadow:0 14px 45px #cfdae8}.login-mark{width:42px;height:42px;display:grid;place-items:center;color:#fff;background:var(--blue);border-radius:11px;font-size:23px;font-weight:bold}.login h1{margin:18px 0 7px;color:var(--ink)}.login p{color:var(--muted);margin:0 0 25px}.login label{display:block;font-weight:600;margin:16px 0 7px;color:#42546b}.login input{width:100%;border:1px solid #d9e1eb;border-radius:6px;padding:11px;font:inherit}.login button{width:100%;margin-top:24px}@media(max-width:920px){.sidebar{width:185px}.page{margin-left:185px;width:calc(100% - 185px)}.workspace{padding:23px}.cards{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.data-table{display:block;overflow-x:auto}}@media(max-width:640px){.app{display:block}.sidebar{position:relative;width:100%;height:auto;display:flex;overflow-x:auto;padding:8px}.brand{padding:7px 12px;white-space:nowrap}.brand br,.brand em,.menu-title{display:none!important}.sidebar a:not(.brand){white-space:nowrap;padding:8px 10px}.page{margin:0;width:100%}.topbar{padding:0 16px}.workspace{padding:20px 16px}.cards{grid-template-columns:1fr}.welcome,.toolbar{align-items:flex-start;gap:14px}.welcome .primary,.toolbar .primary{white-space:nowrap}.form-panel{grid-template-columns:1fr;padding:17px}.form-field.wide,.form-actions{grid-column:auto}.messages{padding:0 16px}}
.table-scroll{overflow-x:auto}.data-table tfoot td{background:#f2f7fd;border-top:2px solid #dce9f7;color:#244d78;font-weight:600}.data-table .total-label{color:var(--ink)}.sortable-header{cursor:pointer;padding-right:22px!important;user-select:none;position:relative}.sortable-header:hover{background:#eaf3ff}.sortable-header.header-dragging{opacity:.45}.sortable-header.header-drag-over{box-shadow:inset 3px 0 #2878d4;background:#eaf3ff}.sortable-header.sort-asc:after,.sortable-header.sort-desc:after{color:#2878d4;margin-left:6px}.sortable-header.sort-asc:after{content:'▲'}.sortable-header.sort-desc:after{content:'▼'}.column-resizer{position:absolute;right:0;top:0;width:7px;height:100%;cursor:col-resize;touch-action:none}.column-resizer:hover{background:#2878d4}.unreviewed-mark,.menu-alert{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:7px;padding:0 6px;background:#e74b55;color:#fff;border-radius:11px;font-size:11px;font-weight:700;vertical-align:middle;animation:approval-pulse 1.6s infinite}.menu-alert{float:right;margin:0;min-width:19px}.money-value{font-variant-numeric:tabular-nums}@keyframes approval-pulse{50%{box-shadow:0 0 0 4px rgba(231,75,85,.16)}}
.sidebar{display:flex;flex-direction:column}.sidebar .brand{order:0}.sidebar .menu-title:nth-of-type(1){order:1}.sidebar a[href="/business/projects/"]{order:2}.sidebar a[href="/project-management/"]{order:3}.sidebar a[href="/business/contracts/"]{order:4}.sidebar a[href="/business/changes/"]{order:5}.sidebar a[href="/business/invoices/"]{order:6}.sidebar a[href="/business/receipts/"]{order:7}.sidebar a[href="/business/files/"]{order:8}.sidebar .menu-title:nth-of-type(2){order:9}.sidebar a[href="/business/employees/"]{order:10}.sidebar a[href="/business/attendance/"]{order:11}.sidebar a[href="/business/payroll/"]{order:12}.sidebar a[href="/business/labor_payments/"]{order:13}.sidebar .menu-title:nth-of-type(3){order:14}.sidebar a[href="/business/expenses/"]{order:15}.sidebar .menu-title:nth-of-type(4){order:16}.sidebar a[href="/business/logistics_expenses/"]{order:17}.sidebar .menu-title:nth-of-type(5){order:18}.sidebar a[href="/business/customers/"]{order:19}.sidebar a[href="/business/project_managers/"]{order:20}.sidebar a[href="/business/affiliate_units/"]{order:21}.sidebar .menu-title:nth-of-type(6){order:22}.sidebar a[href="/business/pending-approvals/"]{order:23}.sidebar a[href="/business/project-net-cash/"]{order:24}.sidebar a[href="/admin/"]{order:25}

.sidebar a[href="/business/common-handlers/"]{order:21}

/* Company branding: keep the image and name legible without taking menu space. */
.sidebar .brand{display:flex;align-items:center;gap:10px;padding:8px 9px 23px;color:#fff;line-height:1.3}
.brand-logo,.login-logo{display:block;flex:none;object-fit:cover;background:#1d1711;border:1px solid rgba(222,193,111,.48)}
.brand-logo{width:42px;height:42px;border-radius:11px}
.brand-copy{min-width:0;font-size:14px;font-weight:700;letter-spacing:.1px}
.brand-copy small{display:block;margin-top:2px;color:#9ebddd;font-size:11px;font-weight:400;letter-spacing:.6px}
.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:27px}
.login-logo{width:64px;height:64px;border-radius:15px;box-shadow:0 5px 16px rgba(31,24,14,.18)}
.login-brand h1{margin:0 0 5px;font-size:20px;line-height:1.35}
.login-brand p{margin:0;font-size:13px}
@media(max-width:640px){.sidebar .brand{padding:7px 10px}.brand-logo{width:32px;height:32px}.brand-copy{font-size:13px}.brand-copy small{display:none}.login-brand{gap:12px}.login-logo{width:56px;height:56px}.login-brand h1{font-size:18px}}
.employee-search{display:flex;gap:10px;align-items:center;margin:-8px 0 16px}.employee-search input{width:min(520px,100%);border:1px solid #d9e1eb;border-radius:6px;padding:10px;background:#fff;font:inherit;color:#27364b}
.filter-panel{padding:18px 22px;margin-bottom:16px}.filter-form{display:flex;align-items:end;gap:16px}.filter-form .form-field{min-width:220px}.filter-actions{padding-bottom:0}.cost-summary-cards{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}@media(max-width:920px){.cost-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-form{flex-wrap:wrap}}@media(max-width:640px){.cost-summary-cards{grid-template-columns:1fr}.filter-form{display:grid;grid-template-columns:1fr}.filter-form .form-field{min-width:0}}
.project-summary-cards{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:16px}@media(max-width:1180px){.project-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:920px){.project-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.project-summary-cards{grid-template-columns:1fr}}
.detail-card{display:block;color:inherit;border-radius:9px}.detail-card:hover article{border-color:#8dbcf0;box-shadow:0 4px 14px rgba(40,120,212,.14);transform:translateY(-1px)}.detail-card:focus-visible{outline:3px solid #8dbcf0;outline-offset:3px}.panel[id]{scroll-margin-top:22px}
.readonly-value{border:1px solid #d9e1eb;border-radius:6px;padding:10px;background:#f8fafc;color:#27364b;min-height:40px;white-space:pre-wrap}
.state-pending_payment{background:#fff1d7;color:var(--orange)}.state-paid{background:#e5f7f0;color:var(--green)}

/* Dark gold enterprise theme */
:root {
  color-scheme: dark;
  --nav: #090d12;
  --bg: #0e131a;
  --surface: #171e27;
  --surface-raised: #1b2430;
  --surface-hover: #222d39;
  --line: #2a3643;
  --ink: #eef2f6;
  --muted: #97a6b8;
  --gold: #d9b65f;
  --gold-bright: #f2d88e;
  --blue: #d9b65f;
  --green: #62c99b;
  --orange: #e0aa57;
}

body { background: var(--bg); color: #d9e1ea; }
a { color: var(--gold); }
.sidebar {
  background: radial-gradient(circle at 20% 0%, #20212a 0, #10151c 38%, #090d12 100%);
  border-right: 1px solid rgba(217, 182, 95, .18);
  color: #b7c0cb;
}
.sidebar .brand {
  color: #f7f2e5;
  border-bottom: 1px solid rgba(217, 182, 95, .16);
  margin-bottom: 6px;
}
.brand-logo, .login-logo {
  object-fit: contain;
  background: transparent;
  border: 0;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .34));
}
.brand-logo { width: 48px; height: 48px; border-radius: 0; }
.brand-copy small { color: #b7a36b; }
.sidebar .menu-title { color: #746f65; }
.sidebar a:not(.brand) { color: #aeb9c5; border: 1px solid transparent; }
.sidebar a:not(.brand):hover {
  color: var(--gold-bright);
  background: rgba(217, 182, 95, .09);
  border-color: rgba(217, 182, 95, .14);
}
.page { background: linear-gradient(180deg, #10161e 0, var(--bg) 240px); }
.topbar {
  background: rgba(20, 27, 36, .96);
  border-bottom-color: var(--line);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
.topbar strong, .welcome h1, .toolbar h1, .section-head h2 { color: var(--ink); }
.crumb, .user, .welcome p, .toolbar p, .section-head p, .cards small, .cards span, .muted, .empty { color: var(--muted); }
.user a { color: var(--gold); }
.primary {
  background: linear-gradient(135deg, #b68c35, var(--gold-bright));
  color: #19140a;
  font-weight: 700;
  box-shadow: 0 6px 18px rgba(217, 182, 95, .20);
}
.primary:hover { filter: brightness(1.06); }
.secondary { background: #222c37; color: #d8e0e9; border: 1px solid var(--line); }
.cards article, .panel, .grid article {
  background: linear-gradient(145deg, var(--surface-raised), var(--surface));
  border-color: var(--line);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
}
.cards article { position: relative; overflow: hidden; }
.cards article::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, var(--gold-bright), #9a7124);
}
.cards b { color: #f6f2e8; font-variant-numeric: tabular-nums; }
.badge { background: rgba(217, 182, 95, .12); color: var(--gold-bright); border: 1px solid rgba(217, 182, 95, .22); }
.shortcut a { background: #131a22; border-color: var(--line); color: #c9d2dc; }
.shortcut a:hover { color: var(--gold-bright); border-color: rgba(217, 182, 95, .35); background: var(--surface-hover); }
.data-table th { color: #a9b5c2; background: #111820; }
.data-table th, .data-table td { border-bottom-color: var(--line); }
.data-table tbody tr:hover { background: rgba(217, 182, 95, .035); }
.data-table tfoot td { background: #121a22; border-top-color: #3a4654; color: var(--gold-bright); }
.data-table .total-label { color: var(--ink); }
.sortable-header:hover, .sortable-header.header-drag-over { background: #202a35; }
.sortable-header.header-drag-over { box-shadow: inset 3px 0 var(--gold); }
.sortable-header.sort-asc:after, .sortable-header.sort-desc:after { color: var(--gold); }
.column-resizer:hover { background: var(--gold); }
.form-field label { color: #cbd4de; }
.form-field input, .form-field select, .form-field textarea, .employee-search input {
  background: #10161d;
  border-color: #344252;
  color: var(--ink);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus, .employee-search input:focus {
  outline: 2px solid rgba(217, 182, 95, .22);
  border-color: var(--gold);
}
.form-field small { color: var(--muted); }
.readonly-value { background: #111820; border-color: var(--line); color: #dce4ed; }
.form-actions { border-top-color: var(--line); }
.actions button { background: rgba(217, 182, 95, .12); color: var(--gold-bright); }
.actions .plain { background: #232c36; color: #aeb9c5; }
.actions .delete-action { background: #3a2227; color: #f2a6ad; padding: 6px 9px; border-radius: 6px; }
.danger { background: #9f3542; color: #fff; box-shadow: 0 3px 10px rgba(159,53,66,.25); }
.state-draft { background: #27313d; color: #b5c0cc; }
.state-submitted, .state-dept_approved, .state-pending_payment { background: rgba(224, 170, 87, .16); color: #f2c77e; }
.state-effective, .state-paid { background: rgba(98, 201, 155, .14); color: #83dbb5; }
.state-rejected { background: rgba(222, 91, 109, .14); color: #f192a0; }
.notice.success { background: rgba(98, 201, 155, .14); color: #8adfba; }
.notice.error { background: rgba(222, 91, 109, .14); color: #f39aa7; }
.login { background: radial-gradient(circle at 50% 18%, #29303a 0, #121821 38%, #080b10 100%); }
.login main {
  background: linear-gradient(145deg, #1c2530, #131a22);
  border-color: rgba(217, 182, 95, .24);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .48);
}
.login-logo { width: 74px; height: 74px; border-radius: 0; }
.login h1, .login label { color: var(--ink); }
.login p { color: var(--muted); }
.login input { background: #0f151c; border-color: #344252; color: var(--ink); }
.login h2 { margin: 0 0 8px; color: var(--ink); font-size: 22px; }
.login small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.account-links { display: flex; justify-content: center; gap: 10px; margin: 20px 0 0 !important; font-size: 13px; }
.account-links a { color: var(--gold-bright); }
.user { display: flex; align-items: center; gap: 12px; }
.logout-form { display: inline; margin: 0; }
.logout-form button { padding: 0; border: 0; background: transparent; color: var(--gold); cursor: pointer; font: inherit; }
::selection { background: rgba(217, 182, 95, .30); color: #fff; }

@media (max-width: 640px) {
  .brand-logo { width: 36px; height: 36px; }
  .login-logo { width: 64px; height: 64px; }
}

.sidebar a[href="/business/expenses/paid/"] { order: 15; }
.expense-status-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 16px; }
@media (max-width: 640px) { .expense-status-cards { grid-template-columns: 1fr; } }

.employee-select-search {
  margin-bottom: 2px;
}
.employee-select-search::placeholder { color: #738295; }

/* Employee wage ledger: make the active query obvious after submitting filters. */
.filter-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.filter-result { margin: 14px 0 0; color: var(--muted); font-size: 13px; }
.filter-result::before { content: "查询结果"; display: inline-block; margin-right: 8px; padding: 2px 7px; border: 1px solid rgba(217, 182, 95, .24); border-radius: 999px; color: var(--gold-bright); font-size: 11px; }
@media (max-width: 640px) { .filter-actions { width: 100%; } .filter-actions .primary, .filter-actions .secondary { flex: 1 1 auto; text-align: center; } }

/* Keep the full company name together in the account pages' brand header. */
.login main { width: min(470px, calc(100vw - 24px)); }
.login-brand { width: 100%; }
.login-brand > div { flex: 1 1 auto; min-width: 0; }
.login-brand h1 {
  white-space: nowrap;
  font-size: clamp(16px, 4.65vw, 20px);
  letter-spacing: -.45px;
}

@media (max-width: 640px) {
  .login main { padding: 28px 20px; }
  .login-brand { gap: 10px; }
  .login-logo { width: 54px; height: 54px; }
}

.csrf-failure h2 { margin: 0 0 12px; }
.csrf-failure p { line-height: 1.65; }
.csrf-failure-help { color: #d9c189 !important; }
.csrf-failure-actions { display: flex; gap: 10px; margin-top: 24px !important; }
.csrf-failure-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }
.csrf-failure-actions .secondary { background: #253242; color: #f0f5fa; border: 1px solid #455468; }
.csrf-failure-actions .primary:focus-visible,
.csrf-failure-actions .secondary:focus-visible { outline: 3px solid #f4d483; outline-offset: 3px; }
@media (max-width: 640px) { .csrf-failure-actions { flex-direction: column; } }