/* modbase-decoder: decoding MM and ML, module 7 (content/academy/genetics-for-data-scientists/module-7.md). */
.modbase-decoder__buttons { display: inline-flex; flex-wrap: wrap; gap: var(--spacing-4); }
.modbase-decoder__radio { display: inline-flex; align-items: baseline; gap: var(--spacing-4); }
.modbase-decoder__value { font-family: var(--font-family-mono); }
.modbase-decoder__summary { margin-bottom: var(--spacing-12); color: var(--text-primary); font-size: var(--font-size-14); }
.modbase-decoder__summary p { margin-bottom: var(--spacing-4); }
.modbase-decoder__plot-wrap { overflow-x: auto; margin-bottom: var(--spacing-12); }
.modbase-decoder__plot { display: block; width: 100%; min-width: var(--width-672); height: auto; font-family: var(--font-family-body); font-size: var(--font-size-12); }
.modbase-decoder__label { fill: var(--text-secondary); }
.modbase-decoder__grid { stroke: var(--border-subtle); stroke-width: 1; }
.modbase-decoder__threshold { stroke: var(--text-danger); stroke-width: 1; stroke-dasharray: 4 3; }
.modbase-decoder__feature { fill: var(--text-secondary); }
.modbase-decoder__points { fill: none; stroke: var(--text-primary); stroke-width: 4; stroke-linecap: round; }
.modbase-decoder__points--off { stroke: var(--text-danger); stroke-width: 5; }
.modbase-decoder__table-wrap { overflow-x: auto; margin-bottom: var(--spacing-12); }
.modbase-decoder__table { width: 100%; border-collapse: collapse; font-size: var(--font-size-12); }
.modbase-decoder__table th { padding: var(--spacing-2) var(--spacing-8); border-bottom: var(--stroke-weight-1) solid var(--border-default); color: var(--text-tertiary); font-weight: var(--font-weight-600); text-align: left; white-space: nowrap; }
.modbase-decoder__table td { padding: var(--spacing-2) var(--spacing-8); color: var(--text-primary); font-family: var(--font-family-mono); white-space: nowrap; }
.modbase-decoder__row--off td { color: var(--text-danger); }
.modbase-decoder__strip { overflow-x: auto; padding: var(--spacing-8); background-color: var(--background-surface-2); font-family: var(--font-family-mono); font-size: var(--font-size-14); }
.modbase-decoder__row { display: flex; white-space: pre; }
.modbase-decoder__row-label { display: inline-block; width: var(--spacing-80); flex: none; color: var(--text-tertiary); font-size: var(--font-size-12); }
.modbase-decoder__cell { display: inline-block; width: var(--spacing-12); flex: none; text-align: center; color: var(--text-primary); }
.modbase-decoder__cell--ref { color: var(--text-tertiary); }
.modbase-decoder__cell--called { font-weight: var(--font-weight-700); text-decoration: underline; }
.modbase-decoder__cell--methylated { color: var(--text-primary); }
.modbase-decoder__cell--unmethylated { color: var(--text-danger); }