*, *::before, *::after {
    box-sizing: border-box;
}

*, :after, :before {
    box-sizing: border-box;
}

* {
    padding: 0;
    margin: 0;
}

.dark td {
    color: #fff;
}

.light td {
    color: #000;
}

#download-table {
    width: 100%;
	margin: 10px 0;
}

#download-table thead {
    background: #2e8fc2;
    background: -webkit-linear-gradient(#2e8fc2, #006599);
    background: -o-linear-gradient(#2e8fc2, #006599);
    background: -moz-linear-gradient(#2e8fc2, #006599);
    background: linear-gradient(#2e8fc2, #006599);
}

#download-table thead th {
    text-align: center;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
    padding: 15px 0;
	color: #fff;
}

#download-table tbody tr {
    cursor: pointer;
}

.dark #download-table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.2);
}
.light #download-table tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.2);
}

#download-table tbody tr td {
    font-size: 12px;
    text-align: center;
    padding: 10px 0;
}

#download-table ul.languages-list {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

#download-table ul.languages-list > li {
    display: inline-block;
    margin-right: 5px;
}

#download-table ul.languages-list > li > img {
    max-height: 20px;
    max-width: 20px;
    border-radius: 2px;
}
#download-table  th:nth-child(3),
#download-table  td:nth-child(3),
#download-table  th:nth-child(4),
#download-table  td:nth-child(4),
#download-table  th:nth-child(5),
#download-table  td:nth-child(5)
 {display: none;}
@media (max-width: 500px) {
    .hide-on-mobile {
        display: none;
    }
}

/* .streams styling — added by Claude, this markup had no CSS at all before */
#streams {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 0;
  font-family: Roboto, Arial, sans-serif;
}

.streams {
  display: block !important;
  text-decoration: none !important;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  padding: 6px 14px;
  transition: background .15s, border-color .15s;
}

.dark .streams { color: #fff; }
.light .streams { color: #111; background: rgba(0, 0, 0, 0.04); border-color: rgba(0, 0, 0, 0.12); }

.streams:hover {
  border-color: #2e8fc2;
}

.dark .streams:hover { background: rgba(255, 255, 255, 0.12); }
.light .streams:hover { background: rgba(0, 0, 0, 0.08); }

.streams > div {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 12px;
}

.streaming {
  display: flex;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  flex: 1 1 auto;
  min-width: 0;
}

.streaming img {
  border-radius: 4px;
  flex: 0 0 auto;
}

.quality {
  flex: 0 0 auto;
}

.quality mark {
  background: linear-gradient(#2e8fc2, #006599);
  color: #fff;
  padding: 3px 10px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}