:root{--brown:#6b3f2a;--brown2:#9a6a49;--cream:#f7f2eb;--ink:#282522;--muted:#766f68;--line:#e7ded5;--danger:#b42318;--green:#1b7f45;--orange:#a85b00;--shadow:0 8px 28px rgba(74,45,25,.065)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,"Segoe UI",Arial,sans-serif;background:#f7f5f2;color:var(--ink)}
body:before{content:"";position:fixed;inset:72px 0 0 228px;background:url('/static/sam_logo.png') center/520px auto no-repeat;opacity:.016;pointer-events:none}
.topbar{height:72px;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:40}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.brand img{height:50px}.brand span{display:flex;flex-direction:column}.brand small{font-size:10px;letter-spacing:1.6px;color:var(--muted)}
.user{display:flex;align-items:center;gap:10px;font-size:13px}.user a{color:var(--brown);text-decoration:none}.role{color:var(--muted);border-left:1px solid var(--line);padding-left:10px}.dot{width:8px;height:8px;background:#30a46c;border-radius:50%}
.layout{display:grid;grid-template-columns:228px 1fr;min-height:calc(100vh - 72px)}aside{background:#fff;border-right:1px solid var(--line);padding:18px 12px;position:sticky;top:72px;height:calc(100vh - 72px);overflow:auto;z-index:20}
.navtitle{font-size:10px;letter-spacing:1.35px;color:#9b9088;padding:12px 11px 6px}aside a{display:block;padding:10px 12px;border-radius:10px;text-decoration:none;color:#4a4541;font-size:14px;margin:2px 0}aside a:hover{background:var(--cream);color:var(--brown)}
main{padding:30px;min-width:0;position:relative;z-index:1}.public{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#fff,#f3ede5)}
.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px}.pagehead h1{font-size:30px;margin:2px 0 6px}.pagehead p{margin:0;color:var(--muted)}.eyebrow{font-size:10px;letter-spacing:1.55px;color:var(--brown2);font-weight:800}
section{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:18px;box-shadow:var(--shadow)}.narrow{max-width:560px}.separator{height:1px;background:var(--line);margin:16px 0}
.stats3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}.stat{background:linear-gradient(145deg,#fff,#fcfaf7);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow)}.stat span{display:block;color:var(--muted);font-size:13px}.stat b{display:block;font-size:38px;line-height:1;color:var(--brown);margin:12px 0}.stat small{color:#9a9088}
.section-title{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.section-title h2{margin:0 0 4px}.section-title p{margin:0;color:var(--muted)}
input,select{padding:10px 11px;border:1px solid #d8cfc6;border-radius:9px;min-height:40px;background:#fff;font:inherit}button,.button{border:0;background:var(--brown);color:#fff;border-radius:9px;padding:10px 14px;font:inherit;font-weight:650;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.button.ghost,.ghost{background:#fff;color:var(--brown);border:1px solid #d8cfc6}.secondary{background:#756d67}.danger{background:var(--danger)}.success{background:var(--green)}.mini{padding:7px 10px;font-size:12px}
.filters,.actions,.upload,.inline{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.filters label,.stack label,.grid2 label{display:grid;gap:5px;color:var(--muted);font-size:12px}.stack{display:grid;gap:12px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.grid6{display:grid;grid-template-columns:1fr 2fr 1.3fr 1.3fr 1.2fr auto;gap:10px}.full{grid-column:1/-1}
.tablewrap{overflow:auto;padding:0}table{width:100%;border-collapse:separate;border-spacing:0;min-width:800px}th,td{padding:12px;border-bottom:1px solid #eee7e1;text-align:left;vertical-align:middle}th{font-size:11px;text-transform:uppercase;letter-spacing:.45px;color:#756c64;background:#fbf9f7;position:sticky;top:0;z-index:3}td small{display:block;color:var(--muted);margin-top:3px}.empty{text-align:center!important;color:var(--muted);padding:30px}
.pill{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;background:#eee8e2}.pill.ok,.pill.full{background:#e9f6ed;color:#176b37}.pill.warn,.pill.pending{background:#fff4df;color:#915400}.pill.adjusted{background:#edf1ff;color:#3d4f9a}.pill.off{background:#fdeceb;color:#9b1c14}
.statusbar{display:flex;gap:18px;flex-wrap:wrap;margin:0 0 14px;color:var(--muted);font-size:12px}.statusbar span{display:flex;gap:6px;align-items:center}.dotstatus{width:9px;height:9px;border-radius:50%;display:inline-block}.dotstatus.pending{background:#dda02c}.dotstatus.full{background:#2a9a57}.dotstatus.adjusted{background:#526ac4}.dotstatus.off{background:#c5443a}
.notice{padding:12px 14px;background:#fff7e8;border:1px solid #ead5ac;border-radius:10px;margin-top:12px}.dangerbox{background:#fff0ef;border-color:#efc3be}
.schedule-wrap{padding:0;overflow:auto;max-height:68vh}.schedule{min-width:max-content}.schedule th,.schedule td{min-width:130px;padding:7px}.schedule .person{min-width:220px}.schedule .sticky{position:sticky;left:0;z-index:5;background:#fff}.schedule thead .sticky{background:#fbf9f7;z-index:8}.schedule select{width:100%;font-size:12px;padding:6px}.weekend{background:#fcf6ee!important}.schedule th span,.schedule th b{display:block;text-align:center}.savebar{position:sticky;bottom:12px;display:flex;justify-content:flex-end;padding:10px;z-index:9}
.modal{position:fixed;inset:0;background:#0007;display:none;align-items:center;justify-content:center;z-index:100}.modal.show{display:flex}.modal-card{background:#fff;width:min(700px,92vw);padding:24px;border-radius:18px;position:relative;box-shadow:0 25px 80px #0003}.smallmodal{max-width:460px}.close{position:absolute;right:12px;top:10px;background:transparent;color:#555;font-size:24px}
.flash{padding:12px 14px;border-radius:10px;background:#edf8ef;border:1px solid #c8e8cf;margin-bottom:14px}.login-card{width:min(430px,92vw);background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px;text-align:center;box-shadow:0 24px 80px rgba(72,43,25,.17)}.login-card img{height:100px;max-width:240px;object-fit:contain}.login-card h1{margin-bottom:4px}.login-card p{color:var(--muted)}.login-card form{text-align:left;display:grid;gap:8px;margin:22px 0}.login-card button{width:100%}
@media(max-width:950px){.layout{grid-template-columns:1fr}aside{position:static;height:auto;display:flex;overflow:auto;border-right:0;border-bottom:1px solid var(--line)}.navtitle{display:none}aside a{white-space:nowrap}main{padding:18px}body:before{left:0}.stats3{grid-template-columns:1fr}.grid6,.grid5,.grid4{grid-template-columns:1fr 1fr}.pagehead{align-items:flex-start}}
@media(max-width:620px){.grid6,.grid5,.grid4,.grid2{grid-template-columns:1fr}.pagehead{flex-direction:column}.brand span{display:none}.user b,.role{display:none}}

.kpi-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.kpi-summary>div{background:#faf7f3;border:1px solid var(--line);border-radius:12px;padding:14px}.kpi-summary span{display:block;color:var(--muted);font-size:12px}.kpi-summary b{display:block;font-size:22px;color:var(--brown);margin-top:6px}.kpi-form{margin-top:16px}.kpi-form label{display:flex;align-items:center;gap:7px}

/* V2: compact save button in shift rows */
.shift-row button, .shift-card button, form.shift button {
  width: auto !important;
  min-width: 72px !important;
  max-width: 90px !important;
  white-space: nowrap !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  flex: 0 0 auto !important;
}

.shift-form{display:grid;grid-template-columns:minmax(180px,1.3fr) 130px 130px minmax(120px,1fr) minmax(120px,1fr) 80px;gap:10px;align-items:center}.compact-save{width:72px!important;min-width:72px!important;white-space:nowrap}.salary-grid{display:grid;grid-template-columns:1fr 1.5fr 1fr 1fr 1fr auto;gap:10px}.money-input{text-align:right;font-variant-numeric:tabular-nums}.smallinput{max-width:78px}.narrowmoney{min-width:120px;max-width:145px}.kpi-add-rule{display:grid;grid-template-columns:70px 1.3fr 1fr 1.2fr 1.2fr 80px 1.1fr auto;gap:8px;padding:14px}.kpi-alloc-form{display:grid;grid-template-columns:2fr 100px 1.2fr 1.2fr 1.3fr auto;gap:8px;padding:14px}.payroll-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.payroll-stats>div{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px}.payroll-stats span{display:block;color:var(--muted);font-size:12px}.payroll-stats b{display:block;font-size:24px;color:var(--brown);margin-top:6px}.unit-note{text-align:right;padding:10px 14px;color:var(--muted);font-size:12px}.net{font-size:15px;color:var(--brown)}.detail-row{display:none}.detail-row.show-row{display:table-row}.salary-detail{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:12px}.salary-detail>div{background:#faf7f3;border:1px solid var(--line);border-radius:10px;padding:10px}.salary-detail span{display:block;color:var(--muted);font-size:11px}.salary-detail b{display:block;margin-top:4px}.salary-detail .totalbox{background:#f2e9df}.settings-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.penalty-form{display:grid;grid-template-columns:1.5fr 140px 1fr 130px 2fr 1.5fr auto;gap:8px}.qr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.qr-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}.qr-placeholder{background:#faf7f3;border-radius:10px;padding:16px;word-break:break-all}.geo-card{max-width:560px;margin:auto;text-align:center}
@media(max-width:1100px){.shift-form,.salary-grid,.kpi-add-rule,.kpi-alloc-form,.settings-grid,.penalty-form{grid-template-columns:1fr 1fr}.payroll-stats{grid-template-columns:1fr 1fr}.salary-detail{grid-template-columns:1fr 1fr}.qr-grid{grid-template-columns:1fr}}

.qr-image{width:220px;max-width:100%;display:block;margin:12px auto;border-radius:8px}

/* V6 UI cleanup */
.employee-add-grid{display:grid;grid-template-columns:110px minmax(180px,1.4fr) minmax(150px,1fr) minmax(150px,1fr) 145px 82px;gap:8px;align-items:center}
.salary-grid{grid-template-columns:130px minmax(200px,1.5fr) 135px minmax(150px,1fr) minmax(150px,1fr) 82px!important}
.tablewrap{overflow:auto;max-width:100%;scrollbar-gutter:stable both-edges}
.tablewrap table th{position:sticky;top:0;z-index:6;white-space:nowrap}
.tablewrap table th:first-child,.tablewrap table td:first-child{position:sticky;left:0;z-index:5;background:#fff;box-shadow:1px 0 0 #eee7e1}
.tablewrap table th:first-child{z-index:8;background:#fbf9f7}
.kpi-rules-section table{min-width:1080px}.kpi-rules-section th,.kpi-rules-section td{padding:7px 8px}.kpi-rules-section input,.kpi-rules-section select{min-height:34px;padding:6px 8px}
.kpi-rules-section td:nth-child(1){width:65px}.kpi-rules-section td:nth-child(6){width:90px}.kpi-rules-section .money-input{min-width:130px}
.kpi-alloc-form{grid-template-columns:minmax(240px,2fr) 95px 150px 150px minmax(160px,1fr) 78px!important;align-items:center}
.kpi-auto-split{margin:10px 14px 14px}
@media(max-width:1200px){.employee-add-grid,.salary-grid{grid-template-columns:1fr 1fr 1fr}.employee-add-grid button,.salary-grid button{width:100%}.kpi-alloc-form{grid-template-columns:1fr 1fr!important}}

/* V7 Payroll historical-data entry & wide-table navigation */
.compact-section{padding:14px 18px}.payroll-entry-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin-bottom:8px}.payroll-entry-toolbar div{display:flex;flex-direction:column}.payroll-entry-toolbar span{font-size:12px;color:var(--muted);margin-top:3px}.top-scroll{height:16px;overflow-x:auto;overflow-y:hidden;margin:0 8px 5px;border-radius:8px}.top-scroll-inner{height:1px}.payroll-entry-table{max-height:67vh;position:relative}.payroll-entry-table table{min-width:2050px}.payroll-entry-table th,.payroll-entry-table td{padding:8px 9px}.payroll-entry-table input{min-height:34px;padding:6px 8px}.freeze-two th:nth-child(1),.freeze-two td:nth-child(1){position:sticky;left:0;z-index:7;background:#fff;min-width:72px;max-width:72px}.freeze-two th:nth-child(2),.freeze-two td:nth-child(2){position:sticky;left:72px;z-index:7;background:#fff;min-width:210px;max-width:210px;box-shadow:2px 0 0 #eee7e1}.freeze-two th:nth-child(1),.freeze-two th:nth-child(2){z-index:10;background:#fbf9f7}.manual-cell{display:grid;grid-template-columns:auto 1fr;gap:4px 6px;align-items:center;min-width:160px}.manual-cell .check{grid-column:1/-1;font-size:11px;white-space:nowrap}.note-mini{grid-column:1/-1;min-width:145px}.note-wide{min-width:190px}.payroll-savebar{bottom:8px;background:linear-gradient(180deg,transparent,#f7f5f2 30%);padding-top:24px}.payroll-savebar button{min-width:260px}.payroll-entry-table .narrowmoney{min-width:128px;max-width:145px}
@media(max-width:900px){.payroll-entry-toolbar{align-items:stretch;flex-direction:column}.payroll-entry-toolbar button{width:100%}}

.kpi-month-form{display:grid;grid-template-columns:1.1fr 1.2fr 1fr 1.2fr 1.4fr 1.5fr auto;gap:10px;align-items:end}
.kpi-month-form label{display:grid;gap:5px;font-size:12px;color:var(--muted)}
.kpi-allocation-section td,.kpi-allocation-section th{padding-top:8px;padding-bottom:8px}
.pct-input{width:90px}.compact-money{width:140px}.kpi-tools{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px 14px;background:#faf7f3;border-top:1px solid var(--line)}
.kpi-add-employee{display:grid;grid-template-columns:minmax(260px,2fr) 120px 130px minmax(180px,1fr) auto;gap:10px;padding:14px;border-top:1px solid var(--line);align-items:center}
.sticky-table th{position:sticky;top:0;z-index:5}.sticky-table .sticky-name{position:sticky;left:0;background:#fff;z-index:4;min-width:220px}.sticky-table th:first-child{left:0;z-index:7}
.qr-settings-form{display:grid;grid-template-columns:auto 180px minmax(320px,1fr) auto;gap:14px;align-items:end}.qr-settings-form label:not(.check){display:grid;gap:5px;font-size:12px;color:var(--muted)}.qr-url{display:block;word-break:break-all;font-size:10px;color:var(--muted)}.geo-card{text-align:center;max-width:620px;margin:auto}.geo-card button{font-size:18px;padding:14px 24px}
@media(max-width:1100px){.kpi-month-form{grid-template-columns:1fr 1fr}.kpi-add-employee{grid-template-columns:1fr 1fr}.qr-settings-form{grid-template-columns:1fr 1fr}}

/* V8.1 KPI-by-store fix */
.kpi-flat-formula .formula-box{display:inline-block;padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:#faf7f3;color:var(--brown);font-size:17px}
.kpi-rules-section table{min-width:1050px}
.kpi-rules-section input,.kpi-rules-section select{min-height:34px;padding:6px 8px}

/* V10 KPI rebuild */
.kpi-month-form{display:grid;grid-template-columns:1.25fr 1.2fr 1fr 1.25fr 1.45fr 1.5fr auto;gap:10px;align-items:end}
.kpi-month-form label{display:grid;gap:5px;font-size:12px;color:var(--muted)}
.kpi-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.kpi-summary>div{padding:13px 15px;border:1px solid var(--line);background:#faf7f3;border-radius:12px}.kpi-summary span{display:block;font-size:11px;color:var(--muted)}.kpi-summary b{display:block;font-size:20px;color:var(--brown);margin-top:4px}
.kpi-compact-table{min-width:1180px}.kpi-compact-table th,.kpi-compact-table td{padding:7px 8px}.kpi-compact-table input,.kpi-compact-table select{min-height:34px;padding:6px 8px}
.kpi-xs{width:70px}.kpi-label{min-width:150px}.kpi-money{width:145px}.kpi-pct{width:92px}.kpi-note{min-width:165px}
.kpi-allocation-table{min-width:1080px}.kpi-allocation-table th,.kpi-allocation-table td{padding:8px 9px}
.kpi-allocation-table .sticky-name{min-width:225px;max-width:225px}
.sticky-action{position:sticky!important;right:0!important;z-index:9!important;background:#fff!important;min-width:128px;box-shadow:-2px 0 0 #eee7e1}
th.sticky-action{background:#fbf9f7!important;z-index:12!important}
.kpi-split-status{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr)) auto;gap:10px;align-items:center;padding:12px 14px;margin:0 0 10px;background:#faf7f3;border:1px solid var(--line);border-radius:12px}
.kpi-split-status>div{display:flex;flex-direction:column}.kpi-split-status span{font-size:11px;color:var(--muted)}.kpi-split-status b{font-size:18px;color:var(--brown)}
.kpi-add-box{padding:14px 16px;background:#faf7f3;border-top:1px solid var(--line)}.kpi-add-box h3{margin:0 0 4px}.kpi-add-box p{margin:0 0 10px;color:var(--muted);font-size:12px}
.kpi-add-employee{display:grid;grid-template-columns:minmax(280px,2fr) minmax(200px,1fr) auto;gap:10px;align-items:center}.kpi-add-employee select,.kpi-add-employee input{width:100%}
.kpi-add-rule{display:grid;grid-template-columns:75px 1.3fr 130px 1fr 1fr 80px 1fr auto;gap:8px;padding:12px;border-top:1px solid var(--line)}
.formula-box{display:inline-block;padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:#faf7f3;color:var(--brown);font-size:17px}
.total-row td{background:#fbf9f7;font-weight:600}
.kpi-close-box .notice{margin-bottom:10px}
@media(max-width:1200px){.kpi-month-form{grid-template-columns:repeat(2,1fr)}.kpi-split-status{grid-template-columns:repeat(2,1fr)}.kpi-add-rule{grid-template-columns:repeat(2,1fr)}}

/* FINAL RC1 — production UI cleanup */
.public{min-height:100vh!important;padding:24px;background:radial-gradient(circle at 50% 0,#fff 0,#f7f2eb 48%,#efe7dd 100%)!important}
body:has(.public){background:#f7f2eb}
body:has(.public):before{display:none}
.login-shell{width:min(430px,92vw);display:grid;gap:16px}
.login-brand{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--brown);font-size:12px;font-weight:800;letter-spacing:1.8px}
.login-brand img{height:58px;max-width:180px;object-fit:contain}
.login-card-final{width:100%!important;padding:30px 30px 24px!important;text-align:center;border-radius:20px!important}
.login-card-final h1{font-size:27px;margin:7px 0 5px}.login-card-final p{margin:0 0 20px;color:var(--muted)}
.login-card-final form{display:grid;gap:12px;text-align:left}.login-card-final label{display:grid;gap:6px;font-size:12px;color:var(--muted);font-weight:650}
.login-card-final input{width:100%;height:44px}.login-card-final button{height:44px;width:100%;margin-top:3px}
.login-note{margin-top:18px;padding-top:15px;border-top:1px solid var(--line);font-size:11px;color:#9a9088}

/* All wide tables: vertical contained scroll + always accessible top horizontal scroll */
.tablewrap{max-height:68vh!important;overflow:auto!important;position:relative}
.tablewrap table th{position:sticky!important;top:0!important;z-index:8!important}
.top-scroll{height:15px!important;overflow-x:auto!important;overflow-y:hidden!important;margin:0 6px 6px!important;background:#f2ede7;border-radius:999px}
.top-scroll::-webkit-scrollbar{height:10px}.top-scroll::-webkit-scrollbar-thumb{background:#b9aa9c;border-radius:999px}
.freeze-auto-two th:nth-child(1),.freeze-auto-two td:nth-child(1){position:sticky;left:0;z-index:7;background:#fff;min-width:82px}
.freeze-auto-two th:nth-child(2),.freeze-auto-two td:nth-child(2){position:sticky;left:82px;z-index:7;background:#fff;min-width:210px;box-shadow:2px 0 0 #eee7e1}
.freeze-auto-two th:nth-child(1),.freeze-auto-two th:nth-child(2){z-index:12;background:#fbf9f7}
.tablewrap input,.tablewrap select{max-width:100%}
.actions{white-space:nowrap}

/* Forms must stay inside viewport */
.employee-add-grid,.salary-final-form,.shift-form,.kpi-month-form,.kpi-add-rule,.kpi-add-employee,.penalty-form{max-width:100%}
.salary-final-form{display:grid;grid-template-columns:120px minmax(190px,1.4fr) 130px minmax(140px,1fr) minmax(150px,1fr) minmax(150px,1fr) 74px;gap:9px;align-items:center}
.rates-table{min-width:1120px}
.bulk-modal-card{max-width:720px}.bulk-list{max-height:50vh;overflow:auto;border:1px solid var(--line);border-radius:12px;margin:14px 0}
.bulk-list label{display:flex;gap:12px;align-items:center;padding:11px 13px;border-bottom:1px solid #eee7e1;cursor:pointer}.bulk-list label:last-child{border-bottom:0}.bulk-list input{min-height:auto;width:18px;height:18px}.bulk-list span{display:flex;flex-direction:column}.bulk-list small{color:var(--muted);margin-top:3px}
.bulk-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
@media(max-width:1200px){.salary-final-form{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){main{padding:18px}.salary-final-form,.employee-add-grid,.shift-form,.kpi-month-form,.kpi-add-rule,.kpi-add-employee,.penalty-form{grid-template-columns:1fr!important}.bulk-footer{align-items:stretch;flex-direction:column}.bulk-footer .actions{width:100%}.bulk-footer button{flex:1}}

/* FINAL RC2 */
.payroll-input-table{min-width:1900px}.payroll-input-table th,.payroll-input-table td{padding:6px 8px!important}.payroll-input-table input{min-height:34px;padding:6px 8px}.system-pay{background:#f8f4ef}.system-pay small{display:block;color:var(--muted);font-size:10px}
.floating-save{position:sticky;bottom:10px;z-index:30;display:flex;justify-content:flex-end;padding:10px 0;pointer-events:none}.floating-save button{pointer-events:auto;box-shadow:0 5px 20px #0002}
.qr-card form{margin-top:10px}.late-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left;padding:14px;margin:12px 0;border:1px solid #e7c99f;background:#fff7e9;border-radius:12px}.late-box>b{grid-column:1/-1;color:#8a5200}.late-box label{display:grid;gap:5px}
.two-stats{grid-template-columns:repeat(2,minmax(220px,1fr));max-width:650px}
.kpi-allocation-table .sticky-action .inline,.rates-table .sticky-action .inline{display:inline-flex!important}.kpi-allocation-table .sticky-action,.rates-table .sticky-action{min-width:150px!important;padding-left:14px!important}
@media(max-width:800px){.late-box{grid-template-columns:1fr}.two-stats{grid-template-columns:1fr}}

/* RC2.1 HOTFIX */
#shiftEditForm{grid-template-columns:minmax(190px,1.4fr) 130px 130px 130px 130px auto auto}
#shiftEditForm .ghost{white-space:nowrap}.tablewrap .sticky-action .inline{display:inline-flex!important}.tablewrap .sticky-action{white-space:nowrap}
@media(max-width:950px){#shiftEditForm{grid-template-columns:1fr 1fr}}

/* FINAL STABLE V14 - compact & stable */
:root{--control-h:32px}
input,select,button,.button{min-height:var(--control-h)!important}
input,select{padding:5px 8px!important}
button,.button{padding:5px 10px!important}
section{padding:12px!important}
table th,table td{padding:6px 8px!important}
.tablewrap{max-height:70vh!important}
.compact-table table th,.compact-table table td{padding:5px 7px!important}
.mini{min-height:27px!important;padding:3px 7px!important}
.final-employee-form{grid-template-columns:85px minmax(160px,1.4fr) 130px 145px 145px 125px auto!important}
.ot-manual-cell{display:grid!important;grid-template-columns:auto 78px 120px minmax(110px,1fr)!important;gap:5px!important;align-items:center}
.hours-input{width:78px!important}
.final-stats{grid-template-columns:repeat(4,minmax(150px,1fr))!important;gap:8px!important}
.final-stats .company-cost{grid-column:span 2;background:#f4ede4}
.final-stats>div{padding:11px 12px!important}
.warning-box{border:1px solid #e7c78f;background:#fff8e9;border-radius:10px}
.my-payroll-card{display:grid;grid-template-columns:repeat(4,minmax(145px,1fr));gap:8px}
.my-payroll-card>div,.ot-stats>div{padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.my-payroll-card span,.ot-stats span{display:block;font-size:11px;color:var(--muted)}
.my-payroll-card b,.ot-stats b{font-size:18px}
.my-payroll-card .my-net{grid-column:span 2;background:#f4ede4}
.ot-stats{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));gap:8px;max-width:580px;margin-bottom:12px}
.kpi-action-col{min-width:145px!important;width:145px!important;right:0!important}
.kpi-action-col .inline{display:inline-flex!important;margin-right:4px!important}
.kpi-allocation-table input,.kpi-allocation-table select{min-height:30px!important;padding:4px 6px!important}
.kpi-split-status{padding:9px 10px!important}
.rates-table input,.rates-table select{min-height:30px!important;padding:4px 6px!important}
@media(max-width:1100px){.final-employee-form{grid-template-columns:repeat(3,1fr)!important}.final-stats,.my-payroll-card{grid-template-columns:repeat(2,1fr)!important}}

/* FINAL V15 COMPACT */
:root{--control-h:30px}input,select,button,.button{min-height:var(--control-h)!important}input,select{padding:4px 7px!important;font-size:12px!important}button,.button{padding:4px 9px!important;font-size:12px!important}section{padding:10px 12px!important}table th,table td{padding:5px 7px!important;font-size:12px!important}.tablewrap{max-height:72vh!important}.mini{min-height:25px!important;padding:3px 7px!important}.compact-section{padding:9px 11px!important}.final-employee-form{grid-template-columns:80px minmax(155px,1.4fr) 125px 140px 145px 120px auto!important;gap:6px!important}.payroll-input-table{min-width:2350px!important}.payroll-data-wrap input{min-height:28px!important}.small-money{width:108px!important}.hours-input{width:58px!important}.note-mini{width:105px!important}.note-wide{width:140px!important}.ot-manual-cell{display:grid!important;grid-template-columns:auto 58px 108px 105px!important;gap:4px!important;align-items:center}.final-stats{grid-template-columns:repeat(4,minmax(145px,1fr))!important;gap:7px!important}.final-stats>div{padding:9px 10px!important}.company-cost{grid-column:span 2!important;background:#f4ede4!important}.employee-link{text-decoration:none;color:inherit}.employee-link:hover{text-decoration:underline}.employee-profile{display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:start}.employee-photo-box{width:160px;height:190px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#faf7f3}.employee-photo-box img{width:100%;height:100%;object-fit:cover}.photo-placeholder{height:100%;display:flex;align-items:center;justify-content:center;font-size:58px;font-weight:800;color:#aa9b8d}.profile-form{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:9px}.profile-form label{display:grid;gap:4px;font-size:11px;color:var(--muted)}.profile-form .full{grid-column:1/-1}.profile-actions{display:flex!important;justify-content:flex-end}.kpi-actions-near{position:sticky!important;left:225px!important;z-index:10!important;background:#fff!important;min-width:122px!important;width:122px!important;white-space:nowrap}.kpi-actions-near .inline{display:inline-flex!important;margin-right:3px!important}th.kpi-actions-near{z-index:13!important;background:#fbf9f7!important}.kpi-allocation-table input,.kpi-allocation-table select,.rates-table input,.rates-table select{min-height:27px!important;padding:3px 5px!important}
@media(max-width:900px){.employee-profile{grid-template-columns:1fr}.profile-form{grid-template-columns:1fr}.final-stats{grid-template-columns:repeat(2,1fr)!important}}

/* V15.2 — font readability system-wide, without enlarging boxes */
body{font-size:14px!important}
main,.content,.page{font-size:14px!important}
table th{font-size:12.5px!important;font-weight:800!important}
table td{font-size:13.5px!important}
table td b,.primary-cell,.employee-link b{font-size:14px!important;font-weight:800!important}
table small,.muted,small{font-size:11.5px!important}
input,select,textarea{font-size:13px!important}
button,.button{font-size:13px!important}
.pagehead h1{font-size:30px!important}
.pagehead p{font-size:14px!important}
.eyebrow{font-size:11.5px!important}
label{font-size:12px!important}
.shift-edit-grid{display:grid;grid-template-columns:minmax(200px,1.5fr) 120px 120px 145px 160px auto;gap:7px;align-items:end}
.shift-edit-grid label{display:grid;gap:4px}
.shift-form-actions{display:flex;gap:5px;align-items:end}
.kpi-allocation-table td b{font-size:14px!important}
.kpi-allocation-table td small{font-size:11.5px!important}
@media(max-width:1050px){.shift-edit-grid{grid-template-columns:repeat(3,1fr)}}

/* V16 FINAL UAT — readable, compact system-wide */
body{font-size:14px!important}
table td{font-size:13.5px!important;line-height:1.25!important}
table td b,.employee-link b,.primary-cell{font-size:14px!important;font-weight:800!important}
table th{font-size:12.5px!important;font-weight:800!important}
table small{font-size:11.5px!important}
input,select,textarea,button,.button{font-size:13px!important}
input,select,button,.button{min-height:30px!important}
table th,table td{padding:5px 7px!important}
.employee-add-grid.final-employee-form{grid-template-columns:80px minmax(150px,1.3fr) 120px 135px 145px 125px 120px auto!important}
.profile-form small{font-size:10.5px!important;color:var(--muted)}
@media(max-width:1100px){.employee-add-grid.final-employee-form{grid-template-columns:repeat(3,1fr)!important}}

/* V17 RELEASE CANDIDATE — UI normalization */
body{font-size:14px!important}
main{padding:18px 20px!important;min-width:0!important}
section{padding:10px 12px!important}
.pagehead{margin-bottom:12px!important;gap:12px!important}
.pagehead h1{font-size:28px!important;line-height:1.1!important}
.pagehead p{font-size:13.5px!important;margin-top:4px!important}
table{border-collapse:separate!important;border-spacing:0!important}
table th{font-size:12.5px!important;font-weight:800!important;white-space:nowrap!important;padding:7px 8px!important}
table td{font-size:13.5px!important;line-height:1.2!important;padding:6px 8px!important;vertical-align:middle!important}
table td b{font-size:14px!important}
table small{font-size:11px!important;margin-top:2px!important}
input,select,textarea{font-size:13px!important;min-height:30px!important;padding:4px 7px!important}
button,.button{font-size:12.5px!important;min-height:29px!important;padding:4px 9px!important}
.tablewrap{max-height:none!important;overflow-x:auto!important;overflow-y:visible!important;border-radius:10px!important}
.fit-table{width:100%!important;min-width:0!important;table-layout:auto!important}
.fit-table input,.fit-table select{width:100%!important;min-width:0!important;box-sizing:border-box!important}
.top-scroll{height:10px!important}
.nowrap{white-space:nowrap!important}
.note-cell{max-width:230px!important;white-space:normal!important}
.attendance-table th:nth-child(1),.attendance-table td:nth-child(1){width:5%!important}
.attendance-table th:nth-child(2),.attendance-table td:nth-child(2){width:17%!important}
.attendance-table th:nth-child(3),.attendance-table td:nth-child(3){width:14%!important}
.attendance-table th:nth-child(4),.attendance-table td:nth-child(4){width:10%!important}
.attendance-table th:nth-child(5),.attendance-table td:nth-child(5){width:10%!important}
.attendance-table th:nth-child(6),.attendance-table td:nth-child(6){width:7%!important}
.attendance-table th:nth-child(7),.attendance-table td:nth-child(7){width:10%!important}
.attendance-table th:nth-child(8),.attendance-table td:nth-child(8){width:15%!important}
.attendance-table th:nth-child(9),.attendance-table td:nth-child(9){width:12%!important}
.attendance-table .actions{display:flex!important;gap:4px!important;flex-wrap:wrap!important}
.rates-table{width:100%!important;min-width:0!important;table-layout:fixed!important}
.rates-table th:nth-child(1){width:9%}.rates-table th:nth-child(2){width:19%}.rates-table th:nth-child(3){width:14%}
.rates-table th:nth-child(4){width:14%}.rates-table th:nth-child(5){width:14%}.rates-table th:nth-child(6){width:14%}.rates-table th:nth-child(7){width:16%}
.rates-table .sticky-action{position:static!important}
.rates-table td:last-child{white-space:nowrap!important}
.rates-table td:last-child form{display:inline-flex!important}
.replacement-alert{margin-top:8px;padding:9px 11px;border-radius:9px;background:#fff2d8;border:1px solid #e6bd70;font-size:13px}
.holiday-banner{margin-top:8px;padding:9px 11px;border-radius:9px;background:#f7eee3;border:1px solid #dbc5ae;font-size:13px}
.replacement-row td{background:#fff8df!important}
.replace-badge,.schedule-change-note{display:block!important;margin-top:4px!important;font-weight:800!important;font-size:10px!important}
.schedule-replaced-in{background:#fff1b8!important;border:2px solid #d5a522!important}
.schedule-replaced-out{background:#fde7e3!important;border:2px solid #ce786e!important}
.schedule-replaced-in select,.schedule-replaced-out select{background:transparent!important;font-weight:700!important}
.holiday-form{display:grid;grid-template-columns:130px 130px minmax(180px,1fr) 100px 100px auto;gap:7px;align-items:end}
.holiday-form label{display:grid;gap:4px}
.holiday-table th:nth-child(1){width:15%}.holiday-table th:nth-child(2){width:35%}.holiday-table th:nth-child(3),.holiday-table th:nth-child(4){width:12%}.holiday-table th:nth-child(5){width:12%}.holiday-table th:nth-child(6){width:14%}
.payroll-data-wrap{max-height:72vh!important;overflow:auto!important}
.schedule-wrap{overflow-x:auto!important}
@media(max-width:1150px){
 .attendance-table{min-width:980px!important}
 .holiday-form{grid-template-columns:repeat(3,1fr)}
}

/* V17.1 HOTFIX — table navigation */
.top-scroll{
  position:sticky!important;
  top:0!important;
  z-index:40!important;
  height:14px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  background:#f8f4ef!important;
  border-radius:8px!important;
  margin:4px 2px 6px!important;
}
.top-scroll-inner{height:1px!important}
.sticky-action-auto{
  position:sticky!important;
  right:0!important;
  z-index:22!important;
  background:#fff!important;
  box-shadow:-1px 0 0 #e6ddd4!important;
}
th.sticky-action-auto{
  z-index:32!important;
  background:#faf7f3!important;
}
.has-sticky-action td.sticky-action-auto .actions,
.has-sticky-action td.sticky-action-auto{
  white-space:nowrap!important;
}
.attendance-table{
  width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}
.attendance-table th:nth-child(2){width:19%!important}
.attendance-table th:nth-child(8){width:13%!important}
.attendance-table th:nth-child(9){width:15%!important}
.attendance-table td:nth-child(3),
.attendance-table td:nth-child(4),
.attendance-table td:nth-child(5),
.attendance-table td:nth-child(6),
.attendance-table td:nth-child(7){white-space:nowrap!important}
@media(max-width:1150px){
  .attendance-table{min-width:900px!important}
}

/* V17.5 Holiday direct-save feedback */
.holiday-save-ok{
  margin:8px 0 10px;padding:11px 14px;border-radius:10px;
  background:#e8f6ec;border:1px solid #8bc49a;font-weight:800;color:#176b37
}
.holiday-save-error{
  margin:8px 0 10px;padding:11px 14px;border-radius:10px;
  background:#fdebea;border:1px solid #df9b96;font-weight:800;color:#9a2f28
}

/* V18.5 HOTFIX */
.top-scroll{width:100%;height:14px!important;overflow-x:auto!important;overflow-y:hidden!important;margin:4px 0 6px!important;background:#f5f0ea!important;border-radius:8px!important;position:sticky!important;top:0!important;z-index:60!important}
.top-scroll-inner{height:1px!important}
.tablewrap{overflow-x:auto!important;max-width:100%!important}
.sticky-action-auto{position:sticky!important;right:0!important;z-index:30!important;background:#fff!important;box-shadow:-2px 0 4px rgba(0,0,0,.05)!important}
th.sticky-action-auto{z-index:40!important;background:#faf7f3!important}

/* V18.6 — SYSTEM-WIDE REAL TOP HORIZONTAL SCROLL */
.system-xscroll{
  width:100%!important;
  height:18px!important;
  overflow-x:scroll!important;
  overflow-y:hidden!important;
  box-sizing:border-box!important;
  margin:5px 0 7px!important;
  background:#eee7df!important;
  border:1px solid #e2d8ce!important;
  border-radius:9px!important;
  position:sticky!important;
  top:0!important;
  z-index:70!important;
}
.system-xscroll-track{height:1px!important;min-width:100%!important}
.tablewrap,.schedule-wrap,.payroll-data-wrap{
  overflow-x:auto!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.sticky-action-auto{
  position:sticky!important;
  right:0!important;
  z-index:35!important;
  background:#fff!important;
  box-shadow:-2px 0 5px rgba(0,0,0,.08)!important;
}
th.sticky-action-auto{z-index:45!important;background:#faf7f3!important}

/* V18.7 HR / contracts / explicit scroll */
.fixed-top-scroll{height:18px;overflow-x:scroll;overflow-y:hidden;margin:5px 0 7px;background:#eee7df;border:1px solid #ded2c6;border-radius:9px}
.fixed-top-scroll>div{height:1px;min-width:100%}
.contract-form{display:grid;grid-template-columns:150px minmax(180px,1fr) minmax(220px,1.2fr) auto;gap:8px;align-items:end}
.contract-form label{display:grid;gap:4px}
.hr-alerts{border-left:4px solid #c89a52}
.hr-alert{padding:7px 0;border-bottom:1px solid #eee5dc}
.ot-edit-form{display:flex!important;gap:4px!important;align-items:center!important;white-space:nowrap!important}
.ot-edit-form input[type=number]{width:90px!important}.ot-edit-form input[name=note]{width:145px!important}
@media(max-width:1000px){.contract-form{grid-template-columns:1fr 1fr}}

/* V18.7.1 HOTFIX */
.fixed-top-scroll{
  height:16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  margin:4px 0 6px!important;
  background:#eee7df!important;
  border:1px solid #ded2c6!important;
  border-radius:8px!important;
}
.fixed-top-scroll>div{height:1px!important;min-width:100%!important}

/* V18.7.2 — one scrollbar standard everywhere.
   Employees + Payroll now use exactly the same .system-xscroll as Payroll Data. */
.fixed-top-scroll{display:none!important}

/* V18.7.3 OT source */
.ot-source-note{margin:0 0 8px;padding:9px 12px;border:1px solid #dfd2c4;border-radius:9px;background:#faf6f1;font-size:12.5px}

/* V18.7.3A — OT date/detail */
.ot-reference-row td{background:#faf7f2!important;color:#756a61!important}
.ot-reference-row small{display:block;margin-top:3px;font-size:10px!important}

/* V18.7.3B — guaranteed top scroll for Employees + Payroll */
.manual-xscroll{
  width:100%!important;
  height:17px!important;
  overflow-x:scroll!important;
  overflow-y:hidden!important;
  margin:4px 0 6px!important;
  background:#eee7df!important;
  border:1px solid #ded2c6!important;
  border-radius:8px!important;
  box-sizing:border-box!important;
}
.manual-xscroll>div{
  height:1px!important;
  min-width:100%!important;
}
#employees-tablewrap,
#payroll-tablewrap{
  overflow-x:auto!important;
  max-width:100%!important;
}

.compact-hr-alert{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 12px!important;
  margin-bottom:10px!important;
}

/* V18.7.3C — time display standard: 24-hour clock system-wide */
input[type="time"]{font-variant-numeric:tabular-nums}

/* V18.7.3D — Employees + Payroll: one scrollbar ONLY, immediately above table */
.forced-top-xscroll{
  display:block!important;
  width:100%!important;
  height:18px!important;
  overflow-x:scroll!important;
  overflow-y:hidden!important;
  margin:5px 0 6px!important;
  background:#eee7df!important;
  border:1px solid #ded2c6!important;
  border-radius:8px!important;
  box-sizing:border-box!important;
}
.forced-top-xscroll-track{
  height:1px!important;
  min-width:calc(100% + 1px)!important;
}
.forced-scroll-target{
  overflow-x:auto!important;
  max-width:100%!important;
  scrollbar-width:none!important; /* Firefox: hide bottom native scrollbar */
  -ms-overflow-style:none!important;
}
.forced-scroll-target::-webkit-scrollbar{
  height:0!important; /* Chrome/Edge: hide bottom native scrollbar */
}
.manual-xscroll,
.fixed-top-scroll{
  display:none!important;
}

/* V18.7.4 */
.viewport-sticky-xscroll{position:fixed!important;z-index:1200!important;margin:0!important;box-shadow:0 2px 8px rgba(0,0,0,.14)!important}
.holiday-day-head{background:#fff3d7!important;border-top:3px solid #d49a3a!important}
.holiday-day-cell{background:#fffaf0!important}
.holiday-badge{display:block;margin-top:4px;padding:3px 5px;border-radius:5px;background:#f5dca5;color:#6d4818;font-size:10px;line-height:1.25}
.holiday-pay-note{display:block;margin-top:3px;font-weight:700;color:#9a5f15}
.pill.noshift{background:#eee9e4;color:#6e655d}

/* V18.8.3 — per-account permissions */
.permission-card{max-width:780px!important}
.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:8px;margin:12px 0}
.permission-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid #e5ded7;border-radius:9px;background:#fff}
.permission-row>div{min-width:0}
.permission-row small{display:block;color:#777;font-size:10px;margin-top:2px}
.permission-row select{min-width:155px}
@media(max-width:760px){.permission-grid{grid-template-columns:1fr}}