:root{--green:#123b30;--deep:#092a22;--lime:#d7f66d;--ink:#16382e;--muted:#66786f;--line:#dde5df;--paper:#f4f7f3;--white:#fff;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #77a834;outline-offset:4px}button{border:0;border-radius:12px;padding:14px 20px;font-weight:650;font-size:1rem;min-height:48px;background:var(--green);color:#fff}button.secondary{background:#edf2ed;color:var(--ink)}button.outline{background:transparent;border:1px solid var(--line);color:var(--ink)}button.small{padding:9px 13px;min-height:40px;font-size:.875rem}input{width:100%;padding:14px;border:1px solid #cbd8cf;border-radius:10px;background:#fff;min-height:48px;color:var(--ink)}label{display:block;font-size:.875rem;font-weight:600;margin-bottom:8px}form{display:grid;gap:20px}.field{display:grid;gap:0}a{color:var(--green)}h1,h2,h3,p{margin:0}h1{font-size:2.4rem;letter-spacing:-.045em;line-height:1.15}h2{font-size:1.35rem;letter-spacing:-.025em}h3{font-size:1rem}p{line-height:1.6}.muted{color:var(--muted)}.eyebrow{font-size:.75rem;letter-spacing:.12em;font-weight:700;text-transform:uppercase}.brand{display:flex;gap:10px;align-items:center;font-size:1.2rem;font-weight:800;letter-spacing:-.04em}.brand b{display:grid;place-items:center;background:var(--lime);color:var(--deep);width:35px;height:35px;border-radius:50%;font-size:1.5rem;transform:rotate(-12deg)}.brand small{font-weight:450}.login{min-height:100dvh;display:grid;grid-template-columns:1fr 1fr}.login-art{background:var(--green);color:white;padding:56px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.login-art .wordmark{font-size:clamp(3rem,6vw,6.8rem);line-height:.94;letter-spacing:-.065em;font-weight:750;margin:70px 0 35px}.login-art .wordmark span{color:var(--lime)}.login-art .art-bottom{border-top:1px solid #ffffff30;padding-top:22px;display:flex;justify-content:space-between;color:#c5d7c7;font-size:.875rem}.login-form{display:flex;justify-content:center;align-items:center;padding:48px 28px}.login-form>div{width:100%;max-width:390px}.login-form h1{margin:22px 0 14px}.login-form form{margin-top:32px}.login-form .brand{display:none}.login-form .legal{font-size:.875rem;margin-top:30px;color:var(--muted)}.shell{min-height:100dvh;display:grid;grid-template-columns:240px 1fr}.sidebar{background:var(--green);color:#fff;padding:34px 24px;display:flex;flex-direction:column;position:sticky;top:0;height:100dvh}.sidebar nav{display:grid;gap:8px;margin-top:58px}.sidebar nav button{background:transparent;color:#c3d4c9;text-align:left;padding:15px 18px;border-radius:10px}.sidebar nav button.active{background:var(--lime);color:var(--deep)}.sidebar .foot{margin-top:auto;font-size:.875rem;color:#b5cbbb;display:grid;gap:18px}.sidebar .foot button{background:#ffffff12;text-align:left;color:#fff}.main{padding:34px 48px;max-width:1480px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:35px;font-size:.875rem}.profile{display:flex;align-items:center;gap:12px}.avatar{height:38px;width:38px;background:#e4ecdc;border-radius:50%;display:grid;place-items:center;font-weight:700}.title-row{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:30px}.title-row h1{font-size:2rem;margin-top:8px}.badge{display:inline-flex;align-items:center;gap:8px;background:#eaf0df;padding:8px 12px;border-radius:30px;font-size:.8125rem;font-weight:600;white-space:nowrap}.grid{display:grid;grid-template-columns:1.3fr 1fr;gap:24px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px}.card-header{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:24px}.clock-card{background:var(--green);color:#fff;border:0;position:relative}.clock-card .eyebrow{color:#bdd0c3}.clock{font-size:clamp(3.2rem,6vw,5rem);line-height:1.1;font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:-.055em;margin:28px 0 12px}.clock-card .date{color:#d4e3d8;font-size:.9375rem}.clock-card .action-row{display:flex;gap:12px;margin-top:32px}.clock-card button{background:var(--lime);color:var(--deep);flex:1}.clock-card button.secondary{background:#ffffff15;color:white;border:1px solid #ffffff35}.status-list{display:grid;gap:0}.status-item{display:flex;gap:16px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}.status-item:last-child{border:0}.status-icon{background:var(--paper);height:48px;width:48px;display:grid;place-items:center;border-radius:12px;font-size:1.35rem}.status-item .time{margin-left:auto;font-size:1.4rem;font-weight:650;letter-spacing:-.025em}.status-item p{font-size:.875rem;color:var(--muted);margin-top:4px}.venue{margin-top:24px;display:flex;align-items:center;gap:14px;font-size:.875rem;padding:17px 20px;background:#eaf0e6;border-radius:12px}.venue strong{display:block;margin-bottom:3px}.section{margin-top:28px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:650;padding:12px 16px;border-bottom:1px solid var(--line)}td{padding:17px 16px;font-size:.9375rem;border-bottom:1px solid #edf1ec}tr:last-child td{border:0}.empty{padding:40px 20px;text-align:center;color:var(--muted);line-height:1.6}.empty strong{display:block;color:var(--ink);margin-bottom:8px}.error{color:#a33424;background:#fff0ec;padding:13px 16px;border-radius:10px;font-size:.9375rem;line-height:1.5}.hint{font-size:.875rem;color:var(--muted);line-height:1.55}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.toolbar input{width:auto}.forms-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.form-actions{display:flex;gap:10px}.loading{display:grid;place-items:center;min-height:60vh;color:var(--muted)}#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);background:var(--deep);color:white;padding:16px 24px;border-radius:12px;box-shadow:0 8px 40px #0002;z-index:100;display:none}dialog{border:0;border-radius:22px;padding:0;width:min(460px,calc(100% - 24px));color:var(--ink);max-height:94dvh;overflow:auto}dialog::backdrop{background:#062018b3;backdrop-filter:blur(4px)}.dialog-inner{padding:24px}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.dialog-top button{background:#f0f3ee;color:var(--ink);padding:8px 14px;min-height:40px}.camera{background:#10231d;aspect-ratio:3/4;max-height:48dvh;width:100%;border-radius:14px;overflow:hidden;position:relative}.camera video,.camera img{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera .camera-label{position:absolute;bottom:14px;left:14px;color:white;background:#0007;padding:7px 10px;border-radius:7px;font-size:.8125rem}.camera-status{padding:14px 0;font-size:.875rem;line-height:1.6}.dialog-actions{display:flex;gap:10px}.dialog-actions button{flex:1}.dialog-inner .error{margin-bottom:14px}.photo-view{width:100%;border-radius:10px}.inline-link{font-size:.875rem;background:none;color:var(--green);padding:4px 0;min-height:0;text-decoration:underline}.stack{display:grid;gap:20px}.check{display:flex;align-items:center;gap:10px}.check input{width:18px;min-height:18px}.check label{margin:0}.mobile-brand{display:none}.small-label{font-size:.8125rem}.report-photo{display:flex;gap:10px;align-items:center}.report-photo a{font-size:.875rem}.login-tag{display:inline-flex;background:#e4ecd9;padding:8px 12px;border-radius:8px;font-size:.75rem;font-weight:700;letter-spacing:.08em}.wide{grid-column:1/-1}
@media(max-width:1100px){.main{padding:28px}.shell{grid-template-columns:210px 1fr}.sidebar{padding:30px 18px}.grid{grid-template-columns:1fr}.forms-grid{grid-template-columns:1fr}.login-art{padding:40px}.clock{font-size:4rem}}
@media(max-width:700px){.login{display:block}.login-art{display:none}.login-form{min-height:100dvh;padding:32px 26px}.login-form .brand{display:flex;margin-bottom:54px}.shell{display:block}.sidebar{position:static;height:auto;padding:20px}.sidebar>.brand{font-size:1.15rem}.sidebar nav{display:flex;margin-top:20px;overflow:auto;gap:6px}.sidebar nav button{white-space:nowrap;font-size:.875rem;padding:11px 14px;min-height:42px}.sidebar .foot{display:none}.main{padding:22px 18px}.topbar{margin-bottom:25px;padding-bottom:18px}.title-row{align-items:flex-start;margin-bottom:22px}.title-row h1{font-size:1.8rem}.title-row>.badge{display:none}.card{padding:22px;border-radius:16px}.grid{gap:18px}.clock{font-size:3.8rem;margin-top:24px}.clock-card .action-row{margin-top:26px}.clock-card button{padding:14px 10px}.card-header{align-items:flex-start;flex-wrap:wrap}.venue{align-items:flex-start;margin-top:18px}.section{margin-top:20px}th,td{padding-left:10px;padding-right:10px}.topbar>.muted{font-size:.8125rem}.profile{gap:8px}.profile span{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clock-card .eyebrow{font-size:.75rem}.toolbar{width:100%}.toolbar input{min-width:0;flex:1}.login-form h1{font-size:2.2rem}}

.salary-fields{border:1px solid var(--line);border-radius:12px;padding:18px;display:grid;gap:18px;margin:0;min-width:0}.salary-fields legend{font-weight:700;padding:0 8px}.pay-total{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px;padding:18px;background:var(--paper);border-radius:12px}.pay-total strong{font-size:1.4rem;white-space:nowrap}#holiday-year{max-width:120px}@media(max-width:700px){.pay-total{align-items:flex-start;flex-direction:column}}

select{width:100%;padding:14px;border:1px solid #cbd8cf;border-radius:10px;background:white;min-height:48px;font:inherit;color:var(--ink)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.my-shift{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;border-bottom:1px solid #ffffff30;padding-bottom:20px;margin-bottom:20px}.my-shift .eyebrow{width:100%}.my-shift strong{font-size:1.25rem;color:var(--lime)}.my-shift span{font-size:.875rem;color:#d4e3d8}.camera-shift{margin-bottom:16px}.shift-choices{display:grid;gap:12px}.shift-choices button{text-align:left;display:flex;flex-direction:column;gap:7px}.shift-choices span{font-size:.875rem;color:var(--muted)}.calendar-card{padding:16px}.calendar-scroll{overflow-x:auto}.calendar-week,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));min-width:650px}.calendar-week div{padding:12px;font-size:.875rem;font-weight:600;text-align:center}.calendar-grid{gap:5px}.calendar-cell{background:#f5f8f3;color:var(--ink);text-align:left;padding:12px;min-height:134px;border:2px solid transparent;border-radius:10px;display:flex;flex-direction:column;gap:6px;justify-content:flex-start;font-weight:500}.calendar-cell:hover{background:#eaf0df}.calendar-cell.selected{border-color:var(--green);background:#e7efda}.day-number{font-size:.875rem;font-weight:700;display:inline-flex;justify-content:center;align-items:center;align-self:flex-start;min-width:25px;height:25px}.calendar-cell.today .day-number{background:var(--green);color:white;border-radius:50%}.calendar-person{font-size:.875rem;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.calendar-person small{display:block;font-size:.75rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis}.shift-day-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.shift-person{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:16px 0}.shift-person:last-child{padding-bottom:0}@media(max-width:700px){.shift-day-grid{grid-template-columns:1fr}.calendar-card{padding:10px}.calendar-cell{min-height:116px}.title-row:has(#calendar-month){flex-wrap:wrap}}

.main{min-width:0}select:focus-visible{outline:3px solid #77a834;outline-offset:4px}

/* Payroll day-by-day matrix */
.payroll-matrix-card{min-width:0}.matrix-legend{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 12px;font-size:.76rem}.matrix-legend>span{padding:8px 10px;border-radius:7px}.matrix-help{margin-bottom:16px}.matrix-scroll{overflow:auto;max-height:70vh;border:1px solid #dce4ec;border-radius:13px;overscroll-behavior-x:contain}.payroll-matrix{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:.82rem}.payroll-matrix th,.payroll-matrix td{border-right:1px solid #dce4ec;border-bottom:1px solid #dce4ec;vertical-align:top;white-space:normal;padding:0;min-width:165px;width:165px}.payroll-matrix thead th{position:sticky;top:0;background:#f0f4f8;z-index:3;text-align:center;padding:14px 10px;color:#617083;font-size:.7rem;letter-spacing:.06em}.payroll-matrix thead th span,.payroll-matrix thead th strong{display:block}.payroll-matrix .matrix-person{position:sticky;left:0;z-index:2;min-width:225px;width:225px;background:white;padding:16px;text-align:left;box-shadow:3px 0 8px #18384908}.payroll-matrix thead .matrix-person{z-index:4;background:#f0f4f8}.payroll-matrix .matrix-week-start{border-left:2px solid #b6c6d6}.matrix-name{font-size:.92rem;display:block;letter-spacing:0;text-transform:none}.matrix-person-lines{display:grid;gap:8px;border-top:1px solid #dce4ec;margin-top:12px;padding-top:12px;font-size:.72rem;font-weight:400;color:#6b7682}.matrix-person-lines>div{display:flex;justify-content:space-between;gap:8px}.matrix-person-lines strong{color:#425563}.matrix-summary{background:#e3f2ff;border-radius:9px;padding:12px;margin-top:14px;display:grid;gap:6px;font-size:.7rem;color:#34627f;font-weight:400}.matrix-summary>strong{font-size:1rem;color:#115c86}.matrix-summary small{font-size:.68rem}.matrix-warning-text{color:#976000}.matrix-ok{background:#effbf4;color:#21613e}.matrix-bonus{background:#edf5ff;color:#195f91}.matrix-warning{background:#fff6d6;color:#8b6413}.matrix-empty{background:#f6f8fb;color:#758395}.matrix-day-button{width:100%;min-height:184px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;border-radius:0;background:transparent;color:inherit;padding:15px 13px;font-size:.76rem;font-weight:400;line-height:1.5}.matrix-day-button:hover{background:#ffffff70}.matrix-status{font-size:.86rem}.matrix-shift{font-size:.69rem;opacity:.85}.matrix-formula{border-top:1px solid #b5c9d377;width:100%;padding-top:9px;font-size:.7rem}.matrix-amount{font-size:.92rem;color:#314a5b}.matrix-footer{position:sticky;bottom:10px;z-index:5;background:white;border:1px solid #d1dde5;border-radius:14px;box-shadow:0 8px 24px #16382e14;margin:18px 0 0;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.matrix-footer>div:first-child{display:grid;gap:4px}.matrix-footer strong{font-size:1.2rem;color:#115c86}.matrix-footer .toolbar{flex-wrap:wrap}details>summary{cursor:pointer;font-weight:650;padding:3px 0}.main{min-width:0}@media(max-width:600px){.payroll-matrix .matrix-person{min-width:155px;width:155px;padding:12px}.payroll-matrix th,.payroll-matrix td{min-width:150px;width:150px}.matrix-person-lines>div{display:grid;gap:2px}.matrix-footer{position:static;flex-direction:column;align-items:stretch;padding:13px}.matrix-scroll{max-height:65vh}.matrix-summary{padding:9px}.matrix-legend{font-size:.68rem}}
.payroll-matrix tbody .matrix-person{text-transform:none;letter-spacing:normal;font-size:.82rem}.matrix-scroll{scroll-padding-left:225px}@media(max-width:600px){.matrix-scroll{scroll-padding-left:155px}}
.matrix-severe{background:#fff0ef;color:#9b2824}.timing-warning{display:block;background:#fff1bc;color:#855c0c;border:1px solid #e9cb72;padding:5px 7px;border-radius:6px;font-size:.72rem;font-weight:650;line-height:1.45;margin:3px 0}.timing-warning.timing-severe{background:#ffe0dd;color:#a42020;border-color:#e88d85;border-left:4px solid #c52c2c}.matrix-edit{margin:0 12px 14px;text-decoration:underline;font-size:.76rem}.matrix-locked{display:block;padding:0 12px 14px;font-size:.68rem;color:#617083}.matrix-inline-edit{padding:12px;border-top:1px solid #cbd8df;background:#fff;gap:10px;min-width:155px}.matrix-inline-edit label{font-size:.72rem;margin:0}.matrix-inline-edit input{padding:8px;min-height:40px;font-size:.8rem}.matrix-inline-edit button{font-size:.75rem;padding:8px}.matrix-inline-edit .form-error{font-size:.75rem}
