:root{--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-main:#f7f8fa;--bg-surface:#fff;--bg-sidebar:#fff;--bg-card:#fff;--bg-card-hover:#f9fafb;--bg-subtle:#f3f4f6;--primary-color:#059669;--primary-hover:#047857;--primary-light:#f2f7f5;--primary-text:#166534;--primary-border:#bbf7d0;--primary-glow:#0596691f;--accent-blue:#2563eb;--accent-blue-light:#eff6ff;--accent-blue-border:#bfdbfe;--border-subtle:#e5e7eb;--border-hover:#d1d5db;--border-focus:#059669;--text-main:#111827;--text-muted:#667085;--text-dim:#98a2b3;--status-approved:#16a34a;--status-approved-bg:#f0fdf4;--status-approved-border:#bbf7d0;--status-pending:#d97706;--status-pending-bg:#fffbeb;--status-pending-border:#fde68a;--status-late:#dc2626;--status-late-bg:#fef2f2;--status-late-border:#fecaca;--radius-xs:3px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:10px;--shadow-subtle:0 1px 2px #0000000a;--shadow-card:0 1px 3px #0000000a, 0 1px 2px #00000005;--shadow-dropdown:0 4px 12px #00000014}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-main);color:var(--text-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-size:14px;line-height:1.5}h1{font-family:var(--font-display);letter-spacing:-.02em;color:var(--text-main);font-size:24px;font-weight:600;line-height:1.25}h2{font-family:var(--font-display);letter-spacing:-.01em;color:var(--text-main);font-size:18px;font-weight:600;line-height:1.3}h3{font-family:var(--font-display);color:var(--text-main);font-size:15px;font-weight:600;line-height:1.35}h4{font-family:var(--font-display);color:var(--text-main);font-size:13px;font-weight:600}p,span,div{font-size:14px}label{color:var(--text-muted);font-size:12px;font-weight:500}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#9ca3af}.app-layout{min-height:100vh;display:flex}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border-subtle);z-index:100;width:256px;box-shadow:none;flex-direction:column;padding:16px 12px;display:flex;position:fixed;top:0;bottom:0;left:0}.main-content{flex:1;width:calc(100% - 256px);max-width:1440px;margin-left:256px;padding:24px 32px}@media (width<=900px){.app-layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--border-subtle);width:100%;padding:12px 16px;position:relative}.main-content{width:100%;margin-left:0;padding:16px}}.sidebar-nav-item{border-radius:var(--radius-md);height:38px;font-family:var(--font-family);color:var(--text-muted);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:10px;width:100%;margin-bottom:2px;padding:0 12px;font-size:13.5px;font-weight:500;transition:background .14s,color .14s,border-color .14s;display:flex;position:relative}.sidebar-nav-item:hover{background:var(--bg-subtle);color:var(--text-main)}.sidebar-nav-item.active{background:var(--primary-light);color:var(--primary-text);border-color:#05966926;font-weight:600}.sidebar-nav-item.active:before{content:"";background:var(--primary-color);border-radius:0 2px 2px 0;width:2.5px;position:absolute;top:7px;bottom:7px;left:0}.sidebar-nav-item.active svg{color:var(--primary-color)}.glass-panel{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-subtle)}.glass-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-subtle);transition:border-color .14s,box-shadow .14s}.glass-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card)}.btn-primary{background:var(--primary-color);color:#fff;font-family:var(--font-family);border:1px solid var(--primary-hover);border-radius:var(--radius-md);cursor:pointer;height:36px;box-shadow:var(--shadow-subtle);white-space:nowrap;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:13.5px;font-weight:500;transition:background .14s,border-color .14s;display:inline-flex}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-primary:active:not(:disabled){background:#064e3b}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-secondary{color:var(--text-main);font-family:var(--font-family);border:1px solid var(--border-hover);border-radius:var(--radius-md);cursor:pointer;height:36px;box-shadow:var(--shadow-subtle);white-space:nowrap;background:#fff;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:13px;font-weight:500;transition:background .14s,border-color .14s,color .14s;display:inline-flex}.btn-secondary:hover:not(:disabled){color:var(--text-main);background:#f9fafb;border-color:#9ca3af}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.btn-danger{color:#dc2626;border-radius:var(--radius-md);cursor:pointer;background:#fff;border:1px solid #fecaca;justify-content:center;align-items:center;gap:6px;height:34px;padding:0 12px;font-size:13px;font-weight:500;transition:background .14s,border-color .14s;display:inline-flex}.btn-danger:hover:not(:disabled){background:#fef2f2;border-color:#f87171}.form-input,.form-select,.input-base,.bulk-row-input{width:100%;height:36px;border-radius:var(--radius-md)!important;color:var(--text-main)!important;font-size:13.5px!important;font-family:var(--font-family)!important;box-shadow:var(--shadow-subtle)!important;background:#fff!important;border:1px solid #d1d5db!important;outline:none!important;padding:0 12px!important;transition:border-color .14s,box-shadow .14s!important}.form-input:focus,.form-select:focus,.input-base:focus,.bulk-row-input:focus{border-color:var(--primary-color)!important;box-shadow:0 0 0 2px #05966926!important}.form-input::placeholder,.input-base::placeholder,.bulk-row-input::placeholder{color:#9ca3af!important}textarea.form-input,textarea.input-base{resize:vertical;height:auto;min-height:84px;line-height:1.45;padding:8px 12px!important}select.form-input,select.form-select,select.input-base,select.bulk-row-input{cursor:pointer;color:var(--text-main)!important;background-color:#fff!important;padding-right:28px!important}.badge{border-radius:var(--radius-sm);white-space:nowrap;align-items:center;gap:5px;height:22px;padding:0 6px;font-size:11.5px;font-weight:500;line-height:1;display:inline-flex}.badge-approved{background:var(--status-approved-bg);color:#15803d;border:1px solid var(--status-approved-border)}.badge-pending{background:var(--status-pending-bg);color:#b45309;border:1px solid var(--status-pending-border)}.badge-late{background:var(--status-late-bg);color:#b91c1c;border:1px solid var(--status-late-border)}.badge-cyan{color:#0369a1;background:#f0f9ff;border:1px solid #bae6fd}.badge-neutral{color:#4b5563;background:#f3f4f6;border:1px solid #e5e7eb}.bulk-table-container{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#fff;overflow-x:auto}.bulk-table{border-collapse:collapse;width:100%;font-size:13px}.bulk-table th{color:#4b5563;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border-subtle);white-space:nowrap;text-align:left;background:#f9fafb;padding:9px 10px;font-size:11.5px;font-weight:600}.bulk-table td{border-bottom:1px solid var(--border-subtle);vertical-align:middle;color:var(--text-main);padding:6px 10px}.bulk-table tr:last-child td{border-bottom:none}.bulk-table tr:hover td{background:#f9fafb}.segmented-control{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#f3f4f6;align-items:center;padding:2px;display:inline-flex}.segmented-control-item{border-radius:var(--radius-sm);cursor:pointer;height:32px;color:var(--text-muted);background:0 0;border:none;align-items:center;gap:6px;padding:0 12px;font-size:12.5px;font-weight:500;transition:all .14s;display:inline-flex}.segmented-control-item.active{color:var(--text-main);background:#fff;font-weight:600;box-shadow:0 1px 2px #0000000d}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin,.spin-anim{animation:.8s linear infinite spin}.section-divider{background:var(--border-subtle);height:1px;margin:16px 0}
