:root{--bg: #f5f6fa;--surface: #ffffff;--surface-2: #f8f9fc;--surface-3: #eef0f6;--border: #e4e7ef;--border-strong: #d3d8e4;--text: #111827;--text-2: #374151;--muted: #6b7280;--primary: #4f46e5;--primary-hover: #4338ca;--primary-soft: #eef2ff;--primary-ring: rgb(79 70 229 / 22%);--on-primary: #ffffff;--primary-solid: #4f46e5;--primary-solid-hover: #4338ca;--success: #047857;--success-soft: #d1fae5;--danger: #dc2626;--danger-soft: #fee2e2;--warning: #b45309;--warning-soft: #fef3c7;--info: #7c3aed;--info-soft: #ede9fe;--sidebar: #0f1729;--sidebar-2: #18223a;--sidebar-text: #a5b0c6;--sidebar-active: #1d2944;--shadow-sm: 0 1px 2px rgb(16 24 40 / 5%);--shadow: 0 1px 3px rgb(16 24 40 / 6%), 0 1px 2px rgb(16 24 40 / 4%);--shadow-lg: 0 12px 32px -8px rgb(16 24 40 / 18%), 0 4px 8px -4px rgb(16 24 40 / 8%);color-scheme:light;--radius: 12px;--radius-sm: 8px;--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #0a0e1a;--surface: #111726;--surface-2: #161d2f;--surface-3: #1d2539;--border: #232c42;--border-strong: #2f3a55;--text: #e6e9f2;--text-2: #c3c9d8;--muted: #8b95ab;--primary: #818cf8;--primary-hover: #a5b4fc;--primary-soft: rgb(129 140 248 / 14%);--primary-ring: rgb(129 140 248 / 30%);--on-primary: #ffffff;--primary-solid: #6366f1;--primary-solid-hover: #5458e8;--success: #34d399;--success-soft: rgb(52 211 153 / 14%);--danger: #f87171;--danger-soft: rgb(248 113 113 / 14%);--warning: #fbbf24;--warning-soft: rgb(251 191 36 / 14%);--info: #c4b5fd;--info-soft: rgb(196 181 253 / 14%);--sidebar: #070b15;--sidebar-2: #0e1424;--sidebar-text: #8f9ab2;--sidebar-active: #161f35;--shadow-sm: 0 1px 2px rgb(0 0 0 / 30%);--shadow: 0 1px 3px rgb(0 0 0 / 35%);--shadow-lg: 0 16px 40px -8px rgb(0 0 0 / 60%);color-scheme:dark}}:root[data-theme=dark]{--bg: #0a0e1a;--surface: #111726;--surface-2: #161d2f;--surface-3: #1d2539;--border: #232c42;--border-strong: #2f3a55;--text: #e6e9f2;--text-2: #c3c9d8;--muted: #8b95ab;--primary: #818cf8;--primary-hover: #a5b4fc;--primary-soft: rgb(129 140 248 / 14%);--primary-ring: rgb(129 140 248 / 30%);--on-primary: #ffffff;--primary-solid: #6366f1;--primary-solid-hover: #5458e8;--success: #34d399;--success-soft: rgb(52 211 153 / 14%);--danger: #f87171;--danger-soft: rgb(248 113 113 / 14%);--warning: #fbbf24;--warning-soft: rgb(251 191 36 / 14%);--info: #c4b5fd;--info-soft: rgb(196 181 253 / 14%);--sidebar: #070b15;--sidebar-2: #0e1424;--sidebar-text: #8f9ab2;--sidebar-active: #161f35;--shadow-sm: 0 1px 2px rgb(0 0 0 / 30%);--shadow: 0 1px 3px rgb(0 0 0 / 35%);--shadow-lg: 0 16px 40px -8px rgb(0 0 0 / 60%);color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 var(--font);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:22px;font-weight:700;letter-spacing:-.02em;margin:0;line-height:1.25}h2{font-size:15px;font-weight:600;letter-spacing:-.01em;margin:0 0 14px}h3{font-size:14px;font-weight:600}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}strong{font-weight:600}::selection{background:var(--primary-ring)}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.page-head{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap;margin-bottom:16px;padding:14px 20px;border:1px solid color-mix(in srgb,var(--primary) 18%,var(--border));border-radius:16px;background:linear-gradient(120deg,var(--primary-soft) 0%,color-mix(in srgb,var(--primary-soft) 35%,var(--surface)) 45%,var(--surface) 100%);box-shadow:var(--shadow)}.page-head>:first-child{margin-inline-end:auto;min-width:0}.page-head h1{color:var(--text)}.page-head .sub{color:var(--muted);font-size:13.5px;margin-top:3px}.page-head a.muted{font-size:12.5px;font-weight:500}.page-head .actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.page-head:after{content:"";position:absolute;z-index:-1;right:-70px;top:-110px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,#a855f7 16%,transparent),transparent 68%);pointer-events:none}main.has-icon .page-head:before{content:"";flex:none;width:42px;height:42px;border-radius:12px;background:var(--page-icon) center/22px no-repeat,linear-gradient(135deg,var(--primary-solid),color-mix(in srgb,var(--primary-solid) 65%,#a855f7));box-shadow:0 6px 14px -6px color-mix(in srgb,var(--primary-solid) 70%,transparent),inset 0 1px #ffffff2e}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.card>h2:first-child{display:flex;align-items:center;gap:8px}.toolbar{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-bottom:14px}.grid{display:grid;gap:16px}.tile{display:flex;flex-direction:column;gap:2px}.tile span{color:var(--muted);font-size:13px;font-weight:500}.tile strong{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.3;margin-top:2px;font-variant-numeric:tabular-nums}.tile small{color:var(--muted);font-size:12.5px}.card.tile{padding:14px 18px}.muted{color:var(--muted)}.small{font-size:12px}.right{text-align:end}.empty{padding:44px 16px;text-align:center;color:var(--muted)}.empty:before{content:"";display:block;width:44px;height:44px;margin:0 auto 12px;border-radius:12px;background:var(--surface-3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%238b95ab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-6l-2 3h-4l-2-3H2'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E") center no-repeat}td.empty:before{margin-bottom:10px}.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.card-head h2{margin:0}.card-head p{margin:2px 0 0}.person-cell{display:flex;align-items:center;gap:12px;min-width:0}.person-cell:is(a):hover{text-decoration:none}.person-cell:is(a):hover .who>:first-child{color:var(--primary)}.person-cell .who{display:flex;flex-direction:column;min-width:0;line-height:1.35}.person-cell .who>:first-child{font-weight:500;color:var(--text)}.person-cell .who small{color:var(--muted);font-size:12px}.skeleton{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,var(--surface-3) 25%,var(--surface-2) 50%,var(--surface-3) 75%);background-size:200% 100%;animation:shimmer 1.2s ease-in-out infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.num,td.right{font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-2);font:inherit;font-weight:500;font-size:13.5px;cursor:pointer;text-decoration:none;white-space:nowrap;box-shadow:var(--shadow-sm);transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s,transform .05s}.btn:hover:not(:disabled){background:var(--surface-2);color:var(--text);text-decoration:none}.btn:active:not(:disabled){transform:translateY(1px)}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-ring)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--primary-solid);border-color:var(--primary-solid);color:var(--on-primary);box-shadow:0 1px 2px #4f46e540,inset 0 1px #ffffff1f}.btn.primary:hover:not(:disabled){background:var(--primary-solid-hover);border-color:var(--primary-solid-hover);color:var(--on-primary)}.btn.danger{color:var(--danger)}.btn.danger:hover:not(:disabled){background:var(--danger-soft);border-color:transparent;color:var(--danger)}.btn.sm{height:30px;padding:0 10px;font-size:12.5px;border-radius:7px}.btn.link{border:0;background:none;box-shadow:none;color:var(--primary);padding:0 4px;height:auto}.btn.link:hover:not(:disabled){background:none;color:var(--primary-hover);text-decoration:underline}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field>span{font-size:12.5px;font-weight:500;color:var(--text-2)}.field>small.muted{font-size:12px;line-height:1.4}.field .error{color:var(--danger);font-size:12px;font-weight:500;line-height:1.4}.field.required>span:after{content:" *";color:var(--danger);font-weight:600}.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-soft)}.field.invalid input:focus,.field.invalid select:focus,.field.invalid textarea:focus{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-soft)}.field.invalid>span{color:var(--danger)}.field:has(>small.error) input,.field:has(>small.error) select,.field:has(>small.error) textarea{border-color:var(--danger)}.form-section{padding-top:18px;margin-top:18px;border-top:1px solid var(--border)}.form-section:first-child{padding-top:0;margin-top:0;border-top:0}.form-section>h3{margin:0 0 4px;font-size:14px;font-weight:600}.form-section>p{margin:0 0 14px;font-size:12.5px;color:var(--muted)}input,select,textarea{height:38px;padding:0 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font:inherit;width:100%;box-shadow:var(--shadow-sm);transition:border-color .15s,box-shadow .15s}input::placeholder,select::placeholder,textarea::placeholder{color:var(--muted);opacity:.8}input:hover:not(:disabled):not(:focus),select:hover:not(:disabled):not(:focus),textarea:hover:not(:disabled):not(:focus){border-color:var(--muted)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring)}input:disabled,select:disabled,textarea:disabled{background:var(--surface-2);color:var(--muted);cursor:not-allowed}select{appearance:none;padding-right:34px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238b95ab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}select[multiple]{background-image:none;padding:6px 10px;height:auto}textarea{height:auto;padding:10px 12px;resize:vertical}input[type=checkbox],input[type=radio]{width:16px;height:16px;padding:0;box-shadow:none;accent-color:var(--primary);cursor:pointer;flex:none}input[type=checkbox]:focus,input[type=radio]:focus{box-shadow:none}input[type=file]{height:auto;padding:6px}.check{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:13.5px;color:var(--text-2);-webkit-user-select:none;user-select:none}.check:hover input[type=checkbox]:not(:checked){border-color:var(--primary)}input[type=checkbox]{appearance:none;width:18px;height:18px;border:1.5px solid var(--border-strong);border-radius:5px;background:var(--surface);display:inline-grid;place-items:center;transition:background-color .12s,border-color .12s}input[type=checkbox]:checked{border-color:var(--primary-solid);background:var(--primary-solid) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}input[type=checkbox]:focus-visible{box-shadow:0 0 0 3px var(--primary-ring)}.form-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}app-modal .body:has(.form-actions){padding-bottom:0}:root{--th-bg: color-mix(in srgb, var(--primary) 7%, var(--surface));--th-text: color-mix(in srgb, var(--primary) 62%, var(--text-2));--th-line: color-mix(in srgb, var(--primary) 45%, transparent);--row-stripe: color-mix(in srgb, var(--primary) 2.5%, var(--surface));--row-hover: color-mix(in srgb, var(--primary) 6.5%, var(--surface));--cell-y: 8px;--cell-x: 14px}:root[data-density=compact]{--cell-y: 5px;--cell-x: 12px}.table-wrap{overflow-x:auto}.card>.table-wrap:only-child{margin:-20px;width:calc(100% + 40px);border-radius:inherit}table.data{width:100%;border-collapse:separate;border-spacing:0}table.data th,table.data td{padding:var(--cell-y) var(--cell-x);border-bottom:1px solid var(--border);text-align:start;vertical-align:middle}table.data td{line-height:1.4}table.data td .small,table.data td small{line-height:1.3}table.data th{padding-top:calc(var(--cell-y) + 2px);padding-bottom:calc(var(--cell-y) + 1px);font-size:11.5px;font-weight:600;color:var(--th-text);background:var(--th-bg);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border-bottom:2px solid var(--th-line)}table.data th.right,table.data td.right{text-align:end}table.data tbody tr{transition:background-color .1s}table.data tbody tr:nth-child(2n){background:var(--row-stripe)}table.data thead th:first-child{border-top-left-radius:8px}table.data thead th:last-child{border-top-right-radius:8px}table.data tbody tr:hover{background:var(--row-hover)}table.data tbody tr:not(:has(>td.empty-cell)):hover>td:first-child{box-shadow:inset 3px 0 0 var(--primary)}table.data tbody tr:last-child td{border-bottom:0}table.data td.actions{text-align:end;white-space:nowrap}table.data td.actions>*+*{margin-inline-start:6px}table.data tfoot td{font-weight:600;background:var(--th-bg);border-top:2px solid var(--th-line)}:root[data-density=compact] table.data{font-size:13px}:root[data-density=compact] table.data app-avatar{zoom:.82}:root[data-density=compact] table.data .btn.sm{height:26px}main .card .table-wrap{max-height:max(320px,100dvh - 190px);overflow:auto;border-radius:8px}main .card .table-wrap thead th{position:sticky;top:0;z-index:2}main .card .table-wrap tfoot td{position:sticky;bottom:0;z-index:1}@media(max-width:640px){main .card .table-wrap{max-height:none}}@media print{main .card .table-wrap{max-height:none;overflow:visible}}.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:500;line-height:1.6;white-space:nowrap;background:var(--surface-3);color:var(--muted)}.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}.pill.ok,.pill.Active,.pill.Present,.pill.Paid{background:var(--success-soft);color:var(--success)}.pill.bad,.pill.Absent,.pill.Left,.pill.Suspended,.pill.StruckOff,.pill.Unpaid{background:var(--danger-soft);color:var(--danger)}.pill.Late,.pill.PartiallyPaid{background:var(--warning-soft);color:var(--warning)}.pill.info,.pill.Leave,.pill.Graduated{background:var(--info-soft);color:var(--info)}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:0s!important;transition-duration:0s!important}}@media(max-width:640px){.card{padding:16px}.card>.table-wrap:only-child{margin:-16px;width:calc(100% + 32px)}.tiles{grid-template-columns:1fr 1fr!important;gap:10px!important}.tile{padding:14px!important}.tile strong{font-size:20px!important}h1{font-size:20px}.toolbar{gap:10px}.toolbar>.field,.toolbar>input:not([type=checkbox]),.toolbar>select{flex:1 1 100%!important;max-width:none!important}.toolbar>.btn{flex:1 1 0}table.data th,table.data td{white-space:nowrap;padding:10px 12px}table.data td.wrap{white-space:normal;min-width:220px}}@media print{body{background:#fff;color:#000}.card{box-shadow:none}}td.empty-cell{padding:0!important}table.data tbody tr:has(>td.empty-cell):hover{background:none}.form-section>h3,.card-head h2,.card>h2:first-child,form.card>h2,form.card>fieldset>h2{display:flex;align-items:center;gap:9px}.form-section>h3:before,.card-head h2:before,.card>h2:first-child:before,form.card>h2:before,form.card>fieldset>h2:before{content:"";flex:none;width:4px;height:16px;border-radius:2px;background:linear-gradient(180deg,var(--primary-solid),color-mix(in srgb,var(--primary-solid) 55%,#a855f7))}@media(max-width:640px){.page-head{padding:14px 16px;border-radius:14px}main.has-icon .page-head:before{width:40px;height:40px;border-radius:11px;background-size:19px,auto}.page-head>.actions,.page-head>.btn{width:100%}}@media print{.page-head{background:none;border:0;box-shadow:none;padding:0}.page-head:before,.page-head:after{display:none}}table.data th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .12s}table.data th.sortable:after{content:"";display:inline-block;width:8px;height:8px;margin-left:6px;vertical-align:1px;opacity:0;background:currentColor;transition:opacity .12s,transform .15s;clip-path:polygon(50% 15%,100% 85%,0 85%)}table.data th.sortable:hover{color:var(--text-2)}table.data th.sortable:hover:after{opacity:.35}table.data th.sortable:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}table.data th.sortable.asc,table.data th.sortable.desc{color:var(--primary)}table.data th.sortable.asc:after,table.data th.sortable.desc:after{opacity:1}table.data th.sortable.desc:after{transform:rotate(180deg)}table.data th.sortable.right:after{margin-left:4px}table.data th.pick,table.data td.pick{width:40px;padding-right:0}table.data td.pick input{vertical-align:middle}table.data tbody tr.selected td,table.data tbody tr.selected:hover td{background:var(--primary-soft)}html[lang=ur]{--font: "Inter", "Noto Nastaliq Urdu", system-ui, sans-serif}html[lang=ur] body{line-height:2}html[lang=ur] h1,html[lang=ur] h2,html[lang=ur] h3{line-height:1.9;letter-spacing:0}html[lang=ur] th{letter-spacing:0;font-size:12.5px}html[lang=ur] select{padding-right:12px;padding-left:34px;background-position:left 10px center}html[lang=ur] .pill,html[lang=ur] .btn,html[lang=ur] button{line-height:1.9}