.od-scramble-menu {
	--od-scramble-noise-opacity: 0.62;
	--od-scramble-noise-blur: 0.75px;
}

.od-scramble-menu__list,
.od-scramble-menu__sub-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.od-scramble-menu__list {
	display: flex;
	flex-direction: row;
	gap: 32px;
}

.od-scramble-menu.is-nowrap .od-scramble-menu__list {
	flex-wrap: nowrap;
}

.od-scramble-menu__item {
	line-height: inherit;
	position: relative;
}

.od-scramble-menu__link {
	display: inline-flex;
	justify-content: center;
	line-height: inherit;
	overflow: hidden;
	position: relative;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}

.od-scramble-menu__label,
.od-scramble-menu__label-char,
.od-scramble-menu__char {
	display: inline-block;
}

.od-scramble-menu__label {
	white-space: nowrap;
}

.od-scramble-menu__measure {
	display: inline-block;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	visibility: hidden;
	white-space: nowrap;
}

.od-scramble-menu__link.is-scrambling .od-scramble-menu__label {
	opacity: 0;
}

.od-scramble-menu__noise {
	display: grid;
	inset: 0 auto auto 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	text-align: center;
	white-space: nowrap;
}

.od-scramble-menu__char {
	min-width: 0;
	overflow: hidden;
	text-align: center;
}

.od-scramble-menu__char.is-noise {
	filter: blur(var(--od-scramble-noise-blur));
	opacity: var(--od-scramble-noise-opacity);
	transform: translateY(-0.01em);
}

.od-scramble-menu__char.is-revealed {
	opacity: 1;
}

.od-scramble-menu__sub-menu {
	background: rgba(255, 255, 255, 0.9);
	border-radius: 12px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.08);
	display: grid;
	gap: 12px;
	left: 0;
	min-width: 180px;
	opacity: 0;
	padding: 14px;
	pointer-events: none;
	position: absolute;
	top: calc(100% + 14px);
	transform: translateY(6px);
	transition: opacity 160ms ease, transform 160ms ease;
	z-index: 10;
}

.od-scramble-menu__item:hover > .od-scramble-menu__sub-menu,
.od-scramble-menu__item:focus-within > .od-scramble-menu__sub-menu {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
	.od-scramble-menu__sub-menu {
		transition: none;
	}
}
