:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#1a2e43;background:#f3f6fa;font-synthesis:none}*{box-sizing:border-box}html{min-height:100%}body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer;border-radius:10px;padding:12px 15px;border:1px solid #cfdae6;background:#fff;color:#23405a;font-weight:650}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:#205b93;border-color:#205b93;color:white}button.secondary{background:#f6f9fc;border-color:#d4e0ed;color:#264664}.full{width:100%}label{font-size:13px;color:#4e6275;font-weight:650;display:block;margin-bottom:13px}input,select{width:100%;background:#fff;border:1px solid #cfdce8;border-radius:10px;padding:12px;margin-top:6px;color:#1d334e;min-width:0}input:focus,select:focus{outline:2px solid #6faad8;outline-offset:1px}h1{font-size:22px;margin:0 0 8px}h2{font-size:18px;margin:0 0 10px}.muted{color:#6b7c8b;font-size:14px}.small-muted{color:#738497;font-size:12px;line-height:1.6}.error-msg,.feedback{padding:13px 15px;border-radius:9px;background:#f9e9e8;border:1px solid #edcfcb;color:#8d3d36}.feedback.success{color:#165b46;background:#ebf7f0;border-color:#b8dfc8}p{line-height:1.6}.brand-mark{width:56px;height:56px;border-radius:15px;background:#17304c;color:white;display:grid;place-items:center;font-weight:800;font-size:26px}.brand-heading{text-align:center;margin-bottom:24px}.brand-heading p{color:#768697;font-size:13px}.login-background{display:grid;place-items:center;padding:20px}.login-card{max-width:410px;width:100%;padding:34px;border:1px solid #dde6ef;background:white;border-radius:20px;box-shadow:0 12px 40px #122c460a;display:flex;flex-direction:column;align-items:center}.login-card form{width:100%}.login-card .small-muted{text-align:center}.clock-background{background:#edf3f9}.clock-header,.admin-header{background:#17304c;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px max(20px,calc((100vw - 1120px)/2))}.clock-header strong,.admin-header strong{font-size:22px;letter-spacing:.02em}.clock-header small,.admin-header small{font-size:12px;color:#c2d4e4;display:block;margin-top:3px}.ghost-button{background:transparent;color:#eff6fd;border-color:#73869b;padding:9px 13px;font-size:12px}.clock-container{max-width:580px;margin:20px auto;padding:0 16px}.clock-time{padding:22px;background:#17304c;color:white;border-radius:17px;text-align:center;display:flex;flex-direction:column;gap:6px;margin-bottom:15px}.clock-time strong{font-size:44px;font-variant-numeric:tabular-nums}.clock-time small{font-size:12px;color:#c3d5e4}.clock-main{border-radius:18px;padding:26px;background:white;border:1px solid #dce5ed}.clock-heading{text-align:center;margin-bottom:18px}.clock-heading p{color:#64778c;font-size:14px;margin:3px 0 0}.staff-avatar{border-radius:14px;background:#ecf2f7;display:grid;place-items:center;width:53px;height:53px;margin:0 auto 12px;font-size:24px;color:#3c607e}.pin-form{max-width:310px;margin:auto}.pin-input{text-align:center;font-size:25px;letter-spacing:.3em;margin-bottom:13px}.pin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:17px}.pin-grid button{min-height:52px;font-size:20px}.pin-grid .key-secondary{font-size:13px;background:#f3f7fb}.recognized-employee{text-align:center;margin-bottom:18px}.recognized-employee h2{margin:6px 0}.recognized-employee p{color:#677c8e}.clock-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:13px}.clock-action-grid button{min-height:69px}.clock-feedback{padding:13px;border-radius:10px;text-align:center;background:#e8f7ed;border:1px solid #c7e6d1;color:#226445}.clock-feedback.error{background:#fff0ef;border-color:#edccc9;color:#93423c}.clock-foot{text-align:center;color:#6f8091;font-size:12px}.admin-container{max-width:1160px;margin:22px auto;padding:0 14px 25px}.admin-tabs{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}.admin-tabs button.active{background:#205b93;color:white;border-color:#205b93}.admin-page{display:grid;gap:15px}.panel-card{padding:20px;background:#fff;border:1px solid #dce5ed;border-radius:15px;min-width:0}.panel-heading{display:flex;align-items:start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.panel-heading>div{flex:1}.panel-heading h1,.panel-heading h2{margin-bottom:4px}.panel-heading p{color:#6e7f92;margin:0;font-size:13px}.panel-heading label{min-width:170px;margin:0}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.stat{background:#f0f5fa;border-radius:11px;padding:14px;min-width:0}.stat span{font-size:12px;color:#728397;display:block}.stat strong{font-size:clamp(18px,2vw,26px);display:block;margin-top:9px;font-variant-numeric:tabular-nums}.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;align-items:start}.employee-list,.record-list,.review-list{display:grid;gap:9px}.employee-card,.record-card,.review-card{width:100%;border:1px solid #dce5ee;border-radius:11px;padding:12px;text-align:right;color:#1c354c;background:#fff}.employee-card.active{background:#edf6fc;border:2px solid #2b76b2;padding:11px}.employee-row,.record-row{display:flex;justify-content:space-between;align-items:center;gap:10px}.employee-row>div:first-child,.record-row>div:first-child{min-width:0;flex:1}.employee-row small,.record-row small{display:block;color:#738395;font-size:12px;margin-top:4px}.status{font-size:12px;color:#697e8e}.status.warning{color:#9e6516}.status.good{color:#187052}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.detail-card{background:#f1f6fa;padding:12px;border-radius:10px}.detail-card span{display:block;font-size:12px;color:#6f8092}.detail-card strong{display:block;font-size:19px;margin-top:7px;overflow-wrap:anywhere}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.actions button{flex:1}.toolbar,.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));align-items:end;gap:12px;margin:14px 0}.toolbar label,.form-grid label{margin:0}.review-card{display:grid;gap:10px}.review-card .detail-grid{margin:0}.review-card button{font-size:13px}.record-card{display:grid;gap:6px}.record-card p{margin:0}.stats-description{font-size:12px;color:#748397}.dashboard-table{width:100%;border-collapse:collapse;margin-top:10px}.dashboard-table td,.dashboard-table th{text-align:right;border-bottom:1px solid #e2e8ef;padding:10px 8px;font-size:13px}.text-direction-ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}.empty{color:#738394;text-align:center;padding:22px;background:#f7f9fb;border-radius:10px}.inline-tag{display:inline-block;background:#eaf1f8;border-radius:6px;padding:3px 7px;font-size:11px}details.panel-card summary{cursor:pointer;font-weight:650}#admin-message{margin-bottom:14px}
@media(max-width:760px){.split-grid{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.clock-header,.admin-header{padding:14px 16px}.admin-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.admin-tabs button{padding:12px 8px}.clock-main{padding:20px 15px}.clock-time strong{font-size:39px}}