.payroll-intro{border:1px solid #a9bfdf;background:#e0eafb;border-radius:10px;padding:12px 16px;margin-bottom:16px}.payroll-intro>p{margin:0;font-size:15px}.payroll-intro summary{font-size:14px;color:#2454a5;cursor:pointer;margin-top:5px}.payroll-intro details p{font-size:14px;line-height:1.7;margin:8px 0 0}
.payroll-row-actions{white-space:nowrap}.payroll-row-actions .text-btn{margin-left:6px}
#modal:has(#payroll-edit-form){width:640px;max-width:calc(100vw - 24px)}
#payroll-edit-form fieldset{padding:0;margin:0;border:0;min-width:0}#payroll-edit-form .pe-identity{font-size:14px;line-height:1.6;margin:0 0 14px}
.pe-section{margin:0 0 16px}.pe-section h3{margin:0 0 10px;font-size:17px;color:#244b7d}.pe-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pe-grid .field{margin:0;min-width:0}.pe-grid input{width:100%;min-width:0;min-height:44px}.pe-grid small{display:block;margin:5px 0 0;font-size:14px;line-height:1.5}
.pe-utilities{padding:12px;border:1.5px solid #a6bcd9;border-radius:10px;background:#f3f7fd;margin-bottom:16px}.pe-utilities summary{cursor:pointer;font-size:15px;font-weight:600;color:#244b7d}.pe-utilities summary span{font-size:14px;font-weight:400;margin-left:6px}.pe-utilities>p{font-size:14px;line-height:1.5}
.pe-summary{padding:14px 16px;background:#e9f0fa;border:1px solid #a8bfdf;border-radius:10px}.pe-summary>div{display:flex;justify-content:space-between;gap:12px;font-size:15px;margin-bottom:5px}.pe-summary>small{display:block;font-size:14px;line-height:1.6;margin:5px 0 10px}.pe-summary .pe-net{padding-top:10px;border-top:1px solid #a8bfdf;align-items:center;margin-bottom:0}.pe-net strong{font-size:25px;color:#204f9a}.pe-actions{margin-top:14px}#pe-error:empty{display:none}
@media(min-width:701px){#app .pay-table{min-width:950px}#app .pay-table td small{white-space:normal}#app .pay-table td:nth-child(2) .badge{white-space:nowrap}#app .pay-table td:last-child{white-space:nowrap}}
@media(max-width:600px){
 #modal:has(#payroll-edit-form){width:100%;max-width:100%;padding:14px}
 #modal:has(#payroll-edit-form) .modal-head{position:sticky;top:-14px;z-index:4;margin:-14px -14px 14px;border-radius:0;padding:12px 14px}
 #modal:has(#payroll-edit-form) .modal-head h2{font-size:18px;line-height:1.5}#modal:has(#payroll-edit-form) .close{flex:none;min-width:44px;min-height:44px}
 .pe-grid{grid-template-columns:1fr;gap:10px}.pe-actions{position:sticky;bottom:-14px;background:#fff;padding:12px 0;margin-bottom:-14px;border-top:1px solid #a8bfdf;z-index:3}
 #app .pay-table.stack .payroll-summary-row{border:2px solid #849bb9;border-left:5px solid #315785;border-radius:12px;background:#fff;padding:12px;gap:8px 10px}
 #app .pay-table.stack td:nth-child(4){grid-column:1;grid-row:2}#app .pay-table.stack td:nth-child(7){grid-column:2;grid-row:2}
 #app .pay-table.stack .payroll-row-actions{grid-column:1/-1;grid-row:3;display:flex;gap:8px}#app .payroll-row-actions button{flex:1;white-space:normal}#app .payroll-row-actions .text-btn{margin:0;border:1px solid #a6bcd9;background:#edf3fb}
}