:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#243033;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--paper:#fffdf8;--paper-strong:#fff;--ink:#243033;--muted:#69787c;--soft:#edf5ef;--line:#e4ddd2;--mint:#68b79a;--mint-deep:#2f806a;--rose:#e98780;--sky:#77a9ca;--amber:#e3aa57;--violet:#8e86c9;--shadow:0 20px 55px #523f261f;background:#f8f4ed;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:var(--mint-deep);font-weight:800;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.56}.login-shell{background:linear-gradient(135deg,#68b79a2e,#0000 38%),linear-gradient(315deg,#77a9ca2e,#0000 34%),#f8f4ed;grid-template-columns:minmax(320px,460px);justify-content:center;align-items:center;gap:24px;min-height:100vh;padding:28px;display:grid}.login-panel,.employee-directory{box-shadow:var(--shadow);background:#fffdf8eb;border:1px solid #826c5021;border-radius:8px;gap:22px;display:grid}.login-panel{padding:28px}.employee-directory{align-content:start;padding:22px}.login-copy{gap:10px;display:grid}.login-copy h1{color:var(--ink);margin:0;font-size:clamp(34px,5vw,54px);line-height:1}.login-copy p:not(.eyebrow){color:var(--muted);margin:0;font-weight:700;line-height:1.6}.login-form{gap:13px;display:grid}.input-with-icon{background:#fff;border:1px solid #ded6ca;border-radius:8px;grid-template-columns:20px minmax(0,1fr);align-items:center;gap:8px;min-height:46px;padding:0 12px;display:grid}.input-with-icon svg{color:var(--mint-deep)}.input-with-icon input{background:0 0;border:0;min-height:44px;padding:0}.input-with-icon:focus-within{border-color:var(--mint);box-shadow:0 0 0 4px #68b79a29}.wide{width:100%}.auth-message,.auth-note,.form-warning{color:var(--mint-deep);background:#eef6f0;border-radius:8px;align-items:flex-start;gap:10px;padding:12px;font-size:13px;font-weight:800;line-height:1.5;display:flex}.auth-message.error,.form-warning{color:#b44c46;background:#fdebea}.auth-note{color:var(--muted);background:#f8f6f0}.app-shell{background:linear-gradient(135deg,#68b79a29,#0000 36%),linear-gradient(315deg,#77a9ca26,#0000 32%),#f8f4ed;grid-template-columns:280px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#fffdf8d1;border-right:1px solid #826c502e;grid-template-rows:auto 1fr auto;gap:28px;height:100vh;padding:24px;display:grid;position:sticky;top:0}.brand-block,.profile-strip,.top-actions,.balance-top,.panel-heading,.salary-line,.date-box,.holiday-row,.request-item,.hero-panel,.pill-row,.pay-note,.employee-card,.team-row{align-items:center;display:flex}.brand-block{gap:12px}.brand-block strong,.profile-strip strong,.hero-panel strong{color:var(--ink);font-size:15px;font-weight:850;display:block}.brand-block span,.profile-strip span,.hero-panel span,.balance-meta,.holiday-copy span,.request-main span,.payslip-row span,.pay-note{color:var(--muted);font-size:13px;font-weight:650}.brand-mark,.view-icon,.avatar,.mini-avatar{color:#fff;background:linear-gradient(135deg,#2f806a,#77a9ca);place-items:center;display:grid}.brand-mark{border-radius:8px;width:46px;height:46px;box-shadow:0 12px 28px #2f806a38}.nav-list{align-content:start;gap:9px;display:grid}.nav-item,.soft-button,.primary-button,.icon-button,.action-list button,.metric-card,.segmented-control button,.payslip-row{color:var(--ink);border:0}.nav-item{color:#516165;text-align:left;background:0 0;border-radius:8px;align-items:center;gap:12px;min-height:48px;padding:0 13px;font-weight:800;display:flex}.nav-item:hover,.nav-item.active{color:var(--mint-deep);background:#eef6f0}.support-tile{color:var(--mint-deep);background:#f4fbf5;border:1px solid #dfe9df;border-radius:8px;gap:7px;padding:16px;display:grid}.support-tile strong{color:var(--ink)}.support-tile span{color:var(--muted);overflow-wrap:anywhere;font-size:13px}.main-area{grid-template-rows:auto 1fr;gap:22px;min-width:0;padding:22px;display:grid}.topbar{justify-content:space-between;align-items:center;gap:16px;min-height:68px;display:flex}.profile-strip{gap:12px;min-width:0}.avatar,.mini-avatar{border-radius:50%;flex:none;width:46px;height:46px;font-weight:900}.avatar.small{width:38px;height:38px;font-size:13px}.top-actions{justify-content:flex-end;gap:10px}.icon-button,.soft-button,.primary-button{border-radius:8px;justify-content:center;align-items:center;min-height:42px;display:inline-flex}.icon-button{border:1px solid var(--line);background:var(--paper-strong);width:42px}.soft-button{color:var(--mint-deep);background:#eaf5ee;gap:8px;padding:0 14px;font-weight:850}.primary-button{color:#fff;background:#2f806a;gap:8px;width:100%;padding:0 18px;font-weight:900;box-shadow:0 14px 32px #2f806a38}.mobile-menu,.scrim{display:none}.view-stack{align-content:start;gap:18px;width:min(1180px,100%);margin:0 auto;display:grid}.hero-band{color:#fff;box-shadow:var(--shadow);background:linear-gradient(135deg,#2f806ae8,#77a9cae6),#2f806a;border-radius:8px;grid-template-columns:minmax(0,1fr) 270px;align-items:stretch;gap:22px;padding:30px;display:grid}.hero-band .eyebrow,.hero-copy{color:#ffffffd1}.hero-band h1,.view-header h1{margin:0;font-size:clamp(32px,4.8vw,48px);line-height:1}.hero-copy{max-width:620px;margin:16px 0 0;font-size:17px;line-height:1.65}.hero-panel{text-align:center;background:#ffffff2e;border:1px solid #ffffff42;border-radius:8px;flex-direction:column;justify-content:center;gap:10px;padding:22px}.hero-panel strong,.hero-panel span{color:#fff}.mini-avatar{width:64px;height:64px;color:var(--mint-deep);background:#fff}.pill-row{flex-wrap:wrap;justify-content:center;gap:8px}.pill-row span{color:#fff;background:#fff3;border-radius:999px;padding:7px 10px}.eyebrow{color:var(--mint-deep);text-transform:uppercase;margin:0 0 7px;font-size:12px;font-weight:950}.view-header{box-shadow:var(--shadow);background:#fffdf8db;border-radius:8px;justify-content:space-between;align-items:center;gap:20px;padding:24px;display:flex}.view-header h1{color:var(--ink);font-size:clamp(28px,4vw,42px)}.view-header p:not(.eyebrow){max-width:680px;color:var(--muted);margin:12px 0 0;line-height:1.6}.view-icon{border-radius:8px;width:62px;height:62px}.metric-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.metric-card{background:var(--paper-strong);text-align:left;border-radius:8px;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:118px;padding:18px;display:grid;box-shadow:0 14px 35px #523f2617}.metric-card span{color:var(--muted);grid-column:2/4;font-size:13px;font-weight:750}.metric-card strong{color:var(--ink);grid-column:2;font-size:30px}.metric-card svg:last-child{grid-area:2/3}.mint svg,.mint .balance-top svg{color:var(--mint-deep)}.rose svg,.rose .balance-top svg{color:#bf5c59}.sky svg,.sky .balance-top svg{color:#3e7ea5}.amber svg,.amber .balance-top svg{color:#a16c16}.two-column{grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);align-items:start;gap:18px;display:grid}.panel,.balance-card,.holiday-row{background:#fffdf8e6;border:1px solid #826c5021;border-radius:8px;box-shadow:0 14px 35px #523f2614}.panel{gap:16px;padding:20px;display:grid}.panel-heading{justify-content:space-between;gap:14px}.panel-heading h2{margin:0;font-size:23px}.panel-heading svg{color:var(--mint-deep)}.action-list,.request-list,.payslip-list,.salary-breakdown,.holiday-list{gap:10px;display:grid}.action-list button{min-height:56px;color:var(--ink);text-align:left;background:#f6f9f4;border-radius:8px;grid-template-columns:24px minmax(0,1fr) 20px;align-items:center;gap:12px;padding:0 14px;font-weight:850;display:grid}.action-list svg{color:var(--mint-deep)}.accent-panel{background:#fff7e8}.accent-panel p{color:#765626;margin:0;font-weight:700;line-height:1.55}.calendar-summary{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;display:grid}.summary-card{background:#fffdf8e6;border:1px solid #826c5021;border-radius:8px;align-content:center;gap:6px;min-height:82px;padding:14px;display:grid;box-shadow:0 14px 35px #523f2614}.summary-card span{color:var(--muted);font-size:12px;font-weight:850}.summary-card strong{color:var(--ink);font-size:28px;line-height:1}.summary-card.danger{background:#fdebea}.summary-card.danger strong{color:#b44c46}.calendar-toolbar{justify-content:center;align-items:center;gap:12px;min-height:48px;display:flex}.calendar-toolbar strong{min-width:190px;color:var(--ink);text-align:center;font-size:20px}.calendar-layout{grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr)}.calendar-panel{gap:10px}.calendar-weekdays,.calendar-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;display:grid}.calendar-weekdays span{color:var(--muted);text-align:center;font-size:12px;font-weight:900}.calendar-day{background:#fff;border:1px solid #ede5db;border-radius:8px;grid-template-rows:auto 1fr;gap:7px;min-height:118px;padding:9px;display:grid}.calendar-day.muted{opacity:.58;background:#f7f3eb}.calendar-date{width:28px;height:28px;color:var(--ink);background:#f4f8f4;border-radius:50%;place-items:center;font-size:12px;font-weight:900;display:grid}.calendar-events,.calendar-list{align-content:start;gap:7px;display:grid}.calendar-event,.calendar-more{color:#3e7ea5;text-overflow:ellipsis;white-space:nowrap;background:#eaf2f9;border-radius:7px;min-width:0;min-height:24px;padding:5px 7px;font-size:11px;font-weight:850;display:block;overflow:hidden}.calendar-event.approved{color:var(--mint-deep);background:#e7f5eb}.calendar-event.pending{color:#9b6819;background:#fff1d8}.calendar-event.revoked,.calendar-more{color:var(--muted);background:#f8f6f0}.calendar-list-row{background:#fff;border:1px solid #ede5db;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-height:76px;padding:13px;display:grid}.calendar-list-row div:first-child{gap:5px;min-width:0;display:grid}.calendar-list-row strong{color:var(--ink);overflow-wrap:anywhere}.calendar-list-row span:not(.status):not(.lop-chip),.calendar-list-meta{color:var(--muted);font-size:13px;font-weight:750}.calendar-list-meta{white-space:nowrap;justify-items:end;gap:6px;display:grid}.filter-bar{background:#fffdf8e6;border:1px solid #826c5021;border-radius:8px;grid-template-columns:minmax(180px,1fr) minmax(160px,220px) auto;align-items:end;gap:12px;padding:16px;display:grid;box-shadow:0 14px 35px #523f2614}.approvals-layout{grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr)}.approval-list,.audit-list{gap:10px;display:grid}.approval-row{background:#fff;border:1px solid #ede5db;border-radius:8px;grid-template-columns:minmax(0,1fr) minmax(220px,.48fr);align-items:start;gap:14px;padding:14px;display:grid}.approval-main,.approval-actions,.audit-row{gap:7px;min-width:0;display:grid}.approval-main strong,.audit-row strong{color:var(--ink);overflow-wrap:anywhere}.approval-main span:not(.status):not(.lop-chip),.audit-row span,.audit-row small{color:var(--muted);overflow-wrap:anywhere;font-size:13px;font-weight:750}.button-row{flex-wrap:wrap;gap:8px;display:flex}.text-button{min-height:40px;color:var(--mint-deep);background:0 0;border:0;font-weight:900}.text-button.danger{color:#b44c46}.audit-row{background:#fff;border:1px solid #ede5db;border-radius:8px;padding:13px}.empty-state{min-height:90px;color:var(--muted);border:1px dashed #ded6ca;border-radius:8px;place-items:center;font-weight:800;display:grid}.policy-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.policy-card{background:#fffdf8e6;border:1px solid #826c5021;border-radius:8px;align-content:start;gap:7px;min-height:112px;padding:16px;display:grid;box-shadow:0 14px 35px #523f2614}.policy-card strong{color:var(--ink)}.policy-card span{color:var(--muted);font-size:13px;font-weight:700;line-height:1.5}.leave-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.balance-card{gap:14px;padding:18px;display:grid}.balance-top{justify-content:space-between;gap:12px}.balance-top span{color:var(--muted);font-size:13px;font-weight:800}.balance-top strong{margin-top:4px;font-size:36px;line-height:1;display:block}.progress-track{background:#ece5da;border-radius:999px;height:9px;overflow:hidden}.progress-track span{border-radius:inherit;background:var(--mint);height:100%;display:block}.balance-card.rose .progress-track span{background:var(--rose)}.balance-card.sky .progress-track span{background:var(--sky)}.balance-card.amber .progress-track span{background:var(--amber)}.balance-meta{flex-wrap:wrap;gap:8px 12px;display:flex}.leaves-layout{grid-template-columns:minmax(0,.86fr) minmax(330px,1fr)}.leave-form,.form-row{gap:13px;display:grid}.leave-type-set{border:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0;padding:0;display:grid}.leave-type-set legend{color:var(--ink);grid-column:1/-1;padding:0;font-size:13px;font-weight:850}.check-tile{min-height:45px;color:var(--muted);background:#fff;border:1px solid #ded6ca;border-radius:8px;align-items:center;padding:0 12px;font-weight:850;display:flex;position:relative}.check-tile:has(input:checked){color:var(--mint-deep);background:#eef6f0;border-color:#2f806a6b}.check-tile:has(input:disabled){opacity:.55}.check-tile input{opacity:0;width:1px;height:1px;position:absolute}.form-row{grid-template-columns:repeat(2,minmax(0,1fr))}label{color:var(--ink);gap:7px;font-size:13px;font-weight:850;display:grid}input,select,textarea{width:100%;color:var(--ink);background:#fff;border:1px solid #ded6ca;border-radius:8px;outline:0}input,select{min-height:44px;padding:0 12px}textarea{resize:vertical;min-height:108px;padding:12px}input:focus,select:focus,textarea:focus{border-color:var(--mint);box-shadow:0 0 0 4px #68b79a29}.request-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.request-summary.leave-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.request-summary div{background:#f4f8f4;border-radius:8px;padding:13px}.request-summary span{color:var(--muted);font-size:12px;font-weight:850;display:block}.request-summary strong{margin-top:4px;font-size:24px;display:block}.lop-summary.active{background:#fdebea}.lop-summary.active strong,.lop-chip{color:#b44c46}.allocation-list{flex-wrap:wrap;gap:8px;display:flex}.allocation-list span,.lop-chip{width:max-content;min-height:28px;color:var(--muted);background:#f4f8f4;border-radius:999px;align-items:center;padding:0 10px;font-size:12px;font-weight:850;display:inline-flex}.allocation-list strong{color:var(--ink)}.request-item{background:#fff;border:1px solid #ede5db;border-radius:8px;justify-content:space-between;gap:14px;padding:14px}.request-main{gap:4px;display:grid}.request-main strong{color:var(--ink)}.request-days{background:#eff7f2;border-radius:8px;place-items:center;width:58px;min-height:58px;display:grid}.request-days strong{font-size:22px}.request-days span{color:var(--muted);font-size:12px;font-weight:800}.request-side{justify-items:end;gap:8px;display:grid}.status,.holiday-type{border-radius:999px;justify-content:center;align-items:center;width:max-content;min-height:25px;padding:0 9px;font-size:12px;font-weight:900;display:inline-flex}.status.approved,.status.ready{color:#2f806a;background:#e7f5eb}.status.pending,.status.processing{color:#9b6819;background:#fff1d8}.status.rejected{color:#b44c46;background:#fdebea}.status.revoked{color:var(--muted);background:#f8f6f0}.segmented-control{flex-wrap:wrap;gap:8px;display:flex}.segmented-control button{min-height:40px;color:var(--muted);background:#fff;border-radius:8px;padding:0 14px;font-weight:850}.segmented-control button.active{color:#fff;background:#2f806a}.holiday-list{grid-template-columns:repeat(2,minmax(0,1fr))}.holiday-row{gap:14px;min-height:86px;padding:14px}.date-box{width:58px;height:58px;color:var(--mint-deep);background:#eef6f0;border-radius:8px;flex-direction:column;flex:none;justify-content:center}.date-box strong{font-size:24px;line-height:1}.date-box span{text-transform:uppercase;font-size:12px;font-weight:900}.holiday-copy{flex:1;gap:4px;min-width:0;display:grid}.holiday-copy strong{overflow-wrap:anywhere}.holiday-type{flex:none}.holiday-type.public{color:#3e7ea5;background:#eaf2f9}.holiday-type.festival{color:#bf5c59;background:#fceceb}.holiday-type.company{color:#9b6819;background:#fff1d8}.payslip-layout{grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr)}.payslip-row{text-align:left;background:#fff;border:1px solid #ede5db;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;min-height:66px;padding:12px;display:flex}.payslip-row.active{background:#f0f8f2;border-color:#2f806a61}.payslip-row div{gap:4px;min-width:0;display:grid}.payslip-row strong{overflow-wrap:anywhere}.salary-line{background:#f8f6f0;border-radius:8px;justify-content:space-between;gap:12px;min-height:62px;padding:14px}.salary-line div{color:var(--muted);align-items:center;gap:10px;font-weight:850;display:flex}.salary-line svg{color:var(--mint-deep)}.salary-line strong{text-align:right;font-size:18px}.salary-line.emphasized{background:#eaf6ee}.salary-line.emphasized strong{color:var(--mint-deep);font-size:24px}.pay-note{color:var(--mint-deep);background:#eef6f0;border-radius:8px;gap:10px;padding:13px}.pay-note svg{flex:none}.admin-badge{min-height:26px;color:var(--mint-deep);background:#eaf5ee;border-radius:999px;justify-content:center;align-items:center;margin-left:auto;padding:0 9px;font-size:12px;font-weight:900;display:inline-flex}.team-toolbar{background:#fffdf8e6;border:1px solid #826c5021;border-radius:8px;padding:16px;display:grid;box-shadow:0 14px 35px #523f2614}.team-layout{grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr)}.team-table-panel,.employee-detail-panel{align-content:start}.team-table{gap:8px;display:grid}.team-table-head,.team-table-row{grid-template-columns:minmax(180px,1.25fr) minmax(140px,.9fr) minmax(130px,.8fr) minmax(110px,.68fr);align-items:center;gap:12px;display:grid}.team-table-head{min-height:36px;color:var(--muted);text-transform:uppercase;padding:0 12px;font-size:12px;font-weight:950}.team-table-row{min-height:66px;color:var(--ink);text-align:left;background:#fff;border:1px solid #ede5db;border-radius:8px;padding:12px}.team-table-row.active{background:#eef6f0;border-color:#2f806a6b}.team-table-row span{min-width:0;color:var(--muted);overflow-wrap:anywhere;font-size:13px;font-weight:750}.team-table-row strong{color:var(--ink);font-size:14px;display:block}.team-table-row small{color:var(--muted);overflow-wrap:anywhere;margin-top:3px;font-size:12px;font-weight:750;display:block}.employee-edit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.employee-edit-grid label{min-width:0}.panel-subhead{border-top:1px solid #ede5db;padding-top:4px}@media (width<=1040px){.login-shell{grid-template-columns:1fr;align-items:start}.app-shell{grid-template-columns:1fr}.sidebar{z-index:20;width:min(300px,84vw);transition:transform .18s;position:fixed;inset:0 auto 0 0;transform:translate(-102%)}.sidebar.open{transform:translate(0)}.mobile-menu{display:inline-flex}.scrim{z-index:15;color:#fff;background:#24303352;border:0;justify-content:flex-end;padding:18px;display:flex;position:fixed;inset:0}.metric-grid,.leave-grid,.policy-grid,.calendar-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.two-column,.leaves-layout,.approvals-layout,.team-layout,.payslip-layout,.calendar-layout{grid-template-columns:1fr}}@media (width<=720px){.main-area{padding:14px}.topbar{align-items:flex-start}.profile-strip{flex:1}.top-actions .soft-button span{display:none}.hero-band{grid-template-columns:1fr;padding:22px}.view-header{align-items:flex-start;padding:20px}.view-icon{display:none}.metric-grid,.leave-grid,.holiday-list,.employee-edit-grid,.filter-bar,.approval-row,.team-table-row,.form-row,.leave-type-set,.policy-grid,.calendar-summary{grid-template-columns:1fr}.team-table-head{display:none}.calendar-grid{gap:5px}.calendar-day{min-height:92px;padding:6px}.calendar-event,.calendar-more{min-height:21px;padding:4px 5px;font-size:10px}.holiday-row{align-items:flex-start}.holiday-type{align-self:center}.payslip-row{flex-direction:column;align-items:flex-start}.request-summary.leave-summary,.calendar-list-row{grid-template-columns:1fr}.calendar-list-meta{justify-items:start}}@media (width<=460px){.login-shell{padding:14px}.login-panel,.employee-directory{padding:18px}.topbar{gap:10px}.avatar{width:40px;height:40px}.profile-strip strong{font-size:14px}.profile-strip span{font-size:12px}.hero-band h1,.view-header h1{font-size:30px}.hero-copy{font-size:15px}.calendar-weekdays span{font-size:10px}.calendar-day{min-height:78px}.calendar-date{width:24px;height:24px}.panel,.balance-card{padding:16px}.request-item,.holiday-row{flex-direction:column;align-items:stretch}.request-days{width:100%}}