:root{color-scheme:dark;--bg:#09111f;--panel:#111d30;--line:#243653;--text:#eef5ff;--muted:#8fa6c6;--accent:#38bdf8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#132747,var(--bg) 45%);color:var(--text);font:15px system-ui,sans-serif}main{max-width:1280px;margin:auto;padding:28px}header,.row{display:flex;justify-content:space-between;align-items:center;gap:16px}h1{margin:0;font-size:28px}h2{font-size:18px}.panel,.card{background:rgba(17,29,48,.94);border:1px solid var(--line);border-radius:16px;padding:18px}.login{max-width:420px;margin:12vh auto}.cards{display:grid;grid-template-columns:repeat(5,minmax(160px,1fr));gap:12px}.card h3{margin:0 0 14px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.metric b{display:block;font-size:24px;color:var(--accent)}.metric span,.muted,#updated{color:var(--muted);font-size:12px}.grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin:18px 0}input,select,button{background:#0b1628;color:var(--text);border:1px solid var(--line);border-radius:9px;padding:10px;margin:4px}button{background:#0284c7;border:0;cursor:pointer}.secondary{background:#334155}form{display:grid;gap:6px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-size:12px}.error{color:#fb7185}.table-wrap{overflow:auto}@media(max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}header{align-items:flex-start;flex-direction:column}}@media(max-width:520px){main{padding:14px}.cards{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(3,1fr)}}
:root .attendance-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:24px;align-items:start}.attendance-records,.birthday-sidebar{min-width:0}.attendance-cards,#birthdayCards{grid-template-columns:repeat(2,minmax(0,1fr))}.birthday-sidebar{border-left:1px solid var(--line);padding-left:24px}.birthday-sidebar h3{margin-top:0}.birthday-controls{display:flex;flex-wrap:wrap;align-items:center;margin-bottom:12px}@media(max-width:900px){:root .attendance-layout{grid-template-columns:minmax(0,1fr)}.birthday-sidebar{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}}@media(max-width:520px){.attendance-cards{grid-template-columns:minmax(0,1fr)}}
.project-cards{grid-template-columns:repeat(4,minmax(180px,1fr));margin:18px 0}.project-card{text-align:left;color:inherit;background:rgba(17,29,48,.94)}.project-card p{color:var(--muted)}.status-pill{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:6px 10px;color:var(--muted)}.action-grid{display:grid;grid-template-columns:repeat(3,minmax(200px,1fr));gap:12px;margin:16px 0}button:disabled{opacity:.45;cursor:not-allowed}@media(max-width:900px){.project-cards,.action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.project-cards,.action-grid{grid-template-columns:1fr}}
.inline-form{grid-template-columns:1fr 1fr 180px auto;align-items:end}.inline-form label{display:grid;color:var(--muted);font-size:12px}.invite-box{margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:12px}.invite-box input{width:min(720px,100%)}@media(max-width:700px){.inline-form{grid-template-columns:1fr}}
.staff-page{max-width:1800px;height:100vh;min-height:0;padding:14px 20px 8px;display:flex;flex-direction:column;overflow:hidden}.staff-page>header{flex:0 0 auto;margin-bottom:8px}.staff-page>header h1{font-size:24px}.staff-page>header p{margin:3px 0}.staff-header-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}.staff-header-actions>*{margin:0}.staff-list-toolbar{display:flex;align-items:center;gap:8px;padding:8px 10px;margin-bottom:8px;border:1px solid var(--line);border-radius:12px;background:#0d192b;flex:0 0 auto}.staff-list-toolbar #search{min-width:300px;flex:1}.staff-list-toolbar input,.staff-list-toolbar select,.staff-list-toolbar>*{margin:0}.staff-export{background:#0f3b2f;border-color:#166534}.sheet-counter{border:1px solid var(--line);border-radius:999px;padding:5px 9px;color:var(--muted);font-size:11px;white-space:nowrap}.sheet-counter.active{border-color:#f59e0b;color:#fbbf24;background:#78350f33}.staff-sheet-panel{padding:0;overflow:hidden;flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.sheet-summary{display:flex;justify-content:space-between;gap:18px;padding:7px 12px;border-bottom:1px solid var(--line);flex:0 0 auto}.sheet-summary p{margin:0}.staff-sheet-wrap{max-height:none;overflow:auto;flex:1 1 auto;min-height:0}.staff-sheet{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0}.staff-sheet th{position:sticky;top:0;z-index:4;background:#14233a;border-bottom:1px solid #395171}.staff-sheet td,.staff-sheet th{padding:4px 6px;border-right:1px solid #1f324d;border-bottom:1px solid #1f324d}.staff-sheet tbody tr:nth-child(even) td{background:#0d192b}.staff-sheet tbody tr:hover td{background:#142641}.staff-sheet tbody tr.dirty td{background:#4b320d}.staff-sheet input,.staff-sheet select{min-width:128px;width:100%;margin:0;padding:7px;border-radius:4px;border-color:transparent;background:transparent}.staff-sheet input:focus,.staff-sheet select:focus{outline:2px solid var(--accent);background:#07111f;border-color:var(--accent)}.staff-sheet th:nth-child(1),.staff-sheet td:nth-child(1){position:sticky;left:0;z-index:2;min-width:86px}.staff-sheet th:nth-child(2),.staff-sheet td:nth-child(2){position:sticky;left:86px;z-index:2;min-width:94px}.staff-sheet th:nth-child(3),.staff-sheet td:nth-child(3){position:sticky;left:180px;z-index:2;min-width:190px;box-shadow:6px 0 10px #0004}.staff-sheet th:nth-child(-n+3){z-index:5}.staff-sheet td:nth-child(-n+3){background:#111d30}.staff-sheet tbody tr:nth-child(even) td:nth-child(-n+3){background:#0d192b}.staff-sheet tbody tr:hover td:nth-child(-n+3){background:#142641}.staff-sheet tbody tr.dirty td:nth-child(-n+3){background:#4b320d}.sync-pill{display:inline-block;padding:5px 8px;border-radius:999px;border:1px solid var(--line);font-size:12px}.sync-pill.ok{color:#86efac;border-color:#166534;background:#052e1633}.sync-pill.error{color:#fda4af;border-color:#9f1239;background:#4c051933}.sync-pill.pending{color:#fcd34d;border-color:#92400e;background:#451a0333}@media(max-width:900px){.staff-page{padding:10px;height:100dvh}.staff-page>header{align-items:flex-start}.staff-header-actions{justify-content:flex-start}.staff-list-toolbar{flex-wrap:wrap}.staff-list-toolbar #search{min-width:100%}.sheet-summary{display:block}}@media(max-width:520px){.staff-header-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.staff-header-actions>*{width:100%}.staff-list-toolbar{display:grid;grid-template-columns:1fr 1fr}.staff-list-toolbar #search{grid-column:1/-1}.staff-list-toolbar .staff-export{grid-column:1/-1}.staff-list-toolbar .sheet-counter{justify-self:start}}
.staff-sheet td,.staff-sheet th{padding:1px 3px;font-size:11px;height:24px;line-height:1.05}.staff-sheet input,.staff-sheet select{min-width:112px;height:21px;padding:0 3px;font-size:11px;line-height:1}.staff-sheet button{margin:0;padding:2px 5px;font-size:10px;line-height:1.1;white-space:nowrap}.staff-sheet th:nth-child(1),.staff-sheet td:nth-child(1){left:0;min-width:76px}.staff-sheet th:nth-child(2),.staff-sheet td:nth-child(2){left:76px;min-width:78px}.staff-sheet th:nth-child(3),.staff-sheet td:nth-child(3){left:154px;min-width:170px}.sync-pill,.data-check{display:inline-block;padding:2px 5px;border-radius:999px;border:1px solid var(--line);font-size:10px;line-height:1}.data-check.complete{color:#86efac;border-color:#166534;background:#052e1633}.data-check.warning{color:#fcd34d;border-color:#92400e;background:#451a0333}
.staff-sheet{table-layout:fixed}.staff-sheet th{position:sticky}.staff-sheet th:nth-child(1),.staff-sheet td:nth-child(1){left:0}.staff-sheet th:nth-child(2),.staff-sheet td:nth-child(2){left:var(--staff-col-1,112px)}.staff-sheet th:nth-child(3),.staff-sheet td:nth-child(3){left:var(--staff-col-1-2,224px)}.column-resizer{position:absolute;right:-3px;top:0;width:7px;height:100%;cursor:col-resize;touch-action:none;z-index:8}.column-resizer:hover,.column-resizer:active{background:var(--accent)}
.sort-header{margin:0;padding:2px 0;background:transparent;color:var(--muted);font:inherit;font-weight:600;border:0;border-radius:0;white-space:nowrap}.sort-header:hover,.sort-header:focus{color:var(--accent);outline:none}
.metric-button{width:100%;margin:0;padding:0;border:0;background:transparent;color:inherit;text-align:left}.metric-button:hover b{color:#7dd3fc}
.dashboard-toolbar,.section-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.dashboard-toolbar>*{margin:0}.nav-button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 12px;border:1px solid var(--line);border-radius:9px;background:#15243a;color:var(--text);text-decoration:none;line-height:1.2;white-space:nowrap}.nav-button:hover,.nav-button:focus{border-color:var(--accent);background:#1b304d;outline:none}.section-heading{align-items:flex-start}.section-heading h2{margin-top:4px}.section-actions{max-width:100%}@media(max-width:900px){.dashboard-toolbar,.section-actions{justify-content:flex-start;width:100%}.section-heading{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.dashboard-toolbar>*{flex:1 1 calc(50% - 8px);min-width:0}.dashboard-toolbar input{width:100%}.section-actions{display:grid;grid-template-columns:1fr 1fr}.section-actions .nav-button:last-child{grid-column:1/-1}}
.punch-form{display:grid;grid-template-columns:minmax(180px,1fr) minmax(200px,1fr) minmax(240px,2fr) auto;gap:10px;align-items:end}.punch-form label{display:grid;gap:4px;color:var(--muted);font-size:12px}.punch-form input,.punch-form select,.punch-form button{margin:0}.raw-action{display:flex;gap:6px;align-items:center}.ignored-row{opacity:.55;text-decoration:line-through}@media(max-width:900px){.punch-form{grid-template-columns:1fr 1fr}}@media(max-width:520px){.punch-form{grid-template-columns:1fr}}
.batch-punch-form label{display:grid;gap:4px;margin:10px 0;color:var(--muted);font-size:12px}.batch-punch-form textarea{width:100%;min-height:130px}.batch-punch-form input{width:100%;max-width:600px}
.batch-punch-row{display:grid;grid-template-columns:minmax(170px,2fr) minmax(140px,1fr) minmax(110px,1fr) minmax(95px,.7fr) auto;gap:8px;align-items:end;padding:8px 0;border-bottom:1px solid var(--line)}.batch-punch-row label{margin:0}.batch-punch-row input,.batch-punch-row select{width:100%;margin:0}.batch-punch-row button{margin:0}.batch-add-row{justify-self:start}@media(max-width:760px){.batch-punch-row{grid-template-columns:repeat(2,minmax(0,1fr))}.batch-punch-row label:first-child{grid-column:1/-1}.batch-punch-row button{grid-column:2;justify-self:end}}@media(max-width:520px){.batch-punch-row{grid-template-columns:1fr}.batch-punch-row label:first-child,.batch-punch-row button{grid-column:auto}.batch-punch-row button{justify-self:stretch}}
.permission-picker{grid-column:1/-1;width:100%;padding:12px;border:1px solid var(--line);border-radius:12px}.permission-picker h3{margin:0}.permission-picker label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text)}.permission-picker input[type=checkbox]{margin:0}.permission-group-picker{border:1px solid var(--line);border-radius:10px;margin:12px 0;padding:10px}.permission-group-picker legend{padding:0 6px;font-weight:600}.permission-group-actions{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.permission-group-actions button,.permission-picker .row button{padding:6px 10px}.permission-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px 12px}@media(max-width:520px){.permission-picker .row{align-items:flex-start;flex-direction:column}}
.panel>details>summary{cursor:pointer;font-size:18px;font-weight:650;padding:4px 0}.panel>details[open]>summary{margin-bottom:16px}
.attendance-header{margin-bottom:14px}.attendance-header p{margin:5px 0 0}.attendance-nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.attendance-nav>*{margin:0}.logout-button{border:1px solid #7f1d1d;background:#3f1720}.logout-button:hover,.logout-button:focus{border-color:#fb7185;background:#5b1d2b;outline:none}.attendance-controls{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:16px;padding:14px 16px}.attendance-filters,.attendance-actions{display:flex;align-items:end;gap:10px}.attendance-filters{flex:1;min-width:0}.attendance-filters label{display:grid;gap:5px;color:var(--muted);font-size:12px}.attendance-filters label>*{margin:0}.attendance-employee-filter{flex:1;min-width:190px}.attendance-primary,.attendance-actions>*{min-height:40px;margin:0}.attendance-download{background:#0f3b2f;border-color:#166534}.attendance-download:hover,.attendance-download:focus{background:#14523f;border-color:#22c55e}@media(max-width:900px){.attendance-controls{align-items:stretch;flex-direction:column}.attendance-actions{justify-content:flex-end}.attendance-filters{display:grid;grid-template-columns:1fr 1fr}.attendance-employee-filter{min-width:0}.attendance-primary{align-self:end}}@media(max-width:520px){.attendance-header{gap:12px}.attendance-nav{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-nav>*{width:100%}.attendance-controls{padding:12px}.attendance-filters{grid-template-columns:1fr}.attendance-filters select,.attendance-filters input,.attendance-primary{width:100%}.attendance-actions{display:grid;grid-template-columns:1fr}.attendance-actions>*{width:100%}}
.attendance-search{position:relative;display:grid;gap:5px}.attendance-search>label{color:var(--muted);font-size:12px}.attendance-suggestions{position:absolute;top:100%;left:0;right:0;z-index:20;max-height:260px;overflow:auto;padding:4px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 12px 24px #0005}.attendance-suggestions[hidden]{display:none}.attendance-suggestions button{display:block;width:100%;margin:0;padding:9px 10px;text-align:left;border:0;background:transparent;color:inherit}.attendance-suggestions button:hover,.attendance-suggestions button:focus{background:#2563eb;outline:none}
.batch-row-person{position:relative;min-width:0}.batch-row-person label{display:grid;gap:5px}.batch-row-suggestions{position:absolute;top:100%;left:0;right:0;z-index:25;max-height:240px;overflow:auto;padding:4px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 12px 24px #0005}.batch-row-suggestions[hidden],.batch-row-employee[hidden]{display:none}.batch-row-suggestions button{display:block;width:100%;padding:9px 10px;text-align:left;border:0;background:transparent;color:var(--text)}.batch-row-suggestions button:hover,.batch-row-suggestions button:focus{background:#2563eb;outline:none}@media(max-width:760px){.batch-row-person{grid-column:1/-1}}@media(max-width:520px){.batch-row-person{grid-column:auto}}
.hostel-page{max-width:1180px}.hostel-header{margin-bottom:16px}.hostel-header p{margin:5px 0 0}.hostel-nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.hostel-nav>*{margin:0}.hostel-panel+.hostel-panel{margin-top:16px}.hostel-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.hostel-section-heading h2,.hostel-section-heading p{margin:0}.hostel-section-heading p{margin-top:4px}.hostel-create-form{display:grid;grid-template-columns:minmax(220px,2fr) minmax(130px,1fr) auto;gap:10px;align-items:end}.hostel-create-form label{display:grid;gap:5px;color:var(--muted);font-size:12px}.hostel-create-form input,.hostel-create-form button,.hostel-section-heading button{margin:0}.hostel-create-form button{min-height:40px}.hostel-capacity{width:110px;margin:0}.hostel-save{margin:0;white-space:nowrap}.hostel-table td:first-child{min-width:180px}@media(max-width:760px){.hostel-header{align-items:flex-start;flex-direction:column}.hostel-nav{width:100%}.hostel-create-form{grid-template-columns:1fr 1fr}.hostel-create-form button{grid-column:1/-1}.hostel-section-heading{align-items:stretch}.hostel-section-heading button{align-self:center}}@media(max-width:520px){.hostel-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hostel-nav>*{width:100%}.hostel-create-form{grid-template-columns:1fr}.hostel-create-form button{grid-column:auto}.hostel-section-heading{flex-direction:column}.hostel-section-heading button{width:100%}}
.payroll-summary-panel{margin-top:18px}.payroll-table td{white-space:nowrap}.payroll-table td:first-child{white-space:normal;min-width:180px}.payslip-page{max-width:960px}.payslip{margin-top:18px;background:#fff;color:#182235}.payslip-company{text-align:center;border-bottom:2px solid #182235}.payslip-company h2{font-size:22px;margin-bottom:4px}.payslip-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.payslip-meta div{display:grid;gap:4px}.payslip-meta span{font-size:11px;color:#536174}.payslip-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.payslip-columns section{border:1px solid #cbd5e1;padding:16px}.payslip-columns h3,.payslip-employer h3{margin-top:0}.payslip-line{display:flex;justify-content:space-between;gap:18px;padding:7px 0;border-bottom:1px solid #e2e8f0}.payslip-net{display:flex;justify-content:space-between;align-items:center;margin:20px 0;padding:18px;background:#e0f2fe;font-size:20px}.payslip-employer{max-width:50%;margin-top:24px}@media(max-width:700px){.payslip-meta,.payslip-columns{grid-template-columns:1fr}.payslip-employer{max-width:none}}@media print{body{background:#fff}.no-print{display:none}.payslip-page{max-width:none;padding:0}.payslip{border:0;margin:0;box-shadow:none}}

.anomaly-warehouse{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}.anomaly-warehouse>.row{margin-bottom:12px}.anomaly-warehouse h3{margin:0}.anomaly-warehouse .card h3{margin-bottom:14px}

.staff-sheet .salary-select-label{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.staff-sheet input.daily-salary-select{min-width:0;width:15px;height:15px;padding:0;margin:0;accent-color:var(--accent)}#salaryBatchBar{flex-wrap:wrap}#salaryBatchBar label{display:flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}#salaryBatchBar input{width:140px}#salaryBatchPreview{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Admin access-control workbench */
.admin-tabs{display:flex;gap:8px;margin:20px 0 16px;padding:5px;width:max-content;max-width:100%;border:1px solid var(--line);border-radius:12px;background:#0b1628}
.admin-tabs button{margin:0;background:transparent;color:var(--muted);font-weight:700}
.admin-tabs button[aria-selected="true"]{background:#075985;color:#fff}
.admin-role-picker{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin:16px 0}
.admin-role-picker label{display:grid;gap:5px;min-width:220px}
.permission-matrix{max-height:540px;margin:16px 0;border:1px solid var(--line);border-radius:12px}
.permission-matrix thead th{position:sticky;top:0;z-index:2;background:#14253e}
.permission-matrix td{vertical-align:middle}
.permission-matrix td:first-child{width:78%}
.permission-matrix td small{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.permission-matrix select{min-width:130px}
.permission-group th{background:#173152;color:#7dd3fc;letter-spacing:.08em;text-transform:uppercase}
.permission-bulk{display:inline-flex;gap:6px;flex-wrap:wrap;margin-left:12px;letter-spacing:normal;text-transform:none}
.permission-bulk button{font-size:11px;padding:4px 8px;min-height:28px}
[data-admin-section][hidden],#templateFields[hidden]{display:none!important}
@media(max-width:600px){.admin-tabs{width:100%}.admin-tabs button{flex:1}.permission-matrix td:first-child{min-width:230px}.permission-matrix select{min-width:115px}}
@media(max-width:700px){
  .table-wrap:has(#users){overflow:visible}
  table:has(#users),#users{display:block;width:100%}
  table:has(#users) thead{display:none}
  #users{display:grid;gap:12px}
  #users tr{display:block;padding:10px;border:1px solid var(--line);border-radius:12px;background:#0c1b30}
  #users td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 4px;min-height:38px;word-break:break-word}
  #users td::before{font-size:11px;color:var(--muted);flex:0 0 78px}
  #users td:nth-child(1)::before{content:'用户名'}
  #users td:nth-child(2)::before{content:'姓名'}
  #users td:nth-child(3)::before{content:'角色'}
  #users td:nth-child(4)::before{content:'状态'}
  #users td:nth-child(5)::before{content:'密码'}
  #users td:nth-child(6)::before{content:'FCL'}
  #users td:nth-child(7){display:flex;justify-content:flex-start;flex-wrap:wrap}
  #users td:nth-child(7)::before{content:'操作';flex-basis:100%}
  #users td select{min-width:0;max-width:190px}
  #users td button{font-size:12px;padding:7px 9px;margin:1px}
}
