/* Шапка, футер, каталог, SEO-блок. Пилот Jane. ТЗ docs/TZ-header-footer-catalog-seo.md */

html.cs-chrome-on {
	--cs-accent: #C76654;
	--cs-avatar: #7377BA;
	--cs-footer: #FAF6F6;
	--cs-ink: #2c2422;
	--cs-muted: #6d6560;
	--cs-line: #e6ddd8;
}

@media (max-width: 760px) {
	html.cs-chrome-on #top-nav:not(.opened) {
		display: none;
	}
}

@media (min-width: 761px) {
	html.cs-chrome-on #top-nav:not(.opened) {
		display: block;
		height: 0;
		margin: 0;
		padding: 0;
		overflow: visible;
		background: none;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		position: static;
		pointer-events: none;
	}

	html.cs-chrome-on #top-nav:not(.opened) .close,
	html.cs-chrome-on #top-nav:not(.opened) .wrap > nav,
	html.cs-chrome-on #top-nav:not(.opened) #login > a {
		display: none !important;
	}

	html.cs-chrome-on #user-menu.cs-menu-open {
		pointer-events: auto;
	}
}

html.cs-chrome-on #catalogue-nav {
	display: none !important;
}

html.cs-chrome-on header.cs-chrome,
html.cs-chrome-on #page-main header.cs-chrome {
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 12px 0 16px;
	background: #fff;
	position: relative;
	z-index: 40;
}

html.cs-chrome-on:has(#first-order-discount-banner) .cs-chrome-root {
	top: var(--fod-banner-height, 40px);
}

html.cs-chrome-on header.cs-chrome.is-stuck {
	box-shadow: 0 1px 0 rgba(44, 36, 34, .08), 0 8px 20px rgba(44, 36, 34, .06);
}

@media (min-width: 761px) {
	html.cs-chrome-on #fixed-line.fixed {
		top: -60px !important;
	}

	html.cs-chrome-on #fixed-line.fixed ins {
		opacity: 0 !important;
	}
}

html.cs-chrome-on body:not(.logged-in) #fixed-line.fixed:not(.visible) {
	top: -80px !important;
}

html.cs-chrome-on body:not(.logged-in) #fixed-line.fixed:not(.visible) ins {
	opacity: 0 !important;
}

html.cs-chrome-on .fixed #fixed-cart {
	display: none !important;
}

html.cs-chrome-on .cs-chrome-inner {
	width: min(1504px, calc(100% - 48px));
	margin: 0 auto;
}

html.cs-chrome-on .cs-chrome-top {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	min-height: 52px;
	gap: 16px;
}

html.cs-chrome-on .cs-chrome-city:not(:has([data-cs-city])) {
	display: none;
}

html.cs-chrome-on .cs-chrome-logo {
	justify-self: center;
	line-height: 0;
}

html.cs-chrome-on .cs-chrome-logo img {
	width: 222px;
	height: auto;
	display: block;
}

html.cs-chrome-on .cs-chrome-tools {
	justify-self: end;
	display: flex;
	align-items: center;
	gap: 18px;
}

html.cs-chrome-on .cs-user,
html.cs-chrome-on .cs-avatar,
html.cs-chrome-on .cs-cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: var(--cs-ink);
	text-decoration: none;
	position: relative;
}

html.cs-chrome-on .cs-user svg,
html.cs-chrome-on .cs-cart svg {
	display: block;
	width: 24px;
	height: 24px;
}

html.cs-chrome-on .cs-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--cs-avatar);
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	letter-spacing: .02em;
	line-height: 24px;
	text-align: center;
}

html.cs-chrome-on .cs-cart .cs-cart-fill {
	display: none;
}

html.cs-chrome-on .cs-cart:not([data-count="0"]) .cs-cart-line {
	display: none;
}

html.cs-chrome-on .cs-cart:not([data-count="0"]) .cs-cart-fill {
	display: block;
}

html.cs-chrome-on .cs-cart-badge {
	display: none;
	position: absolute;
	top: -2px;
	right: -6px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 8px;
	background: var(--cs-accent);
	color: #fff;
	font-size: 10px;
	line-height: 16px;
	font-weight: bold;
	text-align: center;
}

html.cs-chrome-on .cs-cart:not([data-count="0"]) .cs-cart-badge {
	display: block;
}

html.cs-chrome-on .cs-search-row {
	display: flex;
	align-items: stretch;
	gap: 10px;
	margin-top: 14px;
}

html.cs-chrome-on .cs-catalog-btn,
html.cs-chrome-on .cs-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 8px;
	background: var(--cs-accent);
	color: #fff;
	font: inherit;
	font-size: 15px;
	cursor: pointer;
	white-space: nowrap;
}

html.cs-chrome-on .cs-catalog-btn.is-open {
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .45);
}

html.cs-chrome-on .cs-search {
	flex: 1;
	display: flex;
	align-items: stretch;
	min-width: 0;
	border: 1px solid #ddd4cf;
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
}

html.cs-chrome-on .cs-search input[type="text"] {
	flex: 1;
	min-width: 0;
	border: 0;
	height: 44px;
	padding: 0 16px;
	font: inherit;
	font-size: 15px;
	color: var(--cs-ink);
	background: transparent;
}

html.cs-chrome-on .cs-search input[type="text"]:focus {
	outline: none;
}

html.cs-chrome-on .cs-search button {
	border-radius: 0;
	margin: 0;
}

html.cs-chrome-on .cs-quick {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	gap: 22px;
	overflow-x: auto;
	overflow-y: hidden;
	margin: 12px 0 -16px;
	padding: 8px 0 12px;
	max-height: 48px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	transition: max-height .2s ease, opacity .2s ease, margin .2s ease, padding .2s ease;
}

html.cs-chrome-on .cs-quick.is-fit {
	justify-content: center;
}

html.cs-chrome-on .cs-quick.is-hidden {
	max-height: 0;
	opacity: 0;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	pointer-events: none;
}

html.cs-chrome-on .cs-quick::-webkit-scrollbar {
	display: none;
}

html.cs-chrome-on .cs-quick a {
	flex: 0 0 auto;
	white-space: nowrap;
	color: var(--cs-ink);
	font-size: 14px;
	text-decoration: none;
}

html.cs-chrome-on .cs-quick a:hover,
html.cs-chrome-on .cs-quick a:focus {
	color: var(--cs-accent);
}

@media (hover: none) {
	html.cs-chrome-on .cs-quick a:hover {
		color: var(--cs-ink);
	}
}

html.cs-chrome-on .cs-cart-source {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

html.cs-chrome-on .cs-chrome .cs-city {
	margin: 0;
}

html.cs-chrome-on .cs-chrome .cs-city-pin,
html.cs-chrome-on .cs-chrome button.cs-city-pin {
	color: var(--cs-accent) !important;
}

html.cs-chrome-on button.cs-city-yes,
html.cs-chrome-on button.cs-city-submit,
html.cs-chrome-on button.cs-city-yes:hover,
html.cs-chrome-on button.cs-city-submit:hover {
	background: var(--cs-accent) !important;
	background-color: var(--cs-accent) !important;
}

html.cs-chrome-on .cs-catalog[hidden],
html.cs-chrome-on .cs-sheet[hidden],
html.cs-chrome-on .cs-catalog-pane[hidden],
html.cs-chrome-on .cs-sheet-view[hidden] {
	display: none !important;
}

html.cs-chrome-on .cs-chrome-root {
	position: sticky;
	top: 0;
	z-index: 40;
}

html.cs-chrome-on .cs-catalog {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 40;
	margin-top: 0;
	pointer-events: none;
}

html.cs-chrome-on .cs-catalog-panel {
	width: min(720px, calc(100vw - 48px));
	height: 550px;
	max-height: min(550px, 70vh);
	margin-left: 0;
	display: flex;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 12px 40px rgba(44, 36, 34, .16);
	overflow: hidden;
	pointer-events: auto;
}

html.cs-chrome-on .cs-catalog-panel:not(:has(.cs-catalog-pane:not([hidden]))) {
	height: auto;
	max-height: min(550px, 70vh);
}

html.cs-chrome-on .cs-catalog-panel:not(:has(.cs-catalog-pane:not([hidden]))) .cs-catalog-right {
	display: none;
}

html.cs-chrome-on .cs-catalog-panel:not(:has(.cs-catalog-pane:not([hidden]))) .cs-catalog-left {
	width: 100%;
	flex-basis: auto;
	border-right: 0;
}

html.cs-chrome-on .cs-catalog-left,
html.cs-chrome-on .cs-catalog-right {
	overflow: auto;
	box-sizing: border-box;
	padding: 18px 8px;
	flex: 1 1 0;
	width: 50%;
	min-width: 0;
}

html.cs-chrome-on .cs-catalog-left {
	border-right: 1px solid var(--cs-line);
}

html.cs-chrome-on .cs-catalog-kicker {
	display: none;
}

html.cs-chrome-on .cs-catalog-kicker,
html.cs-chrome-on .cs-catalog-title {
	font-size: 13px;
	color: var(--cs-muted);
	padding: 6px 12px 10px;
}

html.cs-chrome-on .cs-catalog-title {
	font-size: 18px;
	color: var(--cs-ink);
	font-weight: bold;
	padding-left: 0;
}

html.cs-chrome-on .cs-catalog-link,
html.cs-chrome-on .cs-catalog-sub,
html.cs-chrome-on .cs-catalog-all {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	box-sizing: border-box;
	padding: 9px 12px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--cs-ink);
	font: inherit;
	font-size: 14px;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

html.cs-chrome-on .cs-catalog-link.is-current,
html.cs-chrome-on .cs-catalog-link:hover,
html.cs-chrome-on .cs-catalog-sub:hover {
	background: #f8f1ef;
	color: var(--cs-accent);
	text-decoration: none;
}

html.cs-chrome-on .cs-catalog-all {
	color: var(--cs-accent);
	font-weight: bold;
	margin-top: 8px;
	padding-left: 0;
}

html.cs-chrome-on .cs-catalog-rule {
	height: 1px;
	margin: 8px 12px;
	background: var(--cs-line);
}

html.cs-chrome-on .cs-chev {
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(-45deg);
	margin-left: 8px;
	flex: 0 0 auto;
}

html.cs-chrome-on .cs-sheet {
	position: fixed;
	inset: 0;
	z-index: 100200;
}

html.cs-chrome-on .cs-sheet-scrim {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .45);
}

html.cs-chrome-on .cs-sheet-panel {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 68px;
	max-height: none;
	background: #fff;
	border-radius: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	overflow: hidden;
	padding: 16px 0 0;
	box-sizing: border-box;
}

html.cs-chrome-on .cs-sheet-city {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	height: 44px;
	margin: 0 0 4px;
	padding: 0 20px;
	border-bottom: 1px solid #e6e6e6;
	min-height: 0;
}

html.cs-chrome-on .cs-sheet-city:empty {
	display: none;
}

html.cs-chrome-on .cs-sheet-view {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
}

html.cs-chrome-on .cs-sheet-head {
	display: grid;
	grid-template-columns: 72px 1fr 72px;
	align-items: center;
	padding: 0 8px 8px;
}

html.cs-chrome-on .cs-sheet-view[data-cs-sheet-view="root"] .cs-sheet-head {
	grid-template-columns: 40px 1fr 40px;
}

html.cs-chrome-on .cs-sheet-view[data-cs-sheet-view="root"] .cs-sheet-head::before {
	content: "";
}

html.cs-chrome-on .cs-sheet-title {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
}

html.cs-chrome-on .cs-sheet-back,
html.cs-chrome-on .cs-sheet-x,
html.cs-chrome-on .cs-sheet-back:hover,
html.cs-chrome-on .cs-sheet-back:active,
html.cs-chrome-on .cs-sheet-x:hover,
html.cs-chrome-on .cs-sheet-x:active {
	border: 0;
	background: transparent;
	background-color: transparent;
	color: var(--cs-ink);
	font: inherit;
	font-size: 14px;
	line-height: 1.2;
	text-shadow: none;
	box-shadow: none;
	cursor: pointer;
	height: auto;
	min-height: 36px;
}

html.cs-chrome-on .cs-sheet-x {
	justify-self: end;
	width: 36px;
	position: relative;
}

html.cs-chrome-on .cs-sheet-x::before,
html.cs-chrome-on .cs-sheet-x::after {
	content: "";
	position: absolute;
	left: 8px;
	right: 8px;
	top: 17px;
	height: 1.5px;
	background: currentColor;
}

html.cs-chrome-on .cs-sheet-x::before {
	transform: rotate(45deg);
}

html.cs-chrome-on .cs-sheet-x::after {
	transform: rotate(-45deg);
}

html.cs-chrome-on .cs-sheet-list {
	overflow: auto;
	flex: 1 1 auto;
	min-height: 0;
	padding: 0 0 16px;
	-webkit-overflow-scrolling: touch;
}

html.cs-chrome-on .cs-sheet-link,
html.cs-chrome-on .cs-sheet-all {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	box-sizing: border-box;
	height: auto;
	min-height: 40px;
	padding: 0 20px;
	border: 0;
	background: transparent;
	background-color: transparent;
	color: var(--cs-ink);
	font: inherit;
	font-size: 14px;
	line-height: 1.3;
	text-align: left;
	text-shadow: none;
	box-shadow: none;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

html.cs-chrome-on button.cs-sheet-link,
html.cs-chrome-on button.cs-sheet-link:hover,
html.cs-chrome-on button.cs-sheet-link:active {
	color: var(--cs-ink);
	background: transparent;
	background-color: transparent;
	text-shadow: none;
	box-shadow: none;
	height: auto;
	line-height: 1.3;
}

html.cs-chrome-on button.cs-catalog-link,
html.cs-chrome-on button.cs-catalog-link:hover,
html.cs-chrome-on button.cs-catalog-link:active {
	text-shadow: none;
	box-shadow: none;
	height: auto;
	line-height: inherit;
	color: var(--cs-ink);
	background-color: transparent;
}

html.cs-chrome-on button.cs-catalog-link:hover,
html.cs-chrome-on button.cs-catalog-link.is-current {
	background: #f8f1ef;
	color: var(--cs-accent);
}

html.cs-chrome-on .cs-sheet-link:active,
html.cs-chrome-on .cs-sheet-all:active,
html.cs-chrome-on .cs-catalog-link:active,
html.cs-chrome-on .cs-catalog-sub:active,
html.cs-chrome-on .cs-sheet-link.is-pressed,
html.cs-chrome-on .cs-sheet-all.is-pressed,
html.cs-chrome-on .cs-catalog-link.is-pressed,
html.cs-chrome-on .cs-catalog-sub.is-pressed {
	background: rgba(0, 0, 0, .18) !important;
	background-color: rgba(0, 0, 0, .18) !important;
	color: var(--cs-ink);
}

html.cs-chrome-on .cs-sheet-link .cs-chev {
	color: #8a8a8a;
}

html.cs-chrome-on .cs-sheet-all {
	color: var(--cs-accent);
	font-weight: bold;
	border-bottom: 0;
}

html.cs-sheet-open,
html.cs-sheet-open body {
	overflow: hidden;
}

html.cs-chrome-on footer.cs-footer {
	background: var(--cs-footer);
	color: var(--cs-ink);
	width: 100%;
	max-width: none;
	margin: 28px 0 0;
	padding: 28px 0 36px;
	clear: both;
	box-sizing: border-box;
}

html.cs-chrome-on .cs-footer-inner {
	width: min(1504px, calc(100% - 48px));
	margin: 0 auto;
}

html.cs-chrome-on .cs-footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin-bottom: 22px;
}

html.cs-chrome-on .cs-footer-links a,
html.cs-chrome-on .cs-footer-legal a,
html.cs-chrome-on .cs-footer-mail {
	color: var(--cs-ink);
	text-decoration: none;
	font-size: 14px;
}

html.cs-chrome-on .cs-footer-links a:hover,
html.cs-chrome-on .cs-footer-legal a:hover,
html.cs-chrome-on .cs-footer-mail:hover {
	color: var(--cs-accent);
}

html.cs-chrome-on .cs-footer-mid {
	display: flex;
	align-items: center;
	gap: 28px;
}

html.cs-chrome-on .cs-footer-logo img {
	width: 160px;
	height: auto;
	display: block;
}

html.cs-chrome-on .cs-sub {
	flex: 0 1 auto;
	min-width: 0;
}

html.cs-chrome-on .cs-sub-label {
	margin: 0 0 8px;
	font-size: 13px;
	color: var(--cs-muted);
}

html.cs-chrome-on .cs-sub-row {
	position: relative;
	width: 307px;
	height: 35px;
}

html.cs-chrome-on .cs-sub input[type="email"] {
	width: 100%;
	height: 35px;
	box-sizing: border-box;
	border: 1px solid rgba(89, 81, 76, .45);
	border-radius: 5px;
	padding: 0 52px 0 12px;
	font: inherit;
	background: #fff;
	color: var(--cs-ink);
}

html.cs-chrome-on .cs-sub button {
	position: absolute;
	top: 0;
	right: 0;
	width: 46px;
	height: 35px;
	padding: 0;
	border: 0;
	border-left: 1px solid rgba(89, 81, 76, .35);
	border-radius: 0 5px 5px 0;
	background: transparent;
	color: var(--cs-accent);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

html.cs-chrome-on .cs-sub button:disabled {
	opacity: .6;
	cursor: default;
}

html.cs-chrome-on .cs-sub-msg {
	min-height: 1.2em;
	margin-top: 6px;
	font-size: 13px;
}

html.cs-chrome-on .cs-sub-msg.is-error {
	color: #a33;
}

html.cs-chrome-on .cs-social {
	display: flex;
	gap: 17px;
	align-items: center;
}

html.cs-chrome-on .cs-social a {
	width: 40px;
	height: 39px;
	display: block;
	line-height: 0;
	text-decoration: none;
}

html.cs-chrome-on .cs-social img {
	width: 40px;
	height: 39px;
	display: block;
	border-radius: 20px;
	object-fit: cover;
}

html.cs-chrome-on .cs-footer-line {
	border: 0;
	border-top: 1px solid var(--cs-line);
	margin: 22px 0 16px;
}

html.cs-chrome-on .cs-footer-legal {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	align-items: flex-start;
}

html.cs-chrome-on .cs-footer-legal p {
	margin: 0;
	font-size: 12px;
	color: var(--cs-muted);
	max-width: 640px;
}

html.cs-chrome-on .cs-footer-legal nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	justify-content: flex-end;
}

html.cs-chrome-on .cs-home-seo,
html.cs-chrome-on .cs-home-seo-fallback {
	width: min(1504px, calc(100% - 48px));
	margin: 36px auto 8px;
	color: var(--cs-ink);
}

html.cs-chrome-on .cs-home-seo h1,
html.cs-chrome-on .cs-home-seo-fallback {
	text-transform: none;
	font-size: 22px;
	line-height: 1.45;
	font-weight: 600;
	margin: 0 0 8px;
}

html.cs-chrome-on .cs-home-seo-body {
	font-size: 14px;
	line-height: 1.5;
}

html.cs-chrome-on .cs-home-seo-body.is-clamped {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

html.cs-chrome-on .cs-home-seo-more {
	margin-top: 8px;
	border: 0;
	background: transparent;
	color: var(--cs-accent);
	font: inherit;
	cursor: pointer;
	padding: 0;
}

html.cs-chrome-on #bottom-nav .cs-nav-catalog,
html.cs-chrome-on #bottom-nav .search,
html.cs-chrome-on #bottom-nav .home,
html.cs-chrome-on #bottom-nav .profile,
html.cs-chrome-on #bottom-nav .cart {
	background-image: none;
	color: #9a928c;
}

html.cs-chrome-on #bottom-nav a.is-current,
html.cs-chrome-on #bottom-nav .cs-nav-catalog.is-open {
	color: var(--cs-accent);
}

html.cs-chrome-on #bottom-nav .home.is-current {
	color: #9a928c;
}

html.cs-chrome-on #bottom-nav .cs-nav-catalog::before,
html.cs-chrome-on #bottom-nav .search::before,
html.cs-chrome-on #bottom-nav .home::before,
html.cs-chrome-on #bottom-nav .profile::before,
html.cs-chrome-on #bottom-nav .cart::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 10px;
	width: 28px;
	height: 28px;
	transform: translateX(-50%);
	background: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

html.cs-chrome-on #bottom-nav .cs-nav-catalog::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M4 7h16v2H4zm0 4h16v2H4zm0 4h16v2H4z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M4 7h16v2H4zm0 4h16v2H4zm0 4h16v2H4z'/></svg>");
}

html.cs-chrome-on #bottom-nav .search::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M10 4a6 6 0 014.8 9.6l4.3 4.3-1.4 1.4-4.3-4.3A6 6 0 1110 4zm0 2a4 4 0 100 8 4 4 0 000-8z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M10 4a6 6 0 014.8 9.6l4.3 4.3-1.4 1.4-4.3-4.3A6 6 0 1110 4zm0 2a4 4 0 100 8 4 4 0 000-8z'/></svg>");
}

html.cs-chrome-on #bottom-nav .home::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' fill-rule='evenodd' d='M12 3.2 4.2 10.1 5.5 11.6 6.4 10.8V20h4.2v-5.4h2.8V20H17.6v-9.2l.9.8 1.3-1.5L12 3.2zm0 2.5 4.2 3.6V18.4h-1.4v-5.4H9.2v5.4H7.8v-9.1L12 5.7z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' fill-rule='evenodd' d='M12 3.2 4.2 10.1 5.5 11.6 6.4 10.8V20h4.2v-5.4h2.8V20H17.6v-9.2l.9.8 1.3-1.5L12 3.2zm0 2.5 4.2 3.6V18.4h-1.4v-5.4H9.2v5.4H7.8v-9.1L12 5.7z'/></svg>");
}

html.cs-chrome-on #bottom-nav .profile::before,
html.cs-chrome-on #bottom-nav .cart::before {
	width: 20px;
	height: 20px;
	top: 16px;
}

html.cs-chrome-on #bottom-nav .profile::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='7.8' r='5' fill='none' stroke='black' stroke-width='2.8'/><path d='M2.2 30.4C2.2 17.2 8 15.6 16 15.6C24 15.6 29.8 17.2 29.8 30.4' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='7.8' r='5' fill='none' stroke='black' stroke-width='2.8'/><path d='M2.2 30.4C2.2 17.2 8 15.6 16 15.6C24 15.6 29.8 17.2 29.8 30.4' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round'/></svg>");
}

html.cs-chrome-on #bottom-nav .profile .cs-avatar {
	position: absolute;
	left: 50%;
	top: 16px;
	width: 20px;
	height: 20px;
	min-width: 20px;
	max-width: 20px;
	padding: 0;
	box-sizing: border-box;
	aspect-ratio: 1;
	transform: translateX(-50%);
	font-size: 9px;
	line-height: 20px;
	border-radius: 50%;
	background: var(--cs-avatar);
	color: #fff;
}

html.cs-chrome-on #bottom-nav .profile:has(.cs-avatar)::before {
	display: none;
}

html.cs-chrome-on #bottom-nav .cart {
	background-image: none !important;
}

html.cs-chrome-on #bottom-nav .cart::before,
html.cs-chrome-on #bottom-nav .cart:not([data-count="0"])::before {
	content: "" !important;
	color: inherit !important;
	font-size: 0 !important;
	line-height: 0 !important;
	top: 16px !important;
	left: 50% !important;
	right: auto !important;
	width: 20px;
	height: 20px;
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='black' d='M15.9932 0.0996094C17.7344 0.0996094 19.4045 0.791959 20.6357 2.02344C21.8669 3.25491 22.5586 4.92544 22.5586 6.66699V8.09961H30.6582C30.8351 8.09811 31.0104 8.13483 31.1719 8.20703C31.3336 8.27939 31.4778 8.38641 31.5947 8.51953C31.7088 8.65002 31.7947 8.80304 31.8457 8.96875C31.8966 9.13444 31.9117 9.30938 31.8906 9.48145L29.8516 26.1475C29.6521 27.7442 28.8732 29.2121 27.6631 30.2725C26.4528 31.3329 24.895 31.9118 23.2861 31.8994H8.75391C7.145 31.9118 5.58722 31.3329 4.37695 30.2725C3.16686 29.2121 2.38793 27.7442 2.18848 26.1475L0.109375 9.48047C0.0884279 9.3086 0.103423 9.13424 0.154297 8.96875C0.205274 8.80304 0.291152 8.65002 0.405273 8.51953C0.520823 8.38798 0.662817 8.28226 0.822266 8.20996C0.981702 8.13768 1.15503 8.09983 1.33008 8.09961H9.42773V6.66699C9.42773 4.92552 10.1195 3.25489 11.3506 2.02344C12.5818 0.791999 14.252 0.0996546 15.9932 0.0996094ZM2.73633 10.6787L4.60254 25.8389H4.60352C4.72745 26.8363 5.2131 27.7534 5.96875 28.416C6.72422 29.0784 7.69654 29.44 8.70117 29.4326V29.4336H23.2588V29.4326C24.2634 29.44 25.2357 29.0785 25.9912 28.416C26.6998 27.7947 27.1709 26.9497 27.3291 26.0244L27.3574 25.8389L29.25 10.6787L29.2637 10.5664H2.72266L2.73633 10.6787ZM15.9932 2.56641C14.906 2.56645 13.8634 2.99872 13.0947 3.76758C12.326 4.53647 11.8945 5.57964 11.8945 6.66699V8.09961H20.0928V6.66699C20.0928 5.57962 19.6603 4.53647 18.8916 3.76758C18.1229 2.99876 17.0803 2.56641 15.9932 2.56641Z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='black' d='M15.9932 0.0996094C17.7344 0.0996094 19.4045 0.791959 20.6357 2.02344C21.8669 3.25491 22.5586 4.92544 22.5586 6.66699V8.09961H30.6582C30.8351 8.09811 31.0104 8.13483 31.1719 8.20703C31.3336 8.27939 31.4778 8.38641 31.5947 8.51953C31.7088 8.65002 31.7947 8.80304 31.8457 8.96875C31.8966 9.13444 31.9117 9.30938 31.8906 9.48145L29.8516 26.1475C29.6521 27.7442 28.8732 29.2121 27.6631 30.2725C26.4528 31.3329 24.895 31.9118 23.2861 31.8994H8.75391C7.145 31.9118 5.58722 31.3329 4.37695 30.2725C3.16686 29.2121 2.38793 27.7442 2.18848 26.1475L0.109375 9.48047C0.0884279 9.3086 0.103423 9.13424 0.154297 8.96875C0.205274 8.80304 0.291152 8.65002 0.405273 8.51953C0.520823 8.38798 0.662817 8.28226 0.822266 8.20996C0.981702 8.13768 1.15503 8.09983 1.33008 8.09961H9.42773V6.66699C9.42773 4.92552 10.1195 3.25489 11.3506 2.02344C12.5818 0.791999 14.252 0.0996546 15.9932 0.0996094ZM2.73633 10.6787L4.60254 25.8389H4.60352C4.72745 26.8363 5.2131 27.7534 5.96875 28.416C6.72422 29.0784 7.69654 29.44 8.70117 29.4326V29.4336H23.2588V29.4326C24.2634 29.44 25.2357 29.0785 25.9912 28.416C26.6998 27.7947 27.1709 26.9497 27.3291 26.0244L27.3574 25.8389L29.25 10.6787L29.2637 10.5664H2.72266L2.73633 10.6787ZM15.9932 2.56641C14.906 2.56645 13.8634 2.99872 13.0947 3.76758C12.326 4.53647 11.8945 5.57964 11.8945 6.66699V8.09961H20.0928V6.66699C20.0928 5.57962 19.6603 4.53647 18.8916 3.76758C18.1229 2.99876 17.0803 2.56641 15.9932 2.56641Z'/></svg>");
}

html.cs-chrome-on #bottom-nav .cart:not([data-count="0"])::after {
	content: attr(data-count);
	position: absolute;
	top: 6px;
	left: calc(50% + 4px);
	min-width: 14px;
	height: 14px;
	padding: 0 3px;
	border-radius: 7px;
	background: var(--cs-accent);
	color: #fff;
	font-size: 9px;
	line-height: 14px;
	font-weight: bold;
	text-align: center;
}

@media (max-width: 760px) {
	html.cs-chrome-on body {
		padding-bottom: 68px;
	}

	html.cs-chrome-on #bottom-nav {
		height: 68px;
	}

	html.cs-chrome-on .cs-city-overlay.is-plaque,
	html.cs-chrome-on .cs-city-plaque {
		bottom: 68px;
	}

	html.cs-chrome-on #bottom-nav a,
	html.cs-chrome-on #bottom-nav span {
		padding-top: 46px;
	}

	html.cs-chrome-on header.cs-chrome,
	html.cs-chrome-on #page-main header.cs-chrome {
		padding: 10px 0 14px;
		margin-top: 0;
	}

	html.cs-chrome-on .cs-chrome-root,
	html.cs-chrome-on:has(#first-order-discount-banner) .cs-chrome-root {
		position: relative;
		top: auto;
	}

	html.cs-chrome-on.cs-sheet-open .cs-chrome-root {
		z-index: 103;
	}

	html.cs-chrome-on .cs-quick {
		margin-bottom: -14px;
	}

	html.cs-chrome-on.cs-brand-gigi #dbl-nav {
		margin-top: 12px;
	}

	html.cs-chrome-on .cs-chrome-inner {
		width: calc(100% - 24px);
	}

	html.cs-chrome-on .cs-chrome-top {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		min-height: 40px;
	}

	html.cs-chrome-on .cs-chrome-logo {
		order: 1;
		margin-right: auto;
	}

	html.cs-chrome-on .cs-chrome-city {
		order: 2;
		margin-left: auto;
	}

	html.cs-chrome-on .cs-chrome-logo img {
		width: 148px;
	}

	html.cs-chrome-on a.cs-chrome-logo {
		position: relative;
		display: inline-block;
		-webkit-tap-highlight-color: rgba(0, 0, 0, .18);
	}

	html.cs-chrome-on a.cs-chrome-logo:active::after,
	html.cs-chrome-on a.cs-chrome-logo.is-pressed::after {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, .18);
		pointer-events: none;
	}

	html.cs-chrome-on .cs-search-row,
	html.cs-chrome-on .cs-chrome-tools {
		display: none;
	}

	html.cs-chrome-on .cs-chrome .cs-city-pin-ico {
		width: 8px;
		height: 8px;
		flex-basis: 8px;
		border-radius: 50%;
		background: var(--cs-accent);
		-webkit-mask: none;
		mask: none;
	}

	html.cs-chrome-on .cs-chrome .cs-city-name {
		max-width: 42vw;
	}

	html.cs-chrome-on .cs-catalog {
		display: none !important;
	}

	html.cs-chrome-on .cs-footer-inner {
		width: calc(100% - 32px);
	}

	html.cs-chrome-on .cs-footer-links,
	html.cs-chrome-on .cs-footer-legal nav {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	html.cs-chrome-on .cs-footer-mid {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	html.cs-chrome-on .cs-sub,
	html.cs-chrome-on .cs-sub-row {
		width: 100%;
	}

	html.cs-chrome-on .cs-sub-row,
	html.cs-chrome-on .cs-sub input[type="email"],
	html.cs-chrome-on .cs-sub button {
		height: 40px;
	}

	html.cs-chrome-on .cs-footer-legal {
		flex-direction: column;
	}

	html.cs-chrome-on .cs-home-seo,
	html.cs-chrome-on .cs-home-seo-fallback {
		width: calc(100% - 32px);
	}
}

@media (min-width: 761px) {
	html.cs-chrome-on .cs-sheet {
		display: none !important;
	}

	html.cs-chrome-on .cs-chrome-inner {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px 16px;
	}

	html.cs-chrome-on .cs-chrome-top {
		display: contents;
	}

	html.cs-chrome-on .cs-chrome-city {
		order: 1;
	}

	html.cs-chrome-on .cs-chrome-logo {
		order: 2;
	}

	html.cs-chrome-on .cs-search-row {
		order: 3;
		flex: 1 1 240px;
		min-width: 0;
		margin-top: 0;
	}

	html.cs-chrome-on .cs-chrome-tools {
		order: 4;
	}

	html.cs-chrome-on .cs-quick {
		order: 5;
		flex: 1 0 100%;
		margin-top: 4px;
	}

	html.cs-chrome-on .cs-catalog-btn,
	html.cs-chrome-on .cs-search button,
	html.cs-chrome-on .cs-search input[type="text"] {
		height: 40px;
	}

	html.cs-chrome-on .cs-avatar {
		width: 28px;
		height: 28px;
		font-size: 11px;
		line-height: 28px;
	}

	html.cs-chrome-flow .cs-chrome-root,
	html.cs-chrome-on.cs-chrome-flow:has(#first-order-discount-banner) .cs-chrome-root {
		position: relative;
		top: auto;
	}

	html.cs-chrome-on .wrap > .cs-chrome-root {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		box-sizing: border-box;
	}

	html.cs-chrome-on #cart-nav {
		width: 480px;
		max-width: min(480px, 100vw);
		z-index: 100050;
	}
}

/* Gigi. Каталог #6382BB, «Найти» и кружок #E55B92. Футер темнее фона страницы #6282bb. */
html.cs-chrome-on.cs-brand-gigi {
	--cs-accent: #6382BB;
	--cs-avatar: #E55B92;
	--cs-footer: #4A6AA3;
	--cs-ink: #3c507e;
	--cs-muted: #5c6b8a;
	--cs-line: #e3e9f4;
}

html.cs-chrome-on.cs-brand-gigi .cs-search button {
	background: #E55B92;
}

html.cs-chrome-on.cs-brand-gigi .cs-catalog-panel:not(:has(.cs-catalog-pane:not([hidden]))) {
	width: min(360px, calc(100vw - 48px));
}

html.cs-chrome-on.cs-brand-gigi .cs-chrome-logo img {
	width: auto;
	height: 51px;
}

html.cs-chrome-on.cs-brand-gigi footer.cs-footer,
html.cs-chrome-on.cs-brand-gigi .cs-footer-links a,
html.cs-chrome-on.cs-brand-gigi .cs-footer-legal a,
html.cs-chrome-on.cs-brand-gigi .cs-footer-mail {
	color: #fff;
}

html.cs-chrome-on.cs-brand-gigi .cs-footer-links a:hover,
html.cs-chrome-on.cs-brand-gigi .cs-footer-legal a:hover,
html.cs-chrome-on.cs-brand-gigi .cs-footer-mail:hover {
	color: #ffd0e2;
}

html.cs-chrome-on.cs-brand-gigi .cs-sub-label,
html.cs-chrome-on.cs-brand-gigi .cs-footer-legal p {
	color: rgba(255, 255, 255, .86);
}

html.cs-chrome-on.cs-brand-gigi .cs-footer-line {
	border-top-color: rgba(255, 255, 255, .35);
}

html.cs-chrome-on.cs-brand-gigi .cs-sub button {
	color: #E55B92;
}

html.cs-chrome-on.cs-brand-gigi .cs-sub input[type="email"] {
	border-color: rgba(255, 255, 255, .7);
	color: #2c2422;
	background: #fff;
}

@media (max-width: 760px) {
	html.cs-chrome-on.cs-brand-gigi .cs-chrome-logo img {
		width: auto;
		height: 34px;
	}

	html.cs-chrome-on.cs-brand-gigi #middle {
		margin-top: 12px;
	}
}

/* Cosmetic Star. Каталог #0F194E, «Найти» и кружок #EC0057. Футер #0F194E, текст белый. */
html.cs-chrome-on.cs-brand-star {
	--cs-accent: #0F194E;
	--cs-avatar: #EC0057;
	--cs-footer: #0F194E;
	--cs-ink: #2c2422;
	--cs-muted: #5c6478;
	--cs-line: #e4e7ef;
}

html.cs-chrome-on.cs-brand-star .cs-search button {
	background: #EC0057;
}

html.cs-chrome-on.cs-brand-star .cs-chrome-logo img {
	width: auto;
	height: 51px;
}

html.cs-chrome-on.cs-brand-star .cs-sub button {
	color: #EC0057;
}

html.cs-chrome-on.cs-brand-star #wrap > .cs-chrome-root,
html.cs-chrome-on.cs-brand-star #wrap > footer.cs-footer {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
}

html.cs-chrome-on.cs-brand-star footer.cs-footer,
html.cs-chrome-on.cs-brand-star .cs-footer-links a,
html.cs-chrome-on.cs-brand-star .cs-footer-legal a,
html.cs-chrome-on.cs-brand-star .cs-footer-mail {
	color: #fff;
}

html.cs-chrome-on.cs-brand-star .cs-footer-links a:hover,
html.cs-chrome-on.cs-brand-star .cs-footer-legal a:hover,
html.cs-chrome-on.cs-brand-star .cs-footer-mail:hover {
	color: #ffb3d0;
}

html.cs-chrome-on.cs-brand-star .cs-sub-label,
html.cs-chrome-on.cs-brand-star .cs-footer-legal p {
	color: rgba(255, 255, 255, .86);
}

html.cs-chrome-on.cs-brand-star .cs-footer-line {
	border-top-color: rgba(255, 255, 255, .35);
}

html.cs-chrome-on.cs-brand-star .cs-sub input[type="email"] {
	border-color: rgba(255, 255, 255, .7);
	color: #2c2422;
	background: #fff;
}

html.cs-chrome-on.cs-brand-star .cs-footer-logo img {
	width: auto;
	height: 48px;
}

@media (max-width: 760px) {
	html.cs-chrome-on.cs-brand-star .cs-chrome-logo img {
		width: auto;
		height: 34px;
		max-width: 148px;
	}

	html.cs-chrome-on.cs-brand-star #dbl-nav,
	html.cs-chrome-on.cs-brand-star #middle {
		margin-top: 12px;
	}
}