.city-state-container{display:flex;flex-direction:column;height:100%;width:100%;padding:20px;box-sizing:border-box}.city-state-container h1{margin-top:0;margin-bottom:20px;font-size:24px}.search-container{margin-bottom:20px}.search-input{width:100%;max-width:400px;padding:10px 15px;border:1px solid #ccc;border-radius:6px;font-size:14px;box-shadow:0 2px 4px #0000000d;transition:border-color .2s,box-shadow .2s}.search-input:focus{border-color:#4287f5;box-shadow:0 0 0 3px #4287f526;outline:none}.data-container{width:100%;overflow-x:hidden;box-shadow:0 4px 12px #0000001a;border-radius:8px;background-color:#fff}.table-wrapper{width:100%;max-height:60vh;overflow-y:auto;overflow-x:hidden;border-radius:8px;scrollbar-width:auto;scrollbar-color:#ccc #f8f9fa}.table-wrapper::-webkit-scrollbar{width:14px}.table-wrapper::-webkit-scrollbar-track{background:#f8f9fa;border-radius:0;box-shadow:inset 0 0 4px #0000000d}.table-wrapper::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:8px;border:3px solid #f8f9fa;min-height:40px}.table-wrapper::-webkit-scrollbar-thumb:hover{background-color:#aaa}.city-state-table{width:100%;border-collapse:collapse;text-align:left}.city-state-table th{padding:12px 15px;background-color:#f8f9fa;color:#333;font-weight:600;border-bottom:2px solid #e9ecef;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background-color .2s}.city-state-table thead{position:sticky;top:0;z-index:1;background-color:#f8f9fa}.city-state-table th:hover{background-color:#e9ecef}.city-state-table td{padding:10px 15px;border-bottom:1px solid #e9ecef;color:#495057}.city-state-table tr:hover{background-color:#f8f9fa}.city-state-table tr:last-child td{border-bottom:none}.count-cell{font-weight:600;text-align:center;color:#4287f5}.empty-data{padding:30px;text-align:center;color:#6c757d;font-style:italic}.loading-indicator{padding:20px;text-align:center;font-weight:700;color:#555}.error-message{padding:20px;margin-bottom:20px;background-color:#ffecec;color:#d8000c;border-radius:4px;border-left:5px solid #d8000c}.data-summary{margin-top:12px;padding:10px;background-color:#f8f9fa;color:#0a0f43;border-radius:4px;font-size:14px}.column-header{display:flex;align-items:center;gap:8px;justify-content:space-between}.sort-indicator{display:inline-block;font-weight:700;font-size:14px;color:#333}.sort-indicator-placeholder{width:14px;display:inline-block}