:root {
	--bg: #f4efe6;
	--paper: #fffdf8;
	--ink: #181511;
	--muted: #5c5147;
	--accent: #f26a1b;
	
	--accent-mid: #c35516;
	--accent-deep: #a83c0c;
	
	--accent-pale: #f3a676;
	
	--accent-soft: #ffab84;

	
	--admin-button-padding: 0.5rem 1rem;
	--admin-button-size: 0.82rem;
	--admin-button-line: 1.15;
	--admin-eyebrow-gap: 1.6rem;
	
	--brand-group-shift: 6rem;
	--shadow: 0 20px 60px rgba(16, 8, 4, 0.18);
	--panel-gap: clamp(1.5rem, 3vw, 3rem);
	--panel-width: min(520px, calc((100vw - 6rem - var(--panel-gap)) / 2));
	--results-top: clamp(12rem, 16vw, 14rem);
	--results-width: min(1320px, calc(100vw - 1rem));
	--search-width: min(300px, calc(100vw - 2rem));
	--content-width: min(1120px, 100% - 2rem);
	
	--action-space: 2.4rem;
	
	--chat-gap: 1.15rem;
	
	--bubble-gap: 1.25rem;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	min-height: 100vh;
	
	min-width: 900px;
	font-family: "Space Grotesk", sans-serif;
	color: var(--ink);
	background-color: #000;
	
	background-image:
		linear-gradient(rgba(8, 8, 8, 0.78), rgba(8, 8, 8, 0.9)),
		url("/assets/bg.jpg?v=4");
	
	background-image:
		linear-gradient(rgba(8, 8, 8, 0.78), rgba(8, 8, 8, 0.9)),
		image-set(
			url("/assets/bg.avif?v=5") type("image/avif"),
			url("/assets/bg.webp?v=5") type("image/webp"),
			url("/assets/bg.jpg?v=4") type("image/jpeg"));
	background-size: cover;
	background-position: center 42%;
	background-repeat: no-repeat;
	
	background-attachment: fixed;
}

.hidden {
	display: none !important;
}

.bg-grid {
	display: none;
	position: fixed;
	inset: 0;
	background-image:
		linear-gradient(rgba(24, 21, 17, 0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(24, 21, 17, 0.04) 1px, transparent 1px);
	background-size: 34px 34px;
	mask-image: radial-gradient(circle at center, black 30%, transparent 80%);
	pointer-events: none;
}

.topbar {
	width: var(--content-width);
	margin: 1rem auto 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	position: relative;
	z-index: 3;
}

.topbar.topbar-ennuste {
	z-index: 30;
}

.topbar-brand {
	width: 100%;
}

.topbar-brand h1 {
	margin: 0;
	color: var(--accent);
	font-size: clamp(2.2rem, 4vw, 3rem);
	line-height: 0.9;
}

.topbar-brand h1 .brand-home-link {
	display: inline-flex;
	align-items: center;
}

.topbar-login-btn {
	position: absolute;
	top: clamp(1rem, 2vw, 1.8rem);
	right: calc((100% - var(--content-width)) / 2);
	padding: 0.55rem 1.2rem;
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	white-space: nowrap;
	
	z-index: 20;
}

.topbar-login-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
	gap: 0.4rem;
	align-items: center;
}

.topbar-login-form input {
	padding: 0.4rem 0.55rem;
	border-radius: 9px;
	font-size: 0.78rem;
}

.topbar-login-form button {
	padding: 0.4rem 0.8rem;
	font-size: 0.75rem;
	white-space: nowrap;
}

.app-shell {
	width: var(--content-width);
	margin: 0 auto 2rem;
	display: flex;
	flex-direction: column;
}

.profile-badge {
	position: absolute;
	top: clamp(1rem, 2vw, 1.8rem);
	
	right: calc((100% - var(--content-width)) / 2);
	width: fit-content;
	
	min-width: 12rem;
	max-width: min(340px, calc(100% - 2rem));
	
	z-index: 20;
}

.card {
	background: rgba(255, 253, 248, 0.7);
	border: 1px solid rgba(24, 21, 17, 0.1);
	border-radius: 20px;
	box-shadow: var(--shadow);
	padding: clamp(1rem, 2vw, 2rem);
}

.card.profile-badge {
	
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(255, 255, 255, 0.06);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
	backdrop-filter: blur(8px);
	color: #f4efe6;
	padding: 0.7rem 1rem;
	
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	
}

.profile-badge .profile-badge-toggle {
	
	flex: 1;
	min-width: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "label caret" "name caret";
	align-items: center;
	gap: 0 0.6rem;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 8px;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

.profile-badge .profile-badge-toggle:hover {
	background: none;
}

.profile-badge-toggle .eyebrow {
	grid-area: label;
}

.profile-badge-name {
	grid-area: name;
	display: block;
	min-width: 0;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.03em;
	overflow-wrap: anywhere;
}

.profile-badge-caret {
	grid-area: caret;
	width: 0.7rem;
	height: 0.5rem;
	color: var(--accent);
	transition: transform 140ms ease;
}

.profile-badge-menu {
	visibility: hidden;
	opacity: 0;
	transition: opacity 120ms ease, visibility 120ms;
	
	transition-delay: 420ms;
	position: absolute;
	top: 100%;
	
	right: -0.35rem;
	min-width: 16.5rem;
	max-width: min(21rem, calc(100vw - 2rem));
	
	margin-top: 0.45rem;
	padding: 1.2rem 1.3rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 14px;
	
	background: #1a1a1a;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
}

.profile-badge-caret {
	display: none;
}

.profile-badge-has-bikes .profile-badge-caret {
	display: block;
}

.profile-badge-has-bikes:hover .profile-badge-menu {
	visibility: visible;
	opacity: 1;
	transition-delay: 240ms;
}

.profile-badge-has-bikes.profile-badge-open .profile-badge-menu {
	visibility: visible;
	opacity: 1;
	transition-delay: 0ms;
}

.profile-badge-has-bikes .profile-logout-inline {
	display: none;
}

.profile-badge .profile-logout-inline {
	margin: 0;
	padding: 0.4rem 0.8rem;
	font-size: 0.72rem;
	letter-spacing: 0.05em;
	white-space: nowrap;
	flex: none;
}

.profile-badge:not(.profile-badge-has-bikes) .profile-badge-toggle {
	cursor: default;
}

.profile-badge-has-bikes:hover .profile-badge-caret {
	transform: rotate(180deg);
	transition-delay: 240ms;
}

.profile-badge.profile-badge-open .profile-badge-caret {
	transform: rotate(180deg);
	transition-delay: 0ms;
}

@media (prefers-reduced-motion: reduce) {
	.profile-badge-caret {
		transition: none;
	}
	
	.profile-badge-menu {
		transition: visibility 0s;
	}
}

.profile-badge-logout {
	margin-top: 2.4rem;
	width: 100%;
	
	padding: 0.85rem 1.2rem;
	font-size: 0.8rem;
}

.profile-badge-menu .garage-section {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.profile-badge h2 {
	font-size: 1.05rem;
	margin: 0;
	line-height: 1.1;
	
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}

.profile-badge .ghost {
	flex: 0 0 auto;
}

.profile-badge .description {
	font-size: 0.7rem;
	margin: 0;
}

.profile-badge > button {
	margin: 0;
	padding: 0.32rem 0.85rem;
	font-size: 0.75rem;
	white-space: nowrap;
}

h1,
h2 {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.04em;
	line-height: 1;
}

h1 {
	font-size: clamp(2rem, 5vw, 3.4rem);
}

h2 {
	font-size: clamp(1.8rem, 4vw, 2.6rem);
}

.eyebrow {
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--accent);
	font-weight: 700;
	font-size: 0.75rem;
}

.admin-panel .eyebrow {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.05rem;
	font-weight: 400;
	letter-spacing: 0.08em;
}

.description {
	margin: 0.5rem 0 0;
	color: var(--muted);
}

input {
	width: 100%;
	color: var(--ink);
	border: 1px solid rgba(24, 21, 17, 0.18);
	background: rgba(255, 255, 255, 0.92);
	border-radius: 12px;
	padding: 0.7rem 0.8rem;
	font: inherit;
}

button {
	appearance: none;
	border: 0;
	border-radius: 999px;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	font: inherit;
	font-weight: 700;
	padding: 0.72rem 1rem;
	cursor: pointer;
}

button.ghost {
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
}

.profile-card {
	position: fixed;
	top: clamp(10.5rem, 15vw, 13rem);
	left: calc(50% - (var(--panel-gap) / 2) - var(--panel-width));
	width: var(--panel-width);
	max-height: calc(100vh - 15rem);
	overflow-y: auto;
	z-index: 2;
	backdrop-filter: blur(8px);
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 0;
	width: 0;
	height: 0;
	overflow: visible;
}

.results-card {
	position: fixed;
	top: var(--results-top);
	left: 50%;
	transform: translateX(-50%);
	width: var(--results-width);
	max-height: calc(100vh - 15rem);
	overflow-y: auto;
	z-index: 2;
	backdrop-filter: blur(10px);
	background: rgba(255, 253, 248, 0.58);
	border: 1px solid rgba(255, 255, 255, 0.34);
	padding: clamp(0.85rem, 1.6vw, 1.2rem);
}

.search-form,
.results-head-row {
	margin-top: 0.9rem;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 0.5rem;
	align-items: center;
}

.search-row > * {
	pointer-events: auto;
}

#searchForm {
	
	margin-top: 0;
	
	position: relative;
	
	flex: 1 1 var(--search-width);
	width: auto;
	max-width: min(460px, 100%);
	padding: 0.45rem 0.75rem;
	border-radius: 14px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(255, 255, 255, 0.06);
	grid-template-columns: minmax(0, 1fr) auto;
}

body.admin-mode #searchForm {
	display: none !important;
}

.profile-card > .eyebrow,
#sectionTitle {
	display: none;
}

.garage-section {
	margin-top: 1.1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.garage-list {
	margin: 0.9rem 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.menu-list {
	margin: 1rem auto 0;
	padding: 0 0.55rem 0.2rem;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 0.3rem;
	width: max-content;
	max-width: 100%;
	white-space: nowrap;
}

.menu-list > li {
	position: relative;
	flex: 0 0 auto;
}

.garage-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.6rem;
	padding: 0.6rem 0.7rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 10px;
	background: rgba(255, 122, 24, 0.12);
}

.profile-badge .garage-remove {
	width: 1.6rem;
	height: 1.6rem;
}

.profile-badge .garage-menu-link,
.profile-badge .garage-bike {
	color: #f4efe6;
}

.profile-badge .garage-menu-link:hover,
.profile-badge .garage-menu-link:focus-visible {
	color: var(--accent-soft);
}

.garage-icon {
	display: block;
	width: 1.1rem;
	height: 1.1rem;
	filter: brightness(0) invert(1);
	opacity: 0.85;
}

.garage-menu-link,
.menu-link {
	color: var(--ink);
	font-weight: 700;
	text-decoration: none;
}

.menu-link {
	display: block;
	padding: 0.38rem 0.58rem;
	border-radius: 10px;
	border: 1px solid rgba(24, 21, 17, 0.2);
	background: rgba(255, 255, 255, 0.62);
	white-space: nowrap;
	font-size: 0.9rem;
	
	position: relative;
	z-index: 0;
	transition: transform 0.14s ease, color 0.12s ease, border-color 0.12s ease;
}

.menu-list:hover > li > .menu-link {
	transform: scale(0.9);
}

.menu-list > li:hover > .menu-link {
	transform: scale(1.18);
	z-index: 2;
}

.menu-list > li:hover > .menu-link {
	color: var(--accent);
	border-color: rgba(191, 58, 31, 0.45);
}

@media (prefers-reduced-motion: reduce) {
	.menu-link {
		transition: color 0.12s ease, border-color 0.12s ease;
	}
}

.shop-empty-box {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(760px, calc(100vw - 2rem));
	padding: 1.5rem 1.8rem;
	border-radius: 14px;
	border: 1px solid rgba(24, 21, 17, 0.12);
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 16px 40px rgba(16, 8, 4, 0.18);
	text-align: center;
	font-weight: 700;
	font-size: clamp(1.15rem, 2vw, 1.6rem);
	letter-spacing: 0.03em;
	color: #1c1814;
	z-index: 5;
}

body.admin-mode .shop-empty-box {
	display: none !important;
}

body.admin-mode .glass-box,
body.admin-mode .site-nav,
body.admin-mode .finder-cart-row {
	display: none !important;
}

body.admin-mode .chat-widget {
	display: none !important;
}

body.shop-empty .profile-card,
body.shop-empty .results-card {
	display: none !important;
}

.menu-link-active,
.menu-list:hover > li > .menu-link-active,
.menu-list > li:hover > .menu-link-active {
	color: var(--accent);
	border-color: rgba(191, 58, 31, 0.45);
	background: rgba(255, 255, 255, 0.62);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.menu-list:hover > li > .menu-link-active {
	transform: none;
}

.results-label {
	margin: 0.1rem 0 0;
}

.results-model {
	color: var(--accent);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: clamp(1.4rem, 2.2vw, 2rem);
}

.garage-remove {
	display: inline-grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	border-radius: 999px;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	text-decoration: none;
}

.trash-icon {
	width: 0.95rem;
	height: 0.95rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.clear-results-btn {
	background: transparent;
	border: 1px solid rgba(24, 21, 17, 0.2);
	color: var(--muted);
	font-size: 1.5rem;
	line-height: 1;
	padding: 0.2rem 0.65rem;
	border-radius: 999px;
	cursor: pointer;
	flex-shrink: 0;
}

.clear-results-btn:hover {
	background: rgba(191, 58, 31, 0.08);
	color: var(--accent);
	border-color: var(--accent);
}

.product-grid {
	margin-top: 1rem;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}

.product-item {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.product-img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 10px;
	border: 1px solid rgba(24, 21, 17, 0.1);
}

.product-title {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.04em;
	font-size: 1rem;
	color: var(--ink);
}

.product-meta {
	margin: 0;
	font-size: 0.92rem;
	color: var(--muted);
}

.product-price {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.05em;
	font-size: 1.1rem;
	color: var(--accent);
}

.inline-submenu-popup {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	padding-top: 0.35rem;
	min-width: 220px;
	max-width: min(70vw, 420px);
	z-index: 6;
}

.inline-submenu-item > .inline-submenu-popup {
	top: 0;
	left: 100%;
	padding-top: 0;
	padding-left: 0.35rem;
}

.menu-list > li:hover > .inline-submenu-popup,
.inline-submenu-item:hover > .inline-submenu-popup {
	display: block;
}

.inline-submenu {
	margin: 0;
	padding: 0.45rem;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	border-radius: 12px;
	border: 1px solid rgba(24, 21, 17, 0.16);
	background: rgba(255, 253, 248, 0.96);
	box-shadow: 0 12px 28px rgba(16, 8, 4, 0.15);
}

.inline-submenu-item {
	position: relative;
	margin-left: 0;
}

.inline-submenu-link {
	display: block;
	padding: 0.3rem 0.5rem;
	border-radius: 8px;
	color: var(--accent);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.92rem;
	white-space: nowrap;
}

.inline-submenu-item:hover > .inline-submenu-link {
	background: rgba(191, 58, 31, 0.1);
}

.inline-submenu-link-active {
	color: #fff;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
}

.inline-submenu-item:hover > .inline-submenu-link-active {
	color: #fff;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
}

.bike-finder-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1.1rem;
	
	font-size: 1rem;
	letter-spacing: 0.01em;
	white-space: nowrap;
}

.bike-finder-icon {
	display: block;
	width: 1.35rem;
	height: 1.35rem;
	
	filter: brightness(0) invert(1);
}

.bike-finder {
	
	position: absolute;
	top: 100%;
	left: 0;
	
	z-index: 6;
	margin: 0.5rem 0 0;
	
	width: min(1030px, 92vw);
	max-height: 40vh;
	overflow-y: auto;
	
	scrollbar-width: thin;
	scrollbar-color: var(--accent) rgba(255, 255, 255, 0.12);
	padding: 1.5rem 1.4rem 2.6rem;
	border-radius: 12px;
	
	background:
		linear-gradient(#1c1a19 30%, rgba(28, 26, 25, 0)) top / 100% 26px no-repeat local,
		linear-gradient(rgba(28, 26, 25, 0), #1c1a19 70%) bottom / 100% 26px no-repeat local,
		radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0))
			top / 100% 14px no-repeat scroll,
		radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0))
			bottom / 100% 14px no-repeat scroll,
		#1c1a19;
	border: 1px solid rgba(255, 255, 255, 0.22);
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.55);
	display: grid;
	gap: 0.55rem;
}

.bike-finder::-webkit-scrollbar {
	width: 10px;
}

.bike-finder::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.10);
	border-radius: 999px;
}

.bike-finder::-webkit-scrollbar-thumb {
	background: var(--accent);
	border-radius: 999px;
	border: 2px solid #1c1a19;
}

.bike-chip {
	display: inline-flex;
	align-items: stretch;
	border-radius: 999px;
	border: 1px solid var(--accent-mid);
	background: rgba(255, 122, 24, 0.14);
	overflow: hidden;
}

.bike-chip-open,
.bike-chip-clear {
	background: none;
	border: 0;
	border-radius: 0;
	color: #f4efe6;
	font: inherit;
	cursor: pointer;
}

.bike-chip-open {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 0.9rem;
	font-size: 0.92rem;
}

.bike-chip-name {
	font-weight: 700;
	letter-spacing: 0.02em;
}

.bike-chip-meta {
	font-size: 0.8rem;
	opacity: 0.75;
	letter-spacing: 0.06em;
}

.bike-chip-clear {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 0.75rem;
	font-size: 1.3rem;
	line-height: 1;
	border-left: 1px solid rgba(255, 122, 24, 0.5);
}

.bike-chip-open:hover,
.bike-chip-clear:hover,
.bike-chip-open:focus-visible,
.bike-chip-clear:focus-visible {
	background: rgba(255, 122, 24, 0.28);
}

.universal-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.5rem 0.9rem;
	border-radius: 999px;
	background: rgba(255, 122, 24, 0.14);
	border: 1px solid var(--accent-mid);
	color: #f4efe6;
	font: inherit;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	cursor: pointer;
}

.universal-chip[aria-pressed="false"] {
	background: none;
	border-style: dashed;
	border-color: rgba(255, 255, 255, 0.32);
	opacity: 0.72;
	font-weight: 400;
}

.universal-chip:hover,
.universal-chip:focus-visible {
	background: rgba(255, 122, 24, 0.28);
	opacity: 1;
}

.bike-finder-close {
	position: absolute;
	top: 0.55rem;
	right: 0.7rem;
	background: none;
	border: 0;
	padding: 0.1rem 0.45rem 0.25rem;
	border-radius: 8px;
	color: #f4efe6;
	opacity: 0.6;
	font-size: 1.5rem;
	line-height: 1;
	font-weight: 400;
	cursor: pointer;
}

.bike-finder-close:hover,
.bike-finder-close:focus-visible {
	opacity: 1;
	background: rgba(255, 255, 255, 0.12);
}

.bike-finder-title {
	
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	margin: 0 0 1.5rem;
	color: #f4efe6;
}

.bike-finder-row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.bike-finder-row .bike-finder-select {
	flex: 1 1 0;
	min-width: 0;
}

.bike-finder-row button {
	flex: 0 0 auto;
	padding: 0.62rem 1.3rem;
	font-size: 0.9rem;
}

.bike-finder-note {
	margin-top: 2rem;
}

.bike-finder-select {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	padding: 0.62rem 1.9rem 0.62rem 0.7rem;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.35);
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23111' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.7rem center;
	background-size: 0.62rem auto;
	color: #111;
	font: inherit;
	font-size: 0.95rem;
	text-overflow: ellipsis;
}

.bike-finder-select option {
	background-color: #fff;
	color: #111;
}

.bike-finder-select:disabled {
	opacity: 0.45;
}

.bike-finder-traficom {
	font-size: 1rem;
	color: #f4efe6;
	
	opacity: 0.55;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.bike-finder-traficom-info {
	margin: 0.3rem 0 0;
	max-width: 34rem;
	color: #f4efe6;
	opacity: 0.42;
	font-size: 0.82rem;
	line-height: 1.4;
}

.search-suggestion {
	position: absolute;
	top: 100%;
	left: 0;
	
	min-width: 100%;
	width: max-content;
	max-width: min(560px, calc(100vw - 2rem));
	margin-top: 0.35rem;
	z-index: 40;
	display: grid;
	
	grid-template-columns: minmax(0, 1fr);
	gap: 0.15rem;
	padding: 0.4rem;
	border-radius: 12px;
	border: 1px solid rgba(24, 21, 17, 0.14);
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 12px 28px rgba(24, 21, 17, 0.14);
	max-height: min(60vh, 26rem);
	overflow-y: auto;
}

.suggestion-label {
	margin: 0.3rem 0 0.1rem;
	padding: 0 0.5rem;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	color: rgba(24, 21, 17, 0.5);
}

.suggestion-label:first-child {
	margin-top: 0;
}

.suggestion-btn {
	width: 100%;
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	border-radius: 8px;
	border: 0;
	background: transparent;
	color: var(--ink);
	font-weight: 500;
	font-size: 0.95rem;
	text-align: left;
	padding: 0.45rem 0.5rem;
	cursor: pointer;
}

.suggestion-name {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.suggestion-hint {
	flex: 0 0 auto;
	font-size: 0.78rem;
	color: rgba(24, 21, 17, 0.55);
}

.suggestion-count {
	flex: 0 0 auto;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.78rem;
	font-variant-numeric: tabular-nums;
	color: rgba(24, 21, 17, 0.55);
}

.suggestion-btn:hover,
.suggestion-btn.suggestion-active {
	background: rgba(255, 240, 220, 0.95);
}

.status {
	min-height: 1.4rem;
	margin: 0.5rem auto 0;
	width: min(900px, 100% - 2rem);
	color: var(--accent-soft);
	font-weight: 500;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.9rem;
}

.status.ok {
	color: #8fd98a;
}

.admin-panel {
	max-width: 760px;
	margin: 0 auto;
	backdrop-filter: blur(8px);
	
	background-color: rgba(10, 10, 10, 0.55);
	border-color: rgba(255, 255, 255, 0.18);
	color: #f4efe6;
}

.admin-panel .admin-main-box {
	padding-top: 0.9rem;
}

.admin-panel .admin-box {
	background-color: rgba(255, 255, 255, 0.05);
	border-color: rgba(255, 255, 255, 0.12);
	color: #f4efe6;
}

.admin-panel .description {
	color: rgba(244, 239, 230, 0.75);
}

.admin-panel .admin-file-text,
.admin-panel textarea.admin-file-text {
	background: rgba(255, 255, 255, 0.95);
	color: var(--ink);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	padding: 0.55rem 0.7rem;
	font: inherit;
	width: 100%;
	box-sizing: border-box;
}

.admin-grid {
	display: grid;
	grid-template-columns: 2.2fr 1fr;
	gap: 0.9rem;
	align-items: start;
}

.admin-grid-single {
	grid-template-columns: minmax(0, 34rem);
	justify-content: start;
}

.admin-panel .admin-grid-edit {
	
	grid-template-columns: minmax(0, 1fr) minmax(0, 21rem);
	gap: 0.9rem;
	
	align-items: start;
	justify-content: start;
}

@media (max-width: 1100px) {
	.admin-panel .admin-grid-edit {
		grid-template-columns: minmax(0, 46rem);
	}
}

.admin-panel .admin-grid-edit.admin-edit-product-open {
	grid-template-columns: minmax(0, 1fr);
}

.admin-panel .admin-edit-product-open .admin-edited-box,
.admin-panel .admin-edit-product-open .admin-product-search {
	display: none;
}

.admin-edited-list {
	list-style: none;
	margin: 0.6rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	
	max-height: 30rem;
	overflow-y: auto;
}

.admin-edited-empty {
	font-size: 0.82rem;
	color: rgba(244, 239, 230, 0.6);
}

.admin-panel .admin-edited-item {
	
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	width: 100%;
	margin: 0;
	padding: 0.5rem 0 0;
	background: none;
	border: 0;
	border-radius: 0;
	text-align: left;
	font: inherit;
	cursor: pointer;
}

.admin-panel .admin-edited-item:hover {
	background: none;
}

.admin-edited-row:hover {
	background: rgba(255, 255, 255, 0.06);
}

.admin-edited-code {
	display: block;
	font-weight: 700;
	color: var(--accent);
	font-size: 0.88rem;
}

.admin-edited-title {
	display: block;
	font-size: 0.82rem;
	line-height: 1.3;
}

.admin-grid-single .admin-box {
	padding: clamp(1.4rem, 2.2vw, 2rem);
}

.admin-grid-single .admin-field-name {
	font-size: 0.9rem;
}

.admin-grid-single .admin-file-text,
.admin-grid-single textarea.admin-file-text {
	font-size: 1rem;
	padding: 0.65rem 0.8rem;
}

.admin-nav {
	width: var(--content-width);
	margin: 1.2rem auto 0.9rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	
	align-items: center;
	gap: 0.4rem 1.8rem;
}

.admin-nav-link {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0.2rem 0;
	margin: 0;
	
	display: inline-flex;
	align-items: center;
	
	min-height: 2.2rem;
	line-height: 1;
	
	color: #fff;
	
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.25rem;
	font-weight: 400;
	letter-spacing: 0.05em;
	cursor: pointer;
}

.admin-nav-exit {
	margin-left: 1.8rem;
}

.admin-nav-link:hover,
.admin-nav-link:focus-visible {
	color: var(--accent-soft);
	background: none;
}

.admin-nav-active,
.admin-nav-active:hover {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.35em;
}

.admin-catalogue-buttons {
	display: flex;
	flex-wrap: wrap;
	
	align-items: flex-end;
	gap: 1.4rem;
	margin-top: 1.1rem;
}

.admin-catalogue-checkrow {
	display: flex;
	justify-content: flex-end;
	padding-top: 0.9rem;
}

.admin-panel .admin-catalogue-checkrow button {
	margin-top: 0;
}

.admin-catalogue-buttons .admin-text-link {
	margin-left: auto;
}

.admin-panel .admin-catalogue-buttons button {
	margin-top: 0;
}

.admin-text-link {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0 0 0.35rem;
	color: #fff;
	font: inherit;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-decoration: none;
	cursor: pointer;
}

.admin-panel .admin-text-link:hover,
.admin-panel .admin-text-link:focus-visible {
	background: none;
	color: var(--accent-soft);
}

.admin-panel .admin-text-link-active,
.admin-panel .admin-text-link-active:hover {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}

.admin-diff-more {
	margin: 0.7rem 0 0;
}

.admin-runs {
	margin-top: 1.2rem;
}

.admin-run-list,
.admin-diff-list {
	list-style: none;
	margin: 0.5rem 0 0;
	padding: 0;
}

.admin-run-item {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: start;
	gap: 0.4rem 1rem;
	padding: 0.9rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.9rem;
}

.admin-run-item > .admin-run-detail {
	grid-column: 1 / -1;
}

.admin-run-fields {
	opacity: 0.8;
}

.admin-run-added {
	color: var(--accent);
	font-weight: 600;
}

.admin-run-visibility {
	font-weight: 600;
}

.admin-run-failed {
	color: #ff8a7a;
}

.admin-run-reverted {
	opacity: 0.6;
	text-decoration: line-through;
}

.admin-locked-note {
	color: var(--accent-mid);
	font-size: 0.82rem;
}

.admin-diff-list li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	padding: 0.3rem 0;
	font-size: 0.85rem;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.admin-diff-code {
	font-variant-numeric: tabular-nums;
	opacity: 0.7;
	min-width: 5.5rem;
}

.admin-panel .admin-diff-link {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;
	width: auto;
	font: inherit;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	color: inherit;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.admin-panel .admin-diff-link:hover,
.admin-panel .admin-diff-link:focus-visible {
	background: none;
	color: var(--accent);
	text-decoration: underline;
}

.admin-diff-old {
	opacity: 0.6;
	text-decoration: line-through;
}

.admin-diff-new {
	color: var(--accent);
	font-weight: 700;
}

.admin-run-detail {
	margin-top: 0.9rem;
	padding: 1rem 1.1rem;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.35);
	max-height: 22rem;
	overflow-y: auto;
}

.admin-run-item .admin-catalogue-actions {
	display: flex;
	gap: 0.6rem;
	align-self: end;
}

.admin-panel .admin-product-search {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0.6rem;
	align-items: stretch;
}

.admin-panel .admin-product-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 0.85rem;
	font-size: 0.9rem;
	line-height: 1;
}

.admin-status-line:empty {
	display: none;
}

.admin-panel .admin-product-search {
	margin: 0.7rem 0;
}

.admin-panel .admin-product-search .admin-file-text {
	height: 2.4rem;
	box-sizing: border-box;
	padding: 0 0.6rem;
	font-size: 0.9rem;
	line-height: 1.2;
}

.admin-panel .admin-product-fields .admin-catalogue-actions button {
	font-size: 0.82rem;
	padding: 0.45rem 0.9rem;
}

.admin-field {
	display: block;
	margin-bottom: 0;
}

.admin-panel .admin-product-fields {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.8rem 1.2rem;
	align-items: start;
}

@media (max-width: 720px) {
	.admin-panel .admin-product-fields {
		grid-template-columns: minmax(0, 1fr);
	}
}

.admin-field-wide {
	grid-column: 1 / -1;
}

.admin-field-static {
	margin: 0;
	padding: 0.55rem 0;
	color: rgba(244, 239, 230, 0.9);
	word-break: break-word;
}

.admin-field-readonly .admin-field-name {
	opacity: 0.5;
}

.admin-field-code {
	font-family: ui-monospace, "SF Mono", Menlo, monospace;
	font-size: 0.75rem;
	line-height: 1.45;
	white-space: pre-wrap;
	word-break: break-word;
	max-height: 12rem;
	overflow-y: auto;
	background: rgba(0, 0, 0, 0.3);
	border-radius: 8px;
	padding: 0.6rem 0.7rem;
}

.admin-extras {
	margin-top: 1.4rem;
	padding-top: 1.4rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.admin-image-row {
	display: block;
	word-break: break-all;
}

.admin-raw {
	margin-top: 1rem;
}

.admin-raw summary {
	cursor: pointer;
	color: #fff;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.admin-raw summary:hover {
	color: var(--accent-soft);
}

.admin-raw[open] summary {
	color: var(--accent);
	margin-bottom: 0.6rem;
}

.admin-product-head {
	display: flex;
	flex-wrap: wrap;
	gap: 1.2rem;
	align-items: flex-start;
	
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.admin-product-image {
	width: 10rem;
	height: 10rem;
	object-fit: contain;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.9);
	flex: none;
}

.admin-product-image-broken {
	background: rgba(255, 255, 255, 0.06);
	position: relative;
}

.admin-product-image-broken::after {
	content: "kuva puuttuu";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(244, 239, 230, 0.5);
	font-size: 0.82rem;
}

.admin-product-image-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.06);
	color: rgba(244, 239, 230, 0.5);
	font-size: 0.82rem;
}

.admin-product-facts {
	flex: 1 1 14rem;
	min-width: 0;
}

.admin-field-name {
	display: block;
	font-size: 0.82rem;
	opacity: 0.75;
	margin-bottom: 0.2rem;
}

.admin-field-lock {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.8rem;
	margin-top: 0.35rem;
	color: var(--accent-mid);
	font-size: 0.8rem;
}

.admin-field-lock-text {
	min-width: 0;
}

.admin-panel .admin-field-lock .admin-lock-release {
	margin: 0;
	padding: 0.4rem 0.9rem;
	font-size: 0.82rem;
	letter-spacing: 0.05em;
	white-space: nowrap;
	flex: none;
}

.admin-field-pending {
	display: block;
	margin-top: 0.25rem;
	color: var(--accent-mid);
	font-size: 0.8rem;
	font-weight: 700;
}

.admin-lock-info {
	margin: 0 0 0.4rem;
	padding: 0 0 0 0.9rem;
	border-left: 2px solid var(--accent);
	font-size: 0.82rem;
	color: rgba(244, 239, 230, 0.78);
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.admin-lock-info p {
	margin: 0;
	max-width: 46rem;
}

.admin-lock-info-title {
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.admin-field-lock .ghost,
.admin-suggest {
	padding: 0.1rem 0.5rem;
	font-size: 0.78rem;
}

.admin-product-history {
	margin-top: 1rem;
	max-height: 18rem;
	overflow-y: auto;
}

.admin-box {
	padding: clamp(1.2rem, 1.8vw, 1.6rem);
}

.admin-panel button {
	margin-top: 1rem;
}

.admin-panel .admin-catalogue-actions button,
.admin-panel .admin-field-lock button,
.admin-panel .admin-product-search button,
.admin-panel .admin-suggest {
	margin-top: 0;
}

.admin-panel .admin-catalogue-actions {
	display: flex;
	gap: 0.6rem;
	margin-top: 1rem;
}

.admin-panel .eyebrow {
	margin-top: var(--admin-eyebrow-gap);
}

.admin-panel .admin-box > .eyebrow:first-child {
	margin-top: 0;
}

.admin-panel .admin-catalogue-list,
.admin-panel .admin-run-list {
	margin-top: 0.8rem;
}

.admin-main-box h2 {
	margin-top: 0.2rem;
}

.admin-session-row {
	margin-top: 0.4rem;
	display: grid;
	gap: 0.5rem;
}

.admin-session-row .description {
	margin: 0;
}

.admin-form {
	margin-top: 1rem;
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.7rem;
	align-items: center;
}

.admin-file-text {
	background: rgba(255, 255, 255, 0.95);
	color: var(--ink);
	font-weight: 500;
}

.admin-select {
	width: 100%;
	border: 1px solid rgba(24, 21, 17, 0.18);
	background: rgba(255, 255, 255, 0.92);
	border-radius: 12px;
	padding: 0.7rem 0.8rem;
	font: inherit;
	color: var(--ink);
	font-weight: 500;
}

.admin-poll-row {
	display: grid;
	grid-template-columns: 1fr;
	align-items: center;
	gap: 0.65rem;
	padding: 1rem 1.05rem;
	border: 1px solid rgba(24, 21, 17, 0.18);
	background: #fff;
	border-radius: 12px;
}

.admin-checkbox-row {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--ink);
	padding: 0;
	border: 0;
	background: transparent;
	border-radius: 0;
}

.admin-checkbox-row input,
.admin-promo-option input[type="checkbox"] {
	appearance: auto;
	-webkit-appearance: checkbox;
	width: 1rem;
	height: 1rem;
	margin: 0;
	padding: 0;
	background: #fff;
	border: 1px solid rgba(24, 21, 17, 0.35);
	border-radius: 3px;
	accent-color: var(--accent);
	cursor: pointer;
}

.admin-poll-select {
	width: 100%;
	min-width: 0;
	background: #fff;
	padding: 0.72rem 0.8rem;
	color: var(--muted);
}

.admin-poll-select:disabled {
	color: rgba(92, 81, 71, 0.58);
}

.admin-file-text::placeholder {
	color: var(--muted);
	opacity: 1;
}

.admin-auth-section {
	margin: 0.1rem 0;
	display: grid;
	gap: 0.55rem;
}

.admin-auth-fields {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.55rem;
}

#adminUploadBtn {
	margin-top: 0.9rem;
}

.admin-loaded {
	position: sticky;
	top: 0;
}

.admin-catalogue-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.admin-catalogue-item {
	display: flex;
	
	flex-direction: column;
	align-items: stretch;
	gap: 0.45rem;
}

.admin-catalogue-list:has(.admin-catalogue-item + .admin-catalogue-item) .admin-catalogue-item {
	padding: 0.75rem;
	border-radius: 10px;
	background: rgba(4, 10, 24, 0.55);
	border: 1px solid rgba(173, 193, 255, 0.24);
}

.admin-catalogue-name {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #f8fbff;
}

.admin-catalogue-meta {
	margin: 0.35rem 0 0;
	font-size: 0.82rem;
	color: #ffffff;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
}

.admin-catalogue-row {
	display: grid;
	
	grid-template-columns: 10.5rem minmax(0, 1fr);
	gap: 0.5rem;
	align-items: baseline;
}

.admin-catalogue-row dt {
	margin: 0;
	color: rgba(255, 255, 255, 0.62);
	letter-spacing: 0.02em;
}

.admin-catalogue-row dd {
	margin: 0;
	font-weight: 600;
}

.admin-catalogue-delete {
	white-space: nowrap;
}

.admin-catalogue-actions {
	display: flex;
	gap: 0.5rem;
	align-items: center;
}

body.admin-mode .results-card {
	display: none !important;
}

body.admin-mode .profile-card {
	position: static;
	width: 0;
	height: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

body.admin-mode .app-shell {
	width: var(--content-width);
	margin-top: 0;
}

body.admin-mode .admin-panel {
	position: static;
	width: 100%;
	max-width: none;
	margin: clamp(1.5rem, 5vh, 3.5rem) auto 0;
	
	min-height: clamp(240px, 45vh, 520px);
	max-height: none;
	overflow: visible;
}

.add-garage-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.admin-file-row {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex-wrap: wrap;
	font-size: 0.9rem;
	color: var(--muted);
}

.admin-file-label {
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-size: 0.78rem;
}

.admin-summary {
	margin: 0.6rem 0 0;
	display: grid;
	gap: 0.28rem;
}

.admin-summary-row {
	display: grid;
	grid-template-columns: minmax(9rem, 12rem) 1fr;
	gap: 0.6rem;
	align-items: baseline;
}

.admin-summary-row dt {
	margin: 0;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--muted);
}

.admin-summary-row dd {
	margin: 0;
	font-size: 0.94rem;
	color: var(--ink);
	
	overflow-wrap: anywhere;
}

.results-card,
.profile-card,
.shop-empty-box {
	display: none !important;
}

.topbar {
	flex-direction: column;
	align-items: flex-start;
}

.search-icon {
	display: block;
	width: 1.15rem;
	height: 1.15rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

.finder-cart-row {
	align-self: stretch;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	
	flex-wrap: wrap;
	
	gap: 0.6rem 0.9rem;
	
	margin: 2rem 0 1.5rem;
	
	position: relative;
	z-index: 5;
}

.bike-finder-wrap {
	position: relative;
	flex: 0 0 auto;
	margin-left: var(--brand-group-shift);
	
	flex-wrap: wrap;
	row-gap: 0.5rem;
	
	max-width: calc(100% - var(--brand-group-shift));
	
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.site-nav {
	
	align-self: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: baseline;
	gap: 0.35rem 0.8rem;
	
	flex: 0 1 auto;
	margin: 0;
	position: relative;
	z-index: 5;
}

.site-nav-admin {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;
	font: inherit;
	cursor: pointer;
}

.site-nav-admin:hover {
	background: none;
}

.site-nav-link {
	font-family: "Bebas Neue", sans-serif;
	
	font-size: 0.98rem;
	letter-spacing: 0.05em;
	
	color: #fff;
	opacity: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.12s ease, transform 0.14s ease;
}

.site-nav:hover .site-nav-link {
	color: rgba(255, 255, 255, 0.45);
	transform: scale(0.9);
}

.site-nav .site-nav-link:hover,
.site-nav .site-nav-link:focus-visible {
	color: var(--accent);
	transform: scale(1.16);
}

.site-nav-shop {
	font-size: 1.4rem;
	opacity: 1;
	margin-right: 1.4rem;
}

.site-nav-active,
.site-nav:hover .site-nav-active,
.site-nav .site-nav-active:hover {
	color: var(--accent);
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.site-nav:hover .site-nav-active {
	transform: none;
}

.site-nav .site-nav-active:hover {
	transform: scale(1.16);
}

@media (prefers-reduced-motion: reduce) {
	.site-nav-link {
		transition: color 0.12s ease;
	}
}

.glass-box {
	
	position: relative;
	width: 100%;
	
	margin: calc(clamp(1.5rem, 5vh, 3.5rem) - 1.95rem) auto 0;
	min-height: clamp(240px, 45vh, 520px);
	padding: clamp(0.85rem, 1.6vw, 1.2rem);
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	
	background-color: rgba(10, 10, 10, 0.55);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
	
	color: #f4efe6;
}

.admin-inbox {
	position: fixed;
	right: clamp(1rem, 3vw, 2.25rem);
	bottom: clamp(1rem, 3vh, 2rem);
	
	
	z-index: 25;
}

.admin-inbox-bubble {
	position: relative;
}

@keyframes admin-inbox-syke {
	0%   { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4), 0 0 0 0 rgba(242, 106, 27, 0.55); }
	70%  { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4), 0 0 0 1.1rem rgba(242, 106, 27, 0); }
	100% { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4), 0 0 0 0 rgba(242, 106, 27, 0); }
}

.admin-inbox-bubble.admin-inbox-uusia {
	animation: admin-inbox-syke 2s ease-out infinite;
}

.admin-inbox-count {
	position: absolute;
	top: -0.5rem;
	right: -0.5rem;
	min-width: 2rem;
	height: 2rem;
	padding: 0 0.4rem;
	display: grid;
	place-items: center;
	border-radius: 999px;
	border: 2px solid #14110f;
	background: #fff;
	color: var(--accent-deep);
	font-family: "Space Grotesk", sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1;
	
	font-variant-numeric: tabular-nums;
}

.admin-inbox-count[data-tyhja="1"] {
	background: rgba(255, 255, 255, 0.22);
	border-color: rgba(255, 255, 255, 0.3);
	color: #f4efe6;
	opacity: 0.75;
}

.admin-inbox-panel {
	right: 0;
	bottom: calc(100% + var(--bubble-gap));
	max-height: calc(100vh - 10rem);
}

.admin-inbox-list {
	margin: 0.9rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.7rem;
	
	flex: 0 1 auto;
	min-height: 0;
	overflow-y: auto;
}

.admin-inbox-list li {
	padding: 0.65rem 0.75rem;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.05);
}

.admin-inbox-question {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.4;
}

.admin-inbox-meta {
	margin: 0.3rem 0 0;
	font-size: 0.76rem;
	opacity: 0.55;
}

.admin-inbox-question {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.admin-inbox-skus {
	margin: 0.35rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem;
}

.admin-inbox-sku {
	display: inline-block;
	padding: 0.1rem 0.4rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: inherit;
	font-size: 0.72rem;
	font-variant-numeric: tabular-nums;
	text-decoration: none;
}

.admin-inbox-sku:hover,
.admin-inbox-sku:focus-visible {
	border-color: var(--accent);
	color: var(--accent);
}

.admin-inbox-context {
	margin: 0.3rem 0 0;
	font-size: 0.74rem;
	opacity: 0.5;
}

.admin-inbox-mailto {
	color: var(--accent);
	text-decoration: none;
}

.admin-inbox-mailto:hover,
.admin-inbox-mailto:focus-visible {
	text-decoration: underline;
}

.admin-inbox-warn {
	color: var(--accent-soft);
	opacity: 1;
}

.admin-inbox-dismiss {
	float: right;
	margin: -0.2rem -0.3rem 0 0.4rem;
	padding: 0 0.3rem;
	border: 0;
	border-radius: 6px;
	background: none;
	color: inherit;
	font-size: 1.1rem;
	line-height: 1.2;
	opacity: 0.45;
	cursor: pointer;
}

.admin-inbox-dismiss:hover,
.admin-inbox-dismiss:focus-visible {
	background: none;
	opacity: 1;
	color: var(--accent);
}

.admin-catalogue-name {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.admin-catalogue-tool {
	margin-left: auto;
	padding: 0.2rem;
	border: 0;
	border-radius: 8px;
	background: none;
	color: inherit;
	opacity: 0.5;
	cursor: pointer;
	line-height: 0;
}

.admin-catalogue-tool svg {
	width: 1.05rem;
	height: 1.05rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
}

.admin-catalogue-tool:hover,
.admin-catalogue-tool:focus-visible,
.admin-catalogue-tool-on {
	background: none;
	opacity: 1;
	color: var(--accent);
}

.admin-catalogue-connection {
	margin-top: 0.6rem;
	padding-top: 0.6rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.admin-month-returned {
	color: var(--accent-soft);
	font-size: 0.8rem;
}

.admin-order-returned {
	color: var(--accent-soft);
}

.admin-order-supplier {
	font-weight: 700;
}

#printArea {
	position: fixed;
	inset: 0;
	z-index: 120;
	display: grid;
	place-items: center;
	align-content: center;
	gap: 0.8rem;
	padding: 1.5rem;
	overflow-y: auto;
	background: rgba(10, 8, 6, 0.75);
	backdrop-filter: blur(3px);
}

.tuloste-paperi {
	width: min(20cm, 100%);
	max-height: 78vh;
	overflow-y: auto;
	background: #fff;
	color: #111;
	border-radius: 4px;
	box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.5);
}

.tuloste-pdf {
	width: min(20cm, 100%);
	height: 78vh;
	border: 0;
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.5);
}

.tuloste-pdf-apu {
	margin: 0;
	padding: 2rem;
	color: #111;
	text-align: center;
}

.tuloste-napit {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.tuloste-lataa {
	padding: var(--admin-button-padding);
	border: 1px solid currentColor;
	border-radius: 8px;
	font-size: var(--admin-button-size);
	line-height: var(--admin-button-line);
	letter-spacing: 0.04em;
	text-decoration: none;
	color: inherit;
}

.tuloste-lataa:hover,
.tuloste-lataa:focus-visible {
	color: var(--accent);
}

.tuloste-sulje {
	color: #f4efe6;
}

.print-logo {
	margin: 0 0 0.2cm;
	
	font-family: "Bebas Neue", sans-serif;
	font-weight: 400;
	letter-spacing: 0.05em;
	line-height: 1;
	color: #111;
}

.print-otsikko {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1cm;
	margin-bottom: 0.2cm;
}

.print-otsikko .print-logo {
	margin: 0;
}

.print-otsikko h1 {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	font-weight: 400;
	letter-spacing: 0.12em;
	color: #444;
	
	flex: 0 0 var(--print-oikea, 6.5cm);
	text-align: right;
}

.print-label .print-logo {
	font-size: 38pt;
	
	text-align: center;
}

.print-receipt .print-logo {
	font-size: 30pt;
}

.print-label {
	padding: 1.5cm;
	font-family: "Space Grotesk", sans-serif;
}

.print-label-from {
	margin: 0 0 1.2cm;
	font-size: 10pt;
	letter-spacing: 0.08em;
}

.print-label-name {
	margin: 0;
	font-size: 20pt;
	font-weight: 700;
}

.print-label-line {
	margin: 0.15cm 0 0;
	font-size: 16pt;
}

.print-sample-band {
	margin: 0 0 0.5cm;
	padding: 0.2cm 0.3cm;
	border: 2px solid #111;
	font-size: 12pt;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
}

.print-sample-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1cm;
}

.print-sample-product {
	margin: 0;
	font-size: 12pt;
	font-weight: 600;
}

.print-sample-code {
	margin-top: 0.8cm;
	padding-top: 0.4cm;
	border-top: 1px solid #111;
}

.print-barcode {
	display: block;
	max-width: 100%;
	height: auto;
	fill: #000;
}

.print-sample-number {
	margin: 0.15cm 0 0.2cm;
	font-size: 12pt;
	letter-spacing: 0.22em;
	font-variant-numeric: tabular-nums;
}

.admin-order-sample {
	background: none;
	border: 0;
	padding: 0 0.2rem;
	font: inherit;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: inherit;
	opacity: 0.75;
	cursor: pointer;
}

.admin-order-sample:hover {
	opacity: 1;
	color: var(--accent);
}

.print-label-pickup {
	margin: 0.5cm 0 0;
	padding: 0.25cm 0.3cm;
	border: 1px solid #111;
	border-radius: 0.2cm;
	font-size: 13pt;
	line-height: 1.35;
}

.print-label-phone {
	margin: 0.6cm 0 0;
	font-size: 12pt;
}

.print-receipt {
	padding: 1.2cm;
	font-family: "Space Grotesk", sans-serif;
	font-size: 10pt;
	
	--print-oikea: 6.5cm;
}

.print-receipt h1 {
	font-size: 17pt;
}

.print-dim {
	color: #444;
	font-size: 9pt;
	line-height: 1.5;
}

.print-meta {
	display: flex;
	justify-content: space-between;
	align-items: start;
	gap: 1cm;
	margin: 0.8cm 0;
}

.print-meta .print-dim {
	flex: 1 1 auto;
	margin: 0;
}

.print-head {
	margin: 0;
	display: grid;
	
	grid-template-columns: auto auto;
	justify-content: end;
	
	gap: 0 0.6cm;
	
	flex: 0 1 auto;
	min-width: var(--print-oikea, 6.5cm);
	
	font-size: 9pt;
	line-height: 1.5;
}

.print-head div,
.print-totals div {
	display: contents;
}

.print-head dt,
.print-totals dt {
	color: #444;
}

.print-head dd,
.print-totals dd {
	margin: 0;
}

.print-totals dd {
	font-weight: 600;
}

.print-totals dd {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.print-head dd {
	text-align: right;
	white-space: nowrap;
}

.print-lines {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 0.6cm;
}

.print-lines th,
.print-lines td {
	padding: 0.15cm 0.2cm;
	border-bottom: 1px solid #ccc;
	text-align: left;
	vertical-align: top;
}

.print-num,
.print-lines th.print-num,
.print-lines td.print-num {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.print-lines th:last-child,
.print-lines td:last-child {
	padding-right: 0;
}

.print-totals {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.1cm 1cm;
	max-width: 9cm;
	margin-left: auto;
}

.print-totals .print-total {
	display: flex;
	justify-content: space-between;
	grid-column: 1 / -1;
	margin-top: 0.1cm;
	padding-top: 0.15cm;
	border-top: 1px solid #000;
	font-size: 12pt;
	font-weight: 700;
}

@media print {
	
	body.tuloste-auki > *:not(#printArea) {
		display: none !important;
	}

	#printArea {
		position: static;
		display: block;
		padding: 0;
		overflow: visible;
		background: none;
		backdrop-filter: none;
	}

	.tuloste-paperi {
		width: auto;
		max-height: none;
		overflow: visible;
		box-shadow: none;
		border-radius: 0;
	}

	.tuloste-napit {
		display: none;
	}

	
	.tuloste-pdf {
		display: none;
	}

	
	.print-label + .print-receipt {
		break-before: page;
	}
}

.admin-search-new {
	display: inline-block;
	margin-right: 0.4rem;
	padding: 0.1rem 0.4rem;
	border-radius: 4px;
	background: var(--accent);
	color: #10100f;
	font-size: 0.64rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	vertical-align: 0.1em;
}

.admin-order-list li.admin-search-lost {
	border-color: rgba(242, 106, 27, 0.4);
}

.admin-search-term {
	font-weight: 600;
}

.admin-search-bike {
	color: var(--accent);
	font-size: 0.82rem;
}

.admin-search-hits {
	opacity: 0.6;
	font-size: 0.82rem;
	font-variant-numeric: tabular-nums;
}

.admin-search-note {
	opacity: 0.6;
	font-size: 0.8rem;
}

.admin-inbox-foot {
	margin: 0.6rem 0 0;
	font-size: 0.74rem;
	opacity: 0.5;
}

@media (prefers-reduced-motion: reduce) {
	.admin-inbox-bubble.admin-inbox-uusia {
		animation: none;
	}
}

   

.front-product-chat {
	display: none;
}

body.chat-auki .front-product-chat {
	position: absolute;
	top: 0.45rem;
	right: 0.45rem;
	z-index: 2;
	display: flex;
	align-items: center;
	
	gap: 0;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	overflow: hidden;
	border: 0;
	
	border-radius: 50% 50% 6px 50%;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	cursor: pointer;
	transition: background 0.18s ease;
}

.front-product-chat .chat-bubble-lines {
	gap: 0.14rem;
	margin-left: 0.42rem;
}

.front-product-chat .chat-bubble-lines span {
	width: 0.78rem;
	height: 0.13rem;
}

.front-product-chat .chat-bubble-lines span:last-child {
	width: 0.44rem;
}

.front-product-chat-added .chat-bubble-lines {
	display: none;
}

.front-product-chat svg {
	width: 1.05rem;
	height: 1.05rem;
	flex: none;
	margin-left: 0.42rem;
	fill: currentColor;
}

.front-product-chat-cross {
	display: none;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.4;
	stroke-linecap: round;
}

.front-product-chat-added .front-product-chat-cross {
	display: block;
}

body .front-product-chat.front-product-chat-added {
	background: rgba(20, 18, 16, 0.88);
	box-shadow: 0 0 0 1.5px rgba(242, 106, 27, 0.9);
}

.front-product-chat-flash::after {
	content: "Lisätty viestiin";
	position: absolute;
	top: 50%;
	right: calc(100% + 0.4rem);
	transform: translateY(-50%);
	padding: 0.28rem 0.55rem;
	border-radius: 999px;
	background: rgba(20, 18, 16, 0.92);
	color: var(--paper, #f4efe6);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	white-space: nowrap;
	pointer-events: none;
}

.front-product-chat-label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

body.chat-auki .front-product-chat:hover,
body.chat-auki .front-product-chat:focus-visible {
	background: linear-gradient(140deg, var(--accent), var(--accent-mid));
}

@media (prefers-reduced-motion: reduce) {
	.front-product-chat,
	.front-product-chat-label {
		transition: none;
	}
}

@media (max-width: 620px) {
	.front-product-chat {
		position: absolute;
		
		top: 0.85rem;
		right: 0.45rem;
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: center;
		
		width: 2.2rem;
		height: 2.2rem;
		padding: 0;
		border: 0;
		
		border-radius: 50% 50% 6px 50%;
		background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
		color: #fff;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
		cursor: pointer;
	}

	
	.front-product-chat svg {
		width: 1.6rem;
		height: 1.6rem;
		margin-left: 0;
	}

	.front-product-chat .chat-bubble-lines {
		gap: 0.16rem;
		margin-left: 0;
	}

	.front-product-chat .chat-bubble-lines span {
		width: 0.9rem;
		height: 0.15rem;
	}

	.front-product-chat .chat-bubble-lines span:last-child {
		width: 0.5rem;
	}

	
	.front-product-chat.front-product-chat-added {
		width: 2.8rem;
		height: 2.8rem;
	}

	
	.front-product-chat::before {
		content: "";
		position: absolute;
		inset: -0.75rem;
		
		border-radius: 0.35rem;
	}

}

.chat-widget {
	position: fixed;
	right: clamp(1rem, 3vw, 2.25rem);
	bottom: clamp(1rem, 3vh, 2rem);
	
	z-index: 25;
}

.chat-bubble-count {
	position: absolute;
	top: -0.15rem;
	right: -0.15rem;
	display: grid;
	place-items: center;
	min-width: 1.4rem;
	height: 1.4rem;
	padding: 0 0.32rem;
	border-radius: 999px;
	background: var(--accent);
	color: #fff;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.chat-bubble {
	position: relative;
	width: clamp(3.6rem, 6vw, 4.6rem);
	height: clamp(3.6rem, 6vw, 4.6rem);
	padding: 0;
	display: grid;
	place-items: center;
	border: 0;
	
	border-radius: 50% 50% 6px 50%;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4);
	cursor: pointer;
	
	position: relative;
	z-index: 2;
	transition: transform 0.14s ease, box-shadow 0.14s ease;
}

.chat-bubble:hover,
.chat-bubble:focus-visible {
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	transform: scale(1.07);
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.45);
}

.chat-bubble-lines {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.22rem;
}

.chat-bubble-lines span {
	width: 1.35rem;
	height: 0.2rem;
	border-radius: 2px;
	background: #fff;
	opacity: 0.92;
}

.chat-bubble-lines span:last-child {
	width: 0.78rem;
}

.chat-panel {
	position: absolute;
	
	right: 0;
	bottom: calc(100% + var(--bubble-gap));
	
	width: min(33rem, calc(100vw - 2.5rem));
	
	max-height: calc(100vh - clamp(1rem, 3vh, 2rem) - clamp(3.6rem, 6vw, 4.6rem)
	                 - var(--bubble-gap) - 1rem);
	
	display: flex;
	flex-direction: column;
	overflow: hidden;
	
	padding: 1.4rem 1.6rem 1.9rem;
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	background: #14110f;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5);
	color: #f4efe6;
	text-align: left;
	
	z-index: 1;
}

.chat-title,
.chat-presence {
	cursor: move;
	user-select: none;
	-webkit-user-select: none;
}

.chat-panel-dragging {
	user-select: none;
	box-shadow: 0 26px 60px rgba(0, 0, 0, 0.6);
}

.chat-close {
	position: absolute;
	top: 0.5rem;
	right: 0.6rem;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: none;
	color: #f4efe6;
	font-size: 1.3rem;
	line-height: 1;
	opacity: 0.6;
	cursor: pointer;
}

.chat-close:hover,
.chat-close:focus-visible {
	background: none;
	color: var(--accent);
	opacity: 1;
}

.chat-title {
	margin: 0;
	padding-right: 1.6rem;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.75rem;
	letter-spacing: 0.03em;
	line-height: 1.1;
}

.chat-presence {
	margin: 0.15rem 0 0;
	font-size: 0.78rem;
	opacity: 0.55;
}

.chat-lead {
	margin: var(--chat-gap) 0 0;
	font-size: 0.94rem;
	line-height: 1.45;
}

.chat-log {
	display: grid;
	gap: 0.6rem;
	margin-top: var(--chat-gap);
	
	
	flex: 0 1 auto;
	min-height: 3.5rem;
	max-height: 16rem;
	overflow-y: auto;
}

.chat-log:empty {
	display: none;
}

.chat-message {
	justify-self: end;
	max-width: 88%;
	padding: 0.55rem 0.7rem;
	border-radius: 12px 12px 4px 12px;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	font-size: 0.92rem;
	line-height: 1.4;
	overflow-wrap: anywhere;
}

.chat-message-meta {
	background: none;
	border: 1px solid rgba(191, 58, 31, 0.5);
	color: #f4efe6;
	font-size: 0.86rem;
	overflow-wrap: anywhere;
}

.chat-status {
	justify-self: end;
	margin: -0.25rem 0 0;
	font-size: 0.72rem;
	opacity: 0.5;
}

.chat-status-bad {
	justify-self: stretch;
	opacity: 1;
	color: var(--accent-soft);
}

.chat-context {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.55rem;
	padding: var(--chat-gap) 0 0;
}

.chat-chip-label {
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	opacity: 0.6;
	margin-right: 0.3rem;
}

.chat-chip-bike {
	display: inline-flex;
	align-items: center;
	gap: 0.15rem;
	padding: 0.25rem 0.3rem 0.25rem 0.6rem;
	border: 1px solid var(--accent);
	border-radius: 999px;
	background: rgba(242, 106, 27, 0.15);
	font-size: 0.82rem;
}

.chat-chip-remove {
	width: auto;
	height: auto;
	padding: 0 0.35rem;
	border-radius: 999px;
	background: none;
	color: inherit;
	font-size: 1rem;
	line-height: 1;
	opacity: 0.7;
}

.chat-chip-remove:hover {
	opacity: 1;
	background: rgba(242, 106, 27, 0.3);
}

.chat-topics {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.3rem;
	width: 100%;
}

.chat-topic {
	width: auto;
	height: auto;
	padding: 0.22rem 0.6rem;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 999px;
	background: none;
	color: rgba(244, 239, 230, 0.75);
	font-size: 0.78rem;
	font-weight: 500;
}

.chat-topic:hover {
	border-color: var(--accent);
	color: #fff;
}

.chat-topic-on {
	border-color: var(--accent);
	background: var(--accent);
	color: #14100d;
	font-weight: 700;
}

.chat-compose {
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.07);
	padding: 0.4rem;
	display: grid;
	gap: 0.4rem;
	
	flex: 1 1 auto;
	min-height: 5.5rem;
	overflow-y: auto;
}

.chat-compose:focus-within {
	border-color: var(--accent-mid);
}

.chat-form .chat-compose textarea {
	border: 0;
	border-radius: 6px;
	background: none;
	padding: 0.3rem 0.4rem;
}

.chat-form .chat-compose textarea:focus,
.chat-form .chat-compose textarea:focus-visible {
	outline: none;
}

.chat-attachments {
	display: grid;
	gap: 0.4rem;
}

.chat-attachments:empty {
	display: none;
}

.chat-attach-hint {
	margin: 0;
	padding: 0 0.4rem 0.2rem;
	font-size: 0.72rem;
	line-height: 1.35;
	color: rgba(244, 239, 230, 0.55);
}

.chat-compose:has(.chat-attachments:not(:empty)) .chat-attach-hint {
	display: none;
}

.chat-part-text {
	display: block;
	padding: 0.1rem 0.4rem;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	font-size: 0.92rem;
	line-height: 1.4;
}

.chat-attachments:empty {
	display: none;
}

.chat-attachments:not(:empty) {
	padding-top: var(--chat-gap);
}

.chat-product {
	display: flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.35rem 0.4rem 0.35rem 0.35rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.05);
}

.chat-product-link {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex: 1 1 auto;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

.chat-product-image {
	width: 2.6rem;
	height: 2.6rem;
	flex: none;
	border-radius: 8px;
	object-fit: contain;
	background: #fff;
}

.chat-product-image-empty {
	background: rgba(255, 255, 255, 0.12);
}

.chat-product-text {
	display: grid;
	min-width: 0;
}

.chat-product-title {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 0.85rem;
	font-weight: 600;
}

.chat-product-link:hover .chat-product-title {
	text-decoration: underline;
}

.chat-product-sku {
	font-size: 0.75rem;
	opacity: 0.65;
}

.chat-product-remove {
	width: auto;
	height: auto;
	flex: none;
	padding: 0 0.4rem;
	border-radius: 999px;
	background: none;
	color: inherit;
	font-size: 1.05rem;
	line-height: 1;
	opacity: 0.6;
}

.chat-product-remove:hover {
	opacity: 1;
	background: rgba(255, 255, 255, 0.12);
}

.chat-message-text {
	display: block;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.chat-message-products {
	display: grid;
	gap: 0.35rem;
	margin: 0.45rem 0 0;
}

.chat-form {
	margin-top: var(--chat-gap);
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	
	flex: 1 1 auto;
	min-height: 0;
}

.chat-form input[type="email"],
.chat-form .chat-email-note,
.chat-form button[type="submit"] {
	flex: none;
}

.chat-form button[type="submit"] {
	margin-top: 0.3rem;
	justify-self: stretch;
}

.chat-form textarea,
.chat-form input {
	width: 100%;
	padding: 0.7rem 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.07);
	color: #f4efe6;
	font: inherit;
	font-size: 0.92rem;
}

.chat-form textarea {
	
	min-height: 5.5rem;
	resize: none;
}

.chat-form textarea::placeholder,
.chat-form input::placeholder {
	color: rgba(244, 239, 230, 0.45);
}

.chat-form textarea:focus,
.chat-form input:focus {
	outline: 2px solid var(--accent);
	outline-offset: 1px;
}

.chat-email-note {
	margin: -0.2rem 0 0;
	font-size: 0.8rem;
	font-weight: 600;
	color: #ff9a92;
}

.chat-input-bad,
.chat-compose.chat-input-bad,
.bike-finder-select.chat-input-bad {
	border-color: var(--accent) !important;
}

.chat-demo {
	margin: var(--chat-gap) 0 0;
	font-size: 0.76rem;
	opacity: 0.5;
}

@media (prefers-reduced-motion: reduce) {
	.chat-bubble {
		transition: none;
	}
}

.glass-box.glass-box-home {
	min-height: clamp(320px, 56vh, 620px);
}

.front-category {
	display: block;
	color: inherit;
	text-decoration: none;
	
	transition: color 0.12s ease, transform 0.14s ease;
	margin: 0;
	
	
	padding: 0.15rem 0.4rem;
	font-family: "Bebas Neue", sans-serif;
	line-height: 1;
	text-align: center;
}

.front-category-lead {
	font-size: clamp(1.45rem, 2.7vw, 2rem);
	font-weight: 600;
}

.front-category-big {
	font-size: clamp(1.26rem, 2.2vw, 1.7rem);
}

.front-category-small {
	font-size: clamp(1rem, 1.5vw, 1.18rem);
	opacity: 0.8;
}

.front-category-item:hover .front-category-small {
	opacity: 1;
}

.front-category-item {
	position: relative;
	text-align: center;
}

.front-menu:hover .front-category {
	color: rgba(244, 239, 230, 0.28);
	transform: scale(0.86);
}

.front-category-item:hover .front-category {
	color: var(--accent);
	text-decoration: none;
	transform: scale(1.08);
}

.front-category-active,
.front-menu:hover .front-category-active,
.front-category-item:hover .front-category-active {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.28em;
}

.front-category-active .front-category-count {
	display: inline-block;
	text-decoration: none;
}

.front-menu:hover .front-category-active {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.front-category {
		transition: color 0.12s ease;
	}
}

.front-category,
.front-category:hover,
.front-category:active {
	-webkit-tap-highlight-color: transparent;
}

.front-subcategories {
	display: none;
	position: absolute;
	top: 100%;
	
	left: 50%;
	right: auto;
	transform: translateX(calc(-50% + var(--siirto, 0px)));
	
	width: max-content;
	
	margin: 0.45rem 0 0;
	padding: 0.55rem 0.7rem;
	background: #000;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 12px;
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.55);
	list-style: none;
	white-space: nowrap;
	
	overflow-y: auto;
	overscroll-behavior: contain;
	z-index: 4;
}

.front-subcategories::before {
	content: "";
	position: absolute;
	
	left: -1.5rem;
	right: -1.5rem;
	top: -0.75rem;
	height: 0.75rem;
}

.front-category-item:hover .front-subcategories,
.front-category-open .front-subcategories {
	display: grid;
	
	justify-items: start;
	
	gap: 0.2rem 1.8rem;
}

.front-subcategories li {
	font-size: 0.95rem;
	
	line-height: 1.35;
}

.front-subcategories-lead li {
	font-size: 1.08rem;
	line-height: 1.45;
}

.front-subcategories-lead .front-subcategory-big {
	font-size: 1.2rem;
}

.front-subcategories-lead .front-subcategory-small {
	font-size: 1.04rem;
	opacity: 0.85;
}

.front-subcategory-big {
	font-size: 1.06rem;
	font-weight: 600;
}

.front-subcategory-small {
	font-size: 0.92rem;
	opacity: 0.78;
}

.front-subcategory-small:hover,
.front-subcategory-small:focus-visible {
	opacity: 1;
}

.front-subcategory-link {
	display: block;
	
	padding: 0 0.4rem;
	color: rgba(244, 239, 230, 0.85);
	text-decoration: none;
	cursor: pointer;
}

.front-subcategory-link:hover,
.front-subcategory-link:focus-visible {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.front-breadcrumb {
	justify-self: start;
	margin-top: 0.2rem;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.03em;
	font-size: clamp(1rem, 2.2vw, 1.4rem);
}

.front-breadcrumb-link {
	color: rgba(244, 239, 230, 0.85);
	text-decoration: none;
}

.front-breadcrumb-link:hover,
.front-breadcrumb-link:focus-visible {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.front-breadcrumb-sep {
	opacity: 0.45;
}

.front-subcategory-page {
	justify-self: start;
	margin: 0.9rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.35rem;
	font-size: 0.95rem;
}

.front-category:focus,
.front-subcategory-link:focus,
.front-breadcrumb-link:focus {
	outline: none;
}

.front-category:focus-visible,
.front-subcategory-link:focus-visible,
.front-breadcrumb-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
	border-radius: 4px;
}

.front-title {
	justify-self: start;
	margin: 0.45rem 0 0;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.04em;
	font-size: clamp(1.4rem, 3vw, 2rem);
	line-height: 1;
}

.front-products {
	justify-self: stretch;
	width: 100%;
	margin-top: 1.2rem;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1.1rem;
}

.front-product {
	
	position: relative;
	display: flex;
	flex-direction: column;
	
	height: 100%;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.06);
	overflow: hidden;
}

.front-product-oos {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0.25rem 0.4rem;
	background: rgba(179, 38, 30, 0.92);
	color: #fff;
	font-family: "Bebas Neue", sans-serif;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-align: center;
	pointer-events: none;
}

.front-product-image:has(.front-product-oos) img {
	opacity: 0.55;
}

.front-product-body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.6rem 0.7rem 0.7rem;
}

.front-product-image {
	aspect-ratio: 1 / 1;
	display: grid;
	place-items: center;
	padding: 0.6rem;
	background: #fffdf8;
	
	position: relative;
	overflow: hidden;
}

.front-product-image img {
	display: block;
	
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.front-image-trimmed {
	position: absolute;
	max-width: none;
	max-height: none;
	object-fit: fill;
}

.front-product-title {
	margin: 0;
	font-size: 1rem;
	line-height: 1.3;
	min-height: 2.34em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.front-product-meta {
	margin: 0;
	font-size: 0.92rem;
	opacity: 0.65;
}

.front-product-link {
	color: inherit;
	text-decoration: none;
}

.front-product-link:hover,
.front-product-link:focus-visible {
	color: var(--accent);
}

.front-detail {
	justify-self: stretch;
	width: 100%;
	margin: 0.8rem 0 0;
	display: grid;
	
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: clamp(1rem, 2.5vw, 2rem);
	align-items: start;
}

.front-detail-image {
	aspect-ratio: 1 / 1;
	display: grid;
	place-items: center;
	padding: 0.8rem;
	border-radius: 12px;
	background: #fffdf8;
	position: relative;
	overflow: hidden;
}

.front-detail-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.front-detail-body {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
	align-items: flex-start;
}

.front-detail-title {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(1.4rem, 2.6vw, 2rem);
	line-height: 1.1;
	letter-spacing: 0.02em;
}

.front-detail-facts {
	margin: 0;
	display: grid;
	
	grid-template-columns: auto 1fr;
	gap: 0.25rem 1rem;
	font-size: 0.96rem;
}

.front-detail-facts dt {
	opacity: 0.6;
}

.front-detail-facts dd {
	margin: 0;
	font-variant-numeric: tabular-nums;
}

.front-detail-oos {
	color: #ff6b61;
}

.front-detail-price {
	margin: 0;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.6rem;
	letter-spacing: 0.03em;
	color: var(--accent);
}

.front-site-back {
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.05rem;
	letter-spacing: 0.04em;
}

.front-detail-block {
	justify-self: stretch;
	width: 100%;
	margin: 1.4rem 0 0;
}

.front-detail-heading {
	margin: 0 0 0.5rem;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.1rem;
	letter-spacing: 0.08em;
	opacity: 0.7;
}

.front-detail-lang {
	font-size: 0.85em;
	opacity: 0.7;
}

.front-detail-lead {
	margin: 0 0 0.7rem;
	font-size: 1.05rem;
	line-height: 1.45;
	color: var(--accent-pale);
}

.front-detail-text {
	margin: 0;
	
	max-width: 68ch;
	line-height: 1.6;
	white-space: pre-line;
}

.front-fit-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 0.3rem 1.5rem;
	font-size: 0.9rem;
}

.front-fit-list li {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.2rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	
	min-width: 0;
}

.front-fit-family {
	min-width: 0;
}

.front-fit-years {
	opacity: 0.7;
	font-variant-numeric: tabular-nums;
	
	white-space: nowrap;
}

.front-fit-note {
	white-space: normal;
	text-align: right;
	min-width: 0;
}

.front-product-price {
	
	margin: auto 0 0;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.04em;
	font-size: 1.15rem;
	color: var(--accent);
}

.front-empty-also {
	display: block;
	margin-top: 0.7rem;
	font-size: 0.95rem;
}

.front-empty-link {
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.1rem;
	letter-spacing: 0.04em;
	text-decoration: underline;
	text-underline-offset: 0.25em;
	white-space: nowrap;
}

.front-empty-link:hover,
.front-empty-link:focus-visible {
	color: var(--accent-mid);
}

.front-empty {
	justify-self: start;
	margin: 1rem 0 0;
	opacity: 0.7;
	
	grid-column: 1 / -1;
	max-width: 52rem;
}

.front-filters {
	justify-self: start;
	margin: 0.5rem 0 0;
	font-size: 0.96rem;
	opacity: 0.8;
}

.front-bulk-row {
	justify-self: stretch;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	gap: 0.5rem;
	min-height: 0;
}

.front-bulk-row:empty {
	display: none;
}

.front-bulk-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.1rem;
	height: 2.1rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(4, 10, 24, 0.78);
	color: #fff;
	cursor: pointer;
}

.front-bulk-btn:hover,
.front-bulk-btn:focus-visible {
	background: var(--accent);
}

.front-bulk-btn[disabled] {
	opacity: 0.35;
	cursor: default;
}

.front-bulk-btn[disabled]:hover,
.front-bulk-btn[disabled]:focus-visible {
	background: rgba(4, 10, 24, 0.78);
}

.front-bulk-btn svg {
	width: 1.2rem;
	height: 1.2rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.front-count-row {
	justify-self: stretch;
	width: 100%;
	margin: 0.6rem 0 0;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.front-count {
	justify-self: start;
	margin: 0;
	font-size: 0.96rem;
	opacity: 0.65;
}

.front-count-row .front-sort {
	margin-left: auto;
}

.front-more {
	justify-self: center;
	margin-top: 1.1rem;
}

.front-more-btn {
	font-size: 0.9rem;
	padding: 0.6rem 2.4rem;
}

.front-more-btn[disabled] {
	opacity: 0.5;
	cursor: default;
}

.front-cart-btn {
	margin-top: 0.5rem;
	width: 100%;
	font-size: 0.94rem;
	padding: 0.5rem 0.6rem;
	letter-spacing: 0.02em;
}

.front-head {
	justify-self: stretch;
	width: 100%;
	margin: 0.45rem 0 0;
	display: flex;
	align-items: baseline;
	gap: 1.5rem;
	flex-wrap: wrap;
	
	min-width: 0;
}

.front-head .front-title {
	margin: 0;
	flex: 0 0 auto;
}

.front-head-right {
	flex: 0 0 clamp(300px, 56%, 760px);
	margin-left: auto;
	display: grid;
	gap: 0.35rem;
	min-width: 0;
}

.front-sort {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.2rem 1rem;
}

.front-sort-link {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.05rem;
	letter-spacing: 0.03em;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}

.front-sort-link:hover,
.front-sort-link:focus-visible {
	color: var(--accent);
}

.front-filter {
	display: flex;
	align-items: baseline;
	gap: 0.8rem;
	min-width: 0;
}

.front-filter-label {
	flex: 0 0 auto;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.2rem;
	letter-spacing: 0.08em;
	opacity: 0.6;
}

.front-model-rows {
	display: grid;
	gap: 0.3rem;
	min-width: 0;
}

.front-model-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.2rem 0.9rem;
	min-width: 0;
}

.front-model-row-big .front-model {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.4rem;
	letter-spacing: 0.03em;
}

.front-model-row-small .front-model {
	font-size: 0.92rem;
	opacity: 0.75;
}

.front-model {
	color: var(--accent-pale);
	text-decoration: none;
	white-space: nowrap;
	max-width: 100%;
}

.front-model-out {
	color: rgba(244, 239, 230, 0.5);
}

.front-model:hover,
.front-model:focus-visible {
	color: var(--accent);
}

.front-model-active {
	color: var(--accent);
	text-decoration: underline;
	text-underline-offset: 0.22em;
}

.front-model-only {
	cursor: default;
}

.front-filter-match {
	color: var(--accent);
}

.front-model.front-model-other {
	margin-left: 1.4rem;
}

.front-model-count {
	margin-left: 0.28rem;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.78em;
	opacity: 0.55;
}

.front-filter-gap {
	display: inline-block;
	width: 1.4rem;
}

.front-model-row-big .front-year {
	font-family: "Space Grotesk", sans-serif;
	font-size: 1rem;
	letter-spacing: 0;
	opacity: 0.8;
}

.front-model-row-big .front-year.front-model-active {
	opacity: 1;
}

.front-menu {
	justify-self: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
	
	gap: 0.4rem 2.6rem;
}

.front-category-count {
	margin-left: 0.4rem;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.38em;
	font-weight: 500;
	letter-spacing: 0;
	opacity: 0.5;
}

.front-title-count {
	margin-left: 0.5rem;
	font-size: 0.55em;
	font-weight: 400;
	opacity: 0.55;
	font-variant-numeric: tabular-nums;
}

.front-subcategory-link.front-subcategory-empty {
	opacity: 0.45;
}

.front-subcategory-count {
	margin-left: 0.4rem;
	font-size: 0.72em;
	opacity: 0.5;
}

.brand-row {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.9rem;
	flex-wrap: wrap;
	
	min-height: 3.4rem;
	align-items: stretch;
	padding-bottom: 0;
}

.brand-row:has(.brand-wordmark-admin) {
	min-height: clamp(3.8rem, 7vw, 5rem);
}

.brand-logo {
	position: absolute;
	top: 0.6rem;
	left: calc(50% - 50vw + 0.5rem);
	z-index: -1;
	display: block;
	width: auto;
	height: clamp(9.5rem, 17vw, 14.5rem);
	
	opacity: 0.55;
	
	pointer-events: auto;
}

@media (max-width: 52rem) {
	.brand-logo {
		top: -0.2rem;
		height: 4.4rem;
		opacity: 0.5;
	}

	
	:root {
		--brand-group-shift: 0rem;
	}
}

.brand-home-link {
	color: inherit;
	text-decoration: none;
}

.brand-home-link:hover,
.brand-home-link:focus-visible {
	color: var(--accent);
}

.brand-wordmark {
	
	
	position: absolute;
	left: var(--brand-group-shift);
	bottom: 0;
	margin: 0;
	width: min(460px, 100%);
	
	text-align: left;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(244, 239, 230, 0.55);
}

.brand-wordmark-admin {
	font-size: clamp(2.6rem, 6vw, 4.2rem);
	letter-spacing: 0.04em;
	color: var(--accent);
	line-height: 1;
}

.brand-count {
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	color: rgba(244, 239, 230, 0.32);
	
	margin-left: 1.6rem;
	text-transform: none;
}

@media (max-width: 52rem) {
	.brand-wordmark {
		
		text-align: right;
		font-size: 1.45rem;
		letter-spacing: 0.1em;
		color: var(--accent);
	}

	
	.brand-count {
		margin-left: 0.9rem;
		color: rgba(244, 239, 230, 0.4);
	}
}

.front-extra-row {
	align-items: baseline;
	
	gap: 0.15rem 1.5rem;
	margin-top: 0.45rem;
}

.front-year-extra {
	font-size: 0.82em;
}

.front-year-pick {
	display: inline-flex;
	align-items: baseline;
	gap: 0.5rem;
	margin-left: 1.6rem;
}

.front-year-select {
	appearance: none;
	
	field-sizing: content;
	min-width: 6.5rem;
	font: inherit;
	font-size: 1.05rem;
	padding: 0.3rem 2.1rem 0.3rem 0.7rem;
	border: 1px solid rgba(244, 239, 230, 0.35);
	border-radius: 4px;
	background-color: transparent;
	background-image:
		linear-gradient(45deg, transparent 50%, currentColor 50%),
		linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: right 1.05rem center, right 0.75rem center;
	background-size: 0.32rem 0.32rem, 0.32rem 0.32rem;
	background-repeat: no-repeat;
	color: inherit;
	cursor: pointer;
}

.front-year-select:hover {
	border-color: var(--accent);
	color: var(--accent);
}

.front-year-select:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

.front-year-select option {
	background: #1b1b1b;
	color: #f4efe6;
}

.front-year-note {
	font-size: 0.85rem;
	opacity: 0.6;
}

.front-year-static,
.front-year-static:hover {
	color: rgba(244, 239, 230, 0.7);
	cursor: default;
}

.front-year-static.front-filter-match,
.front-year-static.front-filter-match:hover {
	color: var(--accent);
}

.seo-page {
	padding: 1.5rem 0;
	max-width: 44rem;
}

.seo-page h1 {
	margin: 0 0 0.5rem;
	font-size: clamp(1.4rem, 3vw, 2rem);
}

.seo-breadcrumb {
	font-size: 0.85rem;
	opacity: 0.7;
	margin-bottom: 0.8rem;
}

.seo-code,
.seo-price {
	margin: 0.2rem 0;
	font-variant-numeric: tabular-nums;
}

.seo-price {
	font-weight: 700;
}

.seo-oma {
	margin: 0.6rem 0;
	line-height: 1.5;
}

.seo-text {
	margin: 0.8rem 0;
	line-height: 1.6;
	opacity: 0.85;
}

.seo-list {
	margin: 0.8rem 0;
	padding-left: 1.1rem;
	line-height: 1.8;
}

.cart-link {
	
	margin: 0 0 0 auto;
	
	position: relative;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.4rem 1rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.28);
	color: #fff;
	text-decoration: none;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.04em;
	font-size: 1.25rem;
}

.front-cart-btn-added {
	background: linear-gradient(140deg, #3f9c46, #2b6e31) !important;
}

@keyframes cart-pulse {
	0%   { transform: scale(1); }
	35%  { transform: scale(1.18); }
	100% { transform: scale(1); }
}

.cart-link-pulse {
	animation: cart-pulse 420ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.cart-link-pulse {
		animation: none;
	}
}

.cart-link-empty {
	opacity: 0.55;
}

.cart-link-empty:hover,
.cart-link-empty:focus-visible {
	opacity: 1;
}

.cart-link:hover,
.cart-link:focus-visible {
	border-color: #fff;
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}

.cart-icon {
	width: 1.35rem;
	height: 1.35rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.cart-rows {
	justify-self: stretch;
	width: 100%;
	margin-top: 1rem;
	display: grid;
	gap: 0.6rem;
}

.cart-brand {
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--accent);
}

.cart-row {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) auto auto auto;
	align-items: center;
	gap: 0.9rem;
	padding: 0.6rem;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.05);
}

.cart-image {
	display: block;
	text-decoration: none;
	width: 64px;
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	background: #fffdf8;
	overflow: hidden;
	
	position: relative;
}

.cart-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.cart-title {
	display: block;
	margin: 0;
	font-size: 0.92rem;
	color: inherit;
	text-decoration: none;
}

.cart-title:hover,
.cart-title:focus-visible {
	color: var(--accent-soft);
}

.cart-meta {
	margin: 0.15rem 0 0;
	font-size: 0.92rem;
	opacity: 0.6;
}

.cart-qty {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.cart-step {
	width: 1.7rem;
	height: 1.7rem;
	padding: 0;
	border-radius: 999px;
	font-size: 1rem;
	line-height: 1;
}

.cart-qty-value {
	min-width: 1.6rem;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.cart-line {
	margin: 0;
	min-width: 6rem;
	text-align: right;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.03em;
	color: #fff;
	font-variant-numeric: tabular-nums;
}

.cart-remove {
	background: none;
	border: 0;
	padding: 0.2rem 0.4rem;
	color: rgba(244, 239, 230, 0.5);
	font-size: 1.2rem;
	line-height: 1;
	cursor: pointer;
}

.cart-remove:hover {
	color: var(--accent);
}

.cart-total {
	justify-self: stretch;
	width: 100%;
	margin-top: 1rem;
	padding-top: 0.9rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(1.2rem, 2.4vw, 1.7rem);
	letter-spacing: 0.03em;
}

.cart-total strong {
	color: #fff;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
}

.cart-missing {
	justify-self: start;
	margin: 0.5rem 0 0;
	font-size: 0.94rem;
	opacity: 0.6;
}

.cart-actions {
	justify-self: stretch;
	width: 100%;
	margin-top: 1rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 0.8rem;
}

.cart-actions button {
	padding: 0.72rem 2.4rem;
}

.front-suppliers {
	position: absolute;
	top: 0.55rem;
	right: 0.75rem;
	z-index: 3;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.3rem;
}

.front-supplier {
	padding: 0.2rem 0.55rem;
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: 999px;
	background: rgba(10, 10, 10, 0.45);
	color: rgba(244, 239, 230, 0.8);
	font-family: "Bebas Neue", sans-serif;
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	line-height: 1.5;
	cursor: pointer;
	width: auto;
	height: auto;
}

.front-supplier:hover:not(:disabled) {
	border-color: var(--accent);
	color: #fff;
}

.front-supplier-on {
	border-color: var(--accent);
	background: var(--accent);
	color: #14100d;
	font-weight: 700;
}

.front-suppliers:not(.hidden) ~ .front-panel {
	padding-top: 1.6rem;
}

.front-panel {
	display: grid;
	
	place-items: start center;
	align-content: start;
	gap: 0.6rem;
}

.glass-box-home .front-panel {
	min-height: clamp(280px, 50vh, 560px);
	align-content: space-between;
}

@media (max-width: 900px) {
	.glass-box-home .front-panel {
		min-height: 960px;
	}
}

@media (max-width: 380px) {
	.glass-box-home .front-panel {
		min-height: 1090px;
	}
}

.front-others-link {
	color: var(--accent);
}

.front-chapter-list {
	justify-self: stretch;
	width: 100%;
	margin: 0.8rem 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.6rem;
}

.front-promo-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: 0.5rem 0.9rem;
}

.front-promo {
	margin: 0;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	
	font-size: clamp(1rem, 1.5vw, 1.25rem);
	letter-spacing: 0.05em;
	text-align: center;
}

.front-promo-sep {
	color: var(--accent);
	opacity: 0.45;
}

#cartView .front-title {
	color: #fff;
}

.search-row {
	width: 100%;
	
	pointer-events: none;
	padding-left: var(--brand-group-shift);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
	
	margin-top: clamp(0.6rem, 1.2vh, 1rem);
}

.front-also {
	margin-top: 0.15rem;
}

.front-also-label {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1rem;
	letter-spacing: 0.06em;
	opacity: 0.5;
}

.front-also-link {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.05rem;
	letter-spacing: 0.03em;
}

.front-also-search {
	justify-self: start;
	margin: 0.4rem 0 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.2rem 1rem;
}

.front-year-row {
	margin-top: 0.2rem;
}

.cart-checkout {
	display: inline-flex;
	align-items: center;
	
	justify-content: center;
	border-radius: 999px;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 0.72rem 1.4rem;
	text-decoration: none;
}

.story {
	width: 100%;
	max-width: 46rem;
	
	justify-self: center;
	
	min-width: 0;
}

.story-lead .front-detail-text {
	font-size: 1.12rem;
	line-height: 1.65;
}

.story-part {
	margin-top: 2rem;
}

.story > .story-part:first-child {
	margin-top: 0;
}

.story > .story-part:first-child > .front-terms-title {
	margin-top: 0;
}

.story .front-detail-text + .front-detail-text {
	margin-top: 0.7rem;
}

.story-link-chat {
	appearance: none;
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
}

.story-link-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: linear-gradient(140deg, var(--accent-mid), var(--accent-deep));
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 0.72rem 1.4rem;
	border: 0;
	font-family: inherit;
	font-size: inherit;
	cursor: pointer;
}

.story-links {
	margin: 0.9rem 0 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem 0.7rem;
}

.story-link-note {
	font-size: 0.82rem;
	opacity: 0.7;
}

.story-link-sep {
	opacity: 0.4;
}

.story-table-wrap {
	margin: 0.9rem 0 1.1rem;
	overflow-x: auto;
}

.story-table {
	border-collapse: collapse;
	width: 100%;
}

.story-table th,
.story-table td {
	padding: 0.45rem 1.1rem 0.45rem 0;
	text-align: left;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	white-space: nowrap;
}

.story-table-compact {
	width: auto;
	margin-inline: auto;
}

.story-table td {
	text-align: right;
}

.story-table th:last-child,
.story-table td:last-child {
	padding-right: 0;
}

.story-table td {
	font-variant-numeric: tabular-nums;
}

.story-table thead th:not(:first-child) {
	text-align: right;
}

.story-table thead th {
	color: rgba(244, 239, 230, 0.7);
	font-weight: 500;
	font-size: 0.85rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.story-table tbody th {
	font-weight: 600;
	color: inherit;
}

.story-quote {
	margin: 2.6rem 0;
	max-width: 40rem;
	font-size: 1.22rem;
	line-height: 1.5;
}

.checkout-pickup-list {
	display: grid;
	gap: 0.5rem;
	margin-top: 0.7rem;
}

.checkout-pickup-option {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: baseline;
	
	gap: 0.05rem 0.4rem;
	padding: 0.55rem 0.7rem;
	background: rgba(255, 255, 255, 0.92);
	color: var(--ink);
	border: 1px solid rgba(24, 21, 17, 0.18);
	border-radius: 12px;
	cursor: pointer;
}

.checkout-pickup-option:hover {
	border-color: rgba(24, 21, 17, 0.4);
}

.checkout-pickup-more {
	justify-self: start;
	margin-top: 0.1rem;
	padding: 0.35rem 0;
	background: none;
	border: 0;
	color: inherit;
	font: inherit;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 0.25em;
	cursor: pointer;
}

.checkout-pickup-option input[type="radio"] {
	width: auto;
	grid-column: 1;
	grid-row: 1;
	margin: 0;
	accent-color: var(--accent);
}

.checkout-pickup-option > span {
	grid-column: 2;
	min-width: 0;
}

.checkout-pickup-address,
.checkout-pickup-hours {
	font-size: 0.85rem;
	opacity: 0.7;
}

.checkout-pickup-name {
	font-weight: 600;
}

.checkout-demo {
	margin: 0.6rem 0 1.8rem;
	padding: 1.2rem 1.1rem;
	border-left: 2px solid var(--accent);
	background: rgba(242, 106, 27, 0.12);
	font-size: 0.9rem;
	line-height: 1.5;
}

#checkoutView,
#cartView,
.checkout-thanks {
	justify-self: stretch;
	width: 100%;
	
	padding-bottom: var(--action-space);
}

#cartView {
	max-width: 48rem;
	margin-inline: auto;
}

.checkout-thanks {
	margin-inline: auto;
}

#checkoutView .front-title,
.checkout-demo {
	max-width: 55.4rem;
	margin-inline: auto;
}

#checkoutSubmit {
	display: block;
	margin: 1.6rem auto 0;
	min-width: 16rem;
	padding: 0.85rem 1.6rem;
	letter-spacing: 0.05em;
}

#returnView {
	justify-self: stretch;
	width: 100%;
	max-width: 44rem;
	margin-inline: auto;
	padding-bottom: var(--action-space);
}

.return-form {
	margin-top: 1.1rem;
}

.return-order {
	margin: 1.2rem 0 0;
	padding: 0.9rem 1.1rem;
	border-left: 3px solid var(--accent);
	background: rgba(242, 106, 27, 0.1);
	border-radius: 0 10px 10px 0;
}

.return-order-head {
	margin: 0 0 0.3rem;
	font-weight: 700;
}

.return-window-ok,
.return-window-late {
	margin: 0;
	font-size: 0.9rem;
	line-height: 1.45;
}

.return-window-late {
	color: rgba(244, 239, 230, 0.85);
}

.return-lines {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

.return-line {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.9rem;
	padding: 0.6rem 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 10px;
}

.return-line-done {
	opacity: 0.5;
}

.return-line-pick {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-areas: "box title" "box meta";
	align-items: center;
	gap: 0 0.7rem;
	flex: 1 1 16rem;
	cursor: pointer;
}

.return-line-pick input {
	grid-area: box;
	appearance: auto;
	width: auto;
	height: auto;
}

.return-line-title {
	grid-area: title;
	font-weight: 600;
}

.return-line-meta {
	grid-area: meta;
	font-size: 0.82rem;
	opacity: 0.7;
}

.return-line-qty {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.82rem;
}

.return-line-qty input {
	width: 4rem;
	height: 2.2rem;
	padding: 0 0.5rem;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.95);
	color: #14100d;
	font: inherit;
}

.return-all-done {
	margin: 0 0 0.7rem;
	padding: 0.55rem 0.7rem;
	border-radius: 10px;
	border: 1px solid rgba(242, 106, 27, 0.35);
	background: rgba(242, 106, 27, 0.12);
	font-size: 0.86rem;
}

.return-receipt {
	margin: 0.6rem 0 0.9rem;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.3rem;
	font-size: 0.9rem;
}

.return-receipt-code {
	opacity: 0.55;
	font-variant-numeric: tabular-nums;
}

.return-line-flag {
	font-size: 0.78rem;
	font-style: italic;
}

.return-message textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.6rem 0.7rem;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.95);
	color: #14100d;
	font: inherit;
	resize: none;
}

#returnSubmit,
#returnLookupBtn {
	display: block;
	margin: 1.4rem auto 0;
	min-width: 14rem;
	padding: 0.8rem 1.5rem;
	letter-spacing: 0.05em;
}

.checkout-grid {
	
	margin-top: 3.6rem;
	display: grid;
	
	grid-template-columns: minmax(0, 34rem) minmax(0, 20rem);
	justify-content: center;
	gap: 1.4rem;
	align-items: start;
}

.checkout-grid > .checkout-form {
	margin-top: -0.5rem;
}

.checkout-block {
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 12px;
	padding: 1rem 1.1rem 1.2rem;
	margin: 0 0 1.1rem;
}

.checkout-block legend {
	padding: 0 0.4rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--accent);
}

.checkout-buyer-type {
	display: flex;
	gap: 1.4rem;
	margin-bottom: 1rem;
	font-size: 0.92rem;
}

.checkout-buyer-type label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	cursor: pointer;
	white-space: nowrap;
}

.checkout-buyer-type input[type="radio"],
.checkout-method input[type="radio"] {
	appearance: auto;
	-webkit-appearance: radio;
	
	width: auto;
	height: auto;
	flex: none;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	accent-color: var(--accent);
	cursor: pointer;
}

.checkout-fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.8rem 1rem;
}

@media (max-width: 620px) {
	.checkout-fields {
		grid-template-columns: minmax(0, 1fr);
	}

	
	.front-model {
		white-space: normal;
	}

	
	.story-table th {
		white-space: normal;
	}

	
	.story-table th,
	.story-table td {
		padding-right: 0.6rem;
	}
}

.checkout-field-wide {
	grid-column: 1 / -1;
}

.checkout-field span {
	display: block;
	font-size: 0.8rem;
	opacity: 0.75;
	margin-bottom: 0.25rem;
}

.checkout-field input {
	width: 100%;
	box-sizing: border-box;
	height: 2.5rem;
	padding: 0 0.7rem;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.95);
	color: var(--ink);
	font: inherit;
	font-size: 0.95rem;
}

.checkout-methods {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.checkout-method {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	
	grid-template-areas: "radio name" "radio text" "radio note";
	gap: 0 0.7rem;
	align-items: center;
	padding: 0.7rem 0.9rem;
	
	background: rgba(255, 255, 255, 0.92);
	color: var(--ink);
	border: 1px solid rgba(24, 21, 17, 0.18);
	border-radius: 10px;
	cursor: pointer;
}

.checkout-method:hover {
	border-color: rgba(24, 21, 17, 0.4);
}

.checkout-method:has(input:checked) {
	border-color: var(--accent);
	background: #fdeadb;
}

.checkout-method-off {
	opacity: 0.5;
	cursor: default;
}

.checkout-method-off:hover {
	border-color: rgba(24, 21, 17, 0.18);
}

.checkout-method-note {
	grid-area: note;
	margin-top: 0.25rem;
	font-size: 0.78rem;
	font-style: italic;
	color: rgba(24, 21, 17, 0.75);
}

.delivery-choice .checkout-method {
	grid-template-columns: auto minmax(0, 1fr) auto;
	grid-template-areas: "radio name price" "radio text price" "radio note price";
}

.delivery-price {
	grid-area: price;
	align-self: center;
	padding-left: 0.8rem;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.03em;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.delivery-address {
	font-style: normal;
	line-height: 1.45;
}

.delivery-choice-dark {
	
	max-width: 31rem;
	margin-inline-start: auto;
	margin-inline-end: 0;
}

.cart-rows + .delivery-choice,
.cart-missing + .delivery-choice {
	margin-block: 1.4rem 0.4rem;
}

.delivery-choice-dark .checkout-method {
	padding: 0.6rem 0.8rem;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 12px;
	color: inherit;
}

.delivery-choice-dark .checkout-method:hover {
	border-color: rgba(255, 255, 255, 0.3);
}

.delivery-choice-dark .checkout-method:has(input:checked) {
	border-color: var(--accent);
	background: rgba(242, 106, 27, 0.14);
}

.delivery-choice-dark .checkout-method-note {
	color: rgba(255, 255, 255, 0.72);
}

.checkout-retry {
	margin: 0.6rem 0 0;
	font-size: 0.95rem;
	line-height: 1.5;
}

.checkout-pickup-note {
	margin: 1rem 0 0;
	padding: 0.7rem 0.9rem;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px;
	font-size: 0.9rem;
	line-height: 1.5;
}

.checkout-method input {
	grid-area: radio;
	width: auto;
	accent-color: var(--accent);
}

.checkout-method-name {
	grid-area: name;
	font-weight: 700;
	font-size: 0.95rem;
}

.checkout-method-text {
	grid-area: text;
	font-size: 0.82rem;
	opacity: 0.7;
}

.checkout-error {
	margin: 0 0 0.9rem;
	color: #ff8a7a;
	font-weight: 700;
	font-size: 0.9rem;
}

.checkout-summary {
	border: 1px solid var(--accent);
	border-radius: 12px;
	padding: 1.1rem 1.2rem;
	background: rgba(242, 106, 27, 0.1);
	box-shadow: 0 0 0 3px rgba(242, 106, 27, 0.12);
}

.checkout-summary .checkout-lines li {
	border-bottom-color: rgba(242, 106, 27, 0.35);
}

.checkout-summary 
.checkout-min-order {
	margin: 0.6rem 0 0;
	padding: 0.6rem 0.8rem;
	border: 1px solid rgba(242, 106, 27, 0.45);
	border-radius: 8px;
	background: rgba(242, 106, 27, 0.08);
	font-size: 0.86rem;
	line-height: 1.4;
}

.checkout-total-row {
	border-top-color: var(--accent);
	color: #fff;
}

.checkout-lines {
	list-style: none;
	margin: 0.7rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
}

.checkout-lines li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "title sum" "meta sum";
	gap: 0 0.6rem;
	padding-bottom: 0.7rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.checkout-line-title {
	grid-area: title;
	font-size: 0.88rem;
	line-height: 1.3;
	color: inherit;
	text-decoration: none;
}

.checkout-line-title:hover,
.checkout-line-title:focus-visible {
	color: var(--accent-soft);
}

.checkout-line-meta {
	grid-area: meta;
	font-size: 0.78rem;
	opacity: 0.65;
}

.checkout-line-sum {
	grid-area: sum;
	align-self: center;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.checkout-totals {
	margin: 1rem 0 0;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	font-size: 0.9rem;
}

.checkout-totals div {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.checkout-totals dt,
.checkout-totals dd {
	margin: 0;
}

.checkout-totals dd {
	font-variant-numeric: tabular-nums;
}

.checkout-total-row {
	margin-top: 0.4rem;
	padding-top: 0.6rem;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	font-size: 1.05rem;
	font-weight: 800;
}

.checkout-thanks {
	max-width: 26rem;
}

.checkout-order-number {
	font-size: 1.6rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: var(--accent);
	margin: 0 0 0.5rem;
}

.checkout-order-label {
	
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	
	color: rgba(244, 239, 230, 0.75);
}

.checkout-payment-ok,
.checkout-payment-wait,
.checkout-payment-fail {
	margin: 0 0 0.75rem;
	padding: 0.6rem 0.9rem;
	border-left: 4px solid var(--accent);
	background: rgba(242, 106, 27, 0.08);
	font-size: 0.95rem;
	line-height: 1.45;
}

.checkout-payment-ok {
	border-left-color: #2e7d32;
	background: rgba(46, 125, 50, 0.08);
}

.checkout-payment-fail {
	font-weight: 600;
	border-left-color: #b3261e;
	background: rgba(179, 38, 30, 0.08);
}

.checkout-klarna {
	margin-top: 0.9rem;
	min-height: 1px;
}

.checkout-klarna:not(:empty) {
	padding: 0.8rem 0.9rem;
	background: rgba(255, 255, 255, 0.92);
	color: var(--ink);
	border: 1px solid rgba(24, 21, 17, 0.18);
	border-radius: 10px;
}

.admin-order-warn {
	color: #b3261e;
	font-weight: 600;
}

.admin-order-search {
	margin: 0.9rem 0 1.1rem;
}

.admin-order-search input {
	width: 100%;
	height: 2.6rem;
	padding: 0 0.85rem;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.95);
	color: #14100d;
	font: inherit;
}

.admin-order-count {
	margin: 0.4rem 0 0;
	font-size: 0.82rem;
	opacity: 0.75;
}

.admin-order-count:empty {
	display: none;
}

.admin-nav-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
	margin-left: 0.45rem;
	min-width: 1.8rem;
	height: 1.8rem;
	padding: 0 0.42rem;
	border-radius: 999px;
	background: #b3261e;
	color: #fff;
	font-size: 0.92rem;
	line-height: 1;
	text-align: center;
	
	position: relative;
	top: -2px;
}

.admin-nav-count:empty {
	display: none;
}

.admin-nav-count.admin-nav-uusi {
	background: var(--accent);
	color: #14100d;
	animation: admin-nav-syke 2s ease-out infinite;
}

@keyframes admin-nav-syke {
	0%   { box-shadow: 0 0 0 0 rgba(242, 106, 27, 0.55); }
	70%  { box-shadow: 0 0 0 0.6rem rgba(242, 106, 27, 0); }
	100% { box-shadow: 0 0 0 0 rgba(242, 106, 27, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.admin-nav-count.admin-nav-uusi {
		animation: none;
	}
}

.admin-return-done {
	opacity: 0.6;
}

.admin-return-flag {
	margin: 0.6rem 0 0;
	font-size: 0.82rem;
	font-style: italic;
	opacity: 0.8;
}

.admin-return-item > .admin-order-sum {
	grid-area: sum;
	justify-self: end;
}

.admin-return-item > .admin-return-flag {
	grid-area: date;
	margin: 0.15rem 0 0;
}

.admin-order-done {
	opacity: 0.55;
}

.admin-order-done .admin-order-sum {
	color: var(--accent-soft);
}

.admin-order-shipped {
	grid-area: action;
	justify-self: start;
	
	align-self: center;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	margin: 2.4rem 0 0.15rem;
	
	padding: 0.5rem 1rem;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	color: #fff;
	font: inherit;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: 0.04em;
	cursor: pointer;
	opacity: 0.85;
}

.admin-order-shipped:hover:not(:disabled) {
	opacity: 1;
	border-color: var(--accent);
	color: var(--accent);
}

.admin-order-shipped:disabled {
	opacity: 0.35;
	cursor: default;
}

.admin-order-shipped svg {
	width: 1em;
	height: 1em;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-order-shipped-state {
	grid-area: state;
	margin: 0.15rem 0 0;
	font-size: 0.78rem;
	opacity: 0.6;
}

.admin-tracking-link {
	color: var(--accent);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.admin-order-item > .admin-order-shipped {
	margin: 2.4rem 0 0.15rem;
}

.admin-order-item > .admin-order-handled,
.admin-order-item > .admin-order-reopen,
.admin-return-item > .admin-return-handled,
.admin-return-item > .admin-return-reopen {
	grid-area: action;
	justify-self: end;
	
	align-self: center;
	margin: 2.4rem 0 0.15rem;
}

.admin-return-reopen,
.admin-order-reopen {
	width: 2.2rem;
	height: 2.2rem;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	
	border: 1px solid var(--accent-soft);
	border-radius: 999px;
	color: var(--accent);
	opacity: 1;
	cursor: pointer;
}

.admin-return-reopen:hover,
.admin-order-reopen:hover {
	border-color: var(--accent);
	color: var(--accent);
	opacity: 1;
}

.admin-return-reopen svg,
.admin-order-reopen svg {
	width: 1.1rem;
	height: 1.1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-return-flag-new {
	margin-bottom: 0.5rem;
	color: var(--accent);
	opacity: 1;
}

.admin-return-handled,

.admin-order-handled,
.admin-panel .admin-catalogue-check {
	width: auto;
	padding: var(--admin-button-padding);
	
	border: 1px solid transparent;
	font-size: var(--admin-button-size);
	line-height: var(--admin-button-line);
}

.admin-month-tabs-row {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0.9rem 0 0.2rem;
}

.admin-month-tabs {
	display: flex;
	gap: 0.4rem;
	overflow-x: auto;
	scrollbar-width: none;
	scroll-behavior: smooth;
}

.admin-month-tabs::-webkit-scrollbar {
	display: none;
}

.admin-month-tab {
	flex: none;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	padding: 0.32rem 0.75rem;
	color: #fff;
	font: inherit;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	white-space: nowrap;
	opacity: 0.7;
	cursor: pointer;
}

.admin-month-tab:hover {
	opacity: 1;
	border-color: rgba(255, 255, 255, 0.4);
}

.admin-month-tab-on {
	background: var(--accent);
	border-color: var(--accent);
	color: #14100d;
	opacity: 1;
}

.admin-month-open {
	margin-left: 0.2rem;
	color: var(--accent);
	font-variant-numeric: tabular-nums;
}

.admin-month-tab-on .admin-month-open {
	color: #14100d;
	opacity: 0.7;
}

.admin-state-row {
	display: flex;
	justify-content: flex-end;
	gap: 0.2rem;
	margin: 0.35rem 0 0;
}

.admin-state-tab {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.25rem 0.45rem 0.25rem 0.3rem;
	background: none;
	border: 0;
	border-radius: 8px;
	color: #fff;
	opacity: 0.35;
	cursor: pointer;
	line-height: 0;
}

.admin-state-tab svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-state-count {
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.admin-state-tab:hover {
	opacity: 0.7;
}

.admin-state-tab[data-tila="handled"] {
	color: var(--accent-soft);
}

.admin-state-tab-on,
.admin-state-tab-on:hover {
	background: rgba(255, 255, 255, 0.1);
	opacity: 1;
}

.admin-month-more {
	flex: none;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	color: #fff;
	font: inherit;
	font-size: 0.85rem;
	line-height: 1;
	cursor: pointer;
	opacity: 0.7;
}

.admin-month-more:hover {
	opacity: 1;
	border-color: var(--accent);
	color: var(--accent);
}

.admin-order-list {
	list-style: none;
	margin: 0.8rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.admin-order-item {
	padding: 0.9rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.admin-order-tools {
	grid-area: tools;
	justify-self: end;
	display: flex;
	
	gap: 0.15rem;
	padding-top: 1.4rem;
}

.admin-order-print {
	padding: 0.45rem;
	border: 0;
	border-radius: 8px;
	background: none;
	color: inherit;
	opacity: 0.45;
	cursor: pointer;
	line-height: 0;
}

.admin-order-print svg {
	width: 2.1rem;
	height: 2.1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-order-print-both svg {
	width: 3.85rem;
}

.admin-order-print:hover:not(:disabled),
.admin-order-print:focus-visible:not(:disabled) {
	background: none;
	opacity: 1;
	color: var(--accent);
}

.admin-order-print:disabled {
	opacity: 0.18;
	cursor: default;
}

.admin-order-sums {
	grid-area: sum;
	justify-self: end;
	
	align-self: start;
	display: grid;
	justify-items: end;
	gap: 0.1rem;
}

.admin-order-sum {
	margin: 0;
	font-weight: 800;
	font-size: 1.1rem;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.admin-order-sum-was {
	opacity: 0.45;
	font-weight: 600;
	text-decoration: line-through;
}

.admin-order-sum-back {
	color: var(--accent-soft);
}

.admin-order-sum-net {
	color: var(--accent);
}

.admin-panel .admin-grid-orders {
	grid-template-columns: minmax(0, 1fr) minmax(0, 21rem);
	gap: 0.9rem;
	align-items: start;
	justify-content: start;
}

.admin-panel .admin-grid-halves {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.9rem;
	
	align-items: stretch;
}

#adminSearchList .admin-order-head,
#adminViewList .admin-order-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.4rem;
}

#adminSearchList .admin-search-hits,
#adminViewList .admin-search-hits {
	margin-left: auto;
	white-space: nowrap;
}

@media (max-width: 1100px) {
	.admin-panel .admin-grid-halves {
		grid-template-columns: minmax(0, 1fr);
	}

	.admin-panel .admin-grid-orders {
		grid-template-columns: minmax(0, 1fr);
	}
}

.admin-chart {
	margin: 0.8rem 0 0;
}

.admin-chart-svg {
	display: block;
	width: 100%;
	height: auto;
	color: #fff;
}

.admin-month-list {
	list-style: none;
	margin: 1.2rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.admin-month-list li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "name sum" "count vat";
	gap: 0 0.8rem;
	padding: 0.55rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.85rem;
}

.admin-month-name {
	grid-area: name;
	font-weight: 700;
}

.admin-month-count {
	grid-area: count;
	font-size: 0.78rem;
	opacity: 0.65;
}

.admin-month-sum {
	grid-area: sum;
	text-align: right;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.admin-month-vat {
	grid-area: vat;
	text-align: right;
	font-size: 0.78rem;
	opacity: 0.65;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.admin-attempts {
	margin-top: 1.2rem;
	padding-top: 0.2rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.admin-attempts-title {
	margin: 0.9rem 0 0.4rem;
}

.admin-attempt-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	font-size: 0.78rem;
}

.admin-attempt-list li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0 0.8rem;
	padding: 0.4rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-attempt-when {
	opacity: 0.7;
}

.admin-attempt-sum {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.admin-attempt-what {
	grid-column: 1 / -1;
	opacity: 0.85;
	word-break: break-word;
}

.admin-attempt-why {
	grid-column: 1 / -1;
	opacity: 0.55;
}

.admin-month-attempts {
	grid-column: 1 / -1;
	margin-top: 0.15rem;
	font-size: 0.75rem;
	opacity: 0.5;
}

.admin-month-total {
	margin-top: 1.2rem;
	padding-top: 0.9rem;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.admin-month-total .admin-catalogue-row {
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0 0.8rem;
}

.admin-month-total .admin-catalogue-row dd {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.admin-order-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	
	grid-template-areas: "number sum" "date sum" "pay sum" "track sum" "state sum" "tools tools" "meta meta" "action action";
	gap: 0 1rem;
}

.admin-order-number {
	grid-area: number;
	margin: 0;
	font-size: 1.05rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var(--accent);
	font-variant-numeric: tabular-nums;
}

.admin-order-date {
	grid-area: date;
	margin: 0.1rem 0 0;
	font-size: 0.82rem;
	opacity: 0.7;
}

.admin-order-unpaid-item {
	opacity: 0.6;
}

.admin-order-invoice {
	grid-area: pay;
	justify-self: start;
	margin: 0.35rem 0 0.15rem;
	padding: 0.2rem 0.55rem;
	border-radius: 4px;
	background: #fff;
	color: #1a1a1a;
	
	font-size: 0.82rem;
	line-height: 1.6;
}

.admin-order-invoice .admin-text-link {
	display: inline;
	margin-left: 0.5rem;
	padding-bottom: 0;
	color: #9a4a00;
}

.admin-order-unpaid,
.admin-order-pending {
	grid-area: pay;
	margin: 0.15rem 0 0;
	font-size: 0.82rem;
	font-weight: 700;
}

.admin-order-unpaid {
	color: #ff6b57;
}

.admin-order-pending {
	color: var(--accent);
}

.admin-state-tab-unpaid {
	color: #ff6b57;
}

.admin-order-tracking {
	grid-area: track;
	margin: 0.15rem 0 0;
	font-size: 0.82rem;
	opacity: 0.7;
}

.admin-order-item > .admin-catalogue-meta {
	grid-area: meta;
}

.topbar-google {
	display: flex;
	align-items: center;
	min-height: 32px;
}

.login-dialog {
	width: min(24rem, calc(100vw - 2rem));
	
	position: relative;
	padding: 1.6rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 16px;
	background: #1a1a1a;
	color: #f4efe6;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.login-dialog::backdrop {
	background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(2px);
}

.login-dialog-close-form {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	display: flex;
	margin: 0;
}

.login-dialog .login-dialog-close {
	background: none;
	border: 0;
	border-radius: 6px;
	padding: 0.2rem 0.45rem;
	font-size: 1.4rem;
	line-height: 1;
	color: rgba(244, 239, 230, 0.7);
	cursor: pointer;
}

.login-dialog .login-dialog-close:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	color: #fff;
}

.login-dialog .login-dialog-close:hover {
	background: none;
	color: var(--accent);
}

.legal-dialog {
	width: min(44rem, calc(100vw - 2rem));
	max-height: min(80vh, 48rem);
}

.legal-dialog[open] {
	display: flex;
	flex-direction: column;
}

.legal-dialog-body {
	overflow-y: auto;
	text-align: left;
}

.legal-open {
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	font: inherit;
	color: var(--accent);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	cursor: pointer;
}

.legal-open:hover,
.legal-open:focus-visible {
	background: none;
	color: var(--accent-soft);
}

.checkout-consent {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin: 0 0 1.1rem;
}

.checkout-terms {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.95rem;
	line-height: 1.45;
	cursor: pointer;
}

.checkout-terms input {
	width: auto;
	margin-top: 0.15rem;
	accent-color: var(--accent);
}

.checkout-terms input.chat-input-bad {
	outline: 2px solid #ff6b57;
	outline-offset: 2px;
}

.checkout-privacy {
	margin: 0;
	font-size: 0.85rem;
	opacity: 0.75;
	line-height: 1.5;
}

.login-dialog-title {
	
	padding-right: 2rem;
	margin: 0 0 1.2rem;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.5rem;
	letter-spacing: 0.06em;
}

.login-option + .login-option {
	margin-top: 1.2rem;
	padding-top: 1.2rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.login-option-title {
	margin: 0 0 0.4rem;
	font-weight: 700;
	font-size: 0.95rem;
}

.login-option-note {
	margin: 0.5rem 0 0;
	font-size: 0.8rem;
	line-height: 1.45;
	color: rgba(244, 239, 230, 0.65);
}

.login-dialog .login-option-demo input {
	padding: 0.45rem 0.6rem;
	border-radius: 9px;
	font-size: 0.85rem;
}

.login-dialog .login-option-demo button {
	margin: 0;
	padding: 0.45rem 0.9rem;
	font-size: 0.78rem;
	white-space: nowrap;
}

.login-dialog-error {
	margin: 1rem 0 0;
	color: #ff8a7a;
	font-weight: 700;
	font-size: 0.85rem;
}

.chip-row-break {
	flex: 0 0 100%;
	height: 0;
}

.finder-cart-row:has(.garage-chip.hidden) .chip-row-break {
	display: none;
}

.garage-chip {
	flex: 0 0 auto;
	
	margin-left: var(--brand-group-shift);
	display: inline-flex;
	align-items: center;
	padding: 0.5rem 0.9rem;
	border-radius: 999px;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.45);
	color: #f4efe6;
	font: inherit;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	cursor: pointer;
}

.garage-chip:hover,
.garage-chip:focus-visible {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
}

.garage-chip-saved,
.garage-chip-saved:hover {
	background: none;
	border-color: rgba(255, 255, 255, 0.22);
	color: rgba(244, 239, 230, 0.6);
	cursor: default;
}

.front-offers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: 0.9rem;
	width: 100%;
	margin-top: 0.4rem;
}

.front-offer {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	flex: 0 1 19rem;
	padding: 0.8rem 0.9rem 0.8rem 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.07);
	color: #f4efe6;
}

.front-offer-link {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	flex: 1;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

.front-offer:hover {
	background: rgba(255, 255, 255, 0.11);
	border-color: rgba(255, 255, 255, 0.32);
}

.front-offer-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
	border-radius: 10px;
}

.front-offers-single .front-offer {
	flex: 0 1 auto;
	gap: 1.2rem;
	padding: 1.1rem 1.2rem 1.1rem 1.1rem;
	max-width: min(32rem, 100%);
}

.front-offers-single .front-offer-link {
	gap: 1.4rem;
}

.front-offer-image {
	width: 4rem;
	height: 4rem;
	flex: none;
	object-fit: contain;
	border-radius: 10px;
	background: #fffdf8;
}

.front-offers-single .front-offer-image {
	width: 7rem;
	height: 7rem;
}

.front-offer-image-empty {
	background: rgba(255, 255, 255, 0.08);
}

.front-offer-body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	min-width: 0;
}

.front-offers-single .front-offer-body {
	gap: 0.35rem;
}

.front-offer-badge {
	align-self: flex-start;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.06em;
	line-height: 1;
	white-space: nowrap;
}

.front-offers-single .front-offer-badge {
	font-size: 1.6rem;
}

.front-offer-title {
	font-size: 0.85rem;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.front-offers-single .front-offer-title {
	font-size: 1rem;
}

.front-offer-price {
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.03em;
	color: #fff;
}

.front-offer-text {
	font-size: 0.8rem;
	line-height: 1.35;
	color: rgba(244, 239, 230, 0.7);
}

.front-offers-single .front-offer-price {
	font-size: 1.5rem;
}

.front-offer-price s {
	opacity: 0.6;
	font-size: 0.85em;
	margin-right: 0.2rem;
}

.admin-offer-form {
	margin-top: 1.2rem;
}

.admin-offer-list {
	list-style: none;
	margin: 0.7rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	max-height: 30rem;
	overflow-y: auto;
}

.admin-offer-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.6rem;
	padding: 0.7rem 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.admin-offer-info p {
	margin: 0;
}

.admin-offer-sku {
	font-weight: 700;
	color: var(--accent);
	font-size: 0.88rem;
}

.admin-offer-title {
	font-size: 0.82rem;
	line-height: 1.3;
}

.admin-offer-meta {
	margin-top: 0.15rem !important;
	font-size: 0.78rem;
	color: rgba(244, 239, 230, 0.65);
}

.admin-offer-side {
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
	min-width: 0;
}

.admin-promo-form {
	margin-top: 0.9rem;
}

.admin-offer-preview {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin-top: 1.1rem;
	padding: 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.05);
}

.admin-offer-preview-image {
	width: 4.5rem;
	height: 4.5rem;
	flex: none;
	object-fit: contain;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.9);
}

.admin-offer-preview-body {
	min-width: 0;
}

.admin-offer-preview-body p {
	margin: 0;
}

.admin-offer-actions {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	white-space: nowrap;
}

.admin-import-disabled {
	margin-top: 0.5rem;
	font-size: 0.85rem;
	opacity: 0.7;
}

.admin-promo-block {
	margin-top: 1.6rem;
}

.admin-panel .admin-promo-block > .eyebrow {
	margin-top: 0;
	padding-bottom: 0.7rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.admin-promo-warning {
	margin-top: 0.6rem;
	padding-left: 0.7rem;
	border-left: 2px solid var(--accent);
	color: var(--ink);
	opacity: 0.8;
}

.admin-promo-option {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	margin-top: 0.9rem;
}

.admin-promo-off {
	flex-wrap: wrap;
	opacity: 0.55;
}

.admin-promo-note {
	flex-basis: 100%;
	margin: 0.15rem 0 0 1.9rem;
	font-size: 0.85rem;
}

.admin-promo-option input[type="checkbox"] {
	flex: none;
	margin-top: 0.3rem;
}

.admin-promo-line {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.4rem;
	min-width: 0;
	white-space: nowrap;
	font-size: 0.86rem;
	line-height: 1.5;
	cursor: pointer;
	overflow-x: auto;
}

.admin-promo-line select {
	width: auto;
	border: 1px solid rgba(24, 21, 17, 0.18);
	background: rgba(255, 255, 255, 0.92);
	border-radius: 8px;
	padding: 0.3rem 0.4rem;
	font: inherit;
	font-weight: 700;
	color: var(--ink);
	cursor: pointer;
}

.admin-front-promo {
	margin: 1rem 0 0;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1rem;
	letter-spacing: 0.04em;
	text-align: center;
}

.admin-front-promo-empty {
	opacity: 0.55;
}

.front-offer-cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 2.6rem;
	height: 2.6rem;
	padding: 0;
	border-radius: 999px;
}

.front-offers-single .front-offer-cart {
	width: 3rem;
	height: 3rem;
}

.front-offer-cart svg {
	width: 1.3rem;
	height: 1.3rem;
	fill: none;
	stroke: #fff;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.front-offer-cart circle {
	fill: #fff;
	stroke: none;
}

.front-offer-cart-check {
	display: none;
}

.front-offer-cart.front-cart-btn-added .front-offer-cart-icon {
	display: none;
}

.front-offer-cart.front-cart-btn-added .front-offer-cart-check {
	display: block;
}

.front-offer-cart.front-cart-btn-added {
	background: linear-gradient(140deg, #3f9c46, #2b6e31) !important;
}

.admin-front-promo-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.6rem;
	margin-top: 1rem;
	padding-top: 0.9rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.admin-front-promo-row .admin-front-promo {
	margin: 0;
	text-align: left;
}

img.image-missing {
	object-fit: cover;
	background: none;
}

.front-product-price s,
.front-detail-price s,
.cart-meta s,
.cart-line s,
.cart-total s,
.checkout-line-meta s,
.checkout-line-sum s {
	opacity: 0.55;
	font-size: 0.85em;
	font-weight: 400;
	margin-right: 0.15rem;
}

.cart-saving {
	margin: 0.3rem 0 0;
	text-align: right;
	color: var(--accent-soft);
	font-weight: 700;
	font-size: 0.9rem;
}

.cart-sums {
	justify-self: stretch;
	width: 100%;
	margin: 1rem 0 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	font-size: 0.95rem;
}

.cart-discount-row dd,
.checkout-discount-row dd {
	color: var(--accent);
	font-weight: 700;
}

.checkout-free {
	color: var(--accent);
	font-weight: 700;
	letter-spacing: 0.04em;
}

.cart-hint {
	margin: 0.5rem 0 0;
	color: var(--muted);
	font-size: 0.85rem;
	text-align: right;
}

.cart-sums div {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.cart-sums dt,
.cart-sums dd {
	margin: 0;
}

.cart-sums dd {
	font-variant-numeric: tabular-nums;
}

.cart-total {
	margin-top: 0.6rem !important;
	padding-top: 0.7rem !important;
}

.front-back-link {
	color: var(--accent);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: rgba(242, 106, 27, 0.5);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.25em;
}

.front-back-link:visited {
	color: var(--accent);
}

.front-back-link:hover,
.front-back-link:focus-visible {
	color: var(--accent-soft);
	text-decoration-color: var(--accent-soft);
}

@media (max-width: 1000px) {
	
	.front-products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	
	body {
		min-width: 0;
		background-image: none;
	}

	
	html,
	body {
		max-width: 100%;
		overflow-x: hidden;
	}

	body::before {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		height: 100lvh;
		z-index: -1;
		background-image:
			linear-gradient(rgba(8, 8, 8, 0.78), rgba(8, 8, 8, 0.9)),
			url("/assets/bg.jpg?v=4");
		
		background-image:
			linear-gradient(rgba(8, 8, 8, 0.78), rgba(8, 8, 8, 0.9)),
			image-set(
				url("/assets/bg-900.avif?v=5") type("image/avif"),
				url("/assets/bg-900.webp?v=5") type("image/webp"),
				url("/assets/bg.jpg?v=4") type("image/jpeg"));
		background-size: cover;
		background-position: center 42%;
		background-repeat: no-repeat;
		pointer-events: none;
	}

	
	input,
	select,
	textarea {
		font-size: 16px !important;
	}

	

	.topbar {
		flex-direction: column;
		align-items: stretch;
	}

	.topbar-brand h1 {
		font-size: clamp(2.2rem, 11vw, 3.2rem);
	}

	
	.search-row {
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
		margin-top: 1.4rem;
	}

	#searchForm {
		flex: 0 0 auto;
		width: 100%;
		max-width: none;
	}

	.site-nav {
		align-self: stretch;
		justify-content: flex-start;
		gap: 0.3rem 0.9rem;
		
		padding-left: 0.8rem;
	}

	
	.site-nav-link {
		font-size: 1.08rem;
	}

	.site-nav-shop {
		font-size: 1.28rem;
		
		margin-right: 0.6rem;
	}

	
	.topbar-login-btn {
		position: static;
		align-self: flex-end;
		margin-top: 0.8rem;
	}

	.profile-card {
		position: static;
		width: auto;
		height: auto;
		max-height: none;
		margin-top: 0.8rem;
	}

	.profile-badge {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		min-width: 0;
		max-width: none;
	}

	
	.results-card {
		position: static;
		transform: none;
		width: 100%;
		max-height: none;
		margin: 1rem 0 0;
	}

	.search-form,
	.results-head-row {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	
	.app-shell {
		padding-bottom: 5.5rem;
	}

	

	.glass-box {
		min-height: 0;
		padding: 0.9rem 0.8rem;
	}

	
	.front-suppliers {
		position: static;
		justify-content: flex-start;
		margin-bottom: 0.7rem;
	}

	.front-panel {
		padding-top: 0;
	}

	
	.finder-cart-row {
		flex-wrap: wrap;
		align-items: center;
		gap: 0.5rem;
		margin: 1.2rem 0 0.5rem;
	}

	.finder-cart-row .bike-finder-wrap {
		flex: 1 1 100%;
		min-width: 0;
		flex-wrap: wrap;
	}

	
	.bike-finder-btn {
		white-space: normal;
		text-align: left;
	}

	.finder-cart-row .cart-link {
		flex: none;
		margin-left: auto;
	}

	
	.cart-link {
		margin-top: 0;
	}

	
	.bike-finder-row {
		flex-wrap: wrap;
		justify-content: center;
	}

	.bike-finder-row .bike-finder-select {
		flex: 1 1 100%;
	}

	.bike-finder-row .bike-finder-btn {
		flex: 1 1 100%;
		min-height: 44px;
	}

	
	#bikeSelectBtn {
		flex: 0 0 auto;
		min-width: 12rem;
		min-height: 44px;
		margin: 0.4rem auto 0;
	}

	
	.bike-finder {
		max-height: 60vh;
		padding: 1.1rem 1rem 2rem;
	}

	.front-menu {
		gap: 0.3rem 1.2rem;
	}

	
	.front-category-lead {
		font-size: 2.05rem;
	}

	.front-category-big {
		font-size: 1.75rem;
	}

	.front-category-small {
		font-size: 1.28rem;
	}

	
	
	.bike-chip {
		flex: 1 1 100%;
		align-items: center;
	}

	.bike-chip-open {
		flex: 1 1 auto;
		min-width: 0;
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		gap: 0 0.5rem;
		padding: 0.4rem 0.7rem;
		text-align: left;
		font-size: 0.82rem;
	}

	.bike-chip-open .bike-finder-icon {
		grid-row: 1 / span 2;
		align-self: center;
		width: 1.15rem;
		height: 1.15rem;
	}

	.bike-chip-name {
		grid-column: 2;
		line-height: 1.25;
	}

	.bike-chip-meta {
		grid-column: 2;
		font-size: 0.7rem;
		line-height: 1.2;
	}

	
	.universal-chip,
	.garage-chip {
		flex: 0 0 auto;
		font-size: 0.75rem;
		padding: 0.4rem 0.75rem;
	}

	
	.front-category-item:hover .front-subcategories,
	.front-subcategories {
		display: none;
	}

	.front-products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.7rem;
	}

	.front-detail {
		grid-template-columns: minmax(0, 1fr);
	}

	
	.front-head-right {
		flex: 1 1 100%;
		margin-left: 0;
	}

	

	
	.cart-row {
		grid-template-columns: 56px minmax(0, 1fr) auto;
		gap: 0.45rem 0.7rem;
		align-items: start;
	}

	.cart-image {
		width: 56px;
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	.cart-info {
		grid-column: 2;
		grid-row: 1;
	}

	.cart-remove {
		grid-column: 3;
		grid-row: 1;
		justify-self: end;
	}

	.cart-qty {
		grid-column: 2;
		grid-row: 2;
		justify-self: start;
	}

	.cart-line {
		grid-column: 3;
		grid-row: 2;
		align-self: center;
		min-width: 0;
	}

	.cart-actions {
		flex-direction: column-reverse;
		align-items: stretch;
		
		gap: 1.8rem;
	}

	.cart-actions button {
		width: 100%;
		min-height: 44px;
		padding: 0.72rem 1rem;
	}

	
	.cart-actions .ghost {
		width: auto;
		align-self: center;
		min-height: 44px;
		padding: 0.4rem 0.8rem;
		background: none;
		color: var(--muted);
		font-weight: 500;
		text-decoration: underline;
		text-underline-offset: 0.25em;
	}

	

	.checkout-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	
	.checkout-summary {
		order: -1;
	}

	.checkout-fields {
		grid-template-columns: minmax(0, 1fr);
	}

	#checkoutSubmit {
		width: 100%;
		min-width: 0;
		min-height: 48px;
	}

	.return-line {
		flex-wrap: wrap;
	}

	

	.chat-widget {
		right: 0.75rem;
		bottom: 0.75rem;
	}

	
	.chat-panel {
		width: calc(100vw - 1.5rem);
	}

	
	.chat-panel,
	.admin-inbox-panel {
		max-height: calc(100vh - 0.75rem - clamp(3.6rem, 6vw, 4.6rem)
		                 - var(--bubble-gap) - 0.75rem);
		max-height: calc(100svh - 0.75rem - clamp(3.6rem, 6vw, 4.6rem)
		                 - var(--bubble-gap) - 0.75rem);
	}

	
	.chat-title {
		cursor: default;
	}

	.admin-inbox-panel {
		width: calc(100vw - 1.5rem);
	}

	

	.admin-panel .admin-grid,
	.admin-panel .admin-grid-edit,
	.admin-panel .admin-grid-orders,
	.admin-panel .admin-product-search,
	.admin-form,
	.admin-summary-row {
		grid-template-columns: minmax(0, 1fr);
	}

	.admin-nav {
		flex-wrap: wrap;
	}
}

@media (max-width: 480px) {
	
	.front-products {
		gap: 0.5rem;
	}

	.front-title {
		font-size: 1.25rem;
	}

	
	.front-offer {
		flex: 1 1 100%;
	}
}

.site-footer {
	display: none;
}

.glass-box-home .site-footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 2rem;
	margin: 1.6rem 0 0;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	font-size: 0.8rem;
	letter-spacing: 0.04em;
}

.site-credit {
	display: none;
}

#frontBox.glass-box-home ~ .site-credit {
	display: block;
	margin: 0.6rem 0 0;
	
	text-align: left;
	font-size: 0.66rem;
	letter-spacing: 0.02em;
	
	color: rgba(244, 239, 230, 0.2);
	
	position: fixed;
	left: 0.6rem;
	bottom: 0.5rem;
	margin: 0;
	
	pointer-events: none;
	z-index: 5;
}

#frontBox.glass-box-home ~ .site-credit a {
	pointer-events: auto;
}

.site-credit a {
	color: inherit;
	text-decoration: none;
	cursor: default;
}

.site-credit a:focus-visible {
	outline: 1px solid rgba(244, 239, 230, 0.5);
	outline-offset: 2px;
}

.site-footer a {
	color: rgba(244, 239, 230, 0.55);
	text-decoration: none;
}

.site-footer a:hover,
.site-footer a:focus-visible {
	color: var(--accent);
	text-decoration: underline;
}

.front-terms-draft {
	padding: 0.7rem 0.9rem;
	border-radius: 10px;
	border: 1px solid rgba(242, 106, 27, 0.4);
	background: rgba(242, 106, 27, 0.08);
}

.front-terms-title {
	justify-self: start;
	margin: 1.4rem 0 0.2rem;
	color: var(--accent);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.15rem;
	letter-spacing: 0.06em;
}

.front-brands {
	justify-self: stretch;
	width: 100%;
	min-width: 0;
}

.front-brands:empty {
	display: none;
}

.front-brands .front-model-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.5rem;
	margin: 0.2rem 0 0.6rem;
}

.front-sort-row {
	justify-self: stretch;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	margin: -0.3rem 0 0.2rem;
}

.legal-toc {
	justify-self: stretch;
	width: 100%;
	max-width: 46rem;
	margin: 0.2rem 0 1.4rem;
	padding: 0.9rem 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.05);
}

.legal-toc-link {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0.1rem 0;
	width: auto;
	text-align: left;
	font: inherit;
	font-size: 0.92rem;
	letter-spacing: normal;
	text-transform: none;
	color: var(--accent-soft);
	cursor: pointer;
}

.legal-toc-link:hover,
.legal-toc-link:focus-visible {
	color: var(--accent);
	text-decoration: underline;
}

.legal-section {
	justify-self: stretch;
	width: 100%;
	max-width: 46rem;
	
	scroll-margin-top: 1.2rem;
}

.legal-list {
	margin: 0.2rem 0 0.8rem;
	padding-left: 1.2rem;
	max-width: 68ch;
	line-height: 1.55;
}

.legal-list li {
	margin: 0.15rem 0;
}

.legal-lines {
	margin: 0.4rem 0 0.9rem;
	line-height: 1.5;
}

.chat-thanks {
	position: fixed;
	inset: 0;
	
	z-index: 100;
	display: grid;
	
	align-content: center;
	justify-items: center;
	gap: 0;
	padding: 1.5rem;
	pointer-events: none;
}

.chat-thanks > * {
	pointer-events: auto;
}

.chat-thanks-title,
.chat-thanks-text {
	width: min(24rem, 100%);
	margin: 0;
	padding: 1.4rem 1.6rem 0;
	background: #14110f;
	color: #f4efe6;
	text-align: center;
	cursor: pointer;
}

.chat-thanks-title {
	padding-top: 1.6rem;
	border-radius: 16px 16px 0 0;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-bottom: 0;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5);
	font-family: "Bebas Neue", sans-serif;
	font-size: 1.5rem;
	letter-spacing: 0.06em;
	color: var(--accent);
}

.chat-thanks-text {
	padding: 0.5rem 1.6rem 1.6rem;
	border-radius: 0 0 16px 16px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-top: 0;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5);
	font-size: 0.95rem;
	line-height: 1.45;
}

@media (prefers-reduced-motion: no-preference) {
	.chat-thanks:not(.hidden) {
		animation: chat-thanks-in 0.18s ease-out;
	}
}

@keyframes chat-thanks-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

.chat-trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.admin-duplicate-open-empty .admin-door-count {
	opacity: 0.55;
}

.admin-grid-duplicates {
	grid-template-columns: minmax(0, 1fr);
}

.admin-dup-heading {
	margin: 0;
	color: var(--accent);
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: 0.04em;
}

.admin-dup-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.admin-dup-head > div {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.25rem;
}

.admin-panel .admin-dup-scan {
	margin-top: 0;
	margin-left: auto;
	padding-top: 0;
	padding-bottom: 0.3rem;
	white-space: nowrap;
}

.admin-panel .admin-dup-back {
	margin-top: 0;
	align-self: flex-start;
	color: rgba(255, 255, 255, 0.72);
}

.admin-dup-count {
	margin-left: 0.5rem;
	color: var(--accent);
	font-variant-numeric: tabular-nums;
	font-weight: 800;
}

.admin-dup-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.2rem;
	margin: 0.6rem 0 0.2rem;
}

.admin-panel .admin-dup-tab {
	margin-top: 0;
	padding: 0 0 0.3rem;
	background: none;
	border: 0;
	border-radius: 0;
	color: rgba(255, 255, 255, 0.62);
	font: inherit;
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	cursor: pointer;
}

.admin-panel .admin-dup-tab-on {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}

.admin-dup-list {
	list-style: none;
	margin: 0.6rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
}

.admin-dup-item {
	padding: 0.75rem;
	border-radius: 10px;
	background: rgba(4, 10, 24, 0.55);
	border: 1px solid rgba(173, 193, 255, 0.24);
}

.admin-dup-reasons {
	margin: 0 0 0.6rem;
	font-size: 0.74rem;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.62);
}

.admin-dup-group {
	display: grid;
	grid-template-columns: minmax(0, 20rem) minmax(0, 1fr);
	gap: 0.75rem;
	align-items: start;
}

@media (max-width: 62rem) {
	.admin-dup-group {
		grid-template-columns: minmax(0, 1fr);
	}
}

.admin-dup-candidates {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 0.6rem;
	align-content: start;
}

.admin-dup-side,
.admin-dup-candidate {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.45rem;
	min-height: 21rem;
	padding: 0.9rem 0.8rem;
	border-radius: 8px;
	border: 1px solid rgba(173, 193, 255, 0.2);
	background: rgba(8, 16, 34, 0.5);
}

.admin-dup-candidate .admin-dup-reasons {
	margin: 0;
	padding-right: 3.1rem;
	font-size: 0.7rem;
	text-align: left;
	width: 100%;
}

.admin-dup-side-chosen {
	border-color: var(--accent);
}

.admin-dup-side-hidden {
	opacity: 0.66;
}

.admin-dup-supplier {
	margin: 0;
	
	padding-right: 3.1rem;
	
	width: 100%;
	text-align: left;
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.72);
}

.admin-dup-tag {
	margin-left: 0.4rem;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: none;
	color: rgba(255, 255, 255, 0.55);
}

.admin-dup-tag-in {
	color: var(--accent);
}

.admin-dup-tag-out {
	color: rgba(255, 255, 255, 0.5);
	text-decoration: line-through;
	text-decoration-thickness: 1px;
}

.admin-dup-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 700;
}

.admin-dup-choose {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.5rem;
	margin-top: 0.45rem;
}

.admin-panel .admin-dup-hide {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 2;
	margin-top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.1rem;
	height: 3.1rem;
	padding: 0;
	border-radius: 50%;
}

.admin-dup-hide svg {
	width: 1.8rem;
	height: 1.8rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
}

.admin-panel .admin-dup-hide-on {
	background: none;
	border: 1px solid rgba(173, 193, 255, 0.35);
	color: rgba(255, 255, 255, 0.8);
}

.admin-panel .admin-dup-done {
	margin-top: 0;
	white-space: nowrap;
}

.admin-dup-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
	margin-top: 0.6rem;
}

.admin-panel .admin-dup-actions button {
	margin-top: 0;
}

.admin-dup-empty {
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.62);
}

.admin-panel .admin-dup-link {
	margin-top: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	color: #fff;
	font: inherit;
	font-weight: 700;
	text-align: left;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, 0.35);
	text-underline-offset: 0.25em;
	cursor: pointer;
}

.admin-panel .admin-dup-link:hover,
.admin-panel .admin-dup-link:focus-visible {
	background: none;
	color: var(--accent);
	text-decoration-color: var(--accent);
}

.admin-peek {
	position: fixed;
	inset: 0;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
}

.admin-peek.hidden {
	display: none;
}

.admin-peek-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(2, 6, 16, 0.72);
}

.admin-peek-card {
	position: relative;
	width: min(46rem, 100%);
	max-height: 86vh;
	overflow-y: auto;
	padding: 1.2rem 1.3rem 1.4rem;
	border-radius: 14px;
	border: 1px solid rgba(173, 193, 255, 0.28);
	background: #0a1224;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.admin-panel .admin-peek-close,
.admin-peek-close {
	position: absolute;
	top: 0.5rem;
	right: 0.6rem;
	margin-top: 0;
	padding: 0 0.3rem;
	background: none;
	border: 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}

.admin-peek-close:hover,
.admin-peek-close:focus-visible {
	color: var(--accent);
}

.admin-peek-title {
	margin: 0 2rem 0.8rem 0;
	
	color: #fff;
	font-size: 1.05rem;
	font-weight: 800;
}

.admin-peek-grid {
	display: grid;
	grid-template-columns: minmax(0, 12rem) minmax(0, 1fr);
	gap: 1rem;
	align-items: start;
}

@media (max-width: 34rem) {
	.admin-peek-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.admin-peek-image {
	width: 100%;
	border-radius: 10px;
	background: #fff;
}

.admin-peek-text {
	margin: 0.9rem 0 0;
	font-size: 0.85rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.78);
}

.admin-panel .admin-dup-thumb {
	margin-top: 0;
	padding: 0.2rem;
	width: 6.5rem;
	height: 6.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
	cursor: pointer;
	line-height: 0;
}

.admin-dup-thumb img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	display: block;
}

.admin-dup-thumb-empty {
	background: rgba(255, 255, 255, 0.06);
	border: 1px dashed rgba(173, 193, 255, 0.28);
	cursor: default;
}

.admin-dup-state {
	margin-right: auto;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.62);
}

.admin-dup-tag {
	letter-spacing: 0.05em;
}

.admin-nav-warn,
.admin-duplicate-warn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--accent);
}

.admin-nav-warn.hidden,
.admin-duplicate-warn.hidden {
	display: none;
}

.admin-nav-warn svg,
.admin-duplicate-warn svg {
	width: 1.1rem;
	height: 1.1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-duplicate-warn svg circle {
	fill: currentColor;
	stroke: none;
}

.admin-nav-warn svg circle {
	fill: currentColor;
	stroke: none;
}

.admin-nav-warn {
	margin-left: 0.4rem;
	vertical-align: -0.2em;
}

.admin-duplicate-door {
	position: relative;
}

.admin-duplicate-warn {
	position: absolute;
	top: 0.85rem;
	right: 0.9rem;
}

.admin-duplicate-warn svg {
	width: 1.5rem;
	height: 1.5rem;
}

.admin-product-state {
	color: var(--accent);
	font-weight: 700;
}

.admin-panel .admin-product-hide {
	margin-top: 0.8rem;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 1rem;
	font-size: 0.78rem;
}

.admin-product-hide svg {
	width: 1.1rem;
	height: 1.1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
}

.admin-panel .admin-product-hide-on {
	background: none;
	border: 1px solid rgba(173, 193, 255, 0.35);
	color: rgba(255, 255, 255, 0.85);
}

.admin-duplicate-door .eyebrow {
	margin-top: 0;
	padding-right: 2.4rem;
}

.front-supplier-tag {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 2;
	padding: 0.18rem 0.45rem;
	border-radius: 6px;
	background: rgba(4, 10, 24, 0.78);
	color: #fff;
	font-size: 0.62rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	pointer-events: none;
}

.front-detail-image .front-supplier-tag {
	font-size: 0.7rem;
}

.admin-dup-tab-count {
	margin-left: 0.35rem;
	font-variant-numeric: tabular-nums;
	font-weight: 800;
	opacity: 0.85;
}

.front-product-hidden {
	position: relative;
}

.front-product-hidden .front-product-image,
.front-product-hidden .front-detail-image,
.front-product-hidden .front-product-body,
.front-product-hidden .front-detail-body {
	filter: grayscale(1);
	opacity: 0.55;
}

.front-product-hidden-tag {
	position: absolute;
	left: 0.5rem;
	bottom: 0.5rem;
	z-index: 2;
	padding: 0.18rem 0.45rem;
	border-radius: 6px;
	background: rgba(4, 10, 24, 0.82);
	color: #fff;
	font-size: 0.62rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	pointer-events: none;
}

.front-hide-btn {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(4, 10, 24, 0.78);
	color: #fff;
	cursor: pointer;
}

.front-hide-btn:hover,
.front-hide-btn:focus-visible {
	background: var(--accent);
}

.front-hide-btn-on {
	background: var(--accent);
}

.front-freight-btn {
	position: absolute;
	top: 2.7rem;
	left: 0.5rem;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(4, 10, 24, 0.78);
	color: #fff;
	cursor: pointer;
}

.front-freight-btn:hover,
.front-freight-btn:focus-visible {
	background: var(--accent);
}

.front-freight-btn-on {
	background: var(--accent);
}

.front-freight-btn svg {
	width: 1.05rem;
	height: 1.05rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.front-hide-btn svg {
	width: 1.05rem;
	height: 1.05rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
}

.front-product,
.front-detail {
	position: relative;
}

.admin-dup-side .admin-catalogue-row,
.admin-dup-candidate .admin-catalogue-row {
	grid-template-columns: 7rem minmax(0, 1fr);
	gap: 0.4rem;
}

.admin-dup-side .admin-catalogue-meta,
.admin-dup-candidate .admin-catalogue-meta {
	font-size: 0.78rem;
	gap: 0.22rem;
	text-align: left;
	width: 100%;
	max-width: 14rem;
	margin-top: auto;
}

.admin-heading-count {
	margin-left: 0.6rem;
	font-family: "Space Grotesk", sans-serif;
	font-size: 0.85rem;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0;
	color: rgba(255, 255, 255, 0.6);
}

.admin-crumbs {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	margin: 0 0 0.4rem;
	font-family: "Bebas Neue", sans-serif;
	letter-spacing: 0.03em;
	font-size: clamp(1rem, 2.2vw, 1.4rem);
}

.admin-panel .admin-crumb {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	letter-spacing: inherit;
	color: rgba(244, 239, 230, 0.85);
	cursor: pointer;
}

.admin-panel .admin-crumb:hover,
.admin-panel .admin-crumb:focus-visible {
	color: var(--accent);
	background: none;
}

.admin-panel .admin-crumb-now {
	color: #fff;
	cursor: default;
}

.admin-crumb-sep {
	color: rgba(244, 239, 230, 0.45);
}

.admin-door-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.75rem;
}

.admin-door-list li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.admin-door {
	display: flex;
	align-items: baseline;
	gap: 0.6rem;
	
}

.admin-panel .admin-door {
	margin: 0;
	padding: 0;
}

.admin-door-count {
	font-variant-numeric: tabular-nums;
	color: #f4efe6;
}

.admin-door-warn {
	display: inline-flex;
	align-items: center;
	align-self: center;
}

.admin-door-warn svg {
	width: 1.05rem;
	height: 1.05rem;
	display: block;
	fill: none;
	stroke: var(--accent);
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-door-warn circle {
	fill: var(--accent);
	stroke: none;
}

.admin-pricing {
	margin-top: 1rem;
	padding-top: 0.55rem;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.admin-panel .admin-pricing .eyebrow {
	margin-top: 0;
}

.admin-pricing-pick {
	margin-top: 0.6rem;
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: 0.9rem;
}

.admin-pricing-pick select {
	appearance: none;
	field-sizing: content;
	min-width: 5.5rem;
	font: inherit;
	padding: 0.3rem 2.1rem 0.3rem 0.7rem;
	border: 1px solid rgba(244, 239, 230, 0.35);
	border-radius: 4px;
	background-color: transparent;
	background-image:
		linear-gradient(45deg, transparent 50%, currentColor 50%),
		linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: right 1.05rem center, right 0.75rem center;
	background-size: 0.32rem 0.32rem, 0.32rem 0.32rem;
	background-repeat: no-repeat;
	color: inherit;
	cursor: pointer;
}

.admin-pricing-pick select:hover {
	border-color: var(--accent);
	color: var(--accent);
}

.admin-pricing-pick option {
	background: #17150f;
	color: #f4efe6;
}

.admin-pricing-saved {
	font-size: 0.8rem;
	color: var(--accent-soft);
}

.admin-edited-row {
	position: relative;
	display: grid;
	gap: 0.2rem;
	
	padding: 0.2rem 0.6rem 0.7rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.admin-panel .admin-edited-row .admin-edited-history {
	
	margin: 0;
	justify-self: end;
}

.admin-panel .admin-edited-restore {
	position: absolute;
	
	top: 0.2rem;
	right: 0.6rem;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.7rem;
	height: 1.7rem;
	margin: 0;
	
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(4, 10, 24, 0.85);
	color: #fff;
	cursor: pointer;
}

.admin-edited-restore:hover,
.admin-edited-restore:focus-visible {
	background: var(--accent);
}

.admin-edited-restore svg {
	width: 1rem;
	height: 1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.admin-hidden-restore {
	flex: 0 0 auto;
	align-self: center;
	white-space: nowrap;
}

.admin-hidden-empty,
.admin-edited-empty {
	color: rgba(255, 255, 255, 0.6);
}

.admin-edited-latest {
	font-size: 0.85rem;
	color: #fff;
}

.admin-edited-events {
	list-style: none;
	margin: 0.35rem 0 0 3.6rem;
	padding: 0 0 0 0.7rem;
	border-left: 2px solid rgba(255, 255, 255, 0.28);
	display: grid;
	gap: 0.25rem;
	font-size: 0.85rem;
}

.admin-panel .admin-edited-history {
	white-space: nowrap;
}

.admin-edited-when {
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.78rem;
}

.admin-edited-supplier {
	margin-left: 0.5rem;
	font-size: 0.7rem;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.55);
}

.admin-health {
	margin: 0 0 1.2rem;
	padding: 0.9rem 1.1rem;
	border-left: 3px solid #b3261e;
	border-radius: 0 6px 6px 0;
	background: rgba(179, 38, 30, 0.12);
}

.admin-health-title {
	margin: 0 0 0.4rem;
	font-family: "Bebas Neue", sans-serif;
	font-size: 1rem;
	letter-spacing: 0.06em;
	color: #ff6b5e;
}

.admin-health-list {
	margin: 0;
	padding-left: 1.1rem;
	font-size: 0.86rem;
	line-height: 1.5;
}

.admin-batch-row {
	position: relative;
	
	padding: 0.2rem 0.6rem 0.7rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.admin-batch-row:hover {
	background: rgba(255, 255, 255, 0.06);
}

.admin-panel .admin-batch-open {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	width: 100%;
	margin: 0;
	padding: 0.5rem 2.4rem 0.2rem 0;
	border: 0;
	background: none;
	color: inherit;
	text-align: left;
	
	cursor: pointer;
}

.admin-batch-count {
	flex: none;
	min-width: 2.6rem;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1;
	color: var(--accent);
	font-variant-numeric: tabular-nums;
}

.admin-batch-facts {
	display: grid;
	gap: 0.15rem;
	min-width: 0;
}

.admin-batch-title {
	font-size: 0.86rem;
	line-height: 1.3;
}

.admin-batch-when {
	font-size: 0.78rem;
	color: rgba(255, 255, 255, 0.5);
}

.admin-panel .admin-batch-row .admin-edited-restore {
	top: 0.2rem;
	right: 0.6rem;
}

.admin-edited-image {
	width: 44px;
	height: 44px;
	object-fit: contain;
	border-radius: 6px;
	background: #fff;
	flex: 0 0 auto;
}

.admin-edited-image-empty {
	border: 1px dashed rgba(255, 255, 255, 0.25);
}

.admin-edited-facts {
	display: grid;
	gap: 0.15rem;
	min-width: 0;
	
	padding-right: 2.2rem;
}

.admin-edited-change {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.4rem;
	font-size: 0.85rem;
}

.admin-edited-field {
	color: rgba(255, 255, 255, 0.6);
}

.admin-edited-from {
	text-decoration: line-through;
	color: rgba(255, 255, 255, 0.55);
}

.admin-edited-to {
	font-weight: 600;
}

.admin-edited-hidden {
	margin-left: 0.5rem;
	font-size: 0.7rem;
	letter-spacing: 0.06em;
	color: var(--accent);
}

.admin-hours-rows {
	display: grid;
	gap: 0.5rem;
	margin-top: 0.8rem;
}

.admin-hours-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
	gap: 0.5rem;
}

.checkout-address-title {
	margin: 0.4rem 0 -0.2rem;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.checkout-group-title {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	opacity: 0.75;
}

.checkout-group-note {
	font-size: 0.78rem;
	opacity: 0.6;
}

.checkout-field-optional {
	display: inline;
	margin: 0;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	opacity: 0.6;
}

.checkout-billing-toggle {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.55rem;
	margin-top: 0.7rem;
}

.checkout-billing-toggle input[type="checkbox"] {
	width: 1.05rem;
	height: 1.05rem;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

.checkout-billing-toggle span {
	display: inline;
	margin: 0;
	font-size: 0.92rem;
	opacity: 0.9;
}

.checkout-select {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	box-sizing: border-box;
	height: 2.5rem;
	padding: 0 2rem 0 0.7rem;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	background-color: rgba(255, 255, 255, 0.95);
	color: var(--ink);
	font: inherit;
	font-size: 0.95rem;
	
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23111' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 0.7rem;
}

.checkout-select:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 1px;
}