@font-face{font-family:Poppins;src:url('poppins.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}*{box-sizing:border-box}:root{font-family:Poppins,Arial,sans-serif;font-size:16px;color:#243955;background:#f3f6fb;--navy:#142849;--yellow:#edc655;--maroon:#812e46;--muted:#6b7d94}body{margin:0;line-height:1.65}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #e5bb48;outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-size:32px;line-height:1.35;letter-spacing:-.7px;margin-bottom:8px;color:var(--navy)}h2{font-size:21px;line-height:1.45;margin-bottom:8px;color:var(--navy)}h3{font-size:17px;margin-bottom:8px}.muted{color:var(--muted);font-size:14px}.fineprint{font-size:12px;color:var(--muted);margin-top:16px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:600;color:#8a6722;margin-bottom:8px}.light{color:#f0cf74}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:268px;background:var(--navy);color:#c2cfe2;padding:28px 18px;display:flex;flex-direction:column;z-index:50}.brand{display:flex;align-items:center;gap:11px;padding:0 10px;font-size:15px;font-weight:600;letter-spacing:1px;line-height:1.4;color:white}.brand-mark{display:grid;place-items:center;background:var(--yellow);color:var(--navy);width:45px;height:49px;border-radius:12px;font-size:25px;font-weight:600;flex-shrink:0}.brand small{font-size:9px;font-weight:400;display:block;letter-spacing:1.5px;margin-top:4px;color:#b8c8df}.nav-label{font-size:10px;letter-spacing:1.4px;color:#8ca0c1;display:block;margin:33px 15px 11px}.sidebar nav{overflow-y:auto}.sidebar nav a{display:flex;align-items:center;gap:14px;font-size:13px;margin:5px 0;padding:13px 16px;border-radius:11px;min-height:49px}.sidebar nav a:hover{background:#ffffff09;color:white}.sidebar nav a.active{background:#f1c85a;color:#142849;font-weight:600}.sidebar nav svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;flex-shrink:0}.sidebar-bottom{margin-top:auto;padding:25px 9px 0;display:flex;align-items:center;gap:10px;font-size:12px}.sidebar-bottom strong{display:block;max-width:127px;overflow-wrap:anywhere;font-size:11px;color:#f3f6fb;line-height:1.5}.sidebar-bottom small{font-size:10px;color:#8ca0c1}.avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#304464;color:#fff;flex-shrink:0}.logout{border:0;background:#ffffff0b;color:#d5dfed;font-size:22px;border-radius:8px;width:30px;height:35px}.app-main{margin-left:268px;width:calc(100% - 268px)}.topbar{height:82px;border-bottom:1px solid #e2e8f1;background:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 38px;gap:20px}.breadcrumb{font-size:12px;color:#8390a4}.breadcrumb strong{color:#38516e;font-weight:400}.top-actions{display:flex;align-items:center;gap:16px}.wib{font-size:11px;color:#8190a5}.online-dot{width:8px;height:8px;background:#3c906d;border-radius:50%}.menu-toggle{display:none;background:none;border:0;font-size:23px;color:var(--navy)}main{max-width:1600px;margin:0 auto;padding:34px 38px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:27px}.page-heading p{margin-bottom:0}.panel{background:#fff;border:1px solid #e0e7f1;border-radius:17px;padding:27px;box-shadow:0 5px 15px #14284902}.section-gap{margin-top:22px}.section-heading{display:flex;gap:15px;align-items:center;margin-bottom:20px}.section-heading h2{margin-bottom:4px}.section-heading p{margin-bottom:0}.between{justify-content:space-between}.step{background:#edf2fa;border-radius:11px;width:42px;height:42px;display:grid;place-items:center;color:var(--navy);font-weight:600;flex-shrink:0}.hero{padding:31px 34px;background:var(--navy);border-radius:19px;color:#c8d5e8;display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:25px;position:relative;overflow:hidden}.hero:after{content:'';position:absolute;width:220px;height:220px;border:1px solid #ffffff09;border-radius:50%;right:220px;top:-130px;pointer-events:none}.hero h2{color:white;font-size:28px;margin-bottom:10px}.hero p{font-size:13px;margin-bottom:14px}.hero-chips{display:flex;gap:10px;flex-wrap:wrap}.hero-chips span{font-size:11px;border:1px solid #ffffff20;background:#ffffff08;border-radius:30px;padding:7px 11px}.hero-clock{text-align:right;flex-shrink:0}.hero-clock strong{display:block;color:#f1cb68;font-size:40px;font-weight:500;line-height:1.3;letter-spacing:1px;font-variant-numeric:tabular-nums}.hero-clock span{display:block;font-size:12px;margin-top:10px}.hero-clock small{font-size:9px;letter-spacing:1px;color:#8c9db7}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:22px 0}.stats>div{background:white;border:1px solid #e1e7f0;border-radius:15px;padding:22px}.stats span{font-size:12px;color:#718198;display:block}.stats strong{font-size:31px;font-weight:600;color:var(--navy);line-height:1.5;display:block}.stats em{font-size:12px;font-style:normal;font-weight:400}.stats small{font-size:10px;color:#8190a2}.stats .yellow{background:#fff9e7;border-color:#eedc9d}.stats .maroon{background:#f9eff2;border-color:#edd9df}.stats .maroon strong{color:var(--maroon)}.stats .status-word{font-size:25px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.quick-links a{display:block;padding:18px 0;border-bottom:1px solid #edf0f5}.quick-links a:last-child{border:0}.quick-links strong{font-size:15px;display:block;color:var(--navy)}.quick-links span{font-size:12px;color:#7c8ca2;display:block;margin-top:5px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:48px;min-width:80px;padding:11px 20px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:500;line-height:1.6;width:fit-content}.primary{background:var(--navy);color:white}.primary:hover{background:#274264}.secondary{background:white;border-color:#d7e0ec;color:var(--navy)}.secondary:hover{background:#f6f8fc}.maroon-btn{background:var(--maroon);color:white}.btn.small{padding:8px 13px;font-size:11px;min-height:38px}.btn.full{width:100%}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:19px}.stack>.btn{margin-top:4px}label{display:block;font-size:12px;font-weight:500;color:#3a506d}label input:not([type=checkbox]):not([type=radio]),label select,label textarea{display:block;width:100%;margin-top:7px}input:not([type=checkbox]):not([type=radio]),select,textarea{border:1px solid #d6e0ed;border-radius:9px;padding:12px;color:#2a415f;background:white;min-height:47px;font-size:14px;max-width:100%}textarea{resize:vertical;min-height:75px}label small{font-size:11px;font-weight:400;color:#8090a4;display:block;margin-top:7px}input[type=checkbox],input[type=radio]{accent-color:var(--navy);width:17px;height:17px;vertical-align:middle;flex-shrink:0}.checkline{display:flex;align-items:center;gap:9px;font-size:13px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.wide{grid-column:1/-1}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:24px}.form-footer small{font-size:11px}.report-modes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px}.report-modes label{padding:15px 18px;border:1px solid #dce4f0;border-radius:12px;font-size:14px;cursor:pointer}.report-modes label:has(input:checked){border:2px solid var(--navy);background:#f7f9fc;padding:14px 17px}.report-modes input{margin-right:9px}.report-modes small{margin-left:31px;font-size:11px}.chip,.tag{display:inline-flex;align-items:center;gap:5px;background:#ecf2f9;border-radius:25px;color:#49617e;font-size:11px;padding:7px 12px;white-space:nowrap}.tag{font-size:10px;padding:4px 9px}.tag.warning{background:#fff3cb;color:#88621e}.notice{font-size:12px;padding:18px 23px;border-radius:12px;background:#eaf0f8;border:1px solid #dbe5f3;color:#5a708d;margin:20px 0}.notice strong{font-size:13px;color:#2e496b}.notice p{margin:7px 0 0}.notice ul{margin-bottom:0;padding-left:20px}.notice.success{background:#edf8f1;border-color:#cce7d4;color:#376c4c}.notice.danger{background:#fcf0f3;border-color:#ebd0d9;color:#82354a}.notice.warning{background:#fff8e2;border-color:#eddfa8;color:#7a622c}.inset{background:#f4f7fc;border:1px solid #e4eaf4;border-radius:12px;padding:18px 21px;margin-top:18px;font-size:12px;color:#6f8097}.inset strong{font-size:13px;color:#324c6f}.inset p{margin:6px 0 0}.inset a,.text-link,.steps-list a{color:#254c84;text-decoration:underline;text-underline-offset:3px}.attendance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.attendance-action{background:#fff;border:1px solid #dce5f1;border-radius:13px;padding:22px 12px;min-height:140px;color:var(--navy);display:flex;align-items:center;flex-direction:column;gap:8px}.attendance-action:hover{border-color:#7186a5;background:#f8fafd}.attendance-action strong{font-size:14px}.attendance-action small{font-size:10px;color:#8b98aa}.mode-icon{width:34px;height:34px;border-radius:10px;background:#eff3fa;display:grid;place-items:center;font-size:21px}.attendance-action.done{background:#f2f9f5;border-color:#d6e9dd;opacity:1}.attendance-action.done .mode-icon{background:#e0f0e6;color:#40855b}.announcement{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid #e9edf4}.announcement:last-child{border:0}.announcement h3{margin-top:9px}.announcement p{font-size:13px;color:#647893}.preline{white-space:pre-line}.empty{padding:40px 20px;text-align:center;color:#8a9aae;font-size:13px}.table-panel{padding:0;overflow:hidden}.padded{padding:25px;margin:0}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}th{background:#eef3fa;color:#5e7592;font-size:10px;font-weight:500;padding:15px 18px;white-space:nowrap;border-top:1px solid #e0e7f2;border-bottom:1px solid #e0e7f2}td{padding:16px 18px;border-bottom:1px solid #edf1f7;white-space:nowrap;vertical-align:top;font-variant-numeric:tabular-nums}td small{display:block;font-size:10px;color:#8b98a9;margin-top:5px}.person{min-width:170px;font-weight:600;color:#2c4464}.wrap{white-space:normal;min-width:200px;overflow-wrap:anywhere}.late{color:var(--maroon);font-weight:600;background:#fcf3f5}.late-text{color:var(--maroon)!important}.table-footer,.pagination{padding:17px 25px;font-size:11px;color:#8290a5}.pagination{display:flex;justify-content:space-between;align-items:center}.review-form{min-width:225px}.review-form textarea{width:100%;font-size:12px}.review-form .actions{margin-top:8px}.search-form{display:flex;gap:10px}.search-form input{font-size:12px;width:250px}.large-avatar{display:grid;place-items:center;width:65px;height:65px;border-radius:18px;background:#eaf0fa;color:#35547a;font-size:28px;flex-shrink:0}.employee-heading{display:flex;gap:18px;align-items:center;padding-bottom:25px;margin-bottom:25px;border-bottom:1px solid #e6edf5}.employee-heading p{margin-bottom:0}.date-field{max-width:300px}.schedule-table input[type=time]{max-width:170px}.schedule-table input[type=checkbox]{width:20px;height:20px}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:20px 0}.detail-grid span{display:block;font-size:12px;color:#8290a5}.detail-grid strong{display:block;font-size:24px;font-weight:500;margin-top:5px}.temporary-password{font-size:24px;letter-spacing:2px;overflow-wrap:anywhere;color:var(--navy)}.steps-list{padding-left:24px;font-size:14px;color:#6a7c94}.steps-list li{padding:8px}code{font-family:monospace;background:#edf2f9;border-radius:4px;padding:2px 5px;font-size:12px;color:#47617f}fieldset{border:1px solid #e0e7f1;border-radius:10px;margin:20px 0 0;padding:15px 18px}legend{font-size:12px;color:#637a98}.weekday-list{display:flex;gap:20px;flex-wrap:wrap}.narrow{max-width:720px}.auth-body{background:#142849;min-height:100vh;background-image:radial-gradient(circle at 80% 20%,#284268 0,transparent 50%)}.auth-wrap{padding:40px 22px;max-width:600px}.auth-brand{width:fit-content;margin:0 auto 35px}.auth-card{padding:37px 39px;background:#fff;border-radius:22px;box-shadow:0 12px 50px #0002}.auth-card h1{font-size:29px;line-height:1.45;letter-spacing:-.5px;margin:13px 0}.auth-card>.muted{font-size:13px;margin-bottom:25px}.auth-card .inset{font-size:11px;margin-top:24px}.auth-card .fineprint{font-size:10px}.auth-footer{color:#8b9eba;text-align:center;font-size:11px;margin:25px 0}footer{display:flex;justify-content:space-between;font-size:10px;padding:0 38px 25px;color:#8a98ab}.skip{position:fixed;left:15px;top:-100px;z-index:200;background:white;color:#142849;padding:12px 20px;border-radius:8px}.skip:focus{top:15px}dialog{border:0;border-radius:20px;padding:28px;max-width:520px;width:calc(100% - 32px);box-shadow:0 15px 90px #0004;color:#314a6a}dialog::backdrop{background:#0a1c36bd;backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.icon-button{background:#eef2f7;color:#5c7390;border:0;font-size:25px;border-radius:9px;line-height:1;width:33px;height:33px}video{display:block;width:100%;max-height:340px;object-fit:cover;border-radius:12px;background:#142849}#camera-status{font-size:12px;color:#71859e;margin:15px 0}body:has(dialog[open]){overflow:hidden}[hidden]{display:none!important}@media(min-width:1550px){.form-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{padding:38px 42px}.hero h2{font-size:32px}.hero-clock strong{font-size:46px}}@media(max-width:1180px){.sidebar{width:235px;padding-left:12px;padding-right:12px}.app-main{margin-left:235px;width:calc(100% - 235px)}main{padding:28px 25px}.topbar{padding:0 25px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.two-col{grid-template-columns:1fr}.hero-clock strong{font-size:33px}.hero h2{font-size:24px}.hero p{max-width:350px}.between{flex-wrap:wrap}.actions .btn{font-size:11px}}@media(max-width:850px){.sidebar{transform:translateX(-100%);transition:transform .2s;width:268px;box-shadow:10px 0 50px #14284950}.sidebar-open .sidebar{transform:translateX(0)}.app-main{margin-left:0;width:100%}.menu-toggle{display:block}.topbar{height:70px;padding:0 20px}.breadcrumb{margin-right:auto}.top-actions .wib{display:none}main{padding:25px 20px}.page-heading{margin-bottom:22px}.hero{padding:26px;gap:20px}.hero h2{font-size:24px}.hero-clock span{font-size:11px}.sidebar-bottom strong{max-width:140px}.form-grid{grid-template-columns:1fr 1fr}.narrow{max-width:none}}@media(max-width:580px){h1{font-size:27px}h2{font-size:19px}.page-heading{align-items:flex-start;flex-direction:column;gap:12px}.page-heading .muted{font-size:12px}.hero{align-items:flex-start;flex-direction:column;padding:25px}.hero-clock{text-align:left;border-top:1px solid #ffffff18;padding-top:17px;width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.hero-clock strong{font-size:31px}.hero-clock small{display:none}.hero-clock span{margin-top:0;font-size:10px}.hero-chips span{font-size:10px}.stats{gap:10px}.stats>div{padding:18px 15px}.stats span{font-size:11px}.stats strong{font-size:27px}.stats small{font-size:9px}.panel{padding:22px}.table-panel{padding:0}.form-grid{grid-template-columns:1fr}.report-modes{gap:10px}.report-modes label{font-size:12px;padding:13px}.report-modes label:has(input:checked){padding:12px}.report-modes small{font-size:9px;margin-left:0}.form-footer{align-items:stretch;flex-direction:column}.form-footer .btn{width:100%}.attendance-grid{grid-template-columns:1fr 1fr;gap:10px}.attendance-action{padding:17px 8px;min-height:125px}.attendance-action strong{font-size:12px}.attendance-action small{font-size:9px}.chip{font-size:10px}.padded{padding:21px}.actions{gap:8px}.actions .btn{padding:9px 13px}.detail-grid{grid-template-columns:1fr 1fr}.detail-grid strong{font-size:21px}.search-form{width:100%}.search-form input{width:100%;min-width:0}.employee-heading{align-items:flex-start}.employee-heading h2{font-size:20px}.notice{padding:16px 18px;font-size:11px}.auth-wrap{padding:30px 18px}.auth-card{padding:29px 25px}.auth-card h1{font-size:25px}.auth-brand{margin-bottom:27px}footer{padding:0 20px 22px;font-size:9px}footer span{display:none}.temporary-password{font-size:20px}th,td{padding:13px 16px}.pagination{padding:15px;gap:10px}dialog{padding:23px}.steps-list{font-size:12px}.announcement{flex-direction:column}.weekday-list{gap:15px}}
@media print{.sidebar,.topbar,.page-heading .eyebrow,footer,.actions,form,.notice,.skip,.hero,.stats,dialog{display:none!important}.app-main{margin:0;width:100%}main{padding:0}.page-heading{margin-bottom:15px}.panel{border:0;border-radius:0;box-shadow:none;padding:0}.table-wrap{overflow:visible}th,td{white-space:normal;padding:7px 5px;font-size:9px}.person{min-width:100px}.padded{padding:10px 0}.table-footer{padding:10px 0}.text-link{color:#223850;text-decoration:none}@page{size:A4 landscape;margin:12mm}}
input[type=hidden],dialog:not([open]){display:none!important}
.announcement>div{flex:1;min-width:0}.announcement>form{width:100px;flex:0 0 100px}.announcement>form .btn{display:flex;width:100%;min-height:38px;white-space:nowrap}
