/* who gets flagged (riemer.fyi style): black bars in thick frames; the word in a black box */
.tox { flex: 1; display: flex; flex-direction: column; gap: 2vh; min-width: 0; }
.tox-main { flex: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 4vw; align-items: center; }
.tox-left { display: flex; flex-direction: column; gap: 2.4vh; }
.tox-sentence { font-size: 2.3rem; font-weight: 700; line-height: 1.25; }
.tox-sentence .x { background: var(--ink); color: var(--bg); padding: 0 .18em; }
.tox-meter .track { height: 2.4rem; border: var(--rule) solid var(--ink); background: var(--bg); }
.tox-meter .fill { height: 100%; background: var(--ink); transition: width .6s cubic-bezier(.3,.7,.2,1); }
.tox-val { font-size: 2.6rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.web-stages.tox-steps { justify-content: flex-start; flex-wrap: nowrap; gap: .4rem; }
.web-stages.tox-steps span { cursor: pointer; padding: .4em .55em; }
.tox-list { display: grid; gap: .6rem; }
.tox-row { display: grid; grid-template-columns: 7.5em 1fr 3.2em; align-items: center; gap: .8rem; cursor: pointer; font-size: 1.05rem; }
.tox-row .lab { text-align: right; font-weight: 700; }
.tox-row .lab span { padding: .05em .3em; }
.tox-row.sel .lab span { background: var(--ink); color: var(--bg); }
.tox-row.first { margin-top: .9rem; }
.tox-row .track { height: 1.1em; border: 2px solid var(--ink); }
.tox-row .fill { height: 100%; background: var(--ink); transition: width .55s cubic-bezier(.3,.7,.2,1); }
.tox-row .val { font-variant-numeric: tabular-nums; font-weight: 700; font-size: .95rem; }