@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Besley:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://cdn.cyxth.com/fonts/main.css');
html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	-moz-tab-size: 4;
	tab-size: 4;
	word-break: normal;
}
*,
:after,
:before {
	background-repeat: no-repeat;
	box-sizing: inherit;
}
:after,
:before {
	text-decoration: inherit;
	vertical-align: inherit;
}
* {
	margin: 0;
	padding: 0;
}
hr {
	color: inherit;
	height: 0;
	overflow: visible;
}
details,
main {
	display: block;
}
summary {
	display: list-item;
}
small {
	font-size: 80%;
}
[hidden] {
	display: none;
}
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}
a {
	background-color: transparent;
}
a:active,
a:hover {
	outline-width: 0;
}
code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
}
pre {
	font-size: 1em;
}
b,
strong {
	font-weight: bolder;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
table {
	border-color: inherit;
	text-indent: 0;
}
iframe {
	border-style: none;
}
input {
	border-radius: 0;
}
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
	height: auto;
}
[type='search'] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}
[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}
textarea {
	overflow: auto;
	resize: vertical;
}
button,
input,
optgroup,
select,
textarea {
	font: inherit;
}
optgroup {
	font-weight: 700;
}
button {
	overflow: visible;
}
button,
select {
	text-transform: none;
}
[role='button'],
[type='button'],
[type='reset'],
[type='submit'],
button {
	cursor: pointer;
}
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner,
button::-moz-focus-inner {
	border-style: none;
	padding: 0;
}
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner,
button:-moz-focusring {
	outline: 1px dotted ButtonText;
}
[type='reset'],
[type='submit'],
button,
html [type='button'] {
	-webkit-appearance: button;
}
button,
input,
select,
textarea {
	background-color: transparent;
	border-style: none;
}
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
	outline-width: 0;
}
select {
	-moz-appearance: none;
	-webkit-appearance: none;
}
select::-ms-expand {
	display: none;
}
select::-ms-value {
	color: currentColor;
}
legend {
	border: 0;
	color: inherit;
	display: table;
	max-width: 100%;
	white-space: normal;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	color: inherit;
	font: inherit;
}
[disabled] {
	cursor: default;
}
img {
	border-style: none;
}
progress {
	vertical-align: baseline;
}
[aria-busy='true'] {
	cursor: progress;
}
[aria-controls] {
	cursor: pointer;
}
[aria-disabled='true'] {
	cursor: default;
}
:root {
	--oc-white: #fff;
	--oc-white-rgb: 255, 255, 255;
	--oc-black: #000;
	--oc-black-rgb: 0, 0, 0;
	--oc-gray-0: #f8f9fa;
	--oc-gray-0-rgb: 248, 249, 250;
	--oc-gray-1: #f1f3f5;
	--oc-gray-1-rgb: 241, 243, 245;
	--oc-gray-2: #e9ecef;
	--oc-gray-2-rgb: 233, 236, 239;
	--oc-gray-3: #dee2e6;
	--oc-gray-3-rgb: 222, 226, 230;
	--oc-gray-4: #ced4da;
	--oc-gray-4-rgb: 206, 212, 218;
	--oc-gray-5: #adb5bd;
	--oc-gray-5-rgb: 173, 181, 189;
	--oc-gray-6: #868e96;
	--oc-gray-6-rgb: 134, 142, 150;
	--oc-gray-7: #495057;
	--oc-gray-7-rgb: 73, 80, 87;
	--oc-gray-8: #343a40;
	--oc-gray-8-rgb: 52, 58, 64;
	--oc-gray-9: #212529;
	--oc-gray-9-rgb: 33, 37, 41;
	--oc-red-0: #fff5f5;
	--oc-red-0-rgb: 255, 245, 245;
	--oc-red-1: #ffe3e3;
	--oc-red-1-rgb: 255, 227, 227;
	--oc-red-2: #ffc9c9;
	--oc-red-2-rgb: 255, 201, 201;
	--oc-red-3: #ffa8a8;
	--oc-red-3-rgb: 255, 168, 168;
	--oc-red-4: #ff8787;
	--oc-red-4-rgb: 255, 135, 135;
	--oc-red-5: #ff6b6b;
	--oc-red-5-rgb: 255, 107, 107;
	--oc-red-6: #fa5252;
	--oc-red-6-rgb: 250, 82, 82;
	--oc-red-7: #f03e3e;
	--oc-red-7-rgb: 240, 62, 62;
	--oc-red-8: #e03131;
	--oc-red-8-rgb: 224, 49, 49;
	--oc-red-9: #c92a2a;
	--oc-red-9-rgb: 201, 42, 42;
	--oc-pink-0: #fff0f6;
	--oc-pink-0-rgb: 255, 240, 246;
	--oc-pink-1: #ffdeeb;
	--oc-pink-1-rgb: 255, 222, 235;
	--oc-pink-2: #fcc2d7;
	--oc-pink-2-rgb: 252, 194, 215;
	--oc-pink-3: #faa2c1;
	--oc-pink-3-rgb: 250, 162, 193;
	--oc-pink-4: #f783ac;
	--oc-pink-4-rgb: 247, 131, 172;
	--oc-pink-5: #f06595;
	--oc-pink-5-rgb: 240, 101, 149;
	--oc-pink-6: #e64980;
	--oc-pink-6-rgb: 230, 73, 128;
	--oc-pink-7: #d6336c;
	--oc-pink-7-rgb: 214, 51, 108;
	--oc-pink-8: #c2255c;
	--oc-pink-8-rgb: 194, 37, 92;
	--oc-pink-9: #a61e4d;
	--oc-pink-9-rgb: 166, 30, 77;
	--oc-grape-0: #f8f0fc;
	--oc-grape-0-rgb: 248, 240, 252;
	--oc-grape-1: #f3d9fa;
	--oc-grape-1-rgb: 243, 217, 250;
	--oc-grape-2: #eebefa;
	--oc-grape-2-rgb: 238, 190, 250;
	--oc-grape-3: #e599f7;
	--oc-grape-3-rgb: 229, 153, 247;
	--oc-grape-4: #da77f2;
	--oc-grape-4-rgb: 218, 119, 242;
	--oc-grape-5: #cc5de8;
	--oc-grape-5-rgb: 204, 93, 232;
	--oc-grape-6: #be4bdb;
	--oc-grape-6-rgb: 190, 75, 219;
	--oc-grape-7: #ae3ec9;
	--oc-grape-7-rgb: 174, 62, 201;
	--oc-grape-8: #9c36b5;
	--oc-grape-8-rgb: 156, 54, 181;
	--oc-grape-9: #862e9c;
	--oc-grape-9-rgb: 134, 46, 156;
	--oc-violet-0: #f3f0ff;
	--oc-violet-0-rgb: 243, 240, 255;
	--oc-violet-1: #e5dbff;
	--oc-violet-1-rgb: 229, 219, 255;
	--oc-violet-2: #d0bfff;
	--oc-violet-2-rgb: 208, 191, 255;
	--oc-violet-3: #b197fc;
	--oc-violet-3-rgb: 177, 151, 252;
	--oc-violet-4: #9775fa;
	--oc-violet-4-rgb: 151, 117, 250;
	--oc-violet-5: #845ef7;
	--oc-violet-5-rgb: 132, 94, 247;
	--oc-violet-6: #7950f2;
	--oc-violet-6-rgb: 121, 80, 242;
	--oc-violet-7: #7048e8;
	--oc-violet-7-rgb: 112, 72, 232;
	--oc-violet-8: #6741d9;
	--oc-violet-8-rgb: 103, 65, 217;
	--oc-violet-9: #5f3dc4;
	--oc-violet-9-rgb: 95, 61, 196;
	--oc-indigo-0: #edf2ff;
	--oc-indigo-0-rgb: 237, 242, 255;
	--oc-indigo-1: #dbe4ff;
	--oc-indigo-1-rgb: 219, 228, 255;
	--oc-indigo-2: #bac8ff;
	--oc-indigo-2-rgb: 186, 200, 255;
	--oc-indigo-3: #91a7ff;
	--oc-indigo-3-rgb: 145, 167, 255;
	--oc-indigo-4: #748ffc;
	--oc-indigo-4-rgb: 116, 143, 252;
	--oc-indigo-5: #5c7cfa;
	--oc-indigo-5-rgb: 92, 124, 250;
	--oc-indigo-6: #4c6ef5;
	--oc-indigo-6-rgb: 76, 110, 245;
	--oc-indigo-7: #4263eb;
	--oc-indigo-7-rgb: 66, 99, 235;
	--oc-indigo-8: #3b5bdb;
	--oc-indigo-8-rgb: 59, 91, 219;
	--oc-indigo-9: #364fc7;
	--oc-indigo-9-rgb: 54, 79, 199;
	--oc-blue-0: #e7f5ff;
	--oc-blue-0-rgb: 231, 245, 255;
	--oc-blue-1: #d0ebff;
	--oc-blue-1-rgb: 208, 235, 255;
	--oc-blue-2: #a5d8ff;
	--oc-blue-2-rgb: 165, 216, 255;
	--oc-blue-3: #74c0fc;
	--oc-blue-3-rgb: 116, 192, 252;
	--oc-blue-4: #4dabf7;
	--oc-blue-4-rgb: 77, 171, 247;
	--oc-blue-5: #339af0;
	--oc-blue-5-rgb: 51, 154, 240;
	--oc-blue-6: #228be6;
	--oc-blue-6-rgb: 34, 139, 230;
	--oc-blue-7: #1c7ed6;
	--oc-blue-7-rgb: 28, 126, 214;
	--oc-blue-8: #1971c2;
	--oc-blue-8-rgb: 25, 113, 194;
	--oc-blue-9: #1864ab;
	--oc-blue-9-rgb: 24, 100, 171;
	--oc-cyan-0: #e3fafc;
	--oc-cyan-0-rgb: 227, 250, 252;
	--oc-cyan-1: #c5f6fa;
	--oc-cyan-1-rgb: 197, 246, 250;
	--oc-cyan-2: #99e9f2;
	--oc-cyan-2-rgb: 153, 233, 242;
	--oc-cyan-3: #66d9e8;
	--oc-cyan-3-rgb: 102, 217, 232;
	--oc-cyan-4: #3bc9db;
	--oc-cyan-4-rgb: 59, 201, 219;
	--oc-cyan-5: #22b8cf;
	--oc-cyan-5-rgb: 34, 184, 207;
	--oc-cyan-6: #15aabf;
	--oc-cyan-6-rgb: 21, 170, 191;
	--oc-cyan-7: #1098ad;
	--oc-cyan-7-rgb: 16, 152, 173;
	--oc-cyan-8: #0c8599;
	--oc-cyan-8-rgb: 12, 133, 153;
	--oc-cyan-9: #0b7285;
	--oc-cyan-9-rgb: 11, 114, 133;
	--oc-teal-0: #e6fcf5;
	--oc-teal-0-rgb: 230, 252, 245;
	--oc-teal-1: #c3fae8;
	--oc-teal-1-rgb: 195, 250, 232;
	--oc-teal-2: #96f2d7;
	--oc-teal-2-rgb: 150, 242, 215;
	--oc-teal-3: #63e6be;
	--oc-teal-3-rgb: 99, 230, 190;
	--oc-teal-4: #38d9a9;
	--oc-teal-4-rgb: 56, 217, 169;
	--oc-teal-5: #20c997;
	--oc-teal-5-rgb: 32, 201, 151;
	--oc-teal-6: #12b886;
	--oc-teal-6-rgb: 18, 184, 134;
	--oc-teal-7: #0ca678;
	--oc-teal-7-rgb: 12, 166, 120;
	--oc-teal-8: #099268;
	--oc-teal-8-rgb: 9, 146, 104;
	--oc-teal-9: #087f5b;
	--oc-teal-9-rgb: 8, 127, 91;
	--oc-green-0: #ebfbee;
	--oc-green-0-rgb: 235, 251, 238;
	--oc-green-1: #d3f9d8;
	--oc-green-1-rgb: 211, 249, 216;
	--oc-green-2: #b2f2bb;
	--oc-green-2-rgb: 178, 242, 187;
	--oc-green-3: #8ce99a;
	--oc-green-3-rgb: 140, 233, 154;
	--oc-green-4: #69db7c;
	--oc-green-4-rgb: 105, 219, 124;
	--oc-green-5: #51cf66;
	--oc-green-5-rgb: 81, 207, 102;
	--oc-green-6: #40c057;
	--oc-green-6-rgb: 64, 192, 87;
	--oc-green-7: #37b24d;
	--oc-green-7-rgb: 55, 178, 77;
	--oc-green-8: #2f9e44;
	--oc-green-8-rgb: 47, 158, 68;
	--oc-green-9: #2b8a3e;
	--oc-green-9-rgb: 43, 138, 62;
	--oc-lime-0: #f4fce3;
	--oc-lime-0-rgb: 244, 252, 227;
	--oc-lime-1: #e9fac8;
	--oc-lime-1-rgb: 233, 250, 200;
	--oc-lime-2: #d8f5a2;
	--oc-lime-2-rgb: 216, 245, 162;
	--oc-lime-3: #c0eb75;
	--oc-lime-3-rgb: 192, 235, 117;
	--oc-lime-4: #a9e34b;
	--oc-lime-4-rgb: 169, 227, 75;
	--oc-lime-5: #94d82d;
	--oc-lime-5-rgb: 148, 216, 45;
	--oc-lime-6: #82c91e;
	--oc-lime-6-rgb: 130, 201, 30;
	--oc-lime-7: #74b816;
	--oc-lime-7-rgb: 116, 184, 22;
	--oc-lime-8: #66a80f;
	--oc-lime-8-rgb: 102, 168, 15;
	--oc-lime-9: #5c940d;
	--oc-lime-9-rgb: 92, 148, 13;
	--oc-yellow-0: #fff9db;
	--oc-yellow-0-rgb: 255, 249, 219;
	--oc-yellow-1: #fff3bf;
	--oc-yellow-1-rgb: 255, 243, 191;
	--oc-yellow-2: #ffec99;
	--oc-yellow-2-rgb: 255, 236, 153;
	--oc-yellow-3: #ffe066;
	--oc-yellow-3-rgb: 255, 224, 102;
	--oc-yellow-4: #ffd43b;
	--oc-yellow-4-rgb: 255, 212, 59;
	--oc-yellow-5: #fcc419;
	--oc-yellow-5-rgb: 252, 196, 25;
	--oc-yellow-6: #fab005;
	--oc-yellow-6-rgb: 250, 176, 5;
	--oc-yellow-7: #f59f00;
	--oc-yellow-7-rgb: 245, 159, 0;
	--oc-yellow-8: #f08c00;
	--oc-yellow-8-rgb: 240, 140, 0;
	--oc-yellow-9: #e67700;
	--oc-yellow-9-rgb: 230, 119, 0;
	--oc-orange-0: #fff4e6;
	--oc-orange-0-rgb: 255, 244, 230;
	--oc-orange-1: #ffe8cc;
	--oc-orange-1-rgb: 255, 232, 204;
	--oc-orange-2: #ffd8a8;
	--oc-orange-2-rgb: 255, 216, 168;
	--oc-orange-3: #ffc078;
	--oc-orange-3-rgb: 255, 192, 120;
	--oc-orange-4: #ffa94d;
	--oc-orange-4-rgb: 255, 169, 77;
	--oc-orange-5: #ff922b;
	--oc-orange-5-rgb: 255, 146, 43;
	--oc-orange-6: #fd7e14;
	--oc-orange-6-rgb: 253, 126, 20;
	--oc-orange-7: #f76707;
	--oc-orange-7-rgb: 247, 103, 7;
	--oc-orange-8: #e8590c;
	--oc-orange-8-rgb: 232, 89, 12;
	--oc-orange-9: #d9480f;
	--oc-orange-9-rgb: 217, 72, 15;
}
* {
	--success-hue: 150;
	--warning-hue: 37;
	--failure-hue: 349;
	--info-hue: 208;
	--brand-hue: 162;
	--success: hsl(var(--success-hue), 87%, 41%);
	--warning: hsl(var(--warning-hue), 100%, 50%);
	--failure: hsl(var(--failure-hue), 92%, 48%);
	--info: hsl(var(--info-hue), 100%, 62%);
	--link-color: #3da5ff;
	--brand-saturation: 100%;
	--brand-lightness: 62%;
	--brand-light: hsl(var(--brand-hue) 100% 36%);
	--text1-light: hsl(var(--brand-hue) var(--brand-saturation) 10%);
	--text2-light: hsl(var(--brand-hue) 30% 30%);
	--surface1-light: hsl(var(--brand-hue) 25% 97%);
	--surface2-light: hsl(var(--brand-hue) 25% 91%);
	--surface3-light: hsl(var(--brand-hue) 25% 85%);
	--surface4-light: hsl(var(--brand-hue) 25% 78%);
	--surface-shadow-light: var(--brand-hue) 10% 20%;
	--shadow-strength-light: 8%;
	--brand-dark: hsl(var(--brand-hue) var(--brand-saturation) var(--brand-lightness));
	--text1-dark: hsl(var(--brand-hue) 15% 85%);
	--text2-dark: hsl(var(--brand-hue) 5% 65%);
	--surface1-dark: hsl(var(--brand-hue) 7% 5%);
	--surface2-dark: hsl(var(--brand-hue) 7% 8%);
	--surface3-dark: hsl(var(--brand-hue) 4% 12%);
	--surface4-dark: hsl(var(--brand-hue) 4% 14%);
	--surface-shadow-dark: var(--brand-hue) 50% 3%;
	--shadow-strength-dark: 60%;
	--tint-dark: hsla(var(--brand-hue), 7%, 5%, 75%);
	--tint-light: hsla(var(--brand-hue), 25%, 97%, 75%);
}
:root {
	color-scheme: light;
	--brand: var(--brand-light);
	--text-1: var(--text1-light);
	--text-2: var(--text2-light);
	--surface-1: var(--surface1-light);
	--surface-2: var(--surface2-light);
	--surface-3: var(--surface3-light);
	--surface-4: var(--surface4-light);
	--tint: var(--tint-light) --surface-shadow: var(--surface-shadow-light);
	--shadow-strength: var(--shadow-strength-light);
}
@media (prefers-color-scheme: dark) {
	:root {
		color-scheme: dark;
		--brand: var(--brand-dark);
		--text-1: var(--text1-dark);
		--text-2: var(--text2-dark);
		--textdim: var(--text-dim-dark);
		--surface-1: var(--surface1-dark);
		--surface-2: var(--surface2-dark);
		--surface-3: var(--surface3-dark);
		--surface-4: var(--surface4-dark);
		--surface-shadow: var(--surface-shadow-dark);
		--shadow-strength: var(--shadow-strength-dark);
		--tint: var(--tint-dark);
	}
}
[color-scheme='light'] {
	color-scheme: light;
	--brand: var(--brand-light);
	--text-1: var(--text1-light);
	--text-2: var(--text2-light);
	--surface-1: var(--surface1-light);
	--surface-2: var(--surface2-light);
	--surface-3: var(--surface3-light);
	--surface-4: var(--surface4-light);
	--surface-shadow: var(--surface-shadow-light);
	--shadow-strength: var(--shadow-strength-light);
	--tint: var(--tint-light);
}
[color-scheme='dark'] {
	color-scheme: dark;
	--brand: var(--brand-dark);
	--text-1: var(--text1-dark);
	--text-2: var(--text2-dark);
	--textdim: var(--text-dim-dark);
	--surface-1: var(--surface1-dark);
	--surface-2: var(--surface2-dark);
	--surface-3: var(--surface3-dark);
	--surface-4: var(--surface4-dark);
	--surface-shadow: var(--surface-shadow-dark);
	--shadow-strength: var(--shadow-strength-dark);
	--tint: var(--tint-dark);
}
.bg-brand {
	background: var(--brand);
	--text-1: var(--surface-1);
	--text-2: var(--surface-2);
}
.bg-success {
	background-color: var(--success);
}
.bg-warning {
	background-color: var(--warning);
}
.bg-failure {
	background-color: var(--failure);
}
.bg-info {
	background-color: var(--info);
}
.bg-failure,
.bg-info,
.bg-success,
.bg-warning {
	--text-1: var(--surface-1);
	--text-2: var(--surface-2);
}
:where(html) {
	--shadow1: 0 1px 2px -1px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 9%));
	--shadow2:
		0 3px 5px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 7px 14px -5px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 5%));
	--shadow3:
		0 -1px 3px 0 hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 2%)),
		0 1px 2px -5px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 2%)),
		0 2px 5px -5px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 4%)),
		0 4px 12px -5px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 5%)),
		0 12px 15px -5px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 7%));
	--shadow4:
		0 -2px 5px 0 hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 2%)),
		0 1px 1px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 2px 2px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 5px 5px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 4%)),
		0 9px 9px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 5%)),
		0 16px 16px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 6%));
	--shadow5:
		0 -1px 2px 0 hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 2%)),
		0 2px 1px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 5px 5px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 10px 10px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 4%)),
		0 20px 20px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 5%)),
		0 40px 40px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 7%));
	--shadow6:
		0 -1px 2px 0 hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 2%)),
		0 3px 2px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 7px 5px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 3%)),
		0 12px 10px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 4%)),
		0 22px 18px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 5%)),
		0 41px 33px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 6%)),
		0 100px 80px -2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + 7%));
}
* {
	--font-serif: 'Besley', serif;
	--font-san-serif: 'Jost', 'Roboto', 'Segoe ui', san-serif;
	--font-monospace: 'FantasqueMono', monospace;
}
:root {
	--font-step--2: clamp(0.63rem, calc(0.61rem + 0.1vw), 0.7rem);
	--font-step--1: clamp(0.84rem, calc(0.82rem + 0.13vw), 0.94rem);
	--font-step-0: clamp(1.13rem, calc(1.09rem + 0.18vw), 1.25rem);
	--font-step-1: clamp(1.5rem, calc(1.45rem + 0.24vw), 1.67rem);
	--font-step-2: clamp(2rem, calc(1.94rem + 0.32vw), 2.22rem);
	--font-step-3: clamp(2.66rem, calc(2.58rem + 0.42vw), 2.96rem);
	--font-step-4: clamp(3.55rem, calc(3.44rem + 0.56vw), 3.95rem);
	--font-step-5: clamp(4.74rem, calc(4.58rem + 0.75vw), 5.26rem);
	--font-step-6: clamp(6.31rem, calc(6.11rem + 1vw), 7.01rem);
	--fonttracking: 0px;
	--weight-light: 300;
	--weight-normal: 400;
	--weight-medium: 500;
}
.display-1 {
	font-size: var(--font-step-6);
}
.display-2 {
	font-size: var(--font-step-5);
}
.headline-1,
h1 {
	font-size: var(--font-step-4);
}
.headline-2,
h2 {
	font-size: var(--font-step-3);
}
.headline-3,
h3 {
	font-size: var(--font-step-2);
}
.title,
h4 {
	font-size: var(--font-step-1);
}
.heading-label,
h5 {
	font-size: var(--font-step-0);
}
.subtitle,
h6 {
	font-size: var(--font-step--1);
}
.small,
small {
	font-size: var(--font-step--2);
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: var(--weight-normal);
}
* {
	scrollbar-color: var(--surface-4);
	scrollbar-width: thin;
}
::-webkit-scrollbar {
	height: 4px;
	width: 4px;
}
* ::-webkit-scrollbar-thumb {
	background-color: var(--surface-4);
	border-radius: 20px;
}
:where(html) {
	--gradient-1: linear-gradient(
		to bottom right,
		#1f005c,
		#5b0060,
		#870160,
		#ac255e,
		#ca485c,
		#e16b5c,
		#f39060,
		#ffb56b
	);
	--gradient-2: linear-gradient(to bottom right, #48005c, #8300e2, #a269ff);
	--gradient-3:
		radial-gradient(circle at top right, #0ff, rgba(0, 255, 255, 0)),
		radial-gradient(circle at bottom left, #ff1492, rgba(255, 20, 146, 0));
	--gradient-4: linear-gradient(to bottom right, #00f5a0, #00d9f5);
	--gradient-5: conic-gradient(from -270deg at 75% 110%, #f0f, #fffaf0);
	--gradient-6: conic-gradient(from -90deg at top left, #000, #fff);
	--gradient-7: linear-gradient(to bottom right, #72c6ef, #004e8f);
	--gradient-8: conic-gradient(from 90deg at 50% 0%, #111, 50%, #222, #111);
	--gradient-9: conic-gradient(from 0.5turn at bottom center, #add8e6, #fff);
	--gradient-10: conic-gradient(
		from 90deg at 40% -25%,
		gold,
		#f79d03,
		#ee6907,
		#e6390a,
		#de0d0d,
		#d61039,
		#cf1261,
		#c71585,
		#cf1261,
		#d61039,
		#de0d0d,
		#ee6907,
		#f79d03,
		gold,
		gold,
		gold
	);
	--gradient-11: conic-gradient(at bottom left, #ff1493, cyan);
	--gradient-12: conic-gradient(
		from 90deg at 25% -10%,
		#ff4500,
		#d3f340,
		#7bee85,
		#afeeee,
		#7bee85
	);
	--gradient-13: radial-gradient(
		circle at 50% 200%,
		#000142,
		#3b0083,
		#b300c3,
		#ff059f,
		#ff4661,
		#ffad86,
		#fff3c7
	);
	--gradient-14: conic-gradient(at top right, lime, cyan);
	--gradient-15: linear-gradient(to bottom right, #c7d2fe, #fecaca, #fef3c7);
	--gradient-16: radial-gradient(circle at 50% -250%, #374151, #111827, #000);
	--gradient-17: conic-gradient(from -90deg at 50% -25%, blue, #8a2be2);
	--gradient-18:
		linear-gradient(0deg, rgba(255, 0, 0, 0.8), rgba(255, 0, 0, 0) 75%),
		linear-gradient(60deg, rgba(255, 255, 0, 0.8), rgba(255, 255, 0, 0) 75%),
		linear-gradient(120deg, rgba(0, 255, 0, 0.8), rgba(0, 255, 0, 0) 75%),
		linear-gradient(180deg, rgba(0, 255, 255, 0.8), rgba(0, 255, 255, 0) 75%),
		linear-gradient(240deg, rgba(0, 0, 255, 0.8), rgba(0, 0, 255, 0) 75%),
		linear-gradient(300deg, rgba(255, 0, 255, 0.8), rgba(255, 0, 255, 0) 75%);
	--gradient-19: linear-gradient(to bottom right, #ffe259, #ffa751);
	--gradient-20: conic-gradient(
		from -135deg at -10% center,
		orange,
		#ff7715,
		#ff522a,
		#ff3f47,
		#ff5482,
		#ff69b4
	);
	--gradient-21: conic-gradient(
		from -90deg at 25% 115%,
		red,
		#f06,
		#f0c,
		#c0f,
		#60f,
		#00f,
		#00f,
		#00f,
		#00f
	);
	--gradient-22: linear-gradient(to bottom right, #acb6e5, #86fde8);
	--gradient-23: linear-gradient(to bottom right, #536976, #292e49);
	--gradient-24: conic-gradient(from 0.5turn at 0% 0%, #00c476, 10%, #82b0ff, 90%, #00c476);
	--gradient-25: conic-gradient(at 125% 50%, #b78cf7, #ff7c94, #ffcf0d, #ff7c94, #b78cf7);
	--gradient-26: linear-gradient(to bottom right, #9796f0, #fbc7d4);
	--gradient-27: conic-gradient(from 0.5turn at bottom left, #ff1493, #639);
	--gradient-28: conic-gradient(from -90deg at 50% 105%, #fff, orchid);
	--gradient-29:
		radial-gradient(circle at top right, #bfb3ff, rgba(191, 179, 255, 0)),
		radial-gradient(circle at bottom left, #86acf9, rgba(134, 172, 249, 0));
	--gradient-30:
		radial-gradient(circle at top right, #00ff80, rgba(0, 255, 128, 0)),
		radial-gradient(circle at bottom left, #adffd6, rgba(173, 255, 214, 0));
	--noise-1: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='.005' numOctaves='2' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
	--noise-2: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='.05' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
	--noise-3: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='.25' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
	--noise-4: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2056 2056'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='.5' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
	--noise-5: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2056 2056'%3E%3Cfilter id='a'%3E%3CfeTurbulence baseFrequency='.75' stitchTiles='stitch' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
	--noise-filter-1: contrast(300%) brightness(100%);
	--noise-filter-2: contrast(200%) brightness(150%);
	--noise-filter-3: contrast(200%) brightness(250%);
	--noise-filter-4: contrast(200%) brightness(500%);
	--noise-filter-5: contrast(200%) brightness(1000%);
}
:root {
	--radius-round: 1e5px;
	--radius: 0.375rem;
	--fontsize: 18px;
	--focus-outline: 0.125rem solid var(--brand);
}
:where(html) {
	--layer-1: 1;
	--layer-2: 2;
	--layer-3: 3;
	--layer-4: 4;
	--layer-5: 5;
	--layer-important: 2147483647;
}
html {
	block-size: 100%;
	font-size: var(--fontsize);
	scroll-behavior: smooth;
}
body,
html {
	background-color: var(--surface-1);
	color: var(--text-1);
}
body {
	font-family: var(--font-san-serif);
	min-block-size: 100%;
}
a {
	color: var(--info);
	text-decoration: none;
	&:focus-visible {
		outline: var(--focus-outline);
	}
}
