/*
 * The public live page's frame and its name lockups (the venue screen has /screen.css). Every
 * colour and face is a tenant token (see /tenants/<key>.css); this file only lays things out.
 */
@font-face {
	font-family: 'Oswald';
	src: url('/fonts/oswald-latin.woff2') format('woff2');
	font-weight: 200 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'DM Sans';
	src: url('/fonts/dm-sans-latin.woff2') format('woff2');
	font-weight: 200 700;
	font-style: normal;
	font-display: swap;
}
:root {
	--site-max: 1100px;
	--site-radius: 10px;
}
.site-page {
	padding: 20px max(16px, env(safe-area-inset-left)) 48px;
	max-width: var(--site-max);
	margin-inline: auto;
}
.site-page h2 {
	margin: 28px 0 12px;
	font: 700 14px/1 var(--font-display);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--muted);
}

/* Names are never cut: a pair wraps to a second line at its ×, and each player stays whole on a
   line. */
.site-x {
	font-style: normal;
	color: var(--accent);
}
.site-player {
	white-space: nowrap;
}
.site-foot {
	margin-top: 40px;
	font-size: 12px;
	color: var(--muted);
}