/*
 * Ripley house ads for Breaking News ABA
 * Concepts: A (live dashboard) and B (state map). Leaderboard (.rpx-top) + sidebar (.rpx-side).
 * Everything is scoped to .rpx / .rpx-*; nothing touches theme styles.
 */
/* ==== Shared ==== */
/* Slot wrappers (same values as the theme's current #bna-ripley-css, so the old block can be deleted). */
.bna-rip-wrap {
	max-width: var(--container, 1260px);
	margin: 0 auto;
	padding: 22px 24px 6px;
	box-sizing: border-box;
}
.bna-rip-wrap--side {
	max-width: none;
	padding: 0;
}
/* Ripley house ads — shared base. Everything is scoped to .rpx so it cannot leak into the theme. */
.rpx {
	--rb: #1157c4;
	--rb2: #1769e0;
	--rnavy: #202945;
	--rink: #16181d;
	--rline: #dce4ee;
	--rwash: #f4f7fb;
	--rmint: #7fd0ae;
	--rmint2: #3fb88a;
	--rsun: #f6c744;
	--rmute: #5b6b82;
	--rdeep: #0a1530;
	--rfh: "Familjen Grotesk", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--rfb: Inter, Figtree, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	position: relative;
	display: flex;
	overflow: hidden;
	isolation: isolate;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid var(--rline);
	border-radius: 12px;
	font-family: var(--rfb);
	font-size: 14px;
	line-height: 1.3;
	color: var(--rnavy);
	text-decoration: none !important;
	-webkit-font-smoothing: antialiased;
	transition:
		box-shadow 0.25s,
		border-color 0.25s,
		transform 0.25s;
}
.rpx *,
.rpx *::before,
.rpx *::after {
	box-sizing: border-box;
	text-decoration: none;
}
a.rpx,
a.rpx:hover,
a.rpx:focus,
a.rpx:visited {
	color: var(--rnavy);
	text-decoration: none !important;
}
.rpx:hover {
	border-color: #b9cbea;
	box-shadow: 0 12px 32px -14px rgba(17, 87, 196, 0.4);
	transform: translateY(-1px);
}
.rpx:focus-visible {
	outline: 3px solid var(--rb2);
	outline-offset: 3px;
}
.rpx em,
.rpx i,
.rpx b,
.rpx small,
.rpx strong {
	font-style: normal;
}
.rpx img {
	display: block;
	margin: 0 !important;
	border: 0;
	border-radius: 0 !important;
	max-width: none;
	height: auto;
	box-shadow: none;
}
.rpx-logo {
	display: block;
	width: 150px;
	height: auto;
}
.rpx-tag {
	position: absolute;
	z-index: 6;
	top: 6px;
	right: 9px;
	font: 700 8px/1 var(--rfb);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #98a4b5;
}
.rpx-flag {
	flex: none;
	font: 700 8px/1 var(--rfb);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #8a97a8;
	border: 1px solid var(--rline);
	border-radius: 3px;
	padding: 4px 6px;
}
.rpx-h {
	display: block;
	font-family: var(--rfh);
	font-weight: 700;
	letter-spacing: -0.015em;
	color: var(--rnavy);
	text-wrap: balance;
}
.rpx-h em {
	color: var(--rb);
}
.rpx-sub {
	display: block;
	color: var(--rmute);
	text-wrap: pretty;
}
.rpx-sub b {
	color: var(--rnavy);
	font-weight: 700;
}
.rpx-cta {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	white-space: nowrap;
	background: var(--rink);
	color: #fff;
	font: 700 14px/1 var(--rfb);
	padding: 13px 18px;
	border-radius: 8px;
	transition: background 0.2s;
}
.rpx:hover .rpx-cta {
	background: var(--rb);
}
.rpx-cta b {
	display: inline-block;
	transition: transform 0.2s;
}
.rpx:hover .rpx-cta b {
	transform: translateX(4px);
}
.rpx-cta::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -60%;
	width: 40%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.38), transparent);
	transform: skewX(-20deg);
	animation: rpxShine 4.5s ease-in-out 1.2s infinite;
}
@keyframes rpxShine {
	0%,
	70% {
		left: -60%;
	}
	100% {
		left: 130%;
	}
}
.rpx-price {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--rnavy);
}
.rpx-price b {
	font: 700 32px/1 var(--rfh);
	letter-spacing: -0.02em;
}
.rpx-price small {
	display: block;
	font: 600 10.5px/1.15 var(--rfb);
	color: var(--rmute);
	white-space: nowrap;
}
.rpx-save {
	display: inline-block;
	font: 800 10px/1 var(--rfb);
	color: #0b6b47;
	background: #d9f5e8;
	padding: 4px 7px;
	border-radius: 999px;
	white-space: nowrap;
}
.rpx-top {
	width: 100%;
	min-height: 120px;
	align-items: center;
	gap: 26px;
	padding: 0 26px 0 24px;
}
.rpx-side {
	width: 100%;
	max-width: 300px;
	flex-direction: column;
	align-items: stretch;
	padding: 12px 12px 14px;
}
.rpx-side__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.rpx-side .rpx-logo {
	width: 118px;
}
.rpx-side .rpx-h {
	margin-top: 12px;
	font-size: 18px;
	line-height: 1.12;
}
.rpx-side .rpx-sub {
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.4;
}
.rpx-side .rpx-cta {
	width: 100%;
	margin-top: 11px;
}
/* Pause everything while the ad is scrolled out of view (the script adds .is-off). */
.rpx.is-off *,
.rpx.is-off *::before,
.rpx.is-off *::after {
	animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
	.rpx *,
	.rpx *::before,
	.rpx *::after {
		animation: none !important;
		transition: none !important;
	}
}
@media (max-width: 760px) {
	.rpx-top {
		flex-wrap: wrap;
		gap: 12px;
		padding: 16px;
		min-height: 0;
	}
}

/* ===== Concept A — live dashboard ===== */
.rpx-a.rpx-top {
	background: radial-gradient(560px 200px at 60% 130%, #e2ecfc 0%, rgba(226, 236, 252, 0) 70%), #fff;
}
.rpx-a__copy {
	flex: 1 1 280px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.rpx-top.rpx-a .rpx-h {
	font-size: 23px;
	line-height: 1.08;
	margin-top: 3px;
}
.rpx-top.rpx-a .rpx-sub {
	font-size: 12.5px;
}
.rpx-a__stage {
	position: relative;
	flex: none;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	align-self: stretch;
	padding-top: 13px;
}
.rpx-top .rpx-a__stage {
	height: 118px;
	overflow: hidden;
}
.rpx-win {
	position: relative;
	display: block;
	width: 360px;
	background: #fff;
	border: 1px solid #d3dce8;
	border-bottom: 0;
	border-radius: 9px 9px 0 0;
	box-shadow: 0 14px 34px -14px rgba(32, 41, 69, 0.38);
	overflow: hidden;
}
.rpx-win__bar {
	display: flex;
	align-items: center;
	gap: 4px;
	height: 17px;
	padding: 0 7px;
	background: #f3f5f8;
	border-bottom: 1px solid #e5e9ef;
}
.rpx-win__bar i {
	display: block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #ff5f57;
}
.rpx-win__bar i + i {
	background: #febc2e;
}
.rpx-win__bar i + i + i {
	background: #28c840;
}
.rpx-win__url {
	display: block;
	flex: 1;
	min-width: 0;
	margin-left: 7px;
	height: 11px;
	padding: 0 7px;
	border: 1px solid #e1e6ec;
	border-radius: 6px;
	background: #fff;
	font: 500 7px/9px var(--rfb);
	color: #8592a3;
	white-space: nowrap;
	overflow: hidden;
}
.rpx-win__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 15px;
	padding: 0 9px;
	background: var(--rb2);
	color: #fff;
	font: 700 6.5px/1 var(--rfb);
	letter-spacing: 0.14em;
}
.rpx-win__nav i {
	display: block;
	width: 26px;
	height: 5px;
	border-radius: 3px;
	background: rgba(255, 255, 255, 0.45);
}
.rpx-slotwrap {
	--cx: 40px;
	--cy: 25px;
	position: relative;
	display: block;
	margin: 7px 9px 0;
}
.rpx-slot {
	position: relative;
	display: block;
	height: 50px;
	border-radius: 6px;
	overflow: hidden;
	background: #eef3fb;
}
.rpx-ad {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 0 10px;
	border-radius: 6px;
	opacity: 0;
	animation: rpxSlide 12s cubic-bezier(0.2, 0.8, 0.2, 1) infinite backwards;
}
.rpx-ad--0 {
	opacity: 1;
	background: #fff;
	border: 1.5px dashed #9db5e3;
	animation-delay: 0s;
}
.rpx-ad--1 {
	background: linear-gradient(100deg, #13265a, #2152c4);
	animation-delay: 3s;
}
.rpx-ad--2 {
	background: linear-gradient(100deg, #2a1659, #6b3fd6);
	animation-delay: 6s;
}
.rpx-ad--3 {
	background: linear-gradient(100deg, #0b4a44, #159c82);
	animation-delay: 9s;
}
@keyframes rpxSlide {
	0% {
		opacity: 0;
		transform: translateY(105%);
	}
	3% {
		opacity: 1;
		transform: none;
	}
	24% {
		opacity: 1;
		transform: none;
	}
	27%,
	100% {
		opacity: 0;
		transform: translateY(-105%);
	}
}
.rpx-ad__ico {
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 7px;
	background: rgba(255, 255, 255, 0.14);
}
.rpx-ad__ico svg {
	display: block;
	width: 15px;
	height: 15px;
	fill: var(--rsun);
}
.rpx-ad__t {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.rpx-ad__t b {
	display: block;
	font: 700 11.5px/1.1 var(--rfh);
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.rpx-ad__t small {
	display: block;
	font: 500 8.5px/1 var(--rfb);
	color: rgba(255, 255, 255, 0.72);
}
.rpx-ad__btn {
	flex: none;
	display: block;
	font: 700 8.5px/1 var(--rfb);
	color: #13233a;
	background: var(--rsun);
	padding: 6px 9px;
	border-radius: 999px;
	white-space: nowrap;
}
.rpx-ad--0 .rpx-ad__ico {
	background: #e6eefb;
}
.rpx-ad--0 .rpx-ad__ico svg {
	fill: var(--rb);
}
.rpx-ad--0 .rpx-ad__t b {
	color: var(--rb);
}
.rpx-ad--0 .rpx-ad__t small {
	color: #7b8ba3;
}
.rpx-ad--0 .rpx-ad__btn {
	background: var(--rb);
	color: #fff;
}
.rpx-cursor {
	position: absolute;
	z-index: 4;
	right: var(--cx);
	top: var(--cy);
	display: block;
	width: 14px;
	height: 18px;
	transform-origin: 1px 1px;
	animation: rpxCursor 3s ease-in-out infinite;
}
.rpx-cursor svg {
	display: block;
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, 0.4));
}
@keyframes rpxCursor {
	0% {
		opacity: 0;
		transform: translate(46px, 26px);
	}
	22% {
		opacity: 1;
	}
	56%,
	60% {
		transform: none;
	}
	64% {
		transform: scale(0.78);
	}
	70% {
		transform: none;
	}
	88% {
		opacity: 1;
		transform: none;
	}
	100% {
		opacity: 0;
		transform: translate(10px, 12px);
	}
}
.rpx-ripple {
	position: absolute;
	z-index: 3;
	right: calc(var(--cx) + 3px);
	top: calc(var(--cy) - 11px);
	display: block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, 0.95);
	box-shadow: 0 0 0 1px rgba(17, 87, 196, 0.35);
	opacity: 0;
	animation: rpxRipple 3s ease-out infinite;
}
@keyframes rpxRipple {
	0%,
	62% {
		opacity: 0;
		transform: scale(0.3);
	}
	65% {
		opacity: 1;
	}
	88%,
	100% {
		opacity: 0;
		transform: scale(1.7);
	}
}
.rpx-pop {
	position: absolute;
	z-index: 5;
	right: calc(var(--cx) - 8px);
	top: calc(var(--cy) - 27px);
	display: block;
	font: 800 8.5px/1 var(--rfb);
	color: #0b6b47;
	background: #d9f5e8;
	border: 1px solid #a9e3c8;
	padding: 3px 6px;
	border-radius: 999px;
	white-space: nowrap;
	opacity: 0;
	animation: rpxPop 3s ease-out infinite;
}
@keyframes rpxPop {
	0%,
	62% {
		opacity: 0;
		transform: translateY(6px);
	}
	70% {
		opacity: 1;
		transform: none;
	}
	90% {
		opacity: 1;
		transform: translateY(-4px);
	}
	100% {
		opacity: 0;
		transform: translateY(-8px);
	}
}
.rpx-dots {
	display: flex;
	gap: 4px;
	margin: 6px 9px 0;
}
.rpx-dots i {
	position: relative;
	display: block;
	flex: 1;
	height: 3px;
	border-radius: 2px;
	background: #e3e9f2;
	overflow: hidden;
}
.rpx-dots i::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--rb2);
	transform: scaleX(0);
	transform-origin: left;
	animation: rpxDot 12s linear infinite backwards;
}
.rpx-dots i:nth-child(2)::after {
	animation-delay: 3s;
}
.rpx-dots i:nth-child(3)::after {
	animation-delay: 6s;
}
.rpx-dots i:nth-child(4)::after {
	animation-delay: 9s;
}
@keyframes rpxDot {
	0% {
		transform: scaleX(0);
		opacity: 1;
	}
	25% {
		transform: scaleX(1);
		opacity: 1;
	}
	26%,
	100% {
		transform: scaleX(1);
		opacity: 0;
	}
}
.rpx-skel {
	display: grid;
	grid-template-columns: 1.55fr 1fr;
	gap: 7px;
	margin: 8px 9px 9px;
}
.rpx-skel i {
	display: block;
	height: 46px;
	border: 1px solid #e7ecf2;
	border-radius: 6px;
	background:
		linear-gradient(#e3e9f2, #e3e9f2) 8px 8px/40% 5px no-repeat,
		linear-gradient(#f1f4f8, #f1f4f8) 8px 19px/80% 9px no-repeat,
		linear-gradient(#f1f4f8, #f1f4f8) 8px 32px/60% 9px no-repeat,
		#fff;
}
.rpx-skel i + i {
	background:
		linear-gradient(#e3e9f2, #e3e9f2) 8px 8px/45% 5px no-repeat,
		linear-gradient(var(--rnavy), var(--rnavy)) 8px 18px/40% 10px no-repeat,
		linear-gradient(90deg, #f2a93b 0 30%, #e6ecf4 30%) 8px 34px/80% 4px no-repeat,
		#fff;
}
.rpx-live {
	display: flex;
	align-items: center;
	gap: 5px;
	font: 700 7.5px/1 var(--rfb);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #2e9e73;
	white-space: nowrap;
}
.rpx-live i {
	display: block;
	flex: none;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--rmint2);
	animation: rpxLive 1.6s ease-out infinite;
}
@keyframes rpxLive {
	0% {
		box-shadow: 0 0 0 0 rgba(63, 184, 138, 0.55);
	}
	100% {
		box-shadow: 0 0 0 7px rgba(63, 184, 138, 0);
	}
}
.rpx-num {
	display: inline-block;
	font: 700 11px/1 var(--rfh);
	color: var(--rnavy);
	font-variant-numeric: tabular-nums;
}
.rpx-num.bump {
	animation: rpxBump 0.6s ease-out;
}
@keyframes rpxBump {
	0% {
		color: #2e9e73;
		transform: scale(1.3);
	}
	100% {
		color: var(--rnavy);
		transform: none;
	}
}
.rpx-a__offer {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 9px;
}
/* sidebar A */
.rpx-side .rpx-a__stage {
	display: block;
	padding: 0;
	margin-top: 11px;
}
.rpx-side .rpx-win {
	width: 100%;
	border-bottom: 1px solid #d3dce8;
	border-radius: 9px;
	box-shadow: 0 10px 24px -14px rgba(32, 41, 69, 0.4);
}
.rpx-side .rpx-slot {
	height: 56px;
}
.rpx-side .rpx-ad {
	gap: 7px;
	padding: 0 8px;
}
.rpx-side .rpx-ad__ico {
	width: 24px;
	height: 24px;
	border-radius: 6px;
}
.rpx-side .rpx-ad__ico svg {
	width: 12px;
	height: 12px;
}
.rpx-side .rpx-ad__t b {
	white-space: normal;
	font-size: 10.5px;
	line-height: 1.08;
}
.rpx-side .rpx-ad__t small {
	font-size: 7.5px;
}
.rpx-side .rpx-ad__btn {
	display: none;
}
.rpx-side .rpx-slotwrap {
	--cx: 30px;
	--cy: 32px;
}
.rpx-strip {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	margin: 7px 9px 8px;
	padding: 6px 8px;
	border-radius: 6px;
	background: var(--rwash);
}
.rpx-strip__kv {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	font: 600 7px/1 var(--rfb);
	color: #7b8ba3;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.rpx-strip__kv .rpx-num {
	font-size: 12.5px;
	letter-spacing: 0;
}
.rpx-a__buy {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: 12px;
}
.rpx-side .rpx-price b {
	font-size: 24px;
}
.rpx-side .rpx-a__buy .rpx-save {
	font-size: 9px;
	padding: 4px 6px;
}
@media (max-width: 980px) {
	.rpx-top .rpx-win {
		width: 300px;
	}
	.rpx-top.rpx-a .rpx-h {
		font-size: 20px;
	}
}
@media (max-width: 760px) {
	.rpx-top .rpx-a__copy,
	.rpx-top .rpx-a__stage,
	.rpx-top .rpx-a__offer {
		flex: 1 1 100%;
	}
	.rpx-top .rpx-a__stage {
		padding: 0;
		height: auto;
	}
	.rpx-top .rpx-win {
		width: 100%;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		background: transparent;
	}
	.rpx-top .rpx-win__bar,
	.rpx-top .rpx-win__nav,
	.rpx-top .rpx-skel {
		display: none;
	}
	.rpx-top .rpx-slotwrap,
	.rpx-top .rpx-dots {
		margin-left: 0;
		margin-right: 0;
	}
	.rpx-top .rpx-a__offer {
		flex-direction: row;
		justify-content: space-between;
	}
	.rpx-top.rpx-a .rpx-h {
		font-size: 19px;
	}
}

/* ===== Concept B — state map ===== */
.rpx-b.rpx-top {
	background: linear-gradient(90deg, var(--rwash) 0, var(--rwash) 334px, #fff 334px);
}
.rpx-b__geo {
	flex: none;
	display: flex;
	align-items: center;
	gap: 20px;
	align-self: stretch;
	width: 310px;
}
.rpx-map {
	--t: 12px;
	--g: 2px;
	position: relative;
	flex: none;
	display: grid;
	grid-template-columns: repeat(11, var(--t));
	grid-template-rows: repeat(8, var(--t));
	gap: var(--g);
}
.rpx-map i {
	position: relative;
	display: block;
	grid-row: var(--r);
	grid-column: var(--c);
	border-radius: calc(var(--t) * 0.24);
	background: #d3def5;
	transition:
		transform 0.35s cubic-bezier(0.2, 0.9, 0.3, 1.4),
		box-shadow 0.35s,
		background-color 0.35s;
	animation: rpxTile 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.4) backwards;
	animation-delay: calc((var(--r) + var(--c)) * 40ms);
}
.rpx-map i.t2 {
	background: #abc1ee;
}
.rpx-map i.t3 {
	background: #7a9de4;
}
.rpx-map i.t4 {
	background: #4675d6;
}
.rpx-map i.t5 {
	background: #1f5fd0;
}
@keyframes rpxTile {
	0% {
		opacity: 0;
		transform: scale(0.3);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
.rpx-map i.is-spot {
	z-index: 3;
	transform: scale(1.4);
	background: var(--rsun);
	box-shadow:
		0 0 0 2px #fff,
		0 4px 10px rgba(32, 41, 69, 0.4);
}
.rpx-map i.p::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	border: 1.5px solid var(--rmint2);
	opacity: 0;
	animation: rpxPing 3.6s ease-out infinite;
	animation-delay: var(--d, 0s);
}
@keyframes rpxPing {
	0% {
		opacity: 0.95;
		transform: scale(1);
	}
	70%,
	100% {
		opacity: 0;
		transform: scale(2.7);
	}
}
.rpx-read {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
.rpx-read__k {
	display: block;
	font: 700 8px/1 var(--rfb);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #7b8ba3;
}
.rpx-read__st {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 5px;
	font: 700 15px/1.05 var(--rfh);
	color: var(--rnavy);
	white-space: nowrap;
}
.rpx-read__st::before {
	content: "";
	flex: none;
	width: 9px;
	height: 9px;
	border-radius: 3px;
	background: var(--rsun);
}
.rpx-read__n {
	display: block;
	font: 600 11px/1.2 var(--rfb);
	color: var(--rmute);
}
.rpx-read__n b {
	display: block;
	font: 700 27px/1.05 var(--rfh);
	letter-spacing: -0.02em;
	color: var(--rb);
	font-variant-numeric: tabular-nums;
}
.rpx-read.flip .rpx-read__st,
.rpx-read.flip .rpx-read__n {
	animation: rpxFlipIn 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes rpxFlipIn {
	0% {
		opacity: 0;
		transform: translateY(7px);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
.rpx-b__copy {
	flex: 1 1 260px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.rpx-top.rpx-b .rpx-h {
	font-size: 27px;
	line-height: 1.06;
	margin-top: 3px;
}
.rpx-top.rpx-b .rpx-logo {
	width: 184px;
}
.rpx-side.rpx-b .rpx-logo {
	width: 142px;
}
.rpx-side.rpx-b .rpx-h {
	font-size: 21px;
	line-height: 1.1;
}
.rpx-top.rpx-b .rpx-sub {
	font-size: 12.5px;
}
.rpx-b__buy {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.rpx-b__buy small {
	display: block;
	font: 600 13px/1 var(--rfb);
	color: var(--rmute);
	white-space: nowrap;
}
.rpx-b__buy small b {
	color: var(--rnavy);
	font-weight: 800;
}
/* sidebar B */
.rpx-side.rpx-b .rpx-map {
	--t: 17px;
	margin: 12px auto 0;
}
.rpx-read--row {
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: 10px;
	padding: 8px 10px;
	border-radius: 8px;
	background: var(--rwash);
}
.rpx-read--row .rpx-read__st {
	margin: 0;
	font-size: 13.5px;
}
.rpx-read--row .rpx-read__n {
	display: flex;
	align-items: baseline;
	gap: 4px;
	white-space: nowrap;
}
.rpx-read--row .rpx-read__n b {
	display: inline;
	font-size: 18px;
}
.rpx-b__foot {
	display: block;
	margin-top: 9px;
	text-align: center;
	font: 600 13px/1 var(--rfb);
	color: var(--rmute);
}
.rpx-b__foot b {
	color: var(--rnavy);
	font-weight: 800;
}
@media (max-width: 1120px) {
	.rpx-top.rpx-b .rpx-h {
		font-size: 22px;
	}
	.rpx-top.rpx-b .rpx-logo {
		width: 160px;
	}
}
@media (max-width: 900px) {
	.rpx-top .rpx-b__buy small {
		display: none;
	}
}
@media (max-width: 760px) {
	.rpx-b.rpx-top {
		background: #fff;
	}
	.rpx-top .rpx-b__geo {
		width: auto;
		flex: 1 1 100%;
		padding: 10px;
		border-radius: 8px;
		background: var(--rwash);
	}
	.rpx-top .rpx-b__copy {
		flex: 1 1 100%;
	}
	.rpx-top .rpx-b__buy {
		flex: 1 1 100%;
		flex-direction: row;
		justify-content: space-between;
	}
	.rpx-top .rpx-b__buy small {
		display: block;
		white-space: normal;
		text-align: right;
		line-height: 1.25;
	}
	.rpx-top.rpx-b .rpx-h {
		font-size: 22px;
	}
	.rpx-top.rpx-b .rpx-logo {
		width: 160px;
	}
}