@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--radius:.625rem;--background:oklch(100% 0 0);--foreground:oklch(14.5% 0 0);--card:oklch(100% 0 0);--card-foreground:oklch(14.5% 0 0);--popover:oklch(100% 0 0);--popover-foreground:oklch(14.5% 0 0);--primary:oklch(54.1% .245 292.824);--primary-foreground:oklch(98.5% 0 0);--secondary:oklch(97% 0 0);--secondary-foreground:oklch(20.5% 0 0);--muted:oklch(97% 0 0);--muted-foreground:oklch(55.6% 0 0);--accent:oklch(97% 0 0);--accent-foreground:oklch(20.5% 0 0);--destructive:oklch(57.7% .245 27.325);--border:oklch(92.2% 0 0);--input:oklch(92.2% 0 0);--ring:oklch(54.1% .245 292.824);--chart-1:oklch(54.1% .245 292.824);--chart-2:oklch(60% .118 184.704);--chart-3:oklch(39.8% .07 227.392);--chart-4:oklch(82.8% .189 84.429);--chart-5:oklch(76.9% .188 70.08);--status-pending:oklch(70.5% .213 47.604);--status-pending-foreground:oklch(98.5% 0 0);--status-approved:oklch(52.7% .154 150.069);--status-approved-foreground:oklch(98.5% 0 0);--status-submitted:oklch(54.1% .245 292.824);--status-submitted-foreground:oklch(98.5% 0 0);--status-paid:oklch(55.6% 0 0);--status-paid-foreground:oklch(98.5% 0 0)}.dark{--background:oklch(14.5% 0 0);--foreground:oklch(98.5% 0 0);--card:oklch(20.5% 0 0);--card-foreground:oklch(98.5% 0 0);--popover:oklch(20.5% 0 0);--popover-foreground:oklch(98.5% 0 0);--primary:oklch(54.1% .245 292.824);--primary-foreground:oklch(98.5% 0 0);--secondary:oklch(26.9% 0 0);--secondary-foreground:oklch(98.5% 0 0);--muted:oklch(26.9% 0 0);--muted-foreground:oklch(70.8% 0 0);--accent:oklch(26.9% 0 0);--accent-foreground:oklch(98.5% 0 0);--destructive:oklch(70.4% .191 22.216);--border:oklch(100% 0 0/.1);--input:oklch(100% 0 0/.15);--ring:oklch(54.1% .245 292.824)}*{box-sizing:border-box;border-color:oklch(from var(--border) l c h)}body{background:oklch(from var(--background) l c h);min-width:320px;min-height:100vh;color:oklch(from var(--foreground) l c h);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}.app{background:linear-gradient(135deg,oklch(98% .01 292) 0%,oklch(100% 0 0) 48%,oklch(96% .02 292) 100%);min-height:100vh;padding:16px}@media (width>=640px){.app{padding:24px}}.center{place-items:center;gap:10px;display:grid}.shell{width:min(1200px,100%);margin:0 auto}.card{background:oklch(from var(--card) l c h / .98);border:1px solid oklch(from var(--border) l c h);border-radius:calc(var(--radius) * 1.4);box-shadow:0 1px 2px oklch(0% 0 0/.04),0 4px 16px oklch(0% 0 0/.04)}.login{width:min(400px,100%);padding:24px}.brand{align-items:center;gap:12px;margin-bottom:24px;display:flex}.logo{background:linear-gradient(135deg, var(--primary), oklch(65% .28 295));border-radius:calc(var(--radius) * 1.2);width:48px;height:48px;color:oklch(from var(--primary-foreground) l c h);place-items:center;display:grid}h1,h2,h3,p{margin:0}h1{letter-spacing:-.02em;color:oklch(from var(--foreground) l c h);font-size:clamp(24px,5vw,32px);font-weight:700}h2{color:oklch(from var(--foreground) l c h);font-size:18px;font-weight:600}.muted{color:oklch(from var(--muted-foreground) l c h);margin-top:4px;font-size:14px}.label{color:oklch(from var(--foreground) l c h);gap:6px;margin-bottom:16px;font-size:14px;font-weight:500;display:grid}.input,.select{background:oklch(from var(--background) l c h);border:1px solid oklch(from var(--input) l c h);border-radius:var(--radius);width:100%;color:oklch(from var(--foreground) l c h);padding:10px 12px;font-size:14px;transition:border-color .15s,box-shadow .15s}.input:focus,.select:focus{border-color:oklch(from var(--ring) l c h);box-shadow:0 0 0 3px oklch(from var(--ring) l c h / .1);outline:none}.input::placeholder{color:oklch(from var(--muted-foreground) l c h)}.btn{white-space:nowrap;cursor:pointer;border-radius:var(--radius);border:none;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:background-color .15s,opacity .15s;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:oklch(from var(--primary) l c h);color:oklch(from var(--primary-foreground) l c h)}.btn.primary:hover:not(:disabled){background:oklch(from var(--primary) calc(l - .05) c h)}.btn.secondary{background:oklch(from var(--secondary) l c h);color:oklch(from var(--secondary-foreground) l c h)}.btn.secondary:hover:not(:disabled){background:oklch(from var(--secondary) calc(l - .03) c h)}.btn.ghost{color:oklch(from var(--foreground) l c h);border:1px solid oklch(from var(--border) l c h);background:0 0}.btn.ghost:hover:not(:disabled){background:oklch(from var(--accent) l c h)}.btn.destructive{background:oklch(from var(--destructive) l c h);color:oklch(98.5% 0 0)}.btn.destructive:hover:not(:disabled){background:oklch(from var(--destructive) calc(l - .05) c h)}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px;display:flex}.toolbar,.actions{align-items:center;gap:8px;display:flex}.stats-bar{background:oklch(from var(--muted) l c h);border-radius:var(--radius);flex-wrap:wrap;gap:16px;margin-bottom:16px;padding:12px 16px;display:flex}.stat{flex-direction:column;gap:2px;display:flex}.stat-label{color:oklch(from var(--muted-foreground) l c h);font-size:12px;font-weight:500}.stat-value{color:oklch(from var(--foreground) l c h);font-size:18px;font-weight:600}.filter-tabs{background:oklch(from var(--muted) l c h);border-radius:var(--radius);-webkit-overflow-scrolling:touch;gap:4px;margin-bottom:16px;padding:4px;display:flex;overflow-x:auto}.filter-tab{color:oklch(from var(--muted-foreground) l c h);border-radius:calc(var(--radius) - 2px);cursor:pointer;white-space:nowrap;background:0 0;border:none;padding:8px 12px;font-size:13px;font-weight:500;transition:background-color .15s,color .15s}.filter-tab:hover{color:oklch(from var(--foreground) l c h)}.filter-tab.active{background:oklch(from var(--background) l c h);color:oklch(from var(--foreground) l c h);box-shadow:0 1px 2px oklch(0% 0 0/.05)}.badge{border-radius:999px;align-items:center;padding:4px 10px;font-size:12px;font-weight:500;display:inline-flex}.badge.pending{color:oklch(45% .15 47);background:oklch(95% .08 47)}.badge.approved{color:oklch(40% .12 150);background:oklch(95% .05 150)}.badge.submitted{color:oklch(45% .2 292);background:oklch(95% .08 292)}.badge.paid{background:oklch(from var(--muted) l c h);color:oklch(from var(--muted-foreground) l c h)}.claims-list{flex-direction:column;gap:12px;display:flex}.claim-card{background:oklch(from var(--card) l c h);border:1px solid oklch(from var(--border) l c h);border-radius:var(--radius);padding:16px;transition:border-color .15s}.claim-card:hover{border-color:oklch(from var(--ring) l c h / .3)}.claim-card.pending{border-left:3px solid oklch(70.5% .213 47.604)}.claim-header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.claim-title{color:oklch(from var(--foreground) l c h);margin:0;font-size:15px;font-weight:600}.claim-filename{color:oklch(from var(--muted-foreground) l c h);word-break:break-all;margin-top:4px;font-size:.75rem;font-weight:400}.claim-meta{color:oklch(from var(--muted-foreground) l c h);flex-wrap:wrap;gap:12px;margin-bottom:12px;font-size:13px;display:flex}.claim-meta-item{align-items:center;gap:4px;display:flex}.claim-amount{color:oklch(from var(--foreground) l c h);font-size:18px;font-weight:600}.claim-actions{border-top:1px solid oklch(from var(--border) l c h);gap:8px;margin-top:12px;padding-top:12px;display:flex}@media (width>=768px){.claims-table{border-collapse:collapse;width:100%;display:table}.claims-table th,.claims-table td{text-align:left;border-bottom:1px solid oklch(from var(--border) l c h);padding:12px 16px}.claims-table th{color:oklch(from var(--muted-foreground) l c h);background:oklch(from var(--muted) l c h / .5);font-size:13px;font-weight:500}.claims-table td{font-size:14px}.claims-table tr:hover td{background:oklch(from var(--muted) l c h / .3)}.claims-table tr.pending td{background:oklch(99% .02 47)}}.error{border-radius:var(--radius);color:oklch(50% .15 25);background:oklch(97% .02 25);border:1px solid oklch(90% .08 25);margin:12px 0;padding:12px 16px;font-size:14px}.modal-overlay{z-index:50;background:oklch(0% 0 0/.5);place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:oklch(from var(--background) l c h);border-radius:calc(var(--radius) * 1.2);width:min(420px,100%);padding:24px;box-shadow:0 16px 48px oklch(0% 0 0/.2)}.modal-title{margin-bottom:8px;font-size:18px;font-weight:600}.modal-description{color:oklch(from var(--muted-foreground) l c h);margin-bottom:24px;font-size:14px}.modal-actions{justify-content:flex-end;gap:8px;display:flex}.inline-select{background:oklch(from var(--background) l c h);border:1px solid oklch(from var(--input) l c h);border-radius:calc(var(--radius) * .8);min-width:140px;color:oklch(from var(--foreground) l c h);padding:6px 10px;font-size:13px}.inline-select:disabled{opacity:.6;cursor:not-allowed}.row-feedback{margin-top:4px;font-size:11px;font-weight:600;display:block}.row-feedback.ok{color:oklch(52.7% .154 150.069)}.row-feedback.error{color:oklch(from var(--destructive) l c h)}.dropdown{position:relative}.dropdown-menu{background:oklch(from var(--popover) l c h);border:1px solid oklch(from var(--border) l c h);border-radius:var(--radius);z-index:50;min-width:160px;margin-top:4px;padding:4px;position:absolute;top:100%;right:0;box-shadow:0 4px 16px oklch(0% 0 0/.1)}.dropdown-item{width:100%;color:oklch(from var(--foreground) l c h);border-radius:calc(var(--radius) - 2px);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:8px;padding:8px 12px;font-size:14px;display:flex}.dropdown-item:hover{background:oklch(from var(--accent) l c h)}.dropdown-item.destructive{color:oklch(from var(--destructive) l c h)}.dropdown-item.destructive:hover{background:oklch(97% .02 25)}.spinner{border:2px solid oklch(from var(--muted) l c h);border-top-color:oklch(from var(--primary) l c h);border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;color:oklch(from var(--muted-foreground) l c h);padding:48px 24px}.empty-state-icon{opacity:.5;width:48px;height:48px;margin:0 auto 16px}.mobile-only{display:block}.desktop-only{display:none}@media (width>=768px){.mobile-only{display:none}.desktop-only{display:block}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}