/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */ @layer properties {
	@supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or
		((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
		*,
		:before,
		:after,
		::backdrop {
			--tw-space-y-reverse: 0;
			--tw-border-style: solid;
			--tw-leading: initial;
			--tw-font-weight: initial;
			--tw-tracking: initial;
			--tw-shadow: 0 0 #0000;
			--tw-shadow-color: initial;
			--tw-shadow-alpha: 100%;
			--tw-inset-shadow: 0 0 #0000;
			--tw-inset-shadow-color: initial;
			--tw-inset-shadow-alpha: 100%;
			--tw-ring-color: initial;
			--tw-ring-shadow: 0 0 #0000;
			--tw-inset-ring-color: initial;
			--tw-inset-ring-shadow: 0 0 #0000;
			--tw-ring-inset: initial;
			--tw-ring-offset-width: 0px;
			--tw-ring-offset-color: #fff;
			--tw-ring-offset-shadow: 0 0 #0000;
			--tw-blur: initial;
			--tw-brightness: initial;
			--tw-contrast: initial;
			--tw-grayscale: initial;
			--tw-hue-rotate: initial;
			--tw-invert: initial;
			--tw-opacity: initial;
			--tw-saturate: initial;
			--tw-sepia: initial;
			--tw-drop-shadow: initial;
			--tw-drop-shadow-color: initial;
			--tw-drop-shadow-alpha: 100%;
			--tw-drop-shadow-size: initial;
			--tw-backdrop-blur: initial;
			--tw-backdrop-brightness: initial;
			--tw-backdrop-contrast: initial;
			--tw-backdrop-grayscale: initial;
			--tw-backdrop-hue-rotate: initial;
			--tw-backdrop-invert: initial;
			--tw-backdrop-opacity: initial;
			--tw-backdrop-saturate: initial;
			--tw-backdrop-sepia: initial;
			--tw-duration: initial;
			--tw-ease: initial;
			--tw-animation-delay: 0s;
			--tw-animation-direction: normal;
			--tw-animation-duration: initial;
			--tw-animation-fill-mode: none;
			--tw-animation-iteration-count: 1;
			--tw-enter-blur: 0;
			--tw-enter-opacity: 1;
			--tw-enter-rotate: 0;
			--tw-enter-scale: 1;
			--tw-enter-translate-x: 0;
			--tw-enter-translate-y: 0;
			--tw-exit-blur: 0;
			--tw-exit-opacity: 1;
			--tw-exit-rotate: 0;
			--tw-exit-scale: 1;
			--tw-exit-translate-x: 0;
			--tw-exit-translate-y: 0;
		}
	}
}
@layer theme {
	:root,
	:host {
		--font-sans: "Geist Variable", sans-serif;
		--spacing: .25rem;
		--container-xl: 36rem;
		--container-2xl: 42rem;
		--container-3xl: 48rem;
		--container-5xl: 64rem;
		--text-xs: .75rem;
		--text-xs--line-height: calc(1 / 0.75);
		--text-sm: .875rem;
		--text-sm--line-height: calc(1.25 / 0.875);
		--text-base: 1rem;
		--text-base--line-height: 1.5;
		--text-lg: 1.125rem;
		--text-lg--line-height: calc(1.75 / 1.125);
		--text-xl: 1.25rem;
		--text-xl--line-height: calc(1.75 / 1.25);
		--text-2xl: 1.5rem;
		--text-2xl--line-height: calc(2 / 1.5);
		--text-4xl: 2.25rem;
		--text-4xl--line-height: calc(2.5 / 2.25);
		--text-5xl: 3rem;
		--text-5xl--line-height: 1;
		--text-6xl: 3.75rem;
		--text-6xl--line-height: 1;
		--text-7xl: 4.5rem;
		--text-7xl--line-height: 1;
		--text-9xl: 8rem;
		--text-9xl--line-height: 1;
		--font-weight-medium: 500;
		--font-weight-semibold: 600;
		--tracking-tight: -.025em;
		--tracking-wider: .05em;
		--leading-relaxed: 1.625;
		--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
		--default-transition-duration: .15s;
		--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
		--default-font-family: "Geist Variable", sans-serif;
		--default-mono-font-family: "JetBrains Mono Variable", "JetBrains Mono",
			monospace;
	}
}
@layer base {
	*,
	:after,
	:before,
	::backdrop {
		box-sizing: border-box;
		border: 0 solid;
		margin: 0;
		padding: 0;
	}
	::file-selector-button {
		box-sizing: border-box;
		border: 0 solid;
		margin: 0;
		padding: 0;
	}
	html,
	:host {
		-webkit-text-size-adjust: 100%;
		tab-size: 4;
		line-height: 1.5;
		font-family: var(
			--default-font-family,
			ui-sans-serif,
			system-ui,
			sans-serif,
			"Apple Color Emoji",
			"Segoe UI Emoji",
			"Segoe UI Symbol",
			"Noto Color Emoji"
		);
		font-feature-settings: var(--default-font-feature-settings, normal);
		font-variation-settings: var(--default-font-variation-settings, normal);
		-webkit-tap-highlight-color: transparent;
	}
	hr {
		height: 0;
		color: inherit;
		border-top-width: 1px;
	}
	abbr:where([title]) {
		-webkit-text-decoration: underline dotted;
		text-decoration: underline dotted;
	}
	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-size: inherit;
		font-weight: inherit;
	}
	a {
		color: inherit;
		-webkit-text-decoration: inherit;
		text-decoration: inherit;
	}
	b,
	strong {
		font-weight: bolder;
	}
	code,
	kbd,
	samp,
	pre {
		font-family: var(
			--default-mono-font-family,
			ui-monospace,
			SFMono-Regular,
			Menlo,
			Monaco,
			Consolas,
			"Liberation Mono",
			"Courier New",
			monospace
		);
		font-feature-settings: var(--default-mono-font-feature-settings, normal);
		font-variation-settings: var(--default-mono-font-variation-settings, normal);
		font-size: 1em;
	}
	small {
		font-size: 80%;
	}
	sub,
	sup {
		vertical-align: baseline;
		font-size: 75%;
		line-height: 0;
		position: relative;
	}
	sub {
		bottom: -.25em;
	}
	sup {
		top: -.5em;
	}
	table {
		text-indent: 0;
		border-color: inherit;
		border-collapse: collapse;
	}
	:-moz-focusring {
		outline: auto;
	}
	progress {
		vertical-align: baseline;
	}
	summary {
		display: list-item;
	}
	ol,
	ul,
	menu {
		list-style: none;
	}
	img,
	svg,
	video,
	canvas,
	audio,
	iframe,
	embed,
	object {
		vertical-align: middle;
		display: block;
	}
	img,
	video {
		max-width: 100%;
		height: auto;
	}
	button,
	input,
	select,
	optgroup,
	textarea {
		font: inherit;
		font-feature-settings: inherit;
		font-variation-settings: inherit;
		letter-spacing: inherit;
		color: inherit;
		opacity: 1;
		background-color: #0000;
		border-radius: 0;
	}
	::file-selector-button {
		font: inherit;
		font-feature-settings: inherit;
		font-variation-settings: inherit;
		letter-spacing: inherit;
		color: inherit;
		opacity: 1;
		background-color: #0000;
		border-radius: 0;
	}
	:where(select:is([multiple], [size])) optgroup {
		font-weight: bolder;
	}
	:where(select:is([multiple], [size])) optgroup option {
		padding-inline-start: 20px;
	}
	::file-selector-button {
		margin-inline-end: 4px;
	}
	::placeholder {
		opacity: 1;
	}
	@supports (not ((-webkit-appearance: -apple-pay-button))) or
		(contain-intrinsic-size: 1px) {
		::placeholder {
			color: currentColor;
		}
		@supports (color: color-mix(in lab, red, red)) {
			::placeholder {
				color: color-mix(in oklab, currentcolor 50%, transparent);
			}
		}
	}
	textarea {
		resize: vertical;
	}
	::-webkit-search-decoration {
		-webkit-appearance: none;
	}
	::-webkit-date-and-time-value {
		min-height: 1lh;
		text-align: inherit;
	}
	::-webkit-datetime-edit {
		display: inline-flex;
	}
	::-webkit-datetime-edit-fields-wrapper {
		padding: 0;
	}
	::-webkit-datetime-edit {
		padding-block: 0;
	}
	::-webkit-datetime-edit-year-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-month-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-day-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-hour-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-minute-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-second-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-millisecond-field {
		padding-block: 0;
	}
	::-webkit-datetime-edit-meridiem-field {
		padding-block: 0;
	}
	::-webkit-calendar-picker-indicator {
		line-height: 1;
	}
	:-moz-ui-invalid {
		box-shadow: none;
	}
	button,
	input:where([type="button"], [type="reset"], [type="submit"]) {
		appearance: button;
	}
	::file-selector-button {
		appearance: button;
	}
	::-webkit-inner-spin-button {
		height: auto;
	}
	::-webkit-outer-spin-button {
		height: auto;
	}
	[hidden]:where(:not([hidden="until-found"])) {
		display: none !important;
	}
}
@layer components {
	.page-heading {
		font-family: var(--font-page-heading);
		text-transform: uppercase;
		letter-spacing: .08em;
		text-shadow: 0 0 1px var(--page-heading-glow);
		background-image: repeating-linear-gradient(
			180deg,
			transparent,
			transparent 1px,
			var(--page-heading-scanline) 1px,
			var(--page-heading-scanline) 2px
		);
		font-weight: 400;
	}
	.dark .page-heading {
		text-shadow: 0 0 10px var(--page-heading-glow), 0 0 22px var(--primary), 0
			1px 0 var(--primary);
	}
	@supports (color: color-mix(in lab, red, red)) {
		.dark .page-heading {
			text-shadow: 0 0 10px var(--page-heading-glow), 0 0 22px
				color-mix(in oklch, var(--primary) 28%, transparent), 0 1px 0
				color-mix(in oklch, var(--primary) 20%, transparent);
		}
	}
}
@layer utilities {
	.pointer-events-auto {
		pointer-events: auto;
	}
	.absolute {
		position: absolute;
	}
	.fixed {
		position: fixed;
	}
	.relative {
		position: relative;
	}
	.static {
		position: static;
	}
	.inset-0 {
		inset: calc(var(--spacing) * 0);
	}
	.start {
		inset-inline-start: var(--spacing);
	}
	.bottom-4 {
		bottom: calc(var(--spacing) * 4);
	}
	.left-4 {
		left: calc(var(--spacing) * 4);
	}
	.z-0 {
		z-index: 0;
	}
	.z-1 {
		z-index: 1;
	}
	.z-10 {
		z-index: 10;
	}
	.z-50 {
		z-index: 50;
	}
	.container {
		width: 100%;
	}
	@media (min-width: 40rem) {
		.container {
			max-width: 40rem;
		}
	}
	@media (min-width: 48rem) {
		.container {
			max-width: 48rem;
		}
	}
	@media (min-width: 64rem) {
		.container {
			max-width: 64rem;
		}
	}
	@media (min-width: 80rem) {
		.container {
			max-width: 80rem;
		}
	}
	@media (min-width: 96rem) {
		.container {
			max-width: 96rem;
		}
	}
	.mx-2 {
		margin-inline: calc(var(--spacing) * 2);
	}
	.mx-auto {
		margin-inline: auto;
	}
	.mt-1 {
		margin-top: calc(var(--spacing) * 1);
	}
	.mt-2 {
		margin-top: calc(var(--spacing) * 2);
	}
	.mt-3 {
		margin-top: calc(var(--spacing) * 3);
	}
	.mt-4 {
		margin-top: calc(var(--spacing) * 4);
	}
	.mt-5 {
		margin-top: calc(var(--spacing) * 5);
	}
	.mt-6 {
		margin-top: calc(var(--spacing) * 6);
	}
	.mt-8 {
		margin-top: calc(var(--spacing) * 8);
	}
	.mt-10 {
		margin-top: calc(var(--spacing) * 10);
	}
	.mt-12 {
		margin-top: calc(var(--spacing) * 12);
	}
	.mt-14 {
		margin-top: calc(var(--spacing) * 14);
	}
	.mb-4 {
		margin-bottom: calc(var(--spacing) * 4);
	}
	.mb-5 {
		margin-bottom: calc(var(--spacing) * 5);
	}
	.mb-6 {
		margin-bottom: calc(var(--spacing) * 6);
	}
	.block {
		display: block;
	}
	.flex {
		display: flex;
	}
	.grid {
		display: grid;
	}
	.hidden {
		display: none;
	}
	.inline {
		display: inline;
	}
	.inline-flex {
		display: inline-flex;
	}
	.size-full {
		width: 100%;
		height: 100%;
	}
	.h-1\.5 {
		height: calc(var(--spacing) * 1.5);
	}
	.h-10 {
		height: calc(var(--spacing) * 10);
	}
	.h-11 {
		height: calc(var(--spacing) * 11);
	}
	.h-12 {
		height: calc(var(--spacing) * 12);
	}
	.h-20 {
		height: calc(var(--spacing) * 20);
	}
	.h-auto {
		height: auto;
	}
	.h-full {
		height: 100%;
	}
	.h-screen {
		height: 100vh;
	}
	.min-h-\[720px\] {
		min-height: 720px;
	}
	.w-1\.5 {
		width: calc(var(--spacing) * 1.5);
	}
	.w-10 {
		width: calc(var(--spacing) * 10);
	}
	.w-20 {
		width: calc(var(--spacing) * 20);
	}
	.w-full {
		width: 100%;
	}
	.max-w-2xl {
		max-width: var(--container-2xl);
	}
	.max-w-3xl {
		max-width: var(--container-3xl);
	}
	.max-w-5xl {
		max-width: var(--container-5xl);
	}
	.max-w-xl {
		max-width: var(--container-xl);
	}
	.shrink-0 {
		flex-shrink: 0;
	}
	.resize {
		resize: both;
	}
	.grid-cols-1 {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	.flex-col {
		flex-direction: column;
	}
	.items-center {
		align-items: center;
	}
	.items-start {
		align-items: flex-start;
	}
	.justify-between {
		justify-content: space-between;
	}
	.justify-center {
		justify-content: center;
	}
	.gap-1 {
		gap: calc(var(--spacing) * 1);
	}
	.gap-2 {
		gap: calc(var(--spacing) * 2);
	}
	.gap-3 {
		gap: calc(var(--spacing) * 3);
	}
	.gap-4 {
		gap: calc(var(--spacing) * 4);
	}
	.gap-5 {
		gap: calc(var(--spacing) * 5);
	}
	.gap-6 {
		gap: calc(var(--spacing) * 6);
	}
	:where(.space-y-2 > :not(:last-child)) {
		--tw-space-y-reverse: 0;
		margin-block-start: calc(
			calc(var(--spacing) * 2) *
			var(--tw-space-y-reverse)
		);
		margin-block-end: calc(
			calc(var(--spacing) * 2) *
			calc(1 - var(--tw-space-y-reverse))
		);
	}
	:where(.space-y-6 > :not(:last-child)) {
		--tw-space-y-reverse: 0;
		margin-block-start: calc(
			calc(var(--spacing) * 6) *
			var(--tw-space-y-reverse)
		);
		margin-block-end: calc(
			calc(var(--spacing) * 6) *
			calc(1 - var(--tw-space-y-reverse))
		);
	}
	:where(.space-y-16 > :not(:last-child)) {
		--tw-space-y-reverse: 0;
		margin-block-start: calc(
			calc(var(--spacing) * 16) *
			var(--tw-space-y-reverse)
		);
		margin-block-end: calc(
			calc(var(--spacing) * 16) *
			calc(1 - var(--tw-space-y-reverse))
		);
	}
	.overflow-hidden {
		overflow: hidden;
	}
	.rounded-\[calc\(var\(--radius\)\+0\.5rem\)\] {
		border-radius: calc(var(--radius) + .5rem);
	}
	.rounded-\[calc\(var\(--radius\)\+0\.25rem\)\] {
		border-radius: calc(var(--radius) + .25rem);
	}
	.rounded-\[calc\(var\(--radius\)-1px\)\] {
		border-radius: calc(var(--radius) - 1px);
	}
	.rounded-\[var\(--radius\)\] {
		border-radius: var(--radius);
	}
	.rounded-full {
		border-radius: 3.40282e38px;
	}
	.border {
		border-style: var(--tw-border-style);
		border-width: 1px;
	}
	.border-t {
		border-top-style: var(--tw-border-style);
		border-top-width: 1px;
	}
	.border-border,
	.border-border\/40 {
		border-color: var(--border);
	}
	@supports (color: color-mix(in lab, red, red)) {
		.border-border\/40 {
			border-color: color-mix(in oklab, var(--border) 40%, transparent);
		}
	}
	.bg-background {
		background-color: var(--background);
	}
	.bg-card\/60 {
		background-color: var(--card);
	}
	@supports (color: color-mix(in lab, red, red)) {
		.bg-card\/60 {
			background-color: color-mix(in oklab, var(--card) 60%, transparent);
		}
	}
	.bg-card\/80 {
		background-color: var(--card);
	}
	@supports (color: color-mix(in lab, red, red)) {
		.bg-card\/80 {
			background-color: color-mix(in oklab, var(--card) 80%, transparent);
		}
	}
	.bg-muted\/60 {
		background-color: var(--muted);
	}
	@supports (color: color-mix(in lab, red, red)) {
		.bg-muted\/60 {
			background-color: color-mix(in oklab, var(--muted) 60%, transparent);
		}
	}
	.bg-octet-ipmap-host-dhcp {
		background-color: var(--octet-ipmap-host-dhcp);
	}
	.bg-octet-ipmap-host-reserved {
		background-color: var(--octet-ipmap-host-reserved);
	}
	.bg-octet-netmap-leaf {
		background-color: var(--octet-netmap-leaf);
	}
	.bg-primary {
		background-color: var(--primary);
	}
	.bg-transparent {
		background-color: #0000;
	}
	.p-1 {
		padding: calc(var(--spacing) * 1);
	}
	.p-6 {
		padding: calc(var(--spacing) * 6);
	}
	.p-8 {
		padding: calc(var(--spacing) * 8);
	}
	.px-1\.5 {
		padding-inline: calc(var(--spacing) * 1.5);
	}
	.px-2 {
		padding-inline: calc(var(--spacing) * 2);
	}
	.px-6 {
		padding-inline: calc(var(--spacing) * 6);
	}
	.px-8 {
		padding-inline: calc(var(--spacing) * 8);
	}
	.py-0\.5 {
		padding-block: calc(var(--spacing) * 0.5);
	}
	.py-1 {
		padding-block: calc(var(--spacing) * 1);
	}
	.py-10 {
		padding-block: calc(var(--spacing) * 10);
	}
	.py-24 {
		padding-block: calc(var(--spacing) * 24);
	}
	.pt-10 {
		padding-top: calc(var(--spacing) * 10);
	}
	.text-center {
		text-align: center;
	}
	.font-mono {
		font-family: JetBrains Mono Variable, JetBrains Mono, monospace;
	}
	.text-2xl {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}
	.text-4xl {
		font-size: var(--text-4xl);
		line-height: var(--tw-leading, var(--text-4xl--line-height));
	}
	.text-7xl {
		font-size: var(--text-7xl);
		line-height: var(--tw-leading, var(--text-7xl--line-height));
	}
	.text-base {
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
	}
	.text-lg {
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height));
	}
	.text-sm {
		font-size: var(--text-sm);
		line-height: var(--tw-leading, var(--text-sm--line-height));
	}
	.text-xl {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height));
	}
	.text-xs {
		font-size: var(--text-xs);
		line-height: var(--tw-leading, var(--text-xs--line-height));
	}
	.text-\[0\.7rem\] {
		font-size: .7rem;
	}
	.text-\[0\.75rem\] {
		font-size: .75rem;
	}
	.leading-none {
		--tw-leading: 1;
		line-height: 1;
	}
	.leading-relaxed {
		--tw-leading: var(--leading-relaxed);
		line-height: var(--leading-relaxed);
	}
	.font-medium {
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);
	}
	.font-semibold {
		--tw-font-weight: var(--font-weight-semibold);
		font-weight: var(--font-weight-semibold);
	}
	.tracking-\[0\.2em\] {
		--tw-tracking: .2em;
		letter-spacing: .2em;
	}
	.tracking-\[0\.3em\] {
		--tw-tracking: .3em;
		letter-spacing: .3em;
	}
	.tracking-\[0\.25em\] {
		--tw-tracking: .25em;
		letter-spacing: .25em;
	}
	.tracking-tight {
		--tw-tracking: var(--tracking-tight);
		letter-spacing: var(--tracking-tight);
	}
	.tracking-wider {
		--tw-tracking: var(--tracking-wider);
		letter-spacing: var(--tracking-wider);
	}
	.text-foreground {
		color: var(--foreground);
	}
	.text-muted-foreground {
		color: var(--muted-foreground);
	}
	.text-primary-foreground {
		color: var(--primary-foreground);
	}
	.uppercase {
		text-transform: uppercase;
	}
	.antialiased {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	.shadow-2xl {
		--tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, #00000040);
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
			var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}
	.blur {
		--tw-blur: blur(8px);
		filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
	}
	.backdrop-blur {
		--tw-backdrop-blur: blur(8px);
		-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
		backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)
	}
	.transition {
		transition-property:
			color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
		transition-timing-function: var(
			--tw-ease,
			var(--default-transition-timing-function)
		);
		transition-duration: var(--tw-duration, var(--default-transition-duration));
	}
	.transition-all {
		transition-property: all;
		transition-timing-function: var(
			--tw-ease,
			var(--default-transition-timing-function)
		);
		transition-duration: var(--tw-duration, var(--default-transition-duration));
	}
	.duration-500 {
		--tw-duration: .5s;
		transition-duration: .5s;
	}
	.ease-in-out {
		--tw-ease: var(--ease-in-out);
		transition-timing-function: var(--ease-in-out);
	}
	.paused {
		animation-play-state: paused;
	}
	.running {
		animation-play-state: running;
	}
	@media (hover: hover) {
		.hover\:border-foreground\/20:hover {
			border-color: var(--foreground);
		}
		@supports (color: color-mix(in lab, red, red)) {
			.hover\:border-foreground\/20:hover {
				border-color: color-mix(in oklab, var(--foreground) 20%, transparent);
			}
		}
		.hover\:border-foreground\/40:hover {
			border-color: var(--foreground);
		}
		@supports (color: color-mix(in lab, red, red)) {
			.hover\:border-foreground\/40:hover {
				border-color: color-mix(in oklab, var(--foreground) 40%, transparent);
			}
		}
		.hover\:text-foreground:hover {
			color: var(--foreground);
		}
		.hover\:opacity-90:hover {
			opacity: 0.9;
		}
		.hover\:shadow-\[0_0_60px_-20px_var\(--page-heading-glow\)\]:hover {
			--tw-shadow: 0 0 60px -20px
				var(--tw-shadow-color, var(--page-heading-glow));
			box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
				var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
		}
	}
	@media (min-width: 40rem) {
		.sm\:grid-cols-2 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.sm\:flex-row {
			flex-direction: row;
		}
		.sm\:gap-4 {
			gap: calc(var(--spacing) * 4);
		}
	}
	@media (min-width: 48rem) {
		.md\:mx-4 {
			margin-inline: calc(var(--spacing) * 4);
		}
		.md\:grid-cols-2 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.md\:grid-cols-3 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.md\:gap-6 {
			gap: calc(var(--spacing) * 6);
		}
		.md\:py-32 {
			padding-block: calc(var(--spacing) * 32);
		}
		.md\:text-2xl {
			font-size: var(--text-2xl);
			line-height: var(--tw-leading, var(--text-2xl--line-height));
		}
		.md\:text-5xl {
			font-size: var(--text-5xl);
			line-height: var(--tw-leading, var(--text-5xl--line-height));
		}
		.md\:text-6xl {
			font-size: var(--text-6xl);
			line-height: var(--tw-leading, var(--text-6xl--line-height));
		}
		.md\:text-9xl {
			font-size: var(--text-9xl);
			line-height: var(--tw-leading, var(--text-9xl--line-height));
		}
		.md\:text-lg {
			font-size: var(--text-lg);
			line-height: var(--tw-leading, var(--text-lg--line-height));
		}
		.md\:text-xl {
			font-size: var(--text-xl);
			line-height: var(--tw-leading, var(--text-xl--line-height));
		}
	}
	@media (min-width: 64rem) {
		.lg\:grid-cols-3 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
	}
	@media (min-width: 80rem) {
		.xl\:grid-cols-6 {
			grid-template-columns: repeat(6, minmax(0, 1fr));
		}
	}
	.dark\:brightness-600:is(.dark *) {
		--tw-brightness: brightness(600%);
		filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
	}
}
@property --tw-animation-delay {
	syntax: "*";
	inherits: false;
	initial-value: 0s;
}
@property --tw-animation-direction {
	syntax: "*";
	inherits: false;
	initial-value: normal;
}
@property --tw-animation-duration {
	syntax: "*";
	inherits: false;
}
@property --tw-animation-fill-mode {
	syntax: "*";
	inherits: false;
	initial-value: none;
}
@property --tw-animation-iteration-count {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}
@property --tw-enter-blur {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-enter-opacity {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}
@property --tw-enter-rotate {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-enter-scale {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}
@property --tw-enter-translate-x {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-enter-translate-y {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-exit-blur {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-exit-opacity {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}
@property --tw-exit-rotate {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-exit-scale {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}
@property --tw-exit-translate-x {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-exit-translate-y {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@font-face {
	font-family: Geist Variable;
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url(/_astro/geist-latin-ext-wght-normal.DMtmJ5ZE.woff2)
		format("woff2-variations");
	unicode-range:
		U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: Geist Variable;
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url(/_astro/geist-latin-wght-normal.Dm3htQBi.woff2)
		format("woff2-variations");
	unicode-range:
		U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: JetBrains Mono Variable;
	font-style: normal;
	font-display: swap;
	font-weight: 100 800;
	src: url(/_astro/jetbrains-mono-latin-ext-wght-normal.DBQx-q_a.woff2)
		format("woff2-variations");
	unicode-range:
		U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: JetBrains Mono Variable;
	font-style: normal;
	font-display: swap;
	font-weight: 100 800;
	src: url(/_astro/jetbrains-mono-latin-wght-normal.B9CIFXIH.woff2)
		format("woff2-variations");
	unicode-range:
		U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: VT323;
	font-style: normal;
	font-display: swap;
	font-weight: 400;
	src: url(/_astro/vt323-latin-400-normal.wDgJuOC9.woff2) format("woff2"),
		url(/_astro/vt323-latin-400-normal.Dqn9ZSPj.woff) format("woff");
}
:root {
	--background: oklch(100% 0 0);
	--foreground: oklch(14.5% 0 0);
	--card: oklch(100% 0 0);
	--card-foreground: oklch(14.5% 0 0);
	--popover: oklch(100% 0 0);
	--popover-foreground: oklch(14.5% 0 0);
	--primary: oklch(20.5% 0 0);
	--primary-foreground: oklch(98.5% 0 0);
	--secondary: oklch(97% 0 0);
	--secondary-foreground: oklch(20.5% 0 0);
	--muted: oklch(97% 0 0);
	--muted-foreground: oklch(55.6% 0 0);
	--accent: oklch(97% 0 0);
	--accent-foreground: oklch(20.5% 0 0);
	--destructive: oklch(57.7% 0.245 27.325);
	--border: oklch(92.2% 0 0);
	--input: oklch(92.2% 0 0);
	--ring: oklch(70.8% 0 0);
	--chart-1: oklch(70.5% 0.1 251.813);
	--chart-2: oklch(62.3% 0.214 259.815);
	--chart-3: oklch(54.6% 0.245 262.881);
	--chart-4: oklch(48.8% 0.243 264.376);
	--chart-5: oklch(42.4% 0.199 265.638);
	--chart-6: oklch(67% 0.1 238);
	--chart-7: oklch(62% 0.12 252);
	--chart-8: oklch(57% 0.14 262);
	--chart-9: oklch(60% 0.15 272);
	--chart-10: oklch(55% 0.14 282);
	--chart-11: oklch(69% 0.09 200);
	--chart-12: oklch(76% 0.1 312);
	--chart-remainder: oklch(62% 0.14 72);
	--chart-remainder-gap: oklch(52% 0.05 72);
	--radius: .25rem;
	--sidebar: oklch(98.5% 0 0);
	--sidebar-foreground: oklch(14.5% 0 0);
	--sidebar-primary: oklch(20.5% 0 0);
	--sidebar-primary-foreground: oklch(98.5% 0 0);
	--sidebar-accent: oklch(97% 0 0);
	--sidebar-accent-foreground: oklch(20.5% 0 0);
	--sidebar-border: oklch(92.2% 0 0);
	--sidebar-ring: oklch(70.8% 0 0);
	--scrollbar-size: 10px;
	--scrollbar-track: oklch(96% 0.005 250);
	--scrollbar-thumb: oklch(72% 0.02 250);
	--scrollbar-thumb-hover: oklch(55% 0.04 250);
	--font-page-heading: "VT323", ui-monospace, monospace;
	--page-heading-scanline: #0000001c;
	--page-heading-glow: var(--foreground);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--page-heading-glow: color-mix(in oklch, var(--foreground) 35%, transparent);
	}
}
:root {
	--octet-ipmap-host-conflict: oklch(55% 0.21 25);
	--octet-ipmap-host-infra: oklch(42% 0.02 250);
	--octet-ipmap-host-dhcp: oklch(48% 0.12 195);
	--octet-ipmap-host-reserved: oklch(58% 0.15 75);
	--octet-ipmap-host-assigned: oklch(50% 0.14 260);
	--octet-ipmap-host-soft: var(--octet-ipmap-host-assigned);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-ipmap-host-soft: color-mix(
			in oklch,
			var(--octet-ipmap-host-assigned) 52%,
			transparent
		);
	}
}
:root {
	--octet-ipmap-host-free: oklch(90% 0.012 250);
	--octet-ipmap-pool-ring: oklch(55% 0.12 195);
	--octet-netmap-leaf: oklch(52% 0.2 290);
	--octet-netmap-child: oklch(52% 0.14 240);
	--octet-dhcp-rail-bg: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-dhcp-rail-bg: color-mix(in oklch, var(--primary) 6%, var(--muted));
	}
}
:root {
	--octet-dhcp-rail-border: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-dhcp-rail-border: color-mix(
			in oklch,
			var(--primary) 18%,
			var(--border)
		);
	}
}
:root {
	--octet-dhcp-rail-pool-bg: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-dhcp-rail-pool-bg: color-mix(
			in oklch,
			var(--primary) 22%,
			transparent
		);
	}
}
:root {
	--octet-dhcp-rail-pool-border: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-dhcp-rail-pool-border: color-mix(
			in oklch,
			var(--primary) 45%,
			var(--border)
		);
	}
}
:root {
	--octet-dhcp-rail-pool-fg: var(--foreground);
	--octet-dhcp-rail-pool-hover: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	:root {
		--octet-dhcp-rail-pool-hover: color-mix(
			in oklch,
			var(--primary) 32%,
			transparent
		);
	}
}
:root {
	--octet-callout-warning-bg: oklch(72% 0.14 75 / 0.14);
	--octet-callout-warning-border: oklch(65% 0.16 75 / 0.35);
	--octet-callout-warning-text: oklch(32% 0.06 55);
	--octet-lattice-role-database: oklch(46% 0.12 285);
	--octet-lattice-role-ui: oklch(44% 0.11 230);
	--octet-lattice-role-dns: oklch(44% 0.14 252);
	--octet-lattice-role-dhcp: oklch(48% 0.14 185);
	--octet-lattice-role-dist: oklch(50% 0.17 308);
	--octet-lattice-role-recursor: oklch(44% 0.11 218);
	--octet-lattice-role-metrics: oklch(50% 0.15 72);
	--octet-lattice-role-db-replica: oklch(46% 0.12 298);
	--octet-container-pill-bg: oklch(96% 0.005 250);
	--octet-container-pill-border: oklch(85% 0.01 250);
	--octet-container-pill-fg: oklch(25% 0.02 250);
}
.dark {
	--background: oklch(13% 0.01 250);
	--foreground: oklch(87% 0.01 240);
	--card: oklch(16% 0.015 250);
	--card-foreground: oklch(87% 0.01 240);
	--popover: oklch(16% 0.015 250);
	--popover-foreground: oklch(87% 0.01 240);
	--primary: oklch(78% 0.15 195);
	--primary-foreground: oklch(13% 0.015 250);
	--secondary: oklch(19% 0.02 250);
	--secondary-foreground: oklch(87% 0.01 240);
	--muted: oklch(19% 0.02 250);
	--muted-foreground: oklch(52% 0.02 240);
	--accent: oklch(16% 0.025 230);
	--accent-foreground: oklch(87% 0.01 240);
	--destructive: oklch(70.4% 0.191 22.216);
	--border: oklch(24% 0.02 240);
	--input: oklch(18% 0.02 250);
	--ring: oklch(78% 0.15 195 / 0.4);
	--chart-1: oklch(69% 0.14 195);
	--chart-2: oklch(61% 0.12 195);
	--chart-3: oklch(52% 0.1 195);
	--chart-4: oklch(44% 0.085 195);
	--chart-5: oklch(35% 0.065 195);
	--chart-6: oklch(64% 0.13 210);
	--chart-7: oklch(57% 0.12 225);
	--chart-8: oklch(52% 0.11 245);
	--chart-9: oklch(62% 0.12 175);
	--chart-10: oklch(54% 0.11 265);
	--chart-11: oklch(62% 0.12 285);
	--chart-12: oklch(56% 0.13 305);
	--chart-remainder: oklch(72% 0.13 78);
	--chart-remainder-gap: oklch(50% 0.04 78);
	--sidebar: oklch(11% 0.01 250);
	--sidebar-foreground: oklch(87% 0.01 240);
	--sidebar-primary: oklch(78% 0.15 195);
	--sidebar-primary-foreground: oklch(13% 0.015 250);
	--sidebar-accent: oklch(16% 0.025 230);
	--sidebar-accent-foreground: oklch(87% 0.01 240);
	--sidebar-border: oklch(24% 0.02 240);
	--sidebar-ring: oklch(78% 0.15 195 / 0.4);
	--scrollbar-track: transparent;
	--scrollbar-thumb: oklch(32% 0.02 240);
	--scrollbar-thumb-hover: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--scrollbar-thumb-hover: color-mix(
			in oklch,
			var(--primary) 55%,
			oklch(32% 0.02 240)
		);
	}
}
.dark {
	--page-heading-scanline: #00000038;
	--page-heading-glow: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--page-heading-glow: color-mix(in oklch, var(--primary) 55%, transparent);
	}
}
.dark {
	--octet-ipmap-host-conflict: oklch(58% 0.2 25);
	--octet-ipmap-host-infra: oklch(52% 0.025 250);
	--octet-ipmap-host-dhcp: oklch(58% 0.14 195);
	--octet-ipmap-host-reserved: oklch(64% 0.14 72);
	--octet-ipmap-host-assigned: oklch(55% 0.16 260);
	--octet-ipmap-host-soft: var(--octet-ipmap-host-assigned);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-ipmap-host-soft: color-mix(
			in oklch,
			var(--octet-ipmap-host-assigned) 48%,
			transparent
		);
	}
}
.dark {
	--octet-ipmap-host-free: oklch(26% 0.018 250);
	--octet-ipmap-pool-ring: oklch(68% 0.14 195);
	--octet-netmap-leaf: oklch(58% 0.18 290);
	--octet-netmap-child: oklch(58% 0.14 240);
	--octet-dhcp-rail-bg: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-dhcp-rail-bg: color-mix(in oklch, var(--primary) 12%, var(--muted));
	}
}
.dark {
	--octet-dhcp-rail-border: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-dhcp-rail-border: color-mix(
			in oklch,
			var(--primary) 28%,
			var(--border)
		);
	}
}
.dark {
	--octet-dhcp-rail-pool-bg: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-dhcp-rail-pool-bg: color-mix(
			in oklch,
			var(--primary) 28%,
			transparent
		);
	}
}
.dark {
	--octet-dhcp-rail-pool-border: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-dhcp-rail-pool-border: color-mix(
			in oklch,
			var(--primary) 50%,
			var(--border)
		);
	}
}
.dark {
	--octet-dhcp-rail-pool-fg: oklch(92% 0.04 195);
	--octet-dhcp-rail-pool-hover: var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.dark {
		--octet-dhcp-rail-pool-hover: color-mix(
			in oklch,
			var(--primary) 38%,
			transparent
		);
	}
}
.dark {
	--octet-callout-warning-bg: oklch(72% 0.12 75 / 0.12);
	--octet-callout-warning-border: oklch(70% 0.14 72 / 0.38);
	--octet-callout-warning-text: oklch(88% 0.04 85);
	--octet-lattice-role-database: oklch(62% 0.14 285);
	--octet-lattice-role-ui: oklch(62% 0.13 230);
	--octet-lattice-role-dns: oklch(62% 0.15 252);
	--octet-lattice-role-dhcp: oklch(64% 0.15 185);
	--octet-lattice-role-dist: oklch(66% 0.17 308);
	--octet-lattice-role-recursor: oklch(62% 0.13 218);
	--octet-lattice-role-metrics: oklch(66% 0.15 72);
	--octet-lattice-role-db-replica: oklch(62% 0.14 298);
	--octet-container-pill-bg: oklch(24% 0.02 250);
	--octet-container-pill-border: oklch(38% 0.025 240);
	--octet-container-pill-fg: oklch(92% 0.01 240);
	--background: oklch(0% 0 0);
}
[data-reveal] {
	opacity: 0;
	will-change: opacity, transform;
	transition: opacity .6s ease-out, transform .6s ease-out;
	transform: translateY(20px);
}
[data-reveal][data-reveal-in] {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	[data-reveal] {
		opacity: 1;
		transition: none;
		transform: none;
	}
}
.falling-pattern-fade-in {
	animation: .2s ease-out both falling-pattern-fade-in;
}
.falling-pattern-drift {
	background-position: var(--falling-start);
	animation-name: falling-drift;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-fill-mode: both;
}
@keyframes falling-pattern-fade-in {
	0% {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes falling-drift {
	0% {
		background-position: var(--falling-start);
	}
	to {
		background-position: var(--falling-end);
	}
}
@media (prefers-reduced-motion: reduce) {
	.falling-pattern-fade-in,
	.falling-pattern-drift {
		animation: none !important;
	}
}
html {
	scroll-behavior: smooth;
	font-family: var(--font-sans);
}
body {
	font-family: var(--font-sans);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	position: relative;
}
.site-atmosphere {
	z-index: 0;
	pointer-events: none;
	position: fixed;
	inset: 0;
	overflow: hidden;
}
.site-atmosphere:before {
	content: "";
	background-image: radial-gradient(
			circle at 15% 0%,
			var(--primary) 0%,
			transparent 45%
		),
		radial-gradient(
			circle at 85% 30%,
			var(--octet-netmap-leaf) 0%,
			transparent 50%
		),
		radial-gradient(
			circle at 30% 85%,
			var(--octet-ipmap-host-reserved) 0%,
			transparent 55%
		);
	position: absolute;
	inset: 0;
}
@supports (color: color-mix(in lab, red, red)) {
	.site-atmosphere:before {
		background-image: radial-gradient(
				circle at 15% 0%,
				color-mix(in oklch, var(--primary) 10%, transparent) 0%,
				transparent 45%
			),
			radial-gradient(
				circle at 85% 30%,
				color-mix(in oklch, var(--octet-netmap-leaf) 8%, transparent) 0%,
				transparent 50%
			),
			radial-gradient(
				circle at 30% 85%,
				color-mix(in oklch, var(--octet-ipmap-host-reserved) 6%, transparent) 0%,
				transparent 55%
			);
	}
}
.site-atmosphere:before {
	opacity: 0.9;
}
.site-atmosphere:after {
	content: "";
	background-image: radial-gradient(
			circle,
			var(--foreground) 1px,
			transparent 1px
		),
		repeating-linear-gradient(
			180deg,
			transparent 0px,
			transparent 2px,
			#ffffff04 2px,
			#ffffff04 3px
		);
	position: absolute;
	inset: 0;
}
@supports (color: color-mix(in lab, red, red)) {
	.site-atmosphere:after {
		background-image: radial-gradient(
				circle,
				color-mix(in oklch, var(--foreground) 8%, transparent) 1px,
				transparent 1px
			),
			repeating-linear-gradient(
				180deg,
				transparent 0px,
				transparent 2px,
				#ffffff04 2px,
				#ffffff04 3px
			);
	}
}
.site-atmosphere:after {
	opacity: 0.6;
	background-size: 24px 24px, 100% 3px;
}
main {
	z-index: 1;
	position: relative;
}
.lattice-hero {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.lattice-hero .lattice-container {
	width: 100%;
	height: 100%;
	display: grid;
	position: absolute;
	inset: 0;
}
.lattice-hero .lattice-container:after {
	content: "";
	pointer-events: none;
	background: radial-gradient(
		220px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
		var(--primary),
		transparent 60%
	);
	position: absolute;
	inset: 0;
}
@supports (color: color-mix(in lab, red, red)) {
	.lattice-hero .lattice-container:after {
		background: radial-gradient(
			220px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
			color-mix(in oklch, var(--primary) 28%, transparent),
			transparent 60%
		);
	}
}
.lattice-hero .lattice-container:after {
	opacity: var(--mouse-glow-opacity, 0);
	mix-blend-mode: screen;
	transition: opacity .2s;
}
.lattice-hero .lattice-cell {
	opacity: var(--opacity-min, 0.1);
	will-change: opacity;
	border-radius: 2px;
}
.lattice-hero .hero-content {
	z-index: 1;
	width: 100%;
	height: 100%;
	position: relative;
}
@keyframes lattice-pulse {
	0% {
		opacity: var(--opacity-min, 0.05);
	}
	to {
		opacity: var(--opacity-max, 0.6);
	}
}
@media (prefers-reduced-motion: reduce) {
	.lattice-hero .lattice-cell {
		opacity: var(--opacity-max, 0.5);
		animation: none !important;
	}
}
.beams-hero {
	background: radial-gradient(
			ellipse at center 120%,
			var(--primary) 0%,
			transparent 55%
		), var(--background);
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero {
		background: radial-gradient(
				ellipse at center 120%,
				color-mix(in oklch, var(--primary) 12%, transparent) 0%,
				transparent 55%
			), var(--background);
	}
}
.beams-hero {
	perspective: 600px;
	perspective-origin: 50% 60%;
}
.beams-hero .beams-floor {
	transform-origin: bottom;
	background-image: linear-gradient(
			90deg,
			transparent 49.5%,
			var(--primary) 50%,
			transparent 50.5%
		),
		linear-gradient(
			0deg,
			transparent 49.5%,
			var(--primary) 50%,
			transparent 50.5%
		);
	width: 200%;
	height: 65%;
	position: absolute;
	bottom: -10%;
	left: -50%;
	transform: rotateX(75deg);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beams-floor {
		background-image: linear-gradient(
				90deg,
				transparent 49.5%,
				color-mix(in oklch, var(--primary) 35%, transparent) 50%,
				transparent 50.5%
			),
			linear-gradient(
				0deg,
				transparent 49.5%,
				color-mix(in oklch, var(--primary) 28%, transparent) 50%,
				transparent 50.5%
			);
	}
}
.beams-hero .beams-floor {
	background-size: 60px 60px, 60px 60px;
	animation: 3s linear infinite beams-floor-pan;
	-webkit-mask-image: radial-gradient(at 50% 0, #000 0%, #0009 40%, #0000 75%);
	mask-image: radial-gradient(at 50% 0, #000, #0009 40%, #0000 75%);
}
.beams-hero .beams-column {
	background: radial-gradient(
		ellipse at center bottom,
		var(--primary),
		transparent 70%
	);
	width: 260px;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beams-column {
		background: radial-gradient(
			ellipse at center bottom,
			color-mix(in oklch, var(--primary) 55%, transparent),
			transparent 70%
		);
	}
}
.beams-hero .beams-column {
	filter: blur(25px);
	pointer-events: none;
	animation: 3s ease-in-out infinite alternate beams-column-glow;
}
.beams-hero .beams-stream {
	pointer-events: none;
	position: absolute;
	inset: 0;
	overflow: hidden;
}
.beams-hero .beam {
	will-change: transform, opacity;
	height: 28vh;
	animation-name: beams-rise, beams-fade;
	animation-timing-function: linear, ease-in-out;
	animation-iteration-count: infinite, infinite;
	position: absolute;
	bottom: 0;
}
.beams-hero .beam--primary {
	background: linear-gradient(
		to top,
		var(--primary),
		var(--primary) 60%,
		transparent
	);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beam--primary {
		background: linear-gradient(
			to top,
			var(--primary),
			color-mix(in oklch, var(--primary) 50%, transparent) 60%,
			transparent
		);
	}
}
.beams-hero .beam--primary {
	box-shadow: 0 0 6px var(--primary), 0 0 14px var(--primary);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beam--primary {
		box-shadow: 0 0 6px color-mix(in oklch, var(--primary) 80%, transparent), 0
			0 14px color-mix(in oklch, var(--primary) 50%, transparent);
	}
}
.beams-hero .beam--highlight {
	background: linear-gradient(
		to top,
		var(--octet-ipmap-host-reserved),
		var(--octet-ipmap-host-reserved) 60%,
		transparent
	);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beam--highlight {
		background: linear-gradient(
			to top,
			var(--octet-ipmap-host-reserved),
			color-mix(in oklch, var(--octet-ipmap-host-reserved) 50%, transparent) 60%,
			transparent
		);
	}
}
.beams-hero .beam--highlight {
	box-shadow: 0 0 8px var(--octet-ipmap-host-reserved), 0 0 18px
		var(--octet-ipmap-host-reserved);
}
@supports (color: color-mix(in lab, red, red)) {
	.beams-hero .beam--highlight {
		box-shadow: 0 0 8px
			color-mix(in oklch, var(--octet-ipmap-host-reserved) 80%, transparent), 0
			0 18px
			color-mix(in oklch, var(--octet-ipmap-host-reserved) 55%, transparent);
	}
}
@keyframes beams-rise {
	0% {
		opacity: 0;
		transform: translateY(100%);
	}
	10% {
		opacity: 1;
	}
	to {
		opacity: 0;
		transform: translateY(-5%);
	}
}
@keyframes beams-fade {
	0%,
	to {
		opacity: 0;
	}
	5%,
	85% {
		opacity: 0.85;
	}
}
@keyframes beams-column-glow {
	0% {
		opacity: 0.5;
		filter: blur(30px);
	}
	to {
		opacity: 0.75;
		filter: blur(20px);
	}
}
@keyframes beams-floor-pan {
	0% {
		background-position: 0 0, 0 0;
	}
	to {
		background-position: -60px 0, 0 -60px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.beams-hero .beam,
	.beams-hero .beams-floor,
	.beams-hero .beams-column {
		animation: none !important;
	}
	.beams-hero .beam {
		opacity: 0.4;
	}
}
@property --tw-space-y-reverse {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}
@property --tw-border-style {
	syntax: "*";
	inherits: false;
	initial-value: solid;
}
@property --tw-leading {
	syntax: "*";
	inherits: false;
}
@property --tw-font-weight {
	syntax: "*";
	inherits: false;
}
@property --tw-tracking {
	syntax: "*";
	inherits: false;
}
@property --tw-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
	syntax: "*";
	inherits: false;
}
@property --tw-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}
@property --tw-inset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
	syntax: "*";
	inherits: false;
}
@property --tw-inset-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}
@property --tw-ring-color {
	syntax: "*";
	inherits: false;
}
@property --tw-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
	syntax: "*";
	inherits: false;
}
@property --tw-inset-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
	syntax: "*";
	inherits: false;
}
@property --tw-ring-offset-width {
	syntax: "<length>";
	inherits: false;
	initial-value: 0;
}
@property --tw-ring-offset-color {
	syntax: "*";
	inherits: false;
	initial-value: #fff;
}
@property --tw-ring-offset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}
@property --tw-blur {
	syntax: "*";
	inherits: false;
}
@property --tw-brightness {
	syntax: "*";
	inherits: false;
}
@property --tw-contrast {
	syntax: "*";
	inherits: false;
}
@property --tw-grayscale {
	syntax: "*";
	inherits: false;
}
@property --tw-hue-rotate {
	syntax: "*";
	inherits: false;
}
@property --tw-invert {
	syntax: "*";
	inherits: false;
}
@property --tw-opacity {
	syntax: "*";
	inherits: false;
}
@property --tw-saturate {
	syntax: "*";
	inherits: false;
}
@property --tw-sepia {
	syntax: "*";
	inherits: false;
}
@property --tw-drop-shadow {
	syntax: "*";
	inherits: false;
}
@property --tw-drop-shadow-color {
	syntax: "*";
	inherits: false;
}
@property --tw-drop-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}
@property --tw-drop-shadow-size {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-blur {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-brightness {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-contrast {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-grayscale {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-hue-rotate {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-invert {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-opacity {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-saturate {
	syntax: "*";
	inherits: false;
}
@property --tw-backdrop-sepia {
	syntax: "*";
	inherits: false;
}
@property --tw-duration {
	syntax: "*";
	inherits: false;
}
@property --tw-ease {
	syntax: "*";
	inherits: false;
}
.dot-breathe[data-astro-cid-anhloy43] {
	display: inline-block;
	animation: dot-breathe 2.4s ease-in-out infinite;
	will-change: text-shadow, opacity;
}
@keyframes dot-breathe {
	0%,
	to {
		text-shadow: 0 0 4px color-mix(in oklch, var(--primary) 35%, transparent), 0
			0 10px color-mix(in oklch, var(--primary) 20%, transparent);
		opacity: 0.85;
	}
	50% {
		text-shadow: 0 0 8px color-mix(in oklch, var(--primary) 75%, transparent), 0
			0 22px color-mix(in oklch, var(--primary) 55%, transparent), 0 0 40px
			color-mix(in oklch, var(--primary) 30%, transparent);
		opacity: 1;
	}
}
@media (prefers-reduced-motion: reduce) {
	.dot-breathe[data-astro-cid-anhloy43] {
		animation: none;
	}
}