:root{color:#182235;font-synthesis:none;background:#f7f9fc;font-family:Inter,Arial,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:2px solid #3168eb}.app{min-height:100vh;display:flex}.side{background:#fff;border-right:1px solid #e9edf3;flex-direction:column;flex-shrink:0;width:254px;height:100vh;padding:28px 14px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:11px;padding:0 14px 44px;display:flex}.brandmark{color:#fff;background:#1657db;border-radius:12px;place-items:center;width:38px;height:38px;font-size:23px;font-weight:800;display:grid}.brand strong{letter-spacing:-.8px;font-size:18px}.brand small,.sidebottom small{color:#8791a2;margin-top:3px;font-size:11px;display:block}.workspace{letter-spacing:1.3px;color:#a2aab7;padding:0 18px 15px;font-size:10px;font-weight:800}nav{flex-direction:column;gap:5px;display:flex}nav button{text-align:left;color:#6a7484;background:0 0;border:0;border-radius:10px;align-items:center;gap:13px;padding:13px 16px;font-size:13px;font-weight:600;display:flex}nav button.active{color:#1858db;background:#eaf1ff}nav button:hover{background:#f2f6fc}.sidebottom{border-top:1px solid #edf0f4;align-items:center;gap:10px;margin-top:auto;padding:20px 8px 0;font-size:12px;display:flex}.avatar{color:#2358ca;background:#dce8ff;border-radius:50%;place-items:center;width:35px;height:35px;font-size:11px;font-weight:800;display:grid}.avatar.small{width:32px;height:32px}main{flex:1;min-width:0}header{background:#fff;border-bottom:1px solid #edf0f5;justify-content:space-between;align-items:center;height:78px;padding:0 42px;display:flex}.breadcrumb{color:#9ba3b0;align-items:center;gap:10px;font-size:13px;display:flex}.breadcrumb strong{color:#29364a}.headright{color:#677385;align-items:center;gap:26px;display:flex}.period{color:#68778b;font-size:12px}.hamburger{background:0 0;border:0;display:none}.content{max-width:1600px;margin:auto;padding:38px 42px 60px}.heading{justify-content:space-between;align-items:center;gap:15px;margin-bottom:28px;display:flex}.eyebrow{color:#2a62dc;letter-spacing:1.3px;margin-bottom:10px;font-size:10px;font-weight:800}h1{letter-spacing:-1.2px;margin:0 0 9px;font-size:27px}p{color:#8993a3;margin:0;font-size:13px;line-height:1.6}.primary{color:#fff;white-space:nowrap;background:#1759df;border:1px solid #1759df;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:11px 16px;font-size:12px;font-weight:700;display:inline-flex}.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;margin-bottom:24px;display:grid}.stat,.panel{background:#fff;border:1px solid #e9edf3;border-radius:13px;box-shadow:0 2px 7px #172a4d05}.stat{padding:22px}.stathead{color:#778397;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;display:flex}.staticon{color:#2460db;background:#eef4ff;border-radius:9px;place-items:center;width:35px;height:35px;display:grid}.stat h2{letter-spacing:-1px;white-space:nowrap;margin:18px 0 7px;font-size:24px}.stat small{color:#9aa5b3;font-size:11px}.two{grid-template-columns:1.45fr 1fr;gap:20px;margin-bottom:23px;display:grid}.panel{margin-bottom:22px;overflow:hidden}.panelhead{justify-content:space-between;align-items:center;gap:15px;padding:23px 24px;display:flex}.panelhead h3{letter-spacing:-.4px;margin:0 0 6px;font-size:15px}.panelhead p{font-size:11px}.ghost,.link{color:#2360df;background:0 0;border:0;font-size:12px;font-weight:700}.ghost{align-items:center;gap:7px;display:flex}.bars{padding:8px 24px 28px}.barrow{color:#768194;grid-template-columns:70px 1fr 112px;align-items:center;gap:13px;margin:17px 0;font-size:11px;display:grid}.barrow b{text-align:right;color:#354257;font-size:11px}.track{background:#eef3fb;border-radius:10px;height:9px;overflow:hidden}.track div{background:linear-gradient(90deg,#3979f4,#8eb5ff);border-radius:10px;height:100%}.quick{padding:0 22px 20px}.quick button{text-align:left;color:#344155;background:#fff;border:0;border-bottom:1px solid #f0f2f6;align-items:center;gap:14px;width:100%;padding:12px 2px;font-size:12px;font-weight:600;display:flex}.quick button:last-child{border:0}.quick button>span{flex:1}.quickicon{color:#2d64d8;background:#f1f5fd;border-radius:9px;padding:10px}.tablewrap{overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;min-width:770px}th{color:#8a95a4;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;background:#fafbfd;padding:15px 24px;font-size:10px}td{color:#657186;white-space:nowrap;border-top:1px solid #f0f2f6;padding:15px 24px;font-size:12px}td b{color:#263247;font-size:12px}td small{color:#9aa4b1;margin-top:5px;font-size:10px;display:block}.person{align-items:center;gap:11px;display:flex}.personavatar{color:#4772b8;background:#e5ecff;border-radius:50%;place-items:center;width:35px;height:35px;font-size:11px;font-weight:800;display:grid}.c1{color:#b97651;background:#fce8df}.c2{color:#4d9b6a;background:#e3f5e8}.c3{color:#9270bd;background:#f0e7ff}.status{color:#219564;background:#e8f7ef;border-radius:30px;padding:6px 10px;font-size:10px;font-weight:700;display:inline-block}.search{color:#8c97a6;border:1px solid #e6eaf0;border-radius:8px;align-items:center;gap:8px;padding:10px 12px;display:flex}.search input{border:0;outline:0;min-width:160px;font-size:12px}.controls{gap:10px;display:flex}.controls input,.settings input,.eos input,.eos select{background:#fff;border:1px solid #e3e9f1;border-radius:7px;max-width:180px;padding:9px}.controls label{color:#7b8796;font-size:12px}.controls label input{width:62px}.info{color:#66768e;background:#f2f6fd;border-radius:8px;margin:18px 24px 24px;padding:14px 16px;font-size:12px;line-height:1.7}.upload{cursor:pointer}.eos,.settings{flex-wrap:wrap;gap:20px;padding:15px 24px 30px;display:flex}.eos label,.settings label{color:#69768a;flex-direction:column;gap:9px;font-size:12px;display:flex}.estimate{background:#f6f9ff;border-radius:10px;width:100%;padding:22px}.estimate small{color:#7b8798}.estimate h2{color:#1b58d7;font-size:30px}.file{border-top:1px solid #eef1f5;align-items:center;gap:14px;padding:20px 25px;font-size:12px;display:flex}.file span{color:#8b95a3;margin-left:auto}.empty{text-align:center;color:#9ba6b5;padding:45px;font-size:13px}.overlay{z-index:10;background:#12203980;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.dialog{background:#fff;border-radius:15px;width:min(610px,100%);max-height:90vh;overflow:auto;box-shadow:0 20px 70px #15243d38}.dialoghead{border-bottom:1px solid #eef0f4;justify-content:space-between;align-items:start;padding:26px 28px;display:flex}.dialoghead h2{margin:0 0 7px;font-size:20px}.iconbtn{background:#f2f5f9;border:0;border-radius:8px;padding:7px}.fields{grid-template-columns:1fr 1fr;gap:17px;padding:24px 28px;display:grid}.fields label{color:#5e6b7d;flex-direction:column;gap:8px;font-size:11px;font-weight:700;display:flex}.fields input{border:1px solid #e1e6ee;border-radius:8px;width:100%;padding:12px;font-size:12px}.dialogfoot{border-top:1px solid #eef0f4;justify-content:flex-end;gap:10px;padding:20px 28px;display:flex}.secondary{color:#627085;background:#fff;border:1px solid #e0e5ed;border-radius:8px;padding:11px 18px}.slip{padding:25px 30px}.slip h2{color:#1858db}.slip h3{margin-bottom:5px}.slip hr{border:0;border-top:1px solid #e6eaf1;margin:20px 0}.sliprow{border-bottom:1px solid #edf0f4;justify-content:space-between;padding:16px 0;font-size:13px;display:flex}.sliprow.net{color:#1658df;font-size:17px}.full{width:100%;margin-top:24px}@media (width<=1200px){.stats{grid-template-columns:repeat(2,1fr)}.two{grid-template-columns:1fr}}@media (width<=800px){.side{z-index:5;transition:left .2s;position:fixed;left:-260px}.side.open{left:0}.hamburger{display:block}header{padding:0 18px}.content{padding:26px 16px}.heading{align-items:start}.period{display:none}.stats{gap:10px}.stat{padding:15px}.stat h2{font-size:19px}.fields{grid-template-columns:1fr}.panelhead{flex-wrap:wrap}.barrow{grid-template-columns:52px 1fr 94px;gap:7px}.barrow b{font-size:10px}}@media print{.side,header,.heading,.dialoghead,.dialogfoot,.slip button,.content{display:none!important}.overlay{background:#fff;padding:0;position:static}.dialog{box-shadow:none;width:100%;max-height:none}.slip{padding:20px}}.actions,.controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.secondary{justify-content:center;align-items:center;gap:7px;display:inline-flex}.refresh{padding:11px 14px}.connection{text-transform:capitalize;color:#9b6911;background:#fff3db;border-radius:20px;align-items:center;gap:6px;padding:7px 10px;font-size:11px;display:flex}.connection.unavailable,.connection.not_configured{color:#b94343;background:#ffeded}.error{color:#9d3939;background:#fff3f3;border:1px solid #f2c8c8;border-radius:9px;margin:-8px 0 22px;padding:14px 16px;font-size:12px;line-height:1.6}.integration-list{padding:0 22px 20px}.integration{color:#4770bd;border-bottom:1px solid #edf0f4;align-items:center;gap:12px;padding:15px 2px;display:flex}.integration:last-child{border:0}.integration div{flex:1}.integration b,.integration small{color:#334156;font-size:12px;display:block}.integration small{color:#929dac;margin-top:4px}.integration span{border-radius:20px;padding:6px 9px;font-size:10px;font-weight:700}.integration .ok{color:#1a8659;background:#e7f7ef}.integration .off{color:#9b6911;background:#fff3db}.file small{color:#919cab;margin-top:5px;display:block}.primary:disabled,.secondary:disabled{opacity:.6;cursor:wait}@media (width<=800px){.connection{display:none}.heading{flex-direction:column}.actions{width:100%}}.logout{color:#2360df;text-align:left;background:0 0;border:0;padding:3px 0;font-size:10px;display:block}.login-page{background:radial-gradient(circle at 0 0,#dce9ff 0,#0000 38%),#f5f8fd;place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:#fff;border:1px solid #e5eaf2;border-radius:18px;width:min(430px,100%);padding:42px;box-shadow:0 25px 70px #254b8c1a}.login-brand{padding:0 0 35px}.login-org{color:#1759df;letter-spacing:1px;background:#edf3ff;border-radius:20px;margin-bottom:18px;padding:7px 11px;font-size:10px;font-weight:800;display:inline-block}.login-card h1{font-size:28px}.login-card>p{margin-bottom:28px}.login-card form{flex-direction:column;gap:17px;display:flex}.login-card form label{color:#59677b;flex-direction:column;gap:8px;font-size:11px;font-weight:700;display:flex}.login-card input{border:1px solid #dce3ed;border-radius:9px;padding:13px}.login-card .full{margin-top:4px}.login-error{color:#a23d3d;background:#fff0f0;border-radius:8px;padding:11px;font-size:11px}.login-help{text-align:center;color:#9ba5b3;margin-top:24px;display:block}.fields select{background:#fff;border:1px solid #e1e6ee;border-radius:8px;width:100%;padding:12px;font-size:12px}.category-section{border-top:1px solid #edf0f4;padding:24px}.category-section h3{margin:0 0 6px;font-size:15px}.category-add{gap:10px;margin:20px 0;display:flex}.category-add input{border:1px solid #dfe5ee;border-radius:8px;min-width:240px;padding:11px}.category-grid{flex-wrap:wrap;gap:8px;display:flex}.category-grid span{color:#285ebf;background:#edf3ff;border-radius:20px;padding:7px 11px;font-size:11px;font-weight:600}.expiry{color:#3764b3;background:#edf3ff;border-radius:20px;padding:6px 9px;font-size:10px;font-weight:700;display:inline-block}.expiry.pending{color:#778292;background:#f1f2f5}.expiry.warning{color:#976510;background:#fff1cc}.expiry.expired{color:#b63d3d;background:#ffe8e8}.alert-panel{border-color:#f0d38a}.alert-row{text-align:left;background:#fff;border:0;border-top:1px solid #f1f2f5;justify-content:space-between;align-items:center;width:100%;padding:14px 24px;display:flex}.alert-row:hover{background:#fffaf0}.alert-row b,.alert-row small{display:block}.alert-row b{color:#2d3849;font-size:12px}.alert-row small{color:#929cab;margin-top:4px;font-size:10px}.jmc-slip{color:#111;padding:28px 34px;font-family:Arial,sans-serif}.jmc-slip h2,.jmc-slip h3,.jmc-slip h4{text-align:center;color:#111;margin:5px}.jmc-slip h2{font-size:19px}.jmc-slip h3{margin:25px 0;font-size:18px}.jmc-slip h4{font-size:13px}.jmc-logo{color:#fff;background:#08792d;border:7px solid #e4001b;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:78px;height:78px;margin:0 auto 10px;display:flex;box-shadow:inset 5px 0 #fff}.jmc-logo span{font-family:Georgia,serif;font-size:25px;font-weight:800}.jmc-logo small{font-size:9px;font-weight:800}.voucher-meta,.employee-meta{grid-template-columns:1fr 1.4fr;gap:20px;padding:12px 3px;font-size:12px;display:grid}.employee-meta{margin-top:8px}.employee-meta b{margin-left:7px}.voucher-title{text-align:center;border-top:2px solid #222;border-bottom:3px double #222;margin-top:10px;padding:5px;font-size:13px}.voucher-line{border-bottom:1px solid #aaa;grid-template-columns:1.15fr 1fr .65fr;align-items:center;gap:12px;min-height:44px;padding:7px 3px;font-size:12px;display:grid}.voucher-line>b,.voucher-total>b{text-align:right}.voucher-line small{font-size:11px}.voucher-total{border-bottom:1px solid #222;grid-template-columns:1fr .65fr;margin-left:38%;padding:10px 3px;font-size:13px;font-style:italic;display:grid}.voucher-total.net{border-bottom:3px double #222;font-size:16px;font-style:normal}.amount-words{text-align:center;border-bottom:3px double #222;padding:9px 3px}.amount-words b{margin-bottom:7px;display:block}.amount-words span{font-size:12px}.signatures{grid-template-columns:1fr 1fr;gap:24px 35px;padding:28px 3px 5px;font-size:11px;display:grid}.dialog:has(.jmc-slip){width:min(800px,100%)}.jmc-slip{--jmc-blue:#075595;--jmc-red:#ef2229;--ink:#172233;color:var(--ink);background:#fff;padding:30px 38px;font-family:Arial,sans-serif}.jmc-brand{border-bottom:3px solid var(--jmc-blue);justify-content:center;align-items:center;height:105px;padding:0 0 16px;display:flex}.jmc-brand img{object-fit:contain;width:min(100%,570px);height:92px;display:block}.jmc-heading{text-align:center;padding:18px 0 15px}.jmc-heading span{letter-spacing:.8px;color:var(--jmc-blue);font-size:20px;font-weight:800;display:block}.jmc-heading small{letter-spacing:1.8px;color:#8390a0;margin-top:5px;font-size:8px;display:block}.jmc-slip .voucher-meta{grid-template-columns:1fr 1fr;gap:12px;padding:0 0 12px;display:grid}.jmc-slip .voucher-meta>span,.jmc-slip .employee-meta>span{background:#f8fafc;border:1px solid #dbe3eb;border-radius:7px;flex-direction:column;gap:5px;padding:10px 12px;display:flex}.jmc-slip .voucher-meta small,.jmc-slip .employee-meta small,.jmc-slip .amount-words small{letter-spacing:.8px;color:#758397;font-size:8px;font-weight:800}.jmc-slip .voucher-meta b,.jmc-slip .employee-meta b{color:#172233;margin:0;font-size:11px}.jmc-slip .employee-meta{grid-template-columns:1fr 1.4fr;gap:10px 12px;margin:0;padding:0 0 16px;display:grid}.jmc-slip .voucher-title{background:var(--jmc-blue);color:#fff;text-align:left;letter-spacing:1px;border:0;border-radius:6px 6px 0 0;grid-template-columns:1fr 150px;margin:0;padding:10px 14px;font-size:9px;font-weight:800;display:grid}.jmc-slip .voucher-title span:last-child{text-align:right}.jmc-slip .voucher-line{border:1px solid #dbe3eb;border-top:0;grid-template-columns:1fr 150px;align-items:center;gap:12px;min-height:56px;padding:10px 14px;font-size:11px;display:grid}.jmc-slip .voucher-line>span{flex-direction:column;gap:4px;display:flex}.jmc-slip .voucher-line small{color:#8390a0;font-size:9px}.jmc-slip .voucher-line>b{text-align:right;font-size:12px}.jmc-slip .voucher-line.deduction b{color:#b43d43}.jmc-slip .voucher-total{background:#f5f8fb;border:1px solid #dbe3eb;border-top:0;grid-template-columns:1fr 150px;margin:0;padding:11px 14px;font-size:12px;font-style:normal;display:grid}.jmc-slip .voucher-total.net{background:var(--jmc-blue);color:#fff;border:0;border-radius:0 0 6px 6px;padding:14px;font-size:17px}.jmc-slip .amount-words{border:1px solid #dbe3eb;border-left:4px solid var(--jmc-red);text-align:left;border-radius:6px;margin:15px 0;padding:12px 14px}.jmc-slip .amount-words b{margin:5px 0 0;font-size:11px;display:block}.jmc-slip .signatures{color:#526174;grid-template-columns:repeat(2,1fr);gap:22px 32px;padding:22px 2px 12px;font-size:9px;display:grid}.jmc-slip .signatures span{flex-direction:column;gap:18px;display:flex}.jmc-slip .signatures strong{border-bottom:1px solid #7e8996}.jmc-footer{color:#8a96a4;letter-spacing:.3px;border-top:1px solid #dbe3eb;justify-content:space-between;padding-top:9px;font-size:8px;display:flex}@page{size:A4 portrait;margin:10mm}@media print{html,body{background:#fff;width:210mm;min-height:297mm}.dialog:has(.jmc-slip){width:190mm!important}.jmc-slip{width:190mm;min-height:277mm;box-shadow:none;margin:0 auto;padding:10mm!important}.jmc-slip .full{display:none!important}.jmc-brand img{max-width:150mm}}.report-toolbar{background:#fff;border:1px solid #e9edf3;border-radius:13px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;padding:21px 24px;display:flex}.report-toolbar h3{margin:0 0 6px;font-size:16px}.report-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.report-breakdown{padding:0 24px 24px}.report-breakdown-row{color:#657186;grid-template-columns:150px 1fr 28px;align-items:center;gap:12px;margin:12px 0;font-size:11px;display:grid}.report-breakdown-row>div{background:#edf2f8;border-radius:8px;height:7px;overflow:hidden}.report-breakdown-row i{background:linear-gradient(90deg,#075595,#4c91ca);border-radius:8px;height:100%;display:block}.report-breakdown-row b{text-align:right;color:#233148}.report-table{min-width:1350px}@media (width<=900px){.report-toolbar{flex-direction:column;align-items:flex-start}.report-grid{grid-template-columns:1fr}}.controls select{background:#fff;border:1px solid #dfe5ee;border-radius:8px;max-width:280px;padding:10px}.individual-head{grid-template-columns:1fr 1fr;gap:12px;padding:0 24px 16px;display:grid}.individual-head>div{background:#f7f9fc;border:1px solid #e7ebf1;border-radius:9px;padding:14px}.individual-head small,.salary-cards small{letter-spacing:.8px;color:#8995a5;font-size:8px;font-weight:800;display:block}.individual-head b{margin:7px 0 4px;font-size:14px;display:block}.individual-head span,.salary-cards span{color:#8b96a5;font-size:10px}.salary-cards{grid-template-columns:repeat(3,1fr);gap:10px;padding:0 24px 24px;display:grid}.salary-cards>div{border:1px solid #e5eaf1;border-radius:9px;padding:14px}.salary-cards b{color:#26354a;margin-top:8px;font-size:15px;display:block}.salary-cards .deduct{background:#fff7f7}.salary-cards .deduct b{color:#b54148}.salary-cards .net b{color:#1759df}@media (width<=800px){.individual-head,.salary-cards{grid-template-columns:1fr}}.report-charts{grid-template-columns:minmax(300px,.8fr) minmax(420px,1.2fr);gap:20px;margin-bottom:20px;display:grid}.chart-panel{min-width:0}.chart-wrap{height:270px;padding:0 16px 18px;position:relative}.chart-wide{height:270px;padding:0 22px 18px 6px}.donut-total{pointer-events:none;flex-direction:column;align-items:center;display:flex;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.donut-total small{letter-spacing:1px;color:#8995a5;font-size:8px;font-weight:800}.donut-total b{color:#243148;margin-top:5px;font-size:12px}.salary-trend{border-top:1px solid #edf0f4;padding:22px 24px 12px}.salary-trend h4{margin:0 0 4px;font-size:13px}.salary-trend p{color:#8d98a7;margin:0;font-size:10px}.trend-chart{height:290px;margin-top:12px}.recharts-default-tooltip{border:1px solid #dfe5ee!important;border-radius:8px!important;font-size:11px!important;box-shadow:0 10px 30px #223e6b18!important}.recharts-legend-item-text{font-size:10px;color:#647186!important}.recharts-cartesian-axis-tick-value{fill:#7d8999}.recharts-cartesian-grid line{stroke:#edf0f4}@media (width<=1000px){.report-charts{grid-template-columns:1fr}}@media (width<=600px){.chart-wrap,.chart-wide{height:240px;padding-left:4px;padding-right:8px}.trend-chart{height:250px}.salary-trend{padding-left:12px;padding-right:12px}}.breakdown-chart{border-bottom:1px solid #edf0f4;height:230px;padding:0 18px 10px 4px}.attendance-table{min-width:1200px}.punch-cell{white-space:normal;max-width:420px;line-height:1.6}.attendance-status{border-radius:20px;padding:6px 10px;font-size:10px;font-weight:700;display:inline-block}.attendance-status.valid{color:#188038;background:#e6f4ea}.attendance-status.review{color:#c5221f;background:#fce8e6}.attendance-status.corrected{color:#1967d2;background:#e8f0fe}.attendance-notice{margin-top:0}.attendance-dialog{width:min(720px,100%)}.attendance-edit{padding:25px 28px}.attendance-edit label{color:#5f6368;flex-direction:column;gap:8px;margin-bottom:18px;font-size:11px;font-weight:700;display:flex}.attendance-edit textarea,.attendance-edit input{font:inherit;border:1px solid #dadce0;border-radius:8px;padding:12px}.attendance-edit textarea{resize:vertical;min-height:110px}.attendance-edit .info{margin:8px 0 0}.attendance-stats .stat:nth-child(3) h2{color:#c5221f}.duty-type{white-space:nowrap;border-radius:20px;padding:6px 10px;font-size:10px;font-weight:700;display:inline-block}.duty-type.straight{color:#1967d2;background:#e8f0fe}.duty-type.split{color:#9a6700;background:#fef7e0}.attendance-edit select{font:inherit;background:#fff;border:1px solid #dadce0;border-radius:8px;padding:12px}.duty-type.incomplete{color:#c5221f;background:#fce8e6}.employee-profile-link{text-align:left;color:inherit;background:0 0;border:0;padding:0}.employee-profile-link:hover b{color:#1a73e8;text-decoration:underline}.dialog:has(.employee-detail){width:min(940px,100%)}.employee-detail{padding:24px 28px 32px}.employee-id-card{color:#fff;background:linear-gradient(135deg,#1a73e8,#4285f4);border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:24px;display:grid}.employee-id-avatar{color:#1967d2;background:#fff;border:4px solid #fff5;border-radius:50%;place-items:center;width:74px;height:74px;font-size:22px;font-weight:800;display:grid}.employee-id-main small{letter-spacing:1.1px;color:#d9e8ff;font-size:9px}.employee-id-main h2{margin:7px 0 4px;font-size:22px}.employee-id-main p{color:#e8f0fe}.employee-id-main span{background:#ffffff20;border-radius:6px;margin-top:10px;padding:5px 9px;font-size:11px;font-weight:700;display:inline-block}.employee-id-status{text-align:right}.employee-id-status .status{color:#188038;background:#fff}.employee-id-status small{color:#d9e8ff;letter-spacing:1px;margin-top:10px;font-size:8px;display:block}.detail-actions{justify-content:flex-end;gap:10px;margin:16px 0;display:flex}.detail-section{border-top:1px solid #e8eaed;margin-top:20px;padding-top:20px}.detail-section h3{color:#202124;margin:0 0 14px;font-size:14px}.detail-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.detail-item{background:#f8fafd;border:1px solid #e8eaed;border-radius:9px;padding:13px}.detail-item small,.profile-metrics small{color:#80868b;text-transform:uppercase;letter-spacing:.5px;font-size:9px;display:block}.detail-item b{color:#3c4043;margin-top:7px;font-size:12px;display:block}.detail-item b.expired{color:#c5221f}.detail-item b.warning{color:#b06000}.detail-item b.valid{color:#188038}.profile-metrics{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.profile-metrics>div{border:1px solid #e8eaed;border-radius:9px;padding:14px}.profile-metrics b{margin-top:8px;font-size:14px;display:block}.profile-metrics .profile-net{background:#e8f0fe;border-color:#d2e3fc}.profile-net b{color:#1967d2}.recent-punches{margin-top:18px}.recent-punches h4{margin:0 0 8px;font-size:12px}.recent-punches>div{border-top:1px solid #eef0f3;grid-template-columns:90px 1fr auto;align-items:center;gap:12px;padding:10px 0;font-size:10px;display:grid}.recent-punches b{color:#4c5665;font-weight:500}.recent-punches em{font-style:normal}@media (width<=760px){.employee-detail{padding:16px}.employee-id-card{grid-template-columns:auto 1fr}.employee-id-status{text-align:left;grid-column:1/-1}.detail-grid,.profile-metrics{grid-template-columns:repeat(2,1fr)}.recent-punches>div{grid-template-columns:1fr}.detail-actions>*{flex:1}}@media (width<=430px){.detail-grid,.profile-metrics{grid-template-columns:1fr}.employee-id-card{text-align:center;grid-template-columns:1fr}.employee-id-avatar{margin:auto}}.employee-profile-page{max-width:1180px;margin:0 auto}.profile-page-toolbar{justify-content:flex-start;align-items:center;margin-bottom:14px;display:flex}.profile-page-toolbar .secondary{align-items:center;gap:7px;display:inline-flex}.employee-profile-card{overflow:visible}.employee-profile-card .employee-detail{padding:28px 30px 34px}@media (width<=760px){.employee-profile-card .employee-detail{padding:16px}.profile-page-toolbar{margin-bottom:10px}}.attendance-search{background:#fff;min-width:230px}.attendance-search input{min-width:190px}.attendance-result-count{color:#687386;background:#f8fafd;border-top:1px solid #f0f2f5;padding:10px 24px;font-size:11px}.attendance-result-count b{color:#202124}@media (width<=800px){.attendance-search,.attendance-search input{width:100%;min-width:0}.panelhead .controls{width:100%}.panelhead .controls>select,.panelhead .controls>input{flex:1;min-width:150px}}.compact-search{background:#fff;min-width:245px}.compact-search input{min-width:200px}.attendance-panel>.panelhead{grid-template-columns:1fr;align-items:start;gap:18px;padding:24px;display:grid}.attendance-panel>.panelhead>div:first-child{max-width:none}.attendance-panel>.panelhead>.controls{grid-template-columns:minmax(230px,1.4fr) 175px minmax(205px,1fr) 160px 170px max-content;align-items:center;gap:10px;width:100%;display:grid}.attendance-panel .attendance-search{width:100%;min-width:0;height:46px}.attendance-panel .attendance-search input{width:100%;min-width:0}.attendance-panel>.panelhead>.controls>input,.attendance-panel>.panelhead>.controls>select{width:100%;max-width:none;height:46px}.attendance-panel .primary.upload{color:#fff;height:46px;margin:0}.attendance-panel .primary.upload svg{color:#fff}@media (width<=1250px){.attendance-panel>.panelhead>.controls{grid-template-columns:minmax(240px,1fr) 180px minmax(220px,1fr)}.attendance-panel .primary.upload{width:max-content}}@media (width<=800px){.attendance-panel>.panelhead{padding:20px 16px}.attendance-panel>.panelhead>.controls{grid-template-columns:1fr}.attendance-panel>.panelhead>.controls>*{width:100%!important;max-width:none!important}.attendance-panel .primary.upload{width:100%}.compact-search,.compact-search input{width:100%;min-width:0}}:root{--surface:#fff;--canvas:#f6f8fc;--text:#1f2937;--muted:#667085;--line:#e4e7ec;--blue:#1769e0;--blue-soft:#eaf2ff;--green:#16875b;--amber:#a15c00;--red:#c4322b;--radius:12px;--shadow:0 1px 2px #1018280d,0 1px 3px #1018280f}html{scroll-behavior:smooth}body{background:var(--canvas);color:var(--text);-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit}button{transition:background-color .15s,border-color .15s,box-shadow .15s,transform .15s}button:active{transform:translateY(1px)}button:disabled{transform:none}.side{width:244px;padding:22px 12px}.brand{padding:2px 14px 34px}.brandmark{width:40px;height:40px}.side nav{gap:3px}.side nav button{min-height:44px;padding:11px 16px;font-size:13px}.sidebottom{padding:18px 10px 2px}.app>main>header{z-index:4;height:68px;padding:0 34px;position:sticky;top:0}.header-icon{color:#5f6368;background:0 0;border:0;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.header-icon:hover{color:#202124;background:#f1f3f4}.content{max-width:1540px;padding:32px 36px 64px}.heading{margin-bottom:24px}.heading h1{letter-spacing:-.8px;font-size:30px;line-height:1.2}.heading p{color:var(--muted);font-size:13px}.eyebrow{margin-bottom:8px}.primary,.secondary{min-height:40px}.primary:focus-visible,.secondary:focus-visible,.link:focus-visible,.employee-profile-link:focus-visible,.iconbtn:focus-visible,.header-icon:focus-visible{outline-offset:2px;outline:3px solid #aecbfa}.stats{gap:16px}.stat{min-height:148px;padding:20px}.stat h2{margin:16px 0 6px;font-size:25px}.panelhead{min-height:78px;padding:20px 22px}.panelhead h3{font-size:16px}.tablewrap{scrollbar-width:thin;scrollbar-color:#c7cdd6 transparent;width:100%}.tablewrap table{font-variant-numeric:tabular-nums}.tablewrap thead{z-index:1;position:sticky;top:0}.tablewrap th{letter-spacing:.65px;height:44px;padding:12px 20px;font-size:10px}.tablewrap td{color:#475467;height:62px;padding:13px 20px}.tablewrap tbody tr{transition:background-color .12s}.tablewrap tbody tr:hover td{background:#f7faff}.personavatar{flex:none;width:38px;height:38px}.employee-profile-link{border-radius:8px;margin:-6px;padding:6px}.employee-profile-link:hover{background:#edf4ff}.employee-profile-link:hover b{text-decoration:none}.link{border-radius:7px;min-height:34px;padding:6px 10px}.link:hover{background:#eaf2ff}.search{background:#fff;border-color:#d0d5dd;min-height:42px}.search:focus-within{border-color:#4285f4;box-shadow:0 0 0 3px #e8f0fe}.search input{color:#202124;background:0 0}.search input::placeholder{color:#98a2b3}.controls input,.controls select,.fields input,.fields select,.attendance-edit textarea,.attendance-edit input,.attendance-edit select,.settings input,.eos input,.eos select{color:#202124;border-color:#d0d5dd;min-height:42px}.controls input:focus,.controls select:focus,.fields input:focus,.fields select:focus,.attendance-edit textarea:focus,.attendance-edit input:focus,.attendance-edit select:focus{border-color:#4285f4;outline:0;box-shadow:0 0 0 3px #e8f0fe}.status,.expiry,.attendance-status,.duty-type{letter-spacing:.05px;font-weight:700}.empty{color:#667085;background:linear-gradient(#fff,#fbfcfe);padding:56px 24px}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0f172a8f;padding:24px}.dialog{border:1px solid #ffffff80;border-radius:16px;box-shadow:0 24px 80px #0f172a47}.dialoghead{z-index:2;background:#fff;padding:22px 26px;position:sticky;top:0}.iconbtn{place-items:center;width:40px;height:40px;display:grid}.fields{gap:18px;padding:24px 26px}.dialogfoot{background:#fff;padding:16px 26px;position:sticky;bottom:0}.employee-profile-page{max-width:1240px}.profile-page-toolbar{margin-bottom:16px}.employee-profile-card{box-shadow:var(--shadow)}.employee-id-card{background:linear-gradient(125deg,#1559c6 0%,#2879ec 55%,#5598f4 100%);padding:28px;box-shadow:0 12px 28px #1a73e829}.employee-id-main h2{font-size:24px}.detail-actions{margin:18px 0 22px}.detail-section{margin-top:24px;padding-top:24px}.detail-section h3{font-size:15px}.detail-item,.profile-metrics>div{min-height:72px;padding:14px 15px}.profile-metrics .profile-net{background:#eaf2ff}.recent-punches>div{min-height:46px}.report-grid,.report-charts{gap:16px}.chart-panel{overflow:hidden}.error{border-left:4px solid var(--red)}@media (width<=1100px){.content{padding:28px 24px 56px}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.profile-metrics .profile-net{grid-column:span 2}}@media (width<=800px){.app>main>header{height:62px;padding:0 14px}.breadcrumb{display:none}.headright{gap:10px}.hamburger{border-radius:50%;place-items:center;width:40px;height:40px;display:grid}.hamburger:hover{background:#f1f3f4}.content{padding:22px 14px 48px}.heading{gap:18px}.heading h1{font-size:25px}.heading .actions{grid-template-columns:1fr 1fr;display:grid}.heading .actions>*{width:100%}.stats{grid-template-columns:1fr 1fr}.stat{min-height:130px}.panel{border-radius:10px}.panelhead{padding:18px 16px}.tablewrap th,.tablewrap td{padding-left:16px;padding-right:16px}.dialog{border-radius:14px;max-height:94vh}.dialoghead,.fields{padding:18px}.dialogfoot{padding:14px 18px}.employee-profile-card .employee-detail{padding:14px}.employee-id-card{padding:22px}.detail-actions{grid-template-columns:1fr 1fr;display:grid}.profile-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-metrics .profile-net{grid-column:span 2}}@media (width<=520px){.stats{grid-template-columns:1fr}.stat{min-height:auto}.heading .actions,.detail-grid,.profile-metrics{grid-template-columns:1fr}.profile-metrics .profile-net{grid-column:auto}.employee-id-card{text-align:left;grid-template-columns:1fr}.employee-id-avatar{margin:0}.employee-id-status{grid-column:auto}.detail-actions{grid-template-columns:1fr}.dialogfoot{flex-direction:column-reverse}.dialogfoot>*{width:100%}.recent-punches>div{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}.attendance-panel>.panelhead>.controls{grid-template-columns:minmax(220px,1.4fr) 168px minmax(195px,1fr) 145px 160px max-content max-content}.attendance-refresh{height:46px}.live-updated{color:#188038;align-items:center;gap:5px;margin-left:10px;font-weight:600;display:inline-flex}.live-updated i{background:#34a853;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #e6f4ea}@media (width<=1250px){.attendance-panel>.panelhead>.controls{grid-template-columns:minmax(240px,1fr) 180px minmax(220px,1fr)}.attendance-refresh{width:max-content}}@media (width<=800px){.attendance-panel>.panelhead>.controls{grid-template-columns:1fr}.attendance-refresh{width:100%}.live-updated{margin:6px 0 0;display:flex}}.friday-roster-head{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.friday-roster-head p{max-width:720px}.friday-options{grid-template-columns:repeat(5,minmax(120px,1fr));gap:10px;margin-top:16px;display:grid}.friday-options button{text-align:left;color:#475467;background:#fff;border:1px solid #d0d5dd;border-radius:10px;flex-direction:column;gap:5px;padding:12px;display:flex}.friday-options button:hover{background:#f8fbff;border-color:#84adf4}.friday-options button.selected{color:#1967d2;background:#e8f0fe;border-color:#1a73e8;box-shadow:0 0 0 2px #d2e3fc}.friday-options span{font-size:12px;font-weight:700}.friday-options small{font-size:9px}.roster-message{color:#475467;background:#f1f3f4;border-radius:8px;margin-top:12px;padding:10px 12px;font-size:11px}.friday-badge{border-radius:20px;padding:6px 9px;font-size:10px;font-weight:700;display:inline-block}.friday-badge.overtime{color:#c5221f;background:#fce8e6}.friday-badge.regular{color:#188038;background:#e6f4ea}@media (width<=900px){.friday-options{grid-template-columns:repeat(3,1fr)}}@media (width<=600px){.friday-roster-head{flex-direction:column}.friday-roster-head .primary{width:100%}.friday-options{grid-template-columns:1fr 1fr}}body{background:radial-gradient(circle at 82% 8%,#dcecff 0,#0000 24%),radial-gradient(circle at 28% 92%,#ffe8ec 0,#0000 25%),#f4f8fd}.side{background:linear-gradient(#063f70 0%,#075595 55%,#073761 100%);border-right:0;box-shadow:8px 0 30px #063f7024}.brandmark{background:linear-gradient(135deg,#ef2229,#ff6870);box-shadow:0 9px 22px #ef222952}.brand strong,.brand small,.sidebottom b{color:#fff}.workspace{opacity:.85}.side nav button{color:#d0e4f5}.side nav button.active{color:#fff;background:linear-gradient(90deg,#ef2229,#f34852);box-shadow:0 8px 20px #031f383d}.app>main>header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffde;border-bottom-color:#dfe9f4;box-shadow:0 4px 18px #0755950a}.content{position:relative}.primary{background:linear-gradient(135deg,#075595,#1479bd);border-color:#075595;box-shadow:0 6px 16px #07559526}.primary:hover{background:linear-gradient(135deg,#064777,#0e669f)}.panel,.stat,.report-toolbar{border-color:#dde9f4;box-shadow:0 8px 26px #123f680b}.panel{background:#fffffff2}.stat{position:relative;overflow:hidden}.stat:before{content:"";height:4px;position:absolute;top:0;left:0;right:0}.report-toolbar .primary{background:#ef2229;border-color:#ef2229;box-shadow:0 7px 17px #042d4d52}.salary-cards .net{background:linear-gradient(135deg,#075595,#1683c5);border:0}.salary-cards .net small,.salary-cards .net b{color:#fff}@media (width<=800px){.side{box-shadow:14px 0 40px #021a3057}}@media print{body{background:#fff}.panel,.stat{box-shadow:none}}body{color:#202124;background:#f8fafd}.side{box-shadow:none;background:#fff;border-right:1px solid #e8eaed}.brandmark{box-shadow:none;background:#4285f4;border-radius:50%}.brand strong,.sidebottom b{color:#202124}.brand strong span{color:#4285f4}.brand small,.workspace{color:#80868b}.side nav button{color:#5f6368;border-radius:0 24px 24px 0;margin-right:8px}.side nav button:hover{color:#202124;background:#f1f3f4}.side nav button.active{color:#1967d2;box-shadow:none;background:#e8f0fe}.sidebottom{border-color:#e8eaed}.sidebottom .avatar{color:#1967d2;background:#e8f0fe}.sidebottom .logout{color:#1a73e8}.app>main>header{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border-bottom:1px solid #e8eaed}.eyebrow{color:#1a73e8}.heading h1{color:#202124}.primary{background:#1a73e8;border-color:#1a73e8;border-radius:8px;box-shadow:0 1px 2px #3c404326}.primary:hover{background:#1765cc;box-shadow:0 2px 5px #3c404329}.secondary{color:#3c4043;border-color:#dadce0}.secondary:hover{color:#1967d2;background:#f8fbff;border-color:#d2e3fc}.panel,.stat,.report-toolbar{background:#fff;border-color:#e8eaed;border-radius:12px;box-shadow:0 1px 2px #3c404314}.stat:before{height:3px}.stat:nth-child(4n+1):before{background:#4285f4}.stat:nth-child(4n+2):before{background:#34a853}.stat:nth-child(4n+3):before{background:#fbbc04}.stat:nth-child(4n):before{background:#ea4335}.stat:nth-child(4n+1) .staticon{color:#1967d2;background:#e8f0fe}.stat:nth-child(4n+2) .staticon{color:#188038;background:#e6f4ea}.stat:nth-child(4n+3) .staticon{color:#b06000;background:#fef7e0}.stat:nth-child(4n) .staticon{color:#c5221f;background:#fce8e6}.stat h2{color:#202124}.panelhead{background:#fff}.panelhead h3{color:#202124}.report-toolbar{color:#202124;background:#fff;border:1px solid #e8eaed;box-shadow:0 1px 2px #3c404314}.report-toolbar h3{color:#202124}.report-toolbar p{color:#5f6368}.report-toolbar .primary{box-shadow:none;background:#1a73e8;border-color:#1a73e8}.report-toolbar .controls input{border-color:#dadce0}.individual-head>div{background:#f8fafd;border-color:#e8eaed}.salary-cards>div:first-child{background:#e8f0fe;border-color:#d2e3fc}.salary-cards>div:nth-child(2){background:#fef7e0;border-color:#fce8b2}.salary-cards>div:nth-child(3){background:#e6f4ea;border-color:#ceead6}.salary-cards>div:nth-child(6){background:#f3e8fd;border-color:#e9d2fd}.salary-cards .net{background:#1a73e8;border-color:#1a73e8}.report-breakdown-row i{background:#4285f4}.report-breakdown-row:nth-child(4n+2) i{background:#ea4335}.report-breakdown-row:nth-child(4n+3) i{background:#34a853}.report-breakdown-row:nth-child(4n) i{background:#fbbc04}th{color:#5f6368;background:#f8fafd}tbody tr:hover td{background:#f8fafd}.category-grid span:nth-child(4n+1){color:#1967d2;background:#e8f0fe}.category-grid span:nth-child(4n+2){color:#c5221f;background:#fce8e6}.category-grid span:nth-child(4n+3){color:#188038;background:#e6f4ea}.category-grid span:nth-child(4n){color:#b06000;background:#fef7e0}.login-page{background:#f8fafd}.login-card{border:1px solid #dadce0;box-shadow:0 2px 8px #3c40431f}.login-org{color:#1967d2;background:#e8f0fe}.connection.connected{color:#188038;background:#e6f4ea}.track{background:#e8eaed}.track div{background:#4285f4}@media (width<=800px){.side{box-shadow:4px 0 18px #3c404329}}