caption { text-align: left; font-weight: 700; padding-top: 10px; }
th:not(:first-child), td { text-align: center; font-family: ui-monospace, monospace; }
tbody th { font-weight: 500; }
tbody tr.selected { background: #eaf4f0; }
td { font-size: 1.15rem; }
td.empty { color: #687778; }
.range-fields, .conversion-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 20px 0; }
label { display: block; }
input, select, textarea { display: block; margin: 8px 0 16px; }
textarea { width: 100%; box-sizing: border-box; border: 1px solid #8caba7; border-radius: 10px; padding: 12px; font: 1rem/1.6 ui-monospace, monospace; }
.conversion-grid input { width: 100%; box-sizing: border-box; }
.small, #bytes-help { font-size: .9rem; color: #526367; }
pre { white-space: pre-wrap; }
[data-error="true"] { color: #a12828; }
@media (max-width: 600px) { .range-fields, .conversion-grid { grid-template-columns: 1fr; gap: 8px; } th, td { padding: 7px 4px; } select { max-width: 100%; } }