@charset "UTF-8";
@layer oss,oss.reset,oss.enhancer,oss.properties,oss.elements,oss.override;
@layer oss.reset
{

	:root
	{
		font-size: 10px;
	}

	*:where(:not(iframe, canvas, dialog, img, svg, video):not(svg *, symbol *))
	{
		all: unset;
		display: revert;
	}

	*,
	*::before,
	*::after
	{
		box-sizing: border-box;
	}

	a, button
	{
		cursor: revert;
	}

	body
	{
		height: 100%;
		margin: 0;
		padding: 0;
	}

	img
	{
		background-repeat: no-repeat;
		background-size: cover;
		display: block;
		font-style: italic;
		max-width: 100%;
		shape-margin: 1rem;
	}

	ol,
	ul,
	menu
	{
		list-style: none;
	}

	table
	{
		border-collapse: collapse;
	}

	textarea
	{
		white-space: revert;
	}
	meter
	{
		-webkit-appearance: revert;
		appearance: revert;
	}

	::placeholder
	{
		color: unset;
	}

	:where([hidden])
	{
		display: none;
	}

	:where([contenteditable])
	{
		-moz-user-modify: read-write;
		-webkit-user-modify: read-write;
		-webkit-line-break: after-white-space;
		overflow-wrap: break-word;
	}

	:where([draggable="true"])
	{
		-webkit-user-drag: element;
	}
	
	/* */
	iframe
	{
		border: none;
	}

}
@layer oss.enhancer
{

	p,
	li,
	h1,
	h2,
	h3,
	h4
	{
		hyphens: none;
		overflow-wrap: break-word;
		text-wrap: balance;
	}

}
@layer oss.properties
{

	:root {
		color-scheme: light dark;
	}

}@layer oss.properties
{

	/* :::: fonts-size */
	:root
	{
		--font-size-xxxs: clamp(0.65536rem, -0.060894cqi + 0.679718rem, 0.601773rem);
		--font-size-xxs: clamp(0.8192rem, -0.019359cqi + 0.826944rem, 0.802164rem);
		--font-size-xs: clamp(1.024rem, 0.05146cqi + 1.003416rem, 1.069285rem);
		--font-size-s: clamp(1.28rem, 0.165178cqi + 1.213929rem, 1.425356rem);
		--font-size: clamp(1.6rem, 0.340909cqi + 1.463636rem, 1.9rem);
		--font-size-m: clamp(2rem, 0.605341cqi + 1.757864rem, 2.5327rem);
		--font-size-l: clamp(2.5rem, 0.995556cqi + 2.101778rem, 3.376089rem);
		--font-size-xl: clamp(3.125rem, 1.562871cqi + 2.499851rem, 4.500327rem);
		--font-size-xxl: clamp(3.90625rem, 2.378052cqi + 2.955029rem, 5.998936rem);
		--font-size-xxxl: clamp(4.882813rem, 3.538373cqi + 3.467463rem, 7.996581rem);
	}

	/* :::: fonts-weight */
	:root {
		--font-weight: var(--font-weight-normal);
		--font-weight-thin: 100;
		--font-weight-extraLight: 200;
		--font-weight-light: 300;
		--font-weight-normal: 400;
		--font-weight-medium: 500;
		--font-weight-semiBold: 600;
		--font-weight-bold: 700;
		--font-weight-extraBold: 800;
		--font-weight-black: 900;
	}

	@supports not(font-size: 1cqi)
	{
		
		:root
		{
			--font-size-xxxs: clamp(0.65536rem, -0.060894vw + 0.679718rem, 0.601773rem);
			--font-size-xxs: clamp(0.8192rem, -0.019359vw + 0.826944rem, 0.802164rem);
			--font-size-xs: clamp(1.024rem, 0.05146vw + 1.003416rem, 1.069285rem);
			--font-size-s: clamp(1.28rem, 0.165178vw + 1.213929rem, 1.425356rem);
			--font-size: clamp(1.6rem, 0.340909vw + 1.463636rem, 1.9rem);
			--font-size-m: clamp(2rem, 0.605341vw + 1.757864rem, 2.5327rem);
			--font-size-l: clamp(2.5rem, 0.995556vw + 2.101778rem, 3.376089rem);
			--font-size-xl: clamp(3.125rem, 1.562871vw + 2.499851rem, 4.500327rem);
			--font-size-xxl: clamp(3.90625rem, 2.378052vw + 2.955029rem, 5.998936rem);
			--font-size-xxxl: clamp(4.882813rem, 3.538373vw + 3.467463rem, 7.996581rem);
		}

	}

}
@layer oss.properties
{

	/* :::: gaps */
	:root
	{
		--gap-double-width: calc(var(--gap-width) * 2);
		--gap-double-and-half-width: calc(var(--gap-width) * 2.5);
		--gap-eighth-width: calc(var(--gap-width) / 8);
		--gap-fourfold-width: calc(var(--gap-width) * 4);
		--gap-half-and-width: calc(var(--gap-width) * 1.5);
		--gap-half-width: calc(var(--gap-width) / 2);
		--gap-quarter-width: calc(var(--gap-width) / 4);
		--gap-three-quarter-width: calc(var(--gap-width) / 4 * 3);
		--gap-threefold-width: calc(var(--gap-width) * 3);
		--gap-third-width: calc(var(--gap-width) / 3);
		--gap-two-thirds-width: calc(var(--gap-width) / 3 * 2);
		--gap-width: 1.6rem;
	}

}
@layer oss.properties
{

	/* :::: ratios */
	:root
	{
		--ratio-golden: 1.6180/1;
		--ratio-golden-vertical: 1/1.6180;
		--ratio-landscape: 4/3;
		--ratio-portrait: 3/4;
		--ratio-square: 1;
		--ratio-ultrawide: 18/5;
		--ratio-widescreen: 16/9;
	}

}
@layer oss.properties
{

	/* ::::: site */
	:root
	{
		--site-constrained-max-width: 96rem;
		--site-gutter-min-width: max(var(--gap-width),env(safe-area-inset-right),env(safe-area-inset-left));
	}

}
@layer oss.elements
{

	.œPage
	{
		--œView-column-gap: 0;
		--œView-constrained-column: minmax(0, var(--œView-constrained-max-width));
		--œView-constrained-max-width: var(--site-constrained-max-width);
		--œView-gutter-min-width: var(--site-gutter-min-width);
	}

	.œPage
	{

		display: grid;
		gap: 0;
		grid-auto-rows: min-content;
		grid-template-columns:
			[bleed-start]
				minmax(var(--œView-gutter-min-width),1fr)
			[constrained-start]
				var(--œView-constrained-column)
			[constrained-end]
				minmax(var(--œView-gutter-min-width),1fr)
			[bleed-end];

		& > :not(.__bleed)
		{
			grid-column: constrained;
		}

		& > .__bleed
		{
			grid-column: bleed;
		}

	}

	@supports not (selector(&))
	{

		.œPage > :not(.__bleed)
		{
			grid-column: constrained;
		}

		.œPage > .__bleed
		{
			grid-column: bleed;
		}

	}

}
@layer oss.elements
{

	.œSection
	{
		
	}

	.œSection.-bleed
	{
		--œSection-column-gap: 0;
		--œSection-constrained-column: minmax(0, var(--œSection-constrained-max-width));
		--œSection-constrained-max-width: var(--site-constrained-max-width);
		--œSection-gutter-min-width: var(--site-gutter-min-width);

		display: grid;
		gap: 0;
		grid-auto-rows: min-content;
		grid-column: bleed;
		grid-template-columns:
			[edge-start]
				minmax(var(--œSection-gutter-min-width),1fr)
			[constrained-start]
				var(--œSection-constrained-column)
			[constrained-end]
				minmax(var(--œSection-gutter-min-width),1fr)
			[edge-end];

		& > :not(.__bleed)
		{
			grid-column: constrained;
		}

		& > .__bleed
		{
			grid-column: edge;
		}
	}

	

	@supports not (selector(&))
	{
		.œView
		{
		}

		.œView > :not(.__bleed)
		{
			grid-column: constrained;
		}

		.œView > .__bleed
		{
			grid-column: edge;
		}

	}
}