/* =========================================================================
 * snifffr — Desktop Redesign stylesheet.
 *
 * Companion to `snifffr-mobile-redesign.css`. Loaded only for users on the
 * allowlist (see `snifffr_desktop_redesign_enabled()`); the body class
 * `snifffr-desktop-beta` is the namespace anchor so every selector here
 * stays inert for non-flagged users even if this file is mistakenly
 * loaded.
 *
 * Breakpoint contract:
 *   - Mobile redesign owns         max-width: 991.98px
 *   - Desktop redesign owns        min-width: 992px
 * Everything in this file MUST live inside `@media (min-width: 992px)` so
 * we don't fight `snifffr-mobile-redesign.css` on the mobile range.
 *
 * Class namespace: `snifffr-dp-*` (desktop profile).
 * Wrap class:      `.snifffr-profile-desktop-redesign-wrap` (mirrors the
 *                  `.snifffr-profile-desktop-wrap` / `.snifffr-profile-mobile-wrap`
 *                  pair from the mobile redesign).
 *
 * Design tokens — kept inline rather than CSS custom properties so the
 * stylesheet works in older browsers without :root vars and so future
 * search/replace stays predictable.
 *   Pink primary       #e85d8f
 *   Pink primary hover #d24a7d
 *   Lavender accent    #e7e2ff
 *   Text default       #1a1a1a
 *   Text muted         #6b7280
 *   Border             #e5e7eb
 *   Online green       #10b981
 * ========================================================================= */

@media (min-width: 992px) {

	body.snifffr-desktop-beta .snifffr-profile-desktop-wrap {
		/* Hide the legacy desktop chrome for flagged users on desktop. */
		display: none !important;
	}

	body.snifffr-desktop-beta .snifffr-profile-desktop-redesign-wrap {
		display: block;
		width: 100%;
		min-width: 0;
	}

	/* Kill any horizontal scroll on plugin tabs. Each plugin (private-content,
	   instant-unlocks, reviews, friends, etc.) emits its own inline <style>
	   + position:fixed lightboxes via bp_template_content. With the wrap
	   that hides those plugins (.snifffr-profile-desktop-wrap is
	   display:none above) the content shouldn't matter, but the redesign
	   wrap also re-fires `bp_template_content`, double-mounting some of
	   that markup. One of those mounts pokes past the viewport just enough
	   to trip a horizontal scrollbar — which pulls the viewport under
	   Bootstrap's 1200px breakpoint and squeezes the navbar/seller-menu
	   container to the 960px tier. Clamping body at the document root
	   prevents the chain regardless of which element is the offender.
	   Scoped to .snifffr-desktop-beta so non-beta users are unaffected.
	   max-width 100% (not 100vw): `100vw` includes the vertical scrollbar
	   gutter, so on pages with a scrollbar the body extends scrollbar_width
	   past the visible area and overflow-x:clip then hides the rightmost
	   slice of every navbar / hero / footer that's set to fill the body.
	   `100%` resolves against the html content box (excludes the scrollbar)
	   so the body width matches the visible viewport. */
	body.snifffr-desktop-beta {
		overflow-x: clip;
		max-width: 100%;
	}

	/* Sticky footer for the desktop redesign.
	   Legacy snifffr CSS sets `body { margin-bottom: 470px }` to reserve
	   space for the mobile .fixfoot bottom nav. On desktop >=992px the
	   .fixfoot isn't rendered, so that reserve is dead weight — it pushes
	   the footer 470px below where the eye expects it and exposes empty
	   page below. Zero it out for beta users.
	   Then give the redesign wrap a min-height large enough to absorb
	   any short-page state and push the (legacy) footer down to the
	   viewport bottom. 100px is the measured snifffr top-nav height —
	   adjust if the navbar grows. */
	/* Sticky-footer rewrite for desktop redesign.
	   1. Body becomes the positioning anchor (`position: relative`,
	      `min-height: 100vh`). Padding-bottom matches the footer height so
	      content can't slide under the footer.
	   2. <footer> is pinned absolutely at the bottom of body. We let it
	      auto-size (legacy custom.css:6196 already sets `height: 470px` —
	      we keep that contract intact at desktop) so the full 4-column
	      widget grid + disclaimer all sit inside the visible footer.
	   3. .seller-menu (legacy breadcrumb that shows the displayed user
	      name in a dark purple strip) is redundant — the redesign has
	      its own identity row inside .snifffr-dp. Hide it.
	   4. Kill the legacy body margin-bottom that reserves space for
	      the mobile .fixfoot bottom bar (not rendered at >=992px). */
	body.snifffr-desktop-beta {
		position: relative !important;
		min-height: 100vh;
		padding-bottom: 500px !important;
		margin-bottom: 0 !important;
		box-sizing: border-box;
	}
	body.snifffr-desktop-beta #full-width-content {
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}
	body.snifffr-desktop-beta footer {
		position: absolute !important;
		bottom: 0;
		left: 0;
		right: 0;
		height: auto !important;
		min-height: 470px;
		max-height: none !important;
		overflow: visible !important;
		padding-top: 56px !important;
		padding-bottom: 24px !important;
		z-index: 1;
		/* Softened mid-tone purple. Same family as the brand --color-purple
		   (#332e4d) but lifted so the transition from the lavender body
		   above doesn't feel like jumping into a different design system.
		   Still anchors the page as a "footer" zone and gives white text
		   ~7.5:1 contrast (WCAG AAA). Original prod is #332e4d; previous
		   redesign value was #2A2541 (too dark/cool). */
		background: #4F4470 !important;
	}

	/* The mobile accordion pill is irrelevant at desktop — custom.css:9910
	   already hides it at >=768px but Bootstrap's .btn.btn-primary default
	   bites back occasionally. Belt-and-braces hide at >=992px. */
	body.snifffr-desktop-beta footer .purpfooter,
	body.snifffr-desktop-beta footer #fobut {
		display: none !important;
	}
	/* Always show the .collapse content at desktop — no accordion. The
	   `.card-body` border / margin Bootstrap paints would otherwise outline
	   the grid; zero it for a clean dark surface. */
	body.snifffr-desktop-beta footer #collapseExamples {
		display: block !important;
	}
	body.snifffr-desktop-beta footer #collapseExamples .card,
	body.snifffr-desktop-beta footer #collapseExamples .card-body {
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* 4-column widget grid. The markup is .col-md-3 × 4 inside .row, which
	   Bootstrap already lays out as 4 columns at >=768px. We just need to
	   ensure the .container is centred and reasonably wide. */
	body.snifffr-desktop-beta footer > .container {
		max-width: 1200px;
		padding-left: 30px;
		padding-right: 30px;
	}
	body.snifffr-desktop-beta footer .row {
		margin: 0 -16px;
	}
	body.snifffr-desktop-beta footer .row > [class*="col-"] {
		padding: 0 16px;
	}

	/* Section headings (h4) — uppercase, small, letter-spaced.
	   Override legacy `footer h4 { font-family: montserratlight; font-size: 1.1rem }`
	   from custom.css:6252. */
	body.snifffr-desktop-beta footer h4,
	body.snifffr-desktop-beta footer h2,
	body.snifffr-desktop-beta footer .widget-title,
	body.snifffr-desktop-beta footer .widgettitle {
		color: #fff !important;
		font-family: inherit !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		letter-spacing: 0.16em !important;
		text-transform: uppercase !important;
		margin: 0 0 18px !important;
		padding: 0 !important;
		line-height: 1 !important;
	}

	/* Column lists — kill the legacy `footer ul { margin-left: -40px }`
	   (custom.css:6250) that pulls links off-grid. */
	body.snifffr-desktop-beta footer ul,
	body.snifffr-desktop-beta footer ol {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta footer ul li,
	body.snifffr-desktop-beta footer ol li {
		margin: 0 0 10px !important;
		padding: 0 !important;
		line-height: 1.4 !important;
	}

	/* Link colours — muted lavender-grey default, pink on hover. Overrides
	   custom.css:6206 (`footer a { color: #fff; font-size: 0.9rem }`). */
	body.snifffr-desktop-beta footer a {
		color: #c9c4dc !important;
		font-size: 13.5px !important;
		font-weight: 400 !important;
		text-decoration: none !important;
		transition: color 0.15s ease;
	}
	body.snifffr-desktop-beta footer a:hover,
	body.snifffr-desktop-beta footer a:focus {
		color: #E65C95 !important;
	}

	/* Disclaimer line — sits below the 4-column grid as a centred caption.
	   The legacy markup wraps it in <font size="1" style="color:#fff"> with
	   inline styles, plus child <a style="font-size: 10px"> overrides; we
	   force-restyle here so it reads as a quiet footer caption. */
	body.snifffr-desktop-beta footer #collapseExamples > div[style*="text-align"] {
		text-align: center !important;
		margin-top: 36px !important;
		padding-top: 24px !important;
		border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	}
	body.snifffr-desktop-beta footer #collapseExamples > div[style*="text-align"] font {
		font-size: 11px !important;
		font-weight: 400 !important;
		color: #8b85a6 !important;
		letter-spacing: 0.02em;
	}
	body.snifffr-desktop-beta footer #collapseExamples > div[style*="text-align"] font a {
		font-size: 11px !important;
		color: #c9c4dc !important;
	}
	body.snifffr-desktop-beta footer #collapseExamples > div[style*="text-align"] font a:hover {
		color: #E65C95 !important;
	}
	/* On a member's single-profile page the .seller-menu <h1> repeats the
	   displayed user name that the redesign already renders inside
	   .snifffr-dp-name. Hide the duplicate <h1> only, keep the bar +
	   role-based nav (Profile / Messages / Settings / Logout) visible —
	   the user wants the seller-menu present on every logged-in page. */
	body.snifffr-desktop-beta.bp-user .seller-menu h1 {
		display: none !important;
	}
	body.snifffr-desktop-beta.bp-user .seller-menu .container {
		justify-content: flex-end !important;
	}

	/* ── Top navbar (.navbar.navbar-expand-md.navbar-light.bg-light) ───
	   Legacy chrome was flat white with Montserrat-light all-caps text,
	   no hover state, no active indicator. Modernise:
	   - White card-feeling bar with soft shadow + 1px lavender bottom
	     border so it cleanly delimits from the lavender .seller-menu
	     below (the two bars used to bleed into each other).
	   - 12px tight-tracking uppercase nav links in muted purple, with a
	     pink hover/active state and a growing underline indicator
	     anchored to the bottom of each link (modern microinteraction).
	   - 12px gap between items; generous vertical padding for hit area.
	   - Brand-pink Live Chat pill, smaller + rounder so it reads as a
	     branded CTA rather than a button bolted on.
	   - Logo scales subtly on hover. */
	body.snifffr-desktop-beta .navbar.navbar-expand-md.navbar-light,
	body.snifffr-desktop-beta nav.navbar.navbar-expand-md {
		background: #fff !important;
		border-bottom: 1px solid rgba(66, 62, 89, 0.08) !important;
		box-shadow: 0 1px 3px rgba(66, 62, 89, 0.04) !important;
		padding: 12px 0 !important;
		min-height: 64px;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md > .container {
		align-items: center;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-brand {
		padding: 0 !important;
		margin-right: 24px !important;
		display: inline-flex;
		align-items: center;
		transition: transform 0.15s ease;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-brand:hover,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-brand:focus-visible {
		transform: scale(1.03);
		outline: none;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-brand img {
		max-height: 27px;
		width: auto;
		display: block;
	}
	/* Bootstrap navbar-collapse default is `flex-basis: 100%` (pushes
	   nav to next row). Override so the nav sits inline with the brand,
	   right-aligned. */
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-collapse {
		flex-grow: 1;
		justify-content: flex-end;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav {
		display: flex !important;
		flex-direction: row !important;
		align-items: center;
		gap: 4px;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li {
		position: relative;
		padding: 0;
		margin: 0;
		list-style: none;
	}
	/* Modernised nav-link — muted purple at rest, pink on hover/active,
	   underline indicator grows in from the centre. */
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li > a,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .nav-link,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link {
		position: relative !important;
		display: inline-flex !important;
		align-items: center !important;
		gap: 6px !important;
		padding: 8px 12px !important;
		font-family: 'montserratregular', -apple-system, BlinkMacSystemFont, sans-serif !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		letter-spacing: 0.08em !important;
		text-transform: uppercase !important;
		color: rgba(66, 62, 89, 0.78) !important;
		text-decoration: none !important;
		transition: color 0.15s ease !important;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li > a::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link::after {
		content: "";
		position: absolute;
		left: 12px;
		right: 12px;
		bottom: 2px;
		height: 2px;
		background: var(--snifffr-mp-pink, #E65C95);
		border-radius: 2px;
		transform: scaleX(0);
		transform-origin: center;
		transition: transform 0.18s ease;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li > a:hover,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li > a:focus-visible,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .nav-link:hover,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .nav-link:focus,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link:hover {
		color: var(--snifffr-mp-pink, #E65C95) !important;
		outline: none !important;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li > a:hover::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link:hover::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link:focus::after {
		transform: scaleX(1);
	}
	/* Active page — persistent pink + underline. */
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li.current-menu-item > a,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li.current_page_item > a,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .nav-link.active,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .active > .nav-link {
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li.current-menu-item > a::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav > li.current_page_item > a::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .nav-link.active::after,
	body.snifffr-desktop-beta .navbar.navbar-expand-md .navbar-light .navbar-nav .active > .nav-link::after {
		transform: scaleX(1);
	}
	/* Bootstrap Bi icons inside nav-link (e.g. Live Chat chat-bubble). */
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link .bi,
	body.snifffr-desktop-beta .navbar.navbar-expand-md ul.navbar-nav .nav-link i {
		font-size: 14px;
		line-height: 1;
	}
	/* Live Chat upgrade pill — kept inline at the right edge of the nav.
	   Soften from the legacy heavy fill to a smaller pink pill matching
	   the redesign's button language. */
	body.snifffr-desktop-beta .navbar.navbar-expand-md .btn.btn-primary.pink.lc {
		margin-left: 10px !important;
		padding: 7px 16px !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		letter-spacing: 0.08em !important;
		text-transform: uppercase !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		box-shadow: 0 2px 6px rgba(230, 92, 149, 0.25) !important;
		transition: background 0.15s ease, transform 0.05s ease !important;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md .btn.btn-primary.pink.lc:hover {
		background: #d24a7d !important;
	}
	body.snifffr-desktop-beta .navbar.navbar-expand-md .btn.btn-primary.pink.lc:active {
		transform: translateY(1px);
	}

	/* Everywhere ELSE — restyle the .seller-menu so it stops reading as a
	   heavy dark-purple shout-bar. The legacy gives it
	   `background: var(--color-purple)` (#332e4d) with white text.
	   Redesign: light lavender-tinted surface (sits between the white
	   navbar and the lavender-grey body), dark text, subtle bottom
	   border. The role-based nav items (Profile / Messages / Settings /
	   Logout — which appear as text links inside this bar) get the
	   same muted grey treatment as our chip language. */
	body.snifffr-desktop-beta .seller-menu {
		background: #ebe4f5 !important;        /* soft lavender — clearly purple, still calm vs. white navbar + #edecf0 body */
		border-bottom: 1px solid #d6cce6 !important;
		box-shadow: none !important;
		padding: 14px 0 !important;
	}

	/* At >=992px the legacy <ul.navbar-nav> still renders in the DOM (it's
	   the chrome non-beta users see, and beta users on mobile) — hide it
	   so only the .snifffr-sm-avatar-wrap shows on the right of the bar.
	   The mirrored hide for <992px lives outside this @media block so the
	   seller-menu / buyer-menu wp_nav_menu items never render as visible
	   chrome for desktop-beta users at any viewport (the mobile drawer +
	   desktop avatar dropdown both surface the same destinations). */

	/* Replaces the legacy #menu-seller-menu / #menu-buyer-menu strip with
	   a single circular avatar link to /profile/ (rendered server-side
	   from header.php). Sits on the right of the .seller-menu bar where
	   the pills used to live; the page title <h1> still sits on the left. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 50%;
		overflow: hidden;
		background: #fff;
		border: 2px solid #fff;
		box-shadow: 0 2px 6px rgba(51, 46, 77, 0.12);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar:hover,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar:focus-visible {
		transform: translateY(-1px);
		box-shadow: 0 4px 12px rgba(232, 93, 143, 0.25);
		outline: none;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar .snifffr-sm-avatar-img,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar img {
		width: 36px;
		height: 36px;
		border-radius: 50%;
		object-fit: cover;
		display: block;
	}

	/* Hover-open dropdown under the avatar — same pattern as the legacy
	   seller-menu sub-menus. The wrap is `position: relative` so the
	   dropdown card anchors to the avatar's bottom-right; `margin-top: 0`
	   keeps the cursor inside the .dropdown wrap during the avatar →
	   dropdown traversal so the menu doesn't snap shut. Items: Profile /
	   Support / Log out. `margin-left: auto` ensures the wrap floats to
	   the right of the seller-menu flex row even when no page <h1> is
	   present (otherwise the lone child gets pushed to the left). */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap {
		position: relative;
		display: inline-block;
		margin-left: auto;
		flex: 0 0 auto;
	}

	/* Quick-actions group — Messages + Notifications icons pinned to the
	   LEFT of the .seller-menu bar, sitting visually below the navbar
	   logo. `margin-right: auto` consumes leftover space in the flex row,
	   pushing the page title / avatar dropdown to the far right.
	   Wrapper height matches the avatar chip (36px) so the row stays
	   vertically centred.
	   Design rationale: muted-default + pink hover halo mirrors the
	   mobile bottom-nav's pattern. Pink stays reserved for the brand's
	   action signal (badges + hover) rather than being burned on
	   always-on chrome. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-quick {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		height: 36px;
		margin-right: auto;
		flex: 0 0 auto;
	}

	/* Individual icon chips — 36px square hit area, transparent at rest,
	   pink halo + pink icon on hover. Same chrome for chat-heart and bell
	   so they read as a paired cluster. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-notif {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 50%;
		color: #423E59;                    /* muted purple — matches identity text */
		text-decoration: none !important;
		background: transparent;
		transition: background 0.15s ease, color 0.15s ease;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg:hover,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg:focus-visible,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-notif:hover,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-notif:focus-visible {
		background: rgba(232, 92, 149, 0.10);
		color: #e65c95;
		outline: none;
	}
	/* Subtle pink tint at rest when there's unread — draws the eye to
	   where the activity is, even before the user reads the badge count.
	   Same idea as Slack's tinted icons for unread DMs. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg.has-unread,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-notif.has-unread {
		color: #e65c95;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg .bi,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-notif .bi {
		font-size: 20px;
		line-height: 1;
		color: inherit;
	}

	/* Unread badge — pink count pill at top-right corner of the chip.
	   Ring colour matches the .seller-menu lavender background so the
	   badge appears to be "punched through" the bar. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg-badge {
		position: absolute;
		top: 0;
		right: 0;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		background: #e65c95;
		color: #fff;
		border-radius: 999px;
		font-size: 10px;
		font-weight: 700;
		line-height: 1;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 0 0 2px #ebe4f5;
		letter-spacing: 0;
	}

	/* Unread badge — pink pill anchored to top-right of the chip. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-msg-badge {
		position: absolute;
		top: -4px;
		right: -4px;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		background: var(--snifffr-mp-pink, #E65C95);
		color: #fff;
		border-radius: 999px;
		font-size: 10px;
		font-weight: 700;
		line-height: 1;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 0 0 2px #fff;
		letter-spacing: 0;
	}

	/* Tokens pill — coin icon + balance, always-visible inline. Reads as
	   the third member of the quick-action row but trades the 36px circle
	   hit-area for a pill that surfaces the count without needing a
	   notification badge. Style follows the same muted-purple → pink-on-
	   hover language as the chat / bell icons. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-tokens {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		height: 32px;
		margin-left: 10px;
		padding: 0 12px 0 10px;
		border-radius: 999px;
		background: rgba(66, 62, 89, 0.06);
		color: var(--snifffr-mp-purple, #423E59);
		text-decoration: none !important;
		font-size: 13px;
		font-weight: 700;
		line-height: 1;
		transition: background 0.15s ease, color 0.15s ease;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-tokens:hover,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-tokens:focus-visible {
		background: rgba(232, 92, 149, 0.12);
		color: var(--snifffr-mp-pink, #E65C95);
		outline: none;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-tokens .bi {
		font-size: 18px;
		line-height: 1;
		color: var(--snifffr-mp-pink, #E65C95);
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-tokens-count {
		font-variant-numeric: tabular-nums;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-menu {
		position: absolute !important;
		top: 100% !important;
		right: 0 !important;
		left: auto !important;          /* override Bootstrap's .dropdown-menu { left: 0 } */
		margin: 0 !important;
		padding: 6px !important;
		min-width: 0;                    /* shrink-to-fit — let the longest label set the width */
		width: max-content;
		max-width: calc(100vw - 32px);   /* never overflow the viewport on narrow widths */
		list-style: none;
		background: #fff !important;
		border: 1px solid rgba(51, 46, 77, 0.08) !important;
		border-radius: 12px !important;
		box-shadow: 0 8px 24px rgba(51, 46, 77, 0.12) !important;
		z-index: 1050;
		display: none;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap:hover .snifffr-sm-avatar-menu,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap:focus-within .snifffr-sm-avatar-menu {
		display: block;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-menu li {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	/* Selector chained with `.snifffr-sm-avatar-wrap` to bump specificity
	   above the legacy `.seller-menu .dropdown-menu li a` rule (line ~349)
	   which forces `justify-content: space-between !important` for legacy
	   count-badge sub-menus. Same specificity + same !important means
	   source order wins — and the legacy rule lives later in this file,
	   so my earlier override was losing. */
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap .snifffr-sm-avatar-menu li a {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		padding: 9px 14px 9px 14px !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		color: #332e4d !important;
		text-decoration: none !important;
		border-radius: 8px !important;
		background: transparent !important;
		box-shadow: none !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		white-space: nowrap !important;
		transition: background 0.15s ease, color 0.15s ease !important;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-menu li a .bi {
		font-size: 14px;
		line-height: 1;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap .snifffr-sm-avatar-menu li a:hover,
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap .snifffr-sm-avatar-menu li a:focus-visible {
		background: #faecf2 !important;
		color: #e85d8f !important;
		outline: none;
	}
	body.snifffr-desktop-beta .seller-menu .container {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 16px !important;
	}
	body.snifffr-desktop-beta .seller-menu h1 {
		color: #332e4d !important;             /* brand purple — matches the bar tint */
		font-size: 18px !important;
		font-weight: 700 !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		margin: 0 !important;
		line-height: 1.2 !important;
	}
	/* Nav items inside the seller-menu / buyer-menu — currently render
	   as white uppercase text on the dark purple. Tone them down to
	   match the rest of the chip language. */
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav {
		margin: 0 !important;
		padding: 0 !important;
		display: flex !important;
		align-items: center !important;
		gap: 8px !important;
		list-style: none !important;
	}
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav li {
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}
	/* Pill rule scoped to TOP-LEVEL nav links only (direct child of
	   ul.navbar-nav) — without the `>` selector this cascaded into
	   dropdown rows and made each row render as its own scalloped pill
	   floating on the legacy dark-purple <ul.dropdown-menu> background. */
	body.snifffr-desktop-beta .seller-menu > .container > ul.navbar-nav > li > a,
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav > li > a {
		display: inline-flex !important;
		align-items: center !important;
		padding: 6px 14px !important;
		background: #fff !important;
		color: #332e4d !important;             /* brand purple — keeps pill text on-theme */
		border-radius: 999px !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		text-decoration: none !important;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
		transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
	}
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav > li > a:hover {
		background: #e85d8f !important;
		color: #fff !important;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3) !important;
	}
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav > li.current-menu-item > a,
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav > li.current_page_item > a {
		background: #e85d8f !important;
		color: #fff !important;
	}

	/* Dropdown card — the legacy theme paints this dark purple with white
	   pill rows. Re-render as a clean white card with flat rows, subtle
	   row dividers, and pink hover. Matches the rest of the redesign.

	   IMPORTANT: margin-top MUST stay 0. The legacy hover-open rule
	   `.dropdown:hover > .dropdown-menu { display: block }` (custom.css)
	   relies on the cursor staying inside the .dropdown <li>. Any
	   transparent margin between the toggle pill and the dropdown card
	   becomes a dead zone — cursor leaves the hover region and the menu
	   snaps shut before the user can click an item. The 6px internal
	   padding gives the visual breathing room without breaking hover. */
	body.snifffr-desktop-beta .seller-menu .dropdown-menu,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu,
	body.snifffr-desktop-beta .seller-menu ul.navbar-nav li ul {
		background: #fff !important;
		border: 1px solid rgba(51, 46, 77, 0.08) !important;
		border-radius: 12px !important;
		box-shadow:
			0 4px 12px rgba(51, 46, 77, 0.08),
			0 1px 3px rgba(51, 46, 77, 0.05) !important;
		padding: 6px !important;
		margin-top: 0 !important;
		min-width: 220px !important;
		list-style: none !important;
	}

	/* Belt-and-braces: keep the dropdown shown while the cursor is over
	   the dropdown card itself, not just the toggle. Protects against any
	   sub-pixel rounding gap at the seam. */
	body.snifffr-desktop-beta .seller-menu .dropdown-menu:hover,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu:hover {
		display: block !important;
	}
	body.snifffr-desktop-beta .seller-menu .dropdown-menu li,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu li {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
	}
	body.snifffr-desktop-beta .seller-menu .dropdown-menu li + li,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu li + li {
		border-top: 1px solid rgba(51, 46, 77, 0.05) !important;
	}
	body.snifffr-desktop-beta .seller-menu .dropdown-menu a.dropdown-item,
	body.snifffr-desktop-beta .seller-menu .dropdown-menu li a,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu li a {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 10px !important;
		padding: 10px 14px !important;
		background: transparent !important;
		color: #332e4d !important;
		border-radius: 8px !important;
		box-shadow: none !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		text-decoration: none !important;
		white-space: nowrap !important;
		transition: background 0.15s ease, color 0.15s ease !important;
	}
	body.snifffr-desktop-beta .seller-menu .dropdown-menu a.dropdown-item:hover,
	body.snifffr-desktop-beta .seller-menu .dropdown-menu li a:hover,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu li a:hover {
		background: #fce4ec !important;        /* soft pink hover */
		color: #e85d8f !important;
		box-shadow: none !important;
	}

	/* Inline notification/message/friend counter chips inside dropdown rows. */
	body.snifffr-desktop-beta .seller-menu .dropdown-menu a .menu-count,
	body.snifffr-desktop-beta .seller-menu ul.sub-menu li a .menu-count {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		min-width: 20px !important;
		height: 20px !important;
		padding: 0 6px !important;
		background: rgba(51, 46, 77, 0.06) !important;
		color: #332e4d !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		line-height: 1 !important;
	}
	body.snifffr-desktop-beta .snifffr-profile-desktop-redesign-wrap {
		min-height: calc(100vh - 100px - 250px);
	}

	/* ── Shell ────────────────────────────────────────────────────── */
	.snifffr-dp {
		max-width: 1200px;
		margin: 0 auto;
		padding: 0 16px 48px;
		color: #1a1a1a;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	}

	/* ── Header ───────────────────────────────────────────────────── */
	.snifffr-dp-header {
		position: relative;
		border-radius: 20px;
		background: #fff;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 24px rgba(0, 0, 0, 0.06);
		overflow: hidden;
	}

	/* ── Compact header (visitor on a seller's Shop/Gallery/PC/etc.) ──
	   Mirrors mobile's .snifffr-mp-shophead — avatar + name + last-active
	   + Message pill + 3-dot dropdown. Sits between the (hidden in compact
	   mode) full header and the tab strip. */
	.snifffr-dp-shophead {
		display: flex;
		align-items: center;
		gap: 14px;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 16px;
		padding: 14px 18px;
		margin: 0 0 14px;
		box-shadow: 0 1px 2px rgba(66, 62, 89, 0.03), 0 4px 14px rgba(66, 62, 89, 0.06);
	}
	.snifffr-dp-shophead-avatar {
		position: relative;
		flex: 0 0 auto;
		display: block;
		width: 56px;
		height: 56px;
		border-radius: 50%;
		/* overflow:visible (was hidden) so the absolute-positioned online
		   `.snifffr-dp-shophead-dot` isn't clipped by the avatar's circular
		   bounds — only a sliver of the dot showed before. The inner <img>
		   already carries border-radius: 50% so the avatar itself stays
		   circular without the wrap doing the clipping. */
		overflow: visible;
		text-decoration: none !important;
	}
	.snifffr-dp-shophead-avatar img {
		width: 56px !important;
		height: 56px !important;
		max-width: 56px !important;
		max-height: 56px !important;
		object-fit: cover;
		border-radius: 50%;
		display: block;
	}
	.snifffr-dp-shophead-dot {
		position: absolute;
		bottom: 2px;
		right: 2px;
		width: 12px;
		height: 12px;
		background: #4ade80;
		border: 2px solid #fff;
		border-radius: 50%;
		z-index: 2;
	}
	.snifffr-dp-shophead-meta {
		flex: 1 1 auto;
		min-width: 0;
		display: flex;
		flex-direction: column;
		gap: 2px;
	}
	.snifffr-dp-shophead-name {
		font-size: 16px;
		font-weight: 700;
		color: var(--snifffr-mp-purple, #423E59);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.snifffr-dp-shophead-name a {
		color: inherit !important;
		text-decoration: none !important;
	}
	.snifffr-dp-shophead-name a:hover {
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	.snifffr-dp-shophead-active {
		font-size: 12.5px;
		color: var(--snifffr-mp-purple-60, rgba(66, 62, 89, 0.6));
	}

	/* Message pill — primary action, pink fill. */
	.snifffr-dp-shophead-msg {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		flex: 0 0 auto;
		padding: 9px 18px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-decoration: none !important;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-shophead-msg:hover {
		transform: translateY(-1px);
		box-shadow: 0 6px 14px rgba(230, 92, 149, 0.28);
		color: #fff !important;
	}
	.snifffr-dp-shophead-msg .bi {
		font-size: 14px;
		line-height: 1;
	}

	/* 3-dot dropdown — opens on hover/focus-within (same pattern as the
	   header avatar dropdown). Items inside reuse BP-injected friend +
	   block buttons so nonces/AJAX stay intact. */
	.snifffr-dp-shophead-more-wrap {
		position: relative;
		flex: 0 0 auto;
	}
	.snifffr-dp-shophead-more {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		background: transparent !important;
		border: 1px solid rgba(66, 62, 89, 0.14) !important;
		border-radius: 50% !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		font-size: 18px !important;
		line-height: 1 !important;
		padding: 0 !important;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-shophead-more:hover,
	.snifffr-dp-shophead-more:focus-visible {
		background: rgba(232, 92, 149, 0.08) !important;
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
		outline: none;
	}
	.snifffr-dp-shophead-more-menu {
		position: absolute !important;
		top: calc(100% + 6px) !important;
		right: 0 !important;
		left: auto !important;
		margin: 0 !important;
		padding: 6px !important;
		min-width: 200px;
		list-style: none;
		background: #fff !important;
		border: 1px solid rgba(66, 62, 89, 0.08) !important;
		border-radius: 12px !important;
		box-shadow: 0 8px 24px rgba(66, 62, 89, 0.12) !important;
		z-index: 1050;
		display: none;
	}
	/* Transparent hover-bridge that fills the 6px gap between the button
	   and the menu. Without it, the cursor crosses dead space on the way
	   down, the wrap loses :hover, and the menu closes mid-travel. */
	.snifffr-dp-shophead-more-menu::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: -10px;
		height: 10px;
		background: transparent;
	}
	.snifffr-dp-shophead-more-wrap:hover .snifffr-dp-shophead-more-menu,
	.snifffr-dp-shophead-more-wrap:focus-within .snifffr-dp-shophead-more-menu,
	.snifffr-dp-shophead-more-menu:hover {
		display: block;
	}
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item {
		list-style: none;
		margin: 0;
		padding: 0;
		position: relative;
	}
	/* Generic anchor + button styling for items + BP-injected buttons. */
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > button.snifffr-dp-shophead-tip-open,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item .friendship-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item .bpbm-block-member-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > .bp-generic-button > a {
		display: flex !important;
		align-items: center !important;
		gap: 10px !important;
		width: 100% !important;
		padding: 10px 14px !important;
		font-size: 13.5px !important;
		font-weight: 500 !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		text-decoration: none !important;
		border: 0 !important;
		border-radius: 8px !important;
		background: transparent !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		white-space: nowrap !important;
		line-height: 1.2 !important;
		cursor: pointer !important;
		text-align: left !important;
	}
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > a:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > button.snifffr-dp-shophead-tip-open:hover {
		background: #faecf2 !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > a .bi,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item > button.snifffr-dp-shophead-tip-open .bi,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-item .snifffr-dp-shophead-more-icon .bi {
		font-size: 14px;
		line-height: 1;
	}
	/* For Friend + Block rows we want the icon + label visible while the
	   BP-injected button itself is the click target — overlay it. */
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 10px 14px;
		font-size: 13.5px;
		font-weight: 500;
		color: var(--snifffr-mp-purple, #423E59);
		border-radius: 8px;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease;
		position: relative;
	}
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block:hover {
		background: #faecf2;
		color: var(--snifffr-mp-pink, #E65C95);
	}
	/* Tint the icon + label that sit *under* the BP overlay so they read pink
	   on hover, matching the other rows. */
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend:hover .snifffr-dp-shophead-more-icon,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend:hover .snifffr-dp-shophead-more-icon .bi,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend:hover .snifffr-dp-shophead-more-label,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block:hover > .bi,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block:hover .snifffr-dp-shophead-more-label {
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	/* Make the BP-injected friend/block button overlay the whole row so the
	   click hits the BP handler. Hide its rendered text — our label spans
	   show the human-readable label. */
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .friendship-button,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .bp-generic-button,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .bpbm-block-member-button,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .generic-button {
		position: absolute !important;
		inset: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
	}
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .friendship-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .bp-generic-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .bpbm-block-member-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .generic-button > a,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .friendship-button > a:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .bp-generic-button > a:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .bpbm-block-member-button > a:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .generic-button > a:hover,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .friendship-button > a:focus,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-friend .bp-generic-button > a:focus,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .bpbm-block-member-button > a:focus,
	.snifffr-dp-shophead-more-menu .snifffr-dp-shophead-more-block .generic-button > a:focus {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		padding: 0 !important;
		font-size: 0 !important;     /* hide BP's rendered label — we render our own */
		color: transparent !important;
		background: transparent !important;
		border: 0 !important;
		text-decoration: none !important;
		box-shadow: none !important;
	}

	/* Cover hero */
	.snifffr-dp-cover-wrap {
		position: relative;
		width: 100%;
		height: 320px;
		background: linear-gradient(135deg, #fef3f7 0%, #efeaff 100%);
		overflow: hidden;
	}
	.snifffr-dp-cover {
		position: absolute;
		inset: 0;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}
	.snifffr-dp-cover.has-image[data-snifffr-dp-cover-zoom] {
		cursor: zoom-in;
	}

	/* Multi-image slider — slides stack horizontally and the slider scrolls. */
	.snifffr-dp-cover-slider {
		position: absolute;
		inset: 0;
		display: flex;
		overflow: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
	}
	.snifffr-dp-cover-slider .snifffr-dp-cover--slide {
		position: relative;
		flex: 0 0 100%;
		width: 100%;
		height: 100%;
		scroll-snap-align: start;
	}

	/* Slider arrows */
	.snifffr-dp-cover-arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
		border: 0;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.85);
		color: #1a1a1a;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
		transition: background 0.15s ease, transform 0.15s ease;
		z-index: 2;
	}
	.snifffr-dp-cover-arrow:hover {
		background: #fff;
	}
	.snifffr-dp-cover-arrow--prev { left: 16px; }
	.snifffr-dp-cover-arrow--next { right: 16px; }

	/* Slider dots */
	.snifffr-dp-cover-dots {
		position: absolute;
		bottom: 16px;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 6px;
		z-index: 2;
	}
	.snifffr-dp-cover-dot {
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.5);
		transition: background 0.15s ease, transform 0.15s ease;
	}
	.snifffr-dp-cover-dot.is-active {
		background: #fff;
		transform: scale(1.2);
	}

	/* Self-only cover edit pencil — top right of the cover. */
	.snifffr-dp-cover-edit {
		position: absolute;
		top: 16px;
		right: 16px;
		width: 40px;
		height: 40px;
		border: 0;
		border-radius: 50%;
		background: rgba(0, 0, 0, 0.4);
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: background 0.15s ease;
		z-index: 3;
	}
	.snifffr-dp-cover-edit:hover {
		background: rgba(0, 0, 0, 0.6);
	}

	/* ── Identity row (avatar + name/pills, sits below cover) ────── */
	.snifffr-dp-identity-row {
		position: relative;
		padding: 0 32px 24px 200px;
		min-height: 96px;
	}

	/* Avatar — overlaps the cover bottom-left. */
	.snifffr-dp-avatar {
		position: absolute;
		left: 32px;
		top: -80px;
		width: 160px;
		height: 160px;
		border-radius: 50%;
		overflow: visible;
		z-index: 4;
	}
	.snifffr-dp-avatar img {
		width: 160px;
		height: 160px;
		border-radius: 50%;
		border: 4px solid #fff;
		object-fit: cover;
		display: block;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
	}
	.snifffr-dp-avatar-dot {
		position: absolute;
		bottom: 8px;
		right: 8px;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		background: #10b981;
		border: 3px solid #fff;
		z-index: 5;
	}
	.snifffr-dp-avatar-edit {
		position: absolute;
		bottom: 4px;
		left: 4px;
		width: 32px;
		height: 32px;
		border: 0;
		border-radius: 50%;
		background: #e85d8f;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.4);
		transition: background 0.15s ease, transform 0.15s ease;
		z-index: 5;
	}
	.snifffr-dp-avatar-edit:hover {
		background: #d24a7d;
		transform: scale(1.05);
	}

	/* Identity stack: name row + pills */
	.snifffr-dp-identity {
		padding-top: 20px;
	}
	.snifffr-dp-name-row {
		display: flex;
		align-items: baseline;
		gap: 8px;
		margin-bottom: 10px;
	}
	.snifffr-dp-name {
		font-size: 28px;
		font-weight: 700;
		line-height: 1.2;
		color: #1a1a1a;
	}
	.snifffr-dp-age {
		font-size: 22px;
		font-weight: 500;
		color: #6b7280;
	}
	.snifffr-dp-flag {
		display: inline-flex;
		align-items: center;
		margin-left: 4px;
	}
	.snifffr-dp-flag img,
	.snifffr-dp-flag svg {
		width: 24px;
		height: auto;
		display: block;
	}

	/* Pills row */
	.snifffr-dp-pills {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
	}
	.snifffr-dp-pill {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		padding: 6px 12px;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		line-height: 1;
		white-space: nowrap;
	}
	.snifffr-dp-pill--premium {
		/* Pinky-purple gradient — brand-aligned (#e65c95 hot pink → #b794f6
		   lavender-purple). Was a gold gradient (#f7d046 → #f08a3e) which
		   read as a generic "premium badge" rather than tying back to the
		   snifffr palette. */
		background: linear-gradient(135deg, #e65c95 0%, #b794f6 100%);
		color: #fff;
	}
	.snifffr-dp-pill--basic {
		background: #f3f4f6;
		color: #6b7280;
		text-decoration: none;
		transition: background 0.15s ease;
	}
	a.snifffr-dp-pill--basic:hover {
		background: #e5e7eb;
	}
	.snifffr-dp-pill--verified {
		background: #e7e2ff;
		color: #6b46c1;
	}
	.snifffr-dp-pill--unverified {
		background: rgba(232, 93, 143, 0.1);
		color: #e65c95;
		text-decoration: none;
		transition: background 0.15s ease;
	}
	a.snifffr-dp-pill--unverified:hover {
		background: rgba(232, 93, 143, 0.18);
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dp-pill--rating {
		background: #fff7ed;
		color: #c2410c;
	}
	.snifffr-dp-pill-rating-count {
		font-weight: 400;
		opacity: 0.7;
		margin-left: 2px;
	}

	/* ── Self-view quick-access row (Tokens / Messages / Notifications)
	   below the identity row. Each cell is a pink-tinted soft pill
	   with an icon, label, and optional unread badge. */
	.snifffr-dp-quick-row {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
		margin: 0 32px 18px;
	}
	.snifffr-dp-quick {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding: 10px 14px;
		background: rgba(232, 93, 143, 0.06);
		color: #423e59;
		border: 1px solid rgba(232, 93, 143, 0.18);
		border-radius: 12px;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-quick:hover {
		background: rgba(232, 93, 143, 0.12);
		border-color: rgba(232, 93, 143, 0.35);
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dp-quick-icon {
		display: inline-flex;
		font-size: 16px;
		color: #e65c95;
	}
	.snifffr-dp-quick-badge {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		background: #e85d8f;
		color: #fff;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 700;
		line-height: 1;
		margin-left: 4px;
	}

	/* ── Profile-completion accordion wrap on the About body ─────── */
	.snifffr-dp-profile-completion-wrap {
		margin: 0 0 20px;
	}

	/* ── Admin-only moderation strip (buyer profiles, admin/editor) ─
	   Sits at the top of the About body. Soft amber tinted card so it
	   reads as a privileged surface without being garish. Two toggles +
	   an Edit User link, all aligned in a single row that wraps cleanly
	   on narrower viewports. The toggles' #fake_check_on_frontend /
	   #not_to_be_ban_on_frontend IDs are reused from the legacy widget
	   so the existing js/main.js change handlers still fire. */
	.snifffr-dp-admin-strip {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 18px;
		padding: 12px 18px;
		margin: 0 0 20px;
		background: linear-gradient(135deg, #fff7e6 0%, #fff1d6 100%);
		border: 1px solid rgba(180, 130, 20, 0.18);
		border-radius: 12px;
		color: #6b4d10;
		font-size: 13px;
		font-weight: 600;
	}
	.snifffr-dp-admin-strip-tag {
		display: inline-flex;
		align-items: center;
		padding: 4px 10px;
		background: rgba(180, 130, 20, 0.16);
		color: #6b4d10;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.05em;
		text-transform: uppercase;
	}
	.snifffr-dp-admin-strip-toggle {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin: 0;
		padding: 0;
		cursor: pointer;
		user-select: none;
	}
	.snifffr-dp-admin-strip-toggle input[type="checkbox"] {
		width: 16px;
		height: 16px;
		margin: 0;
		accent-color: var(--snifffr-mp-pink, #E65C95);
		cursor: pointer;
	}
	.snifffr-dp-admin-strip-toggle span {
		font-size: 13px;
		font-weight: 600;
		color: #6b4d10;
	}
	.snifffr-dp-admin-strip-edit {
		margin-left: auto;
		display: inline-flex;
		align-items: center;
		padding: 6px 14px;
		background: #fff;
		color: #6b4d10 !important;
		border: 1px solid rgba(180, 130, 20, 0.22);
		border-radius: 999px;
		font-size: 12px;
		font-weight: 700;
		text-decoration: none !important;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-admin-strip-edit:hover {
		background: rgba(180, 130, 20, 0.08);
		border-color: rgba(180, 130, 20, 0.35);
		color: #6b4d10 !important;
	}

	/* ── Action stack ────────────────────────────────────────────── */
	.snifffr-dp-action-slot {
		position: absolute;
		top: 24px;
		right: 32px;
		display: flex;
		gap: 8px;
		align-items: center;
		z-index: 6;
	}
	.snifffr-dp-action-slot:empty {
		display: none;
	}

	.snifffr-dp-action {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 16px;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		line-height: 1;
		text-decoration: none;
		border: 0;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.05s ease;
		white-space: nowrap;
		position: relative;
	}
	button.snifffr-dp-action {
		font-family: inherit;
		appearance: none;
		-webkit-appearance: none;
	}
	.snifffr-dp-action:active {
		transform: translateY(1px);
	}
	.snifffr-dp-action i {
		font-size: 14px;
		line-height: 1;
	}

	.snifffr-dp-action--primary {
		background: #e85d8f;
		color: #fff;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
	}
	.snifffr-dp-action--primary:hover {
		background: #d24a7d;
		color: #fff;
		text-decoration: none;
	}

	.snifffr-dp-action--secondary {
		background: #fff;
		color: #1a1a1a;
		border: 1px solid #e5e7eb;
	}
	.snifffr-dp-action--secondary:hover {
		background: #f9fafb;
		border-color: #d1d5db;
		color: #1a1a1a;
		text-decoration: none;
	}

	.snifffr-dp-action--icon {
		padding: 8px;
		width: 36px;
		justify-content: center;
		background: #fff;
		color: #6b7280;
		border: 1px solid #e5e7eb;
	}
	.snifffr-dp-action--icon:hover {
		color: #ef4444;
		border-color: #fecaca;
	}

	/* Friend cell — overlays the native bp_add_friend_button anchor.
	   BP renders `<div class="friendship-button ...">  <a>+ Friend</a></div>`.
	   We absolutely-position the wrapper to fill the pill, then make the
	   anchor invisible text but full-area clickable so AJAX/state hooks
	   keep working. */
	.snifffr-dp-friend-cell {
		position: relative;
		overflow: hidden;
	}
	.snifffr-dp-friend-cell .snifffr-dp-action-icon,
	.snifffr-dp-friend-cell > span:not(.snifffr-dp-action-icon) {
		position: relative;
		z-index: 2;
		pointer-events: none;
	}
	.snifffr-dp-friend-cell .friendship-button {
		position: absolute !important;
		inset: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		z-index: 1;
	}
	.snifffr-dp-friend-cell .friendship-button a {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		font-size: 0 !important;          /* hide BP's "+ Friend" text */
		color: transparent !important;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		text-decoration: none !important;
		box-shadow: none !important;
	}

	/* Block cell — same overlay pattern. BP renders
	   `<div class="generic-button block-member" id="block-member-N">  <a>BLOCK</a></div>`.
	   overflow:visible (was hidden) so the Block/Unblock tooltip rendered
	   via `a.block-button::after` (snifffr-desktop-profile.php injects
	   data-tooltip, CSS at the bottom of this file styles it) can escape
	   the cell. The inner anchor's `font-size:0` already suppresses the
	   plugin's "BLOCK"/"UNBLOCK" text leak, so the hidden overflow rule
	   wasn't actually doing anything useful. */
	.snifffr-dp-block-cell {
		position: relative;
		overflow: visible;
	}
	.snifffr-dp-block-cell i {
		position: relative;
		z-index: 2;
		pointer-events: none;
	}
	.snifffr-dp-block-cell .generic-button.block-member {
		position: absolute !important;
		inset: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		z-index: 1;
	}
	.snifffr-dp-block-cell .generic-button.block-member a {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		font-size: 0 !important;          /* hide BP's "BLOCK" text */
		color: transparent !important;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		text-decoration: none !important;
		box-shadow: none !important;
		text-transform: none !important;
	}

	/* ── Tabs ────────────────────────────────────────────────────── */
	.snifffr-dp-tabs {
		display: flex;
		gap: 8px;
		margin-top: 16px;
		padding: 6px;
		background: #fff;
		border-radius: 999px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: auto;
		scrollbar-width: none;
	}
	/* Compact mode — no header above, so give the tab strip the same
	   top margin the header would normally provide. */
	.snifffr-dp--compact .snifffr-dp-tabs {
		margin-top: 0;
	}
	.snifffr-dp-tabs::-webkit-scrollbar {
		display: none;
	}

	.snifffr-dp-tab {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 10px 20px;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		line-height: 1;
		color: #6b7280;
		background: transparent;
		text-decoration: none;
		white-space: nowrap;
		transition: background 0.15s ease, color 0.15s ease;
		flex: 0 0 auto;
	}
	.snifffr-dp-tab:hover {
		background: #f3f4f6;
		color: #1a1a1a;
		text-decoration: none;
	}
	.snifffr-dp-tab.is-active {
		background: #e85d8f;
		color: #fff;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
	}
	.snifffr-dp-tab.is-active:hover {
		background: #d24a7d;
		color: #fff;
	}
	/* Empty state — same text colour as a populated tab so all non-active
	   tabs read uniformly (Profile / Interview pass count=null and never
	   got .is-empty, which made them look darker than count=0 tabs). The
	   "empty" signal is now just the absence of the count badge. */
	.snifffr-dp-tab.is-empty .snifffr-dp-tab-count {
		display: none;
	}

	.snifffr-dp-tab-count {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 22px;
		height: 22px;
		padding: 0 7px;
		border-radius: 999px;
		background: #f3f4f6;
		color: #6b7280;
		font-size: 11px;
		font-weight: 700;
	}
	.snifffr-dp-tab.is-active .snifffr-dp-tab-count {
		background: rgba(255, 255, 255, 0.25);
		color: #fff;
	}

	/* ── Body — About tab ────────────────────────────────────────── */
	.snifffr-dp-body {
		margin-top: 20px;
	}
	.snifffr-dp-body-grid {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
		gap: 20px;
		align-items: start;
	}
	.snifffr-dp-body-main,
	.snifffr-dp-body-side {
		display: flex;
		flex-direction: column;
		gap: 16px;
		min-width: 0;
	}

	.snifffr-dp-card {
		background: #fff;
		border-radius: 16px;
		padding: 20px 24px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	}
	.snifffr-dp-card-title {
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #6b7280;
		margin: 0 0 12px;
	}

	.snifffr-dp-bio {
		margin: 0;
		font-size: 15px;
		line-height: 1.5;
		color: #1a1a1a;
	}
	.snifffr-dp-aboutme {
		font-size: 14px;
		line-height: 1.6;
		color: #1a1a1a;
		word-break: break-word;
	}
	.snifffr-dp-aboutme a {
		color: #e85d8f;
	}
	.snifffr-dp-aboutme a:hover {
		text-decoration: underline;
	}
	/* Bio clamp: cap About text at 6 lines until the user expands. The
	   un-clamped intrinsic height is measured by JS via scrollHeight vs
	   clientHeight; the toggle button stays `hidden` when content fits. */
	.snifffr-dp-aboutme-card {
		position: relative;
	}
	.snifffr-dp-aboutme-card[data-snifffr-dp-clamp="bio"]:not(.is-expanded) .snifffr-dp-aboutme {
		display: -webkit-box;
		-webkit-line-clamp: 6;
		-webkit-box-orient: vertical;
		overflow: hidden;
		-webkit-mask-image: linear-gradient(180deg, #000 70%, rgba(0,0,0,0.35) 100%);
		        mask-image: linear-gradient(180deg, #000 70%, rgba(0,0,0,0.35) 100%);
	}
	.snifffr-dp-aboutme-card.is-expanded .snifffr-dp-aboutme {
		-webkit-mask-image: none;
		        mask-image: none;
	}
	.snifffr-dp-aboutme-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		margin: 12px 0 0;
		padding: 8px 16px;
		background: #fff;
		border: 1px solid rgba(74, 22, 88, 0.12);
		border-radius: 999px;
		color: #e85d8f;
		font: inherit;
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.3px;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
		-webkit-appearance: none;
		appearance: none;
	}
	.snifffr-dp-aboutme-toggle::after {
		content: "";
		width: 7px;
		height: 7px;
		border-right: 1.6px solid currentColor;
		border-bottom: 1.6px solid currentColor;
		transform: translateY(-2px) rotate(45deg);
		transition: transform 0.2s ease;
	}
	.snifffr-dp-aboutme-card.is-expanded .snifffr-dp-aboutme-toggle::after {
		transform: translateY(2px) rotate(-135deg);
	}
	.snifffr-dp-aboutme-toggle:hover,
	.snifffr-dp-aboutme-toggle:focus-visible {
		background: #e85d8f;
		border-color: #e85d8f;
		color: #fff;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
		outline: none;
	}

	/* Chip rows — Offers / Looking for. */
	.snifffr-dp-chips {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	.snifffr-dp-chip {
		display: inline-flex;
		align-items: center;
		padding: 6px 14px;
		border-radius: 999px;
		background: #f3f4f6;
		color: #1a1a1a;
		font-size: 13px;
		font-weight: 500;
		line-height: 1;
	}

	/* Details (right column) — definition list. */
	.snifffr-dp-card--details .snifffr-dp-details {
		margin: 0;
		display: grid;
		grid-template-columns: max-content 1fr;
		gap: 8px 16px;
		font-size: 13px;
	}
	.snifffr-dp-details dt {
		color: #6b7280;
		font-weight: 500;
	}
	.snifffr-dp-details dd {
		margin: 0;
		color: #1a1a1a;
		font-weight: 600;
		display: inline-flex;
		align-items: center;
		gap: 6px;
	}
	.snifffr-dp-detail-flag img,
	.snifffr-dp-detail-flag svg {
		width: 18px;
		height: auto;
		display: block;
	}

	/* Stats row + member-since. */
	.snifffr-dp-stats-row {
		display: flex;
		gap: 16px;
		align-items: stretch;
	}
	.snifffr-dp-stat {
		flex: 1;
		text-align: center;
		padding: 12px 8px;
		border-radius: 12px;
		background: #fafbfc;
		text-decoration: none;
		color: inherit;
		transition: background 0.15s ease;
		min-width: 0;
	}
	a.snifffr-dp-stat:hover {
		background: #f3f4f6;
		text-decoration: none;
	}
	.snifffr-dp-stat-num {
		font-size: 22px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.2;
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
	}
	.snifffr-dp-stat-badge {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		font-size: 10px;
		font-weight: 700;
		line-height: 1;
		color: #fff;
		background: #ec4899;
		border-radius: 9px;
		box-shadow: 0 0 0 2px #fff;
	}
	.snifffr-dp-stat-label {
		font-size: 12px;
		color: #6b7280;
		margin-top: 4px;
	}
	.snifffr-dp-stat-active {
		font-size: 14px;
		color: #6b7280;
	}
	.snifffr-dp-stat-active.is-on {
		color: #10b981;
	}
	.snifffr-dp-member-since {
		margin-top: 12px;
		padding-top: 12px;
		border-top: 1px solid #f3f4f6;
		font-size: 12px;
		color: #6b7280;
		text-align: center;
	}

	/* ── Body — Shop tab grid ────────────────────────────────────── */
	.snifffr-dp-body--shop {
		margin-top: 20px;
	}
	.snifffr-dp-shop-grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
		gap: 16px;
	}
	.snifffr-dp-shop-card {
		display: flex;
		flex-direction: column;
		background: #fff;
		border-radius: 16px;
		overflow: hidden;
		text-decoration: none;
		color: inherit;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-shop-card:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05), 0 12px 24px rgba(0, 0, 0, 0.08);
		text-decoration: none;
		color: inherit;
	}
	.snifffr-dp-shop-card-img {
		position: relative;
		width: 100%;
		aspect-ratio: 1 / 1;
		background: #f3f4f6;
		overflow: hidden;
	}
	.snifffr-dp-shop-card-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-shop-card-placeholder {
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #f9fafb;
	}
	.snifffr-dp-shop-card-placeholder img {
		width: 56px;
		height: 56px;
		opacity: 0.4;
	}
	.snifffr-dp-shop-card-price {
		position: absolute;
		top: 12px;
		right: 12px;
		padding: 4px 12px;
		border-radius: 999px;
		background: rgba(255, 255, 255, 0.95);
		color: #e85d8f;
		font-size: 13px;
		font-weight: 700;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	}
	.snifffr-dp-shop-card-title {
		padding: 12px 16px 14px;
		font-size: 14px;
		font-weight: 600;
		color: #1a1a1a;
		line-height: 1.3;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	/* ── Body — Gallery tab grid ─────────────────────────────────── */
	.snifffr-dp-body--gallery {
		margin-top: 20px;
		/* Match the Shop / Instant Media / Private Content body chrome —
		   white card with the same padding + shadow so Gallery doesn't
		   read as a different page layout. */
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: hidden;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}
	.snifffr-dp-gallery-grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
		gap: 8px;
	}
	.snifffr-dp-gallery-cell {
		position: relative;
		display: block;
		aspect-ratio: 1 / 1;
		background: #f3f4f6;
		border-radius: 12px;
		overflow: hidden;
		text-decoration: none;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-gallery-cell:hover {
		transform: scale(1.02);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
		text-decoration: none;
	}
	.snifffr-dp-gallery-cell img,
	.snifffr-dp-gallery-cell video {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-gallery-placeholder {
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32px;
		opacity: 0.3;
	}
	.snifffr-dp-gallery-play {
		position: absolute;
		bottom: 8px;
		right: 8px;
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: rgba(0, 0, 0, 0.7);
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px;
		padding-left: 2px; /* visually center the play triangle */
	}
	.snifffr-dp-gallery-cell.is-locked .snifffr-dp-gallery-play {
		background: rgba(232, 93, 143, 0.9);
		padding-left: 0;
	}
	.snifffr-dp-gallery-cell.is-locked::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.15), rgba(103, 70, 193, 0.15));
		z-index: 1;
		pointer-events: none;
	}

	/* ── Interview (seller-questionnaire) tab ─────────────────────
	   Visitor-only collapsible Q&A — only renders questions the seller has
	   actually answered. Mirrors .snifffr-mp-interview-item on mobile. */
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview {
		padding: 4px 0;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-list {
		display: block;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item {
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.12);
		border-radius: 12px;
		margin-bottom: 10px;
		overflow: hidden;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item:last-child {
		margin-bottom: 0;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item > summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		padding: 14px 16px;
		background: var(--snifffr-mp-lavender, #f4f0ff);
		font-size: 14px;
		font-weight: 600;
		color: var(--snifffr-mp-purple, #423E59);
		cursor: pointer;
		list-style: none;
		user-select: none;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item > summary::-webkit-details-marker {
		display: none;
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item > summary::after {
		content: "+";
		flex: 0 0 auto;
		font-size: 20px;
		font-weight: 400;
		line-height: 1;
		color: var(--snifffr-mp-pink, #E65C95);
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-item[open] > summary::after {
		content: "−";
	}
	.snifffr-dp-body--seller-questionnaire .snifffr-dp-interview-answer {
		padding: 16px;
		font-size: 14px;
		line-height: 1.55;
		color: var(--snifffr-mp-purple, #423E59);
	}

	/* ── Empty state (shared across tabs) ──────────────────────────
	   Visual chrome lives in snifffr-mobile-redesign.css as part of the
	   unified `.snifffr-mp-shop-empty / .snifffr-dp-empty / .iu-empty--*`
	   gradient card pattern (one source of truth, applies at every
	   viewport). The legacy desktop-only rules that used to live here
	   were a different aesthetic (white card, 80px padding, 0.4-opacity
	   icon) and were overriding the unified card at >=992px, so they
	   have been removed. Tab-specific overrides for `.snifffr-dp-empty`
	   layout (e.g. min-height inside `.snifffr-dp-body--*`) can still go
	   here if needed. */

	/* ── /buyers/ + /sellers/ member card grids ──────────────────────
	   Apply the mobile card aesthetic at desktop column counts. The
	   legacy markup is `<ul.member-main-list> > <li> > .member-item-block`,
	   rendered by `get_seller_buyer_data_html()` inside `.data-container-{buyer|seller}`
	   which lives under `.row.buyer-page-row.seller-page-row`. The outer
	   `<div id="buddypress">` is the page-template wrap (ABOVE the row),
	   not a descendant of it — so the previous selector chain
	   `body.snifffr-desktop-beta.buyer-page-row #buddypress …` never
	   matched (it required #buddypress nested INSIDE .buyer-page-row AND
	   required body to carry .buyer-page-row, neither of which is true
	   in `page-buyer.php`). Descendant selector + `body.snifffr-desktop-beta`
	   alone is enough — every member-main-list on the site that lives
	   inside .buyer-page-row / .seller-page-row gets the redesign chrome.

	   Same card chrome as the mobile redesign: square avatar at top, white
	   card body below with the title strip + msg button, soft drop shadow
	   instead of the harsh 1px purple border. */
	body.snifffr-desktop-beta .buyer-page-row ul.member-main-list,
	body.snifffr-desktop-beta .seller-page-row ul.member-main-list {
		display: grid !important;
		grid-template-columns: repeat(4, 1fr);
		gap: 16px;
		margin: 0 0 24px !important;
		padding: 0 !important;
		list-style: none;
		background: transparent !important;
		/* Cards in the same row would otherwise stretch to the tallest card's
		   height (the one with an ellipsed name). That leaves empty white
		   below the image on shorter cards. align-items: start makes each
		   card its natural height (image + title strip only). */
		align-items: start;
	}
	body.snifffr-desktop-beta .buyer-page-row ul.member-main-list li,
	body.snifffr-desktop-beta .seller-page-row ul.member-main-list li {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		border: 0 !important;
		box-sizing: border-box;
	}

	/* Card chrome. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block,
	body.snifffr-desktop-beta .seller-page-row .member-item-block {
		position: relative;
		background: #fff;
		border: 0 !important;
		border-radius: 14px !important;
		overflow: hidden;
		margin: 0 !important;
		/* Match the mobile redesign's purple-tinted shadow so the two
		   designs read as one system. */
		box-shadow:
			0 1px 2px rgba(66, 62, 89, 0.04),
			0 4px 14px rgba(66, 62, 89, 0.08) !important;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .buyer-page-row .member-item-block:hover,
	body.snifffr-desktop-beta .seller-page-row .member-item-block:hover {
		transform: translateY(-2px);
		box-shadow:
			0 4px 8px rgba(66, 62, 89, 0.06),
			0 12px 28px rgba(66, 62, 89, 0.12) !important;
	}

	/* .item-avatar stacks image + title + msg button as a flex column. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-avatar,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-avatar {
		position: relative;
		margin: 0;
		padding: 0;
		box-shadow: none !important;
		background: #fff;
		display: flex;
		flex-direction: column;
	}

	/* Image link — first <a>. Plain block wrapper, line-height:0 to kill the
	   inline-baseline gap that would otherwise leave a thin strip below the
	   img. The IMG element itself carries the aspect-ratio lock (more
	   reliable than putting it on the link, which loses to the legacy
	   `#buddypress ul.member-main-list li a` rules in custom.css). */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-avatar > a:first-child,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-avatar > a:first-child {
		display: block !important;
		width: 100% !important;
		max-width: none !important;
		height: auto !important;
		padding: 0 !important;
		margin: 0 !important;
		position: relative !important;
		overflow: hidden !important;
		line-height: 0 !important;
		order: 1;
	}
	/* The image link IS <a class="lock-item lock-image prem0"> — the avatar
	   <img> sits directly inside as its only child. Lock the IMG element to
	   1:1 with object-fit:cover. The IMG's intrinsic ratio handling means
	   aspect-ratio sticks even when the legacy `.item-avatar img { width:25px;
	   height:25px }` rule fires (lower specificity, no !important — we win). */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-avatar > a:first-child > img,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-avatar > a:first-child > img,
	body.snifffr-desktop-beta .buyer-page-row ul.member-main-list li .item-avatar > a > img.avatar,
	body.snifffr-desktop-beta .seller-page-row ul.member-main-list li .item-avatar > a > img.avatar {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
		max-width: none !important;
		max-height: none !important;
		min-width: 0 !important;
		min-height: 0 !important;
		object-fit: cover !important;
		object-position: center !important;
		border: 0 !important;
		border-radius: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		display: block !important;
		float: none !important;
	}

	/* Age-verify overlay (`.lock-item.lock-image::before`) — legacy
	   custom.css:10562 hard-pins the overlay to 145×145px on member cards,
	   tuned for the old smaller cards. On the redesign's full-bleed image
	   tiles that only covers ~half. Override so the dark "Verify Age to
	   View Image" panel fills the entire image link. */
	body.snifffr-desktop-beta .member-item-block .lock-item.lock-image,
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .lock-item.lock-image,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .lock-item.lock-image {
		display: block !important;
		width: 100% !important;
		position: relative !important;
	}
	body.snifffr-desktop-beta .member-item-block .lock-item.lock-image::before,
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .lock-item.lock-image::before,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .lock-item.lock-image::before {
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100% !important;
		height: 100% !important;
		min-width: 0 !important;
		min-height: 0 !important;
		max-width: none !important;
		max-height: none !important;
	}

	/* Title strip — second <a>, sits below the image. Tight padding so the
	   image dominates the card; the strip is just a name + flag line. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-avatar > a:nth-child(2),
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-avatar > a:nth-child(2),
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-avatar > a:has(> h4.item-title),
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-avatar > a:has(> h4.item-title) {
		position: static !important;
		display: block !important;
		background: #fff !important;
		padding: 8px 12px !important;
		margin: 0 !important;
		order: 2;
		text-decoration: none;
	}
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .item-title,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .item-title,
	body.snifffr-desktop-beta .buyer-page-row .member-item-block h4.item-title,
	body.snifffr-desktop-beta .seller-page-row .member-item-block h4.item-title {
		font-size: 15px !important;
		font-weight: 700 !important;
		color: #1a1a1a !important;
		margin: 0 !important;
		padding: 0 !important;
		text-align: left !important;
		line-height: 1.3 !important;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		background: transparent !important;
	}

	/* Message envelope — floating pink circle over the top-left of the image.
	   The legacy markup wraps the envelope <a> in a <div class="directmessagebs">,
	   NOT a direct <a> child of .item-avatar — so an `a:last-child` selector
	   never matches. Absolute-positioning the div (matching the mobile
	   redesign at snifffr-mobile-redesign.css:8520) also pulls it out of
	   flex flow, so it no longer pushes the image down. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .directmessagebs,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .directmessagebs {
		position: absolute !important;
		top: 10px !important;
		left: 10px !important;
		right: auto !important;
		bottom: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		z-index: 4;
	}
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .directmessagebs a,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .directmessagebs a {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		background: var(--color-pink, #e85d8f) !important;
		color: #fff !important;
		border-radius: 50% !important;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18) !important;
		text-decoration: none !important;
		transition: transform 0.15s ease;
	}
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .directmessagebs a:hover,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .directmessagebs a:hover {
		transform: scale(1.08);
	}
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .directmessagebs i,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .directmessagebs i {
		font-size: 14px !important;
		color: #fff !important;
		margin: 0 !important;
	}

	/* Hide the empty .item / .action divs that sit as siblings of .item-avatar
	   inside .member-item-block. They're never populated for this page but
	   contribute padding/margin from global rules that push card height up. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block > .item,
	body.snifffr-desktop-beta .seller-page-row .member-item-block > .item,
	body.snifffr-desktop-beta .buyer-page-row .member-item-block > .action,
	body.snifffr-desktop-beta .seller-page-row .member-item-block > .action {
		display: none !important;
	}

	/* Online badge — small green dot top-right of the image, matching mobile. */
	body.snifffr-desktop-beta .buyer-page-row .member-item-block .online-badge,
	body.snifffr-desktop-beta .seller-page-row .member-item-block .online-badge {
		position: absolute !important;
		top: 10px !important;
		right: 10px !important;
		left: auto !important;
		bottom: auto !important;
		width: 12px !important;
		height: 12px !important;
		padding: 0 !important;
		font-size: 0 !important;
		line-height: 0 !important;
		background: #4ade80 !important;
		border: 2px solid #fff !important;
		border-radius: 50% !important;
		box-shadow: none !important;
		z-index: 4;
		text-transform: none !important;
		letter-spacing: 0 !important;
	}

	/* Strip legacy chrome the custom.css rules try to paint at the same
	   time. custom.css#6525 says `#buddypress ul.member-main-list li {
	   width:154px; background:var(--color-bg) }` and #6536 paints a 1px
	   --color-bg border on the inner .member-item-block. Both fire with
	   higher source-order priority than our descendant rules. !important
	   here makes the redesign card win unambiguously. */
	body.snifffr-desktop-beta .buyer-page-row #buddypress ul.member-main-list li,
	body.snifffr-desktop-beta .seller-page-row #buddypress ul.member-main-list li,
	body.snifffr-desktop-beta.page-template-page-buyer #buddypress ul.member-main-list li,
	body.snifffr-desktop-beta.page-template-page-seller #buddypress ul.member-main-list li {
		width: 100% !important;
		background: transparent !important;
		background-color: transparent !important;
		border: 0 !important;
	}

	/* Page bg + outer container — match the mobile redesign's full-bleed
	   look: light grey page with edge-to-edge content padding. */
	body.snifffr-desktop-beta .buyer-page-row,
	body.snifffr-desktop-beta .seller-page-row {
		margin-top: 18px;
	}

	/* Buyer / seller filter sidebar — soft white card, matching the mobile
	   version's chrome (mobile already styles `.buyer-filter-sidebar` at
	   the top of snifffr-mobile-redesign.css). Promote that look to
	   desktop too so the sidebar reads as a single system. */
	body.snifffr-desktop-beta .buyer-filter-sidebar,
	body.snifffr-desktop-beta .seller-filter-sidebar {
		background: #fff;
		border: 1px solid rgba(51, 46, 77, 0.08);
		border-radius: 14px;
		padding: 20px 18px 16px;
		margin-bottom: 24px;
		box-shadow: 0 2px 10px rgba(51, 46, 77, 0.05);
	}

	/* ── /activity/ — site-wide activity feed restyle ────────────────
	   Applies to the global activity stream and the per-user activity
	   tab (.activity-permalink). Same card chrome + pink-pill button
	   language used by .snifffr-dp components. DOM is left alone — this
	   is pure CSS over the legacy markup.

	   Page background stays var(--color-bg) light grey; cards are white
	   on top of it with soft shadows. */

	/* Post-form composer — tight inline-feeling composer so it doesn't
	   dominate the page. Looks like a single-row "What's on your mind"
	   input with a small Post pill, expanding only when the user actually
	   starts typing. Used on /activity AND on the profile-self body, so
	   reset the .snifffr-mp-postform 30px top margin too (mobile rule
	   leaks into desktop because the CSS isn't viewport-gated). */
	body.snifffr-desktop-beta .snifffr-mp-postform,
	body.snifffr-desktop-beta .snifffr-dp-postform-wrap .snifffr-mp-postform {
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-form {
		position: relative !important;
		display: grid !important;
		grid-template-columns: 36px minmax(0, 1fr) !important;
		grid-template-rows: auto auto !important;
		grid-template-areas:
			"avatar  input"
			"actions actions" !important;
		column-gap: 12px !important;
		row-gap: 12px !important;
		background: #fff !important;
		border: 1px solid rgba(66, 62, 89, 0.08) !important;
		border-radius: 14px !important;
		padding: 35px 20px 5px 20px !important;
		margin: 0 0 14px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-form:focus-within {
		/* Neutral lift on focus — earlier pink-tinted halo
		   (rgba(230,92,149,0.08)) read as a "weird shadow" against the
		   otherwise neutral lavender chrome of the activity feed. Subtle
		   purple-ish elevation matches the rest of the redesign cards. */
		border-color: rgba(66, 62, 89, 0.18) !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(66, 62, 89, 0.06) !important;
	}
	/* Strip any inner dividers BP/legacy CSS draws between the textarea and
	   the actions row — the card itself is the only visual frame we want. */
	body.snifffr-desktop-beta #buddypress #whats-new-form > *,
	body.snifffr-desktop-beta #buddypress #whats-new-form hr,
	body.snifffr-desktop-beta #buddypress #whats-new-content,
	body.snifffr-desktop-beta #buddypress #whats-new-options {
		border-top: 0 !important;
		border-bottom: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-form hr {
		display: none !important;
	}
	/* Any unknown direct child of the form (e.g. the MediaPress activity
	   upload container, attachment galleries, plupload runtime widgets)
	   should span both grid columns — otherwise grid auto-placement drops
	   them into the 36px avatar slot and they render as a narrow vertical
	   strip. */
	body.snifffr-desktop-beta #buddypress #whats-new-form > *:not(#whats-new-avatar):not(#whats-new-content):not(#whats-new-options) {
		grid-column: 1 / -1 !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		min-width: 0 !important;
	}
	/* MediaPress activity uploader (Drop files here / Select files panel).
	   Hide entirely when inactive — MediaPress's JS toggles the
	   `mpp-upload-container-active` class on the image / video icon
	   click. Without an explicit display:none, the inactive container
	   still occupies grid space (and the dashed border + shadow leak
	   into the layout, which is why a faint band shows under the form).
	   Also: skip the height-transition slide so the panel snaps open
	   straight downward rather than the jQuery slideToggle's
	   up-and-down jitter. */
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container,
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container.mpp-upload-container-inactive {
		display: none !important;
	}
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container.mpp-upload-container-active {
		grid-column: 1 / -1 !important;
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
		animation: none !important;
		transition: none !important;
	}
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container.mpp-upload-container-active * {
		animation: none !important;
		transition: none !important;
	}
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container > * {
		width: 100% !important;
		max-width: 100% !important;
	}
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area,
	body.snifffr-desktop-beta #buddypress .mpp-uploader-status,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 22px 16px !important;
		background: #fafaff !important;
		border: 1.5px dashed rgba(66, 62, 89, 0.22) !important;
		border-radius: 12px !important;
		text-align: center !important;
		box-sizing: border-box !important;
		min-height: 0 !important;
	}
	/* MediaPress's own CSS gives .mpp-drag-drop-inside a fixed 250px width
	   with margin:auto for centering — but the legacy theme overrides the
	   margin, so the column hugs the left. Force full-width + center
	   text inside so "Drop files / or / Select files / filetypes" sit in
	   the centre of the dashed area. */
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-inside {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 auto !important;
		padding: 0 !important;
		text-align: center !important;
	}
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-inside p {
		text-align: center !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area p.mpp-drag-drop-info,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area > p,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-inside p {
		margin: 0 0 8px !important;
		font-size: 13.5px !important;
		font-weight: 600 !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
	}
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area .mpp-button-select-files,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area input.button,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area button.button {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		margin: 6px 0 0 !important;
		padding: 9px 22px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		box-shadow: 0 2px 6px rgba(230, 92, 149, 0.25) !important;
		cursor: pointer !important;
		transition: background 0.15s ease !important;
	}
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area .mpp-button-select-files:hover,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area input.button:hover,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area button.button:hover {
		background: #d24a7d !important;
	}
	/* "Please only select : jpeg, jpg, gif, png, webp" hint line. */
	body.snifffr-desktop-beta #buddypress #mpp-activity-media-upload-container small,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area small,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area .mpp-drag-drop-types,
	body.snifffr-desktop-beta #buddypress .mpp-drag-drop-area + small {
		display: block !important;
		margin: 10px 0 0 !important;
		font-size: 12px !important;
		color: rgba(66, 62, 89, 0.65) !important;
	}
	/* Close-X chrome MediaPress emits at the top-right of the dropbox.
	   Background was painting a faint shadow band beneath the form even
	   while the container is collapsed — strip it. Subtle hover tint only. */
	body.snifffr-desktop-beta #buddypress .mpp-upload-container-close {
		top: 6px !important;
		right: 6px !important;
		background: transparent !important;
		border-radius: 50% !important;
		width: 24px !important;
		height: 24px !important;
		box-shadow: none !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
	}
	/* No hover tint — was painting a faint band across the dropzone area
	   that read as a "weird shadow on hover". The cursor change + the
	   icon's own colour shift (inherited from .mpp-upload-container-close
	   base rule) is enough affordance. */
	body.snifffr-desktop-beta #buddypress .mpp-upload-container-close:hover {
		background: transparent !important;
	}
	/* Small 36px avatar — paired with the input, not a full hero column. */
	body.snifffr-desktop-beta #buddypress #whats-new-avatar {
		grid-area: avatar !important;
		float: none !important;
		display: block !important;
		width: 36px !important;
		height: 36px !important;
		margin: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-avatar img,
	body.snifffr-desktop-beta #buddypress #whats-new-avatar a img {
		width: 36px !important;
		height: 36px !important;
		border-radius: 50% !important;
		border: 0 !important;
		object-fit: cover !important;
		display: block !important;
	}
	/* Hide BP's chatty "Hey [name], share what you're up to" greeting —
	   the textarea placeholder covers it on desktop and it just adds
	   vertical bulk. */
	body.snifffr-desktop-beta #buddypress .activity-greeting,
	body.snifffr-desktop-beta #buddypress p.activity-greeting {
		display: none !important;
	}
	/* Textarea slot — takes the input grid area. Starts compact, expands
	   on focus. */
	body.snifffr-desktop-beta #buddypress #whats-new-content {
		grid-area: input !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-textarea {
		margin: 0 !important;
		margin-bottom: 5px !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-textarea textarea,
	body.snifffr-desktop-beta #buddypress #whats-new {
		display: block !important;
		width: 100% !important;
		min-height: 40px !important;
		padding: 9px 14px !important;
		font-size: 13.5px !important;
		line-height: 1.4 !important;
		color: #1a1a1a !important;
		background: #fafaff !important;
		border: 1px solid rgba(66, 62, 89, 0.14) !important;
		border-radius: 10px !important;
		box-shadow: none !important;
		resize: none !important;
		box-sizing: border-box !important;
		transition: min-height 0.15s ease, background 0.15s ease, border-color 0.15s ease;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-textarea textarea:focus,
	body.snifffr-desktop-beta #buddypress #whats-new:focus {
		outline: none !important;
		min-height: 64px !important;
		background: #fff !important;
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	/* Action row — media-attach icons left, Post Update right. Spans both
	   grid columns so it lines up under the avatar AND the textarea. */
	body.snifffr-desktop-beta #buddypress #whats-new-options {
		grid-area: actions !important;
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 8px !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		overflow: visible !important;
		min-height: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-submit {
		display: inline-flex !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		width: auto !important;
		text-align: right !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-submit br {
		display: none !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-submit input[type="submit"],
	body.snifffr-desktop-beta #buddypress #whats-new-submit .btn-primary,
	body.snifffr-desktop-beta #buddypress .btn-primary.upgrade.postupdate,
	body.snifffr-desktop-beta #buddypress #aw-whats-new-submit {
		display: inline-flex !important;
		align-items: center !important;
		width: auto !important;
		float: none !important;
		margin: 0 !important;
		padding: 6px 16px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		box-shadow: 0 2px 6px rgba(230, 92, 149, 0.25) !important;
		transition: background 0.15s ease !important;
		cursor: pointer !important;
	}
	body.snifffr-desktop-beta #buddypress #whats-new-submit input[type="submit"]:hover,
	body.snifffr-desktop-beta #buddypress #whats-new-submit .btn-primary:hover,
	body.snifffr-desktop-beta #buddypress .btn-primary.upgrade.postupdate:hover {
		background: #d24a7d !important;
	}

	/* Activity-stream list. Each entry is a white card. */
	body.snifffr-desktop-beta #buddypress ul.activity-list,
	body.snifffr-desktop-beta #buddypress .activity ul {
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
	}
	body.snifffr-desktop-beta #buddypress ul.activity-list > li {
		background: #fff !important;
		border: 0 !important;
		border-radius: 16px !important;
		padding: 18px 22px !important;
		margin: 0 0 12px !important;
		list-style: none !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
	}
	/* Activity avatars — BP outputs `<img class="avatar avatar-30 photo"
	   width="30" height="30">` with HTML width/height attributes that
	   compose with the CSS. Override via `img[width]` AND force the
	   parent .activity-avatar to clip to 48px so it can't render wider. */
	body.snifffr-desktop-beta #buddypress .activity-avatar {
		width: 48px !important;
		height: 48px !important;
		flex: 0 0 48px !important;
		margin: 0 !important;
		position: relative;
	}
	body.snifffr-desktop-beta #buddypress .activity-avatar a,
	body.snifffr-desktop-beta #buddypress .activity-avatar > a {
		display: block !important;
		width: 48px !important;
		height: 48px !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-avatar img,
	body.snifffr-desktop-beta #buddypress .activity-avatar a img,
	body.snifffr-desktop-beta #buddypress .activity-avatar img.avatar,
	body.snifffr-desktop-beta #buddypress .activity-avatar img[width],
	body.snifffr-desktop-beta #buddypress li .activity-avatar img,
	body.snifffr-desktop-beta #buddypress li.activity-item .activity-avatar img {
		width: 48px !important;
		height: 48px !important;
		max-width: 48px !important;
		min-width: 48px !important;
		max-height: 48px !important;
		min-height: 48px !important;
		border-radius: 50% !important;
		border: 0 !important;
		object-fit: cover !important;
		background: #f3f4f6 !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-header,
	body.snifffr-desktop-beta #buddypress .activity-header p {
		color: #1a1a1a !important;
		font-size: 14px !important;
		line-height: 1.5 !important;
		margin: 0 0 6px !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-header a {
		color: #e85d8f !important;
		font-weight: 700 !important;
		text-decoration: none !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-header a:hover {
		text-decoration: underline !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-header .time-since,
	body.snifffr-desktop-beta #buddypress .time-since {
		color: #6b7280 !important;
		font-size: 12px !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-inner {
		font-size: 14px !important;
		line-height: 1.5 !important;
		color: #1a1a1a !important;
		margin: 4px 0 !important;
	}

	/* Activity meta buttons — heart / delete / comment. Icon-only pills. */
	body.snifffr-desktop-beta #buddypress .activity-meta {
		display: flex !important;
		gap: 6px !important;
		margin-top: 8px !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-meta .button,
	body.snifffr-desktop-beta #buddypress .activity-meta a.button {
		display: inline-flex !important;
		align-items: center !important;
		gap: 4px !important;
		padding: 6px 12px !important;
		background: #fff !important;
		color: #6b7280 !important;
		border: 1px solid #e5e7eb !important;
		border-radius: 999px !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		text-decoration: none !important;
		transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-meta .button:hover {
		background: #fef0f5 !important;
		color: #e85d8f !important;
		border-color: #fbcfe1 !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-meta .button .fa-heart {
		color: #e85d8f !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-meta .delete {
		color: #9ca3af !important;
	}
	body.snifffr-desktop-beta #buddypress .activity-meta .delete:hover {
		background: #fef2f2 !important;
		color: #ef4444 !important;
		border-color: #fecaca !important;
	}

	/* Filter strip ("All Members" / "Friends" / "My Groups" tabs).
	   Belt-and-braces — kill the dark purple wrapper bg AND any nested
	   <div> chrome BP puts around the <ul>. */
	body.snifffr-desktop-beta #buddypress #object-nav,
	body.snifffr-desktop-beta #buddypress #subnav,
	body.snifffr-desktop-beta #buddypress div.item-list-tabs,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs,
	body.snifffr-desktop-beta #buddypress #activity-filter-by-wrap {
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
		margin: 0 0 12px !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta #buddypress div.item-list-tabs ul,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs ul {
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		display: flex !important;
		gap: 8px !important;
		list-style: none !important;
	}
	body.snifffr-desktop-beta #buddypress div.item-list-tabs ul li,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs ul li {
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
	}
	body.snifffr-desktop-beta #buddypress div.item-list-tabs ul li a,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs ul li a {
		display: inline-block !important;
		background: #fff !important;
		color: #6b7280 !important;
		border: 1px solid #e5e7eb !important;
		border-radius: 999px !important;
		padding: 8px 18px !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		box-shadow: none !important;
	}
	body.snifffr-desktop-beta #buddypress div.item-list-tabs ul li.selected a,
	body.snifffr-desktop-beta #buddypress div.item-list-tabs ul li.current a,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs ul li.selected a,
	body.snifffr-desktop-beta #buddypress div.activity-type-tabs ul li.current a {
		background: #e85d8f !important;
		color: #fff !important;
		border-color: #e85d8f !important;
	}

	/* Activity sidebar — uniform pill buttons + consistent vertical
	   rhythm. The legacy column is a sequence of <a class="btn btn-primary
	   purple/pink wide"> anchors with hard-coded margin-top values
	   between them. Force every sidebar element + every legacy button
	   variant + every accordion trigger to share the SAME visual weight:
	   - 14px vertical padding
	   - rounded pill
	   - no border (soft shadow instead — same as .snifffr-dp-card)
	   - 12px gap below
	   - bold uppercase 13px text
	   Only the background color differs between primary (pink) and
	   secondary (white) variants. */
	body.snifffr-desktop-beta .buyer-actcol > *,
	body.snifffr-desktop-beta .seller-actcol > *,
	body.snifffr-desktop-beta .buddyside .col-md-3 > *,
	body.snifffr-desktop-beta .buddyside .col-md-3 > a,
	body.snifffr-desktop-beta .buddyside .col-md-3 > p,
	body.snifffr-desktop-beta .buddyside .col-md-3 > br,
	body.snifffr-desktop-beta .buddyside .col-md-3 > div,
	body.snifffr-desktop-beta .buyer-actcol > *,
	body.snifffr-desktop-beta .seller-actcol > * {
		margin-top: 0 !important;
		margin-bottom: 12px !important;
	}
	/* Kill bare <br> tags the legacy markup uses between sidebar items
	   — they're what creates the random ~50px gaps. */
	body.snifffr-desktop-beta .buddyside .col-md-3 > br,
	body.snifffr-desktop-beta .buddyside > br,
	body.snifffr-desktop-beta .buyer-actcol > br,
	body.snifffr-desktop-beta .seller-actcol > br {
		display: none !important;
	}

	/* Bootstrap .card wrappers around the accordion buttons carry a 1px
	   border that reads as a harsh outline. Strip it and the .card-header
	   chrome so the inner <button> is the only visual element. */
	body.snifffr-desktop-beta .buddyside .card,
	body.snifffr-desktop-beta .activemob .card,
	body.snifffr-desktop-beta .buyer-actcol .card,
	body.snifffr-desktop-beta .seller-actcol .card {
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		margin: 0 0 12px !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta .buddyside .card-header,
	body.snifffr-desktop-beta .activemob .card-header,
	body.snifffr-desktop-beta .buyer-actcol .card-header,
	body.snifffr-desktop-beta .seller-actcol .card-header,
	body.snifffr-desktop-beta .buddyside .card .card-header {
		background: transparent !important;
		border: 0 !important;
		border-bottom: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		box-shadow: none !important;
	}
	body.snifffr-desktop-beta .buddyside .card-header h5,
	body.snifffr-desktop-beta .activemob .card-header h5,
	body.snifffr-desktop-beta .buyer-actcol .card-header h5,
	body.snifffr-desktop-beta .seller-actcol .card-header h5 {
		margin: 0 !important;
	}
	/* Card-body (the expanded accordion content) — give it the same card
	   chrome as the .snifffr-dp cards instead of Bootstrap defaults. */
	body.snifffr-desktop-beta .buddyside .card-body,
	body.snifffr-desktop-beta .activemob .card-body,
	body.snifffr-desktop-beta .buyer-actcol .card-body,
	body.snifffr-desktop-beta .seller-actcol .card-body {
		background: #fff !important;
		border: 0 !important;
		border-radius: 16px !important;
		padding: 18px 20px !important;
		margin: 6px 0 0 !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
		font-size: 13px !important;
		line-height: 1.5 !important;
	}

	/* "show_add_first_item_button" wraps its anchor in extra markup that
	   creates the big void between VIEW ALL BUYERS and CREATE YOUR FIRST
	   LISTING. Normalize. */
	body.snifffr-desktop-beta .show_add_first_item_button,
	body.snifffr-desktop-beta .add-first-item-wrap,
	body.snifffr-desktop-beta .buddyside .col-md-3 > .row,
	body.snifffr-desktop-beta .buddyside .col-md-3 > .col-12 {
		margin: 0 0 12px !important;
		padding: 0 !important;
	}

	/* Shared pill shell — every sidebar button + accordion trigger.
	   Now correctly includes the BP accordion triggers which are
	   `<button class="btn btn-link collapsed" data-toggle="collapse">`
	   wrapped in a .card-header > h5. */
	body.snifffr-desktop-beta .btn-primary.purple.wide,
	body.snifffr-desktop-beta .btn-primary.pink.wide,
	body.snifffr-desktop-beta a.btn-primary.purple.wide,
	body.snifffr-desktop-beta a.btn-primary.pink.wide,
	body.snifffr-desktop-beta a.afbi,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"],
	body.snifffr-desktop-beta a.btn-primary.collapsed[data-toggle="collapse"],
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"] {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		min-height: 48px !important;
		padding: 14px 18px !important;
		border-radius: 999px !important;
		border: 0 !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		text-decoration: none !important;
		margin: 0 0 12px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
		line-height: 1.2 !important;
		transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
	}

	/* Primary pink variant. */
	body.snifffr-desktop-beta .btn-primary.pink.wide,
	body.snifffr-desktop-beta a.btn-primary.pink.wide,
	body.snifffr-desktop-beta a.afbi {
		background: #e85d8f !important;
		color: #fff !important;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3) !important;
	}
	body.snifffr-desktop-beta .btn-primary.pink.wide:hover,
	body.snifffr-desktop-beta a.btn-primary.pink.wide:hover,
	body.snifffr-desktop-beta a.afbi:hover {
		background: #d24a7d !important;
		color: #fff !important;
	}

	/* Secondary white variant (View All Buyers / Join Live Chat / accordions). */
	body.snifffr-desktop-beta .btn-primary.purple.wide,
	body.snifffr-desktop-beta a.btn-primary.purple.wide,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"],
	body.snifffr-desktop-beta a.btn-primary.collapsed[data-toggle="collapse"],
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"] {
		background: #fff !important;
		color: #1a1a1a !important;
	}
	body.snifffr-desktop-beta .btn-primary.purple.wide:hover,
	body.snifffr-desktop-beta a.btn-primary.purple.wide:hover,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"]:hover,
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:hover,
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"]:hover,
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"]:hover {
		background: #f9fafb !important;
		color: #1a1a1a !important;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
	}

	/* Accordion trigger — chevron icon (the inner `<i class="fa">` BP
	   ships with) positioned absolute-right so it doesn't break the
	   centered text alignment. */
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"],
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"],
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"] {
		position: relative !important;
		justify-content: center !important;
		text-align: center !important;
	}
	/* Hide the legacy <i class="fa"> chevron — replaced by the +/−
	   pseudo-element below (matches the mobile redesign pattern). */
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"] i.fa,
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"] i.fa,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"] i.fa,
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"] i.fa,
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"] i.fa,
	body.snifffr-desktop-beta .profile-data-completelist button.pd .title i.fa,
	body.snifffr-desktop-beta .profile-data-completelist button.pd i.fa {
		display: none !important;
	}

	/* +/− toggle indicator, pinned to the right edge of each accordion
	   trigger. Pink, light weight; "+" when collapsed, "−" when open. */
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]::after,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]::after,
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"]::after,
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"]::after,
	body.snifffr-desktop-beta .profile-data-completelist button.pd::after {
		content: "+" !important;
		position: absolute !important;
		top: 50% !important;
		right: 18px !important;
		transform: translateY(-50%) !important;
		color: #e85d8f !important;
		font-size: 20px !important;
		font-weight: 400 !important;
		line-height: 1 !important;
		z-index: 3 !important;
	}
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]:not(.collapsed)::after,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:not(.collapsed)::after,
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"]:not(.collapsed)::after,
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"]:not(.collapsed)::after,
	body.snifffr-desktop-beta .profile-data-completelist button.pd:not(.collapsed)::after {
		content: "−" !important;
	}

	/* Kill Bootstrap's focus / active / hover artifacts. Bootstrap's
	   .btn:focus adds a blue box-shadow ring that survives after a click
	   and reads as a hard border around the recently-clicked pill —
	   that's the residual styling on HOW DOES SNIFFFR WORK? in the
	   screenshot. .btn-link also adds text-decoration: underline on
	   :hover. Override all three states to the same soft shadow as the
	   default. */
	body.snifffr-desktop-beta .btn-primary.purple.wide:focus,
	body.snifffr-desktop-beta .btn-primary.pink.wide:focus,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"]:focus,
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]:focus,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:focus,
	body.snifffr-desktop-beta .buyer-actcol button.btn.btn-link[data-toggle="collapse"]:focus,
	body.snifffr-desktop-beta .seller-actcol button.btn.btn-link[data-toggle="collapse"]:focus,
	body.snifffr-desktop-beta .btn-primary.purple.wide:active,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"]:active,
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]:active,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:active,
	body.snifffr-desktop-beta .btn-primary.purple.wide:focus-visible,
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"]:focus-visible,
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]:focus-visible,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:focus-visible {
		outline: 0 !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
		text-decoration: none !important;
		border: 0 !important;
	}
	body.snifffr-desktop-beta .buddyside button.btn.btn-link[data-toggle="collapse"]:hover,
	body.snifffr-desktop-beta .activemob button.btn.btn-link[data-toggle="collapse"]:hover {
		text-decoration: none !important;
	}

	/* "BUYERS ONLINE NOW" widget (and any sibling info widgets). */
	body.snifffr-desktop-beta .activity-permalink .col-md-3,
	body.snifffr-desktop-beta div.activity .col-md-3 > div,
	body.snifffr-desktop-beta .buyer-actcol > div,
	body.snifffr-desktop-beta .seller-actcol > div {
		background: transparent;
	}

	/* (Accordion trigger styling consolidated into the shared pill shell
	   above — no separate rule needed.) */
	body.snifffr-desktop-beta a.btn-primary[data-toggle="collapse"]:hover {
		background: #f9fafb !important;
		border-color: #d1d5db !important;
		color: #1a1a1a !important;
	}

	/* Profile-completion accordion — different markup from the
	   .btn.btn-link[data-toggle="collapse"] siblings:
	     <div class="profile-data-completelist">
	       <button class="pd collapsed" data-toggle="collapse" ...>
	         <p class="title"><svg/> Profile Completion: 0% <i/></p>
	         <div class="progress-bar"></div>
	       </button>
	     </div>
	   Legacy CSS gives `button.pd` a 1px purple border + 0 radius +
	   white bg. Override to the unified pill aesthetic, with the
	   progress-bar repurposed as a thin pink fill at the pill's
	   bottom edge (keeps the visual % indicator). */

	/* Outer wrap — make it a transparent shell, NOT a card. The card
	   shell would double-up with the button below. */
	body.snifffr-desktop-beta .profile-data-completelist {
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		margin: 0 0 25px !important;
		padding: 0 !important;
		box-shadow: none !important;
		overflow: visible !important;
	}

	/* The pill itself — match the .buyer-actcol / .seller-actcol /
	   .buddyside button shape. */
	body.snifffr-desktop-beta .profile-data-completelist button.pd {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		position: relative !important;
		width: 100% !important;
		min-height: 48px !important;
		padding: 14px 18px !important;
		background: #fff !important;
		color: #1a1a1a !important;
		border: 0 !important;
		border-radius: 999px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		line-height: 1.2 !important;
		overflow: hidden !important;     /* clip the progress-bar fill */
		text-decoration: none !important;
		transition: box-shadow 0.15s ease !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist button.pd:hover,
	body.snifffr-desktop-beta .profile-data-completelist button.pd:focus,
	body.snifffr-desktop-beta .profile-data-completelist button.pd:active {
		outline: 0 !important;
		border: 0 !important;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
		background: #f9fafb !important;
		text-decoration: none !important;
	}

	/* Title — inline row of svg icon + text + chevron. */
	body.snifffr-desktop-beta .profile-data-completelist button.pd .title {
		display: inline-flex !important;
		align-items: center !important;
		gap: 8px !important;
		margin: 0 !important;
		padding: 0 !important;
		color: #1a1a1a !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		text-align: center !important;
		line-height: 1.2 !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist button.pd .title svg {
		width: 14px !important;
		height: 14px !important;
		flex-shrink: 0 !important;
		margin: 0 !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist button.pd .title svg path {
		fill: #6b7280 !important;
	}
	/* Chevron — absolute-right, matches the other accordion triggers. */
	body.snifffr-desktop-beta .profile-data-completelist button.pd .title i.fa,
	body.snifffr-desktop-beta .profile-data-completelist button.pd i.fa {
		position: absolute !important;
		right: 18px !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
	}

	/* Progress-bar — thin pink fill at the bottom edge of the pill. */
	body.snifffr-desktop-beta .profile-data-completelist .pd .progress-bar {
		position: absolute !important;
		bottom: 0 !important;
		left: 0 !important;
		height: 3px !important;
		background: #e85d8f !important;
		border-radius: 0 !important;
		transition: width 0.3s ease !important;
		/* width is inline (e.g. style="width: 25%") — keep it */
	}

	/* Expanded checklist content — sits inside #demo1, .collapse.show.
	   Match the .card-body / .snifffr-dp-card look so it doesn't
	   re-introduce the legacy `border: solid 1px` from #demo1.show. */
	/* Apply padding + chrome on .collapse AND .collapsing directly (not just
	   on .collapse.show) so the scrollHeight Bootstrap measures during the
	   open animation already includes them. Otherwise the panel "jumps"
	   right and down at the instant .collapsing flips to .collapse.show. */
	body.snifffr-desktop-beta .profile-data-completelist .collapse,
	body.snifffr-desktop-beta .profile-data-completelist .collapsing {
		background: #fff !important;
		padding: 18px 20px !important;
		border: 0 !important;
		border-radius: 16px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04) !important;
		margin: 6px 0 0 !important;
		box-sizing: border-box !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist .collapsing {
		overflow: hidden !important;
	}

	/* Intro paragraph — "Complete your profile to increase visibility…" */
	body.snifffr-desktop-beta .profile-data-completelist p.pctv {
		color: var(--color-purple) !important;
		opacity: 0.78 !important;
		font-size: 13px !important;
		margin: 0 0 12px !important;
		line-height: 1.45 !important;
	}

	/* Checklist — mirror the mobile pattern: flat list, row separators,
	   pink circular checkbox that fills when complete, strike-through for
	   completed tasks. */
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li {
		list-style: none !important;
		display: flex !important;
		align-items: center !important;
		gap: 12px !important;
		padding: 10px 0 !important;
		margin: 0 !important;
		border-bottom: 1px solid rgba(51, 46, 77, 0.05) !important;
		background: transparent !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li:last-child {
		border-bottom: 0 !important;
	}

	/* Empty checkbox — grey ring, white centre. */
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li .checkbox {
		flex-shrink: 0 !important;
		width: 20px !important;
		height: 20px !important;
		border: 1.5px solid rgba(51, 46, 77, 0.20) !important;
		border-radius: 50% !important;
		background: #fff !important;
		background-image: none !important;
		position: relative !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	/* Filled checkbox (task done) — solid pink with white tick. */
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li .checkbox.true {
		border-color: var(--color-pink) !important;
		background: var(--color-pink) !important;
		background-image: none !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li .checkbox.true::after {
		content: "" !important;
		position: absolute !important;
		top: 50% !important;
		left: 50% !important;
		width: 9px !important;
		height: 5px !important;
		border-left: 2px solid #fff !important;
		border-bottom: 2px solid #fff !important;
		transform: translate(-50%, -65%) rotate(-45deg) !important;
	}

	/* Task label link — dark purple, pink on hover. */
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li a {
		color: var(--color-purple) !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		text-decoration: none !important;
		flex: 1 !important;
		line-height: 1.3 !important;
		transition: color 0.15s ease !important;
	}
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li a:hover {
		color: var(--color-pink) !important;
	}
	/* Completed task — muted + strike-through. */
	body.snifffr-desktop-beta .profile-data-completelist ul.task_complete_data li a.trues {
		color: var(--color-purple) !important;
		opacity: 0.55 !important;
		text-decoration: line-through !important;
	}

	/* Welcome card.
	   Design intent: a white card that quietly nods to the pink/lavender
	   brand palette without competing with the actual pink-pill CTAs
	   below it. The treatment:
	     - Mostly-white background with a soft pink→lavender gradient
	       wash (~7% alpha) — feels warm but doesn't read as "another
	       pink button"
	     - Heart emoji "💕" before the heading — adds personality and a
	       splash of color in place of a saturated background fill
	     - Pink accent bar at the top of the card (3px) — gives the card
	       brand identity in a single, controlled stroke
	     - Heading in dark default text, body in muted grey — matches
	       the typography of every other .snifffr-dp card so the rhythm
	       stays consistent
	     - Same border-radius / shadow weight as the white .snifffr-dp
	       cards so it sits in the rhythm of the column. */
	body.snifffr-desktop-beta .welcomebuyermob {
		position: relative !important;
		background:
			linear-gradient(135deg, rgba(232, 93, 143, 0.06), rgba(231, 226, 255, 0.5)) !important;
		border: 0 !important;
		border-radius: 16px !important;
		padding: 20px 22px 18px !important;
		margin: 0 0 12px !important;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04) !important;
		text-align: center !important;
		overflow: hidden !important;
	}
	/* Pink accent bar at top — single 3px stripe gives it brand identity. */
	body.snifffr-desktop-beta .welcomebuyermob::before {
		content: "" !important;
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		height: 3px !important;
		background: linear-gradient(90deg, #e85d8f, #b794f6) !important;
	}
	/* Heart emoji before the heading. The heading h5 is left intact so
	   screen readers still get the text; the heart is decorative. */
	body.snifffr-desktop-beta .welcomebuyermob h5::before {
		content: "💕" !important;
		display: inline-block !important;
		margin-right: 6px !important;
		font-size: 14px !important;
		vertical-align: -1px !important;
	}
	body.snifffr-desktop-beta .welcomebuyermob h5 {
		margin: 0 0 6px !important;
		padding: 0 !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.05em !important;
		color: #1a1a1a !important;
		line-height: 1.3 !important;
	}
	body.snifffr-desktop-beta .welcomebuyermob p {
		margin: 0 !important;
		padding: 0 !important;
		font-size: 12px !important;
		line-height: 1.55 !important;
		color: #6b7280 !important;
	}

	/* Buyer welcome card on /activity/ — same chrome as the seller variant
	   (.welcomebuyermob) so both audiences see consistent onboarding. */
	body.snifffr-desktop-beta .welcomebuyerdesk {
		position: relative !important;
		background:
			linear-gradient(135deg, rgba(232, 93, 143, 0.06), rgba(231, 226, 255, 0.5)) !important;
		border: 0 !important;
		border-radius: 16px !important;
		padding: 20px 22px 18px !important;
		margin: 0 0 25px !important;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04) !important;
		text-align: center !important;
		overflow: hidden !important;
	}
	body.snifffr-desktop-beta .welcomebuyerdesk::before {
		content: "" !important;
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		height: 3px !important;
		background: linear-gradient(90deg, #e85d8f, #b794f6) !important;
	}
	body.snifffr-desktop-beta .welcomebuyerdesk h5::before {
		content: "💕" !important;
		display: inline-block !important;
		margin-right: 6px !important;
		font-size: 14px !important;
		vertical-align: -1px !important;
	}
	body.snifffr-desktop-beta .welcomebuyerdesk h5 {
		margin: 0 0 6px !important;
		padding: 0 !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.05em !important;
		color: #1a1a1a !important;
		line-height: 1.3 !important;
	}
	body.snifffr-desktop-beta .welcomebuyerdesk p {
		margin: 0 !important;
		padding: 0 !important;
		font-size: 12px !important;
		line-height: 1.55 !important;
		color: #6b7280 !important;
	}

	/* "3 buyers online now" live-status pill.
	   Markup: `<div class="newmemtoday-mob">3 <a href="/buyers/">buyers online now</a></div>`.
	   Designed as a presence indicator — a pulsing green dot communicates
	   real-time data, a large pink number is the hero, the muted label
	   plays second fiddle. Hover lifts subtly. The entire pill is the
	   clickable target because the inner anchor expands to fill it. */
	body.snifffr-desktop-beta .newmemtoday-mob {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 10px !important;
		position: relative !important;
		width: 100% !important;
		min-height: 48px !important;
		padding: 12px 18px 12px 36px !important;
		background: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
		color: #6b7280 !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.06em !important;
		line-height: 1.2 !important;
		text-align: center !important;
		margin: 0 0 12px !important;
		overflow: hidden !important;
		transition: box-shadow 0.15s ease, transform 0.05s ease !important;
	}
	/* Pink number (the leading text-node "3 ") is hard to style without
	   a wrapping element, so we use a flex order trick + adjacent
	   styling. Browsers treat plain text nodes between elements as
	   anonymous flex items in display:flex parents — that text gets
	   the parent's color/size unless overridden by a child. So apply
	   the BIG pink treatment via the parent text rule, then re-style
	   the inner <a> to be smaller & muted. */
	body.snifffr-desktop-beta .newmemtoday-mob {
		color: #e85d8f !important;       /* count colour (text node) */
		font-size: 20px !important;
		font-weight: 800 !important;
	}
	/* Green pulsing dot — absolute on the left of the pill. */
	body.snifffr-desktop-beta .newmemtoday-mob::before {
		content: "" !important;
		position: absolute !important;
		left: 18px !important;
		top: 50% !important;
		width: 10px !important;
		height: 10px !important;
		margin-top: -5px !important;
		border-radius: 50% !important;
		background: #10b981 !important;
		box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7) !important;
		animation: snifffr-dp-pulse 2s infinite !important;
	}
	body.snifffr-desktop-beta .newmemtoday-mob a {
		color: #6b7280 !important;
		font-size: 11px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.08em !important;
		text-decoration: none !important;
		line-height: 1.2 !important;
		transition: color 0.15s ease !important;
	}
	body.snifffr-desktop-beta .newmemtoday-mob:hover {
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), 0 4px 14px rgba(0, 0, 0, 0.06) !important;
	}
	body.snifffr-desktop-beta .newmemtoday-mob:hover a {
		color: #1a1a1a !important;
	}

	/* Featured Sellers widget on /activity/ — desktop variant. Mirrors the
	   mobile .buyers_feat_widget_mobile treatment (white card, soft border,
	   centered title with pink star, avatar row). Legacy custom.css gives
	   this a flat white + drop-shadow look; replace with the redesign card
	   rhythm + tidy the BP-Featured-Members widget output inside it. */
	body.snifffr-desktop-beta .buyers_feat_widget_desk {
		background: #fff !important;
		border: 1px solid rgba(51, 46, 77, 0.08) !important;
		border-radius: 14px !important;
		padding: 18px 18px 14px !important;
		margin: 18px 0 !important;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04) !important;
		text-align: center !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk > h4 {
		color: var(--snifffr-mp-purple, #423E59) !important;
		font-size: 15px !important;
		font-weight: 700 !important;
		margin: 0 0 12px !important;
		letter-spacing: 0.3px;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk > h4 span {
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	/* Hide the lightSlider side chevrons — desktop has room but they look
	   noisy next to the smaller avatar circles. Use a horizontal scroller
	   like the mobile pattern. */
	body.snifffr-desktop-beta .buyers_feat_widget_desk .lSAction,
	body.snifffr-desktop-beta .buyers_feat_widget_desk .lSAction > a {
		display: none !important;
	}
	/* BP/lightSlider wrappers — strip inline transforms / widths so items
	   flow naturally into the flex scroller. */
	body.snifffr-desktop-beta .buyers_feat_widget_desk .lSSlideOuter,
	body.snifffr-desktop-beta .buyers_feat_widget_desk .lSSlideWrapper,
	body.snifffr-desktop-beta .buyers_feat_widget_desk .bp-featured-members-widget {
		background: transparent !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .lSSlideWrapper.usingCss {
		transition: none !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk ul.item-list,
	body.snifffr-desktop-beta .buyers_feat_widget_desk ul.lightSlider {
		display: flex !important;
		justify-content: center !important;
		flex-wrap: wrap !important;
		gap: 14px !important;
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
		width: auto !important;
		height: auto !important;
		transform: none !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk ul li.featured-member-item {
		flex: 0 0 auto !important;
		width: 88px !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-avatar {
		margin: 0 !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-avatar img {
		width: 72px !important;
		height: 72px !important;
		border-radius: 50% !important;
		border: 0 !important;
		display: block !important;
		margin: 0 auto !important;
		object-fit: cover !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-avatar::after {
		content: none !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-title {
		display: block !important;
		max-width: 88px !important;
		margin: 8px auto 0 !important;
		padding: 0 !important;
		background: transparent !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		text-align: center !important;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-title a {
		color: inherit !important;
		text-decoration: none !important;
	}
	body.snifffr-desktop-beta .buyers_feat_widget_desk .widget.buddypress span.activity,
	body.snifffr-desktop-beta .buyers_feat_widget_desk .item-meta {
		display: none !important;
	}

	/* Pulse keyframes — soft green ripple. Defined once, used by both
	   the online-counter pill and any future live-presence indicators. */
	@keyframes snifffr-dp-pulse {
		0%   { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5); }
		70%  { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
		100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
	}

	/* "3 BUYERS ONLINE NOW" widget — dynamic_sidebar('buyers_mobile').
	   Renders as a widget with a dashed/dotted border in the legacy
	   styling. Override the wrapper + any inner anchors/spans so it
	   matches the unified pill aesthetic. */
	body.snifffr-desktop-beta .buyers_widget_mobile {
		background: #fff !important;
		border: 0 !important;
		border-radius: 30px !important;
		padding: 0 !important;
		margin: 0 0 12px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
		overflow: hidden !important;
		text-align: center !important;
	}
	/* Whatever widget body lands inside — kill its borders/backgrounds
	   and make it act as a centered pill content. */
	body.snifffr-desktop-beta .buyers_widget_mobile > *,
	body.snifffr-desktop-beta .buyers_widget_mobile .widget,
	body.snifffr-desktop-beta .buyers_widget_mobile aside,
	body.snifffr-desktop-beta .buyers_widget_mobile section {
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		box-shadow: none !important;
	}
	body.snifffr-desktop-beta .buyers_widget_mobile a,
	body.snifffr-desktop-beta .buyers_widget_mobile p,
	body.snifffr-desktop-beta .buyers_widget_mobile span,
	body.snifffr-desktop-beta .buyers_widget_mobile h1,
	body.snifffr-desktop-beta .buyers_widget_mobile h2,
	body.snifffr-desktop-beta .buyers_widget_mobile h3,
	body.snifffr-desktop-beta .buyers_widget_mobile h4,
	body.snifffr-desktop-beta .buyers_widget_mobile h5,
	body.snifffr-desktop-beta .buyers_widget_mobile h6 {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		min-height: 48px !important;
		margin: 0 !important;
		padding: 14px 18px !important;
		background: transparent !important;
		color: #1a1a1a !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		line-height: 1.2 !important;
		text-decoration: none !important;
		border: 0 !important;
		text-align: center !important;
	}
	body.snifffr-desktop-beta .buyers_widget_mobile a:hover {
		background: #f9fafb !important;
		color: #1a1a1a !important;
	}
	/* Pink "3" number prefix — emphasize. */
	body.snifffr-desktop-beta .buyers_widget_mobile strong,
	body.snifffr-desktop-beta .buyers_widget_mobile b,
	body.snifffr-desktop-beta .buyers_widget_mobile .count {
		color: #e85d8f !important;
		font-weight: 700 !important;
		margin-right: 6px !important;
	}

	/* "Load More" pagination — `<li class="load-more"><a>Load More</a></li>`
	   at the bottom of the activity feed. Default rendering: white-on-white
	   (invisible). Replace with a centered pink pill matching the rest
	   of the desktop redesign. */
	body.snifffr-desktop-beta #buddypress ul.activity-list li.load-more,
	body.snifffr-desktop-beta #buddypress li.load-more {
		background: transparent !important;
		border: 0 !important;
		box-shadow: none !important;
		padding: 8px 0 !important;
		margin: 4px 0 12px !important;
		text-align: center !important;
		list-style: none !important;
	}
	body.snifffr-desktop-beta #buddypress li.load-more a {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 12px 32px !important;
		background: #e85d8f !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		text-decoration: none !important;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3) !important;
		transition: background 0.15s ease !important;
	}
	body.snifffr-desktop-beta #buddypress li.load-more a:hover {
		background: #d24a7d !important;
		color: #fff !important;
	}

	/* Notification banner ("Your account is now active!"). */
	body.snifffr-desktop-beta #buddypress div#message.success,
	body.snifffr-desktop-beta #buddypress #message.success {
		background: #d1fae5 !important;
		color: #047857 !important;
		border: 0 !important;
		border-left: 4px solid #10b981 !important;
		border-radius: 12px !important;
		padding: 12px 16px !important;
		margin: 0 0 16px !important;
		font-size: 14px !important;
	}

	/* ── Blur (parity with mobile flag semantics) ────────────────── */
	.snifffr-dp--blur-cover .snifffr-dp-cover-wrap {
		position: relative;
	}
	.snifffr-dp--blur-cover .snifffr-dp-cover {
		filter: blur(14px);
		cursor: pointer;
	}
	/* "🔒 Verify Age to View Image" overlay on the cover hero. Sits above
	   the blurred .snifffr-dp-cover via z-index so it isn't itself blurred.
	   White text on a dark scrim — same content the legacy .lock-image
	   ::before paints, ported to the redesign chrome. */
	.snifffr-dp--blur-cover .snifffr-dp-cover-wrap {
		cursor: pointer;
	}
	.snifffr-dp--blur-cover .snifffr-dp-cover-wrap::after {
		content: "🔒 Verify Age to View Image";
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(0, 0, 0, 0.4);
		color: #fff;
		font-size: 15px;
		font-weight: 600;
		letter-spacing: 0.02em;
		text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
		pointer-events: none;
		z-index: 3;
	}

	/* Avatar blur — `filter: blur()` ignores the img's own border-radius
	   and bleeds a square halo outside the circle. Clip the halo via the
	   wrapper (overflow: hidden + 50% radius), scale the img up so the
	   blur falloff stays inside the visible circle, and move the white
	   ring + shadow onto the wrapper so the full circle silhouette is
	   always visible even when the blurred image fades to transparent at
	   its edges. Lavender background tint fills any transparent regions
	   so the avatar reads as a complete portrait, not a half-dome. */
	.snifffr-dp--blur-avatar .snifffr-dp-avatar {
		overflow: hidden !important;
		background: #efeaff !important;
		border: 4px solid #fff !important;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
		box-sizing: border-box !important;
		cursor: pointer;
	}
	.snifffr-dp--blur-avatar .snifffr-dp-avatar img {
		width: 100% !important;
		height: 100% !important;
		filter: blur(10px);
		transform: scale(1.15);
		transform-origin: center center;
		border: 0 !important;
		box-shadow: none !important;
	}
	/* "Verify Age" lock overlay on the blurred avatar — small lock icon
	   + 2-line label centered inside the circle (text is tiny inside the
	   160px disc so we cap the label width and let it wrap). Dark scrim
	   makes it readable over any underlying portrait tone. */
	.snifffr-dp--blur-avatar .snifffr-dp-avatar::after {
		content: "Verify Age to View Image";
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 14px;
		background: rgba(0, 0, 0, 0.45);
		color: #fff;
		font-size: 11px;
		font-weight: 600;
		line-height: 1.25;
		letter-spacing: 0.02em;
		text-align: center;
		white-space: normal;
		border-radius: 50%;
		box-sizing: border-box;
		pointer-events: none;
		z-index: 3;
	}

	/* ── /profile/edit/ — desktop edit shell ───────────────────────
	   Mirrors the mobile .snifffr-mpe structure but laid out for the
	   desktop column: max-width card, 2-column field grid, sticky
	   save bar at the bottom. Same tab pattern as the profile tabs
	   above (pink-filled active, outlined idle) so the visual rhythm
	   stays consistent across both views. */
	.snifffr-dpe {
		max-width: 880px;
		margin: 0 auto;
		padding: 24px 0 32px;
	}
	.snifffr-dpe-header {
		display: flex;
		align-items: center;
		gap: 16px;
		margin: 0 0 20px;
		padding: 0 4px;
	}
	.snifffr-dpe-back {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 14px;
		background: #fff;
		color: #423e59;
		border: 1px solid rgba(51, 46, 77, 0.12);
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dpe-back:hover {
		background: rgba(232, 93, 143, 0.08);
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dpe-title {
		font-size: 22px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0;
		line-height: 1.2;
	}

	/* Tab strip — same pill pattern as the profile-view tabs. */
	.snifffr-dpe-tabs {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin: 0 0 16px;
		padding: 6px;
		background: #fff;
		border-radius: 999px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		align-items: center;
	}
	.snifffr-dpe-tab {
		appearance: none;
		display: inline-flex;
		align-items: center;
		padding: 10px 20px;
		background: transparent;
		color: #6b7280;
		border: 0;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dpe-tab:hover {
		background: #f3f4f6;
		color: #1a1a1a;
	}
	.snifffr-dpe-tab.is-active {
		background: #e85d8f;
		color: #fff;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
	}

	/* Form card. */
	.snifffr-dpe-form,
	.snifffr-dpe-panel--interview {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	}
	.snifffr-dpe-panel[hidden] {
		display: none;
	}
	/* Hide the xprofile "Save changes" card entirely when the Interview tab
	   is active. Interview answers post via their own AJAX handler
	   (snifffr_mp_interview_save) with its own "Save answers" button at the
	   bottom of the interview panel, so the xprofile form card up top is
	   both unused AND visually confusing (two save buttons in one view).
	   Mirrors the mobile rule at snifffr-mobile-redesign.css:1048.
	   The JS sets data-active-tab on the .snifffr-dpe root when the user
	   clicks a tab — initial-load case (URL is /group/N/) also flips it. */
	.snifffr-dpe[data-active-tab="interview"] .snifffr-dpe-form {
		display: none !important;
	}

	/* Field grid — 2 columns on desktop, 1 column for textareas + checks. */
	.snifffr-dpe-fields {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 18px 24px;
	}
	.snifffr-dpe-field--textarea,
	.snifffr-dpe-field--checkbox-group {
		grid-column: 1 / -1;
	}

	.snifffr-dpe-field {
		display: flex;
		flex-direction: column;
		gap: 6px;
	}
	.snifffr-dpe-label {
		font-size: 12px;
		font-weight: 600;
		color: #423e59;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		margin: 0;
	}
	.snifffr-dpe-input,
	.snifffr-dpe-select,
	.snifffr-dpe-textarea {
		width: 100%;
		padding: 10px 12px;
		background: #fff;
		color: #1a1a1a;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 8px;
		font-size: 14px;
		line-height: 1.4;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
		box-sizing: border-box;
	}
	.snifffr-dpe-textarea {
		resize: vertical;
		min-height: 160px;
	}
	.snifffr-dpe-input:focus,
	.snifffr-dpe-select:focus,
	.snifffr-dpe-textarea:focus {
		outline: 0;
		border-color: #e85d8f;
		box-shadow: 0 0 0 3px rgba(232, 93, 143, 0.15);
	}

	/* Checkbox pill grid — same chip style as the mobile shell. */
	.snifffr-dpe-checks {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	.snifffr-dpe-check {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 8px 14px;
		background: #fff;
		color: #423e59;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 999px;
		font-size: 13px;
		font-weight: 500;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	}
	.snifffr-dpe-check input[type="checkbox"] {
		display: none;
	}
	.snifffr-dpe-check.is-checked {
		background: #e85d8f;
		border-color: #e85d8f;
		color: #fff;
	}

	/* Feedback + actions. */
	.snifffr-dpe-feedback {
		margin: 18px 0 0;
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		font-weight: 500;
	}
	.snifffr-dpe-feedback.is-error {
		background: #fef2f2;
		color: #b91c1c;
	}
	.snifffr-dpe-feedback.is-success {
		background: #f0fdf4;
		color: #047857;
	}
	.snifffr-dpe-actions {
		display: flex;
		justify-content: flex-end;
		margin: 20px 0 0;
		padding: 18px 0 0;
		border-top: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dpe-submit,
	.snifffr-dpe-interview-save {
		appearance: none;
		padding: 12px 28px;
		background: #e85d8f;
		color: #fff;
		border: 0;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		transition: background 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dpe-submit:hover,
	.snifffr-dpe-interview-save:hover {
		background: #d24a7d;
	}
	.snifffr-dpe-submit:disabled,
	.snifffr-dpe-interview-save:disabled {
		opacity: 0.6;
		cursor: not-allowed;
	}

	/* Interview-tab specifics — question stack inside the same card chrome. */
	.snifffr-dpe-interview-intro {
		font-size: 14px;
		color: #6b7280;
		margin: 0 0 18px;
	}
	.snifffr-dpe-interview-list {
		display: flex;
		flex-direction: column;
		gap: 18px;
	}
	.snifffr-dpe-q {
		display: flex;
		flex-direction: column;
		gap: 6px;
	}
	.snifffr-dpe-q-label {
		font-size: 13px;
		font-weight: 600;
		color: #1a1a1a;
		margin: 0;
	}
	.snifffr-dpe-q-input {
		width: 100%;
		padding: 10px 12px;
		background: #fff;
		color: #1a1a1a;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 8px;
		font-size: 14px;
		line-height: 1.5;
		resize: vertical;
		min-height: 100px;
		box-sizing: border-box;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dpe-q-input:focus {
		outline: 0;
		border-color: #e85d8f;
		box-shadow: 0 0 0 3px rgba(232, 93, 143, 0.15);
	}
	.snifffr-dpe-interview-empty {
		font-size: 14px;
		color: #6b7280;
		text-align: center;
		padding: 24px 0;
		margin: 0;
	}
	.snifffr-dpe-interview-feedback {
		margin: 18px 0 0;
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		font-weight: 500;
	}
	.snifffr-dpe-interview-feedback.is-error {
		background: #fef2f2;
		color: #b91c1c;
	}
	.snifffr-dpe-interview-feedback.is-success {
		background: #f0fdf4;
		color: #047857;
	}

	/* ── /settings/ — desktop settings shell ───────────────────────
	   Sidebar layout: vertical tab list on the left, body card on the
	   right. The body delegates to the mobile renderer functions
	   (snifffr_mps_render_*), so this block also restyles every
	   `.snifffr-mps-*` class the renderers output for the desktop
	   column width. */
	.snifffr-dps {
		max-width: 980px;
		margin: 0 auto;
		padding: 24px 0 40px;
	}
	.snifffr-dps-header {
		display: flex;
		align-items: center;
		gap: 16px;
		margin: 0 0 20px;
		padding: 0 4px;
	}
	.snifffr-dps-back {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 14px;
		background: #fff;
		color: #423e59;
		border: 1px solid rgba(51, 46, 77, 0.12);
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dps-back:hover {
		background: rgba(232, 93, 143, 0.08);
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dps-title {
		font-size: 22px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0;
		line-height: 1.2;
	}

	.snifffr-dps-shell {
		display: grid;
		grid-template-columns: 240px 1fr;
		gap: 20px;
		align-items: start;
	}

	.snifffr-dps-sidebar {
		display: flex;
		flex-direction: column;
		gap: 4px;
		background: #fff;
		border-radius: 14px;
		padding: 8px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		position: sticky;
		top: 80px;
	}
	.snifffr-dps-tab {
		display: block;
		padding: 11px 16px;
		color: #423e59;
		background: transparent;
		border-radius: 10px;
		font-size: 14px;
		font-weight: 600;
		text-decoration: none;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dps-tab:hover {
		background: rgba(232, 93, 143, 0.08);
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dps-tab.is-active {
		background: #e85d8f;
		color: #fff;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.25);
	}
	.snifffr-dps-tab.is-active:hover {
		background: #d24a7d;
		color: #fff;
	}

	.snifffr-dps-body {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	}
	.snifffr-dps-body-title {
		font-size: 18px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 18px;
		padding: 0 0 14px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}

	/* ── Renderer output (.snifffr-mps-*) overrides at desktop scale ──
	   The mobile renderers paint a column-stacked layout sized for narrow
	   viewports. Inside .snifffr-dps the same markup needs roomier
	   spacing, real input widths, and a card-less section style (the
	   body card already provides the surface). */
	.snifffr-dps .snifffr-mps-section {
		display: block;
		margin: 0 0 26px;
		padding: 0 0 22px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.06);
		background: transparent;
	}
	.snifffr-dps .snifffr-mps-section:last-of-type {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: 0;
	}
	.snifffr-dps .snifffr-mps-section-title {
		font-size: 15px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 14px;
	}
	.snifffr-dps .snifffr-mps-field-label {
		display: block;
		font-size: 12px;
		font-weight: 600;
		color: #423e59;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		margin: 0 0 6px;
	}
	.snifffr-dps .snifffr-mps-section input[type="text"],
	.snifffr-dps .snifffr-mps-section input[type="email"],
	.snifffr-dps .snifffr-mps-section input[type="password"],
	.snifffr-dps .snifffr-mps-section input[type="number"],
	.snifffr-dps .snifffr-mps-section select,
	.snifffr-dps .snifffr-mps-section textarea {
		width: 100%;
		max-width: 420px;
		padding: 10px 12px;
		background: #fff;
		color: #1a1a1a;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 8px;
		font-size: 14px;
		line-height: 1.4;
		box-sizing: border-box;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
		margin-bottom: 12px;
	}
	.snifffr-dps .snifffr-mps-section input:focus,
	.snifffr-dps .snifffr-mps-section select:focus,
	.snifffr-dps .snifffr-mps-section textarea:focus {
		outline: 0;
		border-color: #e85d8f;
		box-shadow: 0 0 0 3px rgba(232, 93, 143, 0.15);
	}
	.snifffr-dps .snifffr-mps-pw-wrap {
		position: relative;
		max-width: 420px;
	}
	.snifffr-dps .snifffr-mps-pw-wrap input {
		padding-right: 42px;
	}
	.snifffr-dps .snifffr-mps-pw-toggle {
		position: absolute;
		right: 8px;
		top: 50%;
		transform: translateY(-50%);
		background: transparent;
		border: 0;
		padding: 8px;
		color: #6b7280;
		cursor: pointer;
	}
	.snifffr-dps .snifffr-mps-pw-toggle:hover {
		color: #e65c95;
	}

	.snifffr-dps .snifffr-mps-save,
	.snifffr-dps .snifffr-mps-section button[type="submit"],
	.snifffr-dps .snifffr-mps-section input[type="submit"] {
		appearance: none;
		padding: 11px 24px;
		background: #e85d8f;
		color: #fff;
		border: 0;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		transition: background 0.15s ease;
	}
	.snifffr-dps .snifffr-mps-save:hover,
	.snifffr-dps .snifffr-mps-section button[type="submit"]:hover,
	.snifffr-dps .snifffr-mps-section input[type="submit"]:hover {
		background: #d24a7d;
	}
	.snifffr-dps .snifffr-mps-save:disabled {
		opacity: 0.6;
		cursor: not-allowed;
	}

	/* Feedback chips. */
	.snifffr-dps .snifffr-mps-feedback {
		display: inline-block;
		margin-left: 12px;
		padding: 8px 12px;
		border-radius: 8px;
		font-size: 13px;
		font-weight: 500;
		vertical-align: middle;
	}
	.snifffr-dps .snifffr-mps-feedback.is-error {
		background: #fef2f2;
		color: #b91c1c;
	}
	.snifffr-dps .snifffr-mps-feedback.is-success {
		background: #f0fdf4;
		color: #047857;
	}

	/* Notifications toggle list — keep the list shape but tighten the
	   row spacing for the desktop column. */
	.snifffr-dps .snifffr-mps-notifs {
		display: block;
	}
	.snifffr-dps .snifffr-mps-notif-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: 12px 0;
		border-bottom: 1px solid rgba(51, 46, 77, 0.05);
	}
	.snifffr-dps .snifffr-mps-notif-row:last-of-type {
		border-bottom: 0;
	}

	/* Privacy dropdown row. */
	.snifffr-dps .snifffr-mps-privacy-row {
		display: flex;
		align-items: center;
		gap: 14px;
		padding: 4px 0;
	}
	.snifffr-dps .snifffr-mps-privacy-row select {
		max-width: 260px;
	}

	/* Privacy Save submit — bp-profile-visibility-manager renders
	   `<input type="submit" id="bppv_save_submit" class="button" value="Save">`.
	   snifffr-mobile-redesign.css styles it as a full-width pink rectangle
	   (shared with the mobile settings shell). On desktop the rest of the
	   redesign uses the pink-purple gradient pill family (see .iu-empty-btn
	   / .iu-upsell-btn / .snifffr-msg-compose-btn), so override to match —
	   inline pill, gradient, soft shadow, hover lift. */
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy p.submit {
		text-align: right;
		margin-top: 24px;
	}
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy p.submit input[type="submit"],
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy #bppv_save_submit {
		display: inline-block !important;
		width: auto !important;
		max-width: none !important;
		padding: 12px 32px !important;
		margin: 0 !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		outline: 0 !important;
		border-radius: 999px !important;
		font-size: 14px !important;
		font-weight: 600 !important;
		letter-spacing: 0 !important;
		line-height: 1.2 !important;
		text-transform: none !important;
		cursor: pointer !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
		transition: background 0.15s ease, transform 0.05s ease !important;
		appearance: none;
		-webkit-appearance: none;
	}
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy p.submit input[type="submit"]:hover,
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy #bppv_save_submit:hover {
		background: #d24a7d !important;
	}
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy p.submit input[type="submit"]:active,
	body.snifffr-desktop-beta .snifffr-dps .snifffr-mps-privacy #bppv_save_submit:active {
		transform: translateY(1px);
	}

	/* Blocked-users list cells. */
	.snifffr-dps .snifffr-mps-blocked-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 10px 0;
		border-bottom: 1px solid rgba(51, 46, 77, 0.05);
	}
	.snifffr-dps .snifffr-mps-blocked-row:last-of-type {
		border-bottom: 0;
	}

	/* ── Plugin-tab bodies (Instant Media / Private Content / Reviews /
	   Interview / Friends, buyer purchase histories) ────────────────
	   These bodies render `bp_template_content` — the same hook BP /
	   each plugin uses on the legacy wrap. We don't replicate the
	   plugin markup; we just wrap the output in a white card and tame
	   the loud legacy chrome (subnav h3 duplicates, raw lists, etc.).
	   `overflow-x: hidden` + `min-width: 0` belt-and-braces: some plugin
	   markup (notably the private-content `<style>` + lightbox markup)
	   has intrinsic min-widths that overflowed the .snifffr-dp column
	   and pulled the seller-menu / navbar container narrower via
	   document-level horizontal scroll. Clamping the body card kills
	   that overflow chain. */
	.snifffr-dp-body--instant-unlocks,
	.snifffr-dp-body--private-content,
	.snifffr-dp-body--reviews,
	.snifffr-dp-body--seller-questionnaire,
	.snifffr-dp-body--friends,
	.snifffr-dp-body--iu-purchases,
	.snifffr-dp-body--private-content-purchases,
	.snifffr-dp-body--escrow,
	.snifffr-dp-body--messages,
	.snifffr-dp-body--notifications,
	.snifffr-dp-body--settings {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: hidden;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}
	.snifffr-dp-body--instant-unlocks *,
	.snifffr-dp-body--private-content *,
	.snifffr-dp-body--reviews *,
	.snifffr-dp-body--seller-questionnaire *,
	.snifffr-dp-body--friends *,
	.snifffr-dp-body--iu-purchases *,
	.snifffr-dp-body--private-content-purchases *,
	.snifffr-dp-body--escrow *,
	.snifffr-dp-body--messages *,
	.snifffr-dp-body--notifications *,
	.snifffr-dp-body--settings * {
		max-width: 100%;
		box-sizing: border-box;
	}

	/* ── Private Content sub-tabs (premium seller, own profile only) ─
	   Secondary tab strip inside the .snifffr-dp-body--private-content
	   card. Visual language: borderless pill-row that reads as a tab bar,
	   not a button group. Active state uses the lavender brand tint so it
	   contrasts with the pink primary action buttons on the page. */
	.snifffr-dp-pc-subtabs {
		display: flex;
		gap: 8px;
		margin: 0 0 20px;
		padding: 4px;
		background: var(--snifffr-mp-lavender, #ECEAF2);
		border-radius: 999px;
		width: fit-content;
	}
	.snifffr-dp-pc-subtab {
		display: inline-flex;
		align-items: center;
		padding: 8px 18px;
		font-size: 13px;
		font-weight: 600;
		color: var(--snifffr-mp-purple, #423E59);
		text-decoration: none !important;
		border-radius: 999px;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-pc-subtab:hover {
		color: var(--snifffr-mp-pink, #E65C95);
	}
	.snifffr-dp-pc-subtab.is-active {
		background: #fff;
		color: var(--snifffr-mp-purple, #423E59);
		box-shadow: 0 2px 6px rgba(66, 62, 89, 0.08);
	}

	/* ── Private Content / Settings — subscription pricing form ──────
	   4 rows × (label + token input). Form posts to the same URL so the
	   inline save handler in buddypress/members/single/private-setting.php
	   (loaded into the hidden legacy wrap) still processes the submit. */
	.snifffr-dp-pc-settings {
		display: block;
		max-width: 520px;
	}
	.snifffr-dp-pc-settings-intro {
		margin-bottom: 16px;
	}
	.snifffr-dp-pc-settings-title {
		font-size: 13px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.12em;
		color: var(--snifffr-mp-purple, #423E59);
		margin-bottom: 6px;
	}
	.snifffr-dp-pc-settings-hint {
		font-size: 13px;
		color: var(--snifffr-mp-purple-60, rgba(66, 62, 89, 0.6));
		margin: 0;
		line-height: 1.5;
	}
	.snifffr-dp-pc-settings-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: 14px 0;
		border-top: 1px solid var(--snifffr-mp-purple-08, rgba(66, 62, 89, 0.08));
	}
	.snifffr-dp-pc-settings-row:first-of-type {
		border-top: 0;
	}
	.snifffr-dp-pc-settings-label {
		font-size: 15px;
		font-weight: 600;
		color: var(--snifffr-mp-purple, #423E59);
	}
	.snifffr-dp-pc-settings-input {
		display: inline-flex;
		align-items: center;
		gap: 8px;
	}
	.snifffr-dp-pc-settings-input input[type="number"] {
		width: 100px;
		padding: 10px 12px !important;
		border: 1px solid rgba(66, 62, 89, 0.18) !important;
		border-radius: 10px !important;
		background: #fff !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		font-size: 14px !important;
		font-weight: 600 !important;
		text-align: right !important;
		-webkit-appearance: none;
		appearance: none;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-pc-settings-input input[type="number"]:focus {
		outline: none !important;
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.12) !important;
	}
	.snifffr-dp-pc-settings-suffix {
		font-size: 12px;
		color: var(--snifffr-mp-purple-60, rgba(66, 62, 89, 0.6));
		font-weight: 500;
	}
	.snifffr-dp-pc-settings-save {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin-top: 20px;
		padding: 12px 28px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		letter-spacing: 0.04em !important;
		cursor: pointer !important;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-pc-settings-save:hover {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.32);
	}

	/* ── Private Content / Subscribers — list of paying subscribers ──
	   One row per subscriber: avatar + name + duration/tokens/expiry
	   meta on the left, Active/Expired pill on the right. */
	.snifffr-dp-pc-subs {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	.snifffr-dp-pc-sub-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 14px 18px;
		background: #fff;
		border: 1px solid var(--snifffr-mp-purple-08, rgba(66, 62, 89, 0.08));
		border-radius: 14px;
		box-shadow: 0 2px 8px rgba(66, 62, 89, 0.04);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-pc-sub-row:hover {
		transform: translateY(-1px);
		box-shadow: 0 6px 18px rgba(66, 62, 89, 0.08);
	}
	.snifffr-dp-pc-sub-row.is-expired {
		opacity: 0.7;
	}
	.snifffr-dp-pc-sub-user {
		display: flex;
		align-items: center;
		gap: 14px;
		flex: 1 1 auto;
		min-width: 0;
		text-decoration: none !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
	}
	.snifffr-dp-pc-sub-avatar img {
		width: 44px;
		height: 44px;
		border-radius: 50%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-pc-sub-meta {
		display: flex;
		flex-direction: column;
		gap: 4px;
		min-width: 0;
	}
	.snifffr-dp-pc-sub-name {
		font-size: 15px;
		font-weight: 600;
		color: var(--snifffr-mp-purple, #423E59);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.snifffr-dp-pc-sub-detail {
		font-size: 12.5px;
		color: var(--snifffr-mp-purple-60, rgba(66, 62, 89, 0.6));
		line-height: 1.3;
	}
	.snifffr-dp-pc-sub-badge {
		display: inline-flex;
		align-items: center;
		padding: 6px 14px;
		font-size: 11.5px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		border-radius: 999px;
		flex-shrink: 0;
	}
	.snifffr-dp-pc-sub-row.is-active .snifffr-dp-pc-sub-badge {
		background: rgba(16, 185, 129, 0.12);
		color: #058160;
	}
	.snifffr-dp-pc-sub-row.is-expired .snifffr-dp-pc-sub-badge {
		background: rgba(66, 62, 89, 0.08);
		color: var(--snifffr-mp-purple-60, rgba(66, 62, 89, 0.6));
	}

	/* ── /settings/blocked/ ─────────────────────────────────────────
	   bp-block-member plugin renders <table class="users-blocked"> with
	   two stacked tables (member-type filter + individual blocked list)
	   plus a "Save" submit button. The raw markup is utilitarian — give
	   it the redesign's typography + spacing so it doesn't read as legacy
	   admin chrome. Pattern matches snifffr-mobile-redesign.css for the
	   same plugin output. */
	.snifffr-dp-body--settings .item-list-tabs,
	.snifffr-dp-body--settings #subnav,
	.snifffr-dp-body--settings > h3 {
		/* BP's settings sub-nav (General · Notifications · Privacy ·
		   Blocked · etc.) duplicates the tab we just clicked through —
		   the redesign tab bar already shows "Blocked" as active. */
		display: none !important;
	}
	.snifffr-dp-body--settings .users-blocked {
		width: 100% !important;
		border-collapse: collapse !important;
		margin: 0 0 18px !important;
		background: transparent !important;
	}
	.snifffr-dp-body--settings .users-blocked + .users-blocked {
		margin-top: 24px !important;
		border-top: 1px solid rgba(66, 62, 89, 0.10) !important;
		padding-top: 18px !important;
	}
	.snifffr-dp-body--settings .users-blocked tr {
		border: 0 !important;
		background: transparent !important;
	}
	.snifffr-dp-body--settings .users-blocked td {
		padding: 10px 0 !important;
		border: 0 !important;
		border-bottom: 1px solid rgba(66, 62, 89, 0.06) !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		font-size: 14px !important;
		line-height: 1.4 !important;
		vertical-align: middle !important;
		background: transparent !important;
	}
	.snifffr-dp-body--settings .users-blocked tr:last-child td {
		border-bottom: 0 !important;
	}
	/* First row of each table — section heading via <strong> inside td colspan=2. */
	.snifffr-dp-body--settings .users-blocked tr:first-child td strong {
		display: block;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0.12em !important;
		text-transform: uppercase !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		margin-bottom: 6px;
	}
	.snifffr-dp-body--settings .users-blocked td.user a {
		color: var(--snifffr-mp-purple, #423E59) !important;
		font-weight: 600 !important;
		text-decoration: none !important;
	}
	.snifffr-dp-body--settings .users-blocked td.user a:hover {
		color: var(--snifffr-mp-pink, #E65C95) !important;
	}
	.snifffr-dp-body--settings .users-blocked td.actions {
		text-align: right !important;
		width: 120px;
	}
	.snifffr-dp-body--settings .users-blocked td.actions a {
		display: inline-flex;
		align-items: center;
		padding: 6px 14px !important;
		background: transparent !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
		border: 1px solid var(--snifffr-mp-pink, #E65C95) !important;
		border-radius: 999px !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-body--settings .users-blocked td.actions a:hover {
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
	}
	/* Member-type checkbox row */
	.snifffr-dp-body--settings .users-blocked input[type="checkbox"] {
		width: 18px;
		height: 18px;
		margin: 0;
		accent-color: var(--snifffr-mp-pink, #E65C95);
		cursor: pointer;
	}
	/* Save button at the bottom of the member-type form. */
	.snifffr-dp-body--settings #settings-form input[type="submit"] {
		display: inline-flex !important;
		align-items: center;
		padding: 10px 22px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0.04em !important;
		cursor: pointer !important;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
		margin-top: 6px !important;
	}
	.snifffr-dp-body--settings #settings-form input[type="submit"]:hover {
		transform: translateY(-1px);
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.28);
	}

	/* Strip the legacy BP `#subnav` block — the redesign owns the tab
	   surface already so the inline sub-tab strip just duplicates it.
	   Escrow is the exception: #subnav is the Balance/Log/Orders sub-tab
	   pill row (the only way to switch between Tokens sections), so we
	   keep it visible and style it as pills further below. */
	.snifffr-dp-body--instant-unlocks #subnav,
	.snifffr-dp-body--private-content #subnav,
	.snifffr-dp-body--reviews #subnav,
	.snifffr-dp-body--seller-questionnaire #subnav,
	.snifffr-dp-body--friends #subnav,
	.snifffr-dp-body--iu-purchases #subnav,
	.snifffr-dp-body--private-content-purchases #subnav,
	.snifffr-dp-body--instant-unlocks .item-list-tabs,
	.snifffr-dp-body--private-content .item-list-tabs,
	.snifffr-dp-body--reviews .item-list-tabs,
	.snifffr-dp-body--seller-questionnaire .item-list-tabs,
	.snifffr-dp-body--friends .item-list-tabs,
	.snifffr-dp-body--iu-purchases .item-list-tabs,
	.snifffr-dp-body--private-content-purchases .item-list-tabs {
		display: none !important;
	}

	/* Tame headings the plugins paint inside their content (e.g. "My
	   Reviews", "My Instant Media") — they're redundant on a profile
	   where the tab strip already names the section. */
	.snifffr-dp-body--instant-unlocks > h2,
	.snifffr-dp-body--instant-unlocks > h3,
	.snifffr-dp-body--private-content > h2,
	.snifffr-dp-body--private-content > h3,
	.snifffr-dp-body--reviews > h2,
	.snifffr-dp-body--reviews > h3,
	.snifffr-dp-body--seller-questionnaire > h2,
	.snifffr-dp-body--seller-questionnaire > h3,
	.snifffr-dp-body--friends > h2,
	.snifffr-dp-body--friends > h3,
	.snifffr-dp-body--iu-purchases > h2,
	.snifffr-dp-body--iu-purchases > h3,
	.snifffr-dp-body--private-content-purchases > h2,
	.snifffr-dp-body--private-content-purchases > h3 {
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 16px;
		padding: 0 0 12px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}

	/* Empty-state messaging. */
	.snifffr-dp-body--instant-unlocks #message,
	.snifffr-dp-body--private-content #message,
	.snifffr-dp-body--reviews #message,
	.snifffr-dp-body--seller-questionnaire #message,
	.snifffr-dp-body--friends #message,
	.snifffr-dp-body--iu-purchases #message,
	.snifffr-dp-body--private-content-purchases #message,
	.snifffr-dp-body--escrow #message,
	.snifffr-dp-body--instant-unlocks .bp-feedback,
	.snifffr-dp-body--private-content .bp-feedback,
	.snifffr-dp-body--reviews .bp-feedback,
	.snifffr-dp-body--seller-questionnaire .bp-feedback,
	.snifffr-dp-body--friends .bp-feedback,
	.snifffr-dp-body--iu-purchases .bp-feedback,
	.snifffr-dp-body--private-content-purchases .bp-feedback,
	.snifffr-dp-body--escrow .bp-feedback {
		background: rgba(232, 93, 143, 0.06);
		color: #423e59;
		border: 1px dashed rgba(232, 93, 143, 0.35);
		border-left: 1px dashed rgba(232, 93, 143, 0.35);
		border-radius: 12px;
		padding: 18px 20px;
		margin: 0 0 16px;
		font-size: 14px;
	}

	/* ── Friends body — mobile-styled friends template renders inside
	   the redesign card. The template emits .snifffr-friends-list with
	   .snifffr-friend-item rows (avatar + name + last active), plus a
	   BP "Order By" <select> in #subnav up top. Style them for desktop:
	   denser list (no card chrome — the body card already provides
	   surface), inline rows with hover highlight, pink-pill pagination. */

	/* Strip the inner .iu-form-card wrapper paint — the body card
	   already provides white surface + radius + shadow. */
	.snifffr-dp-body--friends .iu-form-card.snifffr-friends-card {
		background: transparent;
		border: 0;
		box-shadow: none;
		padding: 0;
		margin: 0;
	}
	.snifffr-dp-body--friends .iu-form-card.snifffr-friends-card h4 {
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 16px;
		padding: 0 0 12px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}

	/* BP order-by subnav at the top — keep it as a compact filter row. */
	.snifffr-dp-body--friends #subnav {
		display: flex;
		justify-content: flex-end;
		margin: 0 0 14px;
		padding: 0 0 12px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--friends #subnav ul {
		display: flex;
		align-items: center;
		gap: 10px;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.snifffr-dp-body--friends #subnav li {
		display: flex;
		align-items: center;
		gap: 8px;
		margin: 0;
		padding: 0;
		font-size: 13px;
	}
	.snifffr-dp-body--friends #subnav label {
		font-size: 12px;
		font-weight: 600;
		color: #6b7280;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		margin: 0;
	}
	.snifffr-dp-body--friends #subnav select {
		padding: 7px 10px;
		background: #fff;
		color: #1a1a1a;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 8px;
		font-size: 13px;
	}
	.snifffr-dp-body--friends #subnav select:focus {
		outline: 0;
		border-color: #e85d8f;
		box-shadow: 0 0 0 3px rgba(232, 93, 143, 0.15);
	}

	/* Friend list — flat stack of rows, each linking to the member. */
	.snifffr-dp-body--friends .snifffr-friends-list {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.snifffr-dp-body--friends .snifffr-friend-item {
		list-style: none;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid rgba(51, 46, 77, 0.05);
	}
	.snifffr-dp-body--friends .snifffr-friend-item:last-child {
		border-bottom: 0;
	}
	.snifffr-dp-body--friends .snifffr-friend-link {
		display: flex;
		align-items: center;
		gap: 14px;
		padding: 12px 4px;
		color: #423e59;
		text-decoration: none;
		border-radius: 10px;
		transition: background 0.15s ease;
	}
	.snifffr-dp-body--friends .snifffr-friend-link:hover {
		background: rgba(232, 93, 143, 0.06);
		text-decoration: none;
	}
	.snifffr-dp-body--friends .snifffr-friend-avatar img {
		width: 48px;
		height: 48px;
		border-radius: 50%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-body--friends .snifffr-friend-body {
		display: flex;
		flex-direction: column;
		gap: 2px;
		flex: 1;
		min-width: 0;
	}
	.snifffr-dp-body--friends .snifffr-friend-name {
		font-size: 14px;
		font-weight: 600;
		color: #1a1a1a;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.snifffr-dp-body--friends .snifffr-friend-link:hover .snifffr-friend-name {
		color: #e65c95;
	}
	.snifffr-dp-body--friends .snifffr-friend-meta {
		font-size: 12px;
		color: #9ca3af;
	}

	/* Pagination — same pink-pill language as the reviews tab. */
	.snifffr-dp-body--friends .snifffr-friends-pagination {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		margin: 18px 0 0;
		padding: 14px 0 0;
		border-top: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--friends .snifffr-friends-pag-count {
		font-size: 12px;
		color: #6b7280;
	}
	.snifffr-dp-body--friends .snifffr-friends-pag-links {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}
	.snifffr-dp-body--friends .snifffr-friends-pag-links a,
	.snifffr-dp-body--friends .snifffr-friends-pag-links span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 34px;
		height: 34px;
		padding: 0 10px;
		background: #fff;
		color: #423e59;
		border: 1px solid rgba(51, 46, 77, 0.1);
		border-radius: 8px;
		font-size: 13px;
		text-decoration: none;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--friends .snifffr-friends-pag-links a:hover {
		background: rgba(232, 93, 143, 0.08);
		border-color: rgba(232, 93, 143, 0.3);
		color: #e65c95;
	}
	.snifffr-dp-body--friends .snifffr-friends-pag-links .current,
	.snifffr-dp-body--friends .snifffr-friends-pag-links span.current {
		background: #e65c95;
		border-color: #e65c95;
		color: #fff;
		font-weight: 600;
	}

	/* Empty state inherits the unified `.snifffr-mp-shop-empty` gradient
	   card chrome from snifffr-mobile-redesign.css — see the long selector
	   list there. The legacy desktop-only override that used to live here
	   (white-pink dashed border, lighter background) has been removed so
	   the unified pink-purple gradient card with pink stripe at top is the
	   single source of truth on /friends/, matching every other empty
	   surface (/shop/, /mediapress/, /iu-purchases/, etc.). */

	/* ── Reviews body — bp-user-profile-reviews plugin output.
	   The list template (bupr-reviews-tab-template.php) emits:
	     .bupr-bp-member-reviews-block > .bp-member-reviews >
	     #bp-member-reviews-list > #request-review-list.item-list >
	     .bupr-row (× each review).
	   Each .bupr-row contains .bupr-members-profiles (avatar+name+date)
	   + .bupr-members-content (text + per-criterion star rows).
	   These rules paint the plugin output to match the redesign. */
	.snifffr-dp-body--reviews .bupr-bp-member-reviews-block,
	.snifffr-dp-body--reviews .bp-member-reviews,
	.snifffr-dp-body--reviews #bp-member-reviews-list,
	.snifffr-dp-body--reviews #request-review-list {
		margin: 0;
		padding: 0;
		list-style: none;
		background: transparent;
		border: 0;
	}

	/* Review card. */
	.snifffr-dp-body--reviews .bupr-row {
		position: relative;
		display: flex;
		gap: 16px;
		padding: 18px 0;
		margin: 0;
		border-bottom: 1px solid rgba(51, 46, 77, 0.06);
		list-style: none;
	}
	.snifffr-dp-body--reviews .bupr-row:last-child {
		border-bottom: 0;
	}

	/* Header row (avatar + author + date) — laid out as a left column
	   so the review body can sit to its right. */
	.snifffr-dp-body--reviews .bupr-members-profiles {
		flex: 0 0 110px;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 6px;
	}
	.snifffr-dp-body--reviews .bupr-members-profiles .item-avatar img {
		width: 64px;
		height: 64px;
		border-radius: 50%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-body--reviews .reviewer h4 {
		font-size: 13px;
		font-weight: 600;
		color: #1a1a1a;
		margin: 0;
		line-height: 1.3;
	}
	.snifffr-dp-body--reviews .reviewer h4 a {
		color: #1a1a1a;
		text-decoration: none;
	}
	.snifffr-dp-body--reviews .reviewer h4 a:hover {
		color: #e65c95;
	}
	.snifffr-dp-body--reviews .review-date {
		font-size: 11px;
		color: #9ca3af;
	}

	/* Review body — description + per-criterion stars. */
	.snifffr-dp-body--reviews .bupr-members-content {
		flex: 1;
		min-width: 0;
	}
	.snifffr-dp-body--reviews .bupr-review-description,
	.snifffr-dp-body--reviews .bupr-full-description {
		margin: 0;
	}
	.snifffr-dp-body--reviews .description {
		font-size: 14px;
		line-height: 1.55;
		color: #423e59;
		margin: 0 0 12px;
	}
	.snifffr-dp-body--reviews .description p {
		margin: 0 0 8px;
	}
	.snifffr-dp-body--reviews .description p:last-child {
		margin-bottom: 0;
	}
	.snifffr-dp-body--reviews .bupr-full-description a {
		color: #e65c95;
		font-size: 13px;
		text-decoration: none;
	}
	.snifffr-dp-body--reviews .bupr-full-description a:hover {
		text-decoration: underline;
	}

	/* Per-criterion rating row — "Cleanliness ★★★★☆" style. */
	.snifffr-dp-body--reviews .multi-review.inline-content {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 6px 0;
		font-size: 13px;
		color: #423e59;
	}
	.snifffr-dp-body--reviews .multi-review .bupr-col-4 {
		flex: 0 0 auto;
	}
	.snifffr-dp-body--reviews .multi-review .bupr-col-4:first-child {
		flex: 0 0 130px;
		font-weight: 600;
		color: #423e59;
	}
	.snifffr-dp-body--reviews .bupr-star-rate {
		color: #f5b942;
		font-size: 13px;
		margin-right: 1px;
	}
	.snifffr-dp-body--reviews .bupr-star-rate.far {
		color: rgba(51, 46, 77, 0.18);
	}

	/* Remove (X) link — the small delete affordance the plugin shows to
	   the review author / admins. Make it inconspicuous in the corner. */
	.snifffr-dp-body--reviews .remove-review {
		position: absolute;
		top: 14px;
		right: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 24px;
		height: 24px;
		background: rgba(185, 28, 28, 0.06);
		color: #b91c1c;
		border-radius: 50%;
		font-size: 12px;
		font-weight: 700;
		text-decoration: none;
		transition: background 0.15s ease;
	}
	.snifffr-dp-body--reviews .remove-review:hover {
		background: rgba(185, 28, 28, 0.16);
		text-decoration: none;
	}

	/* Pagination. */
	.snifffr-dp-body--reviews .bupr-pagination {
		margin: 18px 0 0;
		padding: 14px 0 0;
		border-top: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--reviews .bupr-posts-pagination {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 6px;
	}
	.snifffr-dp-body--reviews .bupr-posts-pagination .page-numbers {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 34px;
		height: 34px;
		padding: 0 10px;
		border: 1px solid rgba(51, 46, 77, 0.1);
		border-radius: 8px;
		background: #fff;
		color: #423e59;
		font-size: 13px;
		text-decoration: none;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--reviews .bupr-posts-pagination .page-numbers:hover {
		background: rgba(232, 93, 143, 0.08);
		border-color: rgba(232, 93, 143, 0.3);
		color: #e65c95;
	}
	.snifffr-dp-body--reviews .bupr-posts-pagination .page-numbers.current {
		background: #e65c95;
		border-color: #e65c95;
		color: #fff;
		font-weight: 600;
	}

	/* Add-review form view (/reviews/add-review/) — wrap chrome. */
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block {
		padding: 0;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block p {
		font-size: 14px;
		color: #423e59;
		margin: 0 0 12px;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block a {
		color: #e65c95;
	}

	/* Gate-only state — when the wrap holds nothing but a single <p>
	   (e.g. "To write a review, you need to be snifffr Verified",
	   "You cannot review this user…", or "A seller cannot leave reviews
	   for another seller"), the bare paragraph reads as broken page
	   chrome. Wrap it as a soft card with icon, larger text, and a pink
	   pill CTA for the inline link — same chrome as the IU gate card.

	   :not(:has(form)) leaves the actual form view (when the plugin
	   renders [add_profile_review_form] inside this wrap) untouched. */
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) {
		position: relative;
		text-align: center;
		padding: 40px 28px 36px;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.06), rgba(231, 226, 255, 0.5));
		border: 0;
		border-radius: 16px;
		margin: 0;
		overflow: hidden;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04);
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p)::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 3px;
		background: linear-gradient(90deg, #e85d8f, #b794f6);
	}
	/* Decorative pencil-fill icon above the message via the wrap's ::after.
	   Bootstrap Icons font is enqueued site-wide (enqueues.php:74). Using
	   the bi-pencil-fill codepoint \F4CA so the icon renders sharp at
	   any size and stays on-brand instead of the system writing-hand emoji. */
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p)::after {
		content: "\F4CA";
		font-family: "bootstrap-icons" !important;
		font-weight: 400;
		font-style: normal;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 56px;
		height: 56px;
		margin: 0 auto 14px;
		border-radius: 50%;
		background: rgba(232, 93, 143, 0.1);
		color: #E65C95;
		font-size: 24px;
		line-height: 1;
		order: -1;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) > p {
		max-width: 460px;
		margin: 0 0 18px;
		font-size: 15px;
		line-height: 1.55;
		color: #423e59;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) > p > a {
		display: inline-block;
		margin-top: 12px;
		padding: 10px 22px;
		background: var(--snifffr-mp-pink, #E65C95);
		color: #fff !important;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none !important;
		border-radius: 999px;
		box-shadow: 0 4px 12px rgba(232, 92, 149, 0.25);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) > p > a:hover,
	.snifffr-dp-body--reviews .bupr-bp-member-review-no-popup-add-block:not(:has(form)):has(> p) > p > a:focus {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(232, 92, 149, 0.32);
	}

	/* ── Interview body — Q&A list. The Question_seller plugin renders
	   each question + answer block. Style as a clean stack. */
	.snifffr-dp-body--seller-questionnaire .questionnaire-item,
	.snifffr-dp-body--seller-questionnaire .question-block,
	.snifffr-dp-body--seller-questionnaire .snfr-question-block {
		padding: 14px 0;
		border-bottom: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--seller-questionnaire .questionnaire-item:last-child,
	.snifffr-dp-body--seller-questionnaire .question-block:last-child,
	.snifffr-dp-body--seller-questionnaire .snfr-question-block:last-child {
		border-bottom: 0;
	}
	.snifffr-dp-body--seller-questionnaire h3,
	.snifffr-dp-body--seller-questionnaire .question-title {
		font-size: 14px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 6px;
	}
	.snifffr-dp-body--seller-questionnaire .answer,
	.snifffr-dp-body--seller-questionnaire .question-answer {
		font-size: 14px;
		line-height: 1.55;
		color: #423e59;
	}

	/* ── Instant Media + Private Content (seller view) bodies — mirror
	   the Shop grid: cards in a responsive grid with thumbnail, title,
	   price chip. The legacy markup uses different containers per
	   plugin but the same general shape, so normalise grid-fit. */
	.snifffr-dp-body--instant-unlocks .iu-listing-items,
	.snifffr-dp-body--instant-unlocks .iu-grid,
	.snifffr-dp-body--instant-unlocks #instant-unlocks-list,
	.snifffr-dp-body--private-content #private-content-list,
	.snifffr-dp-body--private-content .pc-listing-items,
	.snifffr-dp-body--private-content .pc-grid {
		display: grid !important;
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
		gap: 16px !important;
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	.snifffr-dp-body--instant-unlocks .iu-listing-items > *,
	.snifffr-dp-body--instant-unlocks .iu-grid > *,
	.snifffr-dp-body--instant-unlocks #instant-unlocks-list > *,
	.snifffr-dp-body--private-content #private-content-list > *,
	.snifffr-dp-body--private-content .pc-listing-items > *,
	.snifffr-dp-body--private-content .pc-grid > * {
		list-style: none !important;
		margin: 0 !important;
		background: #fff;
		border: 1px solid rgba(51, 46, 77, 0.08);
		border-radius: 14px;
		overflow: hidden;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--instant-unlocks .iu-listing-items > *:hover,
	.snifffr-dp-body--instant-unlocks .iu-grid > *:hover,
	.snifffr-dp-body--instant-unlocks #instant-unlocks-list > *:hover,
	.snifffr-dp-body--private-content #private-content-list > *:hover,
	.snifffr-dp-body--private-content .pc-listing-items > *:hover,
	.snifffr-dp-body--private-content .pc-grid > *:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(232, 93, 143, 0.12);
	}
	.snifffr-dp-body--instant-unlocks img,
	.snifffr-dp-body--private-content img {
		max-width: 100%;
		height: auto;
		display: block;
	}

	/* "Add new" / upgrade CTAs that the plugins paint inline — restyle
	   anything button-shaped to the pink-pill language. */
	.snifffr-dp-body--instant-unlocks .iu-add,
	.snifffr-dp-body--private-content .pc-add,
	.snifffr-dp-body--instant-unlocks .add-new-instant,
	.snifffr-dp-body--private-content .add-new-private,
	.snifffr-dp-body--instant-unlocks a.button,
	.snifffr-dp-body--private-content a.button,
	.snifffr-dp-body--reviews a.button,
	.snifffr-dp-body--friends a.button {
		display: inline-flex;
		align-items: center;
		padding: 10px 22px;
		background: #e85d8f;
		color: #fff !important;
		border: 0;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		transition: background 0.15s ease;
		margin: 0 0 16px;
	}
	.snifffr-dp-body--instant-unlocks .iu-add:hover,
	.snifffr-dp-body--private-content .pc-add:hover,
	.snifffr-dp-body--instant-unlocks .add-new-instant:hover,
	.snifffr-dp-body--private-content .add-new-private:hover,
	.snifffr-dp-body--instant-unlocks a.button:hover,
	.snifffr-dp-body--private-content a.button:hover,
	.snifffr-dp-body--reviews a.button:hover,
	.snifffr-dp-body--friends a.button:hover {
		background: #d24a7d;
	}

	/* ── Cover-photos edit modal (self-seller, opened from
	   .snifffr-dp-cover-edit button) ─────────────────────────────── */
	.snifffr-dp-modal {
		position: fixed;
		inset: 0;
		z-index: 9999;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 24px;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.18s ease;
	}
	.snifffr-dp-modal[hidden] {
		display: none !important;
	}
	.snifffr-dp-modal.is-open {
		opacity: 1;
		pointer-events: auto;
	}
	.snifffr-dp-modal-backdrop {
		position: absolute;
		inset: 0;
		background: rgba(26, 26, 26, 0.55);
		backdrop-filter: blur(4px);
		-webkit-backdrop-filter: blur(4px);
	}
	.snifffr-dp-modal-card {
		position: relative;
		background: #fff;
		border-radius: 18px;
		width: 100%;
		max-width: 560px;
		max-height: 90vh;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
		transform: translateY(16px);
		transition: transform 0.2s ease;
	}
	.snifffr-dp-modal.is-open .snifffr-dp-modal-card {
		transform: translateY(0);
	}
	.snifffr-dp-modal-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 18px 22px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}
	.snifffr-dp-modal-title {
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0;
	}
	.snifffr-dp-modal-x {
		appearance: none;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		background: rgba(51, 46, 77, 0.06);
		color: #423e59;
		border: 0;
		border-radius: 50%;
		font-size: 20px;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease;
	}
	.snifffr-dp-modal-x:hover {
		background: rgba(51, 46, 77, 0.12);
	}
	.snifffr-dp-modal-body {
		flex: 1;
		overflow-y: auto;
		padding: 20px 22px;
	}
	.snifffr-dp-modal-footer {
		display: flex;
		justify-content: flex-end;
		gap: 10px;
		padding: 16px 22px;
		border-top: 1px solid rgba(51, 46, 77, 0.08);
		background: #fafaff;
	}
	.snifffr-dp-modal-btn {
		appearance: none;
		padding: 10px 22px;
		border: 0;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
		transition: background 0.15s ease;
	}
	.snifffr-dp-modal-btn--primary {
		background: #e85d8f;
		color: #fff;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
	}
	.snifffr-dp-modal-btn--primary:hover {
		background: #d24a7d;
	}
	.snifffr-dp-modal-btn--primary:disabled {
		opacity: 0.6;
		cursor: not-allowed;
	}
	.snifffr-dp-modal-btn--secondary {
		background: rgba(51, 46, 77, 0.06);
		color: #423e59;
	}
	.snifffr-dp-modal-btn--secondary:hover {
		background: rgba(51, 46, 77, 0.12);
	}

	/* Lock body scroll while the modal is open. */
	body.snifffr-dp-modal-locked {
		overflow: hidden;
	}

	/* Tip modal form — fields + agreement + feedback. Shares the generic
	   .snifffr-dp-modal shell; this adds the form-specific look. */
	.snifffr-dp-tip-form {
		display: flex;
		flex-direction: column;
		gap: 4px;
	}
	.snifffr-dp-tip-label {
		font-size: 13px;
		font-weight: 600;
		color: #423e59;
		margin: 10px 0 4px;
	}
	.snifffr-dp-tip-label:first-child {
		margin-top: 0;
	}
	.snifffr-dp-tip-input {
		width: 100%;
		padding: 10px 14px;
		font-size: 14px;
		color: #1a1a1a;
		background: #fafaff;
		border: 1px solid rgba(51, 46, 77, 0.16);
		border-radius: 10px;
		box-sizing: border-box;
		transition: border-color 0.15s ease, background 0.15s ease;
	}
	.snifffr-dp-tip-input:focus {
		outline: none;
		border-color: var(--snifffr-mp-pink, #E65C95);
		background: #fff;
	}
	textarea.snifffr-dp-tip-input {
		resize: vertical;
		min-height: 70px;
	}
	.snifffr-dp-tip-hint {
		display: block;
		font-size: 12px;
		color: #6b7280;
		margin: 4px 0 0;
	}
	.snifffr-dp-tip-tnc {
		display: flex;
		align-items: flex-start;
		gap: 8px;
		font-size: 12.5px;
		color: #423e59;
		margin-top: 14px;
		cursor: pointer;
	}
	.snifffr-dp-tip-tnc input[type="checkbox"] {
		margin-top: 2px;
		accent-color: var(--snifffr-mp-pink, #E65C95);
	}
	.snifffr-dp-tip-feedback {
		margin-top: 12px;
		padding: 8px 12px;
		font-size: 13px;
		border-radius: 8px;
		background: #faecf2;
		color: var(--snifffr-mp-pink, #E65C95);
	}
	.snifffr-dp-tip-feedback.is-error {
		background: #fdecec;
		color: #b91c1c;
	}
	.snifffr-dp-tip-feedback.is-success {
		background: #ecfdf5;
		color: #047857;
	}

	/* Cover upload widget inside the modal — thumbnails + add tile. */
	.snifffr-dp-cover-hint {
		font-size: 13px;
		color: #6b7280;
		margin: 0 0 14px;
	}
	.snifffr-dp-cover-thumbs {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
		gap: 10px;
	}
	.snifffr-dp-cover-thumb {
		position: relative;
		aspect-ratio: 1 / 1;
		background: #f3f4f6;
		border-radius: 10px;
		overflow: hidden;
		border: 1px solid rgba(51, 46, 77, 0.08);
	}
	.snifffr-dp-cover-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-cover-thumb-remove {
		position: absolute;
		top: 6px;
		right: 6px;
		width: 22px;
		height: 22px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(0, 0, 0, 0.6);
		color: #fff;
		border: 0;
		border-radius: 50%;
		font-size: 15px;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease;
	}
	.snifffr-dp-cover-thumb-remove:hover {
		background: #b91c1c;
	}
	.snifffr-dp-cover-add {
		display: flex;
		align-items: center;
		justify-content: center;
		aspect-ratio: 1 / 1;
		background: rgba(232, 93, 143, 0.06);
		border: 2px dashed rgba(232, 93, 143, 0.35);
		border-radius: 10px;
		color: #e65c95;
		font-size: 32px;
		font-weight: 300;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-cover-add:hover {
		background: rgba(232, 93, 143, 0.12);
		border-color: rgba(232, 93, 143, 0.5);
	}
	.snifffr-dp-cover-feedback {
		margin: 14px 0 0;
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		font-weight: 500;
	}
	.snifffr-dp-cover-feedback.is-error {
		background: #fef2f2;
		color: #b91c1c;
	}
	.snifffr-dp-cover-feedback.is-success {
		background: #f0fdf4;
		color: #047857;
	}

	/* ── Avatar upload + crop widget (inside avatar-edit modal) ──── */
	.snifffr-dp-avatar-pick {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 6px;
		padding: 32px 20px;
		background: rgba(232, 93, 143, 0.06);
		border: 2px dashed rgba(232, 93, 143, 0.35);
		border-radius: 12px;
		color: #e65c95;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-avatar-pick:hover {
		background: rgba(232, 93, 143, 0.12);
		border-color: rgba(232, 93, 143, 0.5);
	}
	.snifffr-dp-avatar-pick-icon {
		font-size: 36px;
		line-height: 1;
	}
	.snifffr-dp-avatar-pick-label {
		font-size: 14px;
		font-weight: 600;
	}

	.snifffr-dp-avatar-stage {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 14px;
		margin: 18px 0 0;
	}
	/* Crop box — square frame with a circular mask cut into it via
	   box-shadow so the user sees what the avatar will look like. */
	.snifffr-dp-avatar-crop {
		position: relative;
		width: 260px;
		height: 260px;
		max-width: 100%;
		overflow: hidden;
		background: #1a1a1a;
		border-radius: 8px;
		cursor: grab;
		touch-action: none;
	}
	.snifffr-dp-avatar-crop:active {
		cursor: grabbing;
	}
	.snifffr-dp-avatar-crop-img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: none;
		user-select: none;
		-webkit-user-drag: none;
	}
	.snifffr-dp-avatar-crop-mask {
		position: absolute;
		inset: 0;
		pointer-events: none;
		/* Inner circle stays clear, outside dimmed via huge box-shadow ring. */
		box-shadow: 0 0 0 9999px rgba(26, 26, 26, 0.6);
		border-radius: 50%;
	}
	.snifffr-dp-avatar-zoom-row {
		display: flex;
		align-items: center;
		gap: 12px;
		width: 100%;
		max-width: 260px;
	}
	.snifffr-dp-avatar-zoom-icon {
		font-size: 18px;
		color: #6b7280;
		font-weight: 600;
		line-height: 1;
		flex-shrink: 0;
	}
	.snifffr-dp-avatar-zoom {
		flex: 1;
		appearance: none;
		height: 4px;
		background: rgba(51, 46, 77, 0.12);
		border-radius: 999px;
		outline: none;
	}
	.snifffr-dp-avatar-zoom::-webkit-slider-thumb {
		appearance: none;
		width: 18px;
		height: 18px;
		background: #e85d8f;
		border-radius: 50%;
		border: 2px solid #fff;
		box-shadow: 0 2px 4px rgba(232, 93, 143, 0.4);
		cursor: pointer;
	}
	.snifffr-dp-avatar-zoom::-moz-range-thumb {
		width: 18px;
		height: 18px;
		background: #e85d8f;
		border-radius: 50%;
		border: 2px solid #fff;
		box-shadow: 0 2px 4px rgba(232, 93, 143, 0.4);
		cursor: pointer;
	}
	.snifffr-dp-avatar-hint {
		font-size: 12px;
		color: #6b7280;
		text-align: center;
	}
	.snifffr-dp-avatar-feedback {
		margin: 14px 0 0;
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		font-weight: 500;
	}
	.snifffr-dp-avatar-feedback.is-error {
		background: #fef2f2;
		color: #b91c1c;
	}
	.snifffr-dp-avatar-feedback.is-success {
		background: #f0fdf4;
		color: #047857;
	}

	/* ── Add CTA — reusable pink-pill "+ Add gallery / Add listing" CTA.
	   Currently used on the Gallery body for self-sellers; can be reused
	   when other tabs grow their own create flows. */
	.snifffr-dp-add-cta {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 11px 24px;
		background: #e85d8f;
		color: #fff !important;
		border: 0;
		border-radius: 999px;
		font-size: 14px;
		font-weight: 600;
		text-decoration: none;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		transition: background 0.15s ease;
		margin: 0 0 18px;
	}
	.snifffr-dp-add-cta:hover {
		background: #d24a7d;
		color: #fff !important;
		text-decoration: none;
	}
	.snifffr-dp-add-cta-icon {
		font-size: 18px;
		line-height: 1;
	}

	/* ── /mediapress/ gallery cards (self-seller management) ─────── */
	.snifffr-dp-gallery-list {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
		gap: 16px;
		margin: 0 0 22px;
	}
	.snifffr-dp-gallery-card {
		background: #fff;
		border: 1px solid rgba(51, 46, 77, 0.08);
		border-radius: 14px;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-gallery-card:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(232, 93, 143, 0.12);
	}
	.snifffr-dp-gallery-card-thumb {
		position: relative;
		display: block;
		aspect-ratio: 1 / 1;
		background: #f3f4f6;
		overflow: hidden;
	}
	.snifffr-dp-gallery-card-thumb img,
	.snifffr-dp-gallery-card-thumb video {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-gallery-card-thumb .snifffr-dp-gallery-placeholder {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		font-size: 36px;
		color: rgba(51, 46, 77, 0.35);
	}
	.snifffr-dp-gallery-card-thumb.is-video::after {
		content: "▶";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #fff;
		font-size: 28px;
		text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
		pointer-events: none;
	}
	.snifffr-dp-gallery-card-count {
		position: absolute;
		top: 8px;
		right: 8px;
		background: rgba(0, 0, 0, 0.6);
		color: #fff;
		padding: 3px 9px;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 600;
	}
	.snifffr-dp-gallery-card-body {
		padding: 12px 14px 14px;
		display: flex;
		flex-direction: column;
		gap: 4px;
		flex: 1;
	}
	.snifffr-dp-gallery-card-title {
		font-size: 14px;
		font-weight: 600;
		color: #1a1a1a;
		text-decoration: none;
		line-height: 1.3;
	}
	.snifffr-dp-gallery-card-title:hover {
		color: #e65c95;
	}
	.snifffr-dp-gallery-card-meta {
		font-size: 12px;
		color: #6b7280;
		margin: 0 0 6px;
	}
	.snifffr-dp-gallery-card-actions {
		display: flex;
		gap: 6px;
		margin-top: auto;
	}
	.snifffr-dp-gallery-card-actions form {
		flex: 1;
		margin: 0;
	}
	.snifffr-dp-gallery-card-btn {
		appearance: none;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		padding: 7px 10px;
		background: rgba(51, 46, 77, 0.06);
		color: #423e59 !important;
		border: 0;
		border-radius: 8px;
		font-size: 12px;
		font-weight: 600;
		text-decoration: none;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-gallery-card-btn--edit {
		flex: 1;
	}
	.snifffr-dp-gallery-card-btn--edit:hover {
		background: rgba(232, 93, 143, 0.1);
		color: #e65c95 !important;
	}
	.snifffr-dp-gallery-card-btn--delete {
		background: rgba(185, 28, 28, 0.06);
		color: #b91c1c !important;
	}
	.snifffr-dp-gallery-card-btn--delete:hover {
		background: rgba(185, 28, 28, 0.12);
	}
	.snifffr-dp-gallery-list-divider {
		font-size: 12px;
		font-weight: 700;
		color: #6b7280;
		text-transform: uppercase;
		letter-spacing: 0.6px;
		margin: 6px 0 12px;
		padding: 10px 0 0;
		border-top: 1px solid rgba(51, 46, 77, 0.06);
	}

	/* Deep-view wrapper — single gallery / create / manage screens
	   render the legacy MediaPress templates via bp_template_content
	   here. Same card chrome + overflow clip as the other plugin
	   bodies, so MediaPress's grids, uploaders, and lightboxes can't
	   trip horizontal scroll. */
	.snifffr-dp-body--gallery-deep {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: hidden;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}
	.snifffr-dp-body--gallery-deep img,
	.snifffr-dp-body--gallery-deep video {
		max-width: 100%;
		height: auto;
		display: block;
	}
	/* Tame loud BP/MediaPress h2/h3 headings in deep view — the tab
	   strip already orients the user. */
	.snifffr-dp-body--gallery-deep > h2,
	.snifffr-dp-body--gallery-deep > h3,
	.snifffr-dp-body--gallery-deep .mpp-gallery-title {
		font-size: 18px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 16px;
		padding: 0 0 12px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}
	/* Pink-pill BP / MediaPress buttons in deep view (upload, save,
	   add media, etc.) to match the redesign action language. */
	.snifffr-dp-body--gallery-deep .button,
	.snifffr-dp-body--gallery-deep input[type="submit"],
	.snifffr-dp-body--gallery-deep button.btn,
	.snifffr-dp-body--gallery-deep .btn-primary {
		appearance: none;
		display: inline-flex;
		align-items: center;
		padding: 10px 22px;
		background: #e85d8f !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		cursor: pointer;
		transition: background 0.15s ease;
	}
	.snifffr-dp-body--gallery-deep .button:hover,
	.snifffr-dp-body--gallery-deep input[type="submit"]:hover,
	.snifffr-dp-body--gallery-deep button.btn:hover,
	.snifffr-dp-body--gallery-deep .btn-primary:hover {
		background: #d24a7d !important;
	}

	/* ───────────────────────────────────────────────────────────────
	   Gallery deep-view chrome 2026-05-22 — mirror the mobile-redesign
	   styling of the legacy MediaPress markup so the desktop redesign
	   doesn't fall back to unstyled mpp-* output on /mediapress/{slug}/,
	   /mediapress/{slug}/manage/edit/, and /mediapress/{slug}/{media}/edit/.

	   The mobile rules (snifffr-mobile-redesign.css ~L5732+) target the
	   legacy desktop wrap; here we target the desktop redesign body
	   wrapper that hosts the same MediaPress template via
	   `do_action('bp_template_content')` in snifffr-desktop-profile.php
	   $snifffr_dp_is_gallery_deep branch.
	   ─────────────────────────────────────────────────────────────── */

	/* Breadcrumb — turn the all-pink/legacy default into the redesign's
	   pink-accent links with comfy spacing. */
	.snifffr-dp-body--gallery-deep .mpp-breadcrumbs {
		margin: 0 0 24px;
		padding: 0;
		font-size: 13px;
		font-weight: 600;
		color: rgba(66, 62, 89, 0.7);
		list-style: none;
	}
	.snifffr-dp-body--gallery-deep .mpp-breadcrumbs a {
		color: #E65C95;
		text-decoration: none;
		font-weight: 700;
	}
	.snifffr-dp-body--gallery-deep .mpp-breadcrumbs a:hover,
	.snifffr-dp-body--gallery-deep .mpp-breadcrumbs a:focus {
		color: #d24a7d;
		text-decoration: underline;
	}

	/* Hide MediaPress's admin sub-menu strip + the standalone <hr>
	   separator it emits below. Tabs in the redesign already cover
	   navigation, and the admin strip's legacy pill styling clashes. */
	.snifffr-dp-body--gallery-deep #subnav,
	.snifffr-dp-body--gallery-deep .mpp-gallery-admin-menu,
	.snifffr-dp-body--gallery-deep .mpp-gallery-admin-menu + hr,
	.snifffr-dp-body--gallery-deep > hr {
		display: none !important;
	}

	/* The plugin's #mpp-container wraps everything in a default-padded
	   shell sized for the legacy layout grid; the redesign body wrapper
	   already provides padding, so flatten the inner container. */
	.snifffr-dp-body--gallery-deep #mpp-container {
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	/* mpp_display_space_usage() prints a bare <strong> right inside
	   #mpp-container. Helpful on admin pages, noisy on the public deep
	   view — hide. */
	.snifffr-dp-body--gallery-deep #mpp-container.mpp-members-component > strong {
		display: none !important;
	}

	/* Gallery management — the manage view emits an
	   `.mpp-gallery-media-list` of media tiles. Soften them to match the
	   redesign cells. */
	.snifffr-dp-body--gallery-deep .mpp-gallery-media-list,
	.snifffr-dp-body--gallery-deep .mpp-media-list {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
		gap: 16px;
		margin: 0 0 24px;
		padding: 0;
		list-style: none;
	}
	.snifffr-dp-body--gallery-deep .mpp-media-list > li,
	.snifffr-dp-body--gallery-deep .mpp-gallery-media-list > li {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.snifffr-dp-body--gallery-deep .mpp-item-thumbnail,
	.snifffr-dp-body--gallery-deep .mpp-gallery-cover {
		display: block;
		border-radius: 12px;
		overflow: hidden;
		background: #f5eeff;
	}
	.snifffr-dp-body--gallery-deep .mpp-item-thumbnail img,
	.snifffr-dp-body--gallery-deep .mpp-gallery-cover img {
		width: 100%;
		height: auto;
		object-fit: cover;
		display: block;
		border-radius: 12px;
	}

	/* Per-media action links (edit / delete) — currently render as bare
	   text links / unstyled buttons. Pill them. */
	.snifffr-dp-body--gallery-deep .mpp-item-actions,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin: 10px 0 0;
		padding: 0;
		list-style: none;
	}
	.snifffr-dp-body--gallery-deep .mpp-item-actions a,
	.snifffr-dp-body--gallery-deep .mpp-item-actions button,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions a,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions button {
		display: inline-flex;
		align-items: center;
		padding: 6px 14px;
		background: #fff !important;
		color: #423E59 !important;
		border: 1px solid rgba(66, 62, 89, 0.18) !important;
		border-radius: 999px !important;
		font-size: 12px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.3px;
		text-decoration: none !important;
		box-shadow: none !important;
		cursor: pointer;
		transition: border-color 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-body--gallery-deep .mpp-item-actions a:hover,
	.snifffr-dp-body--gallery-deep .mpp-item-actions button:hover,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions a:hover,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions button:hover {
		border-color: #E65C95 !important;
		color: #E65C95 !important;
		background: #faecf2 !important;
	}
	/* Highlight delete in pink-tinted danger style. */
	.snifffr-dp-body--gallery-deep .mpp-item-actions .mpp-delete-link,
	.snifffr-dp-body--gallery-deep .mpp-item-actions .delete,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions .mpp-delete-link,
	.snifffr-dp-body--gallery-deep .mpp-gallery-actions .delete {
		color: #E65C95 !important;
		border-color: rgba(230, 92, 149, 0.4) !important;
	}

	/* Form labels — uppercase small caps, the redesign's standard form
	   label treatment. */
	.snifffr-dp-body--gallery-deep form label,
	.snifffr-dp-body--gallery-deep .mpp-form-field label {
		display: block;
		margin: 0 0 6px;
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: rgba(66, 62, 89, 0.65);
	}

	/* Inputs / textareas — full-width, rounded, pink focus ring. Targets
	   the per-media edit form (Title + Description) shown on the
	   /mediapress/{slug}/{media}/edit/ screen. */
	.snifffr-dp-body--gallery-deep input[type="text"],
	.snifffr-dp-body--gallery-deep input[type="email"],
	.snifffr-dp-body--gallery-deep input[type="number"],
	.snifffr-dp-body--gallery-deep input[type="url"],
	.snifffr-dp-body--gallery-deep textarea,
	.snifffr-dp-body--gallery-deep select {
		width: 100%;
		max-width: 640px;
		padding: 12px 14px;
		margin: 0 0 14px;
		font-family: inherit;
		font-size: 15px;
		line-height: 1.45;
		color: #423E59;
		background: #fff;
		border: 1.5px solid rgba(66, 62, 89, 0.14);
		border-radius: 12px;
		box-shadow: none;
		box-sizing: border-box;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--gallery-deep textarea {
		min-height: 140px;
		resize: vertical;
	}
	.snifffr-dp-body--gallery-deep input[type="text"]:focus,
	.snifffr-dp-body--gallery-deep input[type="email"]:focus,
	.snifffr-dp-body--gallery-deep input[type="number"]:focus,
	.snifffr-dp-body--gallery-deep input[type="url"]:focus,
	.snifffr-dp-body--gallery-deep textarea:focus,
	.snifffr-dp-body--gallery-deep select:focus {
		outline: 0;
		border-color: #E65C95;
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.14);
	}

	/* Per-media-edit form layout — the media preview sits above the form
	   on the legacy template. Cap the preview width so it doesn't take
	   over the desktop card. */
	.snifffr-dp-body--gallery-deep .mpp-edit-media,
	.snifffr-dp-body--gallery-deep .mpp-media-edit {
		display: block;
	}
	.snifffr-dp-body--gallery-deep .mpp-edit-media-cover,
	.snifffr-dp-body--gallery-deep .mpp-media-cover,
	.snifffr-dp-body--gallery-deep .mpp-media-cover-image {
		max-width: 420px;
		margin: 0 0 24px;
		border-radius: 14px;
		overflow: hidden;
		background: #f5eeff;
	}
	.snifffr-dp-body--gallery-deep .mpp-edit-media-cover img,
	.snifffr-dp-body--gallery-deep .mpp-media-cover img,
	.snifffr-dp-body--gallery-deep .mpp-media-cover-image img {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 14px;
	}

	/* Submit / save buttons — pink pill (rule already inherits from the
	   base block above, but be explicit here in case the legacy template
	   emits a `name="save"` button without `.btn` / `.btn-primary`). */
	.snifffr-dp-body--gallery-deep form input[type="submit"],
	.snifffr-dp-body--gallery-deep form button[type="submit"],
	.snifffr-dp-body--gallery-deep form button.save,
	.snifffr-dp-body--gallery-deep form input.button-primary {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		min-width: 160px;
		padding: 13px 28px !important;
		background: #E65C95 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0.5px !important;
		text-transform: uppercase !important;
		cursor: pointer !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
		transition: filter 0.15s ease;
	}
	.snifffr-dp-body--gallery-deep form input[type="submit"]:hover,
	.snifffr-dp-body--gallery-deep form button[type="submit"]:hover,
	.snifffr-dp-body--gallery-deep form button.save:hover {
		filter: brightness(1.06);
	}

	/* The legacy template emits a default-styled status notice
	   (#mpp-notice-message) below the form — soften it. */
	.snifffr-dp-body--gallery-deep #mpp-notice-message {
		margin: 0 0 16px;
		padding: 12px 16px;
		border: 0;
		border-radius: 12px;
		background: #ECEAF2;
		color: #423E59;
		font-size: 13px;
		font-weight: 500;
		box-shadow: 0 4px 14px rgba(66, 62, 89, 0.06);
	}
	.snifffr-dp-body--gallery-deep #mpp-notice-message.error {
		background: rgba(230, 92, 149, 0.12);
		color: #E65C95;
	}

	/* ── Single shop item view (/shop/item/{slug}/) — render the legacy
	   shopitem.php inside the redesign card. The template paints a
	   slider/lightbox + title/price/description + seller-meta box.
	   Card wrap + overflow clip mirror the other plugin tabs so the
	   built-in slider doesn't tip horizontal scroll. */
	.snifffr-dp-body--shop-item {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: hidden;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}
	.snifffr-dp-body--shop-item img,
	.snifffr-dp-body--shop-item video {
		max-width: 100%;
		height: auto;
		display: block;
	}
	/* Strip the legacy h3/h4 page-title duplicates inside the item body —
	   the seller name + tab strip already orient the user. */
	.snifffr-dp-body--shop-item > h1,
	.snifffr-dp-body--shop-item > h2,
	.snifffr-dp-body--shop-item .profile-pages-title {
		font-size: 20px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 16px;
		padding: 0 0 12px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.08);
	}
	/* Buy / Order / Message buttons inside the item — pink-pill them. */
	.snifffr-dp-body--shop-item .btn.btn-primary,
	.snifffr-dp-body--shop-item a.btn.btn-primary,
	.snifffr-dp-body--shop-item button.btn-primary {
		background: #e85d8f !important;
		border-color: #e85d8f !important;
		color: #fff !important;
		border-radius: 999px !important;
		padding: 11px 24px !important;
		font-weight: 600 !important;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3) !important;
	}
	.snifffr-dp-body--shop-item .btn.btn-primary:hover,
	.snifffr-dp-body--shop-item a.btn.btn-primary:hover,
	.snifffr-dp-body--shop-item button.btn-primary:hover {
		background: #d24a7d !important;
		border-color: #d24a7d !important;
	}
	.snifffr-dp-body--shop-item .btn.btn-outline-secondary,
	.snifffr-dp-body--shop-item .btn-outline-primary {
		background: rgba(51, 46, 77, 0.06) !important;
		color: #423e59 !important;
		border: 0 !important;
		border-radius: 999px !important;
		padding: 11px 22px !important;
		font-weight: 600 !important;
	}
	.snifffr-dp-body--shop-item .btn.btn-outline-secondary:hover,
	.snifffr-dp-body--shop-item .btn-outline-primary:hover {
		background: rgba(51, 46, 77, 0.12) !important;
	}

	/* ── Self-seller Shop body — render legacy shop.php inside the
	   redesign card. shop.php emits its own #item-create-btn, inline
	   create form (#item-form), seller header, and .iu-post-card grid.
	   We just adapt the chrome so it feels at home in the redesign. */
	.snifffr-dp-body--shop-self {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow-x: hidden;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}

	/* Unified Add CTA — pink pill matching the redesign action style.
	   One declaration block for all four self-seller "Add ..." buttons
	   (Shop / Instant Media / Private Content / Gallery) so they read as
	   one button system. The Gallery anchor uses .snifffr-dp-add-cta; the
	   shop/IU/PC plugin templates emit `.btn.btn-primary.purple` markup
	   that we re-skin here. */
	.snifffr-dp-body--shop-self #item-create-btn,
	.snifffr-dp-body--shop-self #item-create-btn-empty,
	.snifffr-dp-body--shop-self .item-create-btn,
	.snifffr-dp-body--instant-unlocks #iu-create-btn,
	.snifffr-dp-body--instant-unlocks #iu-create-btn-empty,
	.snifffr-dp-body--instant-unlocks .iu-create-btn,
	.snifffr-dp-body--private-content #pc-create-btn,
	.snifffr-dp-body--private-content #pc-create-btn-empty,
	.snifffr-dp-body--private-content .pc-create-btn,
	.snifffr-dp-body--gallery .snifffr-dp-add-cta {
		appearance: none;
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 11px 24px !important;
		background: #e85d8f !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-family: inherit !important;
		font-size: 14px !important;
		font-weight: 600 !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		cursor: pointer;
		text-decoration: none !important;
		transition: background 0.15s ease;
		margin: 0 0 20px;
		float: none !important;
	}
	.snifffr-dp-body--shop-self #item-create-btn:hover,
	.snifffr-dp-body--shop-self #item-create-btn-empty:hover,
	.snifffr-dp-body--shop-self .item-create-btn:hover,
	.snifffr-dp-body--instant-unlocks #iu-create-btn:hover,
	.snifffr-dp-body--instant-unlocks #iu-create-btn-empty:hover,
	.snifffr-dp-body--instant-unlocks .iu-create-btn:hover,
	.snifffr-dp-body--private-content #pc-create-btn:hover,
	.snifffr-dp-body--private-content #pc-create-btn-empty:hover,
	.snifffr-dp-body--private-content .pc-create-btn:hover,
	.snifffr-dp-body--gallery .snifffr-dp-add-cta:hover {
		background: #d24a7d !important;
	}
	/* "+ ADD INSTANT MEDIA" in the plugin template is uppercase — match
	   the rest of the family by neutralising the legacy transform.
	   Override the inline `+ ` prefix is fine since we keep the unified
	   text-transform: none above. */
	.snifffr-dp-body--instant-unlocks #iu-create-btn,
	.snifffr-dp-body--instant-unlocks #iu-create-btn-empty,
	.snifffr-dp-body--instant-unlocks .iu-create-btn {
		text-transform: none !important;
	}

	/* Empty state — soften the "List your first item" panel. */
	.snifffr-dp-body--shop-self .iu-empty {
		text-align: center;
		padding: 32px 24px;
		background: rgba(232, 93, 143, 0.04);
		border: 1px dashed rgba(232, 93, 143, 0.25);
		border-radius: 14px;
		margin: 0;
	}
	.snifffr-dp-body--shop-self .iu-empty p {
		color: #423e59;
		font-size: 15px;
		margin: 0 0 16px;
	}

	/* Verified-buyer gate card. Shown to logged-in users who aren't a
	   verified buyer (and aren't the seller-on-own) when they hit the
	   /instant-unlocks/ tab. Soft pinky-lavender card with lock icon,
	   short pitch + pink pill CTA — matches .welcomebuyermob chrome but
	   sized for a standalone tab body, not an in-page banner. */
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases {
		position: relative;
		text-align: center;
		padding: 40px 28px 36px;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.06), rgba(231, 226, 255, 0.5));
		border: 0;
		border-radius: 16px;
		margin: 0;
		overflow: hidden;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04);
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate::before,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 3px;
		background: linear-gradient(90deg, #e85d8f, #b794f6);
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-icon,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases .iu-empty-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 56px;
		height: 56px;
		margin: 0 auto 14px;
		border-radius: 50%;
		background: rgba(232, 93, 143, 0.1);
		font-size: 24px;
		line-height: 1;
		color: #e65c95;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-icon i,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases .iu-empty-icon i {
		font-size: 22px;
		line-height: 1;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-title,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases .iu-empty-title {
		margin: 0 0 8px;
		font-size: 18px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.3;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-body,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases .iu-empty-body {
		margin: 0 auto 12px;
		max-width: 460px;
		font-size: 14px;
		line-height: 1.55;
		color: #6b7280;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-body:last-of-type,
	body.snifffr-desktop-beta .iu-empty.iu-empty--purchases .iu-empty-body:last-of-type {
		margin-bottom: 20px;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-btn {
		display: inline-block;
		padding: 12px 28px;
		background: var(--snifffr-mp-pink, #E65C95);
		color: #fff;
		font-size: 14px;
		font-weight: 600;
		text-decoration: none;
		border-radius: 999px;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28);
		transition: background 0.15s ease, transform 0.05s ease;
	}
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-btn:hover,
	body.snifffr-desktop-beta .iu-empty.iu-empty--gate .iu-empty-btn:focus {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(232, 92, 149, 0.32);
	}

	/* Private Content "locked" view — visitor isn't subscribed yet.
	   Mirrors the .iu-empty--gate chrome so /private-content/ and
	   /instant-unlocks/ guard surfaces read as one family: pinky-lavender
	   gradient soft card, pink stripe at top, circular icon, centered
	   title + description, and the subscribe-package row sits inside the
	   card as pill-style options. */
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-wrap {
		position: relative;
		text-align: center;
		padding: 40px 28px 36px;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.06), rgba(231, 226, 255, 0.5));
		border: 0;
		border-radius: 16px;
		margin: 0;
		overflow: hidden;
		box-shadow:
			0 1px 3px rgba(0, 0, 0, 0.04),
			0 4px 12px rgba(0, 0, 0, 0.04);
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-wrap::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 3px;
		background: linear-gradient(90deg, #e85d8f, #b794f6);
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 56px;
		height: 56px;
		margin: 0 auto 14px;
		border-radius: 50%;
		background: rgba(232, 93, 143, 0.1);
		font-size: 22px;
		line-height: 1;
		color: #e65c95 !important;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-icon i {
		font-size: 22px;
		line-height: 1;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-title {
		margin: 0 0 8px;
		font-size: 18px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.3;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-desc {
		margin: 0 auto 20px;
		max-width: 460px;
		font-size: 14px;
		line-height: 1.55;
		color: #6b7280;
		font-style: normal;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-note {
		margin: 8px auto 0;
		max-width: 460px;
		font-size: 13px;
		color: #8a7fb0;
		font-style: italic;
	}
	/* Subscribe-package row — pill cards inside the locked-wrap. */
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-subscribe-options {
		display: flex !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 12px !important;
		margin: 0 0 8px !important;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-package {
		background: #fff;
		border: 1px solid rgba(232, 93, 143, 0.15);
		border-radius: 12px;
		padding: 14px 18px;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		min-width: 140px;
		box-shadow: 0 1px 2px rgba(66, 62, 89, 0.03), 0 2px 8px rgba(66, 62, 89, 0.04);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-package:hover {
		transform: translateY(-1px);
		box-shadow: 0 4px 12px rgba(232, 92, 149, 0.12);
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-package-label {
		font-size: 12px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: #423e59;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-package-price {
		font-size: 15px;
		font-weight: 700;
		color: #e65c95;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-subscribe-btn {
		display: inline-block;
		padding: 8px 18px;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		font-size: 12px;
		font-weight: 600;
		text-decoration: none !important;
		border: 0;
		border-radius: 999px;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28);
		transition: background 0.15s ease, transform 0.05s ease;
		cursor: pointer;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-subscribe-btn:hover,
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-subscribe-btn:focus {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(232, 92, 149, 0.32);
	}
	/* Log-in CTA when the visitor isn't logged in — pink pill, matches
	   the .iu-empty-btn language. */
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-wrap > .btn.btn-primary {
		display: inline-block;
		padding: 12px 28px;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		font-size: 14px;
		font-weight: 600;
		text-decoration: none !important;
		border: 0 !important;
		border-radius: 999px !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28);
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-wrap > .btn.btn-primary:hover,
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-locked-wrap > .btn.btn-primary:focus {
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(232, 92, 149, 0.32);
	}

	/* Token-shortage warning rendered into #pc-subscribe-feedback when the
	   buy_user_package AJAX returns the "not have enough tokens" message
	   (functions.php:3751). Mirrors the mobile-redesign rules so both
	   surfaces show the same coin-icon + body + pink CTA card. */
	body.snifffr-desktop-beta .snifffr-dp-body--private-content #pc-subscribe-feedback.pc-feedback--warn {
		background: transparent !important;
		padding: 0 !important;
		margin: 18px auto 0 !important;
		max-width: 520px;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning {
		display: flex;
		align-items: center;
		gap: 16px;
		padding: 16px 18px;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.08), rgba(231, 226, 255, 0.55));
		border: 1px solid rgba(230, 92, 149, 0.18);
		border-radius: 14px;
		text-align: left;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-icon {
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		border-radius: 50%;
		background: rgba(232, 93, 143, 0.12);
		color: #E65C95;
		font-size: 20px;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-body {
		flex: 1 1 auto;
		min-width: 0;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-title {
		font-size: 15px;
		font-weight: 700;
		color: #423E59;
		line-height: 1.2;
		margin: 0 0 3px;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-desc {
		font-size: 13px;
		line-height: 1.45;
		color: rgba(66, 62, 89, 0.75);
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-btn,
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-btn:hover,
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-btn:focus,
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-btn:active {
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 10px 20px;
		background: #E65C95 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0.4px !important;
		text-transform: uppercase !important;
		text-decoration: none !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28);
		transition: filter 0.15s ease;
		white-space: nowrap;
	}
	body.snifffr-desktop-beta .snifffr-dp-body--private-content .pc-tokens-warning-btn:hover {
		filter: brightness(1.06);
	}

	/* ── /iu-purchases/ — buyer's Instant Media purchase history ─────
	   Restyle the existing instant-unlocks-purchases.php markup so the row
	   reads as a redesign card (thumb left, meta column right, badge + pink
	   View pill anchored bottom-right). Without this the legacy layout
	   shows: a big full-width pink "remaining" pill stretched across the
	   row and a dark-purple "View Content" button — both clash with the
	   redesign's quieter card chrome. */
	body.snifffr-mp-iu-purchases .iu-purchases-section {
		padding: 0;
	}
	body.snifffr-mp-iu-purchases .iu-purchases-list {
		display: flex;
		flex-direction: column;
		gap: 12px;
		padding: 0;
		margin: 0;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-row {
		display: grid;
		grid-template-columns: 80px minmax(0, 1fr) auto;
		grid-template-areas:
			"thumb info actions"
			"thumb status actions";
		column-gap: 18px;
		row-gap: 8px;
		align-items: center;
		padding: 16px 18px;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 14px;
		box-shadow: 0 1px 3px rgba(66, 62, 89, 0.04), 0 4px 12px rgba(66, 62, 89, 0.05);
	}
	body.snifffr-mp-iu-purchases .iu-purchase-row.iu-expired {
		background: #faf9fc;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-thumb {
		grid-area: thumb;
		width: 80px;
		height: 80px;
		border-radius: 10px;
		overflow: hidden;
		background: var(--snifffr-mp-lavender, #efeaff);
		margin: 0;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-thumb.iu-blurred img {
		filter: blur(8px);
		transform: scale(1.1);
	}
	body.snifffr-mp-iu-purchases .iu-purchase-info {
		grid-area: info;
		display: flex;
		flex-direction: column;
		gap: 2px;
		min-width: 0;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-title {
		display: block;
		font-size: 15px;
		font-weight: 700;
		color: var(--snifffr-mp-purple, #423E59);
		line-height: 1.3;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-seller {
		display: block;
		font-size: 13px;
		color: rgba(66, 62, 89, 0.72);
		font-weight: 500;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-seller a {
		color: var(--snifffr-mp-pink, #E65C95);
		font-weight: 600;
		text-decoration: none;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-seller a:hover {
		text-decoration: underline;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-tokens,
	body.snifffr-mp-iu-purchases .iu-purchase-date {
		display: block;
		font-size: 12px;
		color: rgba(66, 62, 89, 0.62);
		font-weight: 500;
	}
	body.snifffr-mp-iu-purchases .iu-purchase-tokens {
		color: var(--snifffr-mp-purple, #423E59);
		font-weight: 600;
	}
	body.snifffr-mp-iu-purchases .iu-access-badge,
	body.snifffr-mp-iu-purchases .iu-expired-badge {
		grid-area: status;
		display: inline-flex;
		align-items: center;
		justify-self: start;            /* don't stretch — pill, not banner */
		gap: 6px;
		padding: 4px 12px;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.02em;
		text-transform: uppercase;
		width: auto;
	}
	body.snifffr-mp-iu-purchases .iu-access-badge {
		background: #ecfdf5;
		color: #047857;
	}
	body.snifffr-mp-iu-purchases .iu-expired-badge {
		background: rgba(66, 62, 89, 0.08);
		color: rgba(66, 62, 89, 0.72);
	}
	body.snifffr-mp-iu-purchases .iu-view-btn,
	body.snifffr-mp-iu-purchases a.iu-view-btn,
	body.snifffr-mp-iu-purchases .btn.btn-sm.iu-view-btn,
	body.snifffr-mp-iu-purchases .iu-purchase-row .iu-view-btn {
		grid-area: actions;
		justify-self: end;
		align-self: center;
		display: inline-flex !important;
		align-items: center !important;
		padding: 8px 18px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		letter-spacing: 0.02em !important;
		text-transform: none !important;
		text-decoration: none !important;
		box-shadow: 0 2px 6px rgba(230, 92, 149, 0.25) !important;
		transition: background 0.15s ease !important;
	}
	body.snifffr-mp-iu-purchases .iu-view-btn:hover,
	body.snifffr-mp-iu-purchases a.iu-view-btn:hover {
		background: #d24a7d !important;
		color: #fff !important;
	}

	/* Seller header — the row that holds the Add Listing button + the
	   "first item upgrade" upsell. Button-on-the-left layout matches the
	   Gallery / Instant Media / Private Content tabs (the upsell text
	   sits to the button's right via `.oneitemupshop { flex: 1 }`). */
	.snifffr-dp-body--shop-self .iu-seller-header {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 16px;
		flex-wrap: wrap;
		margin: 0 0 18px;
		padding: 0 0 14px;
		border-bottom: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--shop-self .oneitemupshop {
		text-align: left;
		flex: 1;
		padding: 0;
		background: transparent;
		border: 0;
	}
	.snifffr-dp-body--shop-self .oneitemupshop p {
		font-size: 13px;
		color: #6b7280;
		margin: 0 0 4px;
	}
	.snifffr-dp-body--shop-self .oneitemupshop p b {
		color: #1a1a1a;
	}

	/* Inline create / edit form card (#item-form). */
	.snifffr-dp-body--shop-self #item-form,
	.snifffr-dp-body--shop-self .iu-form-card {
		background: #fafaff;
		border: 1px solid rgba(51, 46, 77, 0.08);
		border-radius: 14px;
		padding: 20px 22px;
		margin: 0 0 22px;
		box-shadow: none;
	}
	.snifffr-dp-body--shop-self .iu-form-card h4,
	.snifffr-dp-body--shop-self #item-form h4 {
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		margin: 0 0 16px;
	}
	.snifffr-dp-body--shop-self .form-group {
		margin-bottom: 14px;
	}
	.snifffr-dp-body--shop-self .form-group > label,
	.snifffr-dp-body--shop-self label {
		display: block;
		font-size: 12px;
		font-weight: 600;
		color: #423e59;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		margin: 0 0 6px;
	}
	.snifffr-dp-body--shop-self .iu-required {
		color: #e85d8f;
		font-weight: 700;
	}
	.snifffr-dp-body--shop-self input[type="text"],
	.snifffr-dp-body--shop-self input[type="number"],
	.snifffr-dp-body--shop-self textarea,
	.snifffr-dp-body--shop-self select,
	.snifffr-dp-body--shop-self .form-control {
		width: 100%;
		padding: 10px 12px;
		background: #fff;
		color: #1a1a1a;
		border: 1px solid rgba(51, 46, 77, 0.15);
		border-radius: 8px;
		font-size: 14px;
		line-height: 1.4;
		box-sizing: border-box;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--shop-self input:focus,
	.snifffr-dp-body--shop-self textarea:focus,
	.snifffr-dp-body--shop-self select:focus,
	.snifffr-dp-body--shop-self .form-control:focus {
		outline: 0;
		border-color: #e85d8f;
		box-shadow: 0 0 0 3px rgba(232, 93, 143, 0.15);
	}
	.snifffr-dp-body--shop-self textarea {
		resize: vertical;
		min-height: 120px;
	}

	/* Confirm-checkbox rows (prohibited-content + general). */
	.snifffr-dp-body--shop-self .item-confirm-label {
		display: flex;
		align-items: flex-start;
		gap: 10px;
		font-size: 13px;
		font-weight: 500;
		color: #423e59;
		text-transform: none;
		letter-spacing: 0;
		line-height: 1.45;
		margin: 0 0 10px;
	}
	.snifffr-dp-body--shop-self .item-confirm-label input[type="checkbox"] {
		flex-shrink: 0;
		width: 18px;
		height: 18px;
		margin-top: 2px;
	}

	/* Save / Cancel button row. */
	.snifffr-dp-body--shop-self .iu-form-actions {
		display: flex;
		gap: 10px;
		margin-top: 18px;
		padding-top: 14px;
		border-top: 1px solid rgba(51, 46, 77, 0.06);
	}
	.snifffr-dp-body--shop-self #item-save-btn {
		padding: 11px 24px;
		background: #e85d8f !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 14px;
		font-weight: 600;
		box-shadow: 0 2px 6px rgba(232, 93, 143, 0.3);
		cursor: pointer;
	}
	.snifffr-dp-body--shop-self #item-save-btn:hover {
		background: #d24a7d !important;
	}
	.snifffr-dp-body--shop-self #item-cancel-btn {
		padding: 11px 22px;
		background: rgba(51, 46, 77, 0.06) !important;
		color: #423e59 !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
	}
	.snifffr-dp-body--shop-self #item-cancel-btn:hover {
		background: rgba(51, 46, 77, 0.12) !important;
	}

	/* Feedback strip. */
	.snifffr-dp-body--shop-self .iu-feedback {
		margin: 12px 0 0;
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		font-weight: 500;
		background: rgba(232, 93, 143, 0.08);
		color: #e85d8f;
	}

	/* Posts grid — owned items. */
	.snifffr-dp-body--shop-self .iu-posts-grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
		gap: 16px;
		padding: 0;
		margin: 0;
		list-style: none;
	}
	.snifffr-dp-body--shop-self .iu-post-card {
		background: #fff;
		border: 1px solid rgba(51, 46, 77, 0.08);
		border-radius: 14px;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		transition: transform 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--shop-self .iu-post-card:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(232, 93, 143, 0.12);
	}
	.snifffr-dp-body--shop-self .iu-card-thumb {
		position: relative;
		aspect-ratio: 1 / 1;
		background: #f3f4f6;
		overflow: hidden;
	}
	.snifffr-dp-body--shop-self .iu-card-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-body--shop-self .iu-card-thumb--empty {
		display: flex;
		align-items: center;
		justify-content: center;
		color: rgba(51, 46, 77, 0.3);
		font-size: 36px;
	}
	.snifffr-dp-body--shop-self .iu-no-media-icon {
		font-size: 32px;
	}
	.snifffr-dp-body--shop-self .item-img-count {
		position: absolute;
		bottom: 8px;
		left: 8px;
		background: rgba(0, 0, 0, 0.55);
		color: #fff;
		padding: 3px 8px;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 600;
	}
	.snifffr-dp-body--shop-self .iu-card-body {
		padding: 12px 14px;
		flex: 1;
	}
	.snifffr-dp-body--shop-self .iu-card-title {
		font-size: 14px;
		font-weight: 600;
		margin: 0 0 4px;
		line-height: 1.3;
	}
	.snifffr-dp-body--shop-self .iu-card-title a {
		color: #1a1a1a;
		text-decoration: none;
	}
	.snifffr-dp-body--shop-self .iu-card-title a:hover {
		color: #e65c95;
	}
	.snifffr-dp-body--shop-self .iu-card-desc {
		font-size: 12px;
		color: #6b7280;
		margin: 0 0 8px;
	}
	.snifffr-dp-body--shop-self .iu-price-badge {
		display: inline-block;
		background: rgba(232, 93, 143, 0.08);
		color: #e65c95;
		padding: 4px 10px;
		border-radius: 999px;
		font-size: 12px;
		font-weight: 600;
	}

	/* Card actions row — Edit / Repost / Delete pills. */
	.snifffr-dp-body--shop-self .iu-card-actions {
		display: flex;
		gap: 6px;
		padding: 10px 14px 14px;
		margin: 0;
		border: 0;
	}
	.snifffr-dp-body--shop-self .iu-card-actions > * {
		flex: 1;
		appearance: none;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 7px 10px;
		background: rgba(51, 46, 77, 0.06) !important;
		color: #423e59 !important;
		border: 0 !important;
		border-radius: 8px !important;
		font-size: 12px;
		font-weight: 600;
		text-decoration: none;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-body--shop-self .iu-card-actions .item-edit-btn:hover {
		background: rgba(232, 93, 143, 0.1) !important;
		color: #e65c95 !important;
	}
	.snifffr-dp-body--shop-self .iu-card-actions .item-delete-btn {
		color: #b91c1c !important;
		background: rgba(185, 28, 28, 0.06) !important;
	}
	.snifffr-dp-body--shop-self .iu-card-actions .item-delete-btn:hover {
		background: rgba(185, 28, 28, 0.12) !important;
	}
	.snifffr-dp-body--shop-self .iu-card-actions .item-repost-btn.disabled,
	.snifffr-dp-body--shop-self .iu-card-actions .is-disabled {
		opacity: 0.45;
		cursor: not-allowed;
	}

	/* Buyer purchase histories — list-style table rendering from the
	   plugin. Make the rows readable on the wider column. */
	.snifffr-dp-body--iu-purchases table,
	.snifffr-dp-body--private-content-purchases table {
		width: 100%;
		border-collapse: collapse;
		font-size: 14px;
	}
	.snifffr-dp-body--iu-purchases th,
	.snifffr-dp-body--iu-purchases td,
	.snifffr-dp-body--private-content-purchases th,
	.snifffr-dp-body--private-content-purchases td {
		padding: 12px 10px;
		text-align: left;
		border-bottom: 1px solid rgba(51, 46, 77, 0.05);
		color: #423e59;
	}
	.snifffr-dp-body--iu-purchases th,
	.snifffr-dp-body--private-content-purchases th {
		font-weight: 700;
		color: #1a1a1a;
		font-size: 12px;
		text-transform: uppercase;
		letter-spacing: 0.4px;
	}

	/* ──────────────────────────────────────────────────────────────
	   /escrow/ — Tokens hub (Balance / Log / Orders sub-tabs).
	   The escrow.php template emits a #subnav pill row + then one of
	   three branches: seller balance card (.iu-form-card cluster),
	   buyer balance/QuickPay (.tokenbuy1/.coinsb/.tokenbuy2/.tokenbuyfaq),
	   or mycred history table. Mirror the mobile aesthetic at 992+.
	   ────────────────────────────────────────────────────────────── */

	/* Sub-tab pill row (Balance / Log / Orders). Match the body card's
	   white surface so the pills float on the card without doubling the
	   chrome. */
	.snifffr-dp-body--escrow #subnav.item-list-tabs {
		display: block !important;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 0 18px !important;
		overflow: visible !important;
	}
	.snifffr-dp-body--escrow #subnav ul {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 8px !important;
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}
	.snifffr-dp-body--escrow #subnav ul li {
		display: block !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		background: transparent !important;
		border: 0 !important;
		flex: 0 0 auto !important;
		width: auto !important;
	}
	.snifffr-dp-body--escrow #subnav ul li a {
		display: inline-flex;
		align-items: center;
		padding: 8px 18px;
		border-radius: 999px;
		background: #fff;
		color: #423e59;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		line-height: 1.2;
		border: 1px solid rgba(66, 62, 89, 0.12);
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--escrow #subnav ul li a:hover {
		background: #eceaf2;
		border-color: rgba(66, 62, 89, 0.22);
	}
	.snifffr-dp-body--escrow #subnav ul li.selected a,
	.snifffr-dp-body--escrow #subnav ul li.current a {
		background: #e65c95 !important;
		color: #fff !important;
		border-color: #e65c95 !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}
	/* Hide BP-internal subnav items the plugin registers (Create / View)
	   — they're routed internally, not user-facing pills. */
	.snifffr-dp-body--escrow #subnav ul li#create-personal-li,
	.snifffr-dp-body--escrow #subnav ul li#view-personal-li,
	.snifffr-dp-body--escrow #subnav ul li#members-order-select,
	.snifffr-dp-body--escrow #subnav ul li.filter {
		display: none !important;
	}

	/* Seller token cards — .iu-form-card.snifffr-tokens-card wraps each
	   block (Balance / Ways to earn / Upgrade / Log / Cash Out). */
	.snifffr-dp-body--escrow .iu-form-card.snifffr-tokens-card {
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.10);
		border-radius: 14px;
		padding: 22px 24px;
		margin: 0 0 16px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
	}
	.snifffr-dp-body--escrow .iu-form-card.snifffr-tokens-card h4 {
		margin: 0 0 12px;
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.3;
	}

	/* Balance card — amount + unit + "View token log" CTA. */
	.snifffr-dp-body--escrow .snifffr-tokens-balance-intro {
		margin: 0 0 14px;
		font-size: 13.5px;
		line-height: 1.55;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-body--escrow .snifffr-tokens-balance-amount {
		display: flex;
		align-items: baseline;
		gap: 8px;
		margin: 0 0 18px;
		font-size: 36px;
		font-weight: 800;
		color: #423e59;
		line-height: 1;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-balance-unit {
		font-size: 14px;
		font-weight: 600;
		color: rgba(66, 62, 89, 0.7);
		text-transform: uppercase;
		letter-spacing: 0.04em;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-balance-cta {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 16px;
		border-radius: 999px;
		background: #fff !important;
		color: #423e59 !important;
		border: 1px solid rgba(66, 62, 89, 0.16);
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.25px;
		text-transform: uppercase;
		text-decoration: none !important;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-balance-cta:hover,
	.snifffr-dp-body--escrow .snifffr-tokens-balance-cta:focus {
		background: #eceaf2 !important;
		border-color: rgba(66, 62, 89, 0.22);
	}

	/* "Ways to earn tokens" — icon + body rows on the seller Balance tab. */
	.snifffr-dp-body--escrow .snifffr-tokens-earn-list {
		list-style: none;
		margin: 4px 0 0;
		padding: 0;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-earn-list li {
		display: flex;
		align-items: flex-start;
		gap: 12px;
		padding: 14px 16px;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.10);
		border-radius: 12px;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-earn-icon {
		flex: 0 0 auto;
		width: 38px;
		height: 38px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		font-size: 18px;
		background: #eceaf2;
		border-radius: 999px;
		color: #e65c95;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-earn-icon i.bi { line-height: 1; }
	.snifffr-dp-body--escrow .snifffr-tokens-earn-body {
		display: flex;
		flex-direction: column;
		gap: 2px;
		min-width: 0;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-earn-body strong {
		font-size: 13.5px;
		font-weight: 700;
		color: #423e59;
	}
	.snifffr-dp-body--escrow .snifffr-tokens-earn-body span {
		font-size: 12.5px;
		line-height: 1.5;
		color: rgba(66, 62, 89, 0.7);
	}

	/* Premium upgrade card — centred + pink pill CTA. */
	.snifffr-dp-body--escrow .snifffr-tokens-upgrade { text-align: center; }
	.snifffr-dp-body--escrow .snifffr-tokens-upgrade p {
		margin: 0 0 16px;
		font-size: 13.5px;
		line-height: 1.55;
		color: rgba(66, 62, 89, 0.7);
	}
	/* Pink-pill upgrade CTA. Originally scoped to .snifffr-dp-body--escrow
	   only (tokens-purchase upsell), but the same class is reused for the
	   messages-loop empty-state upgrade prompt and would render as plain
	   text on /messages/ because the body scope didn't match. Broadened
	   to body.snifffr-desktop-beta so the button styles fire on every
	   redesign page that uses the class. */
	body.snifffr-desktop-beta .snifffr-tokens-upgrade-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 12px 26px;
		border-radius: 999px;
		background: #e65c95 !important;
		color: #fff !important;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.4px;
		text-transform: uppercase;
		text-decoration: none !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
		transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-tokens-upgrade-btn:hover,
	body.snifffr-desktop-beta .snifffr-tokens-upgrade-btn:focus {
		opacity: 0.94;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.32);
		transform: translateY(-1px);
	}

	/* Buyer Balance branch — tokenbuy1 / coinsb / tokenbuy2 / tokenbuyfaq. */
	.snifffr-dp-body--escrow .tokenbuy1 {
		background: transparent;
		border: 0;
		padding: 0;
		margin: 0 0 14px;
		box-shadow: none;
	}
	.snifffr-dp-body--escrow .coinsb,
	.snifffr-dp-body--escrow .tokenbuy2,
	.snifffr-dp-body--escrow .tokenbuy3,
	.snifffr-dp-body--escrow .tokenbuyfaq {
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.10);
		border-radius: 14px;
		padding: 22px 24px;
		margin: 0 0 16px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
		color: #423e59;
	}
	.snifffr-dp-body--escrow .coinsb h3,
	.snifffr-dp-body--escrow .tokenbuy2 h4,
	.snifffr-dp-body--escrow .tokenbuy3 h4,
	.snifffr-dp-body--escrow .tokenbuyfaq h4 {
		margin: 0 0 12px;
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
		line-height: 1.3;
	}
	.snifffr-dp-body--escrow .coinsb .currentbalance {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 10px;
		margin: 6px 0 16px;
		padding: 14px 16px;
		background: #eceaf2;
		border-radius: 12px;
		font-size: 13px;
		font-weight: 600;
		color: rgba(66, 62, 89, 0.7);
		text-transform: uppercase;
		letter-spacing: 0.04em;
	}
	.snifffr-dp-body--escrow .coinsb .currentbalance b {
		font-size: 20px;
		font-weight: 800;
		color: #423e59;
		text-transform: none;
		letter-spacing: 0;
	}

	/* FAQ accordion (buyers) — light lavender card row, +/- toggle.
	   Mirrors the #accordion-howit pattern on the Balance sub-tab so
	   both accordions on the Tokens page feel consistent. */
	.snifffr-dp-body--escrow .snifffr-faq-list {
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item {
		background: #f4f2fb;
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 12px;
		padding: 0;
		overflow: hidden;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item:hover {
		background: #ece8f7;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item[open] {
		background: #fff;
		border-color: rgba(66, 62, 89, 0.14);
	}
	.snifffr-dp-body--escrow .snifffr-faq-item summary {
		position: relative;
		cursor: pointer;
		font-size: 13.5px;
		font-weight: 600;
		color: #423e59;
		list-style: none;
		padding: 14px 44px 14px 18px;
		user-select: none;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item summary:hover {
		color: #e65c95;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item summary::-webkit-details-marker { display: none; }
	.snifffr-dp-body--escrow .snifffr-faq-item summary::after {
		content: "+";
		position: absolute;
		top: 50%;
		right: 16px;
		transform: translateY(-50%);
		width: 22px;
		height: 22px;
		line-height: 20px;
		text-align: center;
		font-size: 18px;
		font-weight: 400;
		color: #e65c95;
		transition: transform 0.2s ease;
	}
	.snifffr-dp-body--escrow .snifffr-faq-item[open] summary::after {
		content: "\2212"; /* en-dash style minus */
		font-size: 18px;
	}
	.snifffr-dp-body--escrow .snifffr-faq-body {
		margin: 0;
		padding: 0 18px 16px;
		font-size: 13px;
		line-height: 1.55;
		color: rgba(66, 62, 89, 0.85);
	}

	/* Token log / Orders tables (mycred + plugin partial). */
	.snifffr-dp-body--escrow .snifffr-tokens-log .mycred-history-wrapper,
	.snifffr-dp-body--escrow .snifffr-tokens-log .mycred-history-wrapper form,
	.snifffr-dp-body--escrow .snifffr-tokens-log .mycred-history-wrapper form.form-inline,
	.snifffr-dp-body--escrow .table-responsive {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		flex: 0 0 100% !important;
	}
	.snifffr-dp-body--escrow table.mycred-table,
	.snifffr-dp-body--escrow table.table {
		width: 100%;
		margin: 12px 0 0;
		font-size: 13px;
		color: #423e59;
		border-collapse: collapse;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.12);
		border-radius: 12px;
		overflow: hidden;
	}
	.snifffr-dp-body--escrow table.mycred-table th,
	.snifffr-dp-body--escrow table.table th {
		padding: 12px 14px;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		color: rgba(66, 62, 89, 0.7);
		text-align: left;
		background: #eceaf2;
		border: 0;
		border-bottom: 1px solid rgba(66, 62, 89, 0.12);
		white-space: nowrap;
	}
	.snifffr-dp-body--escrow table.mycred-table td,
	.snifffr-dp-body--escrow table.table td {
		padding: 12px 14px;
		font-size: 13px;
		border: 0;
		border-bottom: 1px solid rgba(66, 62, 89, 0.06);
		vertical-align: middle;
	}
	.snifffr-dp-body--escrow table.mycred-table td:first-child,
	.snifffr-dp-body--escrow table.table td:first-child {
		white-space: nowrap;
	}
	.snifffr-dp-body--escrow table tr:last-child td {
		border-bottom: 0;
	}
	/* MyCRED's history table emits a <tfoot> with a duplicate copy of
	   the <thead> column labels — useful on very long tables but visual
	   noise here. Hide it. */
	.snifffr-dp-body--escrow table.mycred-table tfoot,
	.snifffr-dp-body--escrow table.table tfoot {
		display: none !important;
	}
	/* Wrap the table in a soft outer card so the lavender thead reads
	   as the table header bar, not just a stray pill. Also adds a clean
	   1px border around the entire table so the corners curve properly
	   on browsers that don't honour `border-collapse + border-radius`. */
	.snifffr-dp-body--escrow .table-responsive,
	.snifffr-dp-body--escrow .mycred-history-wrapper {
		border-radius: 14px;
		overflow: hidden;
		box-shadow: 0 1px 3px rgba(66, 62, 89, 0.04), 0 4px 12px rgba(66, 62, 89, 0.05);
		background: #fff;
	}
	.snifffr-dp-body--escrow .table-responsive table,
	.snifffr-dp-body--escrow .mycred-history-wrapper table {
		margin: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
	}
	.snifffr-dp-body--escrow table.mycred-table a,
	.snifffr-dp-body--escrow table.table a {
		color: #e65c95;
		text-decoration: none;
		font-weight: 600;
	}
	.snifffr-dp-body--escrow table.mycred-table a:hover,
	.snifffr-dp-body--escrow table.table a:hover {
		text-decoration: underline;
	}

	/* Place-new-order CTA at the top of the Orders tab — pink pill. */
	.snifffr-dp-body--escrow a#create-btn {
		display: inline-flex;
		align-items: center;
		margin: 0 0 14px;
		padding: 10px 22px;
		border-radius: 999px;
		background: #e65c95;
		color: #fff !important;
		font-weight: 600;
		font-size: 13px;
		text-decoration: none !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}
	.snifffr-dp-body--escrow a#create-btn:hover { opacity: 0.92; }

	/* Collapse the small-screen 1-column grid back at very narrow widths
	   that may sit inside the redesign (e.g. 992-1100px with sidebar). */
	@media (max-width: 1099px) {
		.snifffr-dp-body--escrow .snifffr-tokens-earn-list {
			grid-template-columns: 1fr;
		}
	}

	/* Plugin partial wrapper (Orders tab) — neutralise its outer section
	   chrome so the body card supplies the surface. */
	.snifffr-dp-body--escrow .section.section-display {
		background: transparent;
		padding: 0;
		margin: 0;
	}

	/* Bootstrap-style #accordion cards used by the Orders FAQ and the
	   buyer Balance "How tokens work" panel. Restyled to match the
	   tokenbuyfaq pattern: lavender pill rows, pink +/- toggle, lift to
	   white card on the open state.
	   Markup contract (escrow.php / orders partial):
	     #accordion(-howit) > .card > .card-header > h5 > button.btn-link
	                                                            (+ .collapsed when closed)
	                       > .collapse(.show when open) > .card-body
	*/
	.snifffr-dp-body--escrow #accordion,
	.snifffr-dp-body--escrow #accordion-howit {
		margin: 0 0 16px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.snifffr-dp-body--escrow #accordion .card,
	.snifffr-dp-body--escrow #accordion-howit .card {
		background: #f4f2fb;
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 12px;
		margin: 0;
		overflow: hidden;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--escrow #accordion .card:hover,
	.snifffr-dp-body--escrow #accordion-howit .card:hover {
		background: #ece8f7;
	}
	/* Open state — a `.collapse.show` lives inside the card. `:has()` is
	   supported in every evergreen browser since 2023. */
	.snifffr-dp-body--escrow #accordion .card:has(.collapse.show),
	.snifffr-dp-body--escrow #accordion-howit .card:has(.collapse.show) {
		background: #fff;
		border-color: rgba(66, 62, 89, 0.14);
	}
	.snifffr-dp-body--escrow #accordion .card-header,
	.snifffr-dp-body--escrow #accordion-howit .card-header {
		background: transparent;
		border: 0;
		padding: 0;
	}
	.snifffr-dp-body--escrow #accordion .card-header h5,
	.snifffr-dp-body--escrow #accordion-howit .card-header h5 {
		margin: 0;
	}
	.snifffr-dp-body--escrow #accordion .btn-link,
	.snifffr-dp-body--escrow #accordion-howit .btn-link {
		position: relative;
		display: block;
		width: 100%;
		padding: 14px 44px 14px 18px;
		font-size: 13.5px;
		font-weight: 600;
		color: #423e59 !important;
		text-decoration: none !important;
		text-align: left;
		background: transparent;
		border: 0;
		cursor: pointer;
		user-select: none;
	}
	.snifffr-dp-body--escrow #accordion .btn-link:hover,
	.snifffr-dp-body--escrow #accordion-howit .btn-link:hover {
		color: #e65c95 !important;
	}
	/* Hide the original `<i class="fa">` chevron escrow.php emits — we
	   replace it with a pink + / − pseudo-element. */
	.snifffr-dp-body--escrow #accordion .btn-link i.fa,
	.snifffr-dp-body--escrow #accordion-howit .btn-link i.fa {
		display: none;
	}
	.snifffr-dp-body--escrow #accordion .btn-link::after,
	.snifffr-dp-body--escrow #accordion-howit .btn-link::after {
		content: "+";
		position: absolute;
		top: 50%;
		right: 16px;
		transform: translateY(-50%);
		width: 22px;
		height: 22px;
		line-height: 20px;
		text-align: center;
		font-size: 18px;
		font-weight: 400;
		color: #e65c95;
	}
	.snifffr-dp-body--escrow #accordion .btn-link:not(.collapsed)::after,
	.snifffr-dp-body--escrow #accordion-howit .btn-link:not(.collapsed)::after {
		content: "\2212"; /* en-dash style minus to match the tokenbuyfaq */
	}
	.snifffr-dp-body--escrow #accordion .card-body,
	.snifffr-dp-body--escrow #accordion-howit .card-body {
		padding: 0 18px 16px;
		font-size: 13px;
		line-height: 1.55;
		color: rgba(66, 62, 89, 0.85);
	}

	/* ──────────────────────────────────────────────────────────────
	   /escrow/create/ — Place a New Order form.
	   The plugin partial at
	   wp-content/plugins/snifffr-escrow/public/partials/snifffr-escrow-public-display-create.php
	   emits plain Bootstrap `.form-group > .row > .col-md` rows with a
	   trailing orphan `</tr><tr><td><p>…</p></td></tr></table>` fragment
	   below the form. Wrap the form in the redesign card chrome, stack
	   each row vertically, and convert the dangling helper paragraph
	   into a lavender footnote card. Scoped to the desktop body wrap so
	   the existing mobile rules (body.snifffr-mp-tokens .snifffr-mp-body--escrow
	   form.escrow-create) keep owning mobile widths.
	   ────────────────────────────────────────────────────────────── */
	.snifffr-dp-body--escrow form.escrow-create {
		position: relative;
		max-width: 640px;
		margin: 0 auto;
		padding: 32px 36px 30px;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.10);
		border-radius: 18px;
		box-shadow:
			0 1px 3px rgba(66, 62, 89, 0.04),
			0 10px 32px rgba(66, 62, 89, 0.06);
		color: var(--snifffr-mp-purple, #423E59);
		overflow: hidden;
	}
	.snifffr-dp-body--escrow form.escrow-create::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 3px;
		background: linear-gradient(90deg, #e85d8f, #b794f6);
	}

	/* Stack label/input vertically — kill Bootstrap's md+ split-column
	   layout that puts the label in one col and the field in the next. */
	.snifffr-dp-body--escrow form.escrow-create .form-group {
		margin: 0 0 18px;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group:last-of-type {
		margin-bottom: 0;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group .row {
		display: block;
		margin: 0;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group .col-md {
		padding: 0;
		flex: none;
		max-width: 100%;
		width: 100%;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group .col-md:empty {
		display: none;
	}

	/* Labels — small caps + soft tone so the inputs do the visual work. */
	.snifffr-dp-body--escrow form.escrow-create label {
		display: block;
		margin: 0 0 8px;
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: rgba(66, 62, 89, 0.65);
	}

	/* Inputs / textarea — matches the rest of the redesign forms. */
	.snifffr-dp-body--escrow form.escrow-create input[type="text"],
	.snifffr-dp-body--escrow form.escrow-create input[type="number"],
	.snifffr-dp-body--escrow form.escrow-create input[type="date"],
	.snifffr-dp-body--escrow form.escrow-create textarea,
	.snifffr-dp-body--escrow form.escrow-create .form-control {
		width: 100%;
		height: auto;
		padding: 12px 14px;
		font-size: 15px;
		line-height: 1.45;
		font-family: inherit;
		color: #423E59;
		background: #fff;
		border: 1.5px solid rgba(66, 62, 89, 0.14);
		border-radius: 12px;
		box-shadow: none;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--escrow form.escrow-create textarea {
		min-height: 120px;
		resize: vertical;
	}
	.snifffr-dp-body--escrow form.escrow-create input:focus,
	.snifffr-dp-body--escrow form.escrow-create textarea:focus,
	.snifffr-dp-body--escrow form.escrow-create .form-control:focus {
		outline: 0;
		border-color: #E65C95;
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.14);
	}

	/* Date inputs — jQuery UI datepicker is read-only so style the affordance. */
	.snifffr-dp-body--escrow form.escrow-create input.datepicker_escrow {
		cursor: pointer;
		background-image: linear-gradient(transparent, transparent),
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E65C95' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='17' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: right 14px center;
		background-size: 18px 18px;
		padding-right: 44px;
	}

	/* "You have N tokens" caption under the Tokens input. */
	.snifffr-dp-body--escrow form.escrow-create small {
		display: inline-block;
		margin: 8px 0 0;
		padding: 4px 10px;
		font-size: 12px;
		font-weight: 600;
		color: #423E59;
		background: rgba(232, 93, 143, 0.10);
		border-radius: 999px;
	}

	/* Inline field errors. */
	.snifffr-dp-body--escrow form.escrow-create .error {
		display: block;
		margin-top: 6px;
		padding: 8px 12px;
		font-size: 13px;
		font-weight: 600;
		color: #b91c1c;
		background: #fde8ef;
		border-radius: 8px;
	}

	/* T&Cs row — second-to-last form-group. Source markup splits the
	   wording (col 1) from the radio (col 2). Flip the row order so the
	   radio leads, then the inline label/link. nth-last-of-type(2) is
	   safe because there's exactly one submit row after this one. */
	.snifffr-dp-body--escrow form.escrow-create .form-group:nth-last-of-type(2) .row {
		display: flex;
		flex-direction: row-reverse;
		justify-content: flex-end;
		align-items: center;
		gap: 12px;
		margin: 4px 0 0;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group:nth-last-of-type(2) .col-md {
		width: auto;
		max-width: none;
		flex: 0 0 auto;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group:nth-last-of-type(2) label {
		display: inline;
		margin: 0;
		font-size: 14px;
		font-weight: 500;
		text-transform: none;
		letter-spacing: 0;
		color: #423E59;
	}
	.snifffr-dp-body--escrow form.escrow-create input[type="radio"] {
		margin: 0;
		accent-color: #E65C95;
		transform: scale(1.15);
		cursor: pointer;
	}
	.snifffr-dp-body--escrow form.escrow-create a.tndc {
		color: #E65C95;
		font-weight: 600;
		text-decoration: underline;
	}
	.snifffr-dp-body--escrow form.escrow-create a.tndc:hover,
	.snifffr-dp-body--escrow form.escrow-create a.tndc:focus {
		color: #d24a7d;
		text-decoration: underline;
	}

	/* Submit row — right-align a pink pill, hide the empty label cell. */
	.snifffr-dp-body--escrow form.escrow-create .form-group:last-of-type .row {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 12px;
		margin: 10px 0 0;
	}
	.snifffr-dp-body--escrow form.escrow-create .form-group:last-of-type .col-md {
		width: auto;
		max-width: none;
		flex: 0 0 auto;
	}
	.snifffr-dp-body--escrow form.escrow-create input[type="submit"],
	.snifffr-dp-body--escrow form.escrow-create #escrow_submit {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 200px;
		padding: 13px 28px;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.5px;
		text-transform: uppercase;
		color: #fff;
		background: #E65C95;
		border: 0;
		border-radius: 999px;
		cursor: pointer;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28);
		transition: filter 0.15s ease, transform 0.05s ease;
	}
	.snifffr-dp-body--escrow form.escrow-create input[type="submit"]:hover,
	.snifffr-dp-body--escrow form.escrow-create input[type="submit"]:focus,
	.snifffr-dp-body--escrow form.escrow-create #escrow_submit:hover,
	.snifffr-dp-body--escrow form.escrow-create #escrow_submit:focus {
		filter: brightness(1.06);
		outline: 0;
	}
	.snifffr-dp-body--escrow form.escrow-create input[type="submit"]:active,
	.snifffr-dp-body--escrow form.escrow-create #escrow_submit:active {
		transform: translateY(1px);
	}

	/* Orphan trailing markup. The plugin partial closes the <form>, then
	   spits out `</tr><tr><td><p>The seller will be notified…</p></td><td></td></tr></table>`
	   with no opening <table>. Browsers float-render the <p> in unpredictable
	   places. Force the dangling tr/td (now sibling-elements of the form,
	   not children) to block layout, and dress the paragraph as a lavender
	   footnote that visually anchors below the card. */
	.snifffr-dp-body--escrow form.escrow-create ~ table,
	.snifffr-dp-body--escrow form.escrow-create ~ tr,
	.snifffr-dp-body--escrow form.escrow-create ~ tr td,
	.snifffr-dp-body--escrow table:has(.escrow-create),
	.snifffr-dp-body--escrow table:has(.escrow-create) tr,
	.snifffr-dp-body--escrow table:has(.escrow-create) td {
		display: block;
		width: 100%;
		max-width: 640px;
		margin-left: auto;
		margin-right: auto;
		border: 0;
		background: transparent;
	}
	.snifffr-dp-body--escrow form.escrow-create ~ tr td:empty {
		display: none;
	}
	.snifffr-dp-body--escrow form.escrow-create ~ tr p {
		margin: 16px auto 0;
		padding: 14px 18px;
		max-width: 640px;
		background: linear-gradient(135deg, rgba(232, 93, 143, 0.05), rgba(231, 226, 255, 0.55));
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 14px;
		font-size: 13px;
		line-height: 1.55;
		color: rgba(66, 62, 89, 0.85);
		text-align: center;
	}

	/* Narrow-viewport fallback for desktop-beta users on tablets. The
	   stacking already works at any width, but the submit row right-aligns
	   a small pill against the side; on narrow widths stretch it full so it
	   reads as a primary CTA. */
	@media (max-width: 720px) {
		.snifffr-dp-body--escrow form.escrow-create {
			padding: 22px 20px 20px;
		}
		.snifffr-dp-body--escrow form.escrow-create .form-group:last-of-type .row {
			justify-content: stretch;
		}
		.snifffr-dp-body--escrow form.escrow-create .form-group:last-of-type .col-md {
			width: 100%;
			flex: 1 1 auto;
		}
		.snifffr-dp-body--escrow form.escrow-create input[type="submit"],
		.snifffr-dp-body--escrow form.escrow-create #escrow_submit {
			width: 100%;
		}
	}

	/* ──────────────────────────────────────────────────────────────
	   /shop/item/{slug}/ — single shop item view.
	   2-column hero: media gallery on the left (~55%), info rail on
	   the right with title/price hierarchy and role-appropriate CTAs.
	   ────────────────────────────────────────────────────────────── */
	.snifffr-dp-body--shop-item {
		background: #fff;
		border-radius: 16px;
		padding: 24px 28px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
		overflow: hidden;
	}
	.snifffr-dp-si-back {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin: 0 0 18px;
		padding: 6px 14px 6px 10px;
		font-size: 12px;
		font-weight: 600;
		color: #423e59;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.14);
		border-radius: 999px;
		text-decoration: none;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-si-back:hover {
		background: #eceaf2;
		border-color: rgba(66, 62, 89, 0.22);
		color: #423e59;
	}
	.snifffr-dp-si-grid {
		display: grid;
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		gap: 28px;
		align-items: start;
	}
	@media (max-width: 1100px) {
		.snifffr-dp-si-grid {
			grid-template-columns: 1fr;
		}
	}

	/* Media column */
	.snifffr-dp-si-media {
		display: flex;
		flex-direction: column;
		gap: 12px;
		min-width: 0;
	}
	.snifffr-dp-si-stage {
		position: relative;
		background: #f6f3fb;
		border-radius: 14px;
		overflow: hidden;
		aspect-ratio: 4 / 3;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.snifffr-dp-si-stage--empty img {
		max-width: 120px;
		opacity: 0.4;
	}
	.snifffr-dp-si-slide {
		position: absolute;
		inset: 0;
		display: none;
		align-items: center;
		justify-content: center;
	}
	.snifffr-dp-si-slide.is-active {
		display: flex;
	}
	.snifffr-dp-si-slide > a,
	.snifffr-dp-si-slide > img {
		display: block;
		width: 100%;
		height: 100%;
	}
	.snifffr-dp-si-slide img {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}
	.snifffr-dp-si-thumbs {
		display: flex;
		gap: 8px;
		flex-wrap: wrap;
	}
	.snifffr-dp-si-thumb {
		display: block;
		width: 64px;
		height: 64px;
		padding: 0;
		border: 2px solid transparent;
		border-radius: 10px;
		background: transparent;
		cursor: pointer;
		overflow: hidden;
		transition: border-color 0.15s ease, transform 0.15s ease;
	}
	.snifffr-dp-si-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.snifffr-dp-si-thumb:hover {
		border-color: rgba(232, 93, 143, 0.4);
		transform: translateY(-1px);
	}
	.snifffr-dp-si-thumb.is-active {
		border-color: #e85d8f;
	}

	/* Info rail */
	.snifffr-dp-si-info {
		display: flex;
		flex-direction: column;
		gap: 14px;
		min-width: 0;
		padding: 4px 0;
	}
	.snifffr-dp-si-age {
		display: inline-flex;
		align-self: flex-start;
		align-items: center;
		gap: 4px;
		padding: 4px 12px;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: #e85d8f;
		background: #fce4ec;
		border-radius: 999px;
	}
	.snifffr-dp-si-title {
		margin: 0;
		font-size: 28px;
		font-weight: 800;
		line-height: 1.2;
		color: #1a1a1a;
		letter-spacing: -0.01em;
	}
	.snifffr-dp-si-desc {
		font-size: 14.5px;
		line-height: 1.6;
		color: #423e59;
		word-break: break-word;
	}
	.snifffr-dp-si-desc p {
		margin: 0 0 8px;
	}
	.snifffr-dp-si-desc p:last-child {
		margin-bottom: 0;
	}
	.snifffr-dp-si-price {
		display: flex;
		align-items: baseline;
		gap: 8px;
		padding: 16px 18px;
		background: linear-gradient(180deg, #fff5fa 0%, #ffffff 100%);
		border: 1px solid rgba(232, 93, 143, 0.18);
		border-radius: 14px;
	}
	.snifffr-dp-si-price-amount {
		font-size: 36px;
		font-weight: 800;
		color: #e85d8f;
		line-height: 1;
	}
	.snifffr-dp-si-price-unit {
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-si-actions {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-top: 4px;
	}
	.snifffr-dp-si-actions .snifffr-dp-si-delete-form {
		margin: 0;
		padding: 0;
	}
	.snifffr-dp-si-action {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		width: 100%;
		padding: 12px 18px;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.3px;
		text-transform: uppercase;
		text-decoration: none !important;
		cursor: pointer;
		border: 1px solid transparent;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
	}
	.snifffr-dp-si-action--primary {
		background: #e85d8f;
		color: #fff !important;
		border-color: #e85d8f;
		box-shadow: 0 4px 12px rgba(232, 93, 143, 0.25);
	}
	.snifffr-dp-si-action--primary:hover {
		opacity: 0.95;
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(232, 93, 143, 0.32);
	}
	.snifffr-dp-si-action--secondary {
		background: #fff;
		color: #423e59 !important;
		border-color: rgba(66, 62, 89, 0.22);
	}
	.snifffr-dp-si-action--secondary:hover {
		background: #eceaf2;
		border-color: rgba(66, 62, 89, 0.3);
	}
	.snifffr-dp-si-action--danger {
		background: #fff;
		color: #e85d8f !important;
		border-color: rgba(232, 93, 143, 0.3);
	}
	.snifffr-dp-si-action--danger:hover {
		background: #fce4ec;
		border-color: #e85d8f;
	}
	.snifffr-dp-si-action--verify {
		background: #fff;
		color: #423e59 !important;
		border-color: rgba(66, 62, 89, 0.22);
	}
	.snifffr-dp-si-action--verify:hover {
		background: #eceaf2;
	}

	/* Tags */
	.snifffr-dp-si-tags {
		margin-top: 4px;
		padding-top: 14px;
		border-top: 1px solid rgba(66, 62, 89, 0.1);
	}
	.snifffr-dp-si-tags-label {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		color: rgba(66, 62, 89, 0.6);
		margin: 0 0 8px;
	}
	.snifffr-dp-si-tags ul {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.snifffr-dp-si-tags li a {
		display: inline-flex;
		align-items: center;
		padding: 5px 12px;
		font-size: 12px;
		font-weight: 500;
		color: #e85d8f;
		background: #fff;
		border: 1px solid rgba(232, 93, 143, 0.3);
		border-radius: 999px;
		text-decoration: none;
		transition: background 0.15s ease, color 0.15s ease;
	}
	.snifffr-dp-si-tags li a:hover {
		background: #e85d8f;
		color: #fff;
	}

	/* Footer meta */
	.snifffr-dp-si-meta {
		margin-top: 8px;
		padding-top: 14px;
		border-top: 1px solid rgba(66, 62, 89, 0.1);
		font-size: 12px;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-si-meta-link {
		color: #e85d8f;
		font-weight: 600;
		text-decoration: none;
	}
	.snifffr-dp-si-meta-link:hover {
		text-decoration: underline;
	}

	/* ──────────────────────────────────────────────────────────────
	   About body — "What's new" post-form + Recent activity feed.
	   The inner .snifffr-mp-postform / .snifffr-mp-activity-* markup
	   carries the existing mobile styling (declared outside the mobile
	   @media block), so we only need to neutralise mobile's phone-narrow
	   side padding for the desktop column.
	   ────────────────────────────────────────────────────────────── */
	.snifffr-dp-body--about .snifffr-dp-postform-wrap {
		margin-top: 24px;
		padding-top: 20px;
		border-top: 1px solid rgba(51, 46, 77, 0.08);
	}
	.snifffr-dp-body--about .snifffr-dp-postform-wrap .snifffr-mp-postform {
		margin: 0;
		padding: 0;
	}
	.snifffr-dp-body--about .snifffr-dp-activity-wrap {
		margin-top: 0;
		padding: 0;
	}
	.snifffr-dp-body--about .snifffr-dp-activity-wrap .snifffr-dp-card-title {
		margin: 0 0 14px;
		font-size: 16px;
		font-weight: 700;
		color: #1a1a1a;
	}
	/* Mobile rule sets `.snifffr-mp-activity-avatar img/.avatar` to 32px —
	   bump to 40px for the desktop column so the row reads larger. */
	.snifffr-dp-body--about .snifffr-mp-activity-avatar,
	.snifffr-dp-body--about .snifffr-mp-activity-avatar img,
	.snifffr-dp-body--about .snifffr-mp-activity-avatar .avatar {
		width: 40px;
		height: 40px;
	}
	/* Inline mention avatars inside the activity action text ("X and Y are
	   now friends" — BP injects a small <img class="avatar"> next to each
	   user link). Those have no wrapper, so `filter: blur()` halo can't
	   be clipped by overflow:hidden on a parent. `clip-path: circle()`
	   clips the element's own content (filter + img) to a circular path
	   so the blurred mention reads as a tidy round portrait, not a smudge. */
	.snifffr-dp-body--about .snifffr-mp-activity-body img,
	.snifffr-dp-body--about .snifffr-mp-activity-body img.avatar,
	.snifffr-dp-body--about .snifffr-mp-activity-action img,
	body.snifffr-desktop-beta #buddypress .activity-header img,
	body.snifffr-desktop-beta #buddypress .activity-header img.avatar,
	body.snifffr-desktop-beta #buddypress .activity-inner img.avatar {
		width: 20px !important;
		height: 20px !important;
		border-radius: 50% !important;
		clip-path: circle(50% at 50% 50%) !important;
		-webkit-clip-path: circle(50% at 50% 50%) !important;
		background: var(--snifffr-mp-lavender, #efeaff) !important;
		vertical-align: middle !important;
		margin: 0 4px !important;
		object-fit: cover !important;
	}

	/* Post-form options bar: the JS in snifffr-desktop-profile.php moves
	   #mpp-activity-upload-buttons into #whats-new-options before
	   #whats-new-submit. Mobile already sets the bar to flex with
	   margin-left:auto on submit — re-state inside .snifffr-dp-body--about
	   so the desktop column gets the same layout without depending on the
	   mobile @media block. */
	.snifffr-dp-body--about .snifffr-mp-postform #whats-new-options {
		display: flex !important;
		align-items: center;
		gap: 8px;
		margin-top: 10px;
		padding-top: 10px;
		border-top: 1px solid rgba(78, 60, 110, 0.08);
	}
	.snifffr-dp-body--about .snifffr-mp-postform #whats-new-submit {
		margin-left: auto;
	}
	.snifffr-dp-body--about .snifffr-mp-postform #mpp-activity-upload-buttons,
	.snifffr-dp-body--about .snifffr-mp-postform .mpp-upload-buttons {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		margin: -30px 0px;
	}

	/* ──────────────────────────────────────────────────────────────
	   /messages/ + /notifications/ — mobile-styled BP loops adapted
	   for the desktop redesign body. The notifications-loop.php and
	   messages-loop.php templates already emit `.snifffr-notif-*`
	   and `.snifffr-msg-*` markup; the mobile aesthetic just needs
	   re-applying at the >=992px breakpoint.
	   ────────────────────────────────────────────────────────────── */

	/* Hide the legacy "Notifications:" / "Messages:" h3 that BP can
	   still emit inside #subnav. */
	.snifffr-dp-body--messages #subnav.item-list-tabs > h3,
	.snifffr-dp-body--notifications #subnav.item-list-tabs > h3 {
		display: none;
	}

	/* Sub-tab pill row (Unread/Read for notifications; Inbox/Sentbox/
	   Compose/Starred for messages). Same aesthetic as escrow pills. */
	.snifffr-dp-body--messages #subnav.item-list-tabs,
	.snifffr-dp-body--notifications #subnav.item-list-tabs {
		display: block !important;
		background: transparent !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 0 18px !important;
		overflow: visible !important;
	}
	.snifffr-dp-body--messages #subnav ul,
	.snifffr-dp-body--notifications #subnav ul {
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		gap: 8px !important;
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}
	.snifffr-dp-body--messages #subnav ul li,
	.snifffr-dp-body--notifications #subnav ul li {
		display: block !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		background: transparent !important;
		border: 0 !important;
		flex: 0 0 auto !important;
		width: auto !important;
	}
	.snifffr-dp-body--messages #subnav ul li a,
	.snifffr-dp-body--notifications #subnav ul li a {
		display: inline-flex;
		align-items: center;
		padding: 8px 18px;
		border-radius: 999px;
		background: #fff;
		color: #423e59;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		line-height: 1.2;
		border: 1px solid rgba(66, 62, 89, 0.12);
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
	}
	.snifffr-dp-body--messages #subnav ul li a:hover,
	.snifffr-dp-body--notifications #subnav ul li a:hover {
		background: #eceaf2;
		border-color: rgba(66, 62, 89, 0.22);
	}
	.snifffr-dp-body--messages #subnav ul li.selected a,
	.snifffr-dp-body--messages #subnav ul li.current a,
	.snifffr-dp-body--notifications #subnav ul li.selected a,
	.snifffr-dp-body--notifications #subnav ul li.current a {
		background: #e65c95 !important;
		color: #fff !important;
		border-color: #e65c95 !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}
	/* Hide BP's "Order By" filter LI on these subnavs. */
	.snifffr-dp-body--messages #subnav ul li#members-order-select,
	.snifffr-dp-body--messages #subnav ul li.filter,
	.snifffr-dp-body--notifications #subnav ul li#members-order-select,
	.snifffr-dp-body--notifications #subnav ul li.filter {
		display: none !important;
	}

	/* Messages-only: inbox search box renders inside the subnav block. */
	.snifffr-dp-body--messages .message-search {
		margin: 12px 0 0;
	}
	.snifffr-dp-body--messages .message-search input[type="text"],
	.snifffr-dp-body--messages .message-search input[type="search"] {
		width: 100%;
		max-width: 360px;
		padding: 9px 14px;
		border-radius: 999px;
		border: 1px solid rgba(66, 62, 89, 0.18);
		background: #fff;
		font-size: 13px;
		color: #423e59;
	}

	/* ── Notifications ─────────────────────────────────────────── */
	.snifffr-dp-body--notifications .snifffr-notif-card {
		background: transparent !important;
		padding: 0 !important;
		box-shadow: none !important;
		border: 0 !important;
	}
	/* "Notifications" h4 — redundant with the Unread/Read pill row sitting
	   right above it; hide it. The pills are the contextual title. */
	.snifffr-dp-body--notifications .snifffr-notif-card > h4 {
		display: none !important;
	}
	/* Select-all toolbar — pad the row so the row content lines up with
	   the avatar column below and the checkbox stays clickable. */
	.snifffr-dp-body--notifications .snifffr-notif-toolbar {
		display: flex;
		align-items: center;
		margin: 0 0 12px;
		padding: 0 4px;
		font-size: 12px;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-body--notifications .snifffr-notif-selectall {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		cursor: pointer;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		font-size: 11px;
		color: rgba(66, 62, 89, 0.6);
	}
	.snifffr-dp-body--notifications .snifffr-notif-selectall input {
		accent-color: #e65c95;
		width: 16px;
		height: 16px;
		margin: 0;
	}
	.snifffr-dp-body--notifications .snifffr-notif-list {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	/* Row — softer lavender background. Earlier #eceaf2 read as too dark
	   against the page; lift to #f4f2fb so unread rows whisper rather than
	   shout. Read rows stay white. Hover bumps the lavender a notch. */
	.snifffr-dp-body--notifications .snifffr-notif-item {
		display: grid;
		grid-template-columns: 28px 48px minmax(0, 1fr);
		gap: 14px;
		align-items: center;
		padding: 14px 18px;
		background: #f4f2fb;
		border: 1px solid rgba(66, 62, 89, 0.06);
		border-radius: 12px;
		transition: background 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--notifications .snifffr-notif-item:hover {
		background: #ece8f7;
	}
	.snifffr-dp-body--notifications .snifffr-notif-list--read .snifffr-notif-item {
		background: #fff;
	}
	.snifffr-dp-body--notifications .snifffr-notif-list--read .snifffr-notif-item:hover {
		background: #f7f6fb;
	}
	.snifffr-dp-body--notifications .snifffr-notif-check {
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		padding: 0;
	}
	.snifffr-dp-body--notifications .snifffr-notif-check input {
		width: 18px;
		height: 18px;
		margin: 0;
		accent-color: #e65c95;
	}
	.snifffr-dp-body--notifications .snifffr-notif-avatar {
		width: 48px;
		height: 48px;
		border-radius: 50%;
		overflow: hidden;
		flex-shrink: 0;
	}
	.snifffr-dp-body--notifications .snifffr-notif-avatar img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
		border-radius: 50%;
	}
	.snifffr-dp-body--notifications .snifffr-notif-body {
		min-width: 0;
	}
	.snifffr-dp-body--notifications .snifffr-notif-desc {
		margin: 0 0 2px;
		font-size: 14px;
		line-height: 1.4;
		color: #423e59;
		font-weight: 500;
	}
	.snifffr-dp-body--notifications .snifffr-notif-desc a {
		color: #e65c95;
		text-decoration: none;
		font-weight: 600;
	}
	.snifffr-dp-body--notifications .snifffr-notif-time {
		font-size: 11px;
		color: rgba(66, 62, 89, 0.55);
		letter-spacing: 0.02em;
	}
	/* Action chips. BP's bp_the_notification_action_links() emits the
	   actions separated by " | " text nodes — the pipe characters were
	   showing between Read and the trash icon. Hide them by zeroing the
	   parent's font-size, then restore proper sizing on the chip children.
	   White-space:nowrap on the parent + inline-flex on each anchor stops
	   any pipe leaking back through. */
	.snifffr-dp-body--notifications .snifffr-notif-actions {
		margin-top: 10px;
		display: flex;
		gap: 8px;
		flex-wrap: wrap;
		align-items: center;
		font-size: 0;
		line-height: 0;
	}
	.snifffr-dp-body--notifications .snifffr-notif-actions a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 4px;
		padding: 6px 14px;
		border-radius: 999px;
		background: #fff;
		color: #423e59;
		font-size: 12px;
		font-weight: 600;
		line-height: 1.2;
		text-decoration: none;
		border: 1px solid rgba(66, 62, 89, 0.12);
		transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--notifications .snifffr-notif-actions a.delete {
		padding: 6px 9px;
		background: #fff;
		color: #e65c95;
		border-color: rgba(230, 92, 149, 0.25);
	}
	.snifffr-dp-body--notifications .snifffr-notif-actions a:hover,
	.snifffr-dp-body--notifications .snifffr-notif-actions a:focus {
		background: #e65c95;
		color: #fff !important;
		border-color: #e65c95;
	}
	/* Bulk actions row — match the Mark/Apply button to the brand pink
	   pill aesthetic used elsewhere in the redesign. The legacy WP-admin
	   #doaction default is outlined which looks unfinished. */
	.snifffr-dp-body--notifications .snifffr-notif-bulk {
		margin-top: 20px;
		padding-top: 18px;
		border-top: 1px solid rgba(66, 62, 89, 0.08);
		display: flex;
		gap: 10px;
		align-items: center;
		flex-wrap: wrap;
	}
	.snifffr-dp-body--notifications .snifffr-notif-bulk select {
		max-width: 240px;
		border-radius: 999px;
		border: 1px solid rgba(66, 62, 89, 0.18);
		padding: 9px 16px;
		background: #fff;
		font-size: 13px;
		color: #423e59;
		cursor: pointer;
	}
	.snifffr-dp-body--notifications .snifffr-notif-bulk input[type="submit"],
	.snifffr-dp-body--notifications .snifffr-notif-bulk #doaction {
		background: #e65c95 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		padding: 9px 22px !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		cursor: pointer !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25) !important;
		transition: background 0.15s ease !important;
	}
	.snifffr-dp-body--notifications .snifffr-notif-bulk input[type="submit"]:hover,
	.snifffr-dp-body--notifications .snifffr-notif-bulk #doaction:hover {
		background: #d24a7d !important;
	}
	/* Empty-state CTA. Catches the feedback-no-notifications.php template
	   (renders with `.iu-form-card.snifffr-msg-empty` on both
	   /notifications/ and /messages/ when the user has zero items) AND
	   the level0-only upgrade card paths. text-align:center pulls the
	   h4, copy paragraph, and the inline-block pink pill button into a
	   single centered column. */
	.snifffr-dp-body--notifications .snifffr-notif-empty,
	.snifffr-dp-body--notifications .snifffr-notif-upgrade,
	.snifffr-dp-body--notifications .snifffr-msg-empty,
	.snifffr-dp-body--messages .snifffr-msg-empty,
	.snifffr-dp-body--messages .snifffr-msg-upgrade {
		text-align: center;
		padding: 28px 20px;
		background: #fff;
		border: 1px dashed rgba(66, 62, 89, 0.22);
		border-radius: 12px;
		color: rgba(66, 62, 89, 0.85);
		font-size: 14px;
	}
	.snifffr-dp-body--notifications .snifffr-msg-empty > h4,
	.snifffr-dp-body--messages .snifffr-msg-empty > h4,
	.snifffr-dp-body--messages .snifffr-msg-upgrade > h4 {
		text-align: center;
	}

	/* ── Messages — inbox/sentbox/starred thread list ─────────── */
	.snifffr-dp-body--messages .snifffr-msg-card,
	.snifffr-dp-body--messages .snifffr-msg-thread-card,
	.snifffr-dp-body--messages .snifffr-msg-empty,
	.snifffr-dp-body--messages .snifffr-msg-upgrade {
		background: transparent;
		padding: 0;
		box-shadow: none;
		border: 0;
	}
	/* "Messages" h4 — redundant with the Inbox/Sentbox/Compose pill row.
	   Hide for parity with the notifications card. The empty-state card
	   keeps its h4 — only suppress on the populated inbox card. */
	.snifffr-dp-body--messages .snifffr-msg-card > h4 {
		display: none !important;
	}
	/* Select-all toolbar — mirrors the notifications toolbar typography. */
	.snifffr-dp-body--messages .snifffr-msg-toolbar {
		display: flex;
		align-items: center;
		margin: 0 0 12px;
		padding: 0 4px;
		font-size: 12px;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-body--messages .snifffr-msg-selectall {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		cursor: pointer;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		font-size: 11px;
		color: rgba(66, 62, 89, 0.6);
	}
	.snifffr-dp-body--messages .snifffr-msg-selectall input {
		accent-color: #e65c95;
		width: 16px;
		height: 16px;
		margin: 0;
	}
	/* Compose form — wrap in a clean card with brand chrome. */
	.snifffr-dp-body--messages .snifffr-msg-compose {
		background: #fff !important;
		padding: 28px 32px 32px !important;
		border-radius: 16px !important;
		border: 1px solid rgba(66, 62, 89, 0.08);
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	}
	.snifffr-dp-body--messages .snifffr-msg-compose > h4 {
		margin: 0 0 22px;
		padding: 0;
		font-size: 18px;
		font-weight: 700;
		color: var(--snifffr-mp-purple, #423E59);
		text-transform: none;
		letter-spacing: 0;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .form-group {
		margin: 0 0 18px;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .form-group > label {
		display: block !important;
		margin: 0 0 8px !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		color: rgba(66, 62, 89, 0.7) !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
	}
	/* Plain text inputs + textarea — soft rounded fields. */
	.snifffr-dp-body--messages .snifffr-msg-compose input[type="text"],
	.snifffr-dp-body--messages .snifffr-msg-compose textarea {
		width: 100% !important;
		padding: 12px 14px !important;
		font-size: 14px !important;
		color: #1a1a1a !important;
		background: #fafaff !important;
		border: 1px solid rgba(66, 62, 89, 0.16) !important;
		border-radius: 10px !important;
		box-sizing: border-box !important;
		box-shadow: none !important;
		font-family: inherit !important;
		margin: 0 !important;
		transition: border-color 0.15s ease, background 0.15s ease;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose input[type="text"]:focus,
	.snifffr-dp-body--messages .snifffr-msg-compose textarea:focus {
		outline: none !important;
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		background: #fff !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose textarea {
		min-height: 160px !important;
		resize: vertical !important;
	}
	/* "To" autocomplete — flatten the <ul.acfb-holder> wrapper so the
	   selected-user chip and the text input look like one field. */
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder {
		list-style: none !important;
		margin: 0 !important;
		padding: 4px 6px !important;
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 6px !important;
		align-items: center !important;
		background: #fafaff !important;
		border: 1px solid rgba(66, 62, 89, 0.16) !important;
		border-radius: 10px !important;
		min-height: 48px !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder:focus-within {
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		background: #fff !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder > li {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		display: contents !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder .friend-tab {
		display: inline-flex !important;
		align-items: center !important;
		gap: 6px !important;
		padding: 4px 10px 4px 4px !important;
		background: #faecf2 !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
		border: 1px solid rgba(230, 92, 149, 0.3) !important;
		border-radius: 999px !important;
		font-size: 13px !important;
		font-weight: 600 !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder .friend-tab img {
		width: 22px !important;
		height: 22px !important;
		border-radius: 50% !important;
		object-fit: cover !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder .friend-tab a,
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder .friend-tab .p {
		color: inherit !important;
		text-decoration: none !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder #send-to-input,
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder .send-to-input {
		flex: 1 1 200px !important;
		min-width: 180px !important;
		border: 0 !important;
		background: transparent !important;
		padding: 6px 8px !important;
		font-size: 14px !important;
		box-shadow: none !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .acfb-holder #send-to-input:focus {
		outline: none !important;
		background: transparent !important;
	}
	/* Sitewide-notice toggle — moderator only. */
	.snifffr-dp-body--messages .snifffr-msg-compose-notice {
		display: flex !important;
		align-items: center !important;
		gap: 8px !important;
		margin: 0 0 18px !important;
		font-size: 13px !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		cursor: pointer !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose-notice input[type="checkbox"] {
		accent-color: var(--snifffr-mp-pink, #E65C95) !important;
		width: 16px !important;
		height: 16px !important;
	}
	/* Attachment block — restyle the buddypress-message-attachment plupload
	   widget so the "Choose file" button matches the redesign. */
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper {
		margin: 8px 0 22px !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper > label,
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper > .snifffr-msg-compose-attach-label {
		display: block !important;
		margin: 0 0 8px !important;
		font-size: 12px !important;
		font-weight: 600 !important;
		color: rgba(66, 62, 89, 0.7) !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper small,
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper em {
		display: block !important;
		margin: 0 0 10px !important;
		font-size: 12px !important;
		color: rgba(66, 62, 89, 0.65) !important;
		font-style: normal !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose #btn_msgat_upload,
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper button {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 9px 18px !important;
		border-radius: 999px !important;
		background: #fff !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		border: 1px solid rgba(66, 62, 89, 0.18) !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		box-shadow: none !important;
		cursor: pointer !important;
		transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose #btn_msgat_upload:hover,
	.snifffr-dp-body--messages .snifffr-msg-compose .bp_msgat_ui_wrapper button:hover {
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
		background: #faecf2 !important;
	}
	/* Submit row + pink Send pill. */
	.snifffr-dp-body--messages .snifffr-msg-compose-submit {
		margin-top: 8px !important;
		display: flex !important;
		justify-content: flex-end !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .snifffr-msg-compose-btn,
	.snifffr-dp-body--messages .snifffr-msg-compose button[type="submit"][name="send"] {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 12px 28px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		outline: 0 !important;
		border-radius: 999px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		letter-spacing: 0.2px !important;
		text-transform: none !important;
		cursor: pointer !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
		transition: background 0.15s ease, transform 0.05s ease !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .snifffr-msg-compose-btn:focus,
	.snifffr-dp-body--messages .snifffr-msg-compose .snifffr-msg-compose-btn:focus-visible,
	.snifffr-dp-body--messages .snifffr-msg-compose button[type="submit"][name="send"]:focus,
	.snifffr-dp-body--messages .snifffr-msg-compose button[type="submit"][name="send"]:focus-visible {
		outline: 0 !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .snifffr-msg-compose-btn:hover,
	.snifffr-dp-body--messages .snifffr-msg-compose button[type="submit"][name="send"]:hover {
		background: #d24a7d !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-compose .snifffr-msg-compose-btn:active,
	.snifffr-dp-body--messages .snifffr-msg-compose button[type="submit"][name="send"]:active {
		transform: translateY(1px);
	}
	.snifffr-dp-body--messages .snifffr-msg-compose-locked {
		padding: 24px;
		text-align: center;
		background: #faecf2;
		border-radius: 12px;
		color: var(--snifffr-mp-pink, #E65C95);
		font-weight: 600;
	}

	.snifffr-dp-body--messages .snifffr-msg-list,
	.snifffr-dp-body--messages #message-threads {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread,
	.snifffr-dp-body--messages #message-threads > li {
		display: flex;
		align-items: center;
		gap: 14px;
		padding: 14px 18px;
		background: #fff;
		border: 1px solid rgba(66, 62, 89, 0.06);
		border-radius: 12px;
		cursor: pointer;
		transition: background-color 0.15s ease, border-color 0.15s ease;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread:hover,
	.snifffr-dp-body--messages #message-threads > li:hover {
		background: #f7f6fb;
	}
	/* Softer lavender for unread — matches the notifications unread row.
	   Was #eceaf2 (too heavy); #f4f2fb whispers instead of shouts. */
	.snifffr-dp-body--messages .snifffr-msg-thread.is-unread {
		background: #f4f2fb;
		border-color: rgba(66, 62, 89, 0.08);
	}
	.snifffr-dp-body--messages .snifffr-msg-thread.is-unread:hover {
		background: #ece8f7;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread-link {
		display: contents !important;
		text-decoration: none !important;
		color: inherit !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-check {
		display: flex;
		align-items: center;
		cursor: pointer;
	}
	.snifffr-dp-body--messages .snifffr-msg-check input {
		width: 18px;
		height: 18px;
		margin: 0;
		accent-color: #e65c95;
	}
	.snifffr-dp-body--messages .snifffr-msg-avatar {
		flex: 0 0 48px;
		width: 48px;
		height: 48px;
	}
	.snifffr-dp-body--messages .snifffr-msg-avatar img {
		width: 48px;
		height: 48px;
		border-radius: 50%;
		object-fit: cover;
		display: block;
		border: 0;
	}
	.snifffr-dp-body--messages .snifffr-msg-body {
		flex: 1 1 0;
		min-width: 0;
		overflow: hidden;
		text-align: left;
	}
	.snifffr-dp-body--messages .snifffr-msg-row1 {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 8px;
		margin: 0 0 4px;
		line-height: 1.3;
	}
	.snifffr-dp-body--messages .snifffr-msg-from {
		font-size: 14px;
		font-weight: 600;
		color: #423e59;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.snifffr-dp-body--messages .snifffr-msg-from a {
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dp-body--messages .snifffr-msg-time {
		font-size: 11px;
		color: rgba(66, 62, 89, 0.7);
		white-space: nowrap;
		flex-shrink: 0;
	}
	.snifffr-dp-body--messages .snifffr-msg-subject {
		font-size: 14px;
		font-weight: 600;
		color: #423e59;
		line-height: 1.3;
		margin: 0 0 4px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread.is-unread .snifffr-msg-subject {
		color: #e65c95;
	}
	.snifffr-dp-body--messages .snifffr-msg-count {
		font-size: 11px;
		color: rgba(66, 62, 89, 0.7);
		margin-left: 4px;
		font-weight: 500;
	}
	.snifffr-dp-body--messages .snifffr-msg-excerpt {
		margin: 0;
		font-size: 12.5px;
		color: rgba(66, 62, 89, 0.7);
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.snifffr-dp-body--messages .snifffr-msg-actions {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-end;
		gap: 6px;
		flex-shrink: 0;
	}
	.snifffr-dp-body--messages .snifffr-msg-action {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 28px;
		height: 28px;
		padding: 0 10px;
		border-radius: 999px;
		font-size: 11px;
		font-weight: 600;
		line-height: 1;
		text-decoration: none !important;
		background: #fff;
		color: #423e59;
		border: 1px solid rgba(66, 62, 89, 0.22);
		white-space: nowrap;
	}
	.snifffr-dp-body--messages .snifffr-msg-action--delete {
		width: 28px;
		padding: 0;
		color: #e65c95;
		border-color: rgba(230, 92, 149, 0.25);
		background: rgba(230, 92, 149, 0.06);
	}
	.snifffr-dp-body--messages .snifffr-msg-action--delete svg {
		width: 14px;
		height: 14px;
	}
	.snifffr-dp-body--messages .snifffr-msg-star {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		border-radius: 999px;
		border: 1px solid rgba(66, 62, 89, 0.22);
		background: #fff;
	}
	.snifffr-dp-body--messages .snifffr-msg-star a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		color: rgba(66, 62, 89, 0.7);
		text-decoration: none !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-star a.starred {
		color: #e65c95;
	}
	.snifffr-dp-body--messages .snifffr-msg-pagination {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		margin-top: 14px;
		padding-top: 14px;
		border-top: 1px solid rgba(66, 62, 89, 0.22);
		font-size: 12px;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-body--messages .snifffr-msg-pagination a {
		color: #e65c95;
		text-decoration: none;
		font-weight: 600;
	}
	/* Bulk actions — match the notifications bulk row. Pink-pill APPLY,
	   pill-shaped select. */
	.snifffr-dp-body--messages .snifffr-msg-bulk {
		margin-top: 20px;
		padding-top: 18px;
		border-top: 1px solid rgba(66, 62, 89, 0.08);
		display: flex;
		gap: 10px;
		align-items: center;
		flex-wrap: wrap;
	}
	.snifffr-dp-body--messages .snifffr-msg-bulk select {
		max-width: 240px;
		border-radius: 999px;
		border: 1px solid rgba(66, 62, 89, 0.18);
		padding: 9px 16px;
		background: #fff;
		font-size: 13px;
		color: #423e59;
		cursor: pointer;
	}
	.snifffr-dp-body--messages .snifffr-msg-bulk input[type="submit"],
	.snifffr-dp-body--messages .snifffr-msg-bulk #messages-bulk-manage,
	.snifffr-dp-body--messages .snifffr-msg-bulk #doaction {
		background: #e65c95 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		padding: 9px 22px !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		cursor: pointer !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25) !important;
		transition: background 0.15s ease !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-bulk input[type="submit"]:hover,
	.snifffr-dp-body--messages .snifffr-msg-bulk #messages-bulk-manage:hover,
	.snifffr-dp-body--messages .snifffr-msg-bulk #doaction:hover {
		background: #d24a7d !important;
	}

	/* ── Messages — single thread view ─────────────────────────── */
	.snifffr-dp-body--messages .snifffr-msg-thread-header {
		margin-bottom: 16px;
		padding-bottom: 14px;
		border-bottom: 1px solid rgba(66, 62, 89, 0.22);
	}
	.snifffr-dp-body--messages #message-subject {
		margin: 0 0 4px;
		font-size: 18px;
		font-weight: 700;
		color: #423e59;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread-recipients {
		margin: 0 0 8px;
		font-size: 12px;
		color: rgba(66, 62, 89, 0.7);
	}
	.snifffr-dp-body--messages .snifffr-msg-thread-recipients a {
		color: #e65c95;
		text-decoration: none;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble-row {
		display: flex;
		margin: 0 0 12px;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble-row--mine {
		justify-content: flex-end;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble {
		max-width: 70%;
		padding: 12px 16px;
		border-radius: 16px;
		background: #eceaf2;
		color: #423e59;
		font-size: 14px;
		line-height: 1.45;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble-row--mine .snifffr-msg-bubble {
		background: #e65c95;
		color: #fff;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble-row--mine .snifffr-msg-bubble a {
		color: #fff;
		text-decoration: underline;
	}
	.snifffr-dp-body--messages .snifffr-msg-bubble-meta {
		display: block;
		margin-top: 4px;
		font-size: 11px;
		opacity: 0.75;
	}

	/* Compose form */
	.snifffr-dp-body--messages #send_message_form,
	.snifffr-dp-body--messages .snifffr-msg-reply-form {
		margin-top: 16px;
	}
	.snifffr-dp-body--messages #send_message_form label,
	.snifffr-dp-body--messages .snifffr-msg-reply-form label {
		display: block;
		margin: 0 0 6px;
		font-size: 12px;
		font-weight: 600;
		color: rgba(66, 62, 89, 0.7);
		text-transform: uppercase;
		letter-spacing: 0.04em;
	}
	.snifffr-dp-body--messages #send_message_form input[type="text"],
	.snifffr-dp-body--messages #send_message_form textarea,
	.snifffr-dp-body--messages .snifffr-msg-reply-form input[type="text"],
	.snifffr-dp-body--messages .snifffr-msg-reply-form textarea {
		width: 100%;
		padding: 10px 14px;
		border-radius: 12px;
		border: 1px solid rgba(66, 62, 89, 0.22);
		background: #fff;
		font-size: 14px;
		color: #423e59;
		font-family: inherit;
		margin-bottom: 14px;
	}
	.snifffr-dp-body--messages #send_message_form textarea,
	.snifffr-dp-body--messages .snifffr-msg-reply-form textarea {
		min-height: 120px;
		resize: vertical;
	}
	.snifffr-dp-body--messages #send_message_form button[type="submit"],
	.snifffr-dp-body--messages #send_message_form input[type="submit"],
	.snifffr-dp-body--messages .snifffr-msg-reply-form button[type="submit"],
	.snifffr-dp-body--messages .snifffr-msg-reply-form input[type="submit"] {
		background: #e65c95;
		color: #fff;
		border: 0;
		border-radius: 999px;
		padding: 10px 22px;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.3px;
		text-transform: uppercase;
		cursor: pointer;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}

	/* Message reply view (single thread): Choose file = outlined pill, Send reply = solid pink pill. */
	.snifffr-dp-body--messages #btn_msgat_upload,
	.snifffr-dp-body--messages .bp_msgat_ui_wrapper button {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 9px 18px !important;
		border-radius: 999px !important;
		background: #fff !important;
		color: var(--snifffr-mp-purple, #423E59) !important;
		border: 1px solid rgba(66, 62, 89, 0.18) !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		box-shadow: none !important;
		cursor: pointer !important;
		transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
	}
	.snifffr-dp-body--messages #btn_msgat_upload:hover,
	.snifffr-dp-body--messages .bp_msgat_ui_wrapper button:hover {
		border-color: var(--snifffr-mp-pink, #E65C95) !important;
		color: var(--snifffr-mp-pink, #E65C95) !important;
		background: #faecf2 !important;
	}
	.snifffr-dp-body--messages .snifffr-msg-reply-submit {
		margin-top: 8px !important;
	}
	.snifffr-dp-body--messages #send_reply_button,
	.snifffr-dp-body--messages .snifffr-msg-reply-btn {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 12px 28px !important;
		background: var(--snifffr-mp-pink, #E65C95) !important;
		color: #fff !important;
		border: 0 !important;
		outline: 0 !important;
		border-radius: 999px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		letter-spacing: 0.2px !important;
		text-transform: uppercase !important;
		cursor: pointer !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
		transition: background 0.15s ease, transform 0.05s ease !important;
	}
	.snifffr-dp-body--messages #send_reply_button:hover,
	.snifffr-dp-body--messages .snifffr-msg-reply-btn:hover {
		background: #d24a7d !important;
	}
	.snifffr-dp-body--messages #send_reply_button:active,
	.snifffr-dp-body--messages .snifffr-msg-reply-btn:active {
		transform: translateY(1px);
	}
	.snifffr-dp-body--messages #send_reply_button:focus,
	.snifffr-dp-body--messages #send_reply_button:focus-visible,
	.snifffr-dp-body--messages .snifffr-msg-reply-btn:focus,
	.snifffr-dp-body--messages .snifffr-msg-reply-btn:focus-visible {
		outline: 0 !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.28) !important;
	}

	/* Thread row links — sender name etc. in the inbox/list must be pink. */
	.snifffr-dp-body--messages .snifffr-msg-thread a {
		color: #e65c95 !important;
		text-decoration: none;
	}
	.snifffr-dp-body--messages .snifffr-msg-thread a:hover,
	.snifffr-dp-body--messages .snifffr-msg-thread a:focus {
		color: #d24a7d !important;
		text-decoration: none;
	}

	/* Empty / upgrade states */
	.snifffr-dp-body--messages .snifffr-msg-empty,
	.snifffr-dp-body--messages .snifffr-msg-upgrade,
	.snifffr-dp-body--notifications .snifffr-notif-upgrade {
		text-align: center;
		padding: 28px 20px;
		background: #fff;
		border: 1px dashed rgba(66, 62, 89, 0.22);
		border-radius: 12px;
		color: rgba(66, 62, 89, 0.85);
		font-size: 14px;
	}
	.snifffr-dp-body--messages .snifffr-msg-upgrade a,
	.snifffr-dp-body--notifications .snifffr-notif-upgrade a {
		display: inline-flex;
		margin-top: 10px;
		padding: 10px 22px;
		border-radius: 999px;
		background: #e65c95;
		color: #fff !important;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.3px;
		text-transform: uppercase;
		text-decoration: none !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}

	/* =====================================================================
	   Gallery CREATE form (/mediapress/create/) — desktop redesign.

	   The form template (mediapress/default/gallery/create.php) already
	   renders the mobile-styled tile selector (.snifffr-mp-gallery-type-tiles)
	   plus the legacy <select> (.mpp-editable-gallery-type). At mobile widths
	   snifffr-mobile-redesign.css hides the dropdown and pinks-up the rest.
	   At >=992px the mobile rules don't apply, so the page falls back to
	   legacy MPP styling — tiles + dropdown rendered side-by-side, default
	   submit button, default inputs. Re-apply the same aesthetic for desktop
	   beta users by cloning the mobile rule shape into this scope.
	   ===================================================================== */
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap {
		--snifffr-mp-purple:    #423E59;
		--snifffr-mp-purple-60: rgba(66, 62, 89, 0.6);
		--snifffr-mp-purple-08: rgba(66, 62, 89, 0.22);
		--snifffr-mp-pink:      #E65C95;
		--snifffr-mp-pink-soft: #FFC8E6;
		--snifffr-mp-lavender:  #ECEAF2;
		color: var(--snifffr-mp-purple);
		font-size: 14px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .iu-form-card h4 {
		font-size: 14px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: var(--snifffr-mp-purple);
		margin: 0 0 20px;
	}

	/* Photo / Video tile selector — visual replacement for the type <select>. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tiles {
		display: grid;
		grid-template-columns: repeat(2, minmax(160px, 220px));
		gap: 12px;
		margin: 0 0 22px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tiles:has(.snifffr-mp-gallery-type-tile:nth-child(3)) {
		grid-template-columns: repeat(3, minmax(160px, 220px));
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tile {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding: 22px 14px;
		background: #fff;
		border: 1.5px solid rgba(66, 62, 89, 0.18);
		border-radius: 14px;
		color: var(--snifffr-mp-purple);
		font-family: inherit;
		font-size: 13px;
		font-weight: 600;
		cursor: pointer;
		appearance: none;
		-webkit-appearance: none;
		transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tile:hover {
		border-color: rgba(230, 92, 149, 0.4);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tile .snifffr-mp-gallery-type-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		background: var(--snifffr-mp-lavender);
		color: var(--snifffr-mp-purple);
		transition: background 0.15s ease, color 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tile.is-selected {
		border-color: var(--snifffr-mp-pink);
		background: linear-gradient(135deg, #fff 0%, var(--snifffr-mp-pink-soft) 100%);
		color: var(--snifffr-mp-purple);
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.15);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-type-tile.is-selected .snifffr-mp-gallery-type-icon {
		background: var(--snifffr-mp-pink);
		color: #fff;
	}

	/* Hide the legacy <select> — tiles drive it via JS. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-editable-gallery-type {
		display: none !important;
	}

	/* Flatten the legacy mpp-* layout grid so fields stack full-width. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-g .mpp-u-1-2,
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-g .mpp-u-1-1 {
		width: 100% !important;
		margin: 0 0 16px !important;
		float: none !important;
		padding: 0 !important;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap label {
		display: block;
		font-size: 12px;
		font-weight: 600;
		color: var(--snifffr-mp-purple-60);
		text-transform: uppercase;
		letter-spacing: 0.04em;
		margin-bottom: 8px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap input[type="text"],
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap textarea,
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap select {
		width: 100%;
		padding: 12px 14px;
		border: 1px solid rgba(66, 62, 89, 0.18);
		border-radius: 10px;
		background: #fff;
		color: var(--snifffr-mp-purple);
		font-family: inherit;
		font-size: 14px;
		line-height: 1.4;
		box-sizing: border-box;
		appearance: none;
		-webkit-appearance: none;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap input[type="text"]:focus,
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap textarea:focus,
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap select:focus {
		outline: none;
		border-color: var(--snifffr-mp-pink);
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.15);
	}

	/* Submit button — pink primary, matches the rest of the redesign. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-submit-button {
		margin-top: 10px !important;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-create-gallery-button {
		width: 100% !important;
		float: none !important;
		margin: 0 !important;
		padding: 14px 16px !important;
		background: var(--snifffr-mp-pink) !important;
		border: 0 !important;
		border-radius: 12px !important;
		color: #fff !important;
		font-family: inherit !important;
		font-size: 15px !important;
		font-weight: 600 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		cursor: pointer;
		box-shadow: 0 6px 18px rgba(230, 92, 149, 0.25);
		transition: opacity 0.15s ease, transform 0.05s ease;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-create-gallery-button:hover,
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-create-gallery-button:focus {
		background: var(--snifffr-mp-pink) !important;
		color: #fff !important;
		opacity: 0.95;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-form-wrap .mpp-create-gallery-button:active {
		transform: translateY(1px);
	}

	/* (mpp-gallery-admin-menu hide moved to file root so it applies at every
	   viewport — see bottom of file.) */

	/* Post-action toast ("Deleted.", "Saved.", etc) — MediaPress's mpp.notify()
	   prints a bare red-bordered <div id="mpp-notice-message"> at the top of
	   #mpp-container. Soften it to a rounded lavender card so it looks like
	   it belongs in the redesign. .error gets a pink tint. */
	body.snifffr-desktop-beta #mpp-notice-message {
		margin: 0 0 16px !important;
		padding: 14px 18px !important;
		border: 0 !important;
		border-radius: 12px !important;
		background: #ECEAF2 !important;
		color: #423E59 !important;
		font-size: 14px !important;
		font-weight: 500 !important;
		box-shadow: 0 4px 14px rgba(66, 62, 89, 0.06) !important;
		animation: snifffr-dp-notice-in 0.2s ease-out;
	}
	body.snifffr-desktop-beta #mpp-notice-message.error {
		background: rgba(230, 92, 149, 0.12) !important;
		color: #E65C95 !important;
	}
	body.snifffr-desktop-beta #mpp-notice-message p {
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		background-color: transparent !important;
		border: 0 !important;
		color: inherit !important;
		font-size: inherit !important;
		line-height: 1.4 !important;
	}
	@keyframes snifffr-dp-notice-in {
		from { opacity: 0; transform: translateY(-4px); }
		to   { opacity: 1; transform: translateY(0); }
	}

	/* =====================================================================
	   Gallery ADD MEDIA / Edit screen (/mediapress/{slug}/manage/add/).

	   The theme override mediapress/default/gallery/manage/upload-form.php
	   wraps the dropzone, existing-media grid and remote-URL row in
	   `.snifffr-mp-gallery-upload`. As with the create form, the mobile CSS
	   covers <992px only — at desktop widths it falls back to legacy plupload
	   chrome (a flat dotted box with a bare grey button). Mirror the mobile
	   look at >=992px.
	   ===================================================================== */
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit {
		--snifffr-mp-purple:    #423E59;
		--snifffr-mp-purple-60: rgba(66, 62, 89, 0.6);
		--snifffr-mp-purple-08: rgba(66, 62, 89, 0.22);
		--snifffr-mp-pink:      #E65C95;
		--snifffr-mp-pink-soft: #FFC8E6;
		--snifffr-mp-lavender:  #ECEAF2;
		color: var(--snifffr-mp-purple);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit h4 {
		font-size: 14px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		margin: 0 0 18px;
		color: var(--snifffr-mp-purple);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit h5 {
		font-size: 13px;
		font-weight: 600;
		color: var(--snifffr-mp-purple-60);
		text-transform: uppercase;
		letter-spacing: 0.04em;
		margin: 24px 0 10px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit .form-group {
		margin-bottom: 14px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit .form-group label {
		display: block;
		font-size: 12px;
		font-weight: 600;
		color: var(--snifffr-mp-purple-60);
		text-transform: uppercase;
		letter-spacing: 0.04em;
		margin-bottom: 8px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit .form-group input[type="text"] {
		width: 100%;
		padding: 12px 14px;
		border: 1px solid rgba(66, 62, 89, 0.18);
		border-radius: 10px;
		background: #fff;
		color: var(--snifffr-mp-purple);
		font-family: inherit;
		font-size: 14px;
		box-sizing: border-box;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit .form-group input[type="text"]:focus {
		outline: none;
		border-color: var(--snifffr-mp-pink);
		box-shadow: 0 0 0 3px rgba(230, 92, 149, 0.15);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit-save {
		margin-top: 10px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit-save-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 10px 22px;
		background: var(--snifffr-mp-pink);
		border: 0;
		border-radius: 999px;
		color: #fff;
		font-family: inherit;
		font-size: 13px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		cursor: pointer;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit-media-hint {
		font-size: 12px;
		color: var(--snifffr-mp-purple-60);
		margin: 0 0 12px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-edit-add-typehint {
		font-size: 12px;
		color: var(--snifffr-mp-purple-60);
		margin: 0 0 10px;
	}

	/* Dropzone — bigger, friendlier hit target on desktop. plupload renders
	   #mpp-upload-dropzone-gallery; the legacy .mpp-dropzone wraps it. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload {
		margin-top: 4px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-dropzone,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-dropzone-gallery {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		min-height: 220px;
		padding: 36px 24px;
		border: 2px dashed rgba(66, 62, 89, 0.22);
		border-radius: 16px;
		background: linear-gradient(180deg, #fff 0%, #FAF8FC 100%);
		text-align: center;
		transition: border-color 0.15s ease, background 0.15s ease;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-dropzone:hover,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-dropzone-gallery:hover,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-dropzone.drag-over,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-dropzone-gallery.drag-over {
		border-color: var(--snifffr-mp-pink);
		background: linear-gradient(180deg, #fff 0%, #FFF1F8 100%);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-inside {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		margin: 0;
		padding: 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-info {
		font-size: 16px;
		font-weight: 600;
		color: var(--snifffr-mp-purple);
		margin: 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-inside p:not(.mpp-drag-drop-info):not(.mpp-drag-drop-buttons) {
		font-size: 13px;
		color: var(--snifffr-mp-purple-60);
		margin: 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-buttons {
		margin: 4px 0 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-buttons .mpp-button,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-buttons input[type="button"],
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-drag-drop-buttons button,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-dropzone-gallery .browser,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-dropzone-gallery .browser input[type="button"] {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 12px 28px !important;
		background: var(--snifffr-mp-pink) !important;
		border: 0 !important;
		border-radius: 999px !important;
		color: #fff !important;
		font-family: inherit !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase !important;
		letter-spacing: 0.04em !important;
		cursor: pointer !important;
		box-shadow: 0 6px 18px rgba(230, 92, 149, 0.25) !important;
		text-shadow: none !important;
		height: auto !important;
		line-height: 1 !important;
	}

	/* Existing-media tiles + plupload's uploaded-media list. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] ul {
		list-style: none;
		margin: 0 0 16px;
		padding: 0;
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
		gap: 10px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li {
		position: relative;
		list-style: none;
		border-radius: 12px;
		overflow: hidden;
		background: var(--snifffr-mp-lavender);
		aspect-ratio: 1 / 1;
		/* Reorder ergonomics: signal draggability with the grab cursor on
		   the existing-media grid (the empty list for newly-uploaded items
		   inherits the same rule, harmlessly). user-select stops text
		   selection mid-drag; touch-action: none lets the pointermove
		   preventDefault take over from native panning. */
		cursor: grab;
		-webkit-user-select: none;
		user-select: none;
		touch-action: none;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li.is-dragging,
	body.snifffr-desktop-beta .snifffr-reorder-ghost {
		cursor: grabbing;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li.is-dragging {
		opacity: 0.4;
	}
	body.snifffr-desktop-beta .snifffr-reorder-ghost {
		box-shadow: 0 12px 28px rgba(66, 62, 89, 0.25);
		border-radius: 12px;
		overflow: hidden;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li img,
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li video {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li .mpp-delete-uploaded-media-item {
		position: absolute;
		top: 8px;
		right: 8px;
		width: 26px;
		height: 26px;
		border-radius: 50%;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		background: rgba(66, 62, 89, 0.85) !important;
		background-image: none !important;
		text-indent: 0 !important;
		color: #fff !important;
		font-size: 18px !important;
		line-height: 1 !important;
		font-weight: 600;
		text-align: center;
		text-decoration: none !important;
		cursor: pointer;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
		z-index: 2;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload [id^="mpp-uploaded-media-list-"] li .mpp-delete-uploaded-media-item:hover {
		background: var(--snifffr-mp-pink) !important;
	}

	/* Feedback (errors / quota). */
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-feedback-gallery {
		margin: 12px 0 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-feedback-gallery ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload #mpp-upload-feedback-gallery li {
		background: var(--snifffr-mp-lavender);
		color: var(--snifffr-mp-purple);
		padding: 10px 14px;
		border-radius: 10px;
		font-size: 13px;
		margin: 0 0 6px;
	}

	/* Remote-URL row. */
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-remote-media-container {
		margin-top: 22px;
		padding-top: 22px;
		border-top: 1px solid var(--snifffr-mp-purple-08);
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-remote-add-media-row {
		display: flex;
		gap: 10px;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-remote-media-url {
		flex: 1;
		padding: 12px 14px !important;
		border: 1px solid rgba(66, 62, 89, 0.18) !important;
		border-radius: 10px !important;
		background: #fff !important;
		color: var(--snifffr-mp-purple) !important;
		font-family: inherit !important;
		font-size: 14px !important;
	}
	body.snifffr-desktop-beta .snifffr-mp-gallery-upload .mpp-add-remote-media {
		background: var(--snifffr-mp-pink) !important;
		border: 0 !important;
		border-radius: 10px !important;
		color: #fff !important;
		font-family: inherit !important;
		font-size: 14px !important;
		font-weight: 600 !important;
		padding: 0 22px !important;
		cursor: pointer !important;
	}

	/* ── /shop/ seller mini-avatar (`.item-avatar`) ─────────────────
	   Same pattern as the mobile rule (snifffr-mobile-redesign.css:10261)
	   which is gated to <992px and so doesn't apply here. `filter: blur()`
	   on the img bleeds outside its border-radius — `overflow: hidden` on
	   the wrapper clips the halo to a clean circle, and the lavender
	   background fills any transparent edges so the avatar reads as a
	   tidy round portrait, not a smudge. */
	body.snifffr-desktop-beta .shop-item-list .shop-item .shophead .item-avatar,
	body.snifffr-desktop-beta .shop-item .shophead .item-avatar,
	body.snifffr-desktop-beta .shop-item .item-avatar {
		flex: 0 0 auto !important;
		display: inline-block !important;
		width: 32px !important;
		height: 32px !important;
		border-radius: 50% !important;
		overflow: hidden !important;
		background: var(--snifffr-mp-lavender, #efeaff) !important;
		vertical-align: middle !important;
		position: relative !important;
	}
	body.snifffr-desktop-beta .shop-item-list .shop-item .shophead .item-avatar img,
	body.snifffr-desktop-beta .shop-item .shophead .item-avatar img,
	body.snifffr-desktop-beta .shop-item .item-avatar img,
	body.snifffr-desktop-beta .shop-item .item-avatar img.avatar {
		width: 100% !important;
		height: 100% !important;
		border-radius: 50% !important;
		object-fit: cover !important;
		display: block !important;
		margin: 0 !important;
		border: 0 !important;
		transform: scale(1.1) !important;
	}

	/* ── /shop/ pagination ──────────────────────────────────────────
	   `paginate_links()` is wrapped in <div class="pagshop"> inside
	   .shop-item-list (functions/shop-shortcode.php:528). Mobile already
	   has these pills at <992px (snifffr-mobile-redesign.css:10377+);
	   port the same look to >=992px so the page reads as one system. */
	body.snifffr-desktop-beta .shop-item-list .pagshop,
	body.snifffr-desktop-beta .shop .pagshop,
	body.snifffr-desktop-beta.page .pagshop {
		text-align: center !important;
		background: transparent !important;
		border: 0 !important;
		padding: 18px 0 6px !important;
		margin: 16px 0 0 !important;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 8px;
		clear: both;
	}
	body.snifffr-desktop-beta .shop-item-list .pagshop a,
	body.snifffr-desktop-beta .shop-item-list .pagshop span,
	body.snifffr-desktop-beta .shop .pagshop a,
	body.snifffr-desktop-beta .shop .pagshop span,
	body.snifffr-desktop-beta.page .pagshop a,
	body.snifffr-desktop-beta.page .pagshop span {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		min-width: 38px;
		height: 38px;
		padding: 0 12px !important;
		border-radius: 999px !important;
		background: #fff !important;
		border: 1px solid rgba(66, 62, 89, 0.10) !important;
		color: #423E59 !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		line-height: 1 !important;
		margin: 0 !important;
		box-shadow: 0 1px 2px rgba(66, 62, 89, 0.04);
		transition: border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
	}
	body.snifffr-desktop-beta .shop-item-list .pagshop a:hover,
	body.snifffr-desktop-beta .shop .pagshop a:hover,
	body.snifffr-desktop-beta.page .pagshop a:hover {
		border-color: #E65C95 !important;
		color: #E65C95 !important;
		transform: translateY(-1px);
	}
	body.snifffr-desktop-beta .shop-item-list .pagshop .current,
	body.snifffr-desktop-beta .shop-item-list .pagshop span.current,
	body.snifffr-desktop-beta .shop-item-list .pagshop span.page-numbers.current,
	body.snifffr-desktop-beta .shop .pagshop .current,
	body.snifffr-desktop-beta .shop .pagshop span.page-numbers.current,
	body.snifffr-desktop-beta.page .pagshop .current,
	body.snifffr-desktop-beta.page .pagshop span.page-numbers.current {
		background: #E65C95 !important;
		border-color: #E65C95 !important;
		color: #fff !important;
		box-shadow: 0 2px 6px rgba(230, 92, 149, 0.28);
	}
	/* "…" — passive, not button-styled. */
	body.snifffr-desktop-beta .shop-item-list .pagshop .dots,
	body.snifffr-desktop-beta .shop-item-list .pagshop span.page-numbers.dots,
	body.snifffr-desktop-beta .shop .pagshop .dots,
	body.snifffr-desktop-beta.page .pagshop .dots {
		background: transparent !important;
		border-color: transparent !important;
		box-shadow: none !important;
		color: #423E59 !important;
		opacity: 0.5;
	}
	/* Prev / Next — pink accent so they read as primary controls. */
	body.snifffr-desktop-beta .shop-item-list .pagshop a.prev,
	body.snifffr-desktop-beta .shop-item-list .pagshop a.next,
	body.snifffr-desktop-beta .shop .pagshop a.prev,
	body.snifffr-desktop-beta .shop .pagshop a.next,
	body.snifffr-desktop-beta.page .pagshop a.prev,
	body.snifffr-desktop-beta.page .pagshop a.next {
		padding: 0 16px !important;
		color: #E65C95 !important;
		border-color: #E65C95 !important;
	}

	/* /settings/notifications/ — iOS-style toggle switches. The
	   snifffr-mobile-settings.php JS shims native radios into
	   `.snifffr-mps-switch` buttons; the styling for those lives inside
	   snifffr-mobile-redesign.css's @media (max-width: 991.98px) block
	   so on desktop the switch falls back to a default native button
	   appearance. Duplicate the mobile aesthetic here so desktop-beta
	   users see the same iOS pill — grey when off, pink-soft when on. */
	body.snifffr-desktop-beta .snifffr-mps-switch {
		position: relative;
		flex: 0 0 auto;
		width: 50px;
		height: 30px;
		padding: 0;
		border: 0;
		border-radius: 999px;
		background: #d6d3dc;
		cursor: pointer;
		transition: background-color .2s ease;
		-webkit-tap-highlight-color: transparent;
		appearance: none;
		-webkit-appearance: none;
	}
	body.snifffr-desktop-beta .snifffr-mps-switch:focus-visible {
		outline: 2px solid #423e59;
		outline-offset: 2px;
	}
	body.snifffr-desktop-beta .snifffr-mps-switch::after {
		content: "";
		position: absolute;
		top: 3px;
		left: 3px;
		width: 24px;
		height: 24px;
		background: #fff;
		border-radius: 50%;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
		transition: transform .2s ease;
	}
	body.snifffr-desktop-beta .snifffr-mps-switch.is-on {
		background: #FFC8E6;
	}
	body.snifffr-desktop-beta .snifffr-mps-switch.is-on::after {
		transform: translateX(20px);
	}

	/* /settings/delete-account/ — intro warning card. Same parchment-tone
	   pattern as the mobile shell (snifffr-mobile-redesign.css:1585) so
	   desktop-beta sees the same "this is destructive" framing instead of
	   the bare paragraph. */
	body.snifffr-desktop-beta .snifffr-mps-delete-intro {
		background: #fffaef;
		border: 1px solid #f3e3b6;
		padding: 14px 16px;
		border-radius: 14px;
		text-align: center;
		margin-bottom: 30px;
	}

	/* "Upgrade to Premium" CTA on the Instant Media + Private Content
	   subscriber upsell cards. Custom.css:14849 only paints the pink
	   fill — Bootstrap's default 4px radius makes it read as a square
	   block against the rest of the redesign's 999px pill CTAs. Match
	   the rest of the brand pill pattern (padding, radius, shadow,
	   hover lift). */
	body.snifffr-desktop-beta .iu-upsell-btn {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		padding: 12px 28px !important;
		border-radius: 999px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		letter-spacing: 0 !important;
		text-decoration: none !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
		transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .iu-upsell-btn:hover,
	body.snifffr-desktop-beta .iu-upsell-btn:focus {
		background-color: #d24a7d !important;
		border-color: #d24a7d !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.32);
		transform: translateY(-1px);
	}

	/* /shop/ — ".oneitemupshop" upsell card shown to basic sellers who
	   have hit the 1-listing free-tier cap. Legacy .btn.btn-outline-primary
	   on the CTA rendered as a square purple-bordered slab; tighten to
	   the same brand pink pill the rest of the redesign uses. Also adds
	   margin below the card so it doesn't collide with the listings
	   grid right beneath. Mirrors the mobile rules at
	   snifffr-mobile-redesign.css:10250+. */
	body.snifffr-desktop-beta .oneitemupshop {
		background: #fff !important;
		border: 1px solid rgba(66, 62, 89, 0.08);
		border-radius: 14px !important;
		padding: 20px 24px !important;
		margin: 0 0 22px !important;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	}
	body.snifffr-desktop-beta .oneitemupshop p {
		margin: 0 0 8px !important;
		font-size: 13.5px;
		line-height: 1.5;
		color: rgba(66, 62, 89, 0.85);
	}
	body.snifffr-desktop-beta .oneitemupshop p:first-of-type {
		font-size: 15px;
		color: #1a1a1a;
	}
	body.snifffr-desktop-beta .oneitemupshop p:last-of-type {
		margin-bottom: 14px !important;
	}
	body.snifffr-desktop-beta .oneitemupshop .btn-outline-primary {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		padding: 11px 26px !important;
		background: #e65c95 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 999px !important;
		font-size: 13.5px !important;
		font-weight: 700 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		text-decoration: none !important;
		box-shadow: 0 4px 12px rgba(230, 92, 149, 0.25);
		transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
	}
	body.snifffr-desktop-beta .oneitemupshop .btn-outline-primary:hover,
	body.snifffr-desktop-beta .oneitemupshop .btn-outline-primary:focus {
		background: #d24a7d !important;
		color: #fff !important;
		box-shadow: 0 6px 16px rgba(230, 92, 149, 0.32);
		transform: translateY(-1px);
	}

	/* Custom tooltip for the bp-block-member icon button. The native
	   title attribute is stripped + a data-tooltip stamped in JS at the
	   end of snifffr-desktop-profile.php (carries the link's "Block" or
	   "Unblock" text). The pseudo-element renders the tooltip on hover /
	   keyboard focus so the icon-only button still has an affordance. */
	body.snifffr-desktop-beta a.block-button {
		position: relative;
	}
	body.snifffr-desktop-beta a.block-button[data-tooltip]:hover::after,
	body.snifffr-desktop-beta a.block-button[data-tooltip]:focus-visible::after {
		content: attr(data-tooltip);
		position: absolute;
		bottom: calc(100% + 8px);
		left: 50%;
		transform: translateX(-50%);
		padding: 6px 10px;
		background: #423e59;
		color: #fff;
		font-size: 11px;
		font-weight: 600;
		letter-spacing: 0.02em;
		text-transform: none;
		white-space: nowrap;
		border-radius: 6px;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
		pointer-events: none;
		z-index: 10;
	}
	/* Small downward-pointing arrow under the tooltip — uses ::before so
	   it composes cleanly with the ::after bubble. */
	body.snifffr-desktop-beta a.block-button[data-tooltip]:hover::before,
	body.snifffr-desktop-beta a.block-button[data-tooltip]:focus-visible::before {
		content: "";
		position: absolute;
		bottom: calc(100% + 2px);
		left: 50%;
		transform: translateX(-50%);
		border: 6px solid transparent;
		border-top-color: #423e59;
		pointer-events: none;
		z-index: 10;
	}

	/* Suppress the floating tooltip when the block button is rendered
	   inside the kebab "More actions" dropdown — that row already shows
	   the word "Block"/"Unblock" inline next to the icon via the
	   [data-snifffr-dp-block-label] span (synced in PHP-injected JS),
	   so the hover bubble was duplicative and clipped by the menu. */
	body.snifffr-desktop-beta .snifffr-dp-shophead-more-menu a.block-button[data-tooltip]:hover::after,
	body.snifffr-desktop-beta .snifffr-dp-shophead-more-menu a.block-button[data-tooltip]:focus-visible::after,
	body.snifffr-desktop-beta .snifffr-dp-shophead-more-menu a.block-button[data-tooltip]:hover::before,
	body.snifffr-desktop-beta .snifffr-dp-shophead-more-menu a.block-button[data-tooltip]:focus-visible::before {
		content: none;
		display: none;
	}
}

/* Non-beta users: hide the redesign wrap entirely regardless of viewport.
   Belt-and-braces — also prevents a flash if the legacy desktop layout
   ever briefly assigns visibility before the body class lands. */
body:not(.snifffr-desktop-beta) .snifffr-profile-desktop-redesign-wrap {
	display: none !important;
}

/* Desktop-beta users: hide the legacy seller-menu / buyer-menu nav items
   at EVERY viewport. The mobile drawer (<992px) and the avatar dropdown
   (>=992px) both surface the same destinations, so the inline pill row
   in the lavender bar is duplicate chrome. */
body.snifffr-desktop-beta .seller-menu ul.navbar-nav {
	display: none !important;
}

/* Beta users below 992px: hide the redesign wrap so the mobile redesign
   owns the viewport. Without this rule, .snifffr-profile-desktop-redesign-wrap
   defaults to display:block and renders alongside the mobile wrap at narrow
   widths — which is what was making the desktop redesign appear at 768px.
   The @media (min-width: 992px) block above flips it back on for
   body.snifffr-desktop-beta at the right breakpoint.

   Same idea for the header avatar dropdown: header.php emits both the
   legacy <ul.navbar-nav> and the .snifffr-sm-avatar-wrap so the chrome
   stays correct at every viewport. At <992px the avatar must hide so
   the mobile-style nav menu owns the .seller-menu bar. */
@media (max-width: 991.98px) {
	body.snifffr-desktop-beta .snifffr-profile-desktop-redesign-wrap {
		display: none !important;
	}
	body.snifffr-desktop-beta .seller-menu .snifffr-sm-avatar-wrap {
		display: none !important;
	}
	/* Belt-and-braces parity with the mobile redesign visibility flip:
	   show the mobile wrap and hide the legacy desktop wrap at <992px.
	   The mobile CSS does this via `body.snifffr-mobile-beta`, but if a
	   user is on the desktop-beta allowlist without mobile-beta, those
	   rules don't fire and the user lands on an empty page. Forcing the
	   same flip here under `body.snifffr-desktop-beta` keeps narrow-width
	   browsers on the mobile redesign regardless of mobile-beta state. */
	body.snifffr-desktop-beta .snifffr-profile-mobile-wrap {
		display: block !important;
	}
	body.snifffr-desktop-beta .snifffr-profile-desktop-wrap {
		display: none !important;
	}

	/* Gallery create / manage URLs (body.snifffr-mp-gallery-form): the form
	   is rendered inside the redesign-wrap via bp_template_content fired
	   from snifffr-desktop-profile.php. Force the redesign-wrap visible at
	   <992px so mobile users can reach the form, and hide both the
	   mobile-wrap (would render the user's gallery list, irrelevant here)
	   and the legacy desktop-wrap (drags in the unwanted #item-header
	   hero + duplicate #item-body chrome that the user complained about).

	   Higher specificity (two classes on body) so these rules win over the
	   default mobile-wrap show / legacy-wrap hide rules at this viewport. */
	body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-desktop-redesign-wrap {
		display: block !important;
	}
	body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-mobile-wrap,
	body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-desktop-wrap {
		display: none !important;
	}

	/* The site-wide top <nav> in header.php is `navbar-expand-md`, so
	   Bootstrap keeps the inline nav items expanded at 768-991.98px.
	   Combined with the mobile redesign's hamburger button (which renders
	   in the same row via `snifffr_mobile_nav_button()`), the result is
	   duplicate chrome — legacy nav items inline AND a mobile drawer
	   trigger. Hide the inline items here so only the hamburger drawer
	   shows in the 768-991.98px range; >=992px is unaffected (handled
	   by Bootstrap's default expanded state). */
	body.snifffr-desktop-beta .navbar.navbar-expand-md > .container > .navbar-collapse,
	body.snifffr-desktop-beta .navbar.navbar-expand-md > .container > #navbarNavDropdown {
		display: none !important;
	}

	/* Hide the entire dark-purple legacy .seller-menu bar at <992px for
	   desktop-beta users. The mobile redesign already renders its own
	   identity hero (avatar + name + tabs) inside the profile shell, so
	   the page-title bar with NEWSELLD is duplicate chrome. The mobile
	   CSS only hides this bar on body.activity — extend the hide to
	   every page for our beta users. */
	body.snifffr-desktop-beta .seller-menu {
		display: none !important;
	}
}

/* ============================================================================
   Gallery-form chrome trim — applies at every viewport (outside any @media
   block) so both mobile and desktop drop it.

   On gallery create/manage URLs we want a clean "← Back to Gallery + form"
   layout (matches prod mobile-beta behaviour). The redesign template renders
   the full desktop chrome (cover + identity + quick-actions + tab strip)
   above the body, which spills onto these utility URLs as redundant text.
   ========================================================================= */
body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-desktop-redesign-wrap .snifffr-dp-header,
body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-desktop-redesign-wrap .snifffr-dp-tabs {
	display: none !important;
}
/* Legacy MediaPress admin-menu tabs (View / Edit Media / Add Media / Reorder /
   Edit Details / Delete) are rendered by MediaPress's manage.php inside
   bp_template_content. They appear inside the redesign-wrap at every viewport.
   The consolidated upload-form.php already covers add + edit + delete in one
   card, so the tab strip is redundant chrome. Hide it (and the <hr/> the
   plugin template emits right after) for desktop-beta users everywhere — not
   just at >=992px like before. */
body.snifffr-desktop-beta .mpp-gallery-admin-menu,
body.snifffr-desktop-beta .mpp-gallery-admin-menu + hr {
	display: none !important;
}
body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-profile-desktop-redesign-wrap .snifffr-dp {
	background: transparent;
}
/* Back-to-gallery pill rendered inside the gallery-deep body. The mobile
   redesign already styles .snifffr-mp-manage-back inside @media (max-width:
   991.98px); promote the same pill to all viewports for the desktop redesign
   so it stays visible at >=992px too. */
body.snifffr-desktop-beta.snifffr-mp-gallery-form .snifffr-dp-gallery-back {
	/* !important on margin because snifffr-mobile-redesign.css line 326
	   sets `margin: 15px 16px 15px !important` on .snifffr-mp-manage-back
	   (the parent class on this same button), which has !important and
	   beats a non-!important shorthand even with higher specificity.
	   position: static overrides the sticky top:0 from the same mobile
	   rule — sticky on this redesign-wrap context lets the pill pin to
	   the top of the viewport (under the site-wide fixed navbar) once
	   the user scrolls, which clips the text and looked broken vs live. */
	display: inline-flex !important;
	position: static !important;
	align-items: center;
	margin: 28px 16px 16px !important;
	padding: 8px 14px;
	border: 1px solid rgba(66, 62, 89, 0.22);
	border-radius: 999px;
	background: #fff;
	color: #423E59;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	box-shadow: 0 4px 12px rgba(66, 62, 89, 0.08);
}

/* ──────────────────────────────────────────────────────────────
   Magnific-popup lightbox (.mfp-gallery) — restyled to match the
   desktop redesign card chrome.

   Default mfp ships with naked rectangular images on a 0.8 dark
   backdrop, a stark white × in the corner, and big square arrow
   blocks at the edges. None of that reads like the rest of the
   redesign (rounded soft cards, circular pink CTAs, lavender chrome).

   This block overrides:
     - .mfp-bg          → deeper brand-purple backdrop, higher opacity
     - .mfp-img/.figure → 14px radius + soft drop shadow under the image
     - .mfp-close       → circular white pill with × glyph, pink hover
     - .mfp-arrow       → circular white pill with chevron, pink hover
     - .mfp-counter     → cleaner typography on the lavender chrome
     - .mfp-title       → optional caption styling
   Scoped to body.snifffr-desktop-beta so non-beta users keep the
   legacy mfp-bg #332e4d backdrop (custom.css:5933) unchanged.
   ────────────────────────────────────────────────────────────── */
body.snifffr-desktop-beta .mfp-bg {
	background: #28233c !important;
	opacity: 0.94 !important;
	filter: none !important;
}

/* Image frame — rounded + lifted from the dark backdrop. */
body.snifffr-desktop-beta .mfp-gallery .mfp-figure {
	background: transparent !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-figure::after {
	display: none !important; /* legacy mfp's grey shadow box behind the img */
}
body.snifffr-desktop-beta .mfp-gallery .mfp-img,
body.snifffr-desktop-beta .mfp-gallery img.mfp-img {
	border-radius: 14px !important;
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.55), 0 4px 14px rgba(0, 0, 0, 0.35) !important;
	padding: 0 !important;
	background: transparent !important;
}

/* Close button — circular white pill in the top-right of the content,
   centered glyph, soft shadow. Pink hover. mfp's default font-size: 28px
   serif × on a transparent bg reads as a screenshot annotation, not a
   real button. */
body.snifffr-desktop-beta .mfp-gallery button.mfp-close,
body.snifffr-desktop-beta .mfp-gallery .mfp-close {
	position: absolute !important;
	top: -18px !important;
	right: -18px !important;
	width: 40px !important;
	height: 40px !important;
	padding: 0 !important;
	margin: 0 !important;
	background: #fff !important;
	border: 0 !important;
	border-radius: 50% !important;
	color: #423e59 !important;
	font-size: 22px !important;
	line-height: 40px !important;
	font-family: Arial, sans-serif !important;
	text-align: center !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35) !important;
	opacity: 1 !important;
	cursor: pointer !important;
	transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease !important;
}
body.snifffr-desktop-beta .mfp-gallery button.mfp-close:hover,
body.snifffr-desktop-beta .mfp-gallery .mfp-close:hover {
	background: #e65c95 !important;
	color: #fff !important;
	transform: scale(1.05) !important;
}

/* Arrows — circular white pills on left/right with a pink chevron.
   mfp's default .mfp-arrow is a giant 90×110 block with double-stacked
   ::before/::after for the chevron + outer dimming — we override every
   property + reset the pseudo-element ::after content so we don't get
   double chevrons. */
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow {
	width: 52px !important;
	height: 52px !important;
	margin: -26px 0 0 !important;
	padding: 0 !important;
	background: #fff !important;
	border: 0 !important;
	border-radius: 50% !important;
	opacity: 1 !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35) !important;
	transition: background 0.15s ease, transform 0.15s ease !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow:hover {
	background: #e65c95 !important;
	transform: scale(1.06) !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow:hover::before,
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow:hover::after {
	border-color: #fff !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow::before,
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow::after {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	content: "" !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	width: 12px !important;
	height: 12px !important;
	box-sizing: border-box !important;
	opacity: 1 !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow-left::after {
	border-left: 2px solid #423e59 !important;
	border-bottom: 2px solid #423e59 !important;
	transform: translate(-30%, -50%) rotate(45deg) !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow-right::after {
	border-right: 2px solid #423e59 !important;
	border-top: 2px solid #423e59 !important;
	transform: translate(-70%, -50%) rotate(45deg) !important;
}
/* Kill mfp's ::before chevron — we only render the single ::after one. */
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow::before {
	display: none !important;
}

/* Arrows tucked away from the image edge so they don't overlay the pic. */
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow-left {
	left: 24px !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-arrow-right {
	right: 24px !important;
}

/* Bottom bar — title + counter on a lavender chrome. */
body.snifffr-desktop-beta .mfp-gallery .mfp-bottom-bar {
	margin-top: 14px !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-title {
	color: rgba(255, 255, 255, 0.85) !important;
	font-size: 13.5px !important;
	font-weight: 500 !important;
	text-align: center !important;
	padding: 0 !important;
}
body.snifffr-desktop-beta .mfp-gallery .mfp-counter {
	position: absolute !important;
	right: 0 !important;
	top: 0 !important;
	color: rgba(255, 255, 255, 0.55) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.05em !important;
}