@font-face{font-family:Inter;src:url('assets/inter-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-800.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--nav:#101d32;--orange:#2474f5;--bg:#f3f6fb;--ink:#14213b;--muted:#72819a;--line:#e4ebf4;--green:#139768;--red:#d64b62;--violet:#2474f5;--softviolet:#edf4ff;--lavender:#f6f9fd}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:13px/1.55 Inter,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit}h1,h2,h3,p{overflow-wrap:break-word}.layout{max-width:none;min-height:100vh;margin:0;border-radius:0;box-shadow:none;grid-template-columns:242px minmax(0,1fr);background:var(--bg);overflow:clip}.sidebar{height:100vh;position:sticky;top:0;background:var(--nav);padding:27px 12px 20px;border:0;color:#b5c6e0;scrollbar-width:thin;scrollbar-color:#30415c transparent}.sidebar .brand{color:white;margin:0 12px 27px;font-size:19px;letter-spacing:-.7px;gap:10px}.brandmark{background:#2474f5;border-radius:10px;box-shadow:none;width:36px;height:39px}.brand-caption{font-size:9px;font-weight:400;letter-spacing:.3px;color:#99b2d3;display:block;margin-top:1px}.navlabel{font-size:9px;letter-spacing:1.5px;font-weight:600;color:#637e9f;margin:24px 15px 8px}.navbtn{color:#afc3df;border:0;border-radius:8px;margin:3px 0;padding:12px 15px;min-height:44px;font-size:12px;font-weight:450;gap:14px;background:none}.navbtn:hover{background:#192e4b;color:white;transform:none}.navbtn.active{background:#2677f6;color:white;font-weight:550;box-shadow:none}.navbtn .sym{display:inline-flex;color:inherit;width:19px;align-items:center;justify-content:center}.sym svg,.ui-icon{width:19px;height:19px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}.sidebar .hint{color:#91a9c8!important;font-size:10px}.content{background:var(--bg);padding:0 28px 36px;min-width:0}.workspace-bar{height:70px;background:#fff;border-bottom:1px solid var(--line);margin:0 -28px 26px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.workspace-search{display:flex;align-items:center;gap:10px;position:relative;width:min(470px,55%);color:#6b809f}.workspace-search input{width:100%;background:#f7f9fc;border-radius:8px;padding:9px 12px 9px 36px;font-size:12px}.workspace-search>.ui-icon{position:absolute;left:11px;width:16px}.search-results{position:absolute;z-index:9;top:45px;left:0;right:0;border:1px solid var(--line);border-radius:10px;background:white;box-shadow:0 12px 30px #17284216;max-height:320px;overflow:auto}.search-results button{display:block;text-align:left;width:100%;background:white;border:0;padding:12px 16px;color:var(--ink)}.search-results button:hover{background:#edf4ff}.workspace-user{display:flex;align-items:center;gap:11px;font-size:11px}.user-circle{background:#2677f6;color:white;border-radius:50%;width:35px;height:35px;display:grid;place-items:center;font-weight:600}.workspace-user small{display:block;color:var(--muted);font-size:10px}.icon-button{background:white;border:1px solid var(--line);border-radius:50%;width:35px;height:35px;display:grid;place-items:center;color:#526987}.top{border:0;padding:0;margin-bottom:24px;gap:16px}.top h1{color:#101c35;font-size:27px;line-height:1.2;letter-spacing:-.9px;font-weight:700}.top small{display:block;margin-top:7px;font-size:12px;color:#6b7f9c}.top .row{gap:9px}.top select{border-radius:8px;min-width:150px;font-size:11px}.identity{border-radius:8px;padding:9px 12px;border:1px solid var(--line);color:#4e6384;box-shadow:none;font-size:11px}.hr-hero{padding:0;min-height:0;background:none;border-radius:0;margin:0 0 20px;display:block;overflow:visible}.hr-hero:before,.hr-hero:after,.hero-art{display:none}.hr-hero .eyebrow{font-size:12px;letter-spacing:0;text-transform:none;color:#556d8e;font-weight:400}.hr-hero h2{font-size:27px;letter-spacing:-.8px;line-height:1.25;color:#101c35;margin:5px 0}.hr-hero p{font-size:12px;max-width:none;color:#6b7f9c}.company-pill{background:transparent;color:#71829b;border:0;padding:0;font-size:10px;font-weight:450;margin-bottom:17px}.cards{gap:14px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:18px}.card,.metric{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:none;padding:20px}.metric{min-height:116px;padding:19px 16px 17px 64px}.metric:hover{transform:none;box-shadow:none}.metric:before{content:'';background:#e5efff;border-radius:10px;width:34px;height:38px;left:16px;right:auto;top:23px}.metric:after{content:'';position:absolute;left:24px;top:34px;width:17px;height:16px;background:#2878f8;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a5 5 0 1 1 0 10 5 5 0 0 1 0-10M3 22v-3a9 7 0 0 1 18 0v3z'/%3E%3C/svg%3E") center/contain no-repeat}.metric:nth-child(2):before{background:#def7ec}.metric:nth-child(2):after{background:#11a372}.metric:nth-child(3):before{background:#fff0db}.metric:nth-child(3):after{background:#e59a20}.metric:nth-child(4):before{background:#eee8ff}.metric:nth-child(4):after{background:#8658ed}.metric:nth-child(5):before{background:#ffe7ed}.metric:nth-child(5):after{background:#e5607e}.metric small{font-size:10px;color:#4d6386;font-weight:500}.metric strong{font-size:28px;color:#14213b;letter-spacing:-1px;margin:4px 0 0;line-height:1.3}.metric em{font-size:10px;color:#7d8da5}.title,.brand-summary h3{color:#14213b;font-size:14px;font-weight:650;letter-spacing:-.25px}.card h3{font-size:14px}.grid2{gap:16px;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}.grid2>*{min-width:0}#dashboard>.grid2>.card:nth-child(2){background:white;border:1px solid var(--line);color:var(--ink)}#dashboard>.grid2>.card:nth-child(2) .title{color:var(--ink)}#dashboard>.grid2>.card:nth-child(2) .hint,#dashboard>.grid2>.card:nth-child(2) .muted{color:var(--muted)}#dashboard>.grid2>.card:nth-child(2) .alert{background:#f8fafd;border:1px solid var(--line);color:var(--ink)}.btn{color:#496384;border:1px solid #dce5f0;border-radius:7px;font-size:12px;font-weight:550;box-shadow:none;padding:9px 13px}.btn:hover{background:#f3f7fd;transform:none;box-shadow:none;filter:none}.btn.dark,.btn.orange{background:#2474f5;border-color:#2474f5;color:white;box-shadow:none}.btn.dark:hover,.btn.orange:hover{background:#1765df}.btn.red{background:#fff;color:#cc4963;border-color:#f1d9df}.btn.sm{font-size:11px;padding:6px 10px}.toolbar{gap:9px;margin-bottom:19px}.toolbar input,.toolbar select{font-size:12px}.toolbar input[type=search]{min-width:160px}.tablewrap{overflow:auto;border-radius:8px}table{border-collapse:separate;border-spacing:0}td,th{padding:12px 11px;border-bottom:1px solid #edf1f7;text-align:left}th{background:#f6f8fc;color:#5b7093;font-size:10px;text-transform:none;letter-spacing:0;font-weight:600}td{color:#243b5e;font-size:11px}td small{color:#8795aa;font-size:10px}tbody tr:hover{background:#f8fbff}.tag{font-size:10px;font-weight:500;padding:3px 8px;background:#edf4ff;color:#3275c9}.tag.Active,.tag.Employed,.tag.Approved,.tag.Completed,.tag.Present{color:#11936a;background:#e9f8f1}.tag.Pending,.tag.Training,.tag.Shortage,.tag.Upcoming,.tag.Late{color:#bd7b18;background:#fff5e7}.tag.Rejected,.tag.Cancelled,.tag.Terminated,.tag.Resigned,.tag.Expired,.tag.Absent{color:#cc4e66;background:#fff0f3}input,select,textarea{background:#fff;border:1px solid #dfe7f1;border-radius:7px;color:#243955;padding:10px 12px;outline:none}input:focus,select:focus,textarea:focus{border-color:#74a7f9;box-shadow:0 0 0 3px #2474f514}.field label{font-size:11px;font-weight:550;color:#526785}.fields{gap:16px}.modalbg{background:#0d1b3277;backdrop-filter:blur(3px)}.modal{border-radius:14px;padding:27px;box-shadow:0 25px 70px #101d3230}.modal h2{font-size:21px;letter-spacing:-.5px;color:#17253e}.actions{border-top:1px solid #edf1f7;padding-top:18px;margin-top:24px}.avatar,.profilepic{background:#eaf1fc;color:#537cb5;border-radius:50%;box-shadow:none}.brand-context{border-color:var(--line);box-shadow:none;border-radius:10px}.brand-context .stat{background:#f4f7fc;color:#5c7293}.brand-chip{background:#edf4ff;color:#3378cb;font-weight:550}.brand-route{color:#7088a9}.brand-summary{margin:20px 0}.brand-summary .tablewrap{border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff;box-shadow:none}.notice{background:#f0f6ff;border-color:#dae8fc;color:#496f9d}.alert{background:#fffbf4;border-color:#f3e8d2;border-radius:8px}.click{color:#2474f5;text-decoration:none;font-weight:550}.pill{color:#5d7597;border-color:#dfe7f1;font-size:11px}.pill.selected{background:#2474f5;border-color:#2474f5;color:white}.timeline{border-color:#deebff}.event:before{background:#2474f5}.v12-badge,.v12-kpi span{background:#edf4ff;color:#3977c9;font-weight:550}.v12-summary{margin-top:18px}.idcard{background:white;border-color:var(--line);box-shadow:none}.idcard h2{color:#2474f5}.empty{font-size:12px;padding:38px 20px;color:#8190a7}.insight-grid{margin-bottom:18px}.insight-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:19px}.insight-header h3{margin:0;font-size:14px;letter-spacing:-.25px}.insight-header small{font-size:10px;color:#7e8fa7}.chart-bars{height:156px;display:flex;align-items:flex-end;gap:9px;padding:0 0 25px;border-bottom:1px solid var(--line);margin-bottom:13px}.chart-day{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center;position:relative;gap:2px}.chart-day i{width:38%;display:block;background:#2d7cf9;border-radius:3px 3px 0 0;min-height:0}.chart-day i.absent{background:#b9d5ff}.chart-day small{position:absolute;bottom:-23px;font-size:8px;white-space:nowrap;color:#7289a9}.chart-legend{display:flex;justify-content:center;gap:17px;font-size:10px;color:#6c83a5}.chart-legend span:before{content:'';display:inline-block;width:8px;height:8px;background:#2d7cf9;border-radius:2px;margin-right:6px}.chart-legend span:nth-child(2):before{background:#b9d5ff}.distribution{display:flex;align-items:center;gap:24px;min-height:173px}.donut{width:145px;height:145px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}.donut-core{background:white;border-radius:50%;width:105px;height:105px;display:flex;align-items:center;justify-content:center;flex-direction:column}.donut-core strong{font-size:27px;letter-spacing:-1px}.donut-core small{font-size:10px;color:#7b8da9}.distribution-list{flex:1;min-width:0}.distribution-row{display:flex;gap:8px;align-items:center;padding:6px 0;font-size:10px}.distribution-row i{width:8px;height:8px;border-radius:50%;flex-shrink:0}.distribution-row span{flex:1}.distribution-row b{font-weight:550}.sidebar-footer{padding:25px 12px 0;color:#7e98bb;font-size:9px;line-height:1.8}.dashboard-feed{margin-top:18px}.feed-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #edf1f7;gap:15px;font-size:11px}.feed-row small{color:#8190a7;font-size:10px}.sidebar-toggle{display:none}.date-chip{color:#68809f;font-size:11px}.ui-dashboard .top{margin-bottom:15px}.ui-dashboard .top>div:first-child{display:none}.ui-dashboard .top>.row{margin-left:auto}
@media(min-width:1400px){.metric{padding-left:76px}.metric:before{width:43px;height:47px}.metric:after{left:28px;top:38px}}
@media(max-width:1150px){.layout{grid-template-columns:218px minmax(0,1fr)}.content{padding:0 20px 30px}.workspace-bar{margin:0 -20px 22px;padding:0 20px}.grid2{grid-template-columns:1fr}.distribution{justify-content:center}.cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.sidebar .brand{font-size:17px}.chart-day small{font-size:9px}}
@media(max-width:700px){.layout{display:block}.sidebar{position:fixed;left:0;top:0;bottom:0;height:100dvh;width:242px;z-index:20;transform:translateX(-100%);transition:transform .2s;overflow:auto;box-shadow:none}.menu-open .sidebar{transform:translateX(0);box-shadow:15px 0 70px #10203955}.sidebar .navbtn{display:flex;width:100%;padding:12px 15px;margin:3px 0}.sidebar .navlabel{display:block}.sidebar .navbtn .sym{display:inline-flex}.sidebar-toggle{display:grid;flex-shrink:0}.workspace-bar{height:64px;margin-bottom:20px;gap:10px}.workspace-user>div:not(.user-circle),.workspace-user>.btn,.date-chip{display:none}.workspace-search{width:auto;flex:1}.workspace-search input{font-size:11px;min-width:0}.workspace-user{gap:7px}.content{padding:0 15px 25px}.workspace-bar{margin-left:-15px;margin-right:-15px;padding:0 15px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric{padding:16px 12px 16px 56px;min-height:104px}.metric:before{left:12px;width:32px}.metric:after{left:20px}.metric strong{font-size:24px}.metric small,.metric em{font-size:9px}.top{flex-wrap:wrap}.top .row{width:100%}.top h1,.hr-hero h2{font-size:23px}.card{padding:16px}.fields{grid-template-columns:1fr}.modal{padding:20px}.distribution{gap:20px}.donut{width:130px;height:130px}.donut-core{width:94px;height:94px}.chart-bars{gap:4px}.chart-day small{font-size:7px}.workspace-user .icon-button{width:30px;height:30px}.user-circle{width:30px;height:30px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
@media print{.workspace-bar,.sidebar,.top,.insight-grid,.dashboard-feed{display:none!important}.layout{display:block}.content{padding:0}.card{box-shadow:none;border:0}}
