@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--color-bg-primary:#f8fafc;--color-bg-secondary:#fff;--color-bg-tertiary:#f1f5f9;--color-bg-hover:#e2e8f0;--color-bg-active:#dbeafe;--color-bg-sidebar:#fff;--color-bg-card:#fff;--color-bg-input:#fff;--color-bg-modal:#00000080;--color-text-primary:#0f172a;--color-text-secondary:#475569;--color-text-tertiary:#94a3b8;--color-text-inverse:#fff;--color-border:#e2e8f0;--color-border-focus:#3b82f6;--color-border-input:#cbd5e1;--color-accent:#3b82f6;--color-accent-hover:#2563eb;--color-accent-light:#dbeafe;--color-accent-text:#1e40af;--color-success:#10b981;--color-success-bg:#d1fae5;--color-warning:#f59e0b;--color-warning-bg:#fef3c7;--color-danger:#ef4444;--color-danger-bg:#fee2e2;--color-info:#3b82f6;--color-info-bg:#dbeafe;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.35s cubic-bezier(.4, 0, .2, 1);--sidebar-width:260px;--sidebar-collapsed:72px}[data-theme=dark]{--color-bg-primary:#0f172a;--color-bg-secondary:#1e293b;--color-bg-tertiary:#334155;--color-bg-hover:#334155;--color-bg-active:#1e3a5f;--color-bg-sidebar:#1e293b;--color-bg-card:#1e293b;--color-bg-input:#334155;--color-text-primary:#f1f5f9;--color-text-secondary:#94a3b8;--color-text-tertiary:#64748b;--color-border:#334155;--color-border-input:#475569;--color-accent-light:#1e3a5f;--color-accent-text:#93c5fd;--color-success-bg:#064e3b;--color-warning-bg:#78350f;--color-danger-bg:#7f1d1d;--color-info-bg:#1e3a5f;--shadow-sm:0 1px 2px 0 #0000004d;--shadow-md:0 4px 6px -1px #0006, 0 2px 4px -2px #0000004d;--shadow-lg:0 10px 15px -3px #0006, 0 4px 6px -4px #0000004d}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background-color:var(--color-bg-primary);color:var(--color-text-primary);transition:background-color var(--transition-base), color var(--transition-base);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}#root{min-height:100vh;display:flex}a{color:var(--color-accent);text-decoration:none}.app-layout{width:100%;min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--color-bg-sidebar);border-right:1px solid var(--color-border);z-index:100;transition:width var(--transition-base), transform var(--transition-base);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;overflow:hidden}.sidebar-header{padding:var(--space-lg);border-bottom:1px solid var(--color-border);align-items:center;gap:var(--space-md);display:flex}.sidebar-logo{border-radius:var(--radius-md);color:#fff;background:linear-gradient(135deg,#3b82f6,#8b5cf6);flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.1rem;font-weight:800;display:flex}.sidebar-title{color:var(--color-text-primary);white-space:nowrap;font-size:1rem;font-weight:700}.sidebar-subtitle{color:var(--color-text-tertiary);white-space:nowrap;font-size:.7rem}.sidebar-nav{padding:var(--space-md);gap:var(--space-xs);flex-direction:column;flex:1;display:flex}.nav-item{align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);text-align:left;white-space:nowrap;background:0 0;border:none;width:100%;font-size:.875rem;font-weight:500;display:flex}.nav-item:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.nav-item.active{background:var(--color-accent-light);color:var(--color-accent);font-weight:600}.sidebar-footer{padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border)}.main-content{margin-left:var(--sidebar-width);transition:margin-left var(--transition-base);flex:1}.page-header{padding:var(--space-lg) var(--space-xl);border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary);z-index:50;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.page-title{color:var(--color-text-primary);font-size:1.25rem;font-weight:700}.page-description{color:var(--color-text-secondary);margin-top:2px;font-size:.85rem}.page-body{padding:var(--space-xl);max-width:1400px}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow var(--transition-fast)}.card:hover{box-shadow:var(--shadow-md)}.card-header{padding:var(--space-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.card-title{color:var(--color-text-primary);align-items:center;gap:var(--space-sm);font-size:1rem;font-weight:600;display:flex}.card-body{padding:var(--space-lg)}.form-group{margin-bottom:var(--space-md)}.form-label{color:var(--color-text-secondary);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:600;display:block}.form-input{border:1px solid var(--color-border-input);border-radius:var(--radius-md);background:var(--color-bg-input);width:100%;color:var(--color-text-primary);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:.6rem .8rem;font-family:inherit;font-size:.9rem}.form-input:focus{border-color:var(--color-border-focus);box-shadow:0 0 0 3px #3b82f626}.form-input::placeholder{color:var(--color-text-tertiary)}.form-grid{gap:var(--space-md);display:grid}.form-grid-2{grid-template-columns:repeat(2,1fr)}.form-grid-3{grid-template-columns:repeat(3,1fr)}.form-grid-4{grid-template-columns:repeat(4,1fr)}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;padding:.6rem 1.2rem;font-family:inherit;font-size:.875rem;font-weight:600;line-height:1.4;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-accent);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){background:var(--color-accent-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-hover)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:#dc2626}.btn-ghost{color:var(--color-text-secondary);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--color-bg-hover);color:var(--color-text-primary)}.btn-sm{padding:.35rem .75rem;font-size:.8rem}.btn-lg{padding:.8rem 1.6rem;font-size:1rem}.btn-icon{border-radius:var(--radius-md);padding:.5rem}.upload-zone{border:2px dashed var(--color-border);border-radius:var(--radius-lg);padding:var(--space-2xl);text-align:center;cursor:pointer;transition:all var(--transition-fast);background:var(--color-bg-tertiary)}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--color-accent);background:var(--color-accent-light)}.upload-zone-icon{color:var(--color-text-tertiary);margin-bottom:var(--space-md)}.upload-zone-text{color:var(--color-text-secondary);font-size:.95rem;font-weight:500}.upload-zone-hint{color:var(--color-text-tertiary);margin-top:var(--space-xs);font-size:.8rem}.upload-file-list{margin-top:var(--space-md);gap:var(--space-sm);flex-wrap:wrap;display:flex}.upload-file-chip{align-items:center;gap:var(--space-xs);background:var(--color-accent-light);color:var(--color-accent-text);border-radius:var(--radius-full);padding:.3rem .7rem;font-size:.8rem;font-weight:500;display:inline-flex}.upload-file-chip button{color:inherit;cursor:pointer;opacity:.7;background:0 0;border:none;padding:0;display:flex}.upload-file-chip button:hover{opacity:1}.table-container{border-radius:var(--radius-lg);border:1px solid var(--color-border);overflow-x:auto}table{border-collapse:collapse;width:100%}th{background:var(--color-bg-tertiary);text-align:left;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--color-border);white-space:nowrap;padding:.75rem 1rem;font-size:.75rem;font-weight:600}td{border-bottom:1px solid var(--color-border);color:var(--color-text-primary);padding:.75rem 1rem;font-size:.875rem}tr:last-child td{border-bottom:none}tr:hover td{background:var(--color-bg-hover)}.badge{border-radius:var(--radius-full);align-items:center;gap:4px;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-danger{background:var(--color-danger-bg);color:var(--color-danger)}.badge-info{background:var(--color-info-bg);color:var(--color-info)}.theme-toggle{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);cursor:pointer;color:var(--color-text-secondary);width:100%;transition:all var(--transition-fast);background:0 0;border:none;font-size:.85rem;display:flex}.theme-toggle:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.preview-frame{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-xl) var(--space-2xl);color:#000;background:#fff;max-height:600px;font-size:.9rem;line-height:1.8;overflow-y:auto}.alert{padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);font-size:.875rem;display:flex}.alert-success{background:var(--color-success-bg);color:var(--color-success)}.alert-warning{background:var(--color-warning-bg);color:var(--color-warning)}.alert-danger{background:var(--color-danger-bg);color:var(--color-danger)}.alert-info{background:var(--color-info-bg);color:var(--color-info)}.modal-overlay{background:var(--color-bg-modal);z-index:1000;animation:fadeIn var(--transition-fast);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--color-bg-secondary);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:90%;max-width:800px;max-height:90vh;animation:slideUp var(--transition-base);overflow-y:auto}.modal-header{padding:var(--space-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.modal-body{padding:var(--space-lg)}.modal-footer{padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border);justify-content:flex-end;gap:var(--space-sm);display:flex}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}.loading-overlay{justify-content:center;align-items:center;gap:var(--space-md);padding:var(--space-2xl);color:var(--color-text-secondary);flex-direction:column;display:flex}.search-bar{position:relative}.search-bar .search-icon{color:var(--color-text-tertiary);pointer-events:none;position:absolute;top:50%;left:.75rem;transform:translateY(-50%)}.search-bar .form-input{padding-left:2.5rem}.section-header{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:2px solid var(--color-accent);display:flex}.section-title{color:var(--color-text-primary);font-size:.95rem;font-weight:700}.person-row{background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);margin-bottom:var(--space-sm);position:relative}.person-row-header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.person-row-label{color:var(--color-accent);font-size:.8rem;font-weight:600}.stats-grid{gap:var(--space-md);margin-bottom:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.stat-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);align-items:center;gap:var(--space-md);display:flex}.stat-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.stat-value{color:var(--color-text-primary);font-size:1.5rem;font-weight:800}.stat-label{color:var(--color-text-secondary);font-size:.8rem}.empty-state{text-align:center;padding:var(--space-2xl) var(--space-xl);color:var(--color-text-tertiary)}.empty-state-icon{margin-bottom:var(--space-md);opacity:.5}.empty-state-title{color:var(--color-text-secondary);margin-bottom:var(--space-xs);font-size:1.1rem;font-weight:600}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mb-md{margin-bottom:var(--space-md)}.w-full{width:100%}.text-center{text-align:center}.text-right{text-align:right}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.form-grid-2,.form-grid-3,.form-grid-4{grid-template-columns:1fr}.page-body{padding:var(--space-md)}.stats-grid{grid-template-columns:repeat(2,1fr)}}