:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#333;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body,html,div{box-sizing:border-box}#root{width:100%;min-height:100vh}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;background:#fff}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid #e5e5e5;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#fff;color:#333;cursor:pointer;transition:border-color .25s}button:hover{border-color:#999;background-color:#f8f8f8}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#333;background-color:#fff}a:hover{color:#646cff}button{background-color:#fff;color:#333}}.table-container table{display:block!important;border-collapse:separate;border-spacing:0}.table-container thead,.table-container tbody{display:block!important}.table-container tr{display:flex!important;border:none}.table-container th,.table-container td{display:flex!important;align-items:center;border:none;padding:0;margin:0}.table-container th{font-weight:inherit;text-align:inherit;vertical-align:inherit}.table-container td{vertical-align:inherit}.table-container *{box-sizing:border-box}.table-container table,.table-container thead,.table-container tbody,.table-container tr,.table-container th,.table-container td{margin:0;padding:0}.virtualized-table-container{max-width:1400px;margin:0 auto;padding:2rem;min-height:100vh}.controls{margin-bottom:2rem;padding:1.5rem;background:#fff;border:1px solid #e5e5e5;border-radius:12px;box-shadow:0 2px 8px #0000001a}.controls h1{font-size:2.5rem;font-weight:700;margin-bottom:1rem;background:linear-gradient(135deg,#646cff,#61dafb);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-align:center}.search-controls{display:flex;gap:1rem;margin-bottom:1rem;align-items:center;flex-wrap:wrap}.search-input{flex:1;min-width:200px;padding:.75rem 1rem;border:2px solid #e5e5e5;border-radius:8px;font-size:1rem;transition:border-color .2s}.search-input:focus{outline:none;border-color:#646cff}.column-toggle{padding:.75rem 1rem;border:2px solid #e5e5e5;border-radius:8px;font-size:1rem;background:#fff;cursor:pointer;min-width:200px}.column-toggle:focus{outline:none;border-color:#646cff}.table-stats{display:flex;gap:1rem;align-items:center;font-size:.9rem;color:#666;justify-content:center}.header-cell{background:#f8f9fa!important;border-right:1px solid #dee2e6;display:flex;align-items:center;font-weight:600;-webkit-user-select:none;user-select:none}.header-cell:hover{background:#e9ecef!important}.cell{background:#fff;border-right:1px solid #eee;transition:background-color .2s}.editable-cell-input{width:100%;padding:5px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box}.editable-cell-display{width:100%;height:100%;padding:5px;box-sizing:border-box;cursor:pointer;display:flex;align-items:center}.editable-cell-display:hover{background-color:#f0f0f0}.email-link{color:#646cff;text-decoration:none}.email-link:hover{text-decoration:underline}.department-badge,.status-badge{padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em}.department-badge.engineering{background:#e3f2fd;color:#1565c0}.department-badge.design{background:#f3e5f5;color:#7b1fa2}.department-badge.marketing{background:#e8f5e8;color:#2e7d32}.department-badge.sales{background:#fff3e0;color:#ef6c00}.department-badge.hr{background:#fce4ec;color:#c2185b}.department-badge.finance{background:#e0f2f1;color:#00695c}.department-badge.operations{background:#f1f8e9;color:#558b2f}.department-badge.legal{background:#e8eaf6;color:#3f51b5}.department-badge.research{background:#fff8e1;color:#ff8f00}.department-badge.customer{background:#ede7f6;color:#673ab7}.status-badge.active{background:#e8f5e8;color:#2e7d32}.status-badge.inactive{background:#ffebee;color:#c62828}.visibility-controls{display:flex;flex-wrap:wrap;gap:.75rem}.checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9rem;color:#333}.checkbox-label input[type=checkbox]{margin:0}.pinning-controls{display:flex;flex-wrap:wrap;gap:.5rem}.pin-select{padding:.5rem;border:1px solid #e5e5e5;border-radius:6px;background:#fff;color:#333;font-size:.9rem;min-width:140px}.action-controls{display:flex;flex-wrap:wrap;gap:.5rem}.reset-btn{padding:.5rem 1rem;border:1px solid #e5e5e5;border-radius:6px;background:#fff;color:#333;cursor:pointer;transition:all .2s ease;font-size:.9rem}.reset-btn:hover{background:#f8f9fa;border-color:#ccc}.header-content{display:flex;flex-direction:column;gap:.5rem;width:100%}.header-main{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.drag-handle{cursor:grab;color:#999;font-size:.8rem;padding:.25rem;border-radius:3px;transition:all .2s ease}.drag-handle:hover{background:#f0f0f0;color:#666}.drag-handle:active{cursor:grabbing}.header-actions{display:flex;align-items:center;gap:.25rem}.pin-controls{display:flex;gap:.25rem}.pin-btn{padding:.25rem .5rem;border:1px solid #e5e5e5;border-radius:4px;background:#fff;color:#333;cursor:pointer;font-size:.8rem;transition:all .2s ease;min-width:28px;height:28px;display:flex;align-items:center;justify-content:center}.pin-btn:hover:not(:disabled){background:#f8f9fa;border-color:#ccc}.pin-btn:disabled{opacity:.4;cursor:not-allowed}.header-with-filter{display:flex;flex-direction:column;gap:.5rem;width:100%}.column-filter{padding:.25rem .5rem;border:1px solid #e5e5e5;border-radius:4px;background:#fff;color:#333;font-size:.8rem;transition:all .2s ease;width:100%;box-sizing:border-box}.column-filter:focus{outline:none;border-color:#646cff;box-shadow:0 0 0 2px #646cff1a}.column-filter::placeholder{color:#999}.resizer{position:absolute;right:0;top:0;height:100%;width:5px;background:#0000001a;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;opacity:0;transition:opacity .2s ease}.resizer:hover,.resizer.isResizing{opacity:1;background:#646cff}.data-table th:hover .resizer{opacity:1}.header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;background:linear-gradient(135deg,#646cff,#61dafb);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.subtitle{font-size:1.1rem;color:#666;margin:0}.table-container{background:#fff;border:1px solid #e5e5e5;border-radius:12px;box-shadow:0 2px 8px #0000001a}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.search-box{position:relative;min-width:300px}.search-input{width:100%;padding:.75rem 2.5rem .75rem 1rem;border:1px solid #e5e5e5;border-radius:8px;background:#fff;color:#333;font-size:1rem;transition:all .3s ease}.search-input:focus{outline:none;border-color:#646cff;box-shadow:0 0 0 3px #646cff1a}.search-input::placeholder{color:#999}.search-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);color:#999}.table-info{color:#666;font-size:.9rem}.table-wrapper{overflow-x:auto;border-radius:8px;border:1px solid #e5e5e5}.data-table{width:100%;border-collapse:collapse;background:#fff}.data-table thead{background:#f8f9fa}.data-table th{padding:1rem;text-align:left;font-weight:600;color:#333;border-bottom:1px solid #e5e5e5;position:relative}.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.data-table th.sortable:hover{background:#e9ecef}.header-content{display:flex;align-items:center;justify-content:space-between}.sort-indicator{font-size:.8rem;color:#646cff;margin-left:.5rem}.data-table td{padding:1rem;border-bottom:1px solid #f0f0f0;transition:background-color .2s ease;color:#333}.data-table tbody tr:hover{background:#f8f9fa}.data-table tbody tr:last-child td{border-bottom:none}.department-badge,.status-badge{padding:.25rem .75rem;border-radius:20px;font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.department-badge.engineering{background:#8b451333;color:#deb887;border:1px solid rgba(139,69,19,.3)}.department-badge.design{background:#ff149333;color:#ff69b4;border:1px solid rgba(255,20,147,.3)}.department-badge.marketing{background:#ffa50033;color:orange;border:1px solid rgba(255,165,0,.3)}.department-badge.sales{background:#32cd3233;color:#90ee90;border:1px solid rgba(50,205,50,.3)}.department-badge.hr{background:#8a2be233;color:plum;border:1px solid rgba(138,43,226,.3)}.department-badge.finance{background:#1e90ff33;color:#87ceeb;border:1px solid rgba(30,144,255,.3)}.status-badge.active{background:#22c55e33;color:#4ade80;border:1px solid rgba(34,197,94,.3)}.status-badge.inactive{background:#ef444433;color:#f87171;border:1px solid rgba(239,68,68,.3)}.email-link{color:#646cff;text-decoration:none;transition:color .2s ease}.email-link:hover{color:#535bf2;text-decoration:underline}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem;flex-wrap:wrap;gap:1rem}.pagination-info{color:#666;font-size:.9rem}.pagination-controls{display:flex;gap:.5rem}.pagination-btn{padding:.5rem .75rem;border:1px solid #e5e5e5;border-radius:6px;background:#fff;color:#333;cursor:pointer;transition:all .2s ease;font-size:.9rem;min-width:40px}.pagination-btn:hover:not(:disabled){background:#f8f9fa;border-color:#ccc}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.page-size-select{padding:.5rem;border:1px solid #e5e5e5;border-radius:6px;background:#fff;color:#333;cursor:pointer;transition:all .2s ease}.page-size-select:focus{outline:none;border-color:#646cff;box-shadow:0 0 0 3px #646cff1a}.page-size-select option{background:#fff;color:#333}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 40px #00000026;max-width:600px;width:90%;max-height:80vh;overflow:hidden;display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid #e5e5e5;background:#f8f9fa}.modal-header h2{margin:0;font-size:1.5rem;font-weight:600;color:#333}.close-button{background:none;border:none;font-size:2rem;cursor:pointer;color:#666;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.close-button:hover{background-color:#f0f0f0}.modal-body{padding:1.5rem;overflow-y:auto;flex:1}.modal-description{margin-bottom:1rem;color:#666;font-size:.9rem}.sortable-columns-list{display:flex;flex-direction:column;gap:.5rem}.column-item-wrapper{display:flex;align-items:center;gap:.5rem;padding:.5rem;border:1px solid #e5e5e5;border-radius:6px;background:#f9f9f9;transition:all .2s}.column-item-wrapper:hover{background:#f0f0f0;border-color:#d0d0d0}.sortable-column-item{display:flex;align-items:center;gap:.5rem;flex:1;cursor:grab;padding:.5rem;border-radius:4px;transition:all .2s}.sortable-column-item:active{cursor:grabbing}.sortable-column-item.pinned-left{background:#e3f2fd;border-left:3px solid #2196f3}.sortable-column-item.pinned-right{background:#fff3e0;border-left:3px solid #ff9800}.drag-handle{font-size:12px;color:#999;cursor:grab}.column-name{font-weight:500;color:#333}.pin-indicator{font-size:.8rem;padding:.2rem .4rem;border-radius:4px;font-weight:500}.pin-indicator.pin-left{background:#2196f3;color:#fff}.pin-indicator.pin-right{background:#ff9800;color:#fff}.column-controls{display:flex;gap:.25rem}.pin-button{background:transparent;border:1px solid #ccc;border-radius:3px;padding:.25rem .5rem;font-size:.7rem;cursor:pointer;transition:all .2s}.pin-button:hover{background:#f0f0f0}.pin-button.active{background:#646cff;color:#fff;border-color:#646cff}.modal-footer{padding:1rem 1.5rem;border-top:1px solid #e5e5e5;display:flex;justify-content:flex-end;gap:.5rem}.button-primary{background:#646cff;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:6px;font-weight:500;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;gap:.5rem}.button-primary:hover{background:#5856eb}.button-secondary{background:#f8f9fa;color:#333;border:1px solid #e5e5e5;padding:.75rem 1.5rem;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s}.button-secondary:hover{background:#e9ecef;border-color:#d0d0d0}@media (max-width: 768px){.app{padding:1rem}.header h1{font-size:2rem}.table-controls{flex-direction:column;align-items:stretch}.search-box{min-width:auto}.pagination{flex-direction:column;align-items:center;text-align:center}.data-table th,.data-table td{padding:.75rem .5rem;font-size:.9rem}.department-badge,.status-badge{font-size:.75rem;padding:.2rem .5rem}}@media (max-width: 480px){.data-table th,.data-table td{padding:.5rem .25rem;font-size:.8rem}.header h1{font-size:1.5rem}.subtitle{font-size:1rem}}.header-cell{position:relative;overflow:hidden}.header-cell:hover .column-resizer{opacity:1}.column-resizer{opacity:0;transition:opacity .2s ease}.column-resizer:hover,.column-resizer.resizing{opacity:1!important;background:#2196f3!important}.header-cell .content{min-width:0;flex:1}.table-container.resizing{-webkit-user-select:none;user-select:none;cursor:col-resize}.table-container.resizing *{cursor:col-resize!important}