	body.sklad-mobile-nav-is-open {
		overflow: hidden;
		touch-action: none;
	}

	.sklad-mobile-nav {
		--sklad-mobile-nav-text: #111;
		--sklad-mobile-nav-muted: #7c7c7c;
		--sklad-mobile-nav-line: #e7e4df;
		--sklad-mobile-nav-surface: #fff;
		--sklad-mobile-nav-soft: #f7f5f1;
		--sklad-mobile-nav-accent: #d23b2d;
		--sklad-mobile-nav-hover: var(--wd-primary-color, var(--wd-link-color-hover, currentColor));
		--sklad-mobile-nav-promo-font-size: 22px;
		--sklad-mobile-nav-promo-font-weight: 500;
		--sklad-mobile-nav-list-font-size: 15px;
		--sklad-mobile-nav-list-font-weight: 400;
		--sklad-mobile-nav-list-line-height: 1.12;
		--sklad-mobile-nav-block-gap: 30px;
		--sklad-mobile-nav-subhead-height: 86px;
		position: fixed;
		inset: 0;
		z-index: 999999;
		pointer-events: none;
		visibility: hidden;
	}

	.sklad-mobile-nav.is-open {
		pointer-events: auto;
		visibility: visible;
	}

	.sklad-mobile-nav__scrim {
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, 0.18);
		opacity: 0;
		transition: opacity 180ms ease;
	}

	.sklad-mobile-nav.is-open .sklad-mobile-nav__scrim {
		opacity: 1;
	}

	.sklad-mobile-nav__drawer {
		position: absolute;
		inset: 0;
		width: 100%;
		min-height: 100%;
		background: var(--sklad-mobile-nav-surface);
		color: var(--sklad-mobile-nav-text);
		font-family: inherit;
		transform: translateX(-100%);
		transition: transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1);
		overflow: hidden;
	}

	.sklad-mobile-nav__panels {
		position: absolute;
		inset: 0;
		overflow: hidden;
	}

	.sklad-mobile-nav.is-open .sklad-mobile-nav__drawer {
		transform: translateX(0);
	}

	.sklad-mobile-nav__panel {
		position: absolute;
		inset: 0;
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
		padding: max(22px, env(safe-area-inset-top)) 22px max(26px, env(safe-area-inset-bottom));
		background: var(--sklad-mobile-nav-surface);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		transform: translateX(100%);
		transition: transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1);
	}

	.sklad-mobile-nav__panel.is-active {
		transform: translateX(0);
	}

	.sklad-mobile-nav__panel--list {
		padding-top: max(112px, calc(env(safe-area-inset-top) + 90px));
	}

	.sklad-mobile-nav__panel[data-sklad-mobile-nav-panel="main"] {
		padding-top: max(92px, calc(env(safe-area-inset-top) + 70px));
		transform: translateX(-100%);
	}

	.sklad-mobile-nav__panel[data-sklad-mobile-nav-panel="main"].is-active {
		transform: translateX(0);
	}

	.sklad-mobile-nav__top,
	.sklad-mobile-nav__panel-head {
		position: absolute;
		left: 22px;
		right: 22px;
		z-index: 10;
		display: flex;
		align-items: center;
		min-height: 42px;
		background: var(--sklad-mobile-nav-surface);
	}

	.sklad-mobile-nav__top {
		top: max(22px, env(safe-area-inset-top));
		justify-content: flex-end;
		pointer-events: none;
		z-index: 20;
		background: transparent;
	}

	.sklad-mobile-nav__top .sklad-mobile-nav__close {
		pointer-events: auto;
	}

	.sklad-mobile-nav__panel-head {
		top: 0;
		justify-content: space-between;
		min-height: max(var(--sklad-mobile-nav-subhead-height), calc(env(safe-area-inset-top) + 64px));
		padding-top: env(safe-area-inset-top);
		padding-bottom: 0;
		border-bottom: 1px solid var(--sklad-mobile-nav-line);
		opacity: 1;
		transition: opacity 140ms ease;
	}

	.sklad-mobile-nav__panel-head[hidden] {
		display: flex !important;
		opacity: 0;
		pointer-events: none;
	}

	.sklad-mobile-nav__close,
	.sklad-mobile-nav__back,
	.sklad-mobile-nav__primary-link {
		appearance: none !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.sklad-mobile-nav__close {
		position: relative;
		width: 42px;
		height: 42px;
		padding: 0;
		border-radius: 50%;
		color: #111;
	}

	.sklad-mobile-nav__close::before,
	.sklad-mobile-nav__close::after {
		content: "";
		position: absolute;
		top: 20px;
		left: 9px;
		width: 24px;
		height: 1.5px;
		background: currentColor;
		transform: rotate(45deg);
	}

	.sklad-mobile-nav__close::after {
		transform: rotate(-45deg);
	}

	.sklad-mobile-nav a:hover,
	.sklad-mobile-nav a:focus {
		color: var(--sklad-mobile-nav-hover) !important;
		text-decoration: none !important;
		background: transparent !important;
		outline: none;
	}

	.sklad-mobile-nav button:hover,
	.sklad-mobile-nav button:focus {
		color: inherit;
		text-decoration: none !important;
		background: transparent !important;
		outline: none;
	}

	.sklad-mobile-nav a {
		text-decoration: none !important;
	}

	.sklad-mobile-nav a:focus-visible,
	.sklad-mobile-nav button:focus-visible {
		outline: 1px solid rgba(17, 17, 17, 0.28);
		outline-offset: 4px;
	}

	.sklad-mobile-nav__primary {
		display: grid;
		gap: var(--sklad-mobile-nav-block-gap);
		padding: var(--sklad-mobile-nav-block-gap) 0;
		margin-bottom: 54px;
		border-bottom: 1px solid var(--sklad-mobile-nav-line);
	}

	.sklad-mobile-nav__promo {
		display: grid;
		gap: var(--sklad-mobile-nav-block-gap);
		margin-bottom: 0;
		padding-bottom: var(--sklad-mobile-nav-block-gap);
		border-bottom: 1px solid var(--sklad-mobile-nav-line);
	}

	.sklad-mobile-nav__primary-link {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between !important;
		width: 100%;
		min-height: 0;
		padding: 0 !important;
		padding-inline: 0 !important;
		color: var(--sklad-mobile-nav-text);
		font-family: inherit !important;
		font-size: var(--sklad-mobile-nav-promo-font-size) !important;
		font-weight: var(--sklad-mobile-nav-promo-font-weight) !important;
		line-height: 1.12 !important;
		letter-spacing: 0;
		text-align: left !important;
		text-decoration: none !important;
		border-radius: 0 !important;
	}

	button.sklad-mobile-nav__primary-link {
		margin: 0;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		color: var(--sklad-mobile-nav-text) !important;
	}

	button.sklad-mobile-nav__primary-link:hover,
	button.sklad-mobile-nav__primary-link:focus-visible {
		color: var(--sklad-mobile-nav-hover) !important;
	}

	.sklad-mobile-nav__primary-link:nth-child(2) {
		margin-bottom: 0;
		border-bottom: 0 !important;
	}

	button.sklad-mobile-nav__primary-link:last-child {
		margin-bottom: 0;
	}

	.sklad-mobile-nav__primary-link--disabled {
		cursor: default;
	}

	.sklad-mobile-nav__primary-link--disabled:hover,
	.sklad-mobile-nav__primary-link--disabled:focus-visible {
		color: var(--sklad-mobile-nav-text) !important;
	}

	.sklad-mobile-nav__primary-badge {
		flex: 0 0 auto;
		margin-left: auto;
		padding: 5px 7px 4px;
		background: #efefef;
		color: #222;
		border-radius: 2px;
		font-size: 10px;
		font-weight: 500;
		line-height: 1;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	button.sklad-mobile-nav__primary-link::after {
		content: "";
		flex: 0 0 auto;
		width: 10px;
		height: 10px;
		margin-left: auto;
		margin-right: 4px;
		border-top: 1.7px solid currentColor;
		border-right: 1.7px solid currentColor;
		opacity: 0.34;
		transform: rotate(45deg);
	}

	.sklad-mobile-nav__primary-link--accent {
		color: var(--sklad-mobile-nav-accent) !important;
	}

	.sklad-mobile-nav__secondary {
		display: grid;
		gap: 14px;
		margin-top: auto;
		padding-bottom: 42px;
	}

	.sklad-mobile-nav__secondary a {
		color: var(--sklad-mobile-nav-text);
		transition: color 160ms ease;
		font-size: 18px;
		font-weight: 400;
		line-height: 1.12;
		letter-spacing: 0;
		text-decoration: none;
	}

	.sklad-mobile-nav__back {
		position: relative;
		padding: 0 0 0 28px;
		color: var(--sklad-mobile-nav-text);
		font: inherit;
		font-size: var(--sklad-mobile-nav-list-font-size);
		font-weight: var(--sklad-mobile-nav-list-font-weight);
		line-height: var(--sklad-mobile-nav-list-line-height);
		letter-spacing: 0;
		text-align: left;
	}

	.sklad-mobile-nav__back::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 3px;
		width: 11px;
		height: 11px;
		border-left: 1.7px solid currentColor;
		border-bottom: 1.7px solid currentColor;
		transform: translateY(-50%) rotate(45deg);
	}

	.sklad-mobile-nav__featured {
		display: grid;
		gap: 14px;
		padding: 24px 0 18px;
		border-bottom: 1px solid var(--sklad-mobile-nav-line);
	}

	.sklad-mobile-nav__list {
		display: grid;
		gap: 14px;
		padding-top: 18px;
	}

	.sklad-mobile-nav__row {
		display: grid;
		grid-template-columns: 42px minmax(0, 1fr) auto;
		align-items: center;
		min-height: 58px;
		gap: 18px;
		color: var(--sklad-mobile-nav-text);
		text-decoration: none !important;
	}

	.sklad-mobile-nav__row--no-thumb {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.sklad-mobile-nav__row--featured {
		min-height: 50px;
	}

	.sklad-mobile-nav__promo .sklad-mobile-nav__row {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		min-height: 0;
	}

	.sklad-mobile-nav__promo .sklad-mobile-nav__thumb {
		display: none;
	}

	.sklad-mobile-nav__thumb {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 42px;
		height: 42px;
		background: #f7f7f7;
		border-radius: 6px;
		overflow: hidden;
	}

	.sklad-mobile-nav__row--featured .sklad-mobile-nav__thumb {
		width: 40px;
		height: 40px;
	}

	.sklad-mobile-nav__thumb img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.sklad-mobile-nav__thumb-fallback {
		width: 26px;
		height: 26px;
		border: 1px solid #d9d9d9;
		border-radius: 50%;
		background: #f2f2f2;
	}

	.sklad-mobile-nav__row-label {
		min-width: 0;
		color: var(--sklad-mobile-nav-text);
		font-family: inherit !important;
		font-size: var(--sklad-mobile-nav-list-font-size) !important;
		font-weight: var(--sklad-mobile-nav-list-font-weight) !important;
		line-height: var(--sklad-mobile-nav-list-line-height) !important;
		letter-spacing: 0;
		text-align: left;
		transition: color 160ms ease;
	}

	.sklad-mobile-nav__row:hover .sklad-mobile-nav__row-label,
	.sklad-mobile-nav__row:focus-visible .sklad-mobile-nav__row-label,
	.sklad-mobile-nav__row:hover .sklad-mobile-nav__chevron,
	.sklad-mobile-nav__row:focus-visible .sklad-mobile-nav__chevron,
	.sklad-mobile-nav__secondary a:hover,
	.sklad-mobile-nav__secondary a:focus-visible {
		color: var(--sklad-mobile-nav-hover) !important;
	}

	.sklad-mobile-nav__promo .sklad-mobile-nav__row-label {
		font-size: var(--sklad-mobile-nav-promo-font-size) !important;
		font-weight: var(--sklad-mobile-nav-promo-font-weight) !important;
		line-height: 1.12 !important;
	}

	.sklad-mobile-nav__promo .sklad-mobile-nav__row:first-child .sklad-mobile-nav__row-label {
		color: var(--sklad-mobile-nav-accent) !important;
	}

	.sklad-mobile-nav__promo .sklad-mobile-nav__row:first-child:hover .sklad-mobile-nav__row-label,
	.sklad-mobile-nav__promo .sklad-mobile-nav__row:first-child:focus-visible .sklad-mobile-nav__row-label {
		color: var(--sklad-mobile-nav-hover) !important;
	}

	.sklad-mobile-nav__badge {
		justify-self: end;
		padding: 5px 7px 4px;
		background: #efefef;
		color: #222;
		border-radius: 2px;
		font-size: 10px;
		font-weight: 500;
		line-height: 1;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.sklad-mobile-nav__chevron {
		position: relative;
		width: 18px;
		height: 18px;
		opacity: 0.38;
	}

	.sklad-mobile-nav__chevron::after {
		content: "";
		position: absolute;
		top: 4px;
		right: 4px;
		width: 9px;
		height: 9px;
		border-top: 1.8px solid currentColor;
		border-right: 1.8px solid currentColor;
		transform: rotate(45deg);
	}

	.sklad-mobile-nav-menu-trigger {
		--sklad-mobile-nav-hover: var(--wd-primary-color, var(--wd-link-color-hover, currentColor));
		display: inline-flex !important;
		align-items: center !important;
		gap: 10px !important;
		color: inherit;
		font: inherit;
		text-decoration: none !important;
		white-space: nowrap;
		transition: color 160ms ease;
	}

	.sklad-mobile-nav-menu-trigger:hover,
	.sklad-mobile-nav-menu-trigger:focus-visible {
		color: var(--sklad-mobile-nav-hover) !important;
	}

	.sklad-mobile-nav-native-trigger {
		--sklad-mobile-nav-hover: var(--wd-primary-color, var(--wd-link-color-hover, currentColor));
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 42px !important;
		min-width: 42px !important;
		height: 42px !important;
		padding: 0 !important;
		margin: 0 !important;
		line-height: 1 !important;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.sklad-mobile-nav-native-trigger > :not(.sklad-mobile-nav-trigger-icon),
	.sklad-mobile-nav-native-trigger .wd-tools-icon:not(.sklad-mobile-nav-trigger-icon),
	.sklad-mobile-nav-native-trigger .wd-tools-text,
	.sklad-mobile-nav-native-trigger .wd-tools-count,
	.sklad-mobile-nav-native-trigger .wd-tools-label,
	.sklad-mobile-nav-native-trigger .menu-opener {
		display: none !important;
	}

	.sklad-mobile-nav-native-trigger.wd-tools-icon::before,
	.sklad-mobile-nav-native-trigger.wd-tools-icon::after,
	.sklad-mobile-nav-native-trigger .wd-burger-icon::before,
	.sklad-mobile-nav-native-trigger .wd-burger-icon::after,
	.sklad-mobile-nav-native-trigger .woodmart-burger-icon::before,
	.sklad-mobile-nav-native-trigger .woodmart-burger-icon::after {
		content: none !important;
	}

	.sklad-mobile-nav-trigger-icon {
		position: relative;
		display: inline-block !important;
		align-self: center;
		flex: 0 0 auto;
		width: 20px;
		height: 14px;
		color: #333;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		pointer-events: none;
	}

	.sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-trigger-icon::after {
		content: "";
		position: absolute;
		left: 0;
		width: 20px;
		height: 1px;
		background: currentColor;
		border-radius: 999px;
		transition: transform 180ms ease;
	}

	.sklad-mobile-nav-trigger-icon::before {
		top: 3px;
	}

	.sklad-mobile-nav-trigger-icon::after {
		top: 10px;
	}

	.sklad-mobile-nav-menu-trigger:hover .sklad-mobile-nav-trigger-icon,
	.sklad-mobile-nav-menu-trigger:focus-visible .sklad-mobile-nav-trigger-icon,
	.sklad-mobile-nav-menu-trigger.is-active .sklad-mobile-nav-trigger-icon,
	.sklad-mobile-nav-native-trigger:hover .sklad-mobile-nav-trigger-icon,
	.sklad-mobile-nav-native-trigger:focus-visible .sklad-mobile-nav-trigger-icon,
	.sklad-mobile-nav-native-trigger.is-active .sklad-mobile-nav-trigger-icon {
		color: var(--sklad-mobile-nav-hover);
	}

	.sklad-mobile-nav-menu-trigger:hover .sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-menu-trigger:focus-visible .sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-menu-trigger.is-active .sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-native-trigger:hover .sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-native-trigger:focus-visible .sklad-mobile-nav-trigger-icon::before,
	.sklad-mobile-nav-native-trigger.is-active .sklad-mobile-nav-trigger-icon::before {
		transform: translateY(-1px);
	}

	.sklad-mobile-nav-menu-trigger:hover .sklad-mobile-nav-trigger-icon::after,
	.sklad-mobile-nav-menu-trigger:focus-visible .sklad-mobile-nav-trigger-icon::after,
	.sklad-mobile-nav-menu-trigger.is-active .sklad-mobile-nav-trigger-icon::after,
	.sklad-mobile-nav-native-trigger:hover .sklad-mobile-nav-trigger-icon::after,
	.sklad-mobile-nav-native-trigger:focus-visible .sklad-mobile-nav-trigger-icon::after,
	.sklad-mobile-nav-native-trigger.is-active .sklad-mobile-nav-trigger-icon::after {
		transform: translateY(1px);
	}

	@media (max-width: 360px) {
		.sklad-mobile-nav {
			--sklad-mobile-nav-promo-font-size: 22px;
			--sklad-mobile-nav-list-font-size: 15px;
		}

		.sklad-mobile-nav__primary-link {
			font-size: var(--sklad-mobile-nav-list-font-size);
		}

		.sklad-mobile-nav__row-label {
			font-size: var(--sklad-mobile-nav-list-font-size);
		}
	}

	@media (max-width: 1024px) {
		.sklad-mobile-nav-has-native-trigger .sklad-mobile-nav-menu-trigger {
			display: none !important;
		}
	}

	@media (min-width: 1025px) {
		.sklad-mobile-nav__drawer {
			width: min(440px, calc(100vw - 48px));
			min-height: 100%;
			box-shadow: 18px 0 48px rgba(0, 0, 0, 0.08);
		}

		.sklad-mobile-nav__panel {
			padding-left: 30px;
			padding-right: 30px;
		}

		.sklad-mobile-nav__top,
		.sklad-mobile-nav__panel-head {
			left: 30px;
			right: 30px;
		}
	}
