:root{--bg: #f5f7fb;--bg-elev-1: #ffffff;--bg-elev-2: #f0f3f9;--bg-elev-3: #e4eaf3;--border: #d8dfeb;--border-soft: #e8ecf3;--text: #1f2530;--text-dim: #4b5567;--text-mute: #7a8294;--c-blue: #2563eb;--c-indigo: #4f46e5;--c-purple: #8b5cf6;--c-cyan: #06b6d4;--c-teal: #10b981;--c-amber: #f59e0b;--c-rose: #f43f5e;--accent: var(--c-indigo);--accent-hover: #4338ca;--accent-soft: rgba(79, 70, 229, .1);--grad-brand: linear-gradient(135deg, #2563eb 0%, #4f46e5 50%, #8b5cf6 100%);--grad-brand-2: linear-gradient(135deg, #2563eb, #8b5cf6);--success-soft: rgba(16, 185, 129, .12);--warn-soft: rgba(245, 158, 11, .12);--danger-soft: rgba(244, 63, 94, .12);--radius: 8px;--radius-sm: 6px;--radius-lg: 12px;--shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 12px rgba(15, 23, 42, .06);--shadow-lg: 0 10px 30px rgba(15, 23, 42, .12);--transition: .15s ease}*{box-sizing:border-box}html,body{background:var(--bg)}body{margin:0;font:14px/1.5 -apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased}a{color:var(--c-blue);text-decoration:none}a:hover{color:var(--accent-hover);text-decoration:underline}h1,h2,h3{font-weight:700;letter-spacing:-.01em;color:var(--text)}h2{font-size:22px;margin:0 0 18px}h3{font-size:16px}code{background:var(--bg-elev-2);padding:1px 6px;border-radius:4px;font-size:12px;font-family:SF Mono,Menlo,Monaco,Consolas,monospace;color:var(--c-indigo);border:1px solid var(--border-soft)}pre{background:var(--bg-elev-2)!important;color:var(--text-dim);border:1px solid var(--border-soft);border-radius:var(--radius-sm)}::selection{background:var(--accent-soft);color:var(--text)}.layout{display:flex;min-height:100vh}.sidebar{width:240px;background:var(--bg-elev-1);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:20px 0;position:sticky;top:0;height:100vh}.sidebar h1{flex-shrink:0;font-size:22px;font-weight:800;padding:0 20px 16px;margin:0;border-bottom:1px solid var(--border-soft);letter-spacing:.04em;background:var(--grad-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sidebar nav{display:flex;flex-direction:column;margin-top:10px;flex:1 1 0;min-height:0;overflow-y:auto;padding:0 8px;gap:2px}.sidebar nav a{color:var(--text-dim);padding:8px 14px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;transition:all var(--transition)}.sidebar nav a:hover{background:var(--bg-elev-2);color:var(--text);text-decoration:none}.sidebar nav a.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.main{flex:1;padding:24px 32px;overflow:auto;background:var(--bg)}table{width:100%;border-collapse:separate;border-spacing:0;background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--border-soft)}th{background:var(--bg-elev-2);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-mute)}tbody tr{transition:background var(--transition)}tbody tr:hover{background:var(--bg-elev-2)}tr:last-child td{border-bottom:none}td strong{color:var(--accent);font-weight:600}.badge{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600;border:1px solid transparent}.badge.ok{background:var(--success-soft);color:var(--c-teal);border-color:#10b9814d}.badge.warn{background:var(--warn-soft);color:var(--c-amber);border-color:#f59e0b4d}.badge.bad{background:var(--danger-soft);color:var(--c-rose);border-color:#f43f5e4d}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap}.toolbar label{font-size:12px;color:var(--text-mute);font-weight:600}button,.upload-label{background:var(--accent);color:#fff;border:0;padding:8px 16px;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;font-size:13px;font-family:inherit;transition:all var(--transition);display:inline-flex;align-items:center;gap:6px;box-shadow:0 1px 2px #4f46e526}button:hover,.upload-label:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 12px #4f46e540}button:active{transform:translateY(0)}button:disabled{background:var(--bg-elev-3);color:var(--text-mute);cursor:not-allowed;transform:none;box-shadow:none}button.secondary{background:var(--bg-elev-1);color:var(--text);border:1px solid var(--border);box-shadow:none}button.secondary:hover{background:var(--bg-elev-2);border-color:var(--accent)}button.danger-btn{background:var(--c-rose);color:#fff}button.danger-btn:hover{background:#e11d48;box-shadow:0 4px 12px #f43f5e40}select,input,textarea{padding:8px 11px;background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius-sm);font:inherit;color:var(--text);transition:all var(--transition)}select:focus,input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}input::placeholder,textarea::placeholder{color:var(--text-mute)}.card{background:var(--bg-elev-1);padding:20px;border-radius:var(--radius);border:1px solid var(--border);transition:all var(--transition);box-shadow:var(--shadow)}.card:hover{box-shadow:var(--shadow-lg)}.card strong{color:var(--text)}.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:24px}.metric{font-size:28px;font-weight:700;color:var(--accent);margin-top:4px;letter-spacing:-.02em}.metric-label{color:var(--text-mute);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:600}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(15,23,42,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius-lg);width:480px;max-width:92vw;max-height:90vh;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);overflow:hidden}.modal h3{margin:0;padding:22px 26px 14px;font-size:17px;color:var(--text);flex-shrink:0;border-bottom:1px solid var(--border-soft)}.modal form{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;padding:18px 26px 0}.modal form>.modal-actions{position:sticky;bottom:0;margin:18px -26px 0;padding:14px 26px;background:var(--bg-elev-2);border-top:1px solid var(--border-soft)}.field{margin-bottom:14px;display:flex;flex-direction:column;gap:5px}.field label{font-size:11px;font-weight:700;color:var(--text-mute);text-transform:uppercase;letter-spacing:.06em}.field input,.field select,.field textarea{width:100%;padding:9px 11px}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.row-detail{background:var(--bg-elev-2)}.row-detail td{padding:14px 20px;border-bottom:1px solid var(--border)!important}.history-table{background:var(--bg-elev-1);border:1px solid var(--border);box-shadow:none}.icon-btn{background:transparent;color:var(--text-mute);padding:3px 10px;box-shadow:none;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.05em;border:1px solid var(--border);border-radius:999px}.icon-btn:hover{background:var(--bg-elev-2);color:var(--accent);border-color:var(--accent);transform:none;box-shadow:none}.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#eef2ff 0%,#f5f3ff 50%,#fef2f2 100%)}.login-card{background:var(--bg-elev-1);border:1px solid var(--border);padding:36px 32px;border-radius:var(--radius-lg);width:380px;max-width:92vw;box-shadow:var(--shadow-lg)}.login-card h1{margin:0 0 6px;font-size:26px;font-weight:800;background:var(--grad-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.login-hint{margin-top:20px;font-size:12px;color:var(--text-dim);background:var(--bg-elev-2);padding:12px;border-radius:var(--radius-sm);border:1px solid var(--border-soft);line-height:1.8}.login-hint code{background:var(--bg-elev-3);color:var(--accent)}.user-pill{padding:14px 16px;border-top:1px solid var(--border-soft);margin-top:8px;font-size:12px;color:var(--text-dim);background:var(--bg-elev-2);flex-shrink:0}.user-pill strong{display:block;color:var(--text);font-size:13px}.user-pill .role{color:var(--accent);text-transform:uppercase;letter-spacing:.06em;font-size:10px;margin:2px 0 8px;font-weight:700}.user-pill button{width:100%;background:var(--bg-elev-1);color:var(--text-dim);border:1px solid var(--border);font-size:12px;padding:6px;font-weight:500;box-shadow:none}.user-pill button:hover{background:var(--bg-elev-3);color:var(--text);border-color:var(--c-rose)}.cutoff-banner{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:18px;background:var(--success-soft);color:#047857;border:1px solid rgba(16,185,129,.3);font-size:13px}.cutoff-banner.locked{background:var(--danger-soft);color:#be123c;border-color:#f43f5e4d}.cutoff-banner input{padding:5px 8px}.file-input{display:none}.upload-label{display:inline-flex;background:var(--accent);color:#fff!important;font-weight:600;letter-spacing:.01em;padding:8px 16px;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);box-shadow:0 1px 2px #4f46e526}.upload-label:hover{background:var(--accent-hover);color:#fff!important;transform:translateY(-1px);box-shadow:0 4px 12px #4f46e540}.last-upload-info{background:var(--accent-soft);border:1px solid rgba(79,70,229,.25);border-radius:var(--radius-sm);padding:10px 14px;margin-bottom:16px;font-size:12px;color:var(--text-dim);display:flex;align-items:center;gap:8px}.last-upload-info strong{color:var(--accent)}@media (max-width: 768px){.layout{flex-direction:column}.sidebar{width:100%;height:auto;position:relative;padding:12px 0;border-right:0;border-bottom:1px solid var(--border)}.sidebar h1{padding:0 16px 8px;font-size:18px}.sidebar nav{flex-direction:row;flex-wrap:wrap;padding:0 8px;overflow-x:auto}.sidebar nav a{padding:6px 12px;font-size:12px;white-space:nowrap}.user-pill{display:flex;justify-content:space-between;align-items:center;gap:12px}.user-pill button{width:auto;padding:5px 10px}.main{padding:16px}table{font-size:12px;display:block;overflow-x:auto;white-space:nowrap}.modal{width:95vw}.grid-cards{grid-template-columns:repeat(2,1fr);gap:10px}.metric{font-size:22px}h2{font-size:18px}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px;border:2px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:var(--text-mute)}.dashboard-fit{display:flex;flex-direction:column;height:calc(100vh - 48px);min-height:0}.dashboard-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:14px;flex-shrink:0}.metric-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-bottom:14px;flex-shrink:0}.mini-card{background:var(--bg-elev-1);border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:10px 12px;box-shadow:var(--shadow);transition:all var(--transition)}.mini-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.dashboard-list{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.dashboard-list-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border-soft);background:var(--bg-elev-2);flex-shrink:0}.dashboard-list-body{flex:1;min-height:0;overflow-y:auto}.dashboard-list-body table{border:0;border-radius:0;box-shadow:none}.dashboard-list-body th{position:sticky;top:0;z-index:1}.compact-table{table-layout:auto;font-size:12.5px}.compact-table th,.compact-table td{padding:8px}.compact-table th:first-child,.compact-table td:first-child{padding-left:12px}.compact-table th:last-child,.compact-table td:last-child{padding-right:12px}.compact-table th{font-size:10px;letter-spacing:.04em;white-space:nowrap}.compact-table td code{font-size:11px;padding:1px 4px}.compact-btn{padding:4px 10px!important;font-size:11px!important;font-weight:600!important}@media (max-width: 1100px){.compact-table{font-size:11.5px}.compact-table th,.compact-table td{padding:6px}}@media (max-width: 900px){.compact-table{display:block;overflow-x:auto;white-space:nowrap}}.desktop-only{display:initial}.mobile-only{display:none}.tap-btn{min-height:44px;min-width:44px;padding:10px 16px;font-size:14px;font-weight:600;border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:transform var(--transition),box-shadow var(--transition)}.tap-btn:active{transform:scale(.97)}.tap-btn.approve{background:#10b981;color:#fff;border-color:#059669}.tap-btn.approve.active{background:#059669;box-shadow:0 0 0 3px #10b98140}.tap-btn.reject{background:#ef4444;color:#fff;border-color:#dc2626}.tap-btn.reject.active{background:#dc2626;box-shadow:0 0 0 3px #ef444440}.tap-btn.outline{background:transparent;color:var(--text);border-color:var(--border)}.tap-btn[disabled]{opacity:.5;cursor:not-allowed}.req-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elev-1);padding:14px;margin-bottom:12px;box-shadow:var(--shadow)}.req-card.is-approved{border-left:4px solid #10b981}.req-card.is-rejected{border-left:4px solid #ef4444}.req-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}.req-card-date{font-size:15px;font-weight:700}.req-card-reason{font-size:13px;color:var(--text);margin-top:6px}.req-card-remarks{font-size:12px;color:var(--text-mute);font-style:italic;margin-top:4px;padding:6px 8px;background:var(--bg-elev-2);border-radius:4px}.req-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.req-card-actions .tap-btn{width:100%}.emp-pills{display:flex;gap:8px;overflow-x:auto;padding:6px 2px 10px;margin-bottom:12px;scroll-snap-type:x mandatory}.emp-pills::-webkit-scrollbar{height:4px}.emp-pill{flex:0 0 auto;scroll-snap-align:start;padding:8px 12px;border-radius:999px;background:var(--bg-elev-1);border:1px solid var(--border);font-size:12px;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:6px}.emp-pill.active{background:var(--accent);color:#fff;border-color:var(--accent)}.emp-pill .count-dot{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:rgba(0,0,0,.18);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.emp-pill.active .count-dot{background:rgba(255,255,255,.3)}@media (max-width: 768px){.desktop-only{display:none!important}.mobile-only{display:initial}.mobile-only.flex{display:flex}.mobile-only.block{display:block}.review-layout{grid-template-columns:1fr!important;gap:8px!important}input,select,textarea,button{font-size:16px!important;min-height:40px}.compact-btn,.icon-btn{min-height:36px;font-size:12px!important;padding:6px 12px!important}.modal{width:95vw!important;max-height:92vh;overflow-y:auto;padding:16px}.modal-actions{flex-direction:column-reverse;gap:8px}.modal-actions button{width:100%}.toolbar{flex-wrap:wrap;gap:8px}.grid-cards{grid-template-columns:repeat(2,1fr)!important}.date-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elev-1);padding:12px;margin-bottom:10px}.date-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.date-card-checkbox{transform:scale(1.4);margin-right:4px}}.date-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border:1px solid var(--border);border-radius:var(--radius-sm);min-height:60px;background:var(--bg-elev-1)}.date-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:var(--accent-soft);color:var(--accent);border-radius:999px;font-size:12px;font-weight:500}.date-chip button{background:transparent;color:var(--accent);padding:0 4px;box-shadow:none;font-size:14px;line-height:1}.date-chip button:hover{background:rgba(79,70,229,.2);transform:none;box-shadow:none}