:root{--color-bg: #f6f4f0;--color-bg-subtle: #efece5;--color-surface: #ffffff;--color-surface-raised: #ffffff;--color-surface-sunken: #f1efe9;--color-border: #e4e0d6;--color-border-strong: #cfc9ba;--color-text: #16202f;--color-text-muted: #545f6e;--color-text-subtle: #838c98;--color-text-inverse: #f6f4f0;--color-primary: #12213a;--color-primary-hover: #0c1729;--color-primary-active: #081019;--color-primary-subtle: #e7eaf0;--color-primary-border: #c3cadb;--color-focus-ring: #b8814a;--color-accent: #b8814a;--color-accent-hover: #a06f3c;--color-accent-active: #895f32;--color-accent-subtle: #f6ede1;--color-accent-border: #e3cca9;--color-success: #1a8a4b;--color-success-subtle: #e7f6ed;--color-success-border: #a9dcbd;--color-warning: #b7791f;--color-warning-subtle: #fdf3e0;--color-warning-border: #f0d29c;--color-danger: #c0342c;--color-danger-hover: #a52a23;--color-danger-subtle: #fbe9e8;--color-danger-border: #eeb8b4;--color-info: #2b5f8a;--color-info-subtle: #e7eff5;--color-info-border: #bdd1e0;--status-present: #1a8a4b;--status-present-bg: #e7f6ed;--status-present-border: #a9dcbd;--status-absent: #c0342c;--status-absent-bg: #fbe9e8;--status-absent-border: #eeb8b4;--status-half-day: #b7791f;--status-half-day-bg: #fdf3e0;--status-half-day-border: #f0d29c;--status-leave: #6941c6;--status-leave-bg: #f3edfd;--status-leave-border: #d6c4f5;--status-holiday: #0b7285;--status-holiday-bg: #e3f6f9;--status-holiday-border: #a9e2ea;--status-weekend: #5b616e;--status-weekend-bg: #eef0f3;--status-weekend-border: #d3d7de;--status-late: #b7791f;--status-late-bg: #fdf3e0;--status-late-border: #f0d29c;--status-pending: #b7791f;--status-pending-bg: #fdf3e0;--status-pending-border: #f0d29c;--status-approved: #1a8a4b;--status-approved-bg: #e7f6ed;--status-approved-border: #a9dcbd;--status-rejected: #c0342c;--status-rejected-bg: #fbe9e8;--status-rejected-border: #eeb8b4;--status-cancelled: #5b616e;--status-cancelled-bg: #eef0f3;--status-cancelled-border: #d3d7de;--status-completed: #2b5f8a;--status-completed-bg: #e7eff5;--status-completed-border: #bdd1e0;--status-draft: #5b616e;--status-draft-bg: #eef0f3;--status-draft-border: #d3d7de;--font-display: "Fraunces", "Iowan Old Style", Georgia, serif;--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-tabular: "IBM Plex Mono", "Inter", system-ui, monospace;--text-xs: 12px;--text-xs-lh: 16px;--text-sm: 13px;--text-sm-lh: 20px;--text-md: 15px;--text-md-lh: 22px;--text-lg: 18px;--text-lg-lh: 26px;--text-xl: 22px;--text-xl-lh: 30px;--text-2xl: 28px;--text-2xl-lh: 36px;--text-3xl: 34px;--text-3xl-lh: 42px;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--space-0: 0px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--space-9: 96px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 999px;--shadow-xs: 0 1px 1px rgba(16, 24, 40, .04);--shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);--shadow-md: 0 4px 12px rgba(16, 24, 40, .08);--shadow-lg: 0 12px 32px rgba(16, 24, 40, .14);--shadow-focus: 0 0 0 3px rgba(36, 84, 255, .28);--motion-fast: .16s ease;--motion-base: .2s ease;--motion-slow: .25s ease;--motion-translate: 4px;--breakpoint-xs: 360px;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1440px;--shell-sidebar-width: 248px;--shell-sidebar-collapsed-width: 72px;--shell-topbar-height: 64px;--z-topbar: 20;--z-sidebar: 30;--z-overlay: 40;--z-modal: 50;--z-toast: 60;--z-tooltip: 70;--touch-target-min: 44px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:var(--text-md);line-height:var(--text-md-lh)}h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--font-display);font-weight:var(--font-weight-semibold);text-wrap:balance}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}a{color:var(--color-accent-active)}.tabular-nums,.font-tabular{font-family:var(--font-tabular);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:var(--radius-sm)}.skip-link{position:absolute;left:var(--space-3);top:-60px;background:var(--color-primary);color:var(--color-text-inverse);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);z-index:var(--z-modal);transition:top var(--motion-fast);text-decoration:none;font-weight:var(--font-weight-medium)}.skip-link:focus{top:var(--space-3)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-target-min);padding:0 var(--space-4);border-radius:var(--radius-md);border:1px solid transparent;font-weight:var(--font-weight-medium);font-size:var(--text-md);cursor:pointer;transition:background var(--motion-fast),border-color var(--motion-fast),box-shadow var(--motion-fast),transform var(--motion-fast),color var(--motion-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:active:not(:disabled){transform:translateY(1px) scale(.98);box-shadow:inset 0 1px 2px #10182829}.btn:disabled{cursor:not-allowed;opacity:.55}.btn-primary{background:var(--color-accent);color:var(--color-text-inverse);border-color:var(--color-accent)}.btn-primary:hover:not(:disabled){background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn-primary:active:not(:disabled){background:var(--color-accent-active);border-color:var(--color-accent-active)}.btn-secondary{background:var(--color-surface);color:var(--color-primary);border-color:var(--color-primary-border)}.btn-secondary:hover:not(:disabled){background:var(--color-primary-subtle);border-color:var(--color-primary)}.btn-secondary:active:not(:disabled){background:var(--color-primary-subtle)}.btn-ghost{background:transparent;color:var(--color-text);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--color-bg-subtle)}.btn-danger{background:var(--color-danger);color:var(--color-text-inverse);border-color:var(--color-danger)}.btn-danger:hover:not(:disabled){background:var(--color-danger-hover);border-color:var(--color-danger-hover)}.btn-danger:active:not(:disabled){background:var(--color-danger-hover)}.btn-brand{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.btn-brand:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-brand:active:not(:disabled){background:var(--color-primary-active);border-color:var(--color-primary-active)}.btn-sm{min-height:36px;padding:0 var(--space-3);font-size:var(--text-sm)}.btn-lg{min-height:52px;padding:0 var(--space-5);font-size:var(--text-lg)}.btn-block{width:100%}.btn-spinner{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite;flex-shrink:0}@media (prefers-reduced-motion: reduce){.btn-spinner{animation-duration:1ms}}@keyframes spin{to{transform:rotate(360deg)}}.field{display:flex;flex-direction:column;gap:var(--space-1)}.field-label-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-2)}.field-label{font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text)}.field-optional{font-size:var(--text-xs);color:var(--color-text-subtle)}.field-hint{font-size:var(--text-xs);color:var(--color-text-muted)}.field-error{font-size:var(--text-xs);color:var(--color-danger);display:flex;align-items:center;gap:var(--space-1)}.input,.textarea,.select{min-height:var(--touch-target-min);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-surface);padding:0 var(--space-3);font-size:var(--text-md);color:var(--color-text);transition:border-color var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast);width:100%}.textarea{min-height:96px;padding:var(--space-3);resize:vertical}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--color-text-muted) 50%),linear-gradient(135deg,var(--color-text-muted) 50%,transparent 50%);background-position:calc(100% - 18px) center,calc(100% - 13px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:var(--space-6)}.input:hover:not(:disabled),.textarea:hover:not(:disabled),.select:hover:not(:disabled){border-color:var(--color-border-strong)}.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--color-primary);box-shadow:var(--shadow-focus)}.input:disabled,.textarea:disabled,.select:disabled{background:var(--color-bg-subtle);color:var(--color-text-subtle);cursor:not-allowed}.field-invalid .input,.field-invalid .textarea,.field-invalid .select{border-color:var(--color-danger)}.field-invalid .input:focus,.field-invalid .textarea:focus,.field-invalid .select:focus{box-shadow:0 0 0 3px #c0342c38}.field-valid .input,.field-valid .textarea,.field-valid .select{border-color:var(--color-success)}.input-wrap{position:relative;display:flex;align-items:center}.input-wrap .input{padding-right:var(--space-7)}.input-affix-btn{position:absolute;right:var(--space-2);background:none;border:none;cursor:pointer;color:var(--color-text-muted);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);min-height:32px}.input-affix-btn:hover{color:var(--color-text);background:var(--color-bg-subtle)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.card-padded{padding:var(--space-5)}.card-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-4)}.card-title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold)}.card-subtitle{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:2px}.kpi-tile{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:var(--space-2);min-width:0;transition:box-shadow var(--motion-base),transform var(--motion-base),border-color var(--motion-base)}.kpi-tile.kpi-clickable{cursor:pointer}.kpi-tile.kpi-clickable:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--color-accent-border)}.kpi-tile.kpi-clickable:active{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.kpi-tile-label{font-size:var(--text-sm);color:var(--color-text-muted);font-weight:var(--font-weight-medium);display:flex;align-items:center;gap:var(--space-2)}.kpi-tile-value{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);line-height:1.1;font-family:var(--font-tabular);font-variant-numeric:tabular-nums}.kpi-tile-meta{font-size:var(--text-xs);color:var(--color-text-subtle);display:flex;align-items:center;gap:var(--space-1)}.kpi-tile-trend-up,.kpi-tile-trend-down{display:inline-flex;align-items:center;gap:3px;font-weight:var(--font-weight-semibold);padding:1px var(--space-1);border-radius:var(--radius-sm)}.kpi-tile-trend-up{color:var(--color-success);background:var(--color-success-subtle)}.kpi-tile-trend-down{color:var(--color-danger);background:var(--color-danger-subtle)}.kpi-tile-trend-icon{display:inline-block;line-height:1;font-size:9px}.kpi-tile.kpi-accent-warning{border-color:var(--status-pending-border);background:var(--status-pending-bg)}.kpi-tile.kpi-accent-danger{border-color:var(--status-absent-border);background:var(--status-absent-bg)}.badge{display:inline-flex;align-items:center;gap:5px;font-size:var(--text-xs);font-weight:var(--font-weight-medium);padding:2px var(--space-2);border-radius:var(--radius-full);border:1px solid transparent;line-height:var(--text-xs-lh);white-space:nowrap;animation:badgeIn var(--motion-fast) ease-out}@keyframes badgeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.badge{animation:none}}.badge-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;background:currentColor}.badge-neutral{background:var(--color-bg-subtle);color:var(--color-text-muted);border-color:var(--color-border)}.badge-present{background:var(--status-present-bg);color:var(--status-present);border-color:var(--status-present-border)}.badge-absent{background:var(--status-absent-bg);color:var(--status-absent);border-color:var(--status-absent-border)}.badge-half-day{background:var(--status-half-day-bg);color:var(--status-half-day);border-color:var(--status-half-day-border)}.badge-leave{background:var(--status-leave-bg);color:var(--status-leave);border-color:var(--status-leave-border)}.badge-holiday{background:var(--status-holiday-bg);color:var(--status-holiday);border-color:var(--status-holiday-border)}.badge-weekend{background:var(--status-weekend-bg);color:var(--status-weekend);border-color:var(--status-weekend-border)}.badge-late{background:var(--status-late-bg);color:var(--status-late);border-color:var(--status-late-border)}.badge-pending{background:var(--status-pending-bg);color:var(--status-pending);border-color:var(--status-pending-border)}.badge-approved{background:var(--status-approved-bg);color:var(--status-approved);border-color:var(--status-approved-border)}.badge-rejected{background:var(--status-rejected-bg);color:var(--status-rejected);border-color:var(--status-rejected-border)}.badge-cancelled{background:var(--status-cancelled-bg);color:var(--status-cancelled);border-color:var(--status-cancelled-border)}.badge-completed{background:var(--status-completed-bg);color:var(--status-completed);border-color:var(--status-completed-border)}.badge-draft{background:var(--status-draft-bg);color:var(--status-draft);border-color:var(--status-draft-border)}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--color-primary-subtle);color:var(--color-primary);font-weight:var(--font-weight-semibold);flex-shrink:0;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-sm{width:28px;height:28px;font-size:var(--text-xs)}.avatar-md{width:36px;height:36px;font-size:var(--text-sm)}.avatar-lg{width:48px;height:48px;font-size:var(--text-md)}.tabs{display:flex;border-bottom:1px solid var(--color-border);gap:var(--space-2);overflow-x:auto}.tab-btn{background:none;border:none;border-bottom:2px solid transparent;padding:var(--space-3) var(--space-3);min-height:var(--touch-target-min);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;transition:color var(--motion-fast),border-color var(--motion-fast);white-space:nowrap}.tab-btn:hover{color:var(--color-text)}.tab-btn[aria-selected=true]{color:var(--color-primary);border-bottom-color:var(--color-primary)}.table-scroll{width:100%;overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.table th{text-align:left;padding:var(--space-3);border-bottom:1px solid var(--color-border);color:var(--color-text-muted);font-weight:var(--font-weight-medium);white-space:nowrap}.table td{padding:var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:middle}.table tbody tr{transition:background var(--motion-fast)}.table tbody tr:hover{background:var(--color-bg-subtle)}.table-cards{display:none;flex-direction:column;gap:var(--space-3)}.table-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);background:var(--color-surface);display:flex;flex-direction:column;gap:var(--space-2)}.table-card-row{display:flex;justify-content:space-between;gap:var(--space-3);font-size:var(--text-sm)}.table-card-row dt{color:var(--color-text-muted)}.table-card-row dd{margin:0;font-weight:var(--font-weight-medium);text-align:right}@media (max-width: 767px){.table-scroll{display:none}.table-cards{display:flex}}.pagination{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}.pagination-info{font-size:var(--text-sm);color:var(--color-text-muted)}.pagination-controls{display:flex;gap:var(--space-1)}.pagination-btn{min-width:var(--touch-target-min);min-height:var(--touch-target-min);border:1px solid var(--color-border-strong);background:var(--color-surface);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--text-sm);transition:background var(--motion-fast),border-color var(--motion-fast)}.pagination-btn:hover:not(:disabled){background:var(--color-bg-subtle)}.pagination-btn:disabled{opacity:.45;cursor:not-allowed}.pagination-btn[aria-current=page]{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#10141e73;z-index:var(--z-overlay);display:flex;animation:fadeIn var(--motion-base)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{margin:auto;width:min(560px,calc(100vw - var(--space-5) * 2));max-height:calc(100vh - var(--space-6) * 2);overflow-y:auto;background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--space-5);z-index:var(--z-modal);animation:modalIn var(--motion-base)}@keyframes modalIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}.drawer{margin-left:auto;height:100vh;width:min(420px,100vw);background:var(--color-surface);box-shadow:var(--shadow-lg);padding:var(--space-5);overflow-y:auto;z-index:var(--z-modal);animation:drawerIn var(--motion-base)}@keyframes drawerIn{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:none}}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-4)}.dialog-title{font-size:var(--text-lg);font-weight:var(--font-weight-semibold)}.dialog-close{background:none;border:none;cursor:pointer;color:var(--color-text-muted);min-width:36px;min-height:36px;border-radius:var(--radius-sm)}.dialog-close:hover{background:var(--color-bg-subtle);color:var(--color-text)}.dialog-footer{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-5)}@media (prefers-reduced-motion: reduce){.overlay,.modal,.drawer{animation-duration:1ms}}.toast-region{position:fixed;bottom:var(--space-5);right:var(--space-5);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-2);max-width:min(360px,calc(100vw - var(--space-5) * 2))}.toast{display:flex;align-items:flex-start;gap:var(--space-2);background:var(--color-text);color:var(--color-text-inverse);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:toastIn var(--motion-base);font-size:var(--text-sm)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.toast-success{background:var(--color-primary-active)}.toast-error{background:var(--color-danger-hover)}.toast-warning{background:var(--color-accent-active)}.toast-close{background:none;border:none;color:inherit;cursor:pointer;opacity:.8;margin-left:auto}.toast-close:hover{opacity:1}@media (prefers-reduced-motion: reduce){.toast{animation-duration:1ms}}.tooltip-wrap{position:relative;display:inline-flex}.tooltip-bubble{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:var(--color-text);color:var(--color-text-inverse);font-size:var(--text-xs);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);white-space:nowrap;z-index:var(--z-tooltip);opacity:0;pointer-events:none;transition:opacity var(--motion-fast)}.tooltip-wrap:hover .tooltip-bubble,.tooltip-wrap:focus-within .tooltip-bubble{opacity:1}.skeleton{background:linear-gradient(90deg,var(--color-bg-subtle) 25%,var(--color-surface-sunken) 37%,var(--color-bg-subtle) 63%);background-size:400% 100%;animation:skeletonShimmer 1.4s ease infinite;border-radius:var(--radius-sm)}@keyframes skeletonShimmer{0%{background-position:100% 0}to{background-position:0 0}}@media (prefers-reduced-motion: reduce){.skeleton{animation:none;background:var(--color-bg-subtle)}}.state-block{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-2);padding:var(--space-6) var(--space-4);color:var(--color-text-muted)}.state-block-icon{font-size:28px;opacity:.7}.state-block-title{font-size:var(--text-md);font-weight:var(--font-weight-medium);color:var(--color-text)}.flex-row{display:flex;align-items:center}.stack-2>*+*{margin-top:var(--space-2)}.stack-3>*+*{margin-top:var(--space-3)}.stack-4>*+*{margin-top:var(--space-4)}.cmdk-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0e1680;z-index:var(--z-modal);display:flex;justify-content:center;padding-top:12vh;animation:cmdkFadeIn var(--motion-base)}@keyframes cmdkFadeIn{0%{opacity:0}to{opacity:1}}.cmdk-panel{width:min(560px,calc(100vw - var(--space-5) * 2));max-height:min(420px,60vh);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:cmdkPanelIn var(--motion-base)}@keyframes cmdkPanelIn{0%{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.cmdk-overlay,.cmdk-panel{animation-duration:1ms}}.cmdk-input-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--color-border)}.cmdk-input-icon{color:var(--color-text-subtle);flex-shrink:0}.cmdk-input{flex:1;border:none;background:none;outline:none;font-size:var(--text-md);color:var(--color-text)}.cmdk-input::placeholder{color:var(--color-text-subtle)}.cmdk-kbd{font-family:var(--font-tabular);font-size:var(--text-xs);color:var(--color-text-subtle);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:2px 6px;background:var(--color-bg-subtle)}.cmdk-list{list-style:none;margin:0;padding:var(--space-2);overflow-y:auto}.cmdk-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);color:var(--color-text);transition:background var(--motion-fast)}.cmdk-item svg:first-child{color:var(--color-text-muted);flex-shrink:0}.cmdk-item span{flex:1}.cmdk-item-active{background:var(--color-accent-subtle)}.cmdk-item-active svg:first-child{color:var(--color-accent-active)}.cmdk-enter-hint{color:var(--color-text-subtle);flex-shrink:0}.cmdk-empty{padding:var(--space-5);text-align:center;color:var(--color-text-subtle);font-size:var(--text-sm)}.shell{display:flex;min-height:100vh;background:var(--color-bg)}.shell-sidebar{width:var(--shell-sidebar-width);flex-shrink:0;background:var(--color-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;padding:var(--space-4);gap:var(--space-4);position:sticky;top:0;height:100vh;transition:width var(--motion-base);z-index:var(--z-sidebar)}.shell-collapsed .shell-sidebar{width:var(--shell-sidebar-collapsed-width)}.shell-brand{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:var(--font-weight-semibold);font-size:var(--text-lg);padding:var(--space-1);color:var(--color-primary)}.shell-brand-mark{width:32px;height:32px;border-radius:var(--radius-md);background:var(--color-primary);color:var(--color-text-inverse);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-family:var(--font-display)}.shell-nav{position:relative;display:flex;flex-direction:column;gap:var(--space-1);flex:1;overflow-y:auto}.shell-nav-indicator{position:absolute;left:0;width:3px;border-radius:var(--radius-full);background:var(--color-accent);transition:top var(--motion-base),height var(--motion-base),opacity var(--motion-fast);pointer-events:none}.shell-nav-link{display:flex;align-items:center;gap:var(--space-3);min-height:var(--touch-target-min);padding:0 var(--space-3);border-radius:var(--radius-md);color:var(--color-text-muted);text-decoration:none;font-size:var(--text-sm);font-weight:var(--font-weight-medium);transition:background var(--motion-fast),color var(--motion-fast)}.shell-nav-link:hover{background:var(--color-bg-subtle);color:var(--color-text)}.shell-nav-link-active{background:var(--color-primary-subtle);color:var(--color-primary)}.shell-nav-icon{width:20px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.shell-collapse-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:40px;border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);color:var(--color-text-muted);transition:background var(--motion-fast),color var(--motion-fast)}.shell-collapse-btn:hover{background:var(--color-bg-subtle);color:var(--color-text)}@media (max-width: 1023px){.shell-sidebar{display:none}}.shell-menu-btn{display:none;border:none;background:none;font-size:20px;min-width:var(--touch-target-min);min-height:var(--touch-target-min);cursor:pointer;border-radius:var(--radius-sm)}.shell-menu-btn:hover{background:var(--color-bg-subtle)}@media (max-width: 1023px){.shell-menu-btn{display:inline-flex;align-items:center;justify-content:center}}.shell-mobile-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#10141e73;z-index:var(--z-overlay);display:flex}.shell-mobile-nav{width:min(280px,84vw);background:var(--color-surface);height:100%;padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);animation:shellSlideIn var(--motion-base)}@keyframes shellSlideIn{0%{transform:translate(-12px);opacity:0}to{transform:none;opacity:1}}@media (prefers-reduced-motion: reduce){.shell-mobile-nav{animation-duration:1ms}}.shell-body{flex:1;display:flex;flex-direction:column;min-width:0}.shell-topbar{position:sticky;top:0;height:var(--shell-topbar-height);display:flex;align-items:center;gap:var(--space-4);padding:0 var(--space-5);background:var(--color-surface);border-bottom:1px solid var(--color-border);z-index:var(--z-topbar);box-shadow:none;transition:box-shadow var(--motion-base)}.shell-topbar-elevated{box-shadow:var(--shadow-sm)}.shell-breadcrumb{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);flex:1;min-width:0}.shell-breadcrumb [aria-current=page]{color:var(--color-text);font-weight:var(--font-weight-medium)}.shell-topbar-actions{display:flex;align-items:center;gap:var(--space-2)}.shell-cmdk-trigger{display:flex;align-items:center;gap:var(--space-2);min-height:36px;padding:0 var(--space-3);border:1px solid var(--color-border);background:var(--color-bg-subtle);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--text-sm);cursor:pointer;transition:background var(--motion-fast),border-color var(--motion-fast)}.shell-cmdk-trigger:hover{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-text)}.shell-cmdk-trigger kbd{font-family:var(--font-tabular);font-size:var(--text-xs);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:1px 5px;color:var(--color-text-subtle)}@media (max-width: 767px){.shell-cmdk-trigger span,.shell-cmdk-trigger kbd{display:none}}.shell-icon-btn{min-width:var(--touch-target-min);min-height:var(--touch-target-min);display:inline-flex;align-items:center;justify-content:center;border:none;background:none;border-radius:var(--radius-md);cursor:pointer;color:var(--color-text-muted);transition:background var(--motion-fast),color var(--motion-fast)}.shell-icon-btn:hover{background:var(--color-bg-subtle);color:var(--color-text)}.shell-notif{position:relative}.shell-notif-panel{position:absolute;right:0;top:calc(100% + 8px);width:280px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:var(--z-topbar);animation:shellNotifIn var(--motion-fast)}@keyframes shellNotifIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.shell-notif-panel{animation-duration:1ms}}.shell-notif-header{font-size:var(--text-sm);font-weight:var(--font-weight-semibold);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border)}.shell-notif-empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-6) var(--space-4);color:var(--color-text-subtle);font-size:var(--text-sm)}.shell-profile{position:relative}.shell-profile-btn{display:flex;align-items:center;gap:var(--space-2);border:none;background:none;cursor:pointer;padding:var(--space-1) var(--space-2);border-radius:var(--radius-md);min-height:var(--touch-target-min)}.shell-profile-btn:hover{background:var(--color-bg-subtle)}.shell-profile-name{font-size:var(--text-sm);font-weight:var(--font-weight-medium);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 640px){.shell-profile-name{display:none}}.shell-profile-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:var(--space-2);z-index:var(--z-topbar)}.shell-profile-menu-header{padding:var(--space-2) var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-2)}.shell-profile-menu-item{display:block;width:100%;text-align:left;border:none;background:none;min-height:var(--touch-target-min);padding:0 var(--space-2);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--text-sm)}.shell-profile-menu-item:hover{background:var(--color-bg-subtle)}.shell-main{flex:1;padding:var(--space-5);max-width:1440px;width:100%;margin:0 auto}.shell-main:focus{outline:none}@media (max-width: 640px){.shell-main{padding:var(--space-4)}.shell-topbar{padding:0 var(--space-3)}}.login-page{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;background:var(--color-surface)}.login-brand-panel{position:relative;overflow:hidden;background:radial-gradient(680px 480px at 12% -10%,#b8814a47,#b8814a00 60%),radial-gradient(520px 520px at 105% 105%,#b8814a29,#b8814a00 65%),linear-gradient(160deg,var(--color-primary) 0%,var(--color-primary-active) 100%);color:var(--color-text-inverse);display:flex;align-items:center;padding:var(--space-7)}.login-brand-texture{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:28px 28px;background-position:-4px -4px;-webkit-mask-image:radial-gradient(720px 640px at 30% 35%,#000 0%,transparent 72%);mask-image:radial-gradient(720px 640px at 30% 35%,#000 0%,transparent 72%);pointer-events:none}.login-brand-content{position:relative;max-width:420px}.login-brand-mark{width:52px;height:52px;border-radius:var(--radius-md);background:linear-gradient(155deg,var(--color-accent) 0%,var(--color-accent-active) 100%);color:var(--color-text-inverse);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:var(--font-weight-semibold);font-size:var(--text-xl);margin-bottom:var(--space-5);box-shadow:var(--shadow-md)}.login-brand-title{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-bottom:var(--space-3)}.login-brand-copy{font-family:var(--font-display);font-weight:var(--font-weight-regular);font-size:var(--text-lg);line-height:var(--text-lg-lh);opacity:.92;margin-bottom:var(--space-6)}.login-brand-points{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-3);font-size:var(--text-sm)}.login-brand-points li{padding-left:var(--space-5);position:relative}.login-brand-points li:before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:2px;background:var(--color-accent);transform:rotate(45deg)}.login-form-panel{display:flex;align-items:center;justify-content:center;padding:var(--space-5)}.login-form{width:100%;max-width:380px;display:flex;flex-direction:column;gap:var(--space-4)}.login-form-enter{animation:loginFormEnter var(--motion-slow) ease-out both}@keyframes loginFormEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.login-form-enter{animation:none}}.login-form-header{margin-bottom:var(--space-2)}.login-form-title{font-family:var(--font-display);font-size:var(--text-2xl);margin-bottom:var(--space-1)}.login-form-subtitle{color:var(--color-text-muted);font-size:var(--text-sm);margin:0}.login-error{background:var(--color-danger-subtle);border:1px solid var(--color-danger-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);color:var(--color-danger)}.login-error-heading{font-size:var(--text-sm);margin:0 0 var(--space-1)}.login-error p{margin:0;font-size:var(--text-sm)}.login-form-row{display:flex;justify-content:flex-end;margin-top:calc(var(--space-2) * -1)}.login-forgot-link{font-size:var(--text-sm);color:var(--color-accent-active)}.login-security-note{font-size:var(--text-xs);color:var(--color-text-muted);display:flex;gap:var(--space-2);align-items:flex-start;margin:0;line-height:var(--text-sm-lh)}@media (max-width: 1023px){.login-page{grid-template-columns:1fr}.login-brand-panel{display:none}}.dash-heading{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-5)}.dash-heading h1{font-size:var(--text-2xl)}.dash-heading p{margin:var(--space-1) 0 0;color:var(--color-text-muted);font-size:var(--text-sm)}.dash-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4);margin-bottom:var(--space-5)}@media (max-width: 1023px){.dash-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 480px){.dash-kpi-grid{grid-template-columns:1fr}}.dash-grid{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-5);align-items:start}@media (max-width: 1023px){.dash-grid{grid-template-columns:1fr}}.dash-section-title{font-size:var(--text-md);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.dash-exception-list{display:flex;flex-direction:column;gap:var(--space-3)}.dash-exception-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md)}.dash-exception-row:hover{background:var(--color-bg-subtle)}.dash-exception-main{flex:1;min-width:0}.dash-exception-title{font-weight:var(--font-weight-medium);font-size:var(--text-sm)}.dash-exception-sub{font-size:var(--text-xs);color:var(--color-text-muted)}.dash-quick-actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.today-card{background:linear-gradient(160deg,var(--color-primary-subtle) 0%,var(--color-surface) 70%);border:1px solid var(--color-primary-border)}.today-date{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-1)}.today-status-row{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin:var(--space-3) 0 var(--space-4)}.today-timer{font-size:var(--text-3xl);font-weight:var(--font-weight-bold)}.today-journey{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;font-size:var(--text-sm)}.today-journey-step{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);border:1px solid var(--color-border);color:var(--color-text-muted)}.today-journey-step.done{border-color:var(--status-approved-border);background:var(--status-approved-bg);color:var(--status-approved)}.today-journey-arrow{color:var(--color-text-subtle)}.holiday-list,.payslip-list{display:flex;flex-direction:column;gap:var(--space-3)}.holiday-row,.payslip-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);font-size:var(--text-sm)}.holiday-name{font-weight:var(--font-weight-medium)}.holiday-date{color:var(--color-text-muted);font-size:var(--text-xs)}.leave-balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:var(--space-3)}.leave-balance-item{text-align:center;padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md)}.leave-balance-value{font-size:var(--text-xl);font-weight:var(--font-weight-bold)}.leave-balance-label{font-size:var(--text-xs);color:var(--color-text-muted)}.dash-stagger{animation:dashFadeIn var(--motion-slow) both;animation-delay:calc(var(--stagger-i, 0) * 70ms)}@keyframes dashFadeIn{0%{opacity:0;transform:translateY(var(--motion-translate, 4px))}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.dash-stagger{animation-duration:1ms;animation-delay:0ms}}.dash-card-priority{box-shadow:var(--shadow-md);border-left:3px solid var(--color-accent)}.emp-page{display:flex;flex-direction:column;gap:var(--space-5)}.emp-page__header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap}.emp-page__title{font-family:var(--font-display);font-size:1.5rem;font-weight:700;margin:0}.emp-btn{display:inline-flex;align-items:center;gap:var(--space-2);border-radius:var(--radius-md);border:1px solid transparent;padding:var(--space-2) var(--space-4);font-size:.9rem;font-weight:600;cursor:pointer;transition:background var(--motion-fast),border-color var(--motion-fast),opacity var(--motion-fast);min-height:40px}.emp-btn--primary{background:var(--color-primary);color:#fff}.emp-btn--primary:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.emp-btn--primary:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.emp-btn:active:not(:disabled){transform:translateY(0)}.emp-btn--secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.emp-btn--secondary:hover{background:var(--color-bg)}.emp-btn--danger{background:var(--color-surface);border-color:var(--color-danger);color:var(--color-danger)}.emp-btn--danger:hover{background:#fdf1f0}.emp-toolbar{display:flex;gap:var(--space-4);flex-wrap:wrap;align-items:flex-end;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-xs);transition:box-shadow var(--motion-fast)}.emp-toolbar:focus-within{box-shadow:var(--shadow-sm);border-color:var(--color-accent-border)}.emp-field{display:flex;flex-direction:column;gap:var(--space-1)}.emp-field label{font-size:.8rem;font-weight:600;color:var(--color-text-muted)}.emp-input,.emp-select,.emp-textarea{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-size:.9rem;font-family:var(--font-sans);background:var(--color-surface);color:var(--color-text);min-height:40px}.emp-input,.emp-select,.emp-textarea{transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}.emp-input:focus,.emp-select:focus,.emp-textarea:focus{outline:2px solid var(--color-focus-ring);outline-offset:1px;border-color:var(--color-accent-border)}.emp-input--error,.emp-select--error{border-color:var(--color-danger)}.emp-error-text{color:var(--color-danger);font-size:.78rem}.emp-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.emp-table-wrap{overflow-x:auto}.emp-table{width:100%;border-collapse:collapse;font-size:.9rem}.emp-table th,.emp-table td{text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);white-space:nowrap}.emp-table th{color:var(--color-text-muted);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}.emp-table tbody tr{transition:background var(--motion-fast)}.emp-table tbody tr:hover{background:var(--color-accent-subtle)}.emp-sort-btn{background:none;border:none;cursor:pointer;font:inherit;font-weight:600;color:inherit;padding:0;display:inline-flex;align-items:center;gap:4px}.emp-cards{display:none;flex-direction:column;gap:var(--space-3)}.emp-mini-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);transition:border-color var(--motion-fast),box-shadow var(--motion-fast),transform var(--motion-fast)}.emp-mini-card:hover{border-color:var(--color-accent-border);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.emp-mini-card__row{display:flex;justify-content:space-between;gap:var(--space-3);font-size:.85rem}.emp-mini-card__label{color:var(--color-text-muted)}.emp-mini-card__name{font-weight:700;font-size:1rem}@media (max-width: 768px){.emp-table-wrap{display:none}.emp-cards{display:flex}}.emp-badge{display:inline-flex;align-items:center;gap:4px;padding:2px var(--space-2);border-radius:999px;font-size:.75rem;font-weight:600;border:1px solid transparent}.emp-badge--ACTIVE{background:#e8f7ee;color:var(--color-success);border-color:#bfe9cf}.emp-badge--INACTIVE{background:#fdf3e2;color:var(--color-warning);border-color:#f3dfae}.emp-badge--EXITED{background:#fbeceb;color:var(--color-danger);border-color:#f2c9c6}.emp-pagination{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4);font-size:.85rem;color:var(--color-text-muted)}.emp-empty,.emp-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-7) var(--space-4);color:var(--color-text-muted);text-align:center}.emp-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}@media (max-width: 640px){.emp-form-grid{grid-template-columns:1fr}}.emp-form-section{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5);border-bottom:1px solid var(--color-border)}.emp-form-section:last-child{border-bottom:none}.emp-form-section h2{margin:0;font-family:var(--font-display);font-size:1.15rem;display:flex;align-items:center;gap:var(--space-2)}.emp-form-section h2:before{content:"";width:4px;height:1.1em;border-radius:var(--radius-full);background:var(--color-accent);display:inline-block}.emp-form-section--compensation{background:var(--color-accent-subtle);border:1px solid var(--color-accent-border);border-radius:var(--radius-lg);margin:0 var(--space-5) var(--space-5);padding:var(--space-5)}.emp-form-section--compensation:last-child{border-bottom:1px solid var(--color-accent-border)}.emp-form-section--compensation h2:before{background:var(--color-accent-active)}.emp-compensation-note{display:flex;align-items:center;gap:var(--space-2);margin:0;font-size:.8rem;color:var(--color-accent-active)}.emp-form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-5)}.emp-banner{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:.88rem;border:1px solid transparent;animation:emp-banner-in var(--motion-base)}@keyframes emp-banner-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.emp-banner{animation:none}}.emp-banner--success{background:#e8f7ee;color:var(--color-success);border-color:#bfe9cf}.emp-banner--error{background:#fbeceb;color:var(--color-danger);border-color:#f2c9c6}.emp-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-5)}@media (max-width: 640px){.emp-detail-grid{grid-template-columns:1fr}}.emp-detail-item{display:flex;flex-direction:column;gap:2px}.emp-detail-item__label{font-size:.78rem;color:var(--color-text-muted);font-weight:600}.emp-detail-item__value{font-size:.95rem}.emp-link-btn{background:none;border:none;color:var(--color-primary);cursor:pointer;font:inherit;padding:0;text-decoration:underline}.dir-page{display:flex;flex-direction:column;gap:var(--space-5)}.dir-page__title{font-family:var(--font-display);font-size:1.5rem;font-weight:700;margin:0}.dir-page__subtitle{margin:var(--space-1) 0 0;color:var(--color-text-muted);font-size:.9rem}.dir-toolbar{display:flex;gap:var(--space-4);flex-wrap:wrap;align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-xs)}.dir-field{min-width:200px}.dir-field--search{flex:1 1 260px}.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-4)}.dir-card{display:flex;gap:var(--space-3);align-items:flex-start;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-xs);transition:border-color var(--motion-fast),box-shadow var(--motion-fast),transform var(--motion-fast)}.dir-card:hover{border-color:var(--color-accent-border);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.dir-card__body{display:flex;flex-direction:column;gap:2px;min-width:0}.dir-card__name{font-weight:700;font-size:1rem;color:var(--color-text)}.dir-card__designation{font-size:.85rem;color:var(--color-text-muted)}.dir-card__department{font-size:.8rem;color:var(--color-text-subtle)}.dir-card__phone{display:inline-flex;align-items:center;gap:var(--space-1);margin-top:var(--space-2);font-size:.85rem;font-weight:600;color:var(--color-accent-active);text-decoration:none}.dir-card__phone:hover{text-decoration:underline}@media (max-width: 768px){.dir-grid{grid-template-columns:1fr}}.att-page{display:flex;flex-direction:column;gap:var(--space-6);max-width:1080px}.att-page>h1{font-size:var(--text-2xl)}.att-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-5)}.att-checkin-card{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4)}.att-checkin-left h2{font-size:var(--text-lg);margin-bottom:var(--space-1)}.att-checkin-left p{color:var(--color-text-muted);font-size:var(--text-sm);margin:0}.att-status-row{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2)}.att-status-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;background:var(--color-text-subtle)}.att-status-dot--checked-in{background:var(--status-present);animation:att-pulse 2.2s ease-in-out infinite}.att-status-dot--complete{background:var(--color-info)}@keyframes att-pulse{0%,to{box-shadow:0 0 #1a8a4b73}50%{box-shadow:0 0 0 6px #1a8a4b00}}@media (prefers-reduced-motion: reduce){.att-status-dot--checked-in{animation:none}}.att-timer-wrap{display:flex;align-items:baseline;gap:var(--space-2);min-width:140px}.att-timer{font-family:var(--font-tabular);font-size:var(--text-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text);animation:att-timer-fade-in var(--motion-slow) ease}.att-timer-label{font-size:var(--text-xs);color:var(--color-text-subtle)}@keyframes att-timer-fade-in{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.att-timer{animation:none}}.att-action-btn{position:relative;overflow:hidden;min-width:132px;transition:background var(--motion-base),border-color var(--motion-base),color var(--motion-base),transform var(--motion-fast),min-width var(--motion-base)}.att-action-btn:active:not(:disabled){transform:scale(.97)}.att-action-btn .att-action-btn-icon{display:inline-flex;transition:transform var(--motion-base) ease}.att-action-btn:active:not(:disabled) .att-action-btn-icon{transform:rotate(-14deg) scale(.9)}.att-day-complete{color:var(--color-text-muted);font-size:var(--text-sm);display:inline-flex;align-items:center;gap:var(--space-1)}.att-filters{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:flex-end}.att-field{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-sm)}.att-field label{color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.att-field input,.att-field select{min-height:var(--touch-target-min);padding:0 var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border-strong);background:var(--color-surface)}.att-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.att-table th{text-align:left;padding:var(--space-2) var(--space-3);color:var(--color-text-muted);font-weight:var(--font-weight-medium);border-bottom:1px solid var(--color-border)}.att-table td{padding:var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:middle}.att-table-wrap{overflow-x:auto}.att-table tbody tr{transition:background var(--motion-fast)}.att-table tbody tr:hover,.att-table tbody tr:focus-within{background:var(--color-bg-subtle)}.att-row-exception{background:color-mix(in srgb,var(--status-late-bg) 45%,transparent)}.att-row-exception:hover{background:var(--status-late-bg)}.att-empty,.att-loading,.att-error{padding:var(--space-6);text-align:center;color:var(--color-text-muted)}.att-error{color:var(--color-danger)}.att-cards{display:none;flex-direction:column;gap:var(--space-3)}.att-row-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);transition:box-shadow var(--motion-fast),border-color var(--motion-fast)}.att-row-card:focus-within,.att-row-card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-sm)}.att-row-card--exception{background:color-mix(in srgb,var(--status-late-bg) 40%,transparent);border-color:var(--status-late-border)}.att-row-card-top{display:flex;justify-content:space-between;align-items:center}.att-exception-note{display:inline-flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs);color:var(--status-late);font-weight:var(--font-weight-medium)}@media (max-width: 767px){.att-table-wrap{display:none}.att-cards{display:flex}}.att-calendar{display:flex;flex-direction:column;gap:var(--space-2)}.att-cal-weekdays,.att-cal-row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--space-2)}.att-cal-grid{display:flex;flex-direction:column;gap:var(--space-2)}.att-cal-weekday{text-align:center;font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);padding-bottom:var(--space-1)}.att-cal-cell-wrap{position:relative}.att-cal-cell{width:100%;min-height:64px;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-1);padding:var(--space-2);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;transition:border-color var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast);font:inherit;text-align:left}.att-cal-cell:hover,.att-cal-cell:focus-visible{border-color:var(--color-border-strong);box-shadow:var(--shadow-sm)}.att-cal-cell--empty{border:none;background:transparent;cursor:default;min-height:64px}.att-cal-cell--today{border-color:var(--color-primary);box-shadow:0 0 0 1px var(--color-primary)}.att-cal-cell-daynum{font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text)}.att-cal-cell-status{font-size:var(--text-sm);line-height:1}.att-cal-cell-hours{font-family:var(--font-tabular);font-size:var(--text-xs);color:var(--color-text-muted)}.att-cal-cell-update-dot{position:absolute;top:var(--space-2);right:var(--space-2);width:6px;height:6px;border-radius:50%;background:var(--color-accent)}.att-cal-cell--present{background:var(--status-present-bg);border-color:var(--status-present-border)}.att-cal-cell--absent{background:var(--status-absent-bg);border-color:var(--status-absent-border)}.att-cal-cell--half-day{background:var(--status-half-day-bg);border-color:var(--status-half-day-border)}.att-cal-cell--leave{background:var(--status-leave-bg);border-color:var(--status-leave-border)}.att-cal-cell--holiday{background:var(--status-holiday-bg);border-color:var(--status-holiday-border)}.att-cal-cell--weekend{background:var(--status-weekend-bg);border-color:var(--status-weekend-border)}.att-cal-cell--late{background:var(--status-late-bg);border-color:var(--status-late-border)}.att-cal-inline-detail{position:absolute;z-index:5;top:calc(100% + var(--space-1));left:0;min-width:220px;background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-md, var(--shadow-sm));padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-sm)}.att-cal-cell-wrap .tooltip-bubble{white-space:normal;width:max-content;max-width:240px;text-align:left;bottom:auto;top:calc(100% + 6px);left:0;transform:none}.att-cal-detail{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-sm);max-width:240px}.att-cal-detail-date{font-weight:var(--font-weight-medium);font-family:var(--font-tabular)}.att-cal-detail-row{color:var(--color-text-muted)}.att-cal-detail-update{color:var(--color-text)}@media (max-width: 767px){.att-cal-cell{min-height:52px;padding:var(--space-1)}.att-cal-cell-daynum{font-size:var(--text-xs)}.att-cal-cell-hours{font-size:10px}}@media (max-width: 480px){.att-cal-weekday{font-size:10px}.att-cal-cell{min-height:44px}.att-cal-cell-status{font-size:var(--text-xs)}}.att-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-4)}.du-page{display:flex;flex-direction:column;gap:var(--space-6);max-width:1080px}.du-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-5)}.du-composer-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--space-3);flex-wrap:wrap;gap:var(--space-2)}.du-textarea{width:100%;min-height:160px;resize:vertical;padding:var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border-strong);font-family:var(--font-sans);font-size:var(--text-md);line-height:var(--text-md-lh);transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}.du-textarea:focus{outline:none;border-color:var(--color-accent-border);box-shadow:0 0 0 3px var(--color-accent-subtle)}.du-textarea:disabled{background:var(--color-bg-subtle);color:var(--color-text-muted)}.du-composer-footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-3);flex-wrap:wrap;gap:var(--space-3)}.du-save-status{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);min-height:20px}.du-save-spinner{width:13px;height:13px;border-radius:50%;border:2px solid var(--color-border-strong);border-top-color:var(--color-accent);animation:du-spin .7s linear infinite;flex-shrink:0}@keyframes du-spin{to{transform:rotate(360deg)}}.du-save-check{width:16px;height:16px;border-radius:50%;background:var(--color-success-subtle);color:var(--color-success);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;animation:du-check-pop .2s ease}@keyframes du-check-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.du-save-status--error{color:var(--color-danger)}@media (prefers-reduced-motion: reduce){.du-save-spinner,.du-save-check{animation:none}}.du-char-count{font-size:var(--text-xs);color:var(--color-text-subtle)}.du-btn{min-height:var(--touch-target-min);padding:0 var(--space-5);border-radius:var(--radius-md);border:none;background:var(--color-primary);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold);cursor:pointer}.du-btn:hover:not(:disabled){background:var(--color-primary-hover)}.du-btn:disabled{opacity:.6;cursor:not-allowed}.du-error-text{color:var(--color-danger);font-size:var(--text-sm)}.du-filters{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:flex-end;margin-bottom:var(--space-4)}.du-field{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-sm)}.du-field label{color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.du-field input,.du-field select{min-height:var(--touch-target-min);padding:0 var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border-strong);background:var(--color-surface)}.du-feed{display:flex;flex-direction:column;gap:var(--space-3)}.du-feed-item{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}.du-feed-item:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-xs)}.du-feed-item-head{display:flex;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-2);flex-wrap:wrap}.du-feed-date{font-weight:var(--font-weight-semibold)}.du-feed-summary{white-space:pre-wrap;font-size:var(--text-sm);color:var(--color-text);line-height:var(--text-sm-lh)}.du-missing{color:var(--color-text-subtle);font-style:italic}.du-empty,.du-loading,.du-error{padding:var(--space-6);text-align:center;color:var(--color-text-muted)}.du-error{color:var(--color-danger)}.leaves-page{display:flex;flex-direction:column;gap:var(--space-5)}.leaves-page__title{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);margin:0}.leaves-page__subtitle{margin:var(--space-1) 0 0;color:var(--color-text-muted);font-size:var(--text-sm)}.leaves-balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4)}.leaves-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}@media (max-width: 640px){.leaves-form-grid{grid-template-columns:1fr}}.leaves-halfday-toggle{display:flex;align-items:center;gap:var(--space-2);min-height:var(--touch-target-min);font-size:var(--text-sm)}.leaves-preview-card{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-subtle);padding:var(--space-4)}.leaves-preview-hint{margin:0;color:var(--color-text-muted);font-size:var(--text-sm)}.leaves-preview-error{margin:var(--space-2) 0 0;color:var(--color-danger);font-size:var(--text-sm)}.leaves-preview-body{display:flex;flex-direction:column;gap:var(--space-2)}.leaves-preview-row{display:flex;justify-content:space-between;font-size:var(--text-sm)}.leaves-preview-row--muted{color:var(--color-text-muted)}.leaves-preview-danger{color:var(--color-danger)}.leaves-form-actions{display:flex;justify-content:flex-end}.leaves-banner{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);border:1px solid transparent;margin:0}.leaves-banner--success{background:var(--color-success-subtle);color:var(--color-success);border-color:var(--color-success-border)}.leaves-banner--error{background:var(--color-danger-subtle);color:var(--color-danger);border-color:var(--color-danger-border)}.leaves-history-card{padding:var(--space-4) var(--space-5)}.leaves-history-card__actions{margin-top:var(--space-3);display:flex;justify-content:flex-end}.leaves-reason{color:var(--color-text-muted);font-size:var(--text-sm);font-style:italic;margin:var(--space-2) 0 0}.leaves-timeline{display:flex;align-items:center;gap:var(--space-3);margin-top:var(--space-3);font-size:var(--text-xs);color:var(--color-text-muted)}.leaves-timeline-step{display:flex;align-items:center;gap:var(--space-1)}.leaves-timeline-dot{width:10px;height:10px;border-radius:50%;background:var(--color-border-strong);display:inline-block}.leaves-timeline-dot--active{background:var(--color-primary)}.leaves-timeline--terminal{gap:var(--space-2)}.leaves-timeline-dot--cancelled{background:var(--status-cancelled)}.leaves-timeline-dot--rejected{background:var(--status-rejected)}.leaves-toolbar{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:flex-end;max-width:260px}.leaves-muted{color:var(--color-text-muted);font-size:var(--text-xs)}.leaves-review-actions{display:flex;gap:var(--space-2)}.leaves-review-inline{display:flex;flex-direction:column;gap:var(--space-2);min-width:220px}.leaves-review-inline__actions{display:flex;gap:var(--space-2)}.leaves-queue-row{display:inline-flex;border-radius:var(--radius-sm);padding:var(--space-1) var(--space-1);margin:calc(var(--space-1) * -1);transition:background var(--motion-slow)}.leaves-queue-row--flash-approved{animation:leaves-row-flash-approved 1.4s ease-out}.leaves-queue-row--flash-rejected{animation:leaves-row-flash-rejected 1.4s ease-out}@keyframes leaves-row-flash-approved{0%{background:var(--status-approved-bg)}to{background:transparent}}@keyframes leaves-row-flash-rejected{0%{background:var(--status-rejected-bg)}to{background:transparent}}@media (prefers-reduced-motion: reduce){.leaves-queue-row--flash-approved,.leaves-queue-row--flash-rejected{animation:none}}.leaves-status-transition{display:inline-flex;transition:opacity var(--motion-base),transform var(--motion-base)}.leaves-status-transition.leaves-status-transition--enter{animation:leaves-badge-in var(--motion-base) ease}@keyframes leaves-badge-in{0%{opacity:0;transform:translateY(-3px) scale(.96)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.leaves-status-transition.leaves-status-transition--enter{animation:none}}.leaves-history-card--enter{animation:leaves-card-in var(--motion-slow) ease}@keyframes leaves-card-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.leaves-history-card--enter{animation:none}}.leaves-balance-value{font-family:var(--font-tabular);font-variant-numeric:tabular-nums}.leaves-confirmation-heading{outline:none}.payroll-page{padding:var(--space-5);max-width:1200px;margin:0 auto}.payroll-header h1{margin:0;font-family:var(--font-display)}.payroll-subtitle{color:var(--color-text-muted);margin-top:var(--space-1)}.payroll-toast{margin:var(--space-4) 0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);animation:payroll-toast-in var(--motion-base)}@keyframes payroll-toast-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.payroll-toast--success{border-color:var(--color-success);color:var(--color-success)}.payroll-toast--error{border-color:var(--color-danger);color:var(--color-danger)}.payroll-layout{display:grid;grid-template-columns:280px 1fr;gap:var(--space-5);align-items:start}@media (max-width: 1024px){.payroll-layout{grid-template-columns:1fr}}.payroll-sidebar{display:flex;flex-direction:column;gap:var(--space-4);position:sticky;top:var(--space-4)}.payroll-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);margin-bottom:var(--space-4);box-shadow:var(--shadow-sm)}.payroll-card h2,.payroll-card h3{margin-top:0;font-family:var(--font-display)}.payroll-card--warning{border-color:var(--color-warning-border);background:var(--color-warning-subtle)}.payroll-card--warning h3{display:flex;align-items:center;gap:var(--space-2);color:var(--color-warning)}.payroll-card--warning h3:before{content:"";width:10px;height:10px;border-radius:var(--radius-full);background:var(--color-warning);flex-shrink:0}.payroll-anomaly-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.payroll-anomaly-item{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-warning-border);border-left:4px solid var(--color-warning);border-radius:var(--radius-sm);font-size:var(--text-sm);animation:payroll-anomaly-in var(--motion-base) both}.payroll-anomaly-item--danger{border-color:var(--color-danger-border);border-left-color:var(--color-danger)}.payroll-anomaly-icon{flex-shrink:0;width:22px;height:22px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;background:var(--color-warning-subtle);color:var(--color-warning)}.payroll-anomaly-item--danger .payroll-anomaly-icon{background:var(--color-danger-subtle);color:var(--color-danger)}@keyframes payroll-anomaly-in{0%{opacity:0;transform:translate(-6px)}to{opacity:1;transform:translate(0)}}.payroll-form-row{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-3)}.payroll-form-row label{font-size:.85rem;color:var(--color-text-muted)}.payroll-form-row select,.payroll-form-row input{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);font-size:1rem;min-height:44px}.btn{border:none;border-radius:var(--radius-sm);padding:var(--space-2) var(--space-4);min-height:44px;font-size:.95rem;cursor:pointer;transition:background var(--motion-fast),opacity var(--motion-fast),transform var(--motion-fast),box-shadow var(--motion-fast);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2)}.btn:active:not(:disabled){transform:translateY(1px)}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse)}.btn-secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-subtle);border-color:var(--color-border-strong)}.btn-danger{background:var(--color-danger);color:var(--color-text-inverse)}.btn-danger:hover:not(:disabled){background:var(--color-danger-hover)}.btn-approve{background:linear-gradient(135deg,var(--color-accent),var(--color-accent-hover));color:var(--color-text-inverse);box-shadow:var(--shadow-sm);font-weight:var(--font-weight-semibold);letter-spacing:.01em}.btn-approve:hover:not(:disabled){background:linear-gradient(135deg,var(--color-accent-hover),var(--color-accent-active));box-shadow:var(--shadow-md)}.btn-approve:disabled{background:var(--color-accent);opacity:.75}.btn-spinner{width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:btn-spin .7s linear infinite;flex-shrink:0}@keyframes btn-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.btn-spinner{animation:none;border-top-color:#fff6}}.payroll-run-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.payroll-run-item{width:100%;display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg);cursor:pointer;min-height:44px;text-align:left}.payroll-run-item{transition:border-color var(--motion-fast),background var(--motion-fast),transform var(--motion-fast)}.payroll-run-item:hover{border-color:var(--color-accent-border);transform:translate(2px)}.payroll-run-item.is-selected{border-color:var(--color-primary);background:var(--color-primary-subtle)}.status-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.75rem;font-weight:600}.payroll-empty{background:var(--color-surface);border:1px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-6);text-align:center;color:var(--color-text-muted)}.payroll-run-title{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.payroll-muted{color:var(--color-text-muted);font-size:.9rem}.payroll-ok-text{color:var(--color-success)}.payroll-error-text{color:var(--color-danger);font-weight:600}.payroll-exception{background:var(--color-warning-subtle);border:1px solid var(--color-warning-border);border-left:4px solid var(--color-warning);border-radius:var(--radius-sm);padding:var(--space-3);margin:var(--space-3) 0}.payroll-table-wrap{overflow-x:auto}.payroll-table{width:100%;border-collapse:collapse}.payroll-table th,.payroll-table td{text-align:left;padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border)}.payroll-table tbody tr{transition:background var(--motion-fast)}.payroll-table tbody tr:hover{background:var(--color-bg-subtle)}.payroll-table tr.is-anomalous td{background:var(--color-danger-subtle);color:var(--color-danger);position:relative}.payroll-table tr.is-anomalous td:first-child{border-left:3px solid var(--color-danger)}.payroll-export{margin-top:var(--space-3)}.payroll-sticky-summary{position:sticky;bottom:var(--space-4);display:flex;gap:var(--space-5);align-items:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-md);flex-wrap:wrap}.payroll-summary-label{display:block;font-size:.75rem;color:var(--color-text-muted)}.payroll-sticky-summary strong.tabular-nums{font-size:var(--text-lg)}.payroll-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#12213a8c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:var(--space-4);z-index:var(--z-modal);animation:payroll-fade-in var(--motion-base)}@keyframes payroll-fade-in{0%{opacity:0}to{opacity:1}}.payroll-modal{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-6);max-width:480px;width:100%;box-shadow:var(--shadow-lg);border-top:4px solid var(--color-accent);animation:payroll-modal-in var(--motion-slow)}@keyframes payroll-modal-in{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){.payroll-modal-backdrop,.payroll-modal{animation:none}}.payroll-modal--locked{pointer-events:none;opacity:.85}.payroll-modal h2{font-family:var(--font-display)}.payroll-modal-lockline{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-3)}.payroll-modal--success{border-top-color:var(--color-success);text-align:center}.payroll-success-icon{width:56px;height:56px;margin:0 auto var(--space-4);border-radius:var(--radius-full);background:var(--color-success-subtle);color:var(--color-success);display:flex;align-items:center;justify-content:center;font-size:28px;animation:payroll-success-pop var(--motion-slow)}@keyframes payroll-success-pop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}to{transform:scale(1)}}@media (prefers-reduced-motion: reduce){.payroll-success-icon{animation:none}}.payroll-reference{margin:var(--space-4) 0;padding:var(--space-3) var(--space-4);background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:2px}.payroll-reference-label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.payroll-reference-value{font-family:var(--font-tabular);font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}.payroll-confirm-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin:var(--space-4) 0}.payroll-confirm-totals dt{font-size:.75rem;color:var(--color-text-muted)}.payroll-confirm-totals dd{margin:0;font-weight:700;font-size:1.1rem}.payroll-modal label{display:block;margin-bottom:var(--space-2)}.payroll-modal input{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);min-height:44px;font-size:1rem}.payroll-modal-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-5)}.payslips-page{padding:var(--space-5);max-width:720px;margin:0 auto}.payslips-header h1{margin:0}.payslips-subtitle{color:var(--color-text-muted);margin-top:var(--space-1)}.payslip-list{list-style:none;margin:var(--space-5) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}.payslip-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow var(--motion-fast),border-color var(--motion-fast)}.payslip-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-border-strong)}.payslip-skeleton{height:64px;background:linear-gradient(90deg,var(--color-bg) 25%,#eef0f4 37%,var(--color-bg) 63%);background-size:400% 100%;animation:payslip-shimmer 1.4s ease infinite}@keyframes payslip-shimmer{0%{background-position:100% 50%}to{background-position:0 50%}}.payslip-card-header{width:100%;display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-4);min-height:44px;background:none;border:none;cursor:pointer;text-align:left;font-size:1rem;color:var(--color-text);transition:background var(--motion-fast)}.payslip-card-header:hover{background:var(--color-bg-subtle)}.payslip-card-header:after{content:"";width:9px;height:9px;border-right:2px solid var(--color-text-subtle);border-bottom:2px solid var(--color-text-subtle);transform:rotate(45deg);transition:transform var(--motion-fast);flex-shrink:0;margin-left:var(--space-2)}.payslip-card-header[aria-expanded=true]:after{transform:rotate(-135deg)}.payslip-card-header>div:first-child{display:flex;flex-direction:column;gap:var(--space-1)}.payslip-net{font-weight:700;font-size:1.1rem;font-family:var(--font-tabular)}.status-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.75rem;font-weight:600;width:fit-content}.status-badge--draft{background:var(--status-draft-bg);color:var(--status-draft)}.status-badge--reviewed{background:var(--color-info-subtle);color:var(--color-info)}.status-badge--approved,.status-badge--paid{background:var(--status-approved-bg);color:var(--status-approved)}.btn{border:none;border-radius:var(--radius-sm);padding:var(--space-2) var(--space-4);min-height:44px;font-size:.95rem;cursor:pointer;transition:background var(--motion-fast),opacity var(--motion-fast)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.payslip-details-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--motion-slow)}.payslip-details-wrap.is-expanded{grid-template-rows:1fr}.payslip-details-inner{overflow:hidden}.payslip-details{padding:0 var(--space-4) var(--space-4);border-top:1px solid var(--color-border)}@media (prefers-reduced-motion: reduce){.payslip-details-wrap{transition:none}}.payslip-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin:var(--space-3) 0}.payslip-breakdown dt{font-size:.75rem;color:var(--color-text-muted)}.payslip-breakdown dd{margin:0;font-weight:600}.payslip-net-highlight{color:var(--color-success)}.payslip-error-text{color:var(--color-danger);margin-top:var(--space-2)}.payslips-empty{margin-top:var(--space-6);text-align:center;color:var(--color-text-muted);background:var(--color-surface);border:1px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-6)}@media print{.payslip-card-header,.btn{display:none}.payslip-details{border:none;padding:0}}