/**
 * CSS Capture — the workflow screen (design turn 11, artboards 11a/11b).
 *
 * Every value here is read from the artboards' inline styles, not eyeballed —
 * see docs/design-specs/turn-11-capture-workflow.md for the extraction and the
 * confirmed deviations. Supersedes the turn-1a ledger sheet entirely.
 *
 * Shared palette resolves from admin-tokens.css (--ag-*). What this screen
 * adds are its own mode-dependent locals — the near-black strip that stays a
 * band in both modes, the capture pill that flips fill on dark so "on" stays
 * the heaviest mark, the reader's code pane that keeps a lighter fill than
 * its frame, the bracket chips, and the drag grips that stay mid-grey on
 * dark. Three-state resolution, same pattern as the token file: light on the
 * component root, prefers-dark guarded against an explicit light choice, and
 * the explicit dark mode last so the toggle wins both ways.
 */

.agc {
	/* ── shared names, mapped ── */
	--agc-page:      var(--ag-page);
	--agc-bg:        var(--ag-bg);
	--agc-sunk:      var(--ag-bg-sunk);
	--agc-border:    var(--ag-border);
	--agc-rule:      var(--ag-rule);
	--agc-rule-soft: var(--ag-rule-soft);
	--agc-ink:       var(--ag-text);
	--agc-soft:      var(--ag-text-soft);
	--agc-mute:      var(--ag-text-mute);
	--agc-faint:     var(--ag-text-faint);
	--agc-accent:    var(--ag-accent);
	--agc-accent-ink: var(--ag-accent-ink);
	--agc-warn:      var(--ag-warn);
	--agc-warn-rule: var(--ag-warn-rule);
	--agc-warn-bg:   var(--ag-warn-ground);
	--agc-warn-ink:  var(--ag-warn-ink);

	--agc-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
	--agc-sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;

	/* ── this screen's mode-dependent locals (light) ── */
	--agc-strip-bg:     #1d2327;
	--agc-strip-border: transparent;
	--agc-strip-label:  #8c8f94;
	--agc-strip-value:  #e4e5e6;
	--agc-strip-rule:   rgba(255, 255, 255, .1);

	--agc-pill-bg:       #1d2327;
	--agc-pill-word:     #fff;
	--agc-pill-tick-bg:  var(--ag-accent);
	--agc-pill-tick-ink: #111314;

	--agc-band:      #eceef0;
	--agc-band-page: #f8fadf;
	--agc-row-rule:  #f2f3f4;

	--agc-code-bg: #f2f3f4;

	--agc-line-relation:  #7c3aed;
	--agc-label-relation: #6d28d9;
	--agc-tint-relation:  #f6f4ff;
	--agc-line-order:     #e0a340;
	--agc-label-order:    #a0651f;
	--agc-chip-bg:        #fff;

	--agc-grip: #8c8f94;

	font-family: var(--agc-sans);
	color: var(--agc-ink);
	max-width: 1430px;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-ag-mode="light"]) .agc {
		--agc-strip-bg:     #202324;
		--agc-strip-border: #33383a;
		--agc-strip-label:  rgba(232, 234, 234, .45);
		--agc-strip-value:  rgba(232, 234, 234, .68);

		--agc-pill-bg:       var(--ag-accent);
		--agc-pill-word:     #111314;
		--agc-pill-tick-bg:  #111314;
		--agc-pill-tick-ink: var(--ag-accent);

		--agc-band:      rgba(255, 255, 255, .06);
		--agc-band-page: rgba(214, 243, 45, .08);
		--agc-row-rule:  rgba(255, 255, 255, .045);

		--agc-code-bg: #1c1f20;

		--agc-label-relation: #b79cf7;
		--agc-tint-relation:  rgba(124, 58, 237, .16);
		--agc-line-order:     #d8b24a;
		--agc-label-order:    #d8b24a;
		--agc-chip-bg:        var(--ag-bg);

		--agc-grip: #565c60;
	}
}

[data-ag-mode="dark"] .agc,
:root[data-ag-mode="dark"] .agc {
	--agc-strip-bg:     #202324;
	--agc-strip-border: #33383a;
	--agc-strip-label:  rgba(232, 234, 234, .45);
	--agc-strip-value:  rgba(232, 234, 234, .68);

	--agc-pill-bg:       var(--ag-accent);
	--agc-pill-word:     #111314;
	--agc-pill-tick-bg:  #111314;
	--agc-pill-tick-ink: var(--ag-accent);

	--agc-band:      rgba(255, 255, 255, .06);
	--agc-band-page: rgba(214, 243, 45, .08);
	--agc-row-rule:  rgba(255, 255, 255, .045);

	--agc-code-bg: #1c1f20;

	--agc-label-relation: #b79cf7;
	--agc-tint-relation:  rgba(124, 58, 237, .16);
	--agc-line-order:     #d8b24a;
	--agc-label-order:    #d8b24a;
	--agc-chip-bg:        var(--ag-bg);

	--agc-grip: #565c60;
}

.agc__title {
	margin: 0 0 14px;
	font-size: 21px;
	font-weight: 600;
	color: var(--agc-ink);
}

/* ── buttons ─────────────────────────────────────────────────────────────── */

.agc-btn {
	font: 400 11.5px var(--agc-sans);
	padding: 6px 12px;
	background: var(--agc-bg);
	color: var(--agc-soft);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	cursor: pointer;
}

.agc-btn:hover { color: var(--agc-ink); }

.agc-btn--primary {
	font-weight: 600;
	padding: 6px 13px;
	background: var(--agc-accent);
	color: var(--agc-accent-ink);
	border: none;
}

.agc-btn--primary:hover { color: var(--agc-accent-ink); filter: brightness(.96); }

.agc-btn--tiny { font-size: 10.5px; padding: 3px 8px; flex: none; }

.agc-btn--danger { color: var(--agc-warn); }

.agc-btn--danger:hover { border-color: var(--agc-warn-rule); color: var(--agc-warn); }

.agc-btn:disabled { opacity: .45; cursor: default; }

.agc-btn:focus-visible { outline: 2px solid var(--agc-accent); outline-offset: 1px; }

.agc-tag {
	font-size: 9px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--agc-warn);
	border: 1px solid var(--agc-warn-rule);
	border-radius: 2px;
	padding: 1px 5px;
	flex: none;
}

.agc-pipe {
	display: inline-block;
	font-family: var(--agc-mono);
	font-size: 10px;
	color: var(--ag-pipe);
	border: 1px solid var(--ag-pipe-line);
	border-radius: 2px;
	padding: 1px 5px;
}

/* ── the served-now strip ────────────────────────────────────────────────── */

.agc-strip {
	display: flex;
	align-items: stretch;
	background: var(--agc-strip-bg);
	border: 1px solid var(--agc-strip-border);
	border-radius: 3px;
	overflow: hidden;
	margin-bottom: 18px;
}

.agc-strip__lead {
	padding: 13px 16px;
	border-right: 1px solid rgba(255, 255, 255, .13);
	display: flex;
	flex-direction: column;
	justify-content: center;
	flex: none;
}

.agc-strip__label {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-strip-label);
}

.agc-strip__source {
	font-size: 14px;
	font-weight: 600;
	margin-top: 3px;
	color: var(--agc-strip-value);
}

.agc-strip__source--on   { color: var(--agc-accent); }
.agc-strip__source--warn { color: var(--agc-line-order); }

.agc-strip__cells {
	flex: 1;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: center;
}

.agc-strip__cell {
	padding: 13px 16px;
	border-right: 1px solid var(--agc-strip-rule);
}

.agc-strip__cell:last-child { border-right: none; }

.agc-strip__value {
	font-size: 12.5px;
	color: var(--agc-strip-value);
	margin-top: 3px;
}

/* ── the advisor ─────────────────────────────────────────────────────────── */

.agc-advisor {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin-bottom: 18px;
	align-items: stretch;
}

.agc-card {
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 3px;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.agc-card__head {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px 16px;
	border-bottom: 1px solid var(--agc-rule-soft);
}

.agc-card__num {
	width: 17px;
	height: 17px;
	border-radius: 999px;
	background: var(--agc-ink);
	color: var(--agc-bg);
	font-size: 10.5px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}

.agc-card__title {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-ink);
}

.agc-card__stamp {
	margin-left: auto;
	font-family: var(--agc-mono);
	font-size: 10.5px;
	color: var(--agc-mute);
	text-align: right;
}

.agc-card__stamp--warn { color: var(--agc-warn); }

.agc-card__body {
	padding: 13px 16px;
	display: flex;
	flex-direction: column;
	gap: 11px;
	flex: 1;
}

.agc-card__copy {
	font-size: 12.5px;
	line-height: 1.55;
	color: var(--agc-soft);
}

.agc-card__body > .agc-btn--primary { align-self: flex-start; margin-top: auto; }

.agc-card__foot {
	font-size: 11px;
	line-height: 1.5;
	color: var(--agc-mute);
	margin-top: -4px;
}

.agc-gate {
	padding: 10px 11px;
	background: var(--agc-warn-bg);
	border: 1px solid var(--agc-warn-rule);
	border-radius: 2px;
}

.agc-gate__head {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--agc-warn);
}

.agc-gate__body {
	font-size: 12px;
	line-height: 1.55;
	color: var(--agc-warn-ink);
	margin-top: 5px;
}

.agc-steps { display: flex; flex-direction: column; }

.agc-steps__row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding-bottom: 10px;
}

.agc-steps__row.is-locked { opacity: .5; }

.agc-steps__dot {
	width: 15px;
	height: 15px;
	border-radius: 999px;
	border: 1px solid var(--agc-faint);
	color: var(--agc-soft);
	font-size: 9.5px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	margin-top: 1px;
}

.agc-steps__dot--on {
	background: var(--agc-warn);
	border-color: var(--agc-warn);
	color: #fff;
}

.agc-steps__title { font-size: 12px; font-weight: 600; color: var(--agc-ink); }

.agc-steps__copy { font-size: 11.5px; line-height: 1.5; color: var(--agc-soft); margin-top: 2px; }

.agc-proverow { display: flex; gap: 7px; flex-wrap: wrap; }

.agc-proverow__url {
	flex: 1;
	min-width: 80px;
	padding: 6px 9px;
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	font-family: var(--agc-mono);
	font-size: 12px;
	color: var(--agc-ink);
}

/* results shared by the advisor cards and the reader compare */

.agc-card__result {
	border-top: 1px solid var(--agc-row-rule);
	padding-top: 10px;
	max-height: 300px;
	overflow-y: auto;
}

.agc-result__summary {
	font-family: var(--agc-mono);
	font-size: 10px;
	color: var(--agc-mute);
	margin-bottom: 8px;
}

.agc-result__ok   { font-size: 11.5px; color: var(--agc-soft); padding: 2px 0; overflow-wrap: anywhere; }
.agc-result__warn { font-size: 11.5px; color: var(--agc-warn); padding: 2px 0; overflow-wrap: anywhere; }

.agc-result__big { font-size: 12.5px; font-weight: 600; padding: 5px 0; }

.agc-result__rules summary { font-size: 10.5px; color: var(--agc-soft); cursor: pointer; padding: 4px 0; }

.agc-result__rules ul {
	margin: 4px 0;
	padding: 6px 8px;
	list-style: none;
	background: var(--agc-sunk);
	border: 1px solid var(--agc-rule);
	border-radius: 2px;
	max-height: 160px;
	overflow-y: auto;
}

.agc-result__rules li {
	font-family: var(--agc-mono);
	font-size: 9.5px;
	line-height: 1.7;
	color: var(--agc-soft);
	overflow-wrap: anywhere;
}

.agc-proposal__row {
	display: grid;
	grid-template-columns: 58px 1fr;
	column-gap: 8px;
	padding: 6px 0;
	border-bottom: 1px solid var(--agc-row-rule);
}

.agc-proposal__verdict {
	grid-row: 1 / 3;
	align-self: start;
	justify-self: start;
	font-size: 8.5px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: 2px 5px;
	border-radius: 2px;
	border: 1px solid var(--agc-border);
	color: var(--agc-mute);
}

.agc-proposal__verdict--capture { border-color: var(--agc-accent); color: var(--agc-ink); background: var(--ag-accent-ground); }
.agc-proposal__verdict--review  { background: var(--agc-warn-bg); border-color: var(--agc-warn-rule); color: var(--agc-warn); }

.agc-proposal__handle { font-family: var(--agc-mono); font-size: 11px; color: var(--agc-ink); }

.agc-proposal__reason { grid-column: 2; font-size: 10.5px; line-height: 1.45; color: var(--agc-mute); }

/* ── the ledger ──────────────────────────────────────────────────────────── */

.agc-ledger {
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 3px;
	overflow: hidden;
}

.agc-ledger__intro {
	padding: 12px 16px;
	border-bottom: 1px solid var(--agc-rule);
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--agc-soft);
}

.agc-ledger__head {
	display: grid;
	grid-template-columns: 112px 1fr 34px 128px 46px 66px 176px;
	align-items: end;
	padding: 8px 0 7px;
	background: var(--agc-sunk);
	border-bottom: 1px solid var(--agc-rule);
}

.agc-ledger__head > div {
	font-size: 9px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-faint);
}

.agc-ledger__head > div:first-child { padding-left: 16px; }

.agc-ledger__head-last { padding-right: 16px; }

.agc-band {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 8px 16px;
	background: var(--agc-band);
	border-bottom: 1px solid var(--agc-rule);
}

.agc-band__word {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-ink);
}

.agc-band__copy { font-size: 11.5px; color: var(--agc-soft); }

.agc-band--page {
	display: block;
	background: var(--agc-band-page);
	border-top: 1px solid var(--agc-rule);
	padding: 9px 16px;
}

.agc-band__row { display: flex; align-items: baseline; gap: 12px; }

.agc-band__note {
	font-size: 11px;
	line-height: 1.5;
	color: var(--agc-label-relation);
	margin-top: 5px;
}

.agc-rows { position: relative; }

.agc-row {
	display: grid;
	grid-template-columns: 112px 1fr 34px 128px 46px 66px 176px;
	align-items: start;
	padding: 12px 0;
	border-bottom: 1px solid var(--agc-row-rule);
}

.agc-row__scope { padding-left: 16px; }

.agc-row__scope-word {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--agc-mute);
	display: flex;
	align-items: center;
	gap: 6px;
}

.agc-row__cascade {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 13px;
	height: 13px;
	background: var(--agc-ink);
	color: var(--agc-bg);
	border-radius: 2px;
	font-family: var(--agc-mono);
	font-size: 9px;
	flex: none;
}

.agc-row__measure {
	font-family: var(--agc-mono);
	font-size: 10.5px;
	color: var(--agc-mute);
	margin-top: 3px;
}

.agc-row__sheet { padding-right: 18px; min-width: 0; }

.agc-row__name {
	font-family: var(--agc-mono);
	font-size: 12.5px;
	font-weight: 500;
	color: var(--agc-ink);
	overflow-wrap: anywhere;
}

.agc-row__desc { font-size: 12px; line-height: 1.5; color: var(--agc-soft); margin-top: 3px; }

/* The rails carry the relations when the script runs; without it this line
   states the same fact in words, so no-script never means no information. */
.agc-row__relation-fallback {
	font-size: 10.5px;
	color: var(--agc-label-relation);
	margin-top: 3px;
}

.agc.js-rails .agc-row__relation-fallback { display: none; }

.agc-row__legacy {
	font-size: 11px;
	line-height: 1.5;
	color: var(--agc-warn);
	background: var(--agc-warn-bg);
	border: 1px solid var(--agc-warn-rule);
	border-radius: 2px;
	padding: 6px 8px;
	margin-top: 6px;
}

.agc-row__legacy-clear {
	background: none;
	border: none;
	padding: 0;
	font: inherit;
	color: var(--agc-warn);
	text-decoration: underline;
	cursor: pointer;
}

.agc-row__conflict { margin-top: 5px; }

.agc-row__conflict summary {
	font-size: 10.5px;
	color: var(--agc-label-order);
	cursor: pointer;
}

.agc-row__conflict ul {
	margin: 5px 0 0;
	padding: 6px 8px;
	list-style: none;
	background: var(--agc-sunk);
	border: 1px solid var(--agc-rule);
	border-radius: 2px;
	max-height: 140px;
	overflow-y: auto;
}

.agc-row__conflict li {
	font-family: var(--agc-mono);
	font-size: 10px;
	line-height: 1.7;
	color: var(--agc-soft);
	overflow-wrap: anywhere;
}

.agc-row__role {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--agc-ink);
	padding-top: 1px;
}

.agc-row__role--warn { color: var(--agc-warn); }

.agc-row__role-sub {
	display: block;
	font-family: var(--agc-mono);
	font-size: 9px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--agc-mute);
	margin-top: 2px;
}

.agc-row__pipe { padding-top: 1px; }

.agc-row__block { padding-top: 1px; }

.agc-row__block input { width: 14px; height: 14px; margin: 0; }

.agc-row__capture { padding-right: 16px; }

.agc-pill {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 8px 3px 6px;
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	cursor: pointer;
}

.agc-pill input { position: absolute; opacity: 0; pointer-events: none; }

.agc-pill__tick {
	display: inline-flex;
	width: 12px;
	height: 12px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--agc-border);
	border-radius: 1px;
	font-size: 9px;
	font-weight: 700;
	color: transparent;
	background: var(--agc-bg);
}

.agc-pill__word {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--agc-mute);
}

.agc-pill--on {
	background: var(--agc-pill-bg);
	border-color: var(--agc-pill-bg);
}

.agc-pill--on .agc-pill__tick {
	background: var(--agc-pill-tick-bg);
	border-color: var(--agc-pill-tick-bg);
	color: var(--agc-pill-tick-ink);
}

.agc-pill--on .agc-pill__word { color: var(--agc-pill-word); }

.agc-pill:focus-within { outline: 2px solid var(--agc-accent); outline-offset: 1px; }

.agc-row__file {
	font-family: var(--agc-mono);
	font-size: 10.5px;
	color: var(--agc-mute);
	margin-top: 4px;
}

/* bracket rails — positioned by the script from their data-from/data-to rows */

.agc-bracket {
	position: absolute;
	right: 416px;
	width: 34px;
	pointer-events: none;
}

.agc-bracket__spine { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--agc-line-relation); }

.agc-bracket__arm { position: absolute; width: 8px; height: 1px; background: var(--agc-line-relation); }

.agc-bracket__arm--top { top: 0; }

.agc-bracket__arm--bottom { bottom: 0; }

.agc-bracket__label {
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(180deg);
	writing-mode: vertical-rl;
	font-family: var(--agc-mono);
	font-size: 8.5px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--agc-label-relation);
	background: var(--agc-chip-bg);
	padding: 3px 0;
}

.agc-bracket--order .agc-bracket__spine,
.agc-bracket--order .agc-bracket__arm { background: var(--agc-line-order); }

.agc-bracket--order .agc-bracket__label { color: var(--agc-label-order); }

.agc-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 22px;
	padding: 10px 16px;
	border-top: 1px solid var(--agc-rule);
	font-size: 11px;
	color: var(--agc-soft);
}

.agc-legend > span { display: inline-flex; align-items: center; gap: 8px; }

.agc-legend__swatch { display: inline-block; width: 8px; height: 1px; flex: none; }

.agc-legend__swatch--relation { background: var(--agc-line-relation); }

.agc-legend__swatch--order { background: var(--agc-line-order); }

.agc-ledger__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 16px;
	border-top: 1px solid var(--agc-rule);
}

.agc-ledger__summary { font-size: 12px; color: var(--agc-soft); }

.agc-ledger__summary strong { font-weight: 600; color: var(--agc-ink); }

.agc-ledger__actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── the operations band ─────────────────────────────────────────────────── */

.agc-ops {
	display: grid;
	grid-template-columns: 296px 1fr 336px;
	gap: 14px;
	align-items: start;
	margin-top: 18px;
}

.agc-ops__stack { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.agc-panel {
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 3px;
	overflow: hidden;
	min-width: 0;
}

.agc-panel__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 11px 16px;
	background: var(--agc-sunk);
	border-bottom: 1px solid var(--agc-rule);
}

.agc-panel__head > span:first-child {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-faint);
}

.agc-panel__meta { font-size: 10.5px; color: var(--agc-mute); font-family: var(--agc-mono); }

.agc-panel__meta--warn { color: var(--agc-warn); }

.agc-panel__body { padding: 13px 16px; }

[data-ag-tell] { font-size: 11px; margin: 0 0 10px; color: var(--agc-soft); }

[data-ag-tell].is-error { color: var(--agc-warn); }

/* serving */

.agc-serving { display: flex; flex-direction: column; gap: 13px; }

.agc-serving__row { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }

.agc-serving__row input { margin: 2px 0 0; width: 14px; height: 14px; flex: none; }

.agc-serving__name { display: block; font-size: 12.5px; font-weight: 600; color: var(--agc-ink); }

.agc-serving__copy { display: block; font-size: 12px; line-height: 1.5; color: var(--agc-soft); margin-top: 3px; }

.agc-serving__warn { display: block; font-size: 11px; line-height: 1.5; color: var(--agc-warn); margin-top: 5px; }

/* merge */

.agc-merge__copy { font-size: 12.5px; line-height: 1.6; color: var(--agc-soft); }

.agc-merge__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 12px;
}

.agc-merge__drag {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-faint);
}

.agc-merge__hint { font-size: 10.5px; color: var(--agc-mute); }

.agc-merge__list {
	margin-top: 7px;
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	overflow: hidden;
}

.agc-merge__row,
.agc-merge__filerow {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 11px;
	background: var(--agc-bg);
	border-bottom: 1px solid var(--agc-row-rule);
}

.agc-merge__row { cursor: grab; }

.agc-merge__row.is-dragging, .agc-merge__filerow.is-dragging { opacity: .4; }

.agc-grip {
	display: inline-grid;
	grid-template-columns: 2px 2px;
	gap: 2px;
	flex: none;
}

.agc-grip i { width: 2px; height: 2px; background: var(--agc-grip); }

.agc-merge__index {
	font-family: var(--agc-mono);
	font-size: 10.5px;
	color: var(--agc-mute);
	width: 12px;
	flex: none;
}

.agc-merge__main { flex: 1; min-width: 0; }

.agc-merge__name {
	display: block;
	font-family: var(--agc-mono);
	font-size: 11.5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--agc-ink);
}

.agc-merge__fact { display: block; font-size: 10.5px; color: var(--agc-mute); margin-top: 2px; }

.agc-merge__override { display: block; font-size: 10.5px; color: var(--agc-label-relation); margin-top: 2px; }

.agc-merge__which {
	background: none;
	border: none;
	padding: 0;
	font: inherit;
	color: inherit;
	border-bottom: 1px solid rgba(109, 40, 217, .4);
	cursor: pointer;
}

.agc-merge__size {
	font-family: var(--agc-mono);
	font-size: 11px;
	color: var(--agc-mute);
	width: 52px;
	text-align: right;
	flex: none;
}

.agc-merge__remove {
	font-size: 13px;
	line-height: 1;
	color: var(--agc-mute);
	padding: 2px 3px;
	cursor: pointer;
	background: none;
	border: none;
	flex: none;
}

.agc-merge__remove:hover { color: var(--agc-warn); }

.agc-merge__empty { padding: 10px 11px; font-size: 11.5px; color: var(--agc-mute); }

.agc-merge__drop {
	padding: 11px;
	background: var(--agc-sunk);
	border: 1px dashed var(--agc-border);
	margin: 7px;
	border-radius: 2px;
	text-align: center;
	font-size: 11.5px;
	color: var(--agc-mute);
}

.agc-merge__drop.is-over { border-color: var(--agc-accent); color: var(--agc-ink); }

.agc-merge__result {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 11px;
	padding: 9px 11px;
	background: var(--agc-sunk);
	border: 1px solid var(--agc-rule);
	border-radius: 2px;
	font-size: 11.5px;
	color: var(--agc-soft);
}

.agc-merge__result strong { font-weight: 600; color: var(--agc-ink); }

.agc-merge__addrow { margin-top: 10px; }

.agc-merge__addrow select {
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	color: var(--agc-ink);
	font-size: 11.5px;
	max-width: 100%;
}

.agc-merge__bar--files { margin-top: 16px; }

.agc-merge__filter {
	width: 100%;
	box-sizing: border-box;
	margin-top: 7px;
	padding: 4px 9px;
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	font-size: 11.5px;
	color: var(--agc-mute);
	font-family: var(--agc-mono);
}

.agc-merge__files {
	margin-top: 7px;
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	max-height: 220px;
	overflow-y: auto;
}

.agc-merge__filerow { cursor: grab; }

.agc-merge__filerow.is-reading { background: var(--agc-sunk); }

.agc-merge__filepath {
	flex: 1;
	min-width: 0;
	font-family: var(--agc-mono);
	font-size: 11px;
	color: var(--agc-ink);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.agc-merge__note {
	margin-top: 10px;
	padding: 8px 10px;
	background: var(--agc-warn-bg);
	border: 1px solid var(--agc-warn-rule);
	border-radius: 2px;
	font-size: 11px;
	line-height: 1.5;
	color: var(--agc-warn-ink);
}

.agc-merge__save { margin-top: 12px; }

/* snapshots */

.agc-slot {
	border: 1px solid var(--agc-rule);
	border-radius: 2px;
	margin-top: 9px;
}

.agc-slot__head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 9px 12px;
	cursor: pointer;
	list-style: none;
}

.agc-slot__head::-webkit-details-marker { display: none; }

.agc-slot__head::before { content: '▸'; font-size: 9px; color: var(--agc-mute); }

.agc-slot[open] > .agc-slot__head::before { content: '▾'; }

.agc-slot__name { font-family: var(--agc-mono); font-size: 12px; font-weight: 600; color: var(--agc-ink); flex: none; }

.agc-slot__locked {
	font-size: 9px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	background: var(--agc-ink);
	color: var(--agc-bg);
	padding: 2px 6px;
	border-radius: 2px;
	flex: none;
}

.agc-slot__meta { flex: 1; min-width: 0; font-family: var(--agc-mono); font-size: 10.5px; color: var(--agc-mute); }

.agc-slot__body { padding: 11px 12px; border-top: 1px solid var(--agc-rule); }

.agc-slot__label {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--agc-faint);
}

.agc-slot__facts { display: flex; flex-direction: column; gap: 5px; margin-top: 7px; }

.agc-slot__facts > div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	font-size: 11.5px;
}

.agc-slot__facts span:first-child { color: var(--agc-soft); }

.agc-slot__facts span:last-child { font-family: var(--agc-mono); font-size: 11px; color: var(--agc-ink); }

.agc-slot__diff {
	margin-top: 10px;
	padding: 9px 10px;
	background: var(--agc-tint-relation);
	border: 1px solid var(--agc-line-relation);
	border-radius: 2px;
}

.agc-slot__diff-head {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--agc-label-relation);
}

.agc-slot__diff-line { font-size: 11.5px; line-height: 1.5; color: var(--agc-soft); margin-top: 6px; }

.agc-slot__unknown { font-size: 11.5px; line-height: 1.5; color: var(--agc-mute); }

.agc-slot__actions { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10px; }

.agc-serve { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 11.5px; color: var(--agc-soft); }

.agc-serve select {
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	color: var(--agc-ink);
	font-size: 11.5px;
}

.agc-serve__note { font-size: 10.5px; line-height: 1.5; color: var(--agc-mute); margin-top: 7px; }

/* pages */

.agc-pages__note {
	font-size: 11.5px;
	line-height: 1.55;
	color: var(--agc-label-relation);
	margin-top: 8px;
	padding-left: 9px;
	border-left: 2px solid var(--agc-line-relation);
}

.agc-pages__actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }

.agc-pages__progress {
	margin-top: 11px;
	padding: 8px 10px;
	background: var(--agc-sunk);
	border: 1px solid var(--agc-rule);
	border-radius: 2px;
	font-family: var(--agc-mono);
	font-size: 10px;
	line-height: 1.8;
	color: var(--agc-mute);
	max-height: 150px;
	overflow-y: auto;
}

.agc-pages__list { margin-top: 11px; }

.agc-pages__row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 0;
	border-bottom: 1px solid var(--agc-row-rule);
	font-size: 11.5px;
}

.agc-pages__row a { color: var(--agc-ink); text-decoration: none; }

.agc-pages__row a:hover { text-decoration: underline; }

.agc-pages__rowmeta { flex: 1; font-family: var(--agc-mono); font-size: 10px; color: var(--agc-mute); text-align: right; }

/* ── the reader ──────────────────────────────────────────────────────────── */

.agc-reader {
	margin-top: 18px;
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 3px;
	overflow: hidden;
}

.agc-reader__bar {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 9px 16px;
	background: var(--agc-sunk);
	border-bottom: 1px solid var(--agc-rule);
	flex-wrap: wrap;
}

.agc-reader__word {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-faint);
	flex: none;
}

.agc-reader__tabs { display: flex; gap: 12px; flex: 1; min-width: 0; flex-wrap: wrap; }

.agc-reader__tab {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--agc-mono);
	font-size: 11.5px;
	color: var(--agc-mute);
	cursor: pointer;
	background: none;
	border: none;
	padding: 2px 0;
}

.agc-reader__tab.is-active { color: var(--agc-ink); border-bottom: 1px solid var(--agc-accent); }

.agc-reader__tab-close { color: var(--agc-faint); }

.agc-reader__tools { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

.agc-reader__tools input {
	padding: 4px 9px;
	background: var(--agc-bg);
	border: 1px solid var(--agc-border);
	border-radius: 2px;
	font-size: 11.5px;
	color: var(--agc-ink);
	width: 130px;
}

.agc-reader__count { font-family: var(--agc-mono); font-size: 10px; color: var(--agc-mute); }

.agc-reader__meta {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 9px 16px;
	border-bottom: 1px solid var(--agc-row-rule);
	font-family: var(--agc-mono);
	font-size: 11.5px;
	color: var(--agc-soft);
	flex-wrap: wrap;
}

.agc-reader__badge {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--agc-warn);
	font-family: var(--agc-sans);
}

.agc-reader__ro { margin-left: auto; font-size: 11px; color: var(--agc-mute); font-family: var(--agc-sans); }

.agc-reader__split { display: flex; align-items: stretch; }

.agc-reader__code {
	flex: 1;
	min-width: 0;
	padding: 12px 16px;
	background: var(--agc-code-bg);
	border-right: 1px solid var(--agc-row-rule);
	max-height: 420px;
	overflow: auto;
}

.agc-reader__line { display: flex; gap: 14px; }

.agc-reader__num {
	font-family: var(--agc-mono);
	font-size: 11px;
	color: var(--agc-faint);
	width: 30px;
	text-align: right;
	flex: none;
	user-select: none;
}

.agc-reader__text {
	font-family: var(--agc-mono);
	font-size: 11.5px;
	line-height: 1.75;
	color: var(--agc-soft);
	white-space: pre;
}

.agc-reader__line.is-hit .agc-reader__text { background: var(--agc-warn-bg); color: var(--agc-warn-ink); }

.agc-reader__side { width: 300px; flex: none; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }

.agc-reader__explain { font-size: 11px; line-height: 1.55; color: var(--agc-mute); }

/* ── the tail ────────────────────────────────────────────────────────────── */

.agc-config {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 16px;
	margin-top: 18px;
	flex-wrap: wrap;
}

.agc-config__copy { font-size: 12px; line-height: 1.5; color: var(--agc-soft); flex: 1; min-width: 240px; }

.agc-config__actions { display: flex; gap: 8px; flex-wrap: wrap; }

.agc-notcss {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin-top: 26px;
	padding-top: 20px;
	border-top: 1px solid var(--agc-border);
	margin-bottom: 4px;
}

.agc-notcss__word {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--agc-faint);
}

.agc-notcss__copy { font-size: 12px; color: var(--agc-mute); }

.agc-notcss + .agc-panel { margin-top: 10px; }

.agc-js__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px 16px;
	margin-top: 11px;
}

.agc-js__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--agc-mono);
	font-size: 10.5px;
	color: var(--agc-soft);
	min-width: 0;
}

.agc-js__item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.agc-js__item input { flex: none; margin: 0; }

/* ── responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 1180px) {
	.agc-ops { grid-template-columns: 1fr 1fr; }
	.agc-ops > .agc-panel:first-child { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
	.agc-advisor { grid-template-columns: 1fr; }
	.agc-ops { grid-template-columns: 1fr; }
	.agc-strip { flex-direction: column; }
	.agc-strip__lead { border-right: none; border-bottom: 1px solid var(--agc-strip-rule); }
	.agc-strip__cells { grid-template-columns: 1fr 1fr; }
	.agc-js__grid { grid-template-columns: 1fr; }
	.agc-reader__split { flex-direction: column; }
	.agc-reader__side { width: auto; }
	.agc-bracket { display: none; }
	.agc.js-rails .agc-row__relation-fallback { display: block; }
	.agc-ledger__head { display: none; }
	.agc-row { grid-template-columns: 1fr; gap: 6px; padding: 12px 16px; }
	.agc-row__scope, .agc-row__sheet { padding: 0; }
}