/* All chrome buttons share the V3 sizing and states. */
.site-button {
	min-block-size: var(--button-height-primary);
	padding-inline: var(--button-padding-inline);
	border-radius: var(--radius-control);
	font-size: var(--button-font-size);
	font-weight: var(--button-font-weight);
	min-inline-size: 0;
	white-space: normal;
	text-align: center;
	overflow-wrap: anywhere;
	transition: transform var(--dur-hover) var(--ease-out), opacity var(--dur-hover) var(--ease-out);
}
.site-button--secondary {
	border-color: hsl(var(--border-strong));
	background: hsl(var(--background));
	color: hsl(var(--foreground));
}
.site-button--text {
	min-block-size: var(--target-min);
	padding-inline: 0;
	background: transparent;
	color: hsl(var(--accent-conversion));
	text-decoration: underline;
}
.site-button:focus-visible {
	outline: var(--focus-width) solid hsl(var(--accent-conversion));
	outline-offset: var(--focus-offset);
}
.site-button:active { transform: scale(.98); }
.site-button:disabled,
.site-button[aria-disabled="true"] {
	background: hsl(var(--muted));
	border-color: hsl(var(--border-strong));
	color: hsl(var(--muted-foreground));
	text-decoration: none;
	cursor: not-allowed;
	transform: none;
}
.site-button:disabled::before,
.site-button[aria-disabled="true"]::before { display: none; }
@media (hover: hover) and (pointer: fine) {
	.site-button:not(:disabled):not([aria-disabled="true"]):hover { transform: translateY(-2px); }
	.site-button--secondary:not(:disabled):hover {
		background: hsl(var(--muted));
		color: hsl(var(--foreground));
	}
}
@media (hover: none) {
	.site-button:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.site-button { transition: none; }
	.site-button:not(:disabled):not([aria-disabled="true"]):hover,
	.site-button:active { transform: none; }
}