:root{--brand:#ed1c24;--brand-dark:#c4151b;--brand-light:#fdecec;--accent:#ffe500;--accent-dark:#8a7600;--ink:#252525;--ink-soft:#5b5b5b;--ink-faint:#9a9a9a;--surface:#fff;--surface-alt:#f7f8fa;--surface-sidebar:#252525;--surface-sidebar-hover:#333;--surface-sidebar-border:#3a3a3a;--border:#e5e5e5;--border-strong:#cfcfcf;--danger:#dc2626;--danger-bg:#fef2f2;--danger-border:#fecaca;--success:#15803d;--success-bg:#f0fdf4;--success-border:#bbf7d0;--warning:#b45309;--warning-bg:#fef3e2;--warning-border:#fde3b0;--info:#1d4ed8;--info-bg:#eff6ff;--info-border:#bfdbfe;--radius-sm:6px;--radius:10px;--radius-lg:16px;--shadow-sm:0 1px 2px #2525250f;--shadow-md:0 4px 16px #25252514;--shadow-lg:0 16px 40px #25252529;--sans:system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--sidebar-width:248px;--sidebar-width-collapsed:72px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{height:100%}body{font:15px/1.5 var(--sans);color:var(--ink);background:var(--surface-alt);margin:0}h1,h2,h3,h4{font-family:var(--sans);color:var(--ink);letter-spacing:-.01em;margin:0 0 4px;font-weight:700}h1{font-size:26px}h2{font-size:20px}h3{font-size:16px}h4{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;font-size:13px}p{color:var(--ink-soft);margin:0 0 8px}a{color:var(--brand);font-weight:500;text-decoration:none}a:hover{text-decoration:underline}::selection{background:var(--accent);color:var(--ink)}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--surface-sidebar);color:#d4d4d4;flex-direction:column;flex-shrink:0;height:100vh;transition:width .18s;display:flex;position:sticky;top:0;overflow-y:auto}.sidebar.collapsed{width:var(--sidebar-width-collapsed)}.sidebar-brand{border-bottom:1px solid var(--surface-sidebar-border);align-items:center;gap:10px;min-height:64px;padding:18px 16px;display:flex}.sidebar-brand img{object-fit:contain;flex-shrink:0;width:34px;height:38px}.sidebar-brand-text{white-space:nowrap;overflow:hidden}.sidebar-brand-text strong{color:#fff;letter-spacing:.02em;font-size:14px;font-weight:800;line-height:1.2;display:block}.sidebar-brand-text span{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;font-size:9px;font-weight:600;display:block}.sidebar-nav{flex-direction:column;flex:1;gap:2px;padding:10px;display:flex}.nav-section-label{text-transform:uppercase;letter-spacing:.07em;color:#7a7a7a;white-space:nowrap;padding:16px 10px 6px;font-size:10px;font-weight:700;overflow:hidden}.nav-link{border-radius:var(--radius-sm);color:#d4d4d4;white-space:nowrap;align-items:center;gap:10px;padding:9px 12px;font-size:14px;font-weight:600;display:flex;overflow:hidden}.nav-link:hover{background:var(--surface-sidebar-hover);color:#fff;text-decoration:none}.nav-link.active{background:var(--accent);color:var(--ink)}.nav-link-icon{flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:inline-flex}.sidebar.collapsed .sidebar-brand-text,.sidebar.collapsed .nav-section-label,.sidebar.collapsed .nav-link-label,.sidebar.collapsed .sidebar-footer-text{display:none}.sidebar.collapsed .nav-link{justify-content:center}.sidebar-footer{border-top:1px solid var(--surface-sidebar-border);color:#8a8a8a;padding:14px 16px;font-size:11px}.sidebar-footer-text strong{color:#d4d4d4;font-size:12px;display:block}.main-area{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:10;align-items:center;gap:16px;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.topbar-toggle{border-radius:var(--radius-sm);color:var(--ink-soft);cursor:pointer;background:0 0;border:none;padding:6px;display:flex}.topbar-toggle:hover{background:var(--surface-alt)}.breadcrumbs{color:var(--ink-soft);white-space:nowrap;align-items:center;gap:6px;font-size:13px;display:flex;overflow:hidden}.breadcrumbs a{color:var(--ink-soft);align-items:center;display:inline-flex}.breadcrumbs a:hover{color:var(--ink);text-decoration:none}.breadcrumbs .current{color:var(--ink);font-weight:600}.topbar-search{flex:1;max-width:420px;margin-left:auto;position:relative}.topbar-search input{background:var(--surface-alt);border:1px solid #0000;width:100%;padding:8px 12px 8px 36px}.topbar-search input:focus{background:var(--surface)}.topbar-search-icon{color:var(--ink-faint);pointer-events:none;position:absolute;top:50%;left:11px;transform:translateY(-50%)}.topbar-actions{flex-shrink:0;align-items:center;gap:14px;display:flex}.icon-button{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:999px;padding:8px;display:flex;position:relative}.icon-button:hover{background:var(--surface-alt)}.icon-badge{background:var(--brand);color:#fff;border:2px solid var(--surface);border-radius:999px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:0 4px;font-size:10px;font-weight:700;display:flex;position:absolute;top:2px;right:2px}.profile-menu{position:relative}.profile-trigger{border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;align-items:center;gap:10px;padding:4px 6px;display:flex}.profile-trigger:hover{background:var(--surface-alt)}.profile-name{text-align:left;line-height:1.2}.profile-name strong{color:var(--ink);font-size:13px;font-weight:700;display:block}.profile-name span{color:var(--ink-faint);text-transform:capitalize;font-size:11px;display:block}.profile-dropdown{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:20;min-width:200px;padding:6px;position:absolute;top:calc(100% + 8px);right:0}.profile-dropdown a,.profile-dropdown button{text-align:left;border-radius:var(--radius-sm);width:100%;color:var(--ink);cursor:pointer;background:0 0;border:none;padding:9px 10px;font-size:13px;font-weight:500;display:block}.profile-dropdown a:hover,.profile-dropdown button:hover{background:var(--surface-alt);text-decoration:none}.avatar{background:var(--brand-light);width:34px;height:34px;color:var(--brand-dark);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}main.page{flex:1;width:100%;max-width:1320px;margin:0 auto;padding:24px 28px 64px}.dashboard-overview-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;display:grid}.payroll-runs-grid{grid-template-columns:minmax(200px,240px) 1fr;align-items:start;gap:20px;display:grid}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:22px;display:flex}.page-header-title p{margin:2px 0 0}.page-header-actions{flex-wrap:wrap;gap:8px;display:flex}section,details,.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:20px;padding:20px}details summary{cursor:pointer;color:var(--ink);font-weight:600;list-style:none}details summary::-webkit-details-marker{display:none}details summary:before{content:"▸";color:var(--ink-faint);margin-right:6px;transition:transform .15s;display:inline-block}details[open] summary:before{transform:rotate(90deg)}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:20px;display:grid}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;gap:10px;padding:18px 20px;display:flex}.stat-card-top{align-items:center;gap:12px;display:flex}.stat-icon{border-radius:var(--radius);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.stat-label{color:var(--ink-soft);font-size:13px;font-weight:600}.stat-value{color:var(--ink);letter-spacing:-.02em;font-size:28px;font-weight:800}.stat-delta{align-items:center;gap:4px;font-size:12px;font-weight:600;display:flex}.stat-delta.up{color:var(--success)}.stat-delta.down{color:var(--danger)}.stat-delta-note{color:var(--ink-faint);font-weight:500}form{flex-direction:column;align-items:flex-start;gap:14px;display:flex}label{color:var(--ink-soft);flex-direction:column;gap:6px;width:100%;max-width:420px;font-size:13px;font-weight:600;display:flex}input,select,textarea{font:inherit;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);width:100%;padding:9px 12px;font-size:14px;transition:border-color .12s,box-shadow .12s}input::placeholder,textarea::placeholder{color:var(--ink-faint)}input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-light);outline:none}input:disabled,select:disabled,textarea:disabled{background:var(--surface-alt);color:var(--ink-faint);cursor:not-allowed}button{font:inherit;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--ink);cursor:pointer;align-items:center;gap:6px;padding:9px 16px;font-size:14px;font-weight:600;transition:background .12s,border-color .12s,transform 50ms;display:inline-flex}button:hover:not(:disabled){background:var(--surface-alt);border-color:var(--ink-faint)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.55;cursor:not-allowed}button[type=submit]{background:var(--brand);border-color:var(--brand);color:#fff}button[type=submit]:hover:not(:disabled){background:var(--brand-dark);border-color:var(--brand-dark)}button.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}button.btn-danger:hover:not(:disabled){background:#b91c1c;border-color:#b91c1c}table{border-collapse:collapse;width:100%;font-size:14px}thead th{text-align:left;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);background:var(--surface-alt);border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 14px;font-size:11px;font-weight:700}thead th:first-child{border-top-left-radius:var(--radius-sm)}thead th:last-child{border-top-right-radius:var(--radius-sm)}tbody td{border-bottom:1px solid var(--border);color:var(--ink);vertical-align:middle;padding:12px 14px}tbody tr:hover{background:var(--surface-alt)}tbody tr:last-child td{border-bottom:none}.badge{text-transform:capitalize;white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:3px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge-neutral{background:var(--surface-alt);color:var(--ink-soft)}.badge-success{background:var(--success-bg);color:var(--success)}.badge-danger{background:var(--danger-bg);color:var(--danger)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-info{background:var(--info-bg);color:var(--info)}.badge-brand{background:var(--brand-light);color:var(--brand-dark)}.progress-track{background:var(--border);border-radius:999px;width:100%;min-width:80px;height:7px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:999px;height:100%}[role=alert]{background:var(--danger-bg);border:1px solid var(--danger-border);color:var(--danger);border-radius:var(--radius-sm);margin-bottom:14px;padding:10px 14px;font-size:13px;font-weight:500;display:block}.empty-state{text-align:center;color:var(--ink-faint);flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:48px 20px;display:flex}.empty-state strong{color:var(--ink-soft);font-size:14px}.skeleton{background:linear-gradient(90deg, var(--surface-alt) 25%, var(--border) 50%, var(--surface-alt) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.4s infinite skeleton-shimmer}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.modal-overlay{z-index:100;background:#25252580;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:440px;padding:22px}.modal-title{margin-bottom:8px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:18px;display:flex}code{background:var(--surface-alt);border-radius:4px;padding:2px 6px;font-family:ui-monospace,Consolas,monospace;font-size:13px}@media (width<=960px){.topbar-search{display:none}}@media (width<=860px){table{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto}thead,tbody,tr{table-layout:auto;width:100%;display:table}.app-shell{flex-direction:column}.sidebar{z-index:60;width:272px;max-width:85vw;height:100vh;box-shadow:var(--shadow-lg);flex-direction:column;transition:transform .2s;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar.mobile-open{transform:translate(0)}.sidebar.collapsed{width:272px}.sidebar.collapsed .sidebar-brand-text,.sidebar.collapsed .nav-section-label,.sidebar.collapsed .sidebar-footer-text{display:block}.sidebar.collapsed .nav-link-label{display:inline}.sidebar.collapsed .nav-link{justify-content:flex-start}.sidebar-backdrop{z-index:55;background:#25252580;position:fixed;inset:0}main.page{padding:18px 16px 48px}.dashboard-overview-grid,.payroll-runs-grid{grid-template-columns:1fr}.stat-grid{grid-template-columns:1fr 1fr}}@media (width<=520px){.stat-grid{grid-template-columns:1fr}.topbar{gap:8px;padding:0 12px}.breadcrumbs{display:none}main.page{padding:14px 12px 40px}.card,section{padding:14px}.modal{padding:16px}}