.nx { flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: center; gap: 5vh; }
.nx-sentence { font-size: 2.6rem; font-weight: 700; line-height: 1.25; max-width: 60rem; min-height: 2.5em; display: flex; align-items: flex-end; flex-wrap: wrap; }
.nx-blank { color: var(--s1); white-space: pre; }
.nx-barwrap { min-height: 15rem; }
.nx-bars { display: grid; gap: .9rem; max-width: 56rem; }
.nx-row { display: grid; grid-template-columns: 9rem 1fr 6rem 9rem; gap: 1.1rem; align-items: center; }
.nx-word { font-size: 1.6rem; font-weight: 700; text-align: right; }
.nx-track { height: 2rem; position: relative; }
.nx-fill { height: 100%; background: var(--ink); border-radius: 0 6px 6px 0; transition: width .5s ease; }
.nx-row.hl .nx-fill, .nx-row.hl.top .nx-fill { background: var(--s1); }
.nx-row.hl .nx-word { color: var(--s1); }
.nx-pct { font-size: 1.3rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.nx-mark { font-size: 1rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.nx-row.ours .nx-fill { background: var(--s2); }
.nx-row.ours .nx-word, .nx-row.ours .nx-mark { color: var(--s2); }
.nx-row.expected .nx-fill { background: var(--s1); }
.nx-row.expected .nx-word, .nx-row.expected .nx-mark { color: var(--s1); }