/* Locals — payouts page. Builds on site.css and ui.css. */

/* Hero: quote, fund, deliver */

.po-hero::before {
	content: '';
	position: absolute;
	z-index: -1;
	right: -6%;
	top: 6%;
	width: 60%;
	height: 84%;
	background:
		radial-gradient(closest-side, rgba(200, 241, 105, 0.36), transparent),
		radial-gradient(rgba(16, 41, 30, 0.09) 1px, transparent 1.4px) 0 0 / 22px 22px;
	-webkit-mask-image: radial-gradient(closest-side, #000 40%, transparent);
	mask-image: radial-gradient(closest-side, #000 40%, transparent);
	pointer-events: none;
}

@media (min-width: 1081px) {
	.po-hero .hero-grid {
		grid-template-columns: 1fr 1.05fr;
	}
}

.po-hero .crumbs {
	margin-bottom: 20px;
}

.po-hero .live-pill .pulse,
.po-hero .live-pill .pulse::after {
	background: var(--amber);
	border-color: var(--amber);
}

.po-hero .live-pill .pulse::after {
	background: none;
}

.po-demo {
	position: relative;
	padding: 30px 26px 54px 0;
}

.po-demo .win-body {
	min-height: 0;
}

.po-phases {
	list-style: none;
	margin: 16px 0 14px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	counter-reset: none;
}

.po-phases li {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	padding-bottom: 9px;
	font-size: 13px;
	font-weight: 650;
	color: var(--muted);
	transition: color 0.3s ease;
}

.po-phases li span {
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 500;
}

.po-phases li::before,
.po-phases li::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	border-radius: 2px;
}

.po-phases li::before {
	right: 0;
	background: var(--paper-2);
}

.po-phases li::after {
	width: 0;
	background: var(--forest-3);
	transition: width 0.8s var(--ease-out);
}

.po-phases li.is-on {
	color: var(--ink);
}

.po-phases li.is-on::after {
	width: 45%;
	background: var(--lime-2);
}

.po-phases li.is-done {
	color: var(--ink);
}

.po-phases li.is-done::after {
	width: 100%;
}

.po-quote {
	border: 1px solid var(--paper-2);
	border-radius: 14px;
	overflow: hidden;
}

.po-leg {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 14px;
}

.po-leg > div {
	min-width: 0;
}

.po-leg small {
	display: block;
	font-size: 11.5px;
	color: var(--muted);
}

.po-leg b,
.po-leg input {
	display: block;
	font-family: var(--mono);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.po-cur {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	flex-shrink: 0;
	padding: 4px 11px 4px 4px;
	border-radius: 999px;
	background: var(--paper);
	border: 1px solid var(--line);
	font-family: var(--mono);
	font-size: 12.5px;
	font-weight: 600;
}

.po-cur .fl {
	width: 22px;
	height: 22px;
}

.po-rate {
	position: relative;
	height: 0;
	border-top: 1px solid var(--paper-2);
	display: flex;
	justify-content: center;
}

.po-rate span {
	position: absolute;
	top: -11px;
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 600;
	color: var(--forest-3);
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 3px 10px;
	white-space: nowrap;
}

.po-lock {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	padding: 10px 14px;
	background: #faf9f5;
	border-top: 1px solid var(--paper-2);
}

.po-lock strong {
	display: block;
	font-size: 13.5px;
}

.po-lock small {
	display: block;
	font-family: var(--mono);
	font-size: 11px;
	color: var(--muted);
}

.po-ring {
	position: relative;
	width: 40px;
	height: 40px;
	display: grid;
	place-items: center;
}

.po-ring svg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.po-ring circle {
	fill: none;
	stroke-width: 3.5;
}

.po-ring .track {
	stroke: var(--paper-2);
}

.po-ring .prog {
	stroke: var(--forest-3);
	stroke-dasharray: 107;
	stroke-linecap: round;
	transition: stroke-dashoffset 1s linear;
}

.po-ring b {
	position: relative;
	font-family: var(--mono);
	font-size: 10.5px;
	font-weight: 600;
}

.po-accept {
	font-size: 12.5px;
	font-weight: 700;
	padding: 7px 14px;
	border-radius: 999px;
	background: var(--forest);
	color: var(--white);
	white-space: nowrap;
	transition: background 0.25s ease, color 0.25s ease, transform 0.15s ease;
}

.po-accept.is-pressed {
	background: #e4f6cf;
	color: #24531a;
}

.po-accept.is-down {
	transform: scale(0.94);
}

.po-stage {
	position: relative;
	margin-top: 10px;
}

.po-tl {
	transition: opacity 0.4s ease;
}

.po-tl::before {
	top: 25px;
	bottom: 25px;
}

.po-tl .fill-line {
	top: 25px;
}

.po-tl .tl {
	padding: 7px 0;
}

.po-tl .amt {
	font-size: 13px;
}

.po-tl .amt small {
	display: inline;
}

.po-tl .po-done {
	color: #2e6b1f;
}

.po-fund {
	position: absolute;
	inset: 6px 0;
	display: grid;
	grid-template-columns: 118px minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	padding: 14px;
	border-radius: 14px;
	border: 1px solid var(--line);
	background: var(--white);
	box-shadow: 0 20px 40px -30px rgba(16, 41, 30, 0.5);
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	transition: opacity 0.4s ease, transform 0.5s var(--ease-out);
	z-index: 2;
}

.po-stage.is-fund .po-fund {
	opacity: 1;
	transform: none;
}

.po-stage.is-fund .po-tl {
	opacity: 0.15;
}

.po-qr {
	display: grid;
	grid-template-columns: repeat(21, 1fr);
	width: 118px;
	height: 118px;
	padding: 6px;
	border-radius: 10px;
	border: 1px solid var(--paper-2);
	background: var(--white);
}

.po-qr i {
	background: var(--forest);
	border-radius: 1px;
}

.po-qr i.o {
	background: none;
}

.po-fund-rows {
	display: grid;
	gap: 8px;
	min-width: 0;
}

.po-fund-rows small {
	display: block;
	font-size: 11.5px;
	color: var(--muted);
}

.po-fund-rows b {
	display: flex;
	align-items: center;
	gap: 6px;
	font-family: var(--mono);
	font-size: 13.5px;
	font-weight: 600;
	white-space: nowrap;
}

.po-fund-rows b svg {
	width: 13px;
	height: 13px;
	color: var(--muted);
}

.po-wait {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	justify-self: start;
	padding: 4px 10px 4px 6px;
	border-radius: 999px;
	background: #fbefd6;
	color: #7a4f05;
	font-size: 12px;
	font-weight: 650;
}

.po-wait i {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 2px solid currentColor;
	border-right-color: transparent;
	animation: po-spin 0.9s linear infinite;
}

.po-wait.is-done {
	background: #e4f6cf;
	color: #24531a;
}

.po-wait.is-done i {
	border-color: currentColor;
	background: currentColor;
	animation: none;
	transform: scale(0.6);
}

@keyframes po-spin {
	to { transform: rotate(360deg); }
}

.po-demo .hook-chip {
	top: 0;
	right: 0;
}

.po-bank {
	left: -38px;
	bottom: 2px;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px 12px 12px;
	font-size: 14px;
}

.po-bank .fl {
	width: 36px;
	height: 36px;
}

.po-bank strong {
	font-family: var(--mono);
	font-size: 15px;
}

.po-bank small {
	display: block;
	color: var(--muted);
	font-size: 12.5px;
}

.po-bank .ok {
	margin-left: 4px;
	color: #2e6b1f;
	--ic-fill: rgba(63, 174, 42, 0.2);
}

/* Corridor chooser */

.po-chooser {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

.po-regions {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 26px 8px;
}

.po-reg {
	grid-column: span var(--span, 4);
	min-width: 0;
}

.po-reg-head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	font-size: 12.5px;
	font-weight: 650;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.po-reg-head::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--line);
}

.po-reg-head em {
	order: 2;
	font-style: normal;
	font-family: var(--mono);
	letter-spacing: 0;
	text-transform: none;
	font-weight: 500;
}

.po-reg-head::after {
	order: 1;
}

.po-reg:not(.big) .po-reg-head {
	padding-right: 12px;
}

.po-reg-grid {
	display: grid;
	grid-template-columns: repeat(var(--span, 4), minmax(0, 1fr));
	gap: 8px;
}

.po-c {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	gap: 2px 10px;
	align-items: center;
	padding: 9px 10px;
	border-radius: 14px;
	border: 1px solid var(--line);
	background: var(--white);
	font-family: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s var(--ease-out), box-shadow 0.2s ease;
}

.po-c:hover {
	transform: translateY(-2px);
	border-color: #cfc8b4;
	box-shadow: 0 14px 24px -18px rgba(16, 41, 30, 0.5);
}

.po-c .fl {
	grid-row: span 2;
	width: 28px;
	height: 28px;
}

.po-c b {
	font-family: var(--mono);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.2;
}

.po-c small {
	font-size: 12px;
	color: var(--muted);
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.po-c[aria-pressed='true'] {
	background: var(--forest);
	border-color: var(--forest);
	color: var(--white);
}

.po-c[aria-pressed='true'] small {
	color: rgba(255, 255, 255, 0.65);
}

.po-c[aria-pressed='true'] .fl {
	box-shadow: 0 0 0 2px var(--lime);
}

.po-qcard {
	position: sticky;
	top: 100px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 24px;
	padding: 20px;
	box-shadow: 0 40px 80px -50px rgba(16, 41, 30, 0.55);
	display: grid;
	gap: 14px;
}

.qc-head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.qc-head .fl {
	width: 44px;
	height: 44px;
}

.qc-head b {
	display: block;
	font-size: 18px;
	letter-spacing: -0.02em;
}

.qc-head small {
	display: block;
	font-size: 13px;
	color: var(--muted);
}

.qc-head .status {
	margin-left: auto;
	white-space: nowrap;
}

.qc-quote .po-leg {
	padding: 12px 16px;
}

.qc-quote .po-leg b,
.qc-quote .po-leg input {
	font-size: 26px;
}

.qc-quote label.po-leg {
	cursor: text;
	transition: background 0.2s ease;
}

.qc-quote label.po-leg:focus-within {
	background: #f7fcef;
}

.po-leg input {
	width: 100%;
	padding: 0;
	margin: 0;
	border: 0;
	background: none;
	color: var(--ink);
	outline: none;
}

.qc-out-flash {
	animation: po-flash 0.6s ease;
}

@keyframes po-flash {
	from { color: var(--forest-3); }
}

.qc-meta {
	display: grid;
	gap: 0;
	font-size: 14px;
}

.qc-meta > div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-top: 1px dashed var(--line);
}

.qc-meta > div:first-child {
	border-top: 0;
}

.qc-meta span {
	color: var(--muted);
}

.qc-meta b {
	font-family: var(--mono);
	font-size: 13px;
	font-weight: 600;
	text-align: right;
}

.qc-meta b span {
	color: inherit;
}

.qc-timer {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.qc-timer .countdown svg {
	width: 16px;
	height: 16px;
}

.qc-code {
	margin: 0;
	padding: 14px 16px;
	border-radius: 14px;
	background: #0a1a12;
	color: #d9e4dc;
	font-size: 12px;
	line-height: 1.65;
	overflow-x: auto;
}

.qc-note {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	font-size: 12.5px;
	color: var(--muted);
}

.qc-note .ic {
	width: 16px;
	height: 16px;
	margin-top: 1px;
}

/* Quote anatomy */

.anat {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 28px;
	align-items: center;
}

.anat-col {
	display: grid;
	gap: 14px;
}

.anat-note {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 14px;
	align-items: start;
	padding: 18px;
	border-radius: 18px;
	border: 1px solid var(--line);
	background: var(--white);
	font-family: inherit;
	color: inherit;
	text-align: left;
	cursor: default;
	transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s var(--ease-out);
}

.anat-note .ic-box {
	width: 44px;
	height: 44px;
	border-radius: 13px;
	display: grid;
	place-items: center;
	background: var(--paper);
	border: 1px solid var(--line);
	color: var(--forest);
	transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.anat-note b {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 17px;
	letter-spacing: -0.015em;
	margin-bottom: 4px;
}

.anat-note b i,
.anat-card .mk {
	display: inline-grid;
	place-items: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	font-style: normal;
	font-family: var(--mono);
	font-size: 11px;
	font-weight: 600;
	background: var(--paper-2);
	color: var(--ink-2);
	flex-shrink: 0;
	transition: background 0.3s ease, color 0.3s ease;
}

.anat-note small {
	display: block;
	font-size: 14.5px;
	color: var(--ink-2);
	line-height: 1.5;
}

.anat-note.hi {
	border-color: var(--forest-3);
	box-shadow: 0 24px 40px -30px rgba(16, 41, 30, 0.55);
	transform: translateY(-2px);
}

.anat-note.hi .ic-box {
	background: var(--forest);
	border-color: var(--forest);
	color: var(--lime);
	--ic-fill: rgba(200, 241, 105, 0.22);
}

.anat-note.hi b i,
.anat-card .ac-row.hi .mk {
	background: var(--lime);
	color: var(--forest);
}

.anat-card {
	position: relative;
	padding: 20px;
	border-radius: 24px;
	background:
		radial-gradient(90% 60% at 50% 120%, rgba(200, 241, 105, 0.32), transparent 70%),
		var(--forest);
	color: var(--white);
	box-shadow: 0 40px 80px -40px rgba(16, 41, 30, 0.7);
}

.ac-top {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	font-size: 15px;
}

.ac-top .fl {
	width: 30px;
	height: 30px;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15);
}

.ac-top .state {
	margin-left: auto;
}

.ac-row {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 30px 11px 12px;
	border-radius: 12px;
	border: 1px solid transparent;
	transition: background 0.3s ease, border-color 0.3s ease;
}

.ac-row + .ac-row {
	margin-top: 2px;
}

.ac-row small {
	font-size: 13px;
	color: rgba(255, 255, 255, 0.6);
}

.ac-row b {
	margin-left: auto;
	font-family: var(--mono);
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}

.ac-row .mk {
	position: absolute;
	right: 4px;
	top: 50%;
	margin-top: -10px;
	background: rgba(255, 255, 255, 0.14);
	color: var(--white);
}

.ac-row.hi {
	background: rgba(200, 241, 105, 0.1);
	border-color: rgba(200, 241, 105, 0.3);
}

.po-strip {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	margin-top: 56px;
	border-radius: 20px;
	overflow: hidden;
	background: var(--line);
	border: 1px solid var(--line);
}

.po-strip > div {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	gap: 14px;
	padding: 22px;
	background: var(--paper);
}

.po-strip .ic-box {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	display: grid;
	place-items: center;
	background: var(--forest);
	color: var(--lime);
	--ic-fill: rgba(200, 241, 105, 0.22);
}

.po-strip b {
	display: block;
	font-size: 16px;
	letter-spacing: -0.01em;
	margin-bottom: 2px;
}

.po-strip small {
	display: block;
	font-size: 14.5px;
	color: var(--ink-2);
	line-height: 1.5;
}

/* Status model */

.sm {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr) 72px minmax(0, 1fr);
	grid-template-rows: auto auto;
	row-gap: 28px;
	align-items: stretch;
	padding: 32px;
	border-radius: 24px;
	border: 1px solid var(--line-dark);
	background:
		radial-gradient(60% 80% at 50% 0%, rgba(200, 241, 105, 0.07), transparent 70%),
		rgba(255, 255, 255, 0.015);
}

.sm-node {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 22px;
	border-radius: 18px;
	border: 1px solid var(--line-dark);
	background: var(--forest-2);
	transition: border-color 0.4s ease, background 0.4s ease, box-shadow 0.4s ease;
}

.sm-b {
	width: 46px;
	height: 46px;
	border-radius: 14px;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid var(--line-dark);
	color: rgba(255, 255, 255, 0.75);
	transition: inherit;
}

.sm-b .ic {
	width: 24px;
	height: 24px;
}

.sm-node code {
	font-size: 16px;
	font-weight: 600;
	color: var(--white);
}

.sm-node small {
	color: rgba(255, 255, 255, 0.62);
	font-size: 14.5px;
	line-height: 1.5;
}

.sm-node em {
	margin-top: auto;
	font-style: normal;
	font-family: var(--mono);
	font-size: 12px;
	color: var(--lime);
	background: rgba(200, 241, 105, 0.07);
	border: 1px solid rgba(200, 241, 105, 0.16);
	padding: 5px 9px;
	border-radius: 8px;
}

.sm-node.on {
	border-color: rgba(200, 241, 105, 0.45);
	background: #1b3f2e;
	box-shadow: 0 20px 50px -24px rgba(200, 241, 105, 0.35);
}

.sm-node.on .sm-b {
	background: var(--lime);
	border-color: var(--lime);
	color: var(--forest);
	--ic-fill: rgba(16, 41, 30, 0.15);
}

.sm-link {
	position: relative;
	align-self: center;
	height: 2px;
	background: rgba(255, 255, 255, 0.12);
	overflow: hidden;
}

.sm-link i {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: var(--lime);
	transition: width 0.7s var(--ease-out);
}

.sm-link.on i {
	width: 100%;
}

.sm-elbow {
	grid-column: 3 / 5;
	grid-row: 2;
	align-self: start;
	height: 64px;
	margin-left: 50%;
	margin-top: -28px;
	border-left: 2px dashed rgba(255, 255, 255, 0.18);
	border-bottom: 2px dashed rgba(255, 255, 255, 0.18);
	border-bottom-left-radius: 18px;
}

.sm-node.fail {
	grid-column: 5;
	grid-row: 2;
	border-style: dashed;
	background: rgba(255, 255, 255, 0.02);
}

.sm-node.fail .sm-b {
	color: #ff9e80;
	--ic-fill: rgba(239, 111, 77, 0.18);
}

.sm-node.fail em {
	color: #ff9e80;
	background: rgba(239, 111, 77, 0.08);
	border-color: rgba(239, 111, 77, 0.22);
}

.sm-events {
	grid-column: 1 / 3;
	grid-row: 2;
	align-self: start;
	box-shadow: none;
}

.sm-events .ev {
	grid-template-columns: 64px minmax(0, 1fr) auto;
}

.sm-events .ev span:nth-child(2) {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sm-checks {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
	margin: 48px 0 0;
}

/* Batch */

.po-batch .batch {
	width: 100%;
	max-width: 520px;
	margin: 0 auto;
}

.po-batch .batch-row .st {
	white-space: nowrap;
}

.batch-foot {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 4px;
	padding-top: 14px;
	border-top: 1px solid var(--paper-2);
	font-size: 13px;
	color: var(--muted);
}

.batch-foot .ic {
	width: 17px;
	height: 17px;
	color: var(--forest);
}

/* Responsive */

@media (max-width: 1080px) {
	.po-demo {
		max-width: 640px;
	}

	.po-chooser {
		grid-template-columns: 1fr;
	}

	.po-qcard {
		position: static;
		max-width: 560px;
	}

	.anat {
		grid-template-columns: 1fr 1fr;
	}

	.anat-card {
		grid-column: 1 / -1;
		grid-row: 1;
		max-width: 520px;
		width: 100%;
		justify-self: center;
	}

	.po-strip {
		grid-template-columns: 1fr;
	}

	.sm {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		row-gap: 0;
	}

	.sm-link {
		width: 2px;
		height: 28px;
		margin-left: 44px;
	}

	.sm-link i {
		inset: 0 0 auto 0;
		width: 100%;
		height: 0;
		transition: height 0.7s var(--ease-out);
	}

	.sm-link.on i {
		height: 100%;
	}

	.sm-elbow {
		display: none;
	}

	.sm-node.fail {
		grid-column: auto;
		grid-row: auto;
		margin-top: 16px;
	}

	.sm-events {
		grid-column: auto;
		grid-row: auto;
		margin-top: 16px;
	}

	.sm-checks {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

@media (max-width: 680px) {
	.po-demo {
		padding: 0 0 8px;
	}

	.po-bank {
		display: none;
	}

	.po-lock {
		grid-template-columns: 40px minmax(0, 1fr);
	}

	.po-accept {
		grid-column: 1 / -1;
		text-align: center;
	}

	.po-fund {
		grid-template-columns: 1fr;
		inset: 0;
	}

	.po-qr {
		display: none;
	}

	.po-tl .tl .bar {
		width: 70px;
	}

	.po-regions {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.po-reg.big {
		grid-column: 1 / -1;
	}

	.po-reg.big .po-reg-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.po-qcard {
		padding: 16px;
	}

	.qc-quote .po-leg b,
	.qc-quote .po-leg input {
		font-size: 22px;
	}

	.anat {
		grid-template-columns: 1fr;
	}

	.anat-card {
		padding: 16px;
	}

	.sm {
		padding: 18px;
	}
}

/* Screenshots and reduced motion: final state, no loops */

.shot .po-wait i {
	animation: none;
}

@media (prefers-reduced-motion: reduce) {
	.po-wait i,
	.qc-out-flash {
		animation: none;
	}
}