:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#203348;background:#f3f6fa;font-size:14px;--green:#138760;--red:#c54a59;--gold:#ad7914;--nav:#152e46;--line:#e4eaf0}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;border-radius:8px;padding:11px 17px;background:#eaf0f5;color:#243d54;font-weight:650}button:hover{filter:brightness(.96)}button:disabled{opacity:.5;cursor:wait}button.primary{background:#197b72;color:white}button.danger{color:#b53145;background:#fff0f1}button.small{font-size:12px;padding:7px 10px}button.link{background:transparent;padding:4px;color:#177e75}input,select,textarea{width:100%;border:1px solid #d6e0e8;border-radius:8px;background:white;color:#203348;padding:11px 12px;outline:none}input:focus,select:focus,textarea:focus{border-color:#228a7e;box-shadow:0 0 0 3px #228a7e18}input[type=checkbox]{width:17px;height:17px;accent-color:#197b72}label{display:grid;gap:7px;font-size:12px;font-weight:650;color:#52667a}textarea{min-height:85px;resize:vertical}h1,h2,h3,p{margin-top:0}h1{font-size:29px;letter-spacing:-1px;margin-bottom:7px}h2{font-size:17px}h3{font-size:15px}p{line-height:1.65}.muted{color:#748598}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:750;text-transform:uppercase;color:#7c91a4;margin-bottom:12px}.shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--nav);color:#e2edf6;position:sticky;top:0;height:100vh;padding:32px 20px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;margin-bottom:40px;padding:0 8px}.brand-icon{height:42px;width:42px;display:grid;place-items:center;background:#2b9a8c;border-radius:12px;color:white;font-weight:800;font-size:23px}.brand strong{font-size:18px;display:block}.brand small{color:#93aabe}.sidebar nav{display:grid;gap:7px}.sidebar nav button{display:flex;gap:12px;align-items:center;text-align:left;background:transparent;color:#b8cbdc;font-weight:500;padding:13px 15px}.sidebar nav button.active{background:#ffffff13;color:white;box-shadow:inset 3px 0 #5ad3b6}.nav-icon{width:21px;text-align:center;font-size:17px}.sidebar-footer{margin-top:auto;border-top:1px solid #ffffff17;padding-top:22px;font-size:12px;color:#9bb1c5}.sidebar-footer strong{display:block;color:#edf4f9;margin:4px 0 12px}.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:white;border-bottom:1px solid var(--line)}.topbar small{color:#7c8ea0}.tag{display:inline-flex;align-items:center;padding:5px 9px;border-radius:6px;font-size:11px;font-weight:650;background:#e9f5f0;color:#1b8869}.tag.neutral{background:#edf2f6;color:#657a8d}.tag.locked{background:#fff0dc;color:#956a18}.avatar{border-radius:50%;display:grid;place-items:center;background:#e4f0ed;color:#247969;width:35px;height:35px;font-weight:700}.row{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.content{padding:36px 38px;max-width:1650px;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:27px}.page-head p{margin-bottom:0;color:#748598}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px}.stat{padding:23px;background:white;border:1px solid var(--line);border-radius:13px;position:relative;overflow:hidden}.stat:before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:#3a6b94}.stat.green:before{background:var(--green)}.stat.red:before{background:var(--red)}.stat.gold:before{background:#d5a22f}.stat .value{font-size:31px;font-weight:730;letter-spacing:-1px;margin:12px 0 5px}.stat small{font-size:11px;color:#8a99a7}.green-text{color:var(--green)}.red-text{color:var(--red)}.gold-text{color:var(--gold)}.grid{display:grid;grid-template-columns:1.4fr 1fr;gap:23px}.panel{background:white;border:1px solid var(--line);border-radius:13px;padding:23px;margin-bottom:22px}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.panel-header h2{margin:0}.chart-row{display:grid;grid-template-columns:130px 1fr 60px;align-items:center;gap:13px;margin:20px 0;font-size:12px}.bar-track{height:8px;background:#eff4f7;border-radius:6px;overflow:hidden}.bar{height:100%;background:#3b9a85;border-radius:6px}.notice{padding:15px 18px;background:#edf6f3;border:1px solid #d7eae3;border-radius:9px;font-size:12px;color:#3e7467;line-height:1.7;margin-bottom:22px}.notice.warn{background:#fff8e9;border-color:#f2e5c5;color:#8b6f33}.activity{padding:14px 0;border-bottom:1px solid #edf1f5;display:flex;gap:12px}.activity:last-child{border:0}.activity-dot{height:9px;width:9px;border-radius:50%;background:#54aa93;margin-top:5px;flex-shrink:0}.activity p{font-size:12px;margin:0}.activity small{color:#8998a6;font-size:11px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{color:#8292a1;font-size:10px;letter-spacing:.6px;text-transform:uppercase;background:#f8fafc;padding:13px 12px;font-weight:650}td{padding:15px 12px;border-bottom:1px solid #edf1f5;font-size:12px}tbody tr:last-child td{border:0}td.number,th.number{text-align:right;font-variant-numeric:tabular-nums}td strong{font-size:13px}.filters{display:flex;gap:14px;align-items:end;flex-wrap:wrap;margin-bottom:20px}.filters label{flex:1;min-width:135px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.span2{grid-column:1/-1}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:23px}.type-legend{display:flex;gap:18px;font-size:11px;margin-bottom:18px}.pill{display:inline-flex;padding:5px 9px;border-radius:5px;font-size:11px;font-weight:600}.pill.earned{background:#e6f6ed;color:var(--green)}.pill.used{background:#fff0f1;color:var(--red)}.pill.paid{background:#fff6dd;color:var(--gold)}.error{color:#b33445;background:#fff0f2;padding:12px;border-radius:7px;font-size:12px}.login{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}.login-art{background:var(--nav);padding:70px;display:flex;flex-direction:column;justify-content:center;color:white}.login-art h1{font-size:46px;max-width:480px;line-height:1.15;margin-top:35px;letter-spacing:-1.5px}.login-art p{color:#a5bbce;max-width:420px;font-size:16px}.login-main{display:flex;align-items:center;justify-content:center;padding:30px}.login-card{width:365px}.login-card label{margin-top:20px}.login-card button{width:100%;margin-top:25px}.login-card h1{font-size:27px}.login-card .error{margin-top:16px}.empty{text-align:center;padding:40px;color:#8192a3}.employee-initial{background:#eaf2f5;border-radius:9px;width:34px;height:34px;display:grid;place-items:center;color:#3c6c80;font-size:11px;font-weight:700}.total-line{border-top:1px solid #e0e8ef;margin-top:20px;padding-top:18px}.detail{white-space:pre-wrap;word-break:break-word;font-size:12px;background:#f6f8fa;padding:16px;border-radius:8px;max-height:350px;overflow:auto}dialog{border:0;border-radius:14px;box-shadow:0 20px 80px #102c4d40;padding:28px;width:min(660px,94vw);max-height:90vh;overflow:auto}dialog::backdrop{background:#132f4d65;backdrop-filter:blur(2px)}#toast{position:fixed;right:28px;bottom:25px;border-radius:10px;background:#153c34;color:white;padding:15px 22px;box-shadow:0 10px 30px #0002;display:none;z-index:100}.month-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.month-box{border:1px solid var(--line);border-radius:8px;padding:13px;font-size:12px;display:flex;justify-content:space-between;gap:8px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.tabs button.active{background:#193e57;color:white}.checkbox-label{display:flex;align-items:center;gap:8px}.subtle{font-size:11px;color:#8394a3}.inline-error{color:#c03e51;font-size:12px}.preview-body{white-space:pre-wrap;font-size:12px;line-height:1.8}a{color:#197b72}footer{color:#8c9ba7;font-size:11px;padding:10px 0} :focus-visible{outline:3px solid #42b89d;outline-offset:3px}@media(max-width:1100px){.stats{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.content{padding:25px}.topbar{padding:0 25px}.shell{grid-template-columns:210px 1fr}.month-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:750px){.shell{display:block}.sidebar{height:auto;position:relative;padding:18px}.brand{margin-bottom:18px}.sidebar nav{display:flex;overflow:auto}.sidebar nav button{white-space:nowrap;padding:10px}.sidebar-footer{display:none}.topbar{height:65px;padding:0 18px}.content{padding:22px 16px}.page-head{align-items:flex-start;flex-direction:column}h1{font-size:25px}.stat{padding:18px}.stat .value{font-size:26px}.form-grid{grid-template-columns:1fr}.span2{grid-column:auto}.login{display:block}.login-art{padding:30px}.login-art h1{font-size:29px;margin-top:10px}.login-art p{display:none}.login-art .brand{margin:0}.login-main{padding:35px 22px}.month-grid{grid-template-columns:repeat(2,1fr)}}@media print{.sidebar,.topbar,button,.filters,footer{display:none!important}.shell{display:block}.content{padding:0}.panel{break-inside:avoid;border:0;padding:10px}.stats{grid-template-columns:repeat(4,1fr)}body{background:white}}
.annual-panel{min-width:0}.annual-scroll{overflow:auto;max-height:65vh;border:1px solid #d9e4e5;border-radius:8px;margin-top:14px;position:relative;isolation:isolate}.annual-grid{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:12px}.annual-grid th,.annual-grid td{border-right:1px solid #d8e2e5;border-bottom:1px solid #d8e2e5;padding:10px 12px;min-width:88px;height:39px}.annual-grid thead th{position:sticky;top:39px;z-index:3;text-align:center;text-transform:none;letter-spacing:0;font-size:11px;white-space:nowrap}.annual-grid thead tr:first-child th{top:0;height:39px}.annual-grid .annual-month{background:#dcece7;color:#275e50;border-right:2px solid #a3bfb6;font-weight:750}.annual-grid .annual-name{position:sticky;left:0;z-index:2;min-width:215px;max-width:260px;background:#fff;text-align:left;box-shadow:3px 0 5px #18384a10;font-size:12px;white-space:normal;font-weight:650;color:#29475a;text-transform:none;letter-spacing:0}.annual-grid thead .annual-name{z-index:5;background:#e7eef3;vertical-align:middle}.annual-grid .annual-final{position:sticky;right:0;background:#e6ecb8;border-left:2px solid #bcc775;min-width:115px;z-index:2;color:#414c1c}.annual-grid thead .annual-final{top:0;z-index:5}.annual-grid .annual-earned{background:#f2faf5;color:#1e7555}.annual-grid .annual-used{background:#fcebed;color:#a33947}.annual-grid .annual-paid{background:#fff5d7;color:#8d6510}.annual-grid .annual-net{background:#d7f0de;color:#19643d;border-right:2px solid #a3bfb6}.annual-grid tbody tr:hover td,.annual-grid tbody tr:hover th{box-shadow:inset 0 0 0 9999px #2f79580c}.annual-grid tfoot td,.annual-grid tfoot th{position:sticky;bottom:0;z-index:3;font-weight:750;border-top:2px solid #a3bfb6}.annual-grid tfoot .annual-name,.annual-grid tfoot .annual-final{z-index:4}.annual-grid tfoot .annual-name{background:#e7eef3}.annual-expanded{position:fixed;inset:16px;z-index:30;box-shadow:0 12px 60px #19334a55;display:flex;flex-direction:column;overflow:hidden;margin:0}.annual-expanded .annual-scroll{flex:1;max-height:none}.annual-expanded .notice{padding:8px 12px;margin-bottom:10px}.annual-expanded .type-legend{margin-bottom:8px} .annual-grid th small{font-size:10px;color:#819083}

.account-panel{max-width:760px}
[hidden]{display:none!important}input:disabled,select:disabled,textarea:disabled{background:#edf1f5;color:#8b98a5;border-color:#e0e5eb;cursor:not-allowed;opacity:1}.save-success{display:flex;align-items:flex-start;gap:18px;background:#e3f5e9;border:2px solid #2e9c66;border-radius:13px;padding:22px 24px;margin-bottom:25px;box-shadow:0 5px 18px #1c845415;color:#1b623c;outline:none}.save-success:focus{outline:3px solid #7ac798;outline-offset:3px}.save-success-icon{flex:0 0 42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#218353;color:white;font-size:27px;font-weight:800}.save-success strong{font-size:19px}.save-success p{margin:7px 0 4px;font-size:14px}.save-success small{font-size:12px;color:#3f7356}#toast{font-size:15px;font-weight:650;padding:18px 25px;border:2px solid #4dba88;max-width:min(580px,calc(100vw - 32px));line-height:1.5}@media(max-width:750px){.save-success{padding:17px;gap:12px}.save-success strong{font-size:17px}.save-success p{font-size:13px}#toast{right:16px;bottom:16px}}