@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap";:root{color:#172035;font-synthesis:none;background:#f4f6fa;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}.login-shell{grid-template-columns:1.08fr .92fr;min-height:100vh;display:grid}.brand-panel{color:#fff;background:radial-gradient(circle at 15% 10%,#866ee8 0,#0000 32%),linear-gradient(145deg,#17214a,#362770 65%,#6e4bc8);flex-direction:column;justify-content:space-between;padding:68px 78px;display:flex}.brand-panel h1{margin:18px 0;font:800 48px/1.12 Manrope}.brand-panel p{color:#d8d5ed;max-width:520px;font-size:18px}.brand-mark{color:#49358e;background:#fff;border-radius:17px;place-items:center;width:58px;height:58px;font:800 19px Manrope;display:grid;box-shadow:0 12px 30px #17132d40}.brand-mark.small{border-radius:12px;width:43px;height:43px}.eyebrow{letter-spacing:.16em;color:#7864c8;font-size:11px;font-weight:700}.brand-panel .eyebrow{color:#c6bdf5}.brand-panel small{color:#aaa5c9}.login-panel{background:#fff;place-items:center;display:grid}.login-panel form{width:min(390px,80%)}.login-icon{color:#6047ba;background:#eeeafd;border-radius:15px;place-items:center;width:54px;height:54px;display:grid}.login-panel h2{margin:25px 0 6px;font:800 34px Manrope}.login-panel p{color:#777e90;margin-bottom:32px}label{gap:8px;min-width:0;margin-bottom:18px;font-size:13px;font-weight:600;display:grid}input,select{box-sizing:border-box;color:#172035;background:#fff;border:1px solid #d9dde6;border-radius:9px;outline:none;width:100%;min-width:0;height:44px;min-height:44px;padding:0 13px;font-size:13px}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2001/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236048b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:36px}input[type=datetime-local],input[type=date]{height:44px;min-height:44px;padding:0 12px;font-size:13px}input[type=datetime-local]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.7;transition:opacity .15s}input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.7;transition:opacity .15s}input[type=datetime-local]::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}input:focus,select:focus{border-color:#765bd0;box-shadow:0 0 0 3px #765bd015}.primary{color:#fff;cursor:pointer;background:#6048b8;border:0;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:13px 20px;font-weight:700;display:flex}.login-panel .primary{width:100%;margin-top:12px}.error{color:#b84242;background:#fff0f0;border-radius:8px;align-items:center;gap:7px;padding:10px 12px;font-size:13px;display:flex}.app{grid-template-columns:245px 1fr;min-height:100vh;display:grid}.app aside{color:#d6d9e7;background:#171c32;flex-direction:column;padding:28px 18px;display:flex}.logo{align-items:center;gap:12px;padding:0 8px 28px;display:flex}.logo strong,.logo span{display:block}.logo strong{color:#fff;font:700 19px Manrope}.logo span{color:#9299b2;font-size:11px}.app nav{gap:5px;display:grid}.app nav button,.logout{color:#aeb4c8;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:8px;align-items:center;gap:11px;padding:11px 13px;display:flex}.app nav button.active{color:#fff;background:#654cbd}.logout{margin-top:auto}.content{min-width:0;padding:34px 40px}.content header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.content header h1{margin:5px 0;font:800 29px Manrope}.status{background:#fff;border:1px solid #e2e5eb;border-radius:22px;align-items:center;gap:8px;padding:9px 13px;font-size:12px;display:flex}.status span{background:#28aa7c;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #28aa7c18}.cards{grid-template-columns:repeat(4,1fr);gap:18px;display:grid}.metric,.panel{background:#fff;border:1px solid #e6e8ee;border-radius:13px;box-shadow:0 4px 18px #1b234508}.metric{align-items:center;gap:16px;padding:21px;display:flex}.metric-icon{border-radius:12px;place-items:center;width:45px;height:45px;display:grid}.metric span{color:#7b8292;font-size:12px}.metric strong{margin-top:2px;font:800 27px Manrope;display:block}.grid-two{grid-template-columns:1.35fr 1fr;gap:18px;margin-top:18px;display:grid}.panel{padding:22px}.panel-title{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.panel-title h3{margin:0;font:700 17px Manrope}.panel-title p{color:#8a90a0;margin:4px 0 0;font-size:12px}.health-row{background:#f7faf9;border-radius:10px;align-items:center;gap:13px;padding:16px;display:flex}.health-row strong,.health-row span{display:block}.health-row span{color:#7a8290;margin-top:4px;font-size:12px}.health-row em{color:#188f6a;margin-left:auto;font-size:12px;font-style:normal}.big-number{color:#6048b8;font:800 38px Manrope}.big-number span{color:#7a8192;font:400 12px DM Sans;display:block}.compact{padding:9px 13px}.icon-button,.ghost{cursor:pointer;background:#fff;border:1px solid #dfe2e9;border-radius:8px;padding:8px 10px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px}th{text-transform:capitalize;color:#818898;text-align:left;background:#f7f8fb;font-weight:600}th,td{white-space:nowrap;border-bottom:1px solid #eceef2;padding:12px}.empty{text-align:center;color:#9298a7;padding:45px}.modal-bg{z-index:10;background:#11182a80;place-items:center;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:14px;width:min(600px,92vw);max-height:90vh;padding:26px;overflow-y:auto;box-shadow:0 24px 70px #10132955}.form-grid{grid-template-columns:1fr 1fr;align-items:start;gap:0 16px;display:grid}.modal-actions{grid-column:1/-1;justify-content:flex-end;gap:10px;margin-top:12px;display:flex}.stack{max-width:450px}.code-panel{text-align:center;color:#777f90;align-content:center;place-items:center;display:grid}.code-panel>strong{color:#543eaa;letter-spacing:.13em;margin:12px 0;font:800 54px Manrope}.code-panel>span{letter-spacing:.15em;font-size:11px}.code-panel h3{color:#20283b}html,body{-webkit-text-size-adjust:100%;width:100%;max-width:100%;overflow-x:hidden}.header-left{align-items:center;gap:14px;display:flex}.menu-toggle-btn,.close-menu-btn,.sidebar-backdrop{display:none}@media (width>=768px) and (width<=1024px){.app{grid-template-columns:210px 1fr}.content{padding:26px 20px}.cards,.grid-two{grid-template-columns:1fr 1fr}.table-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}}@media (width<=767px){html,body,#root{max-width:100vw;overflow-x:hidden}.cards,.grid-two{grid-template-columns:1fr!important}.login-shell{grid-template-columns:1fr}.brand-panel{display:none}.app{min-height:100vh;position:relative;width:100%!important;max-width:100vw!important;display:block!important;overflow-x:hidden!important}.app aside{box-shadow:none;background:#171c32;overflow-y:auto;z-index:1000!important;width:275px!important;max-width:84vw!important;transition:transform .25s ease-out!important;position:fixed!important;top:0!important;bottom:0!important;left:0!important;transform:translate(-100%)!important}.app aside.open{transform:translate(0)!important;box-shadow:0 0 50px #0009!important}.sidebar-backdrop{-webkit-backdrop-filter:blur(2px)!important;z-index:999!important;background:#0f1423a6!important;display:block!important;position:fixed!important;inset:0!important}.menu-toggle-btn{color:#1e2438;cursor:pointer;background:#fff;border:1px solid #d9dde6;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;box-shadow:0 2px 6px #0000000a;display:inline-flex!important}.menu-toggle-btn:active{background:#f0f2f7}.close-menu-btn{color:#fff;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;margin-left:auto;display:inline-flex!important}.close-menu-btn:hover{background:#ffffff1f}.content{box-sizing:border-box!important;width:100%!important;max-width:100%!important;padding:16px 12px!important;overflow-x:hidden!important}.content header{align-items:center;margin-bottom:16px}.content header h1{margin:2px 0 0;font-size:22px}.status{display:none!important}.panel{box-sizing:border-box;border-radius:12px;width:100%;max-width:100%;overflow-x:hidden;padding:16px 13px!important}.logo{padding-bottom:22px}.form-grid{grid-template-columns:1fr!important}input,select{box-sizing:border-box!important;width:100%!important;height:48px!important;font-size:16px!important}button{font-size:15px}}.success{color:#167a5c;background:#edf9f4;border-radius:8px;align-items:center;gap:7px;margin-bottom:16px;padding:10px 12px;font-size:13px;display:flex}.form-help{color:#7b8292;background:#f7f8fb;border-radius:8px;grid-column:1/-1;margin:0 0 18px;padding:11px 13px;font-size:12px}.form-grid label small{color:#999;margin-left:6px;font-weight:400}.primary:disabled{cursor:not-allowed;opacity:.5}.row-actions{gap:6px;display:flex}.icon-button.danger{color:#b84242;border-color:#f0caca}.success{color:#167755;background:#eaf8f2;border-radius:8px;margin-bottom:14px;padding:10px 12px;font-size:13px}.filter-bar{grid-template-columns:1.4fr 1.1fr 1fr 1fr 1fr auto;gap:10px;margin-bottom:18px;display:grid}.filter-bar input,.filter-bar select{min-width:0}.pagination{color:#777f90;justify-content:space-between;align-items:center;padding-top:18px;font-size:13px;display:flex}.pagination>div{gap:8px;display:flex}button:disabled{opacity:.45;cursor:not-allowed}input[readonly]{color:#777;background:#f3f4f7}.attendance-panel{min-height:620px}.attendance-filters{background:#f7f8fb;border:1px solid #e9ebf1;border-radius:12px;grid-template-columns:1.35fr 1fr 1fr;gap:0 14px;margin-bottom:20px;padding:18px;display:grid}.attendance-filters label{margin-bottom:14px}.attendance-filters label small{color:#9096a5;margin-left:4px;font-weight:400}.filter-actions{align-items:flex-end;gap:9px;padding-bottom:14px;display:flex}.attendance-empty{text-align:center;color:#8991a4;align-content:center;place-items:center;min-height:235px;display:grid}.attendance-empty svg{color:#7760cc;box-sizing:content-box;background:#f0edfb;border-radius:50%;padding:9px}.attendance-empty h3{color:#343d52;margin:15px 0 5px}.attendance-empty p{max-width:540px;margin:0;line-height:1.55}.badge-attendance{letter-spacing:.02em;text-transform:uppercase;border-radius:6px;align-items:center;gap:5px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge-entry{color:#107c57;background:#eaf8f2;border:1px solid #c2ecd9}.badge-exit{color:#b05d10;background:#fdf2e8;border:1px solid #f9dabf}.table-caption-note{color:#788195;justify-content:flex-end;align-items:center;gap:6px;margin-bottom:10px;font-size:12px;font-weight:500;display:flex}.time-primary{color:#182033;letter-spacing:-.01em;font-weight:700}.text-muted{color:#828a9b;font-size:12px}td code,.attendance-card code{color:#3d465c;background:#f0f2f7;border-radius:4px;padding:2px 6px;font-family:inherit;font-size:12px;font-weight:600}.attendance-container{box-sizing:border-box;width:100%;max-width:100%}.attendance-desktop-view{width:100%;display:block}.attendance-mobile-cards{display:none}@media (width<=1024px) and (width>=768px){.attendance-filters{grid-template-columns:1fr 1fr;gap:12px}.filter-actions{grid-column:1/-1;justify-content:flex-end;display:flex}.attendance-desktop-view{-webkit-overflow-scrolling:touch;overflow-x:auto}}@media (width<=767px){.attendance-panel{min-height:auto;padding:16px 12px}.attendance-filters{border-radius:10px;gap:0;margin-bottom:16px;padding:14px;grid-template-columns:1fr!important}.attendance-filters label{color:#242c40;flex-direction:column;gap:6px;width:100%;margin-bottom:12px;font-size:14.5px;font-weight:600;display:flex}.attendance-filters input,.attendance-filters select{box-sizing:border-box;border-radius:8px;width:100%!important;height:48px!important;font-size:16px!important}.filter-actions{flex-direction:column;gap:10px;width:100%;margin-top:4px;padding-bottom:0;display:flex}.filter-actions button{border-radius:8px;justify-content:center;height:46px;width:100%!important;font-size:16px!important}.attendance-desktop-view{display:none!important}.attendance-mobile-cards{box-sizing:border-box;flex-direction:column;gap:12px;width:100%;display:flex!important}.attendance-card{box-sizing:border-box;background:#fff;border:1px solid #e1e5ee;border-radius:12px;flex-direction:column;gap:10px;padding:14px 15px;display:flex;box-shadow:0 2px 8px #161c320a}.attendance-card-header{border-bottom:1px solid #eef1f6;justify-content:space-between;align-items:flex-start;gap:8px;padding-bottom:9px;display:flex}.attendance-card-person{flex-direction:column;gap:3px;min-width:0;display:flex}.attendance-card-person strong{color:#172035;word-break:break-word;font-size:15px;font-weight:700}.attendance-card-doc{color:#616c82;font-size:13px}.attendance-card-body{flex-direction:column;gap:7px;display:flex}.attendance-card-row{justify-content:space-between;align-items:center;gap:8px;font-size:13.5px;display:flex}.card-label{color:#6c768c;flex-shrink:0;font-size:13px;font-weight:500}.card-val{color:#172035;text-align:right;word-break:break-word;font-size:13.5px;font-weight:600}.card-val.time-primary{color:#111726;font-size:14px;font-weight:700}.table-caption-note{justify-content:center;margin-bottom:10px;font-size:12px}}