@import"https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800&display=swap";:root{font-family:Figtree,sans-serif;color:#191a1b;background:#f5f7fa;font-synthesis:none;text-rendering:optimizeLegibility;font-smooth:always;font-optical-sizing:auto;font-weight:400;--blue:#267fe8;--muted:#69727d;--line:#e7ebf0;--surface:#fff}*{box-sizing:border-box}body{margin:0;min-width:320px;background:#f5f7fa}button,input,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.sidebar{width:248px;position:fixed;inset:0 auto 0 0;background:#fff;border-right:1px solid var(--line);padding:27px 17px 18px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:11px;padding:0 7px 38px}.brand-mark{width:38px;height:38px;border-radius:12px;background:#eaf3ff;color:#267fe8;display:grid;place-items:center}.brand strong{display:block;font-size:15px;letter-spacing:-.3px}.brand span{display:block;color:#8a929c;font-size:9px;letter-spacing:1.5px;font-weight:800;margin-top:3px}.side-caption,.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.2px;color:#929ba6}.side-caption{padding:0 11px 12px}.sidebar nav{display:grid;gap:5px}.side-link{display:flex;align-items:center;gap:13px;padding:12px;border-radius:10px;text-decoration:none;color:#66717d;font-weight:600;font-size:13px;transition:.15s}.side-link:hover{background:#f5f8fc;color:#222}.side-link.active{background:#edf5ff;color:#2178dc}.sidebar-bottom{margin-top:auto}.owner-card{display:flex;align-items:center;gap:10px;padding:12px 8px;border-top:1px solid var(--line)}.owner-card>div:nth-child(2){flex:1}.owner-card b,.owner-card small{display:block}.owner-card b{font-size:12px}.owner-card small{font-size:11px;color:#8b949f;margin-top:3px}.owner-card>svg{color:#929ba6}.avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#eaf2fb;color:#3679bc;font-size:11px;font-weight:800;flex-shrink:0}.side-foot{font-size:10px;color:#8a929c;padding:10px 8px}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2dbb78;margin-right:7px}.main-area{margin-left:248px;min-height:100vh}.topbar{height:68px;background:#ffffffe0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;position:sticky;top:0;z-index:4;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.breadcrumb{font-size:12px;color:#89929d}.breadcrumb span{padding:0 8px;color:#c0c6cd}.top-actions{display:flex;align-items:center;gap:18px}.today-date{font-size:12px;color:#707b86}.icon-button{width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#596573;display:grid;place-items:center;position:relative}.icon-button i{position:absolute;width:6px;height:6px;background:#ed795e;border-radius:50%;right:8px;top:7px}.mobile-brand{display:none}.page-wrap{max-width:1320px;margin:0 auto;padding:33px 38px 50px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.page-heading h1{font-size:27px;letter-spacing:-1px;margin:6px 0 5px;font-weight:800}.page-heading p,.section-head p{margin:0;color:#7d8792;font-size:13px}.button{height:42px;border-radius:10px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:12px;border:1px solid transparent;white-space:nowrap}.button-primary{background:#267fe8;color:#fff;box-shadow:0 3px 7px #267fe822}.button-primary:hover{background:#176fd6}.button-secondary{background:#fff;border-color:#dfe5eb;color:#46515d}.button:disabled{opacity:.5;cursor:not-allowed}.welcome-strip{min-height:153px;background:#1d2c3e;border-radius:16px;padding:25px 29px;color:#fff;display:flex;align-items:center;justify-content:space-between;overflow:hidden;position:relative;margin-bottom:30px}.welcome-strip:after{content:"";position:absolute;width:250px;height:250px;border:1px solid #ffffff13;border-radius:50%;right:65px;top:-110px}.welcome-kicker{font-size:9px;letter-spacing:1.5px;font-weight:800;color:#9cb4cc}.welcome-strip h2{font-size:22px;letter-spacing:-.5px;margin:9px 0 5px}.welcome-strip p{margin:0;color:#c0cad4;font-size:12px}.welcome-art{width:150px;height:105px;display:grid;place-items:center;position:relative;z-index:1}.art-circle{width:94px;height:94px;border-radius:50%;background:#ffffff12;color:#9bc9ff;display:grid;place-items:center;box-shadow:0 0 0 14px #ffffff08}.section-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:27px 0 13px}.section-head h2{font-size:16px;margin:0 0 4px;letter-spacing:-.3px}.section-head p{font-size:11px}.text-button{border:0;background:transparent;color:#267fe8;font-size:11px;font-weight:700;display:inline-flex;align-items:center;gap:5px;padding:8px 0}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.stats-grid.three{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:25px}.stat-card{background:#fff;border:1px solid #edf0f3;border-radius:13px;padding:16px 17px;min-width:0}.stat-icon{width:33px;height:33px;border-radius:10px;background:#eaf3ff;color:#267fe8;display:grid;place-items:center;margin-bottom:13px}.stat-icon.green,.quick-icon.green{background:#e8f8f0;color:#21a36a}.stat-icon.orange,.quick-icon.orange{background:#fff3e4;color:#dc9138}.stat-icon.red{background:#ffeded;color:#df6868}.stat-icon.purple,.quick-icon.purple{background:#f1edff;color:#8467d8}.stat-label{font-size:11px;color:#7b8691;font-weight:600}.stat-value{font-size:22px;font-weight:800;letter-spacing:-.7px;margin:5px 0 3px}.stat-detail{font-size:10px;color:#9aa2aa}.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.quick-card{position:relative;text-align:left;background:#fff;border:1px solid #edf0f3;border-radius:13px;padding:15px;display:flex;flex-direction:column;align-items:flex-start;min-height:116px}.quick-card:hover{border-color:#c8dcf5;box-shadow:0 4px 16px #193c6010}.quick-icon{width:34px;height:34px;border-radius:10px;background:#eaf3ff;color:#267fe8;display:grid;place-items:center;margin-bottom:12px}.quick-card b{font-size:12px}.quick-card small{font-size:10px;color:#89929d;margin-top:4px}.quick-arrow{position:absolute;right:14px;top:16px;color:#a0a8b1}.salary-head{margin-top:30px}.month-input,.date-input,.filter-select{height:36px;border:1px solid #e1e6ec;border-radius:9px;background:#fff;padding:0 10px;color:#46515d;font-size:11px;outline:none}.salary-overview{display:grid;grid-template-columns:1.35fr 1fr;background:#fff;border:1px solid #edf0f3;border-radius:14px;padding:20px 22px;gap:25px}.salary-main{padding-right:22px;border-right:1px solid var(--line)}.salary-label{font-size:9px;font-weight:800;letter-spacing:1px;color:#87919c}.salary-total{font-size:27px;font-weight:800;letter-spacing:-1px;margin:7px 0 15px}.salary-progress{height:7px;background:#edf1f5;border-radius:10px;overflow:hidden}.salary-progress span{display:block;height:100%;background:#267fe8;border-radius:10px}.progress-caption{display:flex;justify-content:space-between;color:#87919c;font-size:10px;margin-top:8px}.salary-side{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:12px}.salary-side div span,.salary-side div b{display:block}.salary-side div span{font-size:10px;color:#8b949f;margin-bottom:5px}.salary-side div b{font-size:16px}.salary-side .text-button{grid-column:1/-1;justify-self:start}.negative{color:#d66b5f!important}.balance{color:#267fe8}.panel{background:#fff;border:1px solid #edf0f3;border-radius:13px;overflow:hidden}.payment-list{padding:0 18px}.payment-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #f0f2f5}.payment-row:last-child{border-bottom:0}.payment-symbol{width:34px;height:34px;border-radius:10px;background:#fff3e5;color:#d58b37;display:grid;place-items:center}.payment-symbol.salary{background:#e9f7ef;color:#2ca66f}.payment-info{flex:1;min-width:0}.payment-info b{font-size:12px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}.payment-info small{display:block;color:#929ba5;font-size:10px;margin-top:4px}.payment-amount{text-align:right}.payment-amount>b{font-size:12px}.type-chip{font-size:9px;text-transform:capitalize;border-radius:5px;padding:3px 6px;background:#fff3e4;color:#c48737;font-weight:700}.type-chip.salary{background:#e8f7ef;color:#279a67}.reversed-chip{background:#f0f1f3;color:#7d8792}.reversed{opacity:.55}.reverse-button{display:block;border:0;background:transparent;color:#d16d5d;font-size:9px;margin:3px 0 0 auto;padding:0}.page-end-note{text-align:center;font-size:10px;color:#a0a8b0;margin:32px 0 0}.page-end-note span{padding:0 5px}.attendance-summary{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #edf0f3;border-radius:13px;padding:17px 20px;margin-bottom:25px}.attendance-summary>div:first-child b{font-size:23px}.attendance-summary>div:first-child small{font-size:12px;color:#9aa2aa}.attendance-summary>div:first-child span{display:block;font-size:10px;color:#8a949e;margin-top:3px}.summary-pills{display:flex;gap:7px;flex-wrap:wrap}.pill{font-size:10px;font-weight:700;border-radius:20px;padding:7px 10px}.pill.green{background:#e8f7ef;color:#299a67}.pill.orange{background:#fff3e5;color:#cb8738}.pill.red{background:#ffeded;color:#d46a6a}.pill.grey{background:#f0f2f5;color:#78838e}.attendance-list{padding:0 18px}.attendance-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid #f0f2f5}.attendance-row:last-child{border-bottom:0}.person{display:flex;align-items:center;gap:10px;min-width:0}.person b{font-size:12px;display:block}.person small{font-size:10px;color:#89939e;display:block;margin-top:4px}.status-actions{display:flex;gap:5px}.status-button{width:48px;height:42px;border:1px solid #e8ecf0;background:#fff;border-radius:9px;color:#89939e;font-weight:800;font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.status-button span{font-size:8px;font-weight:600}.status-button.selected.present{background:#eaf8f0;border-color:#b9e8ce;color:#229b64}.status-button.selected.half{background:#fff5e9;border-color:#f5d7af;color:#c98736}.status-button.selected.absent,.status-button.selected.unpaid_leave{background:#fff0f0;border-color:#f4caca;color:#d26767}.status-button.selected.paid_leave{background:#eef4ff;border-color:#c9daf7;color:#397ed2}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.search-box{display:flex;align-items:center;gap:9px;height:39px;width:min(380px,100%);padding:0 12px;border:1px solid #e2e7ed;border-radius:9px;background:#fff;color:#9aa2aa}.search-box input{border:0;outline:0;flex:1;min-width:0;font-size:11px}.muted{font-size:10px;color:#89939e}.table-panel{padding:0 18px}.table-head,.table-row{display:grid;align-items:center;gap:14px}.employee-table{grid-template-columns:2fr 1fr 1.2fr .8fr .7fr}.salary-table{grid-template-columns:1.7fr 1fr 1fr 1fr 1fr}.table-head{padding:14px 0 11px;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:.7px;color:#929ba5;font-weight:800}.table-row{padding:13px 0;border-bottom:1px solid #f0f2f5;font-size:11px;color:#58636e}.table-row:last-child{border-bottom:0}.table-row .person b{color:#252a30}.table-row>b{font-size:11px;color:#303943}.subline{display:block;font-size:9px;font-weight:500;color:#929ba5;margin-top:3px}.capitalize{text-transform:capitalize}.status-tag{font-size:9px;font-weight:700;border-radius:20px;padding:5px 8px;width:max-content}.status-tag.success{background:#eaf8f0;color:#249a65}.status-tag.inactive{background:#f0f2f5;color:#89939e}.small-button{border:1px solid #e4e8ed;background:#fff;border-radius:7px;padding:6px 8px;font-size:9px;color:#6d7883}.helper-note{font-size:10px;color:#929ba5;line-height:1.6;margin:13px 2px}.salary-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px}.salary-toolbar label{font-size:11px;font-weight:700}.salary-toolbar .muted{margin-left:auto}.info-banner{display:flex;gap:12px;padding:15px 17px;border:1px solid #dceafb;background:#f0f6ff;color:#3978bd;border-radius:11px;margin-top:20px}.info-banner b{font-size:11px}.info-banner p{font-size:10px;line-height:1.5;color:#6685a5;margin:4px 0 0}.settings-panel{padding:22px;max-width:560px;display:grid;gap:17px}.settings-panel label,.form-stack label{display:grid;gap:7px;font-size:11px;font-weight:700;color:#4e5964}.settings-panel input,.settings-panel select,.form-stack input,.form-stack select{height:40px;border:1px solid #e0e6ec;border-radius:9px;padding:0 11px;outline:none;background:#fff;color:#28313a;font-size:12px}.settings-panel small{font-size:10px;color:#8d97a1;font-weight:400}.form-stack{display:grid;gap:14px}.form-stack label{gap:6px}.form-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.full{width:100%;margin-top:5px}.modal-backdrop{position:fixed;inset:0;background:#101b2a66;z-index:20;display:grid;place-items:center;padding:18px}.modal{width:min(100%,480px);background:#fff;border-radius:16px;padding:21px;box-shadow:0 20px 70px #10243b30;max-height:90vh;overflow:auto}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-head h2{font-size:18px;margin:0;letter-spacing:-.4px}.empty-state{padding:35px 15px;display:grid;justify-items:center;gap:9px;color:#8d97a1;font-size:11px}.empty-icon{width:42px;height:42px;border-radius:12px;background:#f2f5f8;display:grid;place-items:center;color:#9aa4ae}.toast{position:fixed;z-index:30;bottom:28px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;background:#1f2e40;color:#fff;padding:12px 17px;border-radius:10px;font-size:12px;box-shadow:0 8px 30px #0e1d2b30}.mobile-nav{display:none}@media(max-width:1100px){.sidebar{width:215px}.main-area{margin-left:215px}.page-wrap{padding:28px 25px 45px}.topbar{padding:0 25px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.employee-table{grid-template-columns:1.7fr .9fr 1.1fr .7fr .7fr}.salary-table{grid-template-columns:1.5fr .9fr .9fr .9fr .9fr}}@media(max-width:760px){.sidebar{display:none}.main-area{margin-left:0;padding-bottom:78px}.topbar{height:59px;padding:0 17px}.mobile-brand{display:flex;align-items:center;gap:9px;font-size:13px}.mobile-brand .brand-mark{width:31px;height:31px;border-radius:9px}.breadcrumb{display:none}.top-actions{gap:10px}.today-date{font-size:10px}.icon-button{width:33px;height:33px}.page-wrap{padding:25px 16px 30px}.page-heading{align-items:flex-start;margin-bottom:21px}.page-heading h1{font-size:24px}.page-heading p{font-size:11px;line-height:1.45;max-width:290px}.page-heading>.button{height:38px;padding:0 11px;font-size:10px}.welcome-strip{min-height:140px;padding:20px;border-radius:14px}.welcome-strip h2{font-size:18px;max-width:230px}.welcome-strip p{font-size:10px;max-width:220px;line-height:1.5}.welcome-art{width:75px}.art-circle{width:67px;height:67px;box-shadow:0 0 0 9px #ffffff08}.art-circle svg{width:37px}.section-head{margin:24px 0 12px}.section-head h2{font-size:15px}.stats-grid{gap:9px}.stat-card{padding:13px}.stat-icon{width:30px;height:30px;margin-bottom:10px}.stat-value{font-size:20px}.stat-detail{font-size:9px}.quick-grid{gap:8px}.quick-card{padding:11px;min-height:112px}.quick-card b{font-size:10px}.quick-card small{font-size:9px;line-height:1.35}.quick-arrow{right:9px;top:12px;width:13px}.quick-icon{width:31px;height:31px;margin-bottom:10px}.salary-overview{padding:16px;grid-template-columns:1fr;gap:15px}.salary-main{padding:0 0 14px;border-right:0;border-bottom:1px solid var(--line)}.salary-total{font-size:25px}.salary-side{gap:10px}.salary-side div b{font-size:14px}.page-end-note{margin-top:25px}.mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;z-index:10;bottom:0;left:0;right:0;height:calc(63px + env(safe-area-inset-bottom));padding:7px 5px env(safe-area-inset-bottom);background:#ffffffed;border-top:1px solid #e7ebf0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.mobile-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-decoration:none;color:#8b949e;font-size:9px;font-weight:600}.mobile-link.active{color:#267fe8}.attendance-summary{align-items:flex-start;gap:12px;flex-direction:column;padding:14px}.summary-pills{gap:5px}.pill{padding:6px 8px;font-size:9px}.attendance-row{align-items:flex-start;flex-direction:column;gap:10px}.status-actions{width:100%;display:grid;grid-template-columns:repeat(5,1fr)}.status-button{width:100%;height:42px}.status-button span{font-size:7px}.section-head .filter-select{max-width:120px}.toolbar{gap:8px}.search-box{width:100%}.table-panel{padding:0 12px;overflow-x:auto}.table-head,.table-row{min-width:650px}.table-head{font-size:8px}.table-row{padding:11px 0}.stats-grid.three{grid-template-columns:1fr 1fr}.stats-grid.three .stat-card:last-child{grid-column:1/-1}.salary-toolbar{flex-wrap:wrap}.salary-toolbar .muted{margin-left:0;width:100%}.salary-table{min-width:690px}.employee-table{min-width:650px}.form-two{gap:8px}.modal{padding:18px}.page-heading>.button{font-size:0;gap:5px}.page-heading>.button svg{width:17px;height:17px}.date-input{max-width:135px;font-size:10px}}@media(max-width:390px){.page-wrap{padding-left:12px;padding-right:12px}.stats-grid{gap:7px}.stat-card{padding:11px}.stat-value{font-size:18px}.welcome-art{width:58px}.welcome-strip{padding:17px}.welcome-strip h2{font-size:16px}.quick-card{padding:9px}.quick-card b{font-size:9px}}.heading-actions{display:flex;align-items:center;gap:9px}.person-button{border:0;background:transparent;text-align:left;padding:0;cursor:pointer;color:inherit}.person-button:hover b{color:#267fe8}.calendar-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.85fr);gap:15px;align-items:start}.calendar-panel,.selected-day-panel,.employee-calendar-panel,.employee-ledger-panel{padding:17px}.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.calendar-toolbar h2{font-size:15px;margin:0;font-weight:800;letter-spacing:-.3px}.calendar-toolbar .icon-button{width:31px;height:31px;font-size:21px;line-height:1}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.calendar-weekday{text-align:center;color:#9aa2ab;font-size:9px;font-weight:800;padding:8px 0}.calendar-cell{border:1px solid #edf0f3;background:#fff;border-radius:9px;min-height:76px;padding:8px 6px;display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-align:left;min-width:0}.calendar-cell:hover{border-color:#b8d5f5;background:#f8fbff}.calendar-cell.blank{border:0;background:transparent;pointer-events:none}.calendar-cell.chosen{border:1.5px solid #267fe8;background:#f0f6ff}.calendar-day-number{font-size:11px;font-weight:800;color:#3b4651}.calendar-dots{display:flex;gap:3px;flex-wrap:wrap}.calendar-dots i,.calendar-legend i,.attendance-breakdown i{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot-present{background:#2dbb78}.dot-half{background:#e8a044}.dot-absent{background:#e36d6d}.dot-paid{background:#568fe0}.dot-unpaid{background:#a18acb}.calendar-cell>small{font-size:8px;color:#8c96a0}.calendar-empty-label{font-size:10px;color:#d3d8de}.calendar-legend{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid #eef1f4;margin-top:14px;padding-top:13px}.calendar-legend span,.attendance-breakdown span{display:flex;align-items:center;gap:5px;font-size:9px;color:#737e89}.selected-day-heading{padding:3px 2px 13px;border-bottom:1px solid #eef1f4;margin-bottom:2px}.selected-day-heading h2{font-size:16px;margin:7px 0 4px}.selected-day-heading p,.panel-title-row p{font-size:10px;color:#89939e;margin:0}.day-employee-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 2px;border:0;border-bottom:1px solid #f0f2f5;background:transparent;text-align:left}.day-employee-row:last-child{border-bottom:0}.attendance-status-label{font-size:9px;font-weight:700;border-radius:20px;padding:6px 8px;white-space:nowrap;background:#f1f3f5;color:#89939e}.attendance-status-label.present{background:#e8f8f0;color:#229b64}.attendance-status-label.half{background:#fff3e4;color:#c98736}.attendance-status-label.absent,.attendance-status-label.unpaid_leave{background:#fff0f0;color:#d26767}.attendance-status-label.paid_leave{background:#eef4ff;color:#397ed2}.attendance-status-label.unmarked{background:#f1f3f5;color:#89939e}.back-link{border:0;background:transparent;color:#267fe8;font-size:11px;font-weight:700;padding:0;margin:0 0 18px}.employee-balance-cards{margin-bottom:17px}.employee-detail-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:15px;align-items:start}.employee-month-grid .calendar-cell{min-height:58px;align-items:center;padding:8px 2px;gap:6px}.employee-day{border-color:transparent;background:#f7f9fb}.employee-day.present{background:#e8f8f0;border-color:#d4f0e1}.employee-day.half{background:#fff3e4;border-color:#f7e6ce}.employee-day.absent,.employee-day.unpaid_leave{background:#fff0f0;border-color:#f7dddd}.employee-day.paid_leave{background:#eef4ff;border-color:#dce8fb}.employee-day.unmarked{background:#f7f9fb}.employee-day small{font-size:9px;font-weight:800;color:#5d6873}.selected-attendance-detail{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:13px;margin-top:13px;border-top:1px solid #eef1f4}.selected-attendance-detail>b{font-size:10px}.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:13px}.panel-title-row h2{font-size:15px;margin:0 0 4px}.ledger-count{font-size:9px;color:#89939e;background:#f2f4f6;padding:5px 7px;border-radius:20px}.ledger-balance{background:#f2f7ff;border:1px solid #e1edfb;border-radius:10px;padding:12px 13px;display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.ledger-balance span{font-size:10px;color:#6983a0}.ledger-balance b{font-size:16px;color:#267fe8}.employee-ledger-list{max-height:365px;overflow:auto}.ledger-row{display:flex;align-items:center;gap:9px;padding:12px 0;border-bottom:1px solid #f0f2f5}.ledger-row:last-child{border-bottom:0}.ledger-row .payment-symbol{width:31px;height:31px}.ledger-row .payment-info b{font-size:10px}.ledger-row .payment-info small{font-size:9px}.ledger-amount{font-size:11px;white-space:nowrap}.attendance-breakdown{display:flex;gap:15px;flex-wrap:wrap;background:#fff;border:1px solid #edf0f3;border-radius:11px;padding:14px 16px}@media(max-width:900px){.calendar-layout,.employee-detail-grid{grid-template-columns:1fr}}@media(max-width:760px){.heading-actions{gap:5px}.heading-actions .button{font-size:0;padding:0 10px}.heading-actions .button svg{width:17px}.calendar-panel,.selected-day-panel,.employee-calendar-panel,.employee-ledger-panel{padding:12px}.calendar-grid{gap:3px}.calendar-cell{min-height:62px;padding:6px 4px;border-radius:7px}.calendar-weekday{font-size:8px}.calendar-cell>small{font-size:7px}.calendar-legend{gap:8px}.calendar-legend span{font-size:8px}.employee-month-grid .calendar-cell{min-height:48px}.selected-day-panel{margin-top:0}.employee-balance-cards{margin-bottom:13px}.attendance-breakdown{gap:10px}.attendance-breakdown span{font-size:8px}}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:22px;background:#f4f7fb;font-family:Figtree,sans-serif}.auth-card{width:min(100%,410px);background:#fff;border:1px solid #e9edf2;border-radius:18px;padding:30px;box-shadow:0 18px 55px #1c35500d}.auth-brand{display:flex;align-items:center;gap:11px;margin-bottom:31px}.auth-brand b,.auth-brand small{display:block}.auth-brand b{font-size:15px}.auth-brand small{font-size:9px;letter-spacing:1px;color:#929ba5;margin-top:3px;font-weight:800}.auth-card h1{font-size:25px;letter-spacing:-.8px;margin:0 0 7px}.auth-subtitle{font-size:12px;color:#7d8792;line-height:1.6;margin:0 0 23px}.auth-card .form-stack{gap:15px}.auth-error{font-size:11px;color:#c44e4e;background:#fff0f0;border-radius:8px;padding:10px}.login-footnote{font-size:10px;color:#929ba5;text-align:center;line-height:1.5;margin:18px 0 0}.setup-instructions{display:grid;gap:9px;background:#f4f7fa;padding:13px;border-radius:10px;font-size:11px}.setup-instructions code{font-size:10px;overflow-wrap:anywhere;color:#3f6e9f}.owner-details{min-width:0;flex:1}.owner-details small{overflow-wrap:anywhere;font-size:9px}.logout-icon{border:0;background:transparent;color:#7c8792;padding:7px;border-radius:8px}.logout-icon:hover{background:#fff0f0;color:#d36b62}.mobile-logout{display:none}.stats-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.attendance-edit-control{display:grid;gap:5px;font-size:9px;color:#7c8792;font-weight:700}.attendance-edit-control select{height:32px;max-width:145px;border:1px solid #e1e6ec;border-radius:8px;padding:0 8px;background:#fff;color:#46515d;font-size:10px}.selected-attendance-detail>div:first-child{display:grid;gap:7px}html[data-theme=dark] body,html[data-theme=dark] .app-shell{background:#111821;color:#e8edf3}html[data-theme=dark] .sidebar,html[data-theme=dark] .topbar,html[data-theme=dark] .panel,html[data-theme=dark] .stat-card,html[data-theme=dark] .quick-card,html[data-theme=dark] .salary-overview,html[data-theme=dark] .attendance-summary,html[data-theme=dark] .attendance-breakdown{background:#1a2531;border-color:#2b3948;color:#e8edf3}html[data-theme=dark] .topbar{background:#18232eee;border-color:#2b3948}html[data-theme=dark] .brand strong,html[data-theme=dark] .section-head h2,html[data-theme=dark] .page-heading h1,html[data-theme=dark] .stat-value,html[data-theme=dark] .quick-card b,html[data-theme=dark] .person b,html[data-theme=dark] .table-row .person b,html[data-theme=dark] .table-row>b,html[data-theme=dark] .payment-info b,html[data-theme=dark] .salary-side div b,html[data-theme=dark] .calendar-toolbar h2,html[data-theme=dark] .selected-day-heading h2,html[data-theme=dark] .panel-title-row h2,html[data-theme=dark] .selected-attendance-detail>b{color:#e8edf3}html[data-theme=dark] .side-link{color:#aab6c2}html[data-theme=dark] .side-link.active{background:#203b59;color:#83baff}html[data-theme=dark] .side-link:hover,html[data-theme=dark] .quick-card:hover{background:#202e3c}html[data-theme=dark] .brand-mark,html[data-theme=dark] .avatar,html[data-theme=dark] .stat-icon{background:#243d56;color:#91c4ff}html[data-theme=dark] .stat-icon.green,html[data-theme=dark] .quick-icon.green{background:#1d3c33;color:#75d5a5}html[data-theme=dark] .stat-icon.orange{background:#403425;color:#efbd78}html[data-theme=dark] .stat-icon.red{background:#442c31;color:#ef9292}html[data-theme=dark] .stat-icon.purple{background:#352f4a;color:#b8a5ff}html[data-theme=dark] .welcome-strip{background:#172b40}html[data-theme=dark] .payment-row,html[data-theme=dark] .attendance-row,html[data-theme=dark] .table-row,html[data-theme=dark] .table-head,html[data-theme=dark] .day-employee-row,html[data-theme=dark] .ledger-row{border-color:#2b3948}html[data-theme=dark] .month-input,html[data-theme=dark] .date-input,html[data-theme=dark] .filter-select,html[data-theme=dark] .search-box,html[data-theme=dark] .search-box input,html[data-theme=dark] .small-button,html[data-theme=dark] .attendance-edit-control select{background:#202d3a;border-color:#354657;color:#e3eaf1}html[data-theme=dark] .search-box input{border:0}html[data-theme=dark] .calendar-cell{background:#202d3a;border-color:#2d3b49}html[data-theme=dark] .calendar-cell.chosen{background:#203b59;border-color:#4c9aef}html[data-theme=dark] .calendar-day-number,html[data-theme=dark] .calendar-cell>small{color:#d5dfe9}html[data-theme=dark] .calendar-cell.blank{background:transparent;border:0}html[data-theme=dark] .calendar-legend,html[data-theme=dark] .selected-day-heading,html[data-theme=dark] .selected-attendance-detail{border-color:#2b3948}html[data-theme=dark] .employee-day.present{background:#1c3c31;border-color:#2c5b48}html[data-theme=dark] .employee-day.half{background:#403425;border-color:#624a2d}html[data-theme=dark] .employee-day.absent,html[data-theme=dark] .employee-day.unpaid_leave{background:#422b30;border-color:#634047}html[data-theme=dark] .employee-day.paid_leave{background:#203754;border-color:#355477}html[data-theme=dark] .employee-day.unmarked{background:#202d3a}html[data-theme=dark] .ledger-balance,html[data-theme=dark] .info-banner{background:#1c3045;border-color:#2b4c6d}html[data-theme=dark] .ledger-balance span,html[data-theme=dark] .info-banner p{color:#a9c5df}html[data-theme=dark] .modal{background:#1a2531;color:#e8edf3}html[data-theme=dark] .modal-head h2{color:#e8edf3}html[data-theme=dark] .form-stack input,html[data-theme=dark] .form-stack select,html[data-theme=dark] .settings-panel input,html[data-theme=dark] .settings-panel select{background:#202d3a;border-color:#354657;color:#e8edf3}html[data-theme=dark] .icon-button{background:#202d3a;border-color:#354657;color:#d2dce6}html[data-theme=dark] .owner-card{border-color:#2b3948}html[data-theme=dark] .auth-screen{background:#111821}html[data-theme=dark] .auth-card{background:#1a2531;border-color:#2b3948;color:#e8edf3}html[data-theme=dark] .auth-card h1,html[data-theme=dark] .auth-brand b{color:#e8edf3}html[data-theme=dark] .setup-instructions{background:#202d3a}html[data-theme=dark] .mobile-nav{background:#18232eee;border-color:#2b3948}html[data-theme=dark] .mobile-link{color:#9eabb8}html[data-theme=dark] .mobile-link.active{color:#80baff}html[data-theme=dark] .toast{background:#e6edf5;color:#17212c}@media(max-width:760px){.mobile-logout{display:grid}.stats-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.auth-card{padding:24px}.selected-attendance-detail{align-items:flex-start;flex-direction:column}.attendance-edit-control{width:100%}.attendance-edit-control select{max-width:none;width:100%}}.brand-logo-small{width:46px;height:46px;object-fit:cover;border-radius:11px;flex-shrink:0;border:1px solid #e7ebf0}.mobile-brand-logo{width:34px;height:34px;object-fit:cover;border-radius:9px;flex-shrink:0}.dashboard-brand-hero{min-height:205px;margin:0 0 26px;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:radial-gradient(ellipse at 50% 0%,#344c65,#1a2a3d 55%,#111c2a);border:1px solid #26394d;position:relative}.dashboard-brand-hero:after{content:"";position:absolute;left:-8%;right:-8%;height:5px;bottom:0;background:linear-gradient(90deg,#f04a24,#ffb52c,#f04a24);transform:rotate(-1.5deg);box-shadow:0 -4px 18px #f28b2b40}.dashboard-brand-hero img{width:170px;height:170px;max-width:48vw;object-fit:cover;border-radius:16px;box-shadow:0 12px 34px #0005}.dashboard-brand-hero span{color:#ffd18b;font-size:9px;font-weight:800;letter-spacing:2px;position:relative;z-index:1}.app-footer{display:flex;justify-content:center;align-items:center;padding:30px 12px 12px;margin-top:28px;min-height:82px}.brand-credit{display:inline-flex;align-items:center;justify-content:center;gap:4px;position:relative;color:#7e8995;font-size:12px;font-weight:600;line-height:1.4}.brand-credit-link{display:inline-flex;align-items:center;gap:4px;padding:2px 0;border:0;background:transparent;color:#267fe8;text-decoration:underline;text-underline-offset:3px;font-weight:800;font-size:inherit}.brand-contact-popover{display:none;position:absolute;z-index:15;left:50%;bottom:calc(100% + 12px);transform:translate(-50%);min-width:220px;padding:13px 15px;border-radius:12px;background:#172638;color:#fff;box-shadow:0 12px 32px #0c1c2d35;border:1px solid #34475b;gap:9px;text-align:left}.brand-contact-popover:after{content:"";position:absolute;left:calc(50% - 7px);bottom:-7px;width:13px;height:13px;background:#172638;border-right:1px solid #34475b;border-bottom:1px solid #34475b;transform:rotate(45deg)}.brand-contact-popover a{color:#fff;text-decoration:none;font-size:12px;white-space:nowrap}.brand-contact-popover a:hover{text-decoration:underline}.brand-credit:hover .brand-contact-popover,.brand-credit:focus-within .brand-contact-popover,.brand-contact-popover.is-open{display:grid}.auth-screen{min-height:100vh;min-height:100svh;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 18px 24px;background:radial-gradient(ellipse at 50% 15%,#263d56,#142337 44%,#0b1421);font-family:Figtree,sans-serif}.auth-screen:before,.auth-screen:after{content:"";position:absolute;z-index:-1;pointer-events:none}.auth-screen:before{width:520px;height:520px;border:1px solid #ffffff12;border-radius:50%;top:-290px;right:-180px;box-shadow:0 0 0 45px #ffffff05,0 0 0 95px #ffffff03}.auth-screen:after{height:7px;left:-8%;right:-8%;bottom:0;background:linear-gradient(90deg,#ed4a24,#ffb52c,#ed4a24);transform:rotate(-2deg);transform-origin:left center}.auth-backdrop-glow{position:absolute;z-index:-1;inset:0;background:linear-gradient(130deg,transparent 30%,#ffffff04 50%,transparent 70%)}.auth-content{width:min(100%,440px);display:grid;justify-items:center;gap:17px;margin:auto;position:relative;z-index:1}.auth-logo-wrap{width:100%;display:flex;justify-content:center;align-items:center}.auth-logo{width:min(270px,68vw);height:auto;aspect-ratio:1;object-fit:cover;border-radius:18px;box-shadow:0 20px 55px #0007;border:1px solid #ffffff24}.auth-card{width:100%;background:#fff;border:1px solid #e9edf2;border-radius:20px;padding:26px 29px;box-shadow:0 22px 65px #0005}.auth-brand-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px;padding-bottom:13px;border-bottom:1px solid #edf0f3}.auth-brand-title span{font-size:10px;font-weight:900;letter-spacing:1.5px;color:#26384c}.auth-brand-title small{font-size:9px;font-weight:800;letter-spacing:1px;color:#e87525}.auth-card h1{font-size:24px;letter-spacing:-.7px;margin:0 0 7px;color:#192431}.auth-card .form-stack label{color:#46515d}.auth-card .form-stack input{height:46px;border-radius:10px}.auth-card .button-primary{height:46px;background:#176bd2}.auth-subtitle{font-size:12px;color:#7d8792;line-height:1.6;margin:0 0 21px}.login-footnote{font-size:10px;color:#8a949e;line-height:1.5;margin:15px 0 0;text-align:center}.auth-credit{margin-top:23px;color:#e2e8ef;flex-shrink:0}.auth-credit .brand-credit-link{color:#ffbd67}.auth-credit .brand-contact-popover{background:#101d2c;border-color:#43546a}.auth-credit .brand-contact-popover:after{background:#101d2c;border-color:#43546a}html[data-theme=dark] .app-footer .brand-credit{color:#aab6c2}@media(max-width:760px){.dashboard-brand-hero{min-height:190px;margin-bottom:23px;border-radius:15px}.dashboard-brand-hero img{width:154px;height:154px}.app-footer{padding:28px 12px 18px;margin-top:22px}.brand-credit{font-size:11px}.auth-screen{justify-content:space-between;padding:26px 16px calc(26px + env(safe-area-inset-bottom))}.auth-content{margin:auto;gap:14px}.auth-logo{width:min(220px,58vw);border-radius:15px}.auth-card{padding:22px 20px;border-radius:17px}.auth-card h1{font-size:22px}.auth-credit{margin-top:24px}}@media(max-width:390px){.dashboard-brand-hero img{width:140px;height:140px}.dashboard-brand-hero{min-height:174px}.auth-logo{width:min(190px,54vw)}}.brand-logo-small,.mobile-brand-logo{object-fit:contain;background:#172638;border-color:#34475b;padding:2px}.dashboard-brand-hero{min-height:270px;padding:18px 16px;margin:0 0 28px;border-radius:20px;background:radial-gradient(ellipse at 50% 5%,#3c536a,#1b2b3e 56%,#101a27);box-shadow:0 12px 30px #15263a16}.dashboard-brand-hero img{display:block;width:min(235px,66vw);height:auto;max-height:235px;aspect-ratio:924/680;object-fit:contain;border:0;border-radius:13px;box-shadow:0 14px 38px #0005}.app-footer{position:relative;z-index:1;flex-shrink:0;margin-top:34px;padding:28px 12px 18px;min-height:86px}.page-wrap{padding-bottom:42px}.auth-logo{width:min(300px,72vw);aspect-ratio:924/680;object-fit:contain;border-radius:14px}@media(max-width:760px){.dashboard-brand-hero{min-height:235px;padding:14px 12px;margin-bottom:23px;border-radius:16px}.dashboard-brand-hero img{width:min(205px,68vw);max-height:205px}.app-footer{margin-top:28px;padding:26px 12px 20px;min-height:78px}.auth-logo{width:min(255px,70vw)}}@media(max-width:390px){.dashboard-brand-hero{min-height:210px}.dashboard-brand-hero img{width:min(185px,68vw);max-height:185px}}.dashboard-add-button{width:58px;height:58px;border:0;border-radius:18px;background:#267fe8;color:#fff;display:grid;place-items:center;box-shadow:0 8px 18px #267fe82a;flex-shrink:0}.dashboard-add-button:hover{background:#176fd6;transform:translateY(-1px)}.page-heading .eyebrow{font-size:11px;letter-spacing:1.8px}.page-heading h1{font-size:34px;letter-spacing:-1.4px}.page-heading p{font-size:15px}.welcome-strip{min-height:220px;padding:34px;border-radius:24px;margin-top:42px;margin-bottom:58px}.welcome-kicker{font-size:12px;letter-spacing:2px}.welcome-strip h2{font-size:29px;max-width:430px;line-height:1.25;margin:18px 0 10px}.welcome-strip p{font-size:16px;line-height:1.5;max-width:520px}.welcome-art{width:150px;height:150px}.art-circle{width:116px;height:116px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.stat-card{border-radius:20px;padding:22px;min-height:178px}.stat-icon{width:54px;height:54px;border-radius:16px;margin-bottom:20px}.stat-label{font-size:15px}.stat-value{font-size:30px;margin:9px 0 5px}.stat-detail{font-size:13px}.app-footer{position:relative;z-index:20;isolation:isolate}.brand-credit{z-index:30}.brand-contact-popover{z-index:999;min-width:250px;padding:16px 18px;border-radius:15px;box-shadow:0 18px 45px #08152255;border:1px solid #42566d;background:linear-gradient(145deg,#1c3046,#101c2a);gap:12px}.brand-contact-popover:after{background:#101c2a;border-color:#42566d}.brand-contact-popover a{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700}.brand-contact-popover a svg{color:#ffad4d;flex-shrink:0}.auth-credit{position:relative;z-index:100;isolation:isolate;margin-top:26px;padding:10px 14px}.auth-screen:after{z-index:0;pointer-events:none}.auth-content{z-index:2}.auth-credit .brand-contact-popover{z-index:1000}@media(max-width:760px){.page-wrap{padding:28px 20px calc(96px + env(safe-area-inset-bottom))}.page-heading{align-items:flex-start;margin-bottom:20px}.page-heading h1{font-size:32px}.page-heading p{font-size:14px;line-height:1.45}.welcome-strip{min-height:205px;padding:24px 22px;margin-top:34px;margin-bottom:48px}.welcome-strip h2{font-size:24px;max-width:260px}.welcome-strip p{font-size:14px;max-width:300px}.welcome-art{width:100px;height:110px}.art-circle{width:86px;height:86px}.art-circle svg{width:42px;height:42px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.stat-card{padding:20px 18px;min-height:170px;border-radius:20px}.stat-value{font-size:27px}.section-head{margin-top:35px}.app-footer{padding:30px 12px 24px;margin-top:28px}}