*{box-sizing:border-box}body{margin:0;font:15px Arial,sans-serif;background:#f4f7f9;color:#18222c}header{background:#123d32;color:white;padding:16px 24px;display:flex;justify-content:space-between;gap:20px}header a{color:white}main{max-width:1180px;margin:auto;padding:24px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.card{background:white;border-radius:10px;padding:20px;box-shadow:0 2px 10px #0001;margin-bottom:18px}.card strong{display:block;font-size:28px;margin-top:8px}.card em{display:block;margin-top:8px}.login{min-height:100vh;display:grid;place-items:center}.login-card{width:min(390px,92vw)}label{display:block;margin:14px 0}input{display:block;width:100%;padding:11px;margin-top:6px;border:1px solid #bcc8ce;border-radius:6px}button{width:100%;padding:12px;background:#123d32;color:white;border:0;border-radius:6px;font-weight:bold}nav{display:flex;flex-wrap:wrap;gap:10px}nav a{padding:10px 12px;background:#eef4f2;color:#123d32;text-decoration:none;border-radius:6px}.alert{padding:10px;background:#ffe6e6;color:#8c1d1d;border-radius:6px}@media(max-width:600px){header{align-items:flex-start;flex-direction:column}}
.shell{display:grid;grid-template-columns:210px 1fr;min-height:calc(100vh - 54px)}aside{background:#18312b;padding:18px 10px}aside a{display:block;color:#eaf4f1;text-decoration:none;padding:11px 12px;border-radius:6px;margin:3px 0}aside a:hover{background:#284b42}.shell main{width:100%;max-width:none}.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;align-items:end}.inline{display:flex;gap:10px;align-items:end;flex-wrap:wrap}select{display:block;width:100%;padding:11px;margin-top:6px;border:1px solid #bcc8ce;border-radius:6px;background:white}button.small,.inline button,.formgrid button{width:auto;min-width:120px}.notice{padding:12px;background:#e7f6ec;color:#155b31;border-radius:6px;margin-bottom:16px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #e3e9ec;text-align:left;white-space:nowrap}th{background:#f1f5f4}@media(max-width:760px){.shell{grid-template-columns:1fr}aside{display:flex;overflow:auto;gap:4px}aside a{white-space:nowrap}.formgrid{grid-template-columns:1fr}}
@media print{header,aside,form,button{display:none!important}.shell{display:block}.card{box-shadow:none}}

.calendar{margin-top:6px;font-size:9px;display:flex;gap:2px;flex-wrap:wrap}.calendar span{border:1px solid #bbb;padding:1px 2px}.calendar .absent{opacity:.35}

/* Four major payroll segments */
aside{overflow-y:auto}.nav-section{margin:10px 0;border-top:1px solid #355148;padding-top:8px}.nav-section summary{cursor:pointer;color:#fff;font-weight:700;padding:12px 10px;list-style-position:inside}.nav-section a{font-size:13px;padding:9px 12px 9px 24px}.nav-section .section-overview{color:#a8d9c5;font-weight:bold}.nav-pending{display:block;padding:9px 12px 9px 24px;color:#aabdb5;font-size:13px}.nav-pending small{display:block;font-size:10px;margin-top:3px}.module-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}.module-card{margin-bottom:0;border-top:3px solid #28725b}.module-card h3{margin:0 0 12px}.module-card a{color:#155b43;text-decoration:none}.module-card a:hover{text-decoration:underline}.module-card p{line-height:1.5;color:#50645d}.module-status{display:inline-block;padding:5px 9px;border-radius:20px;background:#fff1d3;color:#745311;font-size:12px}.section-intro{line-height:1.6;max-width:850px}.dashboard-link{font-weight:bold}@media(max-width:760px){aside{display:block;max-height:none}.nav-section{display:block}.nav-section a{white-space:normal}}

.period-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#e7eeea;padding:12px 16px;border-radius:8px;margin:18px 0}.period-toolbar label{margin:0}.transaction-launcher{width:auto;margin:8px 8px 12px 0}.transaction-window{width:min(1000px,94vw);max-height:86vh;overflow:auto;padding:0;border:1px solid #547768;border-radius:12px;box-shadow:0 18px 70px #0005}.transaction-window::backdrop{background:#102b2426}.transaction-titlebar{display:flex;align-items:center;justify-content:space-between;background:#123d32;color:#fff;padding:13px 18px;cursor:move;position:sticky;top:0;z-index:2;touch-action:none}.transaction-close{width:auto;background:#fff2;padding:7px 12px;min-width:70px}.transaction-window form{padding:18px;margin:0}.transaction-feedback{padding:12px 18px;background:#e9f5ed;color:#174b35;line-height:1.5}.closed-readonly main form[method="post"]:not(.correction-authorisation){display:none}.transaction-window input[type="hidden"]{display:none}@media print{.period-toolbar,.transaction-launcher,.transaction-window{display:none!important}}@media(max-width:760px){.period-toolbar{display:block}.transaction-window{width:96vw}}

.transaction-window{position:fixed;top:12vh;left:50%;transform:translateX(-50%);margin:0;z-index:1000}.transaction-window[open]{display:block}.transaction-titlebar strong{font-size:16px}

@media screen{td>form[method=post]{max-width:260px}}

.company-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;background:white;border:1px solid #dbe7df;border-radius:8px;padding:12px 16px;margin-top:18px}.company-toolbar label{margin:0}@media(max-width:760px){.company-toolbar{display:block}}