:root{--bg:#f6f7f9;--paper:#fff;--ink:#202e3b;--muted:#687582;--line:#e3e8ed;--accent:#24664f;--tint:#eaf4ef;--danger:#a63b3b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,input,select{font:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);padding:10px 15px;font-weight:550;display:inline-flex;gap:8px;align-items:center;justify-content:center}button:hover{background:#f0f4f2;border-color:#bdccc5}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}button.primary:hover{background:#184e3b}button.ghost{border-color:transparent;background:transparent;color:var(--muted)}button.danger{color:var(--danger)}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}input,select{border:1px solid #cfd8df;border-radius:6px;padding:10px 12px;background:#fff;color:var(--ink);min-width:0}input:focus,select:focus{border-color:var(--accent)}:focus-visible{outline:3px solid #78bda3;outline-offset:2px}::selection{background:#c6e7d8}input{caret-color:var(--accent)}.shell{display:grid;grid-template-columns:218px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#fff;border-right:1px solid var(--line);padding:28px 16px 20px;display:flex;flex-direction:column}.brand{display:flex;gap:11px;align-items:center;padding:0 12px 35px;font-weight:750;font-size:26px;letter-spacing:-.8px}.brandmark{width:33px;height:33px;background:var(--accent);color:white;display:grid;place-items:center;border-radius:9px}.brandmark svg{width:23px;height:23px}.nav{display:grid;gap:6px}.nav button{justify-content:flex-start;border:0;padding:13px 15px;background:transparent;color:#64717d;font-weight:500}.nav button.active{background:var(--tint);color:var(--accent);font-weight:650}.nav svg{margin-right:4px}.sidefoot{margin-top:auto;padding:18px 12px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.7}.status-dot{display:inline-block;width:7px;height:7px;background:#3d9271;border-radius:50%;margin-right:6px}.topbar{height:76px;border-bottom:1px solid var(--line);background:#fff;padding:0 32px;display:flex;justify-content:space-between;align-items:center}.crumb{color:var(--muted);font-size:13px}.account{display:flex;gap:12px;align-items:center}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e8ede9;color:#426151;font-size:12px;font-weight:650}.account small{display:block;color:var(--muted);font-size:11px;margin-top:3px}main{padding:31px 32px 45px;max-width:1800px;margin:auto}.pagehead{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:25px}.pagehead h1{font-size:29px;letter-spacing:-.8px;margin:0 0 8px;font-weight:650}.sub{color:var(--muted);line-height:1.6;margin:0}.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:21px;flex-wrap:wrap}.filters{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.filters select{min-width:200px;font-weight:600}.month{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:7px;padding:2px}.month button{border:0;padding:8px}.month input{border:0;width:175px;padding:7px}.terms{display:flex;align-items:center;gap:16px;color:var(--muted);font-size:12px;margin-bottom:17px}.terms strong{color:var(--ink);font-weight:550}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:10px;background:#fff;margin:0 0 23px;padding:20px 0}.metric{padding:0 23px;border-right:1px solid var(--line)}.metric:last-child{border:0}.metric span{color:var(--muted);font-size:12px}.metric strong{display:block;font-size:25px;letter-spacing:-.6px;font-weight:600;margin:10px 0 4px;font-variant-numeric:tabular-nums}.metric small{font-size:11px;color:var(--muted)}.metric:last-child strong{color:var(--accent)}.table-panel{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}.table-title{padding:17px 20px;display:flex;justify-content:space-between;gap:10px;align-items:center;border-bottom:1px solid var(--line)}.table-title h2{font-size:15px;margin:0}.table-title span{color:var(--muted);font-size:12px}.table-scroll{overflow:auto;max-height:590px;scrollbar-color:#bdc9c2 #f5f7f6;scrollbar-width:thin}table{border-collapse:separate;border-spacing:0;width:100%;font-variant-numeric:tabular-nums}th,td{border-bottom:1px solid #edf0f2;border-right:1px solid #edf0f2;text-align:center;padding:0;height:35px;min-width:148px}th{font-weight:550;background:#f8faf9}thead th{height:69px;position:sticky;top:0;z-index:3;border-bottom:1px solid #dbe3df}th:first-child,td:first-child{min-width:150px;width:150px;text-align:left;padding:0 18px;position:sticky;left:0;z-index:2;background:#fff}thead th:first-child{z-index:4;background:#f8faf9;color:var(--muted);font-size:12px}.employee-head{display:flex;gap:9px;align-items:center;justify-content:center;padding:10px}.employee-head .avatar{width:29px;height:29px;font-size:10px;background:#e8eef7;color:#4c6281}.employee-head small{display:block;font-weight:400;color:var(--muted);font-size:10px;margin-top:3px}.daynum{display:inline-block;width:26px}.weekday{font-size:11px;color:var(--muted)}.weekend td{background:#fafbf9}.weekend td:first-child{background:#f5f7f4}.today td:first-child{color:var(--accent);font-weight:700}.hour{border:0;border-radius:0;background:transparent;text-align:center;width:100%;height:34px;padding:0;font-size:13px;font-variant-numeric:tabular-nums;appearance:textfield}.hour::-webkit-inner-spin-button{appearance:none}.hour::placeholder{color:#c8d0d5}.hour.filled{color:var(--accent);background:#edf5f0;font-weight:600}.hour:hover{background:#e5efe9}.hour:focus{background:#dcefe4;outline:2px solid #74ad93;outline-offset:-2px}.totals td{font-size:12px;background:#fbfcfc;height:37px;font-weight:550}.totals td:first-child{background:#f7f9f8;font-weight:400;white-space:nowrap}.totals.salary td{background:#eaf4ef;color:#245f49;font-weight:650}.tablefoot{padding:13px 19px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:12px}.empty{background:white;border:1px dashed #cbd6cf;border-radius:10px;padding:60px 28px;text-align:center}.empty h2{font-size:22px;font-weight:600}.empty p{color:var(--muted);line-height:1.7;max-width:470px;margin:0 auto 22px}.empty svg{width:40px;height:40px;color:var(--accent)}.section{margin-top:28px}.section h2{font-size:18px;font-weight:600}.list{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden}.list-row{display:flex;justify-content:space-between;align-items:center;padding:19px 23px;border-bottom:1px solid var(--line);gap:15px}.list-row:last-child{border-bottom:0}.person{display:flex;gap:13px;align-items:center}.list-row strong{display:block;font-weight:600}.list-row small{display:block;color:var(--muted);margin-top:5px}.badge{font-size:11px;background:var(--tint);padding:5px 8px;border-radius:4px;color:var(--accent)}.form-page{max-width:650px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px}.field{display:flex;flex-direction:column;gap:8px;margin-bottom:19px}.field label{font-size:13px;font-weight:550}.field small,.note{font-size:12px;line-height:1.65;color:var(--muted)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}dialog{padding:0;border:0;border-radius:12px;box-shadow:0 24px 90px #182d3340;width:480px;max-width:calc(100vw - 28px);color:var(--ink)}dialog::backdrop{background:#1b2c3959}dialog header{padding:22px 25px 18px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}dialog h2{font-size:20px;margin:0}dialog form{padding:23px 25px}dialog footer{display:flex;justify-content:flex-end;gap:9px;margin-top:25px}.checklist{max-height:320px;overflow:auto}.check{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line)}.check input{accent-color:var(--accent);width:17px;height:17px}.error{color:var(--danger);font-size:13px;margin:12px 0;line-height:1.5}.hidden{display:none!important}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#253f33;color:#fff;padding:12px 22px;border-radius:8px;box-shadow:0 7px 25px #20332c26;z-index:20;display:none;max-width:90vw}.lock{min-height:100vh;display:grid;place-items:center}.lock>div{padding:40px;max-width:440px;text-align:center}.save-label{color:var(--accent)!important}.login-brand{font-size:40px;font-weight:700}.search{width:260px}.op-amount{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}.op-meta{flex:1}.inline-link{color:var(--accent)}@media(max-width:1000px){.shell{grid-template-columns:175px minmax(0,1fr)}main{padding:25px 20px}.sidebar{padding-inline:10px}.topbar{padding:0 20px}.metric{padding:0 15px}.metric strong{font-size:21px}.pagehead{align-items:flex-start;flex-wrap:wrap}.account small{display:none}}@media(max-width:680px){.shell{display:block}.sidebar{height:auto;position:static;padding:15px;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:22px;padding:0 5px 15px}.nav{display:flex;overflow:auto;gap:3px}.nav button{padding:10px;font-size:12px;white-space:nowrap}.nav svg{display:none}.sidefoot{display:none}.topbar{height:57px;padding:0 16px}.crumb{font-size:11px}.account{gap:6px}.account .avatar{display:none}.account strong{font-size:12px}.account button{padding:8px}.topbar .account small{display:none}main{padding:23px 15px}.pagehead h1{font-size:26px}.sub{font-size:12px}.metrics{grid-template-columns:1fr 1fr;padding:0}.metric{padding:16px}.metric:nth-child(2){border:0}.metric:nth-child(-n+2){border-bottom:1px solid var(--line)}.metric strong{font-size:23px}.terms{flex-wrap:wrap;gap:8px 15px}.toolbar,.filters{width:100%}.filters select{width:100%}.month{flex:1;justify-content:space-between}.month input{width:160px}.toolbar>.actions{width:100%}.table-title{padding:14px}.table-title span{display:none}.tablefoot{font-size:11px;flex-wrap:wrap}.list-row{padding:16px;flex-wrap:wrap}.form-row{grid-template-columns:1fr;gap:0}.form-page{padding:20px}.search{width:100%}.table-scroll{max-height:560px}th:first-child,td:first-child{min-width:110px;width:110px;padding:0 12px}.empty{padding:35px 18px}}
@keyframes enter{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes dialog-enter{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}main{animation:enter 180ms cubic-bezier(.16,1,.3,1)}dialog[open]{animation:dialog-enter 210ms cubic-bezier(.16,1,.3,1)}button{transition:background-color 140ms ease,border-color 140ms ease,transform 140ms ease}button:active:not(:disabled){transform:translateY(1px)}#toast{animation:enter 180ms ease-out}.save-label{display:flex;align-items:center;gap:5px}.save-label svg{width:14px;height:14px}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Planned shifts are independent from paid hours. */
.shift-cell{position:relative;padding-left:38px;transition:background-color 160ms ease-out}
.plan-toggle{position:absolute;left:3px;top:3px;width:30px;height:30px;padding:5px;border-color:#a7b4ad;color:#65756c;background:#fff}
.plan-toggle svg{width:17px;height:17px;opacity:.35}
.shift-cell.planned{background:#dceee3}
.plan-toggle[aria-pressed="true"]{color:#fff;background:#24664f;border-color:#24664f}
.plan-toggle[aria-pressed="true"] svg{opacity:1}
.shift-cell .hour.filled{background:transparent;color:var(--ink)}
.coverage-warning{display:none;font-size:10px;color:#963535;line-height:12px;padding-bottom:3px;white-space:nowrap}
.unstaffed td{background:#fff3f2;border-bottom:2px solid #c96262}
.unstaffed td:first-child{background:#ffebe9;color:#963535}
.unstaffed .coverage-warning{display:block}
.unstaffed .weekday{color:#963535}
@media(prefers-reduced-motion:reduce){.shift-cell{transition:none}}

.access-account{padding:20px;border-bottom:1px solid var(--line)}.access-account summary{cursor:pointer;display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:8px 0}.access-account fieldset{border:1px solid var(--line);border-radius:8px;margin:18px 0;padding:16px}.access-account legend{font-weight:650;padding:0 8px}.access-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 20px}.hour[readonly]{cursor:default}.hour[readonly]:focus{outline:none;background:transparent}.account strong{overflow-wrap:anywhere}.lock>div{width:100%}.access-account summary strong{overflow-wrap:anywhere}@media(max-width:680px){.access-grid{grid-template-columns:1fr}.access-account{padding:14px}.lock .form-page{max-width:calc(100vw - 32px)}}
/* Responsive workspace and page-level vertical scrolling. */
.table-scroll{max-height:none!important;overflow-x:auto;overflow-y:hidden;touch-action:pan-x pan-y}
.table-panel{overflow:visible;min-width:0}.table-scroll table{transform-origin:top left}.table-scroll thead th{position:static}.shell>div{min-width:0}
.zoom-bar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 18px;background:var(--paper);border-bottom:1px solid var(--line)}.zoom-bar input{width:160px;accent-color:var(--accent);padding:0}.zoom-bar output{min-width:42px;font-variant-numeric:tabular-nums}.zoom-bar small{color:var(--muted)}
.sidebar,.topbar,.list,.metrics,.table-panel,.form-page,.empty,dialog,.month{background:var(--paper)}button,input,select,th:first-child,td:first-child{background:var(--paper);color:var(--ink)}.nav button.active{background:var(--tint);color:var(--accent)}.sidefoot{line-height:1.7}
:root[data-theme=dark]{color-scheme:dark;--bg:#141a1e;--paper:#1d252b;--ink:#e9f0f4;--muted:#a5b3bd;--line:#34434b;--accent:#8ad5b3;--tint:#25483a;--danger:#ffa9a2}
[data-theme=dark] button.primary{background:#326f55;color:#fff;border-color:#47896c}[data-theme=dark] button:hover{background:#304039;border-color:#607c6d}[data-theme=dark] input,[data-theme=dark] select{border-color:#4b5e67}[data-theme=dark] .employee-head .avatar,[data-theme=dark] .avatar{background:#344652;color:#d5e5ed}
[data-theme=dark] th,[data-theme=dark] thead th:first-child,[data-theme=dark] .totals td,[data-theme=dark] .totals td:first-child{background:#253038;color:var(--ink)}[data-theme=dark] th,[data-theme=dark] td{border-color:var(--line)}[data-theme=dark] .weekend td,[data-theme=dark] .weekend td:first-child{background:#252f32}[data-theme=dark] .shift-cell.planned,[data-theme=dark] .totals.salary td{background:#25483a;color:#c1efd8}[data-theme=dark] .unstaffed td,[data-theme=dark] .unstaffed td:first-child{background:#3d272b;border-bottom-color:#bb7778;color:#ffd0cc}[data-theme=dark] .coverage-warning,[data-theme=dark] .unstaffed .weekday{color:#ffbab3}[data-theme=dark] .plan-toggle{background:#253139;color:#b7c9bd;border-color:#72877b}[data-theme=dark] .plan-toggle[aria-pressed=true]{background:#39795b;color:#fff}[data-theme=dark] .hour:focus{background:#345645}[data-theme=dark] .hour.filled{color:var(--ink)}[data-theme=dark] .error{color:#ffaaa3}[data-theme=dark] .badge{background:var(--tint);color:var(--accent)}
@media(max-width:760px){.shell{display:block}.sidebar{height:auto;position:static;padding:14px 16px;border-right:0;border-bottom:1px solid var(--line)}.brand{padding:0 0 14px;font-size:24px}.nav{display:flex;overflow-x:auto;gap:6px;padding-bottom:4px}.nav button{flex-shrink:0;min-height:44px;padding:10px 12px;font-size:12px}.nav svg{display:block;width:17px;height:17px;margin:0}.sidefoot{display:block;margin:12px 0 0;padding:10px 0 0;font-size:11px}.topbar{height:auto;min-height:60px;padding:12px 16px;gap:12px;flex-wrap:wrap}.crumb{display:none}.account{width:100%;gap:8px}.account>div:not(.avatar){flex:1;min-width:0}.account strong{font-size:12px;display:block}.account small{display:block!important}.account button{font-size:12px;min-height:40px;padding:8px}.account .avatar{display:none}main{padding:20px 12px}.pagehead{gap:14px;margin-bottom:18px}.pagehead h1{font-size:25px}.pagehead>.actions{width:100%;display:flex}.pagehead>.actions button{flex:1;min-height:44px;padding:10px}.toolbar .actions{width:100%}.toolbar .actions button{flex:1;min-height:44px}.filters{width:100%}.filters select{width:100%;min-height:44px}.month{width:100%;min-height:44px}.month input{flex:1;min-width:0;font-size:16px}.metrics{margin-bottom:18px}.metric strong{font-size:21px}.table-title{flex-wrap:wrap;padding:14px}.table-title span{display:block;width:100%;order:3;line-height:1.5}.table-title .ghost{padding:6px}.zoom-bar{padding:12px;gap:8px;font-size:12px}.zoom-bar input{flex:1;min-width:90px;width:110px}.zoom-bar small{width:100%}.zoom-bar button{padding:7px}.hour{height:44px;font-size:16px}.shift-cell{padding-left:42px}.plan-toggle{height:36px;width:36px;top:4px}.table-scroll td{height:44px}.form-page{padding:20px}.field input,.field select{font-size:16px;min-height:44px}.list-row{padding:15px;gap:12px}.tablefoot{padding:12px;flex-wrap:wrap}.lock>div{padding:24px}.lock .form-page{width:100%!important;max-width:calc(100vw - 28px)}dialog form{padding:18px}dialog header{padding:18px}.terms{line-height:1.6}.access-account summary{min-height:44px}}

[data-theme=dark] .nav button{color:var(--muted)}[data-theme=dark] .nav button.active{color:var(--accent)}
.user-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.user-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}.user-card h2{font-size:17px;line-height:1.4;overflow-wrap:anywhere;margin:0}.user-card p{color:var(--muted);font-size:12px;line-height:1.6;margin:0}.user-card>.actions,.user-card>button{margin-top:auto}.access-layout{display:grid;grid-template-columns:minmax(200px,280px) minmax(0,1fr);gap:20px}.access-users{display:flex;flex-direction:column;gap:6px}.access-users button{text-align:left;justify-content:flex-start;overflow-wrap:anywhere}.access-users button.active{background:var(--tint);border-color:var(--accent)}.access-detail{padding:24px;background:var(--paper);border:1px solid var(--line);border-radius:12px;min-width:0}.access-detail h2{font-size:19px;overflow-wrap:anywhere}.branch-header{display:flex;align-items:center;gap:12px}.branch-header label{font-size:11px;color:var(--muted)}.branch-header select{display:block;max-width:260px;padding:6px 10px;margin-top:3px}.topbar{gap:16px}.access-detail .primary{margin-top:20px}@media(max-width:760px){.access-layout{grid-template-columns:1fr}.access-users{flex-direction:row;overflow-x:auto;padding-bottom:8px}.access-users button{min-width:180px;max-width:260px;flex-shrink:0}.access-detail{padding:18px}.branch-header{width:100%}.branch-header label{flex:1}.branch-header select{width:100%;max-width:none;min-height:44px;font-size:16px}.user-cards{grid-template-columns:1fr}}