@font-face {
	font-family: 'Neutral Sans';
	src: url('/fonts/neutral-sans.woff2') format('woff2-variations'),
	     url('/fonts/neutral-sans.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

.glass {
	background: rgba(255, 253, 247, 0.7);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

body.bg-base-bg {
	background-color: #7d99ff;
}

/*
 * Figma tiles this same texture/noise pair 5x and 8x respectively down a tall virtual
 * canvas (each tile is exactly frame-width, repeating only vertically). CSS repeat-y at
 * 100% width reproduces that identically with the one underlying asset.
 */
body.bg-base-bg::before {
	content: "";
	position: fixed;
	inset: 0;
	background-image: url("/img/dalada-texture.jpg");
	background-repeat: repeat-y;
	background-size: 100% auto;
	mix-blend-mode: multiply;
	opacity: 0.53;
	pointer-events: none;
	z-index: -1;
	filter: invert(5%);
}

body.bg-base-bg::after {
	content: "";
	position: fixed;
	inset: 0;
	background-image: url("/img/dalada-noise.jpg");
	background-repeat: repeat-y;
	background-size: 100% auto;
	mix-blend-mode: plus-lighter;
	opacity: 0.3;
	pointer-events: none;
	z-index: -1;
}