#employee-work .employee-ops-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
#employee-work .employee-ops-head h2{margin:0 0 4px;font-size:24px;color:#10263a}
#employee-work .employee-ops-head p{margin:0;color:#71828f}
#employee-work .employee-ops-actor{padding:8px 12px;border-radius:999px;background:#eef6f4;color:#28675f;font-weight:700;white-space:nowrap}
#employee-work .employee-ops-filters{display:grid;grid-template-columns:170px 170px 190px auto;gap:10px;align-items:end;padding:12px;border-radius:12px;background:#f5f8f8}
#employee-work label{display:flex;flex-direction:column;gap:5px;color:#607381}
#employee-work input,#employee-work select{width:100%;min-height:42px;padding:8px 11px;border:1px solid #d3dfe3;border-radius:9px;background:#fff;color:#12283b;font:inherit;box-sizing:border-box}
#employee-work .employee-ops-filter-actions{display:flex;gap:8px}
#employee-work .employee-ops-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:12px 0}
#employee-work .employee-demo-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;padding:9px 12px;border:1px solid #dbc98a;border-radius:9px;background:#fff9df;color:#765b00}
#employee-work .employee-demo-banner[hidden]{display:none}
#employee-work .employee-demo-banner button{padding:5px 9px;font-size:12px;white-space:nowrap}
#employee-work .employee-ops-kpi{padding:13px 15px;border:1px solid #dce5e7;border-radius:12px;background:#fafcfc}
#employee-work .employee-ops-kpi small{display:block;color:#71828f}
#employee-work .employee-ops-kpi b{display:block;margin-top:4px;color:#183a3c;font-size:26px}
#employee-work .employee-compare{margin:12px 0;padding:13px;border:1px solid #dce5e7;border-radius:13px;background:#fff}
#employee-work .employee-compare header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
#employee-work .employee-compare h3{margin:0;color:#17393a;font-size:17px}
#employee-work .employee-compare p{margin:3px 0 0;color:#758994;font-size:12px}
#employee-work .employee-compare-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
#employee-work .employee-compare-card{display:grid;gap:6px;padding:11px;border:1px solid #dce5e7;border-radius:10px;background:#f9fbfb;color:#193244;text-align:left}
#employee-work .employee-compare-card.active{border-color:#3b8279;background:#eaf5f2;box-shadow:0 0 0 2px #d5e9e5}
#employee-work .employee-compare-name{font-size:16px;font-weight:850;color:#102b3e}
#employee-work .employee-compare-metrics{font-size:11px;color:#657b87;white-space:normal}
#employee-work .employee-wash-line{display:block;height:7px;border-radius:999px;background:#e3eceb;overflow:hidden}
#employee-work .employee-wash-line i{display:block;height:100%;border-radius:999px;background:#3f877e}
#employee-work .employee-wash-count{font-size:12px;color:#2d6660}
#employee-work .employee-compare-empty{grid-column:1/-1;padding:12px;text-align:center;color:#82939d}
#employee-work .employee-ops-kpis[hidden],#employee-work .employee-compare[hidden]{display:none!important}
#employee-work .employee-self-dispatch{margin:12px 0;padding:15px;border:1px solid #cfe0dc;border-radius:13px;background:#f4faf8}
#employee-work .employee-self-dispatch[hidden]{display:none!important}
#employee-work .employee-self-dispatch header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:11px}
#employee-work .employee-self-dispatch h3{margin:0;color:#153a36;font-size:18px}
#employee-work .employee-self-dispatch header p{margin:4px 0 0;color:#66817d;font-size:12px}
#employee-work .employee-self-dispatch-filters{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,1fr) auto;gap:8px;align-items:end}
#employee-work .employee-self-dispatch-filters label{display:grid;gap:4px;color:#607b77;font-size:12px}
#employee-work .employee-self-dispatch-filters button{min-height:42px}
#employee-work .employee-self-dispatch-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:11px}
#employee-work .employee-self-dispatch-kpis div{padding:11px;border:1px solid #d5e5e1;border-radius:10px;background:#fff}
#employee-work .employee-self-dispatch-kpis small{display:block;color:#6b827e;font-size:12px}
#employee-work .employee-self-dispatch-kpis b{display:block;margin-top:4px;color:#1d625a;font-size:23px}
#employee-work .employee-self-dispatch-note{margin:9px 0 0;color:#657c78;font-size:12px}
#employee-work .employee-self-actions{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(420px,1.2fr);gap:12px;margin-bottom:12px}
#employee-work .employee-ops-box{padding:15px;border:1px solid #dce5e7;border-radius:13px;background:#fff}
#employee-work .employee-ops-box h3{margin:0 0 4px;color:#132b3d;font-size:18px}
#employee-work .employee-ops-box .sub{margin:0 0 12px;color:#778a96;font-size:13px}
#employee-work .attendance-state{margin:12px 0;padding:11px;border-radius:9px;background:#eef6f4;color:#245f58;font-weight:700}
#employee-work .attendance-clock-button{width:100%;min-height:48px;font-size:17px;font-weight:800}
#employee-work .attendance-action-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px}
#employee-work .attendance-rest-button{min-height:48px;padding-inline:18px;font-size:15px;font-weight:800}
#employee-work .attendance-rest-row{background:#f3f7f6}
#employee-work .attendance-rest-row td{color:#52736f}
#employee-work tr.attendance-day-tone-0 td{background:#f4faf8}
#employee-work tr.attendance-day-tone-1 td{background:#f5f8fc}
#employee-work tr.attendance-day-tone-2 td{background:#fcf8f1}
#employee-work tr.attendance-day-tone-3 td{background:#f9f5fb}
#employee-work tr.attendance-missing-row td{color:#7a5860}
#employee-work tr.attendance-missing-row td:nth-child(6) b{color:#ab5a55}
#employee-work #washRows .wash-day-tone-0{--wash-day-bg:#f0f8f5;--wash-day-border:#86b5a6}
#employee-work #washRows .wash-day-tone-1{--wash-day-bg:#f0f5fc;--wash-day-border:#91accd}
#employee-work #washRows .wash-day-tone-2{--wash-day-bg:#fcf7ed;--wash-day-border:#cbb17b}
#employee-work #washRows .wash-day-tone-3{--wash-day-bg:#f7f1fa;--wash-day-border:#baa0ca}
#employee-work #washRows tr[class*="wash-day-tone-"]{background:var(--wash-day-bg)}
#employee-work #washRows tr[class*="wash-day-tone-"] td{background:var(--wash-day-bg)}
#employee-work #washRows tr.wash-day-heading{display:table-row}
#employee-work #washRows tr.wash-day-heading td{padding:12px;border-top:3px solid var(--wash-day-border);color:#244455}
#employee-work #washRows .wash-day-heading div{display:flex;justify-content:space-between;align-items:center;gap:16px}
#employee-work #washRows .wash-day-heading span{font-size:13px;font-weight:500;white-space:nowrap}
#employee-work.employee-view #washRows tr.wash-day-heading{display:block;margin-top:12px;border-radius:8px;overflow:hidden}
#employee-work.employee-view #washRows tr.wash-day-heading td{display:block;width:100%;box-sizing:border-box}
#employee-work .wash-form{display:grid;grid-template-columns:1fr 1fr;gap:9px}
#employee-work .wash-form .wide{grid-column:1/-1}
#employee-work .wash-type-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0;padding:0;border:0}
#employee-work .wash-type-picker legend{margin-bottom:5px;color:#607381}
#employee-work .wash-type-picker label{position:relative;display:block;cursor:pointer}
#employee-work .wash-type-picker input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
#employee-work .wash-type-picker span{display:grid;gap:3px;height:100%;padding:10px;border:1px solid #d3dfe3;border-radius:9px;background:#fff;color:#173142;box-sizing:border-box}
#employee-work .wash-type-picker b{font-size:15px}
#employee-work .wash-type-picker small{color:#71848e;font-size:11px;line-height:1.3}
#employee-work .wash-type-picker input:checked+span{border-color:#3d8379;background:#eaf5f2;box-shadow:0 0 0 2px #d5e9e5;color:#1e655d}
#employee-work .wash-vehicle-picker{position:relative;display:flex;min-width:0;flex-direction:column;gap:5px;color:#607381}
#employee-work .wash-vehicle-results{position:absolute;z-index:40;top:100%;right:0;left:0;display:grid;gap:4px;margin-top:4px;padding:5px;max-height:220px;overflow:auto;border:1px solid #cfddd7;border-radius:10px;background:#fff;box-shadow:0 12px 30px #1f493624}
#employee-work .wash-vehicle-results[hidden]{display:none}
#employee-work .wash-vehicle-results button{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;padding:8px 9px;border:1px solid #dce7e9;border-radius:8px;background:#f7fbfa;color:#173142;text-align:left}
#employee-work .wash-vehicle-results button b{font-size:14px}
#employee-work .wash-vehicle-results button span{min-width:0;color:#233c48;font-size:12px}
#employee-work .wash-vehicle-results button small{grid-column:1/-1;color:#607a86;font-size:11px}
#employee-work .wash-vehicle-results button:hover,#employee-work .wash-vehicle-results button:focus{border-color:#4d8c83;background:#eaf5f2}
#employee-work .wash-vehicle-hint{min-height:16px;color:#758993;font-size:11px;line-height:1.35}
#employee-work .wash-vehicle-empty{padding:9px;color:#758993;font-size:12px}
#employee-work .wash-photo-record-button{min-height:50px;font-size:17px;font-weight:850;background:#3f8379;color:#fff}
#employee-work .wash-photo-record-button:disabled{background:#aebbb8;color:#f4f7f6;cursor:not-allowed}
#employee-work .photo-pick{display:flex;align-items:center;gap:10px;min-height:44px}
#employee-work .photo-pick img{width:64px;height:48px;object-fit:cover;border-radius:7px;border:1px solid #d3dfe3}
#employee-work .employee-ops-section{margin-top:12px;padding:0;border:1px solid #dce5e7;border-radius:13px;overflow:hidden;background:#fff}
#employee-work .employee-ops-section header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#f1f7f6}
#employee-work .employee-ops-section h3{margin:0;color:#17393a;font-size:17px}
#employee-work .employee-ops-table-wrap{overflow:auto}
#employee-work table{width:100%;border-collapse:collapse;min-width:720px}
#employee-work th,#employee-work td{padding:10px 12px;border-bottom:1px solid #e5ecee;text-align:left;vertical-align:middle}
#employee-work th{color:#637985;font-weight:600;background:#fafcfc;white-space:nowrap}
#employee-work td{color:#183044}
#employee-work .employee-name,#employee-work .plate{font-weight:800;color:#10293c}
#employee-work .photo-link{padding:4px 9px;border:1px solid #83afa8;border-radius:7px;background:#fff;color:#276d65;font-weight:700}
#employee-work .employee-record-delete{padding:4px 9px;border:1px solid #dc8b7e;border-radius:7px;background:#fff7f5;color:#a33c2d;font-weight:750;white-space:nowrap}
#employee-work .employee-record-delete:hover{background:#a33c2d;color:#fff}
#employee-work .empty-row{text-align:center;color:#83949d;padding:22px}
#employee-work.employee-view .my-clock small{display:block;color:#71838e;font-size:11px}
#employee-work.employee-view .my-clock b{color:#143247;font-size:15px}
#employee-work.employee-view .my-record-date,#employee-work.employee-view .my-wash-time{color:#55717d;font-weight:750}
#employee-work.employee-view .my-wash-note{color:#607783}
#employee-work.employee-view .employee-ops-head,#employee-work.employee-view .employee-ops-filters{display:none}
#employeeOpsLightbox{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(9,20,28,.78)}
#employeeOpsLightbox[hidden]{display:none}
#employeeOpsLightbox img{max-width:min(92vw,900px);max-height:88vh;border-radius:10px;background:#fff}
#employeeOpsLightbox button{position:absolute;right:18px;top:18px;width:42px;height:42px;border-radius:50%;font-size:24px}
#attendanceWatermarkCamera{position:fixed;inset:0;z-index:1250;display:flex;align-items:center;justify-content:center;padding:14px;background:rgba(7,18,24,.88)}
#attendanceWatermarkCamera[hidden]{display:none}
#attendanceWatermarkCamera .attendance-camera-dialog{width:min(94vw,560px);padding:13px;border-radius:15px;background:#fff;box-shadow:0 20px 60px #0008}
#attendanceWatermarkCamera header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
#attendanceWatermarkCamera h3{margin:0;color:#10283a;font-size:20px}
#attendanceWatermarkCamera header p{margin:3px 0 0;color:#687d89;font-size:12px}
#attendanceWatermarkCamera #attendanceCameraClose{width:38px;height:38px;padding:0;font-size:22px}
#attendanceWatermarkCamera .attendance-camera-stage{position:relative;overflow:hidden;border-radius:11px;background:#0c171d;aspect-ratio:3/4}
#attendanceWatermarkCamera video{width:100%;height:100%;object-fit:cover}
#attendanceWatermarkCamera .attendance-camera-guide{position:absolute;right:10px;bottom:10px;left:10px;padding:7px 9px;border-radius:7px;background:#06131bb8;color:#fff;text-align:center;font-size:12px}
#attendanceWatermarkCamera .attendance-camera-location{margin:9px 0;padding:8px;border-radius:8px;background:#eef6f4;color:#296a61;font-size:12px;line-height:1.4}
#attendanceWatermarkCamera .attendance-camera-capture{width:100%;min-height:48px;font-size:16px;font-weight:850}
#washWatermarkCamera{position:fixed;inset:0;z-index:1250;display:flex;align-items:center;justify-content:center;padding:14px;background:rgba(7,18,24,.88)}
#washWatermarkCamera[hidden]{display:none}
#washWatermarkCamera .wash-camera-dialog{width:min(94vw,560px);padding:13px;border-radius:15px;background:#fff;box-shadow:0 20px 60px #0008}
#washWatermarkCamera header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
#washWatermarkCamera h3{margin:0;color:#10283a;font-size:20px}
#washWatermarkCamera header p{margin:3px 0 0;color:#687d89;font-size:12px}
#washWatermarkCamera #washCameraClose{width:38px;height:38px;padding:0;font-size:22px}
#washWatermarkCamera .wash-camera-stage{position:relative;overflow:hidden;border-radius:11px;background:#0c171d;aspect-ratio:3/4}
#washWatermarkCamera video{width:100%;height:100%;object-fit:cover}
#washWatermarkCamera .wash-camera-guide{position:absolute;right:10px;bottom:10px;left:10px;padding:7px 9px;border-radius:7px;background:#06131bb8;color:#fff;text-align:center;font-size:12px}
#washWatermarkCamera .wash-camera-time{margin:9px 0;padding:8px;border-radius:8px;background:#eef6f4;color:#296a61;font-size:12px;line-height:1.4}
#washWatermarkCamera .wash-camera-capture{width:100%;min-height:48px;font-size:16px;font-weight:850}
@media(max-width:768px){
  #employee-work>.card{margin:8px -8px 78px;padding:10px;border:0;border-radius:0;background:#f4f7f8}
  #employee-work .employee-ops-head{gap:8px;margin-bottom:8px}
  #employee-work .employee-ops-head h2{font-size:19px}
  #employee-work .employee-ops-head p{font-size:11px;line-height:1.25}
  #employee-work .employee-ops-actor{padding:5px 8px;font-size:11px}
  #employee-work .employee-ops-filters{grid-template-columns:1fr 1fr;gap:6px;padding:7px}
  #employee-work .employee-ops-filters label{font-size:11px}
  #employee-work .employee-ops-filters input{min-height:34px;padding:5px 7px;font-size:12px}
  #employee-work .employee-ops-filter-actions{grid-column:1/-1}
  #employee-work .employee-ops-filter-actions button{flex:1;min-height:34px;padding:5px 8px;font-size:12px}
  #employee-work .employee-ops-kpis{gap:5px;margin:7px 0}
  #employee-work .employee-demo-banner{margin-top:6px;padding:6px 8px;font-size:11px}
  #employee-work .employee-ops-kpi{padding:7px 8px;border-radius:8px}
  #employee-work .employee-ops-kpi small{font-size:10px;white-space:nowrap}
  #employee-work .employee-ops-kpi b{font-size:19px}
  #employee-work .employee-compare{margin:7px 0;padding:8px;border-radius:9px}
  #employee-work .employee-compare header{margin-bottom:6px}
  #employee-work .employee-compare h3{font-size:14px}
  #employee-work .employee-compare p{font-size:10px}
  #employee-work .employee-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  #employee-work .employee-compare-card{gap:4px;padding:7px;border-radius:7px}
  #employee-work .employee-compare-name{font-size:14px}
  #employee-work .employee-compare-metrics{font-size:9px}
  #employee-work .employee-wash-count{font-size:11px}
  #employee-work .employee-self-dispatch{margin:7px 0;padding:10px;border-radius:9px}
  #employee-work .employee-self-dispatch h3{font-size:16px}
  #employee-work .employee-self-dispatch-filters{grid-template-columns:1fr 1fr}
  #employee-work .employee-self-dispatch-filters button{grid-column:1/-1;min-height:38px}
  #employee-work .employee-self-dispatch-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:8px}
  #employee-work .employee-self-dispatch-kpis div{padding:8px}
  #employee-work .employee-self-dispatch-kpis b{font-size:20px}
  #employee-work .employee-self-actions{grid-template-columns:1fr;gap:7px;margin-bottom:7px}
  #employee-work .employee-ops-box{padding:10px;border-radius:9px}
  #employee-work .employee-ops-box h3{font-size:16px}
  #employee-work .employee-ops-box .sub{margin-bottom:7px;font-size:11px}
  #employee-work .attendance-state{margin:7px 0;padding:8px;font-size:13px}
  #employee-work .attendance-clock-button{min-height:41px;font-size:15px}
  #employee-work .attendance-rest-button{min-height:41px;padding-inline:12px;font-size:13px}
  #employee-work .attendance-action-row{grid-template-columns:1fr 1fr}
  #employee-work .attendance-rest-button{grid-column:1/-1}
  #employee-work .wash-form{gap:6px}
  #employee-work .wash-vehicle-results{right:auto;width:min(86vw,360px);max-height:190px}
  #employee-work .wash-vehicle-results button{padding:7px 8px}
  #employee-work input,#employee-work select{min-height:36px;padding:6px 8px;font-size:13px}
  #employee-work .photo-pick{min-height:38px;font-size:12px}
  #employee-work .photo-pick img{width:52px;height:39px}
  #employee-work .employee-ops-section{margin-top:7px;border-radius:9px}
  #employee-work .employee-ops-section header{padding:8px 9px}
  #employee-work .employee-ops-section h3{font-size:15px}
  #employee-work table{min-width:0}
  #employee-work thead{display:none}
  #employee-work tbody{display:grid;gap:5px;padding:5px}
  #employee-work tr{display:grid;grid-template-columns:1fr auto;gap:3px 8px;padding:7px 8px;border:1px solid #e0e8e9;border-radius:8px;background:#fff}
  #employee-work td{padding:0;border:0;font-size:12px}
  #employee-work td:nth-child(1),#employee-work td:nth-child(2){font-weight:750}
  #employee-work td:nth-child(n+3){color:#657b87}
  #employee-work td:last-child{grid-column:2;grid-row:1/-1;align-self:center}
  #employee-work .wash-table td:nth-child(3){font-weight:800;color:#10293c}
  #employee-work .empty-row{grid-column:1/-1!important;padding:15px!important}
  #employee-work.employee-view .employee-ops-head{align-items:center}
  #employee-work.employee-view .employee-ops-head h2{font-size:18px}
  #employee-work.employee-view .employee-ops-filters{grid-template-columns:1fr 1fr}
  #employee-work.employee-view .employee-ops-filter-actions{display:grid;grid-template-columns:1fr 1fr}
  #employee-work.employee-view .employee-self-actions{margin-top:6px}
  #employee-work.employee-view tr.my-attendance-record{grid-template-columns:1fr 1fr auto;gap:4px 10px;padding:9px}
  #employee-work.employee-view .my-attendance-record .my-record-date{grid-column:1/3;grid-row:1}
  #employee-work.employee-view .my-attendance-record .my-clock{grid-row:2;color:#143247}
  #employee-work.employee-view .my-attendance-record .my-record-photo{grid-column:3;grid-row:1/3;align-self:center;display:grid;gap:4px}
  #employee-work .wash-type-picker{gap:5px}
  #employee-work .wash-type-picker span{padding:8px 6px}
  #employee-work .wash-type-picker b{font-size:13px}
  #employee-work .wash-type-picker small{font-size:9px}
  #employee-work .wash-photo-record-button{min-height:44px;font-size:16px}
  #employee-work.employee-view tr.my-wash-record{grid-template-columns:1fr auto auto;gap:3px 8px;padding:9px}
  #employee-work.employee-view .my-wash-record .my-wash-time{grid-column:1;grid-row:1}
  #employee-work.employee-view .my-wash-record .my-wash-type{grid-column:2;grid-row:1;color:#2f6d64;font-weight:750}
  #employee-work.employee-view .my-wash-record .my-wash-score{grid-column:3;grid-row:1;color:#9a6013}
  #employee-work.employee-view .my-wash-record .plate{grid-column:1;grid-row:2;font-size:14px}
  #employee-work.employee-view .my-wash-record .my-record-photo{grid-column:2;grid-row:2;align-self:center}
  #employee-work.employee-view .my-wash-record .my-wash-delete{grid-column:3;grid-row:2;align-self:center}
  #attendanceWatermarkCamera{padding:7px}
  #attendanceWatermarkCamera .attendance-camera-dialog{width:100%;padding:9px;border-radius:11px}
  #attendanceWatermarkCamera .attendance-camera-stage{max-height:64vh}
  #washWatermarkCamera{padding:7px}
  #washWatermarkCamera .wash-camera-dialog{width:100%;padding:9px;border-radius:11px}
  #washWatermarkCamera .wash-camera-stage{max-height:64vh}
}
#employee-work.manager-view .employee-ops-kpis,
#employee-work.manager-view .employee-compare{display:none!important}
