/* =========================================================================
   netex · engines/verb-index.css · the six verbs (bible S12), on Ink
   The rows are server-rendered at full weight (no JS = everything readable); the engine adds
   .is-live, so resting rows drop to 300 / --fg-3 and the active row ratchets to 880.
   ========================================================================= */
@layer reset, tokens, base, components, layout, pages, utilities;

@layer pages {

.ai-verbs { container-type: inline-size; }
.ai-verb {
	display: grid;
	gap: var(--s-3) var(--gutter);
	padding: var(--s-5) 0 var(--s-6);
	border-top: var(--bw) solid var(--rule);
	outline: none;
}
.ai-verb__name { margin: 0; max-width: none; }
.ai-verb__w {
	display: block;
	font-size: clamp(1.75rem, 5.1cqi, 5.5rem);
	font-weight: 880;
	line-height: .92;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--fg);
	transition: font-weight 240ms steps(6, jump-end), color var(--dur-ui) var(--ease-mech);
}
.ai-verb__def { font-size: 1rem; line-height: 1.5; color: var(--fg-2); max-width: 44ch; }
.ai-verb__right { display: grid; gap: var(--s-3); align-content: start; }
.ai-verb__ex { display: grid; gap: var(--s-1); font-size: 1.0625rem; line-height: 1.45; }
.ai-verb__log { margin: 0; min-height: 2.9em; }
.ai-verb__log code {
	display: block;
	padding: var(--s-2) var(--s-3);
	background: var(--ink-2);
	border-left: 2px solid var(--cyan);
	color: var(--cyan);
	font: 500 .8125rem/1.45 var(--f-mono);
	white-space: normal;
}
.ai-verb__log code::before { content: "> "; color: var(--steel); }
.ai-verb__links { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-size: .9375rem; }

@media (min-width: 1024px) {
	/* row 1 hugs the verb, so its definition sits right under it whatever the height of the right column */
	.ai-verb { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: auto 1fr; align-items: start; }
	.ai-verb__name, .ai-verb__def { grid-column: 1 / span 7; }
	.ai-verb__def { grid-row: 2; }
	.ai-verb__right { grid-column: 8 / -1; grid-row: 1 / span 2; padding-top: .6em; }
}

/* live: resting rows recede, the active row indexes */
.ai-verbs.is-live .ai-verb__w { font-weight: 300; color: var(--fg-3); }
.ai-verbs.is-live .ai-verb.is-active .ai-verb__w { font-weight: 880; color: var(--fg); }
.ai-verbs.is-live .ai-verb:not(.is-active) .ai-verb__log code { color: var(--fg-3); border-left-color: var(--rule); }
.ai-verbs.is-live .ai-verb:not(.is-active) .ai-verb__ex { color: var(--fg-2); }
.ai-verbs.is-live [data-hemi].is-on .ai-verbs__hemi .nx-mono-label { color: var(--fg); }
.ai-verb .cut__b { color: var(--cyan); }

/* reduced motion: every row at full weight, every log shown */
html.rm .ai-verbs.is-live .ai-verb__w { font-weight: 880; color: var(--fg); transition: none; }
html.rm .ai-verbs.is-live .ai-verb:not(.is-active) .ai-verb__log code { color: var(--cyan); border-left-color: var(--cyan); }

} /* end @layer pages */