@media (min-width: 1025px) {
		/* ============================================================
		   Sub-level FIXED FLYOUT з anchor до тригера
		   ============================================================ */

		/* Level-1 (Іжа для собак, Ласощі, Іграшки, ...) → flyout */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown {
			/* Reset accordion grid trick */
			display: block !important;
			grid-template-rows: unset !important;

			/* FIXED position — escapes overflow-y:auto clipping. JS виставляє --amg-flyout-top.
			   ВАЖЛИВО: sidebar експандиться на 450px (child theme override), не 275!
			   Flyout мусить починатись ПІСЛЯ sidebar, інакше перекриває chevron-колонку. */
			position: fixed !important;
			top: var(--amg-flyout-top, 65px) !important;
			left: 458px !important;     /* 450 sidebar width + 8 breathing room */
			right: auto !important;
			bottom: auto !important;
			width: 300px !important;
			max-width: 300px !important;
			max-height: calc(100vh - 100px) !important;
			max-height: calc(100dvh - 100px) !important;
			overflow-y: auto !important;
			overflow-x: hidden !important;

			padding: 8px 0 !important;
			margin: 0 !important;

			background: #fff !important;
			border: 1px solid rgba(0,0,0,0.08) !important;
			border-radius: 10px !important;
			box-shadow: 0 12px 36px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.04) !important;

			z-index: 350 !important;

			/* GPU acceleration — без will-change браузер repaint-ить shadow+content */
			will-change: opacity, transform !important;
			overscroll-behavior: contain !important;

			visibility: hidden !important;
			opacity: 0 !important;
			pointer-events: none !important;
			transform: translateX(-6px) !important;
			transition:
				opacity 180ms ease,
				transform 220ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
				visibility 0s linear 220ms !important;
		}

		/* Прибрати overflow:hidden та min-height:0 з нащадків */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown > * {
			overflow: visible !important;
			min-height: auto !important;
		}

		/* Прибрати separator borders/margins що тема додає */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown {
			border-top-width: 1px !important;
			border-bottom-width: 1px !important;
			margin-bottom: 0 !important;
		}

		/* Show коли xts-opened */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.xts-opened > .xts-dropdown {
			visibility: visible !important;
			opacity: 1 !important;
			pointer-events: auto !important;
			transform: translateX(0) !important;
			transition:
				opacity 180ms ease,
				transform 220ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
				visibility 0s !important;
		}

		/* Items inside flyout */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown ul.xts-sub-menu {
			display: block !important;
			padding: 0 !important;
			margin: 0 !important;
		}

		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2 > .xts-nav-link {
			padding: 9px 14px !important;
			font-size: 13.5px !important;
			font-weight: 600 !important;
			color: #222 !important;
			min-height: auto !important;
		}

		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-3 > .xts-nav-link {
			padding: 7px 14px 7px 26px !important;
			font-size: 12.5px !important;
			font-weight: 400 !important;
			color: #555 !important;
			min-height: auto !important;
		}

		/* Level-3 під level-2: COLLAPSED by default, expanded при click на chevron level-2.
		   Раніше було «завжди розкрите» що давало flyout висотою ~700px для «Догляд та гігієна»
		   (Обладнання+7 sub + Підгузки+4 sub) → JS shift-ив flyout вгору → перекривав
		   сусідні flyouts → user клікав не туди. Тепер flyout стартує ~280px, JS не shift-ить. */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown
			.item-level-2.menu-item-has-children > .xts-dropdown {
			position: static !important;
			width: auto !important;
			max-width: none !important;
			margin: 0 !important;
			padding: 0 !important;
			background: transparent !important;
			border: none !important;
			box-shadow: none !important;
			transform: none !important;
			z-index: auto !important;
			/* Accordion grid-trick: 0fr collapsed → 1fr expanded */
			display: grid !important;
			grid-template-rows: 0fr !important;
			visibility: hidden !important;
			opacity: 0 !important;
			pointer-events: none !important;
			overflow: hidden !important;
			transition: grid-template-rows 0.25s cubic-bezier(0.4, 0, 0.6, 1),
			            visibility 0s linear 0.25s,
			            opacity 0.15s ease !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown
			.item-level-2.menu-item-has-children > .xts-dropdown > * {
			min-height: 0 !important;
			overflow: hidden !important;
		}
		/* Expanded when user clicked chevron on level-2 */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown
			.item-level-2.menu-item-has-children.xts-opened > .xts-dropdown {
			grid-template-rows: 1fr !important;
			visibility: visible !important;
			opacity: 1 !important;
			pointer-events: auto !important;
			padding: 0 0 6px 0 !important;
			transition: grid-template-rows 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
			            visibility 0s,
			            opacity 0.2s ease !important;
		}

		/* Chevron у flyout: показуємо для level-2 (toggle level-3), ховаємо для level-3 (листя). */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children {
			position: relative !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children > .xts-nav-link {
			padding-right: 56px !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children > .xts-submenu-opener {
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			position: absolute !important;
			top: 0 !important;
			right: 0 !important;
			width: 56px !important;
			height: 40px !important;
			cursor: pointer !important;
			z-index: 2 !important;
			opacity: 0.7 !important;
			pointer-events: auto !important;
			border-radius: 6px !important;
			transition: opacity .15s ease, background .15s ease !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children > .xts-submenu-opener:hover {
			opacity: 1 !important;
			background: rgba(var(--amg-accent-rgb, 255, 103, 31), 0.14) !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children > .xts-submenu-opener:active {
			background: rgba(var(--amg-accent-rgb, 255, 103, 31), 0.22) !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2.menu-item-has-children.xts-opened > .xts-submenu-opener::after {
			transform: rotate(-135deg) !important;
		}
		/* Level-3 = leaves, opener завжди прихований */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-3 > .xts-submenu-opener {
			display: none !important;
		}

		/* Роздільник між level-2 групами */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-2:not(:last-child) {
			border-bottom: 1px solid rgba(0,0,0,0.04);
			padding-bottom: 4px;
			margin-bottom: 4px;
		}

		/* Якщо sidebar НЕ розгорнутий — flyout не показуємо */
		.xts-sticky-cats:not(:hover):not(.xts-expanded):not(:focus-within)
			.xts-nav-sticky-cat .item-level-1.menu-item-has-children > .xts-dropdown {
			visibility: hidden !important;
			opacity: 0 !important;
			pointer-events: none !important;
			display: none !important;
		}

		/* ============================================================
		   #2 ACTIVE-STATE INDICATOR на активному level-1
		   ============================================================ */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.xts-opened > .xts-nav-link {
			background: rgba(var(--amg-accent-rgb, 255, 103, 31), 0.06) !important;
			box-shadow: inset 3px 0 0 var(--amg-accent, #ff671f) !important;
			color: var(--amg-accent, #ff671f) !important;
			font-weight: 600 !important;
		}

		/* Chevron на активному → правий + accent */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.xts-opened > .xts-submenu-opener::after {
			transform: rotate(-45deg) !important;
			border-color: var(--amg-accent, #ff671f) !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1.xts-opened > .xts-submenu-opener {
			opacity: 1 !important;
		}

		/* ============================================================
		   #7 COMPACT level-1 ROWS у sidebar (не у flyout)
		   Зменшує висоту рядків — Аптека стає видимою коли Собаки розгорнуті.
		   ============================================================ */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat > .item-level-0 > .xts-dropdown .item-level-1 > .xts-nav-link {
			padding: 8px 32px 8px 22px !important;
			min-height: 32px !important;
			font-size: 13px !important;
			line-height: 1.35 !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat > .item-level-0 > .xts-dropdown .item-level-1 > .xts-nav-link .xts-nav-img,
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat > .item-level-0 > .xts-dropdown .item-level-1 > .xts-nav-link > img {
			width: 14px !important;
			height: 14px !important;
		}

		/* Tactile opener для level-1 у sidebar (56px wide, full row height).
		   Замість compact 32×32 даємо великий tap-area щоб не треба було
		   вицілювати курсор у малий arrow. */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-submenu-opener {
			width: 56px !important;
			height: 100% !important;
			min-height: 40px !important;
		}

		/* Sticky-cats title теж шринк */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-sticky-cats-title {
			height: 48px !important;
		}

		/* Більше місця у nav для items (компенсація скороченого title) */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat {
			max-height: calc(100vh - 130px) !important;
			max-height: calc(100dvh - 130px) !important;
		}

		/* ============================================================
		   SCROLL INDICATOR: показуємо що контент продовжується нижче
		   ============================================================ */

		/* Static overlay fade в нижній частині nav.
		   Раніше використовували mask-image: linear-gradient що змушувало браузер
		   re-rasterize всю область при кожному scroll → ~3-5ms jank на середньому железі.
		   Pseudo-element overlay використовує composite-only paint, zero scroll cost.

		   ВАЖЛИВО: pseudo-element на .xts-nav-sticky-cat (НЕ на .xts-sticky-cats),
		   бо parent has position:fixed і override-ити це position:relative ламає sticky
		   layout (sidebar потрапляє в normal flow). Theme XTS вже задає
		   .xts-sticky-cats { position:fixed; left:0; top:0; bottom:0 } — не чіпати! */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat {
			position: relative;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat::after {
			content: "";
			position: sticky;
			display: block;
			left: 0;
			right: 0;
			bottom: 0;
			margin-top: -32px;
			height: 32px;
			background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
			pointer-events: none;
			opacity: 1;
			transition: opacity 200ms ease;
			z-index: 5;
			will-change: opacity;
		}
		/* Hide overlay коли nav scrolled до самого дна */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat.amg-at-bottom::after {
			opacity: 0;
		}

		/* Більш помітний scrollbar коли sidebar expanded */
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat {
			scrollbar-color: rgba(0,0,0,0.3) transparent !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat::-webkit-scrollbar {
			width: 6px !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat::-webkit-scrollbar-thumb {
			background: rgba(0,0,0,0.3) !important;
			border-radius: 3px !important;
		}
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within) .xts-nav-sticky-cat::-webkit-scrollbar-thumb:hover {
			background: rgba(0,0,0,0.5) !important;
		}

		/* ============================================================
		   #5 BRAND ICON FALLBACK: letter-circle для брендів без іконок
		   ============================================================ */
		.xts-nav-sticky-cat .item-level-3.amg-no-icon > .xts-nav-link::before,
		.xts-sticky-cats:is(:hover, .xts-expanded, :focus-within)
			.xts-nav-sticky-cat .item-level-1 > .xts-dropdown .item-level-3.amg-no-icon > .xts-nav-link::before {
			content: attr(data-letter);
			display: inline-flex;
			align-items: center;
			justify-content: center;
			flex: 0 0 auto;
			width: 14px;
			height: 14px;
			border-radius: 50%;
			background: rgba(var(--amg-accent-rgb, 255, 103, 31), 0.14);
			color: var(--amg-accent, #ff671f);
			font-size: 9px;
			font-weight: 700;
			line-height: 1;
			margin-right: 6px;
			vertical-align: middle;
			text-align: center;
		}
	}

	/* Mobile: лишаємо як було */
	@media (max-width: 1024px) {
		/* No-op */
	}