body{margin:0;padding:0}#root{width:100%;height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{height:100vh;display:flex;flex-direction:column;background-color:#f5f5f5}.header{background-color:#2c3e50;color:#fff;padding:1rem 2rem;box-shadow:0 2px 4px #0000001a}.header h1{margin-bottom:1rem;font-size:1.5rem}.connection-bar{display:flex;gap:1rem;align-items:center}.connection-input{flex:1;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:.9rem}.connection-input:disabled{background-color:#e0e0e0;cursor:not-allowed}.connect-btn{padding:.75rem 2rem;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;font-weight:600;transition:background-color .2s}.connect-btn:hover:not(:disabled){background-color:#2980b9}.connect-btn:disabled{background-color:#95a5a6;cursor:not-allowed}.error{background-color:#e74c3c;color:#fff;padding:.75rem;margin-top:1rem;border-radius:4px;font-size:.9rem}.main-content{display:flex;flex:1;overflow:hidden}.sidebar{width:250px;background-color:#34495e;color:#fff;overflow-y:auto;border-right:1px solid #2c3e50}.sidebar-section{padding:1rem;border-bottom:1px solid #2c3e50}.sidebar-section h3{margin-bottom:.75rem;font-size:1rem;color:#ecf0f1;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.list{list-style:none}.list li{padding:.6rem .75rem;cursor:pointer;border-radius:4px;margin-bottom:.25rem;transition:background-color .2s;font-size:.9rem}.list li:hover{background-color:#2c3e50}.list li.active{background-color:#3498db;font-weight:600}.content{flex:1;padding:2rem;overflow-y:auto;background-color:#fff}.query-section{margin-bottom:1.5rem;padding:1rem;background-color:#f8f9fa;border-radius:4px;border:1px solid #e0e0e0}.query-controls{display:flex;gap:1rem;margin-bottom:1rem}.query-input{flex:1;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-family:Courier New,monospace;font-size:.9rem}.execute-btn{padding:.75rem 2rem;background-color:#27ae60;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:600;transition:background-color .2s}.execute-btn:hover:not(:disabled){background-color:#229954}.execute-btn:disabled{background-color:#95a5a6;cursor:not-allowed}.row-limit{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.row-limit label{font-weight:600;color:#555}.row-limit select{padding:.5rem;border:1px solid #ddd;border-radius:4px;cursor:pointer}.table-container{overflow-x:auto;border:1px solid #e0e0e0;border-radius:4px}.data-table{width:100%;border-collapse:collapse;font-size:.9rem}.data-table thead{background-color:#34495e;color:#fff;position:sticky;top:0;z-index:10}.data-table th{padding:1rem;text-align:left;font-weight:600;border-bottom:2px solid #2c3e50}.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s}.data-table th.sortable:hover{background-color:#2c3e50}.sort-indicator{margin-left:.5rem;font-weight:700}.data-table tbody tr{border-bottom:1px solid #e0e0e0}.data-table tbody tr:hover{background-color:#f8f9fa}.data-table td{padding:.75rem 1rem;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table-info{padding:.75rem 1rem;background-color:#f8f9fa;border-top:1px solid #e0e0e0;font-size:.85rem;color:#666;font-weight:600}.loading{text-align:center;padding:2rem;font-size:1.1rem;color:#666}.placeholder{text-align:center;padding:4rem 2rem;color:#999}.placeholder p{font-size:1.2rem}.sidebar::-webkit-scrollbar,.content::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-track{background:#2c3e50}.sidebar::-webkit-scrollbar-thumb{background:#555;border-radius:4px}.sidebar::-webkit-scrollbar-thumb:hover{background:#666}.content::-webkit-scrollbar-track{background:#f1f1f1}.content::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.content::-webkit-scrollbar-thumb:hover{background:#555}