@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600&family=Fira+Sans:wght@300;400;500;600;700&display=swap";
:root{--bg-deep:#f8fafc;--bg-base:#f1f5f9;--bg-card:#fff;--bg-elevated:#fff;--bg-hover:#f1f5f9;--accent:#841ff6;--accent-dim:#841ff61a;--accent-glow:#841ff626;--cta:#130d17;--cta-dim:#130d171a;--positive:#16a34a;--positive-dim:#16a34a1a;--negative:#dc2626;--negative-dim:#dc26261a;--neutral:#64748b;--text-primary:#130d17;--text-secondary:#4a4a5a;--text-muted:#9ca3af;--border:#e2e8f0;--border-hover:#cbd5e1;--font-sans:"Fira Sans", system-ui, sans-serif;--font-mono:"Fira Code", monospace;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--sidebar-w:260px;--ease:cubic-bezier(.16, 1, .3, 1);--duration:.2s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}body{font-family:var(--font-sans);background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}h1{font-size:clamp(1.5rem,4vw,2.25rem);font-weight:700;line-height:1.2}h2{font-size:clamp(1.125rem,3vw,1.5rem);font-weight:600;line-height:1.3}h3{font-size:1.125rem;font-weight:600}h4{text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary);font-size:.875rem;font-weight:600}.mono{font-family:var(--font-mono)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-w);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--border);z-index:50;height:100vh;transition:transform var(--duration) var(--ease);background:#ffffffd9;flex-direction:column;display:flex;position:fixed;top:0;left:0}.main-content{margin-left:var(--sidebar-w);flex:1;max-width:100%;padding:2rem;overflow-x:hidden}.sidebar-logo{border-bottom:1px solid var(--border);padding:1.5rem}.sidebar-logo-img{aspect-ratio:16/9;object-fit:contain;border-radius:var(--radius-sm);background:var(--bg-elevated);width:100%}.sidebar-logo-placeholder{aspect-ratio:16/9;background:var(--bg-elevated);border-radius:var(--radius-sm);width:100%;color:var(--text-muted);justify-content:center;align-items:center;font-size:.75rem;display:flex}.sidebar-nav{flex:1;padding:1rem 0}.nav-item{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--duration) var(--ease);align-items:center;gap:.75rem;margin:.125rem .75rem;padding:.625rem 1.25rem;font-size:.9375rem;font-weight:500;text-decoration:none;display:flex}.nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-item.active{background:var(--accent-dim);color:var(--accent);border:1px solid #841ff633}.nav-item.disabled{opacity:.4;cursor:not-allowed}.sidebar-footer{border-top:1px solid var(--border);padding:1rem 1.25rem}.sidebar-footer .nav-item{color:var(--text-muted);margin:0;font-size:.875rem}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:2rem;display:flex}.page-header-left h1{color:var(--text-primary)}.recovered-amount{font-family:var(--font-mono);color:var(--accent);margin-top:.25rem;font-size:clamp(2rem,5vw,3rem);font-weight:600;line-height:1}.recovered-label{color:var(--text-secondary);font-size:.875rem;font-weight:400}.date-picker-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.875rem;font-family:var(--font-sans);cursor:pointer;transition:all var(--duration) var(--ease);white-space:nowrap;align-items:center;gap:.5rem;padding:.625rem 1rem;display:flex}.date-picker-btn:hover{border-color:var(--border-hover);background:var(--bg-elevated)}.date-picker-dropdown{z-index:100;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);min-width:280px;padding:1rem;position:absolute;top:calc(100% + .5rem);right:0;box-shadow:0 10px 40px #0000001a}.kpi-grid{grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem;display:grid}@media (min-width:640px){.kpi-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:1024px){.kpi-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width:1280px){.kpi-grid{grid-template-columns:repeat(5,1fr)}}.kpi-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--duration) var(--ease);padding:1.25rem;position:relative;overflow:hidden}.kpi-card:before{content:"";background:linear-gradient(135deg, var(--accent-dim) 0%, transparent 100%);opacity:0;transition:opacity var(--duration) var(--ease);border-radius:var(--radius-md);position:absolute;inset:0}.kpi-card:hover{border-color:var(--border-hover);transform:translateY(-2px);box-shadow:0 8px 32px #00000014}.kpi-card:hover:before{opacity:1}.kpi-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary);margin-bottom:.5rem;font-size:.75rem;font-weight:600}.kpi-value{font-family:var(--font-mono);color:var(--text-primary);margin-bottom:.5rem;font-size:1.5rem;font-weight:600;line-height:1}.kpi-change{border-radius:100px;align-items:center;gap:.25rem;padding:.2rem .5rem;font-size:.75rem;font-weight:600;display:inline-flex}.kpi-change.positive{background:var(--positive-dim);color:var(--positive)}.kpi-change.negative{background:var(--negative-dim);color:var(--negative)}.kpi-change.neutral{color:var(--neutral);background:#64748b26}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton{background:linear-gradient(90deg, var(--bg-elevated) 25%, var(--bg-hover) 50%, var(--bg-elevated) 75%);border-radius:var(--radius-sm);background-size:800px 100%;animation:1.5s infinite shimmer}.charts-grid{grid-template-columns:1fr;gap:1rem;display:grid}@media (min-width:768px){.charts-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1280px){.charts-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:1536px){.charts-grid{grid-template-columns:repeat(4,1fr)}}.col-span-1{grid-column:span 1/span 1}@media (min-width:768px){.col-span-2{grid-column:span 2/span 2}}.chart-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:border-color var(--duration) var(--ease);padding:1.5rem}.chart-card:hover{border-color:var(--border-hover)}.chart-header{justify-content:space-between;align-items:center;margin-bottom:1.25rem;display:flex}.chart-title{color:var(--text-primary);font-size:.875rem;font-weight:600}.chart-detail-btn{color:var(--accent);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--duration) var(--ease);background:0 0;border:none;padding:.25rem .5rem;font-size:.75rem;text-decoration:underline}.chart-detail-btn:hover{background:var(--accent-dim)}.breakdown-row{align-items:center;gap:.75rem;margin-bottom:.875rem;display:flex}.breakdown-label-wrap{flex-shrink:0;justify-content:space-between;width:160px;display:flex}.breakdown-label{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-size:.8125rem;font-weight:500;overflow:hidden}.breakdown-pct{color:var(--text-secondary);font-size:.75rem;font-family:var(--font-mono)}.breakdown-bar-track{background:var(--bg-elevated);border-radius:100px;flex:1;height:6px;position:relative;overflow:hidden}.breakdown-bar-fill{background:linear-gradient(90deg, var(--accent), #d1a3ff);height:100%;transition:width .6s var(--ease);border-radius:100px}.monthly-chart{justify-content:space-between;align-items:flex-end;gap:4px;height:160px;display:flex}.monthly-bar-wrap{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;gap:4px;height:100%;display:flex}.monthly-bar-track{background:var(--bg-elevated);cursor:pointer;width:100%;transition:background var(--duration) var(--ease);border-radius:4px 4px 0 0;flex:1;position:relative;overflow:hidden}.monthly-bar-track:hover{background:var(--bg-hover)}.monthly-bar-fill{background:linear-gradient(180deg, #d1a3ff, var(--accent));width:100%;transition:height .7s var(--ease);border-radius:4px 4px 0 0;position:absolute;bottom:0}.monthly-bar-label{color:var(--text-muted);text-align:center;font-size:.625rem;font-family:var(--font-mono)}.tooltip{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);pointer-events:none;z-index:200;white-space:nowrap;font-size:.8125rem;font-family:var(--font-mono);padding:.5rem .75rem;position:absolute;box-shadow:0 8px 24px #00000026}.simulator-recovery{align-items:baseline;gap:.5rem;margin-bottom:1rem;display:flex}.simulator-recovery-pct{font-family:var(--font-mono);color:var(--accent);font-size:2.5rem;font-weight:600;line-height:1}.simulator-recovery-label{color:var(--text-secondary);font-size:.875rem}.bullet-track{gap:6px;margin-bottom:1rem;display:flex}.bullet{width:28px;height:56px;transition:opacity var(--duration) var(--ease);border-radius:100px}.bullet.filled{background:var(--accent)}.bullet.empty{background:var(--bg-elevated)}.scenario-row{border-bottom:1px solid var(--border);align-items:baseline;gap:.5rem;padding:.625rem 0;display:flex}.scenario-row:last-child{border-bottom:none}.scenario-increase{font-family:var(--font-mono);color:var(--positive);font-weight:600}.scenario-desc{color:var(--text-secondary);font-size:.875rem}.data-table{border-collapse:collapse;width:100%;font-size:.875rem}.data-table th{text-align:left;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);padding:.625rem .875rem;font-size:.75rem;font-weight:600}.data-table td{border-bottom:1px solid var(--border);color:var(--text-primary);padding:.625rem .875rem}.data-table tr:hover td{background:var(--bg-elevated)}.data-table .mono-cell{font-family:var(--font-mono);font-size:.8125rem}.btn{border-radius:var(--radius-sm);font-family:var(--font-sans);cursor:pointer;transition:all var(--duration) var(--ease);border:1px solid #0000;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-primary:hover{background:#6f15d1;border-color:#6f15d1}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border)}.btn-secondary:hover{background:var(--bg-hover);border-color:var(--border-hover)}.btn-danger{background:var(--negative-dim);color:var(--negative);border-color:#ef44444d}.btn-danger:hover{background:#ef444440}.input{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:border-color var(--duration) var(--ease);outline:none;padding:.625rem .875rem;font-size:.875rem}.input::placeholder{color:var(--text-muted)}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.label{color:var(--text-secondary);margin-bottom:.375rem;font-size:.8125rem;font-weight:500;display:block}.form-group{margin-bottom:1rem}.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;padding-right:2.5rem}.select option{background:var(--bg-card);color:var(--text-primary)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:1.5rem}.login-page{background:radial-gradient(ellipse at 50% 0%, #3b82f61f 0%, var(--bg-deep) 70%);justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex}.login-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:400px;padding:2.5rem;box-shadow:0 20px 60px #0000001a}.login-logo{text-align:center;margin-bottom:1.5rem}.login-logo-text{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:700}.login-subtitle{color:var(--text-secondary);text-align:center;margin-bottom:2rem;font-size:.875rem}.alert{border-radius:var(--radius-sm);margin-bottom:1rem;padding:.75rem 1rem;font-size:.875rem}.alert-success{background:var(--positive-dim);color:var(--positive);border:1px solid #22c55e4d}.alert-error{background:var(--negative-dim);color:var(--negative);border:1px solid #ef44444d}.hamburger{z-index:60;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-primary);padding:.5rem;display:none;position:fixed;top:1rem;left:1rem}.sidebar-overlay{z-index:40;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b3;display:none;position:fixed;inset:0}@media (max-width:768px){.hamburger{display:flex}.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay.open{display:block}.main-content{margin-left:0;padding:4rem 1rem 1rem}.recovered-amount{font-size:2rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.badge{border-radius:100px;align-items:center;padding:.2rem .625rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-blue{background:var(--accent-dim);color:var(--accent)}.badge-green{background:var(--positive-dim);color:var(--positive)}.badge-amber{background:var(--cta-dim);color:var(--cta)}.badge-red{background:var(--negative-dim);color:var(--negative)}.badge-grey{color:var(--neutral);background:#64748b26}.section-gap{margin-top:2rem}.inventory-stat{border-bottom:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding:.75rem 0;display:flex}.inventory-stat:last-child{border-bottom:none}.admin-table-wrap{border-radius:var(--radius-md);border:1px solid var(--border);overflow-x:auto}