:root {
  --brand: #5b250f;
  --brand-dark: #351207;
  --accent: #ffbe00;
  --accent-soft: #fff3bf;
  --ink: #32180e;
  --canvas: #fffaf0;
  --line: #eee2ce;
}

body { background: radial-gradient(circle at 90% 0, #fff0b4 0, transparent 25%), var(--canvas); }
.sidebar { background: linear-gradient(180deg, #351207, #1f0d07); box-shadow: 8px 0 30px #35120718; }
.brand-mark { width: 46px; height: 46px; padding: 0; object-fit: cover; border-radius: 14px; border: 2px solid #ffcf3d; }
.sidebar nav a:hover, .sidebar nav a.active { background: #ffffff14; box-shadow: inset 3px 0 var(--accent); }
.sidebar nav a.active span { color: var(--accent); }
.sidebar nav a b { background: var(--accent); color: var(--brand-dark); }
main { max-width: 1600px; }
.welcome { background: linear-gradient(125deg, #4b1c0a, #7a3617); position: relative; overflow: hidden; }
.welcome::after { content: ""; position: absolute; width: 230px; height: 230px; border-radius: 50%; background: #ffbe0028; right: -55px; top: -100px; }
.welcome::after { pointer-events:none; }
.welcome > * { position:relative; z-index:1; }
.welcome button, .primary { background: var(--accent) !important; color: var(--brand-dark) !important; border: 0 !important; font-weight: 750; }
.panel, .metrics article, .data-card, .mini-card { box-shadow: 0 10px 30px #5b250f0b; }
.panel, .metrics article, .data-card { border-color: #f0e4d1 !important; }
.header-actions button, .pending li button, .row-actions button { cursor: pointer; transition: .18s ease; }
button:hover { transform: translateY(-1px); filter: brightness(.98); }
.workspace { backdrop-filter: blur(6px); }
.workspace-card { border-radius: 24px 0 0 24px; box-shadow: -18px 0 60px #32180e24; }
.audit-drawer { border-left: 1px solid var(--line); box-shadow: -18px 0 60px #32180e24 !important; }
.record-title { display:flex; align-items:center; gap:12px; margin:22px 0; }
.record-avatar { width:48px; height:48px; border-radius:15px; background:var(--accent-soft); color:var(--brand); display:grid; place-items:center; font-size:20px; font-weight:800; }
.field-editor { display:grid; gap:10px; margin-top:18px; }
.field-row { display:flex; align-items:center; gap:10px; padding:12px 14px; background:#fffaf0; border:1px solid var(--line); border-radius:12px; }
.field-row strong { flex:1; }
.field-row button { border:0; background:transparent; color:#a0442b; cursor:pointer; }
.empty-state { padding:50px; text-align:center; color:var(--muted); }
.toast { position:fixed; right:28px; bottom:28px; z-index:50; background:#351207; color:#fff; padding:13px 18px; border-radius:12px; box-shadow:0 12px 35px #0003; animation:toast-in .2s ease; }
@keyframes toast-in { from { opacity:0; transform:translateY(10px); } }
.login-brand img { width:48px; height:48px; object-fit:cover; border-radius:14px; }
.drawer-form { display:grid; gap:16px; margin-top:24px; }
.drawer-form label { display:grid; gap:7px; font-size:13px; font-weight:700; color:var(--ink); }
.drawer-form input, .drawer-form select, .drawer-form textarea { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:11px; background:#fff; font:inherit; outline:none; resize:vertical; }
.drawer-form input:focus, .drawer-form select:focus, .drawer-form textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px #ffbe0025; }
.drawer-form .primary { padding:13px; border-radius:11px; cursor:pointer; }
.form-error { min-height:18px; margin:0; color:#b02e24; font-size:12px; }

/* 后台整体版心：让大屏内容居中、留白均衡，避免贴边和侧栏过宽 */
.sidebar { width:232px; padding:24px 16px; }
main { margin-left:232px; width:calc(100% - 232px); max-width:none; padding:32px clamp(28px, 3vw, 56px) 60px; }
.workspace { left:232px; padding:24px clamp(24px, 2.6vw, 48px); background:linear-gradient(135deg, #f7f2e9 0%, #fffaf0 55%, #f4eadb 100%); }
.workspace-card { position:relative; width:100%; max-width:1560px; min-height:calc(100vh - 48px); margin:0 auto; padding:34px clamp(28px, 2.5vw, 44px) 46px; background:rgba(255,255,255,.82); border:1px solid rgba(238,226,206,.9); border-radius:22px; box-shadow:0 18px 55px #5b250f14; }
.workspace-card > .workspace-close { position:absolute; top:26px; right:28px; }
.module-head { margin:0 64px 28px 0; }
.module-head h2 { font-size:28px; }
.salary-subnav { margin-bottom:26px; }
.split-cards { gap:18px; margin-bottom:20px; }
.mini-card { padding:22px 24px; }
.filters { padding:16px 18px; gap:12px; margin-bottom:20px; }
.data-card { box-shadow:0 10px 28px #5b250f0a; }
.data-card th, .data-card td { padding:15px 18px; }

/* 薪资维护使用紧凑表格，一屏显示更多员工和工资字段 */
.salary-profile-table table { min-width:max(840px, calc(500px + var(--salary-field-count, 0) * 112px)); font-size:12px; }
.salary-profile-table th, .salary-profile-table td { padding:10px 11px; }
.salary-profile-table th { line-height:1.25; }
.salary-profile-table th:nth-child(1), .salary-profile-table td:nth-child(1) { min-width:116px; }
.salary-profile-table th:nth-child(2), .salary-profile-table td:nth-child(2) { min-width:70px; }
.salary-profile-table th:nth-child(3), .salary-profile-table td:nth-child(3) { min-width:74px; }
.salary-profile-table th:nth-child(4), .salary-profile-table td:nth-child(4) { min-width:64px; }
.salary-profile-table th:nth-child(1), .salary-profile-table td:nth-child(1) { position:sticky; left:0; z-index:2; background:#fff; }
.salary-profile-table th:nth-child(2), .salary-profile-table td:nth-child(2) { position:sticky; left:116px; z-index:2; background:#fff; box-shadow:7px 0 10px -10px #5b250f80; }
.salary-profile-table thead th:nth-child(1), .salary-profile-table thead th:nth-child(2) { z-index:3; background:#fbfaf8; }
.salary-profile-table .salary-row-editing td:nth-child(1), .salary-profile-table .salary-row-editing td:nth-child(2) { background:#fff9e8; }
.salary-profile-table .salary-field-head { min-width:88px; gap:1px; }
.salary-profile-table .salary-value-cell { min-width:104px; }
.salary-profile-table .salary-inline-input { gap:3px; padding:4px 6px; border-radius:7px; }
.salary-profile-table .salary-inline-input input { width:68px; font-size:12px; }
.salary-profile-table .salary-inline-actions { gap:5px; }
.salary-profile-table button, .salary-profile-table .salary-inline-actions .primary { padding:6px 9px; font-size:12px; }
.salary-batch-actions { display:flex; gap:9px; }
.salary-batch-actions button { border:1px solid var(--line); background:white; color:var(--brand); padding:10px 14px; border-radius:9px; font-weight:700; cursor:pointer; }
.salary-import-note { height:auto; display:block; padding:13px 15px; color:var(--brand); }
.salary-import-preview { margin-top:14px; }
.salary-import-preview table { min-width:max-content; }
.salary-import-preview th, .salary-import-preview td { padding:9px 11px; font-size:12px; }
.salary-import-more { color:var(--muted); font-size:12px; }
.attendance-head-actions { display:flex; gap:9px; }
.attendance-head-actions button { border:1px solid var(--line); background:white; color:var(--brand); padding:10px 14px; border-radius:9px; font-weight:700; cursor:pointer; }
.attendance-rule-banner { display:flex; align-items:center; flex-wrap:wrap; gap:10px 18px; margin-bottom:20px; padding:14px 18px; border:1px solid #f0d98c; border-radius:13px; background:#fff9df; color:#6b4700; font-size:13px; }
.attendance-rule-banner span { padding-left:18px; border-left:1px solid #ead38b; }
.attendance-summary { grid-template-columns:repeat(4,1fr); }
.attendance-danger { color:#b02e24; }
.attendance-filters { align-items:flex-end; flex-wrap:wrap; }
.attendance-filters label { display:grid; gap:5px; color:var(--muted); font-size:11px; }
.attendance-filters label input { min-width:145px; }
.attendance-table table { min-width:1080px; }
.attendance-table th, .attendance-table td { padding:12px 13px; font-size:12px; vertical-align:top; }
.attendance-table button { border:0; background:#f7e8e5; color:var(--brand); padding:7px 10px; border-radius:7px; cursor:pointer; }
.attendance-subline, .attendance-dispute { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
.attendance-dispute { max-width:210px; color:#a33b2e; white-space:normal; line-height:1.4; }
.attendance-setting-note { height:auto; display:block; padding:14px; color:var(--brand); }
.attendance-subnav { margin-top:-8px; }
.clock-summary { grid-template-columns:repeat(3,1fr); }
.clock-table table { min-width:920px; }
.clock-table td:nth-child(2) { font-variant-numeric:tabular-nums; }

@media(max-width:1050px) {
  .sidebar { width:210px; }
  main { margin-left:210px; width:calc(100% - 210px); padding:26px; }
  .workspace { left:210px; padding:18px; }
  .workspace-card { min-height:calc(100vh - 36px); padding:28px 24px 38px; }
  .attendance-summary { grid-template-columns:1fr 1fr; }
  .clock-summary { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:760px) {
  main { margin-left:0; width:100%; padding:18px; }
  .workspace { left:0; padding:10px; }
  .workspace-card { min-height:calc(100vh - 20px); padding:24px 16px 34px; border-radius:18px; }
  .workspace-card > .workspace-close { top:16px; right:16px; }
  .module-head { margin-right:48px; }
  .clock-summary { grid-template-columns:1fr; }
}