.gate-error {
	justify-content: center;
}

.gate-error[hidden] {
	display: none;
}

.chain {
	display: block;
	width: min(720px, 86%);
	height: auto;
	overflow: visible;
	font-family: var(--mono);
}

.chain-caption {
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	fill: rgb(255 255 255 / 0.55);
}

.chain-led {
	fill: #ff6500;
	filter: drop-shadow(0 0 4px #ff6500);
}

.chain-module {
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	fill: rgb(255 255 255 / 0.4);
}

.chain-state {
	font-size: 12px;
	fill: #ffefd3;
}

.chain-contract {
	fill: none;
	stroke: #ff6500;
	stroke-width: 2;
	stroke-linejoin: round;
	filter: drop-shadow(0 0 6px rgb(255 101 0 / 0.6));
}

.chain-scope {
	fill: none;
	stroke: #ffefd3;
	stroke-width: 2;
	stroke-linecap: round;
}

.chain-edge {
	fill: none;
	stroke: rgb(255 255 255 / 0.45);
	stroke-width: 1.2;
}

.chain-node {
	fill: #000;
	stroke: rgb(255 255 255 / 0.85);
	stroke-width: 1.5;
}

.chain-delivered {
	fill: #ff6500;
	filter: drop-shadow(0 0 4px #ff6500);
}

.chain-report {
	fill: none;
	stroke: rgb(255 255 255 / 0.2);
	stroke-width: 1;
	stroke-dasharray: 2 4;
}

.chain-rail {
	fill: none;
	stroke: rgb(255 255 255 / 0.25);
	stroke-width: 6;
	stroke-linecap: round;
}

.chain-consumed {
	fill: none;
	stroke: #ff6500;
	stroke-width: 6;
	stroke-linecap: round;
	filter: drop-shadow(0 0 6px rgb(255 101 0 / 0.6));
}

.chain-commitment {
	fill: none;
	stroke: #ffefd3;
	stroke-width: 2;
	stroke-linecap: round;
}

.chain-attested {
	fill: #ffefd3;
}