@media screen{
#letterControls,#hrFormControls{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;margin-bottom:16px}
#letterControls .btn,#hrFormControls .btn{white-space:nowrap;flex-shrink:0}
#letterSearch,#hrFormSearch{flex:1;min-width:160px;width:auto;max-width:none}
#letterFilter{width:180px;flex:0 0 180px}
#hrFormControls .hr-form-cards{display:flex;gap:10px;margin:0;flex-wrap:nowrap}
#view-account .form-grid>label{display:flex;flex-direction:column;gap:8px;font-weight:600;min-width:0}
#view-account .form-grid>label>.field-input{width:100%;max-width:none;min-width:0;box-sizing:border-box}
#view-account .form-grid{gap:18px 24px}
#accountBody{border-top:1px solid #dce6e8;padding-top:20px;width:100%}
#accountBody header{display:none}
#accountBody .meta{display:flex;gap:20px;justify-content:space-between;flex-wrap:wrap;background:#eff7f6;padding:16px;border-radius:10px;margin-bottom:20px}
#accountBody section{margin:0 0 24px;overflow-x:auto}
#accountBody h2{font-size:16px;color:#166d66;margin:0 0 10px}
#accountBody table{width:100%;border-collapse:collapse;table-layout:auto}
#accountBody th,#accountBody td{padding:12px;border:1px solid #dce6e8;text-align:center}
#accountBody th,#accountBody tfoot{background:#edf6f5;font-weight:700}
#accountBody tbody tr:nth-child(even){background:#f8fafb}
#accountBody .empty{color:#647680}
@media(max-width:1100px){#letterControls,#hrFormControls,#hrFormControls .hr-form-cards{flex-wrap:wrap}}
}
@media print{#letterControls,#hrFormControls{display:none!important}}
@media screen{
#view-salary-payments .form-grid>label{display:flex;flex-direction:column;gap:8px;font-weight:600;min-width:0}
#view-salary-payments .form-grid>label>.field-input{width:100%;min-width:0;max-width:none;box-sizing:border-box}
#view-salary-payments .form-grid{gap:18px 24px}
#view-salary-payments>.panel>.form-grid{grid-template-columns:1fr 1.4fr 1.6fr}
#salarySummary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0}
.salary-summary-card{background:#eff7f6;border:1px solid #d9e9e6;border-radius:12px;padding:16px}
.salary-summary-card span{display:block;color:#647680;margin-bottom:10px}
.salary-summary-card strong{display:block;font-size:19px}
#salaryForm{border-top:1px solid #dce6e8;border-bottom:1px solid #dce6e8;padding:18px 0;margin-bottom:22px}
#view-salary-payments h2{font-size:18px;margin:0 0 16px;color:#166d66}
#salaryHistory table{width:100%;border-collapse:collapse}
#salaryHistory th,#salaryHistory td{padding:12px;text-align:center;vertical-align:middle}
#salaryHistory th{background:#edf6f5}
@media(max-width:800px){#salarySummary{grid-template-columns:repeat(2,minmax(0,1fr))}#view-salary-payments>.panel>.form-grid{grid-template-columns:1fr}}
}