*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f6f9;color:#222}.topbar{background:#17365d;color:#fff;padding:14px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px}.topbar strong{font-size:21px}.subtitle{display:block;font-size:12px;opacity:.85;margin-top:3px}.topbar nav{display:flex;flex-wrap:wrap;gap:7px}.topbar nav a{color:#fff;text-decoration:none;padding:8px 10px;border-radius:4px;background:rgba(255,255,255,.10);font-size:13px}.container{max-width:1400px;margin:22px auto;padding:0 18px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card{background:#fff;border-radius:8px;padding:18px;box-shadow:0 1px 5px #0001}.card .num{font-size:30px;font-weight:bold}.card small{color:#666}.panel{background:#fff;border-radius:8px;padding:18px;margin-top:18px;box-shadow:0 1px 5px #0001}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.formgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.field label{font-weight:bold;font-size:13px;display:block;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;padding:9px;border:1px solid #ccd2da;border-radius:4px;background:#fff}.field textarea{min-height:75px}.btn{display:inline-block;border:0;border-radius:4px;padding:9px 13px;background:#17365d;color:#fff;text-decoration:none;cursor:pointer}.btn.secondary{background:#65707d}.btn.success{background:#2e7d32}.btn.danger{background:#b3261e}.btn.light{background:#e9edf2;color:#222}.actions{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;background:#fff}th,td{border:1px solid #d9dee5;padding:8px;text-align:left;vertical-align:top;font-size:13px}th{background:#eaf0f7}.right{text-align:right}.muted{color:#6c757d}.alert{padding:11px 14px;border-radius:5px;margin-bottom:14px}.alert.success{background:#e5f4e6;color:#185b1b}.alert.error{background:#fde8e8;color:#8a1717}.badge{display:inline-block;padding:4px 7px;border-radius:12px;background:#e7eef7;font-size:11px}.login{max-width:430px;margin:80px auto}.login .panel{padding:28px}.section-title{margin-top:0;border-bottom:2px solid #e2e7ed;padding-bottom:8px}.report-header{text-align:center;margin-bottom:14px}.report-header h2{margin:0}.print-only{display:none}footer{text-align:center;color:#777;padding:25px;font-size:12px}@media(max-width:900px){.cards,.grid3,.formgrid,.grid2{grid-template-columns:1fr 1fr}.topbar{align-items:flex-start;flex-direction:column}}@media(max-width:600px){.cards,.grid3,.formgrid,.grid2{grid-template-columns:1fr}.topbar nav a{font-size:12px}}
@media print{body{background:#fff}.topbar,footer,.no-print,.actions{display:none!important}.container{max-width:none;margin:0;padding:0}.panel,.card{box-shadow:none}.print-only{display:block}table{font-size:10px}}
.photo-upload{display:flex;align-items:center;gap:20px}.photo-preview,.employee-photo-large{width:120px;height:150px;border:1px solid #b9c2cc;background:#f7f8fa;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#777}.photo-preview img,.employee-photo-large img{width:100%;height:100%;object-fit:cover}.photo-upload small{display:block;margin-top:5px}.profile-top{display:flex;gap:22px;align-items:flex-start}.profile-top-details{flex:1}@media(max-width:600px){.profile-top{flex-direction:column}}