:root {
--link-color: #00aeef;
--border-color: #ddd;
--cell-padding: 0.6rem;
--font-base: 0.9rem;
--hover-bg: #f9f9f9;
} .table-container {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin-bottom: 1rem;
} .table-container table {
border-collapse: collapse;
font-size: var(--font-base);
width: auto;
table-layout: auto;
} .table-container thead th:first-child {
border: none;
padding: 0;
background: transparent;
} .table-container thead th:not(:first-child) {
background: #fafafa;
font-weight: 600;
padding: var(--cell-padding);
border: 1px solid var(--border-color);
text-align: left;
} .table-container th:first-child,
.table-container td:first-child {
border-left: none;
} .table-container td {
padding: var(--cell-padding);
border: 1px solid var(--border-color);
vertical-align: top;
background: #fff;
white-space: normal;
word-wrap: break-word;
word-break: normal;
hyphens: auto;
} .table-container tbody tr:hover td {
background: var(--hover-bg);
} .table-container a {
color: var(--link-color);
text-decoration: none;
}
.table-container a:hover {
text-decoration: underline;
} @media (max-width: 480px) {
.table-container table {
font-size: 0.8rem;
}
}