:root{--bg:#15120f;--panel:#201b17;--panel2:#2a241f;--line:#46392f;--text:#f6f1eb;--muted:#b8aa9d;--accent:#ef8c27;--accent2:#ffad4e;--danger:#dc5d52;--good:#6bc17a;--warn:#f0bf58;--shadow:0 14px 36px rgba(0,0,0,.28)}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.mobile-only{display:none}.error{color:#ffaaa1!important}.success{color:#a8e8b2!important}.muted{color:var(--muted)}
.topbar{height:76px;position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:rgba(21,18,15,.97);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px}.brand img{height:58px;width:auto}.brand div{display:flex;flex-direction:column;letter-spacing:.08em}.brand span{font-size:12px;color:var(--muted);letter-spacing:.02em}.top-actions{display:flex;align-items:center;gap:10px}.badge{border:1px solid var(--line);border-radius:999px;padding:6px 10px;color:var(--muted);font-size:12px}.shell{display:grid;grid-template-columns:224px 1fr;min-height:calc(100vh - 116px)}.sidebar{border-right:1px solid var(--line);padding:22px 14px;display:flex;flex-direction:column;justify-content:space-between}.sidebar nav{display:grid;gap:8px}.nav-btn{border:0;text-align:left;border-radius:10px;background:transparent;color:var(--muted);padding:12px 14px}.nav-btn:hover,.nav-btn.active{background:var(--panel2);color:var(--text)}.nav-btn.active{box-shadow:inset 3px 0 0 var(--accent)}.sidebar-note{font-size:12px;color:var(--muted);padding:14px}.sidebar-note span{opacity:.7}.main{padding:28px;max-width:1500px;width:100%;margin:auto}
.btn{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:10px;padding:10px 14px}.btn:hover{border-color:#6a5748}.btn.primary{background:var(--accent);border-color:var(--accent);color:#16100a;font-weight:800}.btn.ghost{background:transparent}.btn.danger{border-color:#7f3b35;color:#ffb5ae}.btn.good{border-color:#356b40;color:#a8e8b2}.btn.small{padding:6px 9px;font-size:12px}.icon-btn{background:transparent;color:var(--text);border:0;font-size:22px}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:22px}.page-head h1{font-family:Georgia,serif;font-weight:500;margin:0}.page-head p{color:var(--muted);margin:.4rem 0 0}.grid{display:grid;gap:16px}.stats{grid-template-columns:repeat(4,minmax(140px,1fr));margin-bottom:24px}.stat,.card{background:linear-gradient(180deg,var(--panel),#1b1714);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.stat{padding:18px}.stat strong{display:block;font-size:30px;font-family:Georgia,serif}.stat span{color:var(--muted);font-size:13px}.cards{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.card{padding:18px}.card h2,.card h3{margin:.1rem 0 .55rem}.section{margin-top:24px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}.section h2{font-family:Georgia,serif;font-weight:500}.banner{border:1px solid #78542f;background:#2c2015;border-left:4px solid var(--accent);padding:15px 16px;border-radius:12px;margin-bottom:18px}.banner.good{border-color:#356b40;border-left-color:var(--good);background:#17261a}.banner.warn{border-color:#6f5b2e;border-left-color:var(--warn);background:#2b2618}.banner h3{margin:0 0 5px}.banner p{margin:0;color:#d9ccbf}.pill{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:4px 8px;font-size:12px}.pill.good{color:#9be8a8;border-color:#356b40}.pill.orange{color:#ffc27c;border-color:#75502e}.pill.warn{color:#f8d987;border-color:#6f5b2e}.pill.red{color:#ffaaa1;border-color:#7f3b35}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}.table{border-collapse:collapse;width:100%;min-width:680px;background:var(--panel)}.table th,.table td{text-align:left;padding:11px 12px;border-bottom:1px solid #3a3029;vertical-align:top}.table th{color:#d7c8ba;font-size:12px;text-transform:uppercase;letter-spacing:.06em}.table td{color:#eee4da}.table tr:last-child td{border-bottom:0}.table .money{text-align:right;font-variant-numeric:tabular-nums}.table .hours{text-align:right;font-variant-numeric:tabular-nums}.day-row{display:grid;grid-template-columns:140px 1fr auto;gap:14px;align-items:start;padding:14px 0;border-bottom:1px solid #382f29}.day-row:last-child{border-bottom:0}.day-date strong{display:block}.day-date span{color:var(--muted);font-size:12px}.punches{display:grid;gap:8px}.punch{display:flex;justify-content:space-between;gap:10px;align-items:center;background:#17130f;border:1px solid #392f28;padding:9px 11px;border-radius:9px}.punch-time{font-weight:700}.punch-note{font-size:12px;color:var(--muted)}.day-total{font-family:Georgia,serif;font-size:20px;text-align:right}.week-total{display:flex;justify-content:flex-end;gap:18px;align-items:baseline;padding:15px 0 0}.week-total strong{font-size:28px;font-family:Georgia,serif}.review-cert{display:flex;align-items:flex-start;gap:10px;padding:14px;background:#17130f;border:1px solid var(--line);border-radius:10px}.review-cert input{margin-top:3px}.review-cert span{color:#e7dbcf}.status-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.stack{display:grid;gap:12px}.stack label,.form-grid label{display:grid;gap:6px;color:#dbcfc4;font-size:13px}.stack input,.stack select,.stack textarea,.form-grid input,.form-grid select,.form-grid textarea{width:100%;background:#14110f;color:var(--text);border:1px solid var(--line);border-radius:9px;padding:10px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.form-grid .wide{grid-column:1/-1}.form-section{grid-column:1/-1;border-top:1px solid var(--line);padding-top:12px;margin-top:6px}.form-section h3{margin:0 0 2px;font-family:Georgia,serif;font-weight:500}.form-section p{margin:0;color:var(--muted);font-size:12px}textarea{min-height:86px;resize:vertical}.check-line{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:9px!important}.check-line input{width:auto!important}.field-help{font-size:11px;color:var(--muted)}.inline-fields{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.inline-fields label{min-width:160px}.kpi-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #332b25}.kpi-line:last-child{border-bottom:0}.kpi-line strong{font-variant-numeric:tabular-nums}.empty{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:12px}.security-note{font-size:12px;color:var(--muted);line-height:1.5}.sensitive{border:1px solid #7d452f;background:#281a14;padding:12px;border-radius:10px}.sensitive strong{color:#ffc27c}.audit-detail{white-space:pre-wrap;color:var(--muted);font-size:12px}.print-stub{max-width:820px;background:#fff;color:#111;padding:28px;border-radius:8px}.print-stub h1,.print-stub h2{font-family:Georgia,serif}.print-stub table{width:100%;border-collapse:collapse}.print-stub td,.print-stub th{padding:6px 8px;border-bottom:1px solid #ddd;text-align:left}.print-stub .money{text-align:right}.signed-out .topbar{display:none}.signed-out .shell{display:block;min-height:calc(100dvh - 40px)}.signed-out .main{max-width:none;min-height:calc(100dvh - 40px);padding:20px 14px;display:flex;align-items:center;justify-content:center}.auth-stage{width:100%}.auth-card{width:min(440px,100%);max-width:440px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;box-shadow:var(--shadow)}.auth-card img{width:190px;display:block;margin:auto}.auth-kicker{text-align:center;color:var(--accent2);letter-spacing:.22em;font-size:12px;font-weight:800}.auth-card h1{text-align:center;font-family:Georgia,serif;font-weight:500;margin:.45rem 0}.auth-card p{text-align:center;color:var(--muted)}.auth-form{margin-top:20px}.auth-submit{width:100%;padding:12px}.auth-note{font-size:12px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:14px}.modal-head h2{font-family:Georgia,serif;font-weight:500;margin:0}.modal-close{border:0;background:transparent;color:var(--text);font-size:24px}dialog{width:min(820px,calc(100vw - 24px));max-height:90vh;overflow:auto;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 24px 80px rgba(0,0,0,.65)}dialog::backdrop{background:rgba(0,0,0,.7)}footer{height:40px;display:flex;align-items:center;justify-content:center;color:#7d7066;font-size:11px;border-top:1px solid #2f2822}
@media(max-width:900px){.mobile-only{display:block}.shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:30;top:76px;bottom:0;left:0;width:240px;background:var(--bg);transform:translateX(-103%);transition:.2s;box-shadow:20px 0 50px rgba(0,0,0,.45)}.sidebar.open{transform:translateX(0)}.main{padding:20px 14px}.stats{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.day-row{grid-template-columns:1fr}.day-total{text-align:left}.topbar{padding:0 12px}.brand img{height:48px}.brand span{display:none}.table{min-width:620px}}
@media(max-width:520px){.stats{grid-template-columns:1fr 1fr}.stat{padding:13px}.stat strong{font-size:24px}.page-head{display:block}.page-head .actions{margin-top:12px}.auth-card{margin:0 auto;padding:22px 20px}.punch{align-items:flex-start;flex-direction:column}.punch .actions{width:100%}.punch .btn{flex:1}.brand div strong{font-size:13px}.form-grid{gap:10px}}
@media print{body{background:#fff;color:#000}.topbar,.sidebar,footer,.no-print{display:none!important}.shell{display:block}.main{padding:0;max-width:none}.print-stub{box-shadow:none;padding:0;max-width:none}dialog{position:static;border:0;box-shadow:none;max-height:none;width:auto}.modal-head .modal-close{display:none}}
.print-form{max-width:980px;background:#fff;color:#111;padding:28px;border-radius:8px}.print-form h1,.print-form h2,.print-form h3{font-family:Georgia,serif}.print-form table{width:100%;border-collapse:collapse;margin:12px 0}.print-form th,.print-form td{padding:7px 8px;border:1px solid #ccc;text-align:left}.print-form .money{text-align:right}.print-form .form-note{border-top:1px solid #bbb;padding-top:10px;color:#444;font-size:12px}.card a{color:var(--accent2)}
@media print{.print-form{box-shadow:none;padding:0;max-width:none}.print-form a{color:#000;text-decoration:none}}

/* v26.09.15.5 weekly whole-sheet 24-hour time entry */
.time24-input{width:92px!important;min-width:82px;font-variant-numeric:tabular-nums;text-align:center;letter-spacing:.04em}
.week-editor-head{display:grid;grid-template-columns:58px 92px 92px minmax(140px,1fr) 70px 160px;gap:8px;padding:0 10px 8px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}
.week-day{border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden;background:#191511}.week-day-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#241d18;border-bottom:1px solid var(--line)}.week-day-head div{display:flex;gap:9px;align-items:baseline}.week-day-head span{font-size:11px;color:var(--accent2)}
.week-time-rows{display:grid;gap:6px;padding:9px}.week-time-row{display:grid;grid-template-columns:58px 92px 92px minmax(140px,1fr) 70px 160px;gap:8px;align-items:center}.week-time-row input{background:#14110f;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:8px}.week-time-row.new{padding-top:7px;border-top:1px dashed #3a3029}.week-time-label{font-size:11px;color:var(--muted);text-transform:uppercase}.week-row-hours{text-align:right;font-variant-numeric:tabular-nums;color:#ddd0c3}.week-note{min-width:0}
@media(max-width:900px){.week-editor-head{display:none}.week-time-row{grid-template-columns:56px 1fr 1fr}.week-time-row .week-note{grid-column:1/-1}.week-time-row .week-row-hours{grid-column:1/2;text-align:left}.week-time-row .actions{grid-column:2/-1}.time24-input{width:100%!important}.week-day-head{position:sticky;top:0;z-index:1}}


/* v26.09.15.5 whole-sheet editor + branded paystub */
.week-day-head .actions{margin-left:auto}.week-time-row.pending-delete{opacity:.45;background:#2b1715;padding:6px;border-radius:8px}.week-time-row.pending-delete .week-row-hours{text-decoration:line-through}.week-save-bar{position:sticky;bottom:-20px;background:linear-gradient(180deg,rgba(32,27,23,.84),var(--panel));padding:14px 0 2px;margin-top:8px;z-index:2}.week-save-bar .btn.primary{min-width:190px}.paystub-brand{display:flex;align-items:center;gap:18px;border-bottom:2px solid #e4d5c6;padding-bottom:14px;margin-bottom:18px}.paystub-brand img{width:155px;height:auto;object-fit:contain;background:#1b1714;border-radius:8px;padding:7px}.paystub-brand h1,.paystub-brand h2{margin:0}.paystub-brand h2{margin-top:4px;font-size:18px;font-family:Inter,system-ui,sans-serif;font-weight:600;color:#555}
@media(max-width:900px){.week-day-head{align-items:flex-start}.week-day-head .actions{justify-content:flex-end}.week-time-row{grid-template-columns:58px 1fr 1fr}.week-time-row .actions{grid-column:2/-1}.week-save-bar{bottom:-20px}.paystub-brand{align-items:flex-start}.paystub-brand img{width:120px}}
@media print{.paystub-brand img{background:#fff;border:1px solid #ddd}}

/* v26.09.15.6 arrow pay-period navigation + save fix */
.week-editor-banner{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.week-editor-banner>div:first-child{flex:1 1 420px}
.week-period-pick{display:flex;flex-direction:column;gap:6px;min-width:245px}
.week-period-pick>span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.week-period-nav{display:grid;grid-template-columns:48px minmax(130px,1fr) 48px;align-items:stretch;gap:8px}
.week-period-arrow{font-size:24px;line-height:1;padding:8px 10px;min-height:48px}
.week-period-current{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px 10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);text-align:center}
.week-period-current strong{font-size:15px}
.week-period-current small{font-size:11px;color:var(--muted);white-space:nowrap}
@media (max-width:700px){.week-period-pick{width:100%;min-width:0}.week-editor-banner{gap:10px}}


/* v26.09.15.7 employee history card layout */
.history-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px}
.history-summary>div{background:#191511;border:1px solid var(--line);border-radius:12px;padding:13px 14px;min-width:0}
.history-summary span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px}
.history-summary strong{display:block;font-family:Georgia,serif;font-size:24px;font-variant-numeric:tabular-nums;white-space:nowrap}
.history-list{display:grid;gap:12px}
.history-period{border:1px solid var(--line);border-radius:13px;background:#191511;overflow:hidden}
.history-period-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:13px 14px;background:#241d18;border-bottom:1px solid var(--line)}
.history-period-head>div:first-child{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.history-period-head>div:first-child strong{font-size:17px}
.history-period-head>div:first-child span{font-size:12px;color:var(--muted)}
.history-status{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;text-align:right}
.history-imported{font-size:11px;color:var(--muted)}
.history-primary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-bottom:1px solid #332b25}
.history-primary>div{padding:13px 14px;border-right:1px solid #332b25}
.history-primary>div:last-child{border-right:0}
.history-primary span,.history-deductions span{display:block;color:var(--muted);font-size:11px;margin-bottom:4px}
.history-primary strong{font-size:21px;font-variant-numeric:tabular-nums}
.history-deductions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:#17130f}
.history-deductions>div{padding:10px 14px;border-right:1px solid #332b25}
.history-deductions>div:last-child{border-right:0}
.history-deductions strong{font-size:13px;font-variant-numeric:tabular-nums}
.history-actions{display:flex;gap:8px;justify-content:flex-end;padding:11px 14px;border-top:1px solid #332b25}
@media(max-width:700px){.history-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.history-period-head{display:block}.history-status{justify-content:flex-start;text-align:left;margin-top:8px}.history-primary{grid-template-columns:repeat(3,minmax(0,1fr))}.history-primary strong{font-size:18px}.history-deductions{grid-template-columns:repeat(2,minmax(0,1fr))}.history-deductions>div:nth-child(2){border-right:0}.history-deductions>div:nth-child(-n+2){border-bottom:1px solid #332b25}.history-actions{justify-content:stretch}.history-actions .btn{flex:1}}
@media(max-width:420px){.history-primary{grid-template-columns:1fr}.history-primary>div{border-right:0;border-bottom:1px solid #332b25}.history-primary>div:last-child{border-bottom:0}}

/* v26.09.15.9 employee username/password login */
.auth-choice{display:grid;gap:16px;margin-top:18px}.auth-choice .auth-form{margin-top:0}.auth-choice h2{margin:0 0 2px;text-align:left;font-family:Georgia,serif;font-size:20px;font-weight:500}.auth-choice .auth-note{margin:0}.auth-divider{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.12em}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}.employee-login{padding:14px;border:1px solid var(--line);border-radius:12px;background:#191511}.employer-login{padding-top:2px}.employee-login label{text-align:left}.employee-login input{font-size:16px}

/* v26.09.15.21: actual payroll check/payment date entry */
.check-date-edit{display:flex;align-items:center;gap:8px;min-width:205px}
.check-date-edit .compact-date{min-width:138px;max-width:150px;padding:8px 9px}
@media (max-width:760px){.check-date-edit{min-width:0;flex-wrap:wrap}.check-date-edit .compact-date{min-width:135px}}


/* v26.09.15.22 employer pay-period arrows + dropdown */
.employer-period-picker{display:grid;grid-template-columns:44px minmax(220px,1fr) 44px;gap:7px;align-items:stretch}
.employer-period-picker .period-step{font-size:21px;line-height:1;padding:8px 10px;min-width:44px}
.employer-period-picker select{min-width:220px;text-align:center}
.employer-period-picker button:disabled{opacity:.38;cursor:default}
@media(max-width:520px){.employer-period-picker{grid-template-columns:42px minmax(0,1fr) 42px;width:100%}.employer-period-picker select{min-width:0;width:100%}}