:root {
    --fit-high: #16a06a;
    --fit-good: #8fb53a;
    --fit-mid: #e0a21a;
    --fit-low-mid: #d85a30;
    --fit-low: #e24b4a;
    --documentation-matched: #527aa3;
    --documentation-undetermined: #7b858e;
}

html[data-theme="dark"] {
    --replication-layer-0: #e69f00;
    --replication-layer-1: #56b4e9;
    --replication-layer-2: #009e73;
    --replication-layer-3: #f0e442;
    --replication-layer-4: #0072b2;
    --replication-layer-5: #d55e00;
    --replication-layer-6: #cc79a7;
    --replication-layer-7: #bdbdbd;
}

html[data-theme="light"] {
    --replication-layer-0: #b66d00;
    --replication-layer-1: #0072b2;
    --replication-layer-2: #00845f;
    --replication-layer-3: #8f7600;
    --replication-layer-4: #005f95;
    --replication-layer-5: #c24e00;
    --replication-layer-6: #a65086;
    --replication-layer-7: #5f6870;
}

.replications-main {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.replications-disclaimer {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--fit-mid) 45%, var(--border));
    border-left: 3px solid var(--fit-mid);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--fit-mid) 12%, var(--surface));
}

.replications-disclaimer-tag {
    flex: none;
    margin-top: 1px;
    padding: 3px 9px;
    border: 1px solid color-mix(in srgb, var(--fit-mid) 55%, var(--border));
    border-radius: 999px;
    color: var(--fit-mid);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.replications-disclaimer p {
    margin: 0;
    color: var(--text);
    font-size: 0.9rem;
    line-height: 1.55;
}

.replications-hero {
    display: grid;
    gap: 8px;
    padding: 10px;
    border-left: 2px solid var(--accent);
}

.replications-kicker,
.replication-context-eyebrow,
.replication-section-label {
    color: var(--accent);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.replications-title {
    margin: 0;
    color: var(--text);
    font-size: 1.2rem;
    line-height: 1.2;
}

.replications-lede,
.replications-count,
.replications-note,
.replication-muted {
    margin: 0;
    color: var(--text-dim);
    font-size: 0.86rem;
    line-height: 1.5;
}

.replications-note a,
.replication-link {
    color: var(--accent);
    font-weight: 750;
    text-decoration: none;
}

.replications-note a:hover,
.replication-link:hover {
    text-decoration: underline;
}

.replications-panel {
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.replications-panel-title {
    margin: 0 0 10px;
    color: var(--accent);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.variant-chip:focus-visible,
.replication-stack-link:focus-visible,
.replication-compare-toggle:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.score-guide {
    display: grid;
    gap: 10px;
}

.score-guide .replications-panel-title {
    margin-bottom: 0;
}

.score-guide-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.score-guide-axis {
    display: grid;
    gap: 7px;
    padding: 10px;
    border: 1px solid var(--border);
    background: var(--surface2);
}

.documentation-state-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.score-threshold-note {
    font-size: 0.72rem;
}

.fit-scale-legend {
    display: grid;
    gap: 5px;
    max-width: 620px;
}

.fit-scale-gradient {
    height: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: linear-gradient(
        90deg,
        var(--fit-low) 0%,
        #dd7a2f 20%,
        var(--fit-mid) 40%,
        #9bb32a 60%,
        #5faa2e 80%,
        var(--fit-high) 100%
    );
}

.fit-scale-ticks,
.fit-scale-bands {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.fit-scale-ticks {
    color: var(--text-soft);
    font-family: var(--font-data);
    font-size: 0.63rem;
}

.fit-scale-bands {
    color: var(--text-dim);
    font-size: 0.65rem;
}

.fit-scale-hatch-key {
    display: inline-flex;
    width: fit-content;
    gap: 6px;
    align-items: center;
    color: var(--text-soft);
    font-size: 0.66rem;
}

.fit-scale-hatch-key::before {
    width: 22px;
    height: 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background:
        repeating-linear-gradient(
            45deg,
            color-mix(in srgb, var(--text) 18%, transparent) 0 2px,
            transparent 2px 5px
        ),
        var(--surface3);
    content: "";
}

.replications-results-head {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.replications-results-title {
    margin: 0;
    color: var(--text);
    font-size: 0.94rem;
}

.replications-table-wrap {
    min-width: 0;
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface2);
}

.replications-table {
    width: 100%;
    min-width: 1000px;
    border-collapse: collapse;
    table-layout: fixed;
}

.replications-table th {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border-strong, var(--border));
    background: var(--surface3);
    color: var(--text-soft);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-align: left;
    text-transform: uppercase;
}

.replications-table th:nth-child(1) { width: 16%; }
.replications-table th:nth-child(2) { width: 34%; }
.replications-table th:nth-child(3) { width: 17%; }
.replications-table th:nth-child(4) { width: 33%; }

.replications-table td {
    min-width: 0;
    padding: 11px 10px;
    border-top: 1px solid var(--border);
    vertical-align: top;
    transition: background-color 120ms ease;
}

.replications-table tbody tr:first-child td {
    border-top: 0;
}

.replications-table-row:hover td,
.replications-table-row:focus-within td {
    background: color-mix(in srgb, var(--accent-soft) 58%, var(--surface2));
}

.replication-source-cell,
.replication-stack-cell,
.replication-reference-cell {
    overflow-wrap: anywhere;
}

.replication-source-cell > *,
.replication-stack-cell > *,
.replication-reference-cell > * {
    display: block;
}

.replication-source-cell > * + *,
.replication-stack-cell > * + *,
.replication-reference-cell > * + * {
    margin-top: 4px;
}

.replication-reference-title {
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 500;
    line-height: 1.35;
}

.replication-stack-link {
    width: fit-content;
    color: var(--accent);
    font-size: 0.78rem;
}

.replication-stack-link:hover {
    color: var(--accent);
    text-decoration: underline;
}

.replication-cell-note {
    color: var(--text-soft);
    font-size: 0.73rem;
    line-height: 1.42;
}

.replication-source-cell .replication-link {
    width: fit-content;
    font-family: var(--font-data);
    font-size: 0.7rem;
    font-weight: 600;
}

.replication-score-cell {
    padding-top: 10px;
}

.replication-score-stack {
    display: grid;
    gap: 6px;
    justify-items: start;
}

.replication-stack-strip {
    display: flex;
    width: 100%;
    min-width: 0;
    height: 22px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 0;
    background: var(--surface2);
}

.replication-stack-strip.is-empty {
    align-items: center;
    justify-content: center;
    color: var(--text-soft);
    font-size: 0.66rem;
}

.replication-stack-segment {
    position: relative;
    isolation: isolate;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0 10px;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    color: #ffffff;
    font-size: 0.6rem;
    font-weight: 700;
    white-space: nowrap;
}

.replication-stack-label {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.16);
}

.replication-stack-strip.is-dense .replication-stack-segment {
    padding-inline: 8px;
    font-size: 0.56rem;
}

.replication-stack-segment.is-incident {
    background: var(--incident-boundary);
}

.replication-stack-segment.is-substrate {
    background: var(--substrate-boundary);
}

.replication-stack-segment.layer-color-0 { background: var(--replication-layer-0); }
.replication-stack-segment.layer-color-1 { background: var(--replication-layer-1); }
.replication-stack-segment.layer-color-2 { background: var(--replication-layer-2); }
.replication-stack-segment.layer-color-3 { background: var(--replication-layer-3); }
.replication-stack-segment.layer-color-4 { background: var(--replication-layer-4); }
.replication-stack-segment.layer-color-5 { background: var(--replication-layer-5); }
.replication-stack-segment.layer-color-6 { background: var(--replication-layer-6); }
.replication-stack-segment.layer-color-7 { background: var(--replication-layer-7); }

html[data-theme="dark"] .replication-stack-segment.is-incident,
html[data-theme="dark"] .replication-stack-segment.layer-color-0,
html[data-theme="dark"] .replication-stack-segment.layer-color-1,
html[data-theme="dark"] .replication-stack-segment.layer-color-3,
html[data-theme="dark"] .replication-stack-segment.layer-color-7 {
    color: #111111;
}

html[data-theme="light"] .replication-stack-segment {
    color: #ffffff;
}

.variant-chip,
.replication-badge {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 5px;
    min-height: 25px;
    padding: 3px 7px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--text);
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
}

button.variant-chip {
    font-family: inherit;
    cursor: pointer;
}

.variant-chip:hover,
.variant-chip[aria-pressed="true"] {
    border-color: var(--accent);
    background: var(--accent-soft);
    text-decoration: none;
}

.fit-score-summary {
    display: grid;
    width: min(100%, 170px);
    gap: 3px;
}

.fit-score-meter {
    position: relative;
    width: 100%;
    height: 9px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--fit-color) 22%, var(--border));
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--fit-color) 12%, var(--surface2));
}

.fit-score-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--fit-width, 0%);
    border-radius: 2px;
    background: var(--fit-color);
}

.fit-score-range {
    position: absolute;
    z-index: 2;
    top: 2px;
    bottom: 2px;
    left: var(--fit-range-left, 0%);
    width: max(var(--fit-range-width, 0%), 2px);
    border-radius: 999px;
    background: color-mix(in srgb, var(--documentation-matched) 52%, transparent);
}

.fit-score-range::before,
.fit-score-range::after {
    position: absolute;
    top: -2px;
    bottom: -2px;
    width: 1px;
    background: var(--documentation-matched);
    content: "";
}

.fit-score-range::before { left: 0; }
.fit-score-range::after { right: 0; }

.fit-score-point {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: var(--fit-width, 0%);
    width: 5px;
    height: 9px;
    border: 1px solid var(--surface2);
    border-radius: 999px;
    background: var(--fit-color);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--fit-color) 70%, var(--text));
    transform: translate(-50%, -50%);
}

.fit-score-meter.is-matched .fit-score-fill {
    opacity: 0.38;
}

.fit-score-meter.is-hatched .fit-score-fill {
    background-color: color-mix(in srgb, var(--fit-color) 50%, var(--surface3));
    background-image: repeating-linear-gradient(
        45deg,
        color-mix(in srgb, var(--text) 20%, transparent) 0 2px,
        transparent 2px 5px
    );
}

.fit-score-label,
.replication-fit-metrics {
    color: var(--text-soft);
    font-family: var(--font-data);
    font-size: 0.63rem;
    line-height: 1.35;
}

.documentation-state-chip,
.not-scored-chip {
    display: inline-flex;
    width: fit-content;
    min-height: 21px;
    align-items: center;
    padding: 2px 6px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface3);
    color: var(--text-dim);
    font-size: 0.63rem;
    font-weight: 700;
    line-height: 1.25;
}

.documentation-state-chip.is-documented {
    border-color: color-mix(in srgb, var(--fit-high) 48%, var(--border));
    background: color-mix(in srgb, var(--fit-high) 12%, var(--surface3));
    color: var(--text);
}

.documentation-state-chip.is-substituted {
    border-color: color-mix(in srgb, var(--fit-mid) 48%, var(--border));
    background: color-mix(in srgb, var(--fit-mid) 12%, var(--surface3));
}

.documentation-state-chip.is-matched {
    border-color: color-mix(in srgb, var(--documentation-matched) 50%, var(--border));
    background: color-mix(in srgb, var(--documentation-matched) 12%, var(--surface3));
    color: var(--text);
}

.documentation-state-chip.is-undetermined {
    border-color: color-mix(in srgb, var(--documentation-undetermined) 50%, var(--border));
    background: color-mix(in srgb, var(--documentation-undetermined) 14%, var(--surface3));
}

.not-scored-chip {
    border-style: dashed;
    background: repeating-linear-gradient(
        45deg,
        color-mix(in srgb, var(--border) 68%, transparent) 0 3px,
        transparent 3px 7px
    );
    color: var(--text-soft);
}

.fit-scale-range-key {
    color: var(--text-soft);
    font-size: 0.66rem;
}

.fit-scale-range-key::before {
    display: inline-block;
    width: 22px;
    height: 3px;
    margin-right: 6px;
    background: var(--documentation-matched);
    content: "";
    vertical-align: middle;
}

.not-computable-appendix > summary {
    display: flex;
    cursor: pointer;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 750;
}

.not-computable-appendix[open] > summary {
    margin-bottom: 10px;
}

.not-computable-table th:nth-child(1) { width: 22%; }
.not-computable-table th:nth-child(2) { width: 34%; }

.replications-pagination {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.replications-load-more {
    min-height: 32px;
    padding: 0 11px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface2);
    color: var(--text);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 800;
    cursor: pointer;
}

.replications-load-more:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.replications-empty {
    padding: 18px 10px;
    border: 1px dashed var(--border);
    border-radius: var(--radius);
    color: var(--text-dim);
    text-align: center;
}

/* Calculator-first replication context */

.replication-context {
    margin: 0 0 10px;
}

.replication-context:empty {
    display: none;
}

body.corpus-audit-only #simulation-form,
body.corpus-audit-only > .skip-link {
    display: none;
}

.replication-context-shell {
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid var(--border);
    border-left: 2px solid var(--accent);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}

.replication-context-bar {
    display: grid;
    grid-template-columns: minmax(150px, auto) minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
}

.replication-context-status {
    display: grid;
    gap: 5px;
    align-content: center;
    justify-items: start;
}

.replication-context-coordinate {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 8px;
    align-items: center;
}

.replication-context-coordinate .fit-score-summary {
    width: 132px;
}

.replication-context-main {
    display: grid;
    min-width: 0;
    gap: 5px;
}

.replication-context-title {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 0.84rem;
    font-weight: 800;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.replication-context-meta {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    gap: 4px 9px;
    align-items: center;
}

.replication-citation-short,
.replication-headline {
    color: var(--text-soft);
    font-size: 0.73rem;
    line-height: 1.35;
}

.replication-headline {
    font-family: var(--font-data);
}

.replication-context-meta .replication-link {
    font-size: 0.72rem;
}

.replication-variant-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.replication-compare-toggle {
    display: grid;
    grid-template-columns: auto 31px;
    height: 32px;
    min-height: 32px;
    align-items: stretch;
    gap: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: transparent;
    color: var(--text);
    font: inherit;
    font-size: 0.74rem;
    font-weight: 800;
    cursor: pointer;
}

.replication-compare-toggle > span:first-child {
    display: flex;
    align-items: center;
    padding: 0 10px;
}

.replication-compare-toggle:hover,
.replication-compare-toggle[aria-expanded="true"] {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
}

.replication-toggle-glyph {
    display: flex;
    min-width: 31px;
    min-height: 100%;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--border);
    font-family: var(--font-data);
    font-size: 0.9rem;
    line-height: 1;
}

.replication-context-panel {
    display: none;
    margin-top: 9px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

.replication-context-shell.is-open .replication-context-panel {
    display: block;
}

.replication-evidence-workspace {
    display: grid;
    gap: 12px;
}

.replication-evidence-visual-grid,
.replication-evidence-summary-grid,
.replication-evidence-ledger {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

.replication-evidence-summary-grid-single,
.replication-evidence-ledger {
    grid-template-columns: minmax(0, 1fr);
}

.replication-evidence-visual,
.replication-evidence-plot,
.replication-context-card {
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface2);
}

.replication-evidence-visual {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

.replication-evidence-head {
    display: flex;
    min-height: 48px;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
}

.replication-evidence-head > div:first-child {
    display: grid;
    gap: 2px;
}

.replication-evidence-head h2 {
    margin: 0;
    color: var(--text);
    font-size: 0.9rem;
    line-height: 1.25;
}

.replication-chart-wrap {
    aspect-ratio: 860 / 420;
    min-width: 0;
    background: var(--chart-bg);
    overflow: hidden;
}

.replication-chart {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    background: var(--chart-bg);
}

.replication-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 9px;
    justify-content: flex-end;
    color: var(--text-dim);
    font-size: 0.68rem;
}

.replication-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.replication-legend-line {
    width: 17px;
    height: 2px;
}

.replication-visual-footer {
    min-height: 48px;
    padding: 7px 10px;
    border-top: 1px solid var(--border);
    color: var(--text-soft);
    font-size: 0.68rem;
    line-height: 1.4;
}

.replication-chart-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
    gap: 8px 14px;
    align-items: center;
}

.replication-chart-note,
.replication-chart-readout {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.68rem;
    line-height: 1.4;
}

.replication-chart-readout {
    color: var(--text-dim);
    font-family: var(--font-data);
    text-align: right;
}

.replication-context-card {
    display: grid;
    gap: 9px;
    padding: 11px;
}

.replication-assessment-card {
    border-left: 3px solid var(--accent);
}

.replication-card-head {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

.replication-context-card h3 {
    margin: 0;
    color: var(--accent);
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.replication-anchor-value {
    padding: 8px;
    border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border));
    background: color-mix(in srgb, var(--accent) 7%, transparent);
    color: var(--text);
    font-family: var(--font-data);
    font-size: 0.75rem;
    line-height: 1.4;
}

.replication-fit-assessment {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 12px;
    align-items: center;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface2);
}

.replication-fit-assessment .fit-score-summary {
    width: min(100%, 230px);
}

.replication-claim-block {
    display: grid;
    gap: 3px;
}

.replication-claim-block > span {
    color: var(--text-soft);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.replication-claim-block p,
.replication-card-footnote {
    margin: 0;
    color: var(--text-dim);
    font-size: 0.74rem;
    line-height: 1.45;
}

.replication-ensemble-card {
    border-left: 3px solid var(--documentation-matched);
}

.replication-ensemble-table-wrap {
    max-height: 300px;
    overflow: auto;
    border: 1px solid var(--border);
}

.replication-ensemble-table {
    width: 100%;
    border-collapse: collapse;
    color: var(--text-dim);
    font-size: 0.68rem;
}

.replication-ensemble-table th,
.replication-ensemble-table td {
    padding: 6px 8px;
    border-top: 1px solid var(--border);
    overflow-wrap: anywhere;
    text-align: left;
}

.replication-ensemble-table thead {
    position: sticky;
    z-index: 1;
    top: 0;
    background: var(--surface3);
}

.replication-ensemble-table th {
    color: var(--text-soft);
    font-size: 0.62rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.replication-card-footnote {
    padding-top: 7px;
    border-top: 1px solid var(--border);
    color: var(--text-soft);
    font-size: 0.67rem;
}

.replication-data-list,
.replication-nk-list,
.replication-sensitivity-list {
    display: grid;
    gap: 0;
    margin: 0;
}

.replication-data-row,
.replication-nk-row,
.replication-sensitivity-row {
    display: grid;
    grid-template-columns: minmax(92px, 0.36fr) minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    padding: 6px 0;
    border-top: 1px solid var(--border);
    color: var(--text-dim);
    font-size: 0.72rem;
    line-height: 1.4;
}

.replication-data-row:first-child,
.replication-nk-row:first-child,
.replication-sensitivity-row:first-child {
    padding-top: 0;
    border-top: 0;
}

.replication-data-row dt,
.replication-nk-row dt,
.replication-sensitivity-row dt {
    color: var(--text-soft);
    font-weight: 800;
}

.replication-data-row dd,
.replication-nk-row dd,
.replication-sensitivity-row dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.replication-sensitivity-bar {
    position: relative;
    display: block;
    height: 5px;
    margin-top: 4px;
    background: var(--surface3);
    overflow: hidden;
}

.replication-sensitivity-bar::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: var(--border-strong, var(--border));
    content: "";
}

.replication-sensitivity-bar span {
    position: absolute;
    top: 0;
    left: 50%;
    width: var(--bar-width, 0%);
    height: 100%;
    background: var(--accent);
    transform: translateX(var(--bar-shift, 0%));
}

.replication-row-second {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.replication-input-card {
    padding: 0;
    overflow: hidden;
}

.replication-input-card-head {
    display: flex;
    min-height: 44px;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: center;
    justify-content: space-between;
    padding: 9px 10px;
    border-bottom: 1px solid var(--border);
}

.replication-input-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    color: var(--text-soft);
    font-size: 0.66rem;
    font-weight: 750;
}

.replication-input-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.replication-input-legend span::before {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--input-color);
    content: "";
}

.input-documented { --input-color: var(--fit-high); }
.input-substituted { --input-color: var(--fit-mid); }
.input-matched { --input-color: var(--documentation-matched); }
.input-undetermined { --input-color: var(--documentation-undetermined); }

.replication-input-table-wrap {
    max-height: 520px;
    overflow: auto;
}

.replication-input-table {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
    table-layout: fixed;
    color: var(--text-dim);
    font-size: 0.71rem;
    line-height: 1.4;
}

.replication-input-table thead {
    position: sticky;
    z-index: 1;
    top: 0;
}

.replication-input-table th,
.replication-input-table td {
    padding: 7px 9px;
    border-top: 1px solid var(--border);
    vertical-align: top;
    overflow-wrap: anywhere;
    text-align: left;
}

.replication-input-table thead th {
    border-top: 0;
    background: var(--surface3);
    color: var(--text-soft);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.replication-input-table th:nth-child(1) { width: 92px; }
.replication-input-table th:nth-child(2) { width: 150px; }
.replication-input-table th:nth-child(3) { width: 124px; }

.row-input-documentation {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    color: var(--text-soft);
    font-size: 0.65rem;
    font-weight: 700;
}

.row-input-documentation.is-documented {
    color: var(--fit-high);
}

.row-input-documentation.is-matched {
    color: var(--documentation-matched);
}

.replication-input-row {
    --input-color: var(--documentation-undetermined);
    background: color-mix(in srgb, var(--input-color) 7%, var(--surface2));
}

.replication-input-row.input-documented { --input-color: var(--fit-high); }
.replication-input-row.input-matched { --input-color: var(--documentation-matched); }
.replication-input-row.input-substituted { --input-color: var(--fit-mid); }
.replication-input-row.input-undetermined { --input-color: var(--documentation-undetermined); }

.replication-input-row > :first-child {
    border-left: 4px solid var(--input-color);
    color: var(--text);
    font-family: var(--font-data);
    font-weight: 750;
}

.replication-context-card > p {
    margin: 0;
}

.replication-figure-stage {
    display: flex;
    aspect-ratio: 860 / 420;
    min-width: 0;
    align-items: center;
    justify-content: center;
    padding: 8px;
    overflow: hidden;
    background: #ffffff;
}

.replication-figure-stage img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.replication-figure-placeholder {
    display: grid;
    max-width: 340px;
    gap: 6px;
    justify-items: center;
    padding: 18px;
    color: var(--text-soft);
    font-size: 0.72rem;
    line-height: 1.45;
    text-align: center;
}

.replication-figure-placeholder strong {
    color: var(--text-dim);
    font-size: 0.76rem;
}

.replication-figure-footer {
    display: grid;
    gap: 4px;
}

.replication-figure-footer p {
    margin: 0;
}

.replication-review-card {
    grid-column: 1 / -1;
}

@media (max-width: 1040px) {
    .replication-evidence-visual-grid,
    .replication-evidence-summary-grid,
    .replication-evidence-ledger {
        grid-template-columns: minmax(0, 1fr);
    }

    .replication-review-card {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .score-guide-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .replications-table-wrap {
        overflow: visible;
    }

    .replications-table {
        min-width: 0;
    }

    .replications-table thead {
        display: none;
    }

    .replications-table,
    .replications-table tbody,
    .replications-table tr,
    .replications-table td {
        display: block;
        width: 100%;
    }

    .replications-table-row + .replication-table-row {
        border-top: 1px solid var(--border-strong, var(--border));
    }

    .replications-table td,
    .replications-table tbody tr:first-child td {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 3px 9px;
        padding: 8px 9px;
        border-top: 1px solid var(--border);
    }

    .replications-table tr td:first-child,
    .replications-table tbody tr:first-child td:first-child {
        border-top: 0;
    }

    .replications-table td::before {
        grid-row: 1 / span 6;
        color: var(--text-soft);
        content: attr(data-label);
        font-size: 0.64rem;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .replications-table td > * {
        grid-column: 2;
    }

    .replication-context-bar {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
    }

    .replication-context-status {
        grid-column: 1;
    }

    .replication-context-main {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .replication-compare-toggle {
        grid-column: 2;
        grid-row: 1;
    }

    .replication-context-title {
        white-space: normal;
    }

    .replication-evidence-head,
    .replication-chart-footer {
        grid-template-columns: 1fr;
    }

    .replication-evidence-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .replication-legend {
        justify-content: flex-start;
    }

    .replication-chart-readout {
        min-height: 1em;
        text-align: left;
    }
}

@media (max-width: 480px) {
    .replications-disclaimer {
        display: grid;
    }

    .replication-compare-toggle > span:first-child {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .replication-compare-toggle {
        width: 31px;
        grid-template-columns: 31px;
        padding: 0;
    }

    .replication-toggle-glyph {
        border-left: 0;
    }

    .replications-table td,
    .replications-table tbody tr:first-child td {
        grid-template-columns: 74px minmax(0, 1fr);
    }

    .replication-data-row,
    .replication-nk-row,
    .replication-sensitivity-row {
        grid-template-columns: 1fr;
        gap: 3px;
    }
}
