/* =========================================================================
   SONORAN VISUALS — bespoke OEM design pack (bold-modern: bright cyan + ink on light)
   Loaded by oem-tour.html AFTER master-shell.css, only when the OEM config
   (oems/Sonoran Visuals.design.stylesheet) points here. Everything is scoped under
   :root[data-oem="sonoranvisuals"] so it overrides the base by specificity (no
   !important) and never leaks to other OEMs. The base/chameleon floor stays
   intact when this pack is absent.

   Design thesis: clean light canvas, high-contrast INK type, and Sonoran Visuals's
   vivid cyan-blue (#416949) as the one confident accent — bolder and more
   modern than the Brinkley pack this was cloned from (structure identical;
   reskin only). See docs/BRINKLEY_TOUR_UI_SCOPE.md for the shared shell.

   NOTE: brand ACCENT colors (button borders, ePrice glow, etc.) also come from
   the chameleon engine via oems/Sonoran Visuals.branding (set primaryColor #416949,
   accentColor #5a6370 in the OEM Console). This pack owns MATERIAL + TYPE +
   the splash/loader, and hardcodes the blue only where the moment demands it.
   ========================================================================= */

/* Sonoran Visuals brand type: Raleway (headings — esp. floorplan/model names) + Rubik (body). */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700;800&family=Rubik:wght@400;500;600;700&display=swap');

:root[data-oem="sonoranvisuals"] {
  --sv-green: #416949;          /* primary brand green (from the site) */
  --sv-green-deep: #2f4d36;
  --sv-slate: #5f6b60;         /* warm green-grey */
  --sv-mist: #cbc3b2;          /* secondary warm line / soft-surface tone */
  --sv-ink: #20241f;           /* warm charcoal */
  --sv-ink-soft: #4a4d44;
  --sv-canvas-1: #f5f1e6;      /* cream = their main light surface */
  --sv-canvas-2: #ece7d6;
  --sv-canvas-3: #e0d9c4;
  --sv-line: rgba(32, 36, 31, 0.12);
  --sv-shadow: 0 24px 60px -22px rgba(32, 36, 31, 0.42);
  --font-heading: 'Raleway', sans-serif;   /* picked up by every var(--font-heading) consumer */
  --font-body: 'Rubik', sans-serif;

  /* ── TUNABLE KNOBS — tweak these values directly to taste, then refresh the lab.
     No need to round-trip through me for fine calibration; the structure's set. ── */
  --sv-btn-tracking: 0.24em;                 /* bar label letter-spacing (wider = airier) */
  --sv-divider: rgba(65, 105, 73, 0.6);    /* divider line colour (Sonoran Visuals blue) */
  --sv-bar-bg: rgba(245, 241, 230, 0.92);    /* cream tour bar fill */
  --sv-tooltip-lift: 22px;                   /* gap from button top → lift tooltips clear of the bar */
  /* --sv-mp-safe retired: was the Matterport bottom reservation, no longer used. */
  --sv-fp-header-bg: var(--sv-canvas-1);      /* floorplan panel header fill (light, per Sonoran Visuals brand lockup) */
  --sv-cone-size: 78px;                      /* radar view-cone size. 190px was sized for a large floorplan
                                                that fit-to-panel scales DOWN; this plan is 400x200 and scales
                                                UP, where 190px covered 43% of the drawing. Raise again if a
                                                high-res plan is ever swapped in. */
  --sv-cone-follow: 0.06s;                   /* cone→pano sync smoothing (lower = snappier/less lag, higher = smoother) */
  /* Overlays / popups (Phase 3) */
  --sv-card-radius: 18px;                     /* overlay card corner (crisper than base 24) */
  --sv-overlay-scrim: rgba(232, 226, 210, 0.66); /* warm cream frost behind the cards */
  --sv-spec-rule: rgba(22, 22, 22, 0.10);    /* spec-sheet hairline row rules */

  /* ── Map master-shell's theme tokens to the Sonoran Visuals palette. Inline var()
     consumers in the overlay markup (h3 colors, spec labels, accent bars, close
     hover) then render on-palette WITHOUT depending on the chameleon engine — so
     the static lab is accurate, and the off-brand default red/blue never show. At
     runtime the chameleon still sets these inline (same Sonoran Visuals values) → identical. */
  --theme-blue-main: var(--sv-green);
  --theme-blue-dark: var(--sv-ink);
  --theme-red-accent: var(--sv-green);        /* fold the off-brand red accent into blue */
  --primary-glow: rgba(65, 105, 73, 0.3);  /* any glow consumer → Sonoran Visuals blue, not default #2f4d36 */
}

/* Intent chips (lead-form buying-signal toggles): the SELECTED + hover states must use
   --sv-green DIRECTLY, not --theme-blue-main. The chameleon sets --theme-blue-main INLINE from
   branding.primaryColor (white for Sonoran Visuals), which would make a selected chip white-on-light
   so its border vanishes. Same gotcha/fix as #sm-title-plan / #rv-name-tag. */
:root[data-oem="sonoranvisuals"] #oem-intent .s360-chip:hover { border-color: var(--sv-green); }
:root[data-oem="sonoranvisuals"] #oem-intent .s360-chip.selected {
  background: var(--sv-green);
  border-color: var(--sv-green);
  color: #ffffff;
}

/* First paint + boot — light from frame one (no dark flash). */
:root[data-oem="sonoranvisuals"] #boot-curtain {
  background: linear-gradient(165deg, var(--sv-canvas-1) 0%, var(--sv-canvas-2) 100%);
}

/* ---- SPLASH: steel-blue daylight wash, top → white bottom ------------
   Noticeable, branded gradient; the blue top also gives the logo a backdrop
   for contrast, the white bottom keeps the ink hero name high-contrast. */
:root[data-oem="sonoranvisuals"] #splash-screen {
  /* Soft blue/white daylight "blobs" (as background layers, so content layout is untouched) that
     drift on different paths for an organic, non-uniform slow colour morph. Blues + white only. */
  background:
    radial-gradient(42% 42% at 30% 32%, rgba(65, 105, 73,.30), rgba(65, 105, 73,0) 70%),
    radial-gradient(40% 40% at 72% 64%, rgba(47, 77, 54,.24), rgba(47, 77, 54,0) 72%),
    radial-gradient(38% 38% at 64% 24%, rgba(255,252,244,.75), rgba(255,252,244,0) 70%),
    radial-gradient(46% 46% at 22% 78%, rgba(120,150,110,.28), rgba(120,150,110,0) 72%),
    linear-gradient(165deg, #efe9db 0%, #f6f2e8 55%, #e6ddc9 100%);
  background-size: 200% 200%, 230% 230%, 180% 180%, 210% 210%, 100% 100%;
  background-repeat: no-repeat;
  animation: alSplashMorph 34s ease-in-out infinite alternate;
}
@keyframes alSplashMorph {
  0%   { background-position: 18% 22%, 72% 60%, 62% 20%, 24% 78%, 0 0; }
  50%  { background-position: 58% 62%, 30% 34%, 82% 66%, 60% 44%, 0 0; }
  100% { background-position: 34% 84%, 64% 22%, 28% 52%, 84% 74%, 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  :root[data-oem="sonoranvisuals"] #splash-screen { animation: none; }
}
/* Splash background photo: neutralized for the demo so the clean cream gradient shows.
   To feature one of your own RV/desert photos, set display:block + background-image here
   (or set unit/branding.splashBgUrl) with a soft light scrim over it so the ink type stays legible. */
:root[data-oem="sonoranvisuals"] #splash-bg {
  display: none;
}

/* The headline card: a soft frosted-glass slab on the cream splash. Houses the model name
   down through the Begin Tour button so the splash reads intentional (not empty) and pulls the
   eye to the center. Translucent + blurred so the drifting cream gradient still shows through. */
:root[data-oem="sonoranvisuals"] .content {
  background: rgba(255, 253, 247, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.62);
  box-shadow: 0 30px 70px -26px rgba(32, 36, 31, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
  border-radius: 28px;
  padding: clamp(40px, 6vw, 56px) clamp(26px, 5vw, 44px);
  color: var(--sv-ink);
}

/* Headline — refined, not shouty. Lighter weight, calmer tracking, ink color. */
/* Brand name is redundant with the logo → drop it. The MODEL NAME becomes the hero. */
:root[data-oem="sonoranvisuals"] h1#dealer-title-tag { display: none; }

/* THE HERO: model / floorplan name, big Teko, high-contrast ink. */
:root[data-oem="sonoranvisuals"] p.sub#rv-name-tag {
  font-family: 'Raleway', sans-serif;
  /* Inherited from the Alliance pack, where this line was a SHORT wordmark or a bare
     floorplan number. Tight 0.88 leading is lovely on one short line and catastrophic
     on a wrapping one: line-height below font-size makes wrapped lines overlap. Real
     RV names are long ("2018 DRV Mobile Suites 38KSSB" is 29 chars), so this must be
     >= 1. Cap lowered too, so a long name wraps to two lines instead of three. */
  /* Typographic treatment matched to the UI bar. The FAMILY was never the problem: the bar and
     this line are both Raleway. What made the splash read as heavier and less clean was weight
     500 against the bar's 400, and 1px of tracking against the bar's 0.24em. Matching weight and
     going proportional on tracking makes the two read as one system. Size capped at 3rem so a
     long name wraps to two lines instead of four, and so a 27in monitor does not blow it up. */
  font-size: clamp(1.75rem, 4.2vw, 3rem);
  font-weight: 400;
  line-height: 1.14;
  text-wrap: balance;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sv-ink);
  margin: 0;
}

/* Descriptor sits BENEATH the name, separated by a short blue rule. */
:root[data-oem="sonoranvisuals"] p.sub#rv-name-tag::after {
  content: "Interactive Virtual Tour";
  display: block;
  width: max-content;
  max-width: 100%;
  margin: 1.4rem auto 0 auto;
  padding-top: 1.3rem;
  border-top: 2px solid var(--sv-green);
  font-family: 'Rubik', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
}

/* Floorplan number in the model-name lockup → Sonoran Visuals blue (the model line stays ink).
   Mirrors the floorplan-panel two-tone (#sm-title-plan). Uses --sv-green directly because
   the chameleon sets Sonoran Visuals's "primary" (--theme-blue-main) to white, which would win
   over the base rule via the inline style. */
:root[data-oem="sonoranvisuals"] #rv-name-tag .s360-fp-accent { color: var(--sv-green); }

/* ---- BRAND-WORDMARK HERO (splash) — the line's own logotype as the hero, floorplan
   number beneath in Sonoran Visuals blue. Set by the shell when oems/Sonoran Visuals.lineLogos has a
   match (keyed by specs.model). Height-based sizing normalizes the varied wordmark
   aspect ratios; a soft ink contour lifts the mark off the daylight photo. ---------- */
:root[data-oem="sonoranvisuals"] #rv-name-tag.rv-name-wordmark {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.15rem;
}
/* ---- SPLASH LOCKUP LEGIBILITY (2026-07-16) -------------------------------
   The lockup is a WHITE line wordmark stacked over a #416949 floorplan number, both on a
   bright daylight photo under a white scrim. Neither read well. The fix is NOT the scrim,
   and that's arithmetic rather than taste:

     #416949 has a relative luminance of 0.36. It is a MID-TONE.
       vs white  (current) = 2.55:1   below even the 3:1 large-text floor
       vs mid-grey (~0.30) = ~1.1:1   darkening the scrim a little makes it far WORSE
       vs near-black       = ~5:1     only recovers if the pool is ~90% opaque, which
                                      hides the photo we're keeping

   And the two elements want OPPOSITE backgrounds: whiter is the blue's best light-side case
   (2.55 is its ceiling) but erases a white wordmark; darker rescues the wordmark and kills
   the blue. No single scrim value serves both, so the scrim is deliberately left ALONE.

   What works instead is a CONTOUR on the glyphs, which is background-independent (how
   subtitles and map labels survive any footage). The mark already had one at 2px/35%, far
   too weak to lift white off white. Tight, stacked, low-radius shadows do the lifting;
   the wide one only carries depth. Type colour, font and photo are all untouched.
   ⚠️ Do NOT "fix" this by darkening #splash-bg — see the table above. */
:root[data-oem="sonoranvisuals"] .rv-line-wordmark {
  height: clamp(46px, 10.5vw, 72px);
  width: auto;
  max-width: 90%;
  object-fit: contain;
  filter:
    drop-shadow(0 0 1px  rgba(14,24,34,.62))   /* contour: the two tight passes do the work */
    drop-shadow(0 0 2px  rgba(14,24,34,.42))
    drop-shadow(0 1px 3px rgba(14,24,34,.52))
    drop-shadow(0 10px 24px rgba(14,24,34,.26)); /* depth only */
}
:root[data-oem="sonoranvisuals"] .rv-line-plan {
  font-family: 'Raleway', sans-serif;
  font-size: clamp(2rem, 8vw, 3.6rem);
  font-weight: 500;
  line-height: 0.88;
  letter-spacing: 1px;
  color: var(--sv-green);
  /* Same contour logic. Keeps the blue exactly as-is and gives every glyph edge its own
     high-contrast border, which is what makes a mid-tone readable on a light photo. */
  text-shadow:
    0 0 1px rgba(10,20,30,.60),
    0 0 3px rgba(10,20,30,.42),
    0 1px 2px rgba(10,20,30,.68),
    0 4px 16px rgba(10,20,30,.38);
}
/* The "Interactive Virtual Tour" ::after descriptor stays under the wordmark + plan —
   it finishes the lockup (small blue-ruled caption), so no override needed here. */

/* Floorplan-panel header: the line wordmark in place of the text model name (blue
   floorplan number #sm-title-plan stays). Small, ink-safe, aligned to the number. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title .sm-line-wordmark {
  height: 20px;
  width: auto;
  max-width: 150px;
  object-fit: contain;
  vertical-align: middle;
  display: inline-block;
}

/* ---- LINEUP: line-first + collapsible (Avenue's wordmark once; 58 plans → 5 rows) ----
   Each line is one collapsible section: wordmark + floorplan count in the head, body-style
   sub-labels inside. Collapsed by default; the current model's line opens on load. */
:root[data-oem="sonoranvisuals"] .lineup-line { border-bottom: 1px solid var(--sv-line); }
:root[data-oem="sonoranvisuals"] .lineup-line-head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 20px 4px;
  text-align: left;
  font-family: 'Raleway', sans-serif;
  transition: background .25s ease;
}
:root[data-oem="sonoranvisuals"] .lineup-line-head:hover { background: rgba(65, 105, 73, 0.05); }
:root[data-oem="sonoranvisuals"] .lineup-line-name {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;         /* allow the name to shrink so the count is never pushed off */
  overflow: hidden;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 1.45rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--sv-ink);
}
:root[data-oem="sonoranvisuals"] .lineup-line-name .lineup-brand-logo {
  height: 30px;
  width: auto;
  max-width: 240px;
  object-fit: contain;
  object-position: left center;
}
/* Narrow viewports: shrink the wordmark + count so a big logotype + the count fit one row. */
@media (max-width: 640px) {
  :root[data-oem="sonoranvisuals"] .lineup-line-head { padding: 15px 4px; gap: 10px; }
  :root[data-oem="sonoranvisuals"] .lineup-line-name .lineup-brand-logo { height: 24px; max-width: 120px; }
  :root[data-oem="sonoranvisuals"] .lineup-line-count { font-size: 0.58rem; letter-spacing: 0.08em; }
}

/* ---- SECTIONED SPEC SHEET (#spec-sheet-sections) — the data-driven specSheet[] path,
   for OEMs whose real specs don't fit the fixed 12-field grid (Sonoran Visuals: Length/Height/
   Dry Weight/GVWR/Hitch/Tanks). Editorial, NOT boxed: the base CSS wraps each section in a
   bordered rounded card with a grey header bar + faint row fills (reads cramped/tacked-on),
   so we strip all of that and lay it out as airy, hairline-ruled sections. */
:root[data-oem="sonoranvisuals"] #spec-sheet-sections { margin-top: 26px; text-align: left; }

/* ---- SPEC SHEET WIDTH + SCROLLBAR ------------------------------------------
   Three separate problems, all visible at once on desktop:
   1. The card carries an inline max-width:550px !important from the markup, so it
      used under half a 1280 viewport.
   2. The card is display:flex and centres its children, so #spec-sheet-sections
      collapsed to its own content width (~236px) and sat stranded in the middle of
      an already-narrow card with dead space either side. width:100% + align-self
      make it fill the card.
   3. The overflow used the native 15px scrollbar, parked against the content.
      Replaced with a thin brand-green thumb on a transparent track.
   Two columns on desktop, because at ~820px a single column of label-left /
   value-right rows just stretches the dot leaders out and looks worse, not better.
   Mobile is untouched: it stays one column in a full-width bottom sheet. */
@media (min-width: 801px) {
  :root[data-oem="sonoranvisuals"] #specs-overlay .overlay-content {
    max-width: min(820px, calc(100vw - 80px)) !important;
    width: min(820px, calc(100vw - 80px)) !important;
  }
  :root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 30px;
    align-content: start;
    max-height: 56vh;
  }
}
:root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections,
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid {
  width: 100%;
  align-self: stretch;
  padding-right: 12px;
  scrollbar-width: thin;
  scrollbar-color: rgba(65, 105, 73, 0.4) transparent;
}
:root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections::-webkit-scrollbar,
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid::-webkit-scrollbar { width: 6px; }
:root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections::-webkit-scrollbar-track,
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid::-webkit-scrollbar-track { background: transparent; }
:root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections::-webkit-scrollbar-thumb,
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid::-webkit-scrollbar-thumb {
  background: rgba(65, 105, 73, 0.35);
  border-radius: 999px;
}
:root[data-oem="sonoranvisuals"] #specs-overlay #spec-sheet-sections::-webkit-scrollbar-thumb:hover,
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid::-webkit-scrollbar-thumb:hover {
  background: rgba(65, 105, 73, 0.55);
}
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-section {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  margin: 0 0 32px;
}
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-section:last-child { margin-bottom: 4px; }
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-section-h {
  background: transparent;
  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  font-size: 0.7rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--sv-green);
  padding: 0 2px 11px;
  margin: 0 0 6px;
  border-bottom: 2px solid var(--sv-green);
}
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-row {
  background: transparent;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 14px 2px;
  border-bottom: 1px solid var(--sv-spec-rule);
}
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-section .spec-row:last-child { border-bottom: none; }
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-row-l {
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 0.64rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
}
:root[data-oem="sonoranvisuals"] #spec-sheet-sections .spec-row-v {
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 1.12rem;
  color: var(--sv-ink);
  text-align: right;
  white-space: nowrap;
}
:root[data-oem="sonoranvisuals"] .lineup-line-meta { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
:root[data-oem="sonoranvisuals"] .lineup-line-count {
  font-family: 'Rubik', sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
  white-space: nowrap;
}
:root[data-oem="sonoranvisuals"] .lineup-line-chevron {
  color: var(--sv-green);
  font-size: 0.9rem;
  line-height: 1;
  transition: transform .28s ease;
}
:root[data-oem="sonoranvisuals"] .lineup-line.is-open .lineup-line-chevron { transform: rotate(180deg); }
:root[data-oem="sonoranvisuals"] .lineup-line-body { display: none; padding: 2px 2px 22px; }
:root[data-oem="sonoranvisuals"] .lineup-line.is-open .lineup-line-body { display: block; }
:root[data-oem="sonoranvisuals"] .lineup-bodystyle {
  font-family: 'Raleway', sans-serif;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sv-ink);   /* ink, not blue — the blue was lost among the blue floorplan numbers */
  margin: 16px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--sv-line);
}

/* "Available at {dealer}" — quiet, on light. */
:root[data-oem="sonoranvisuals"] .oem-available-at {
  color: var(--sv-ink-soft);
  opacity: 1;
}

/* Begin Tour — a confident solid Sonoran Visuals pill with a soft lift. */
:root[data-oem="sonoranvisuals"] .start-btn {
  background: var(--sv-green);
  color: #fff;
  border: 2px solid var(--sv-green);
  letter-spacing: 3px;
  padding: 17px 46px;
  margin-top: 2.2rem;
  box-shadow: 0 14px 30px -12px rgba(47, 77, 54, 0.6);
}
:root[data-oem="sonoranvisuals"] .start-btn::after {
  content: "\2192";
  margin-left: 12px;
  font-weight: 700;
}
/* "Available at {dealer}" sits quietly under the rule. */
:root[data-oem="sonoranvisuals"] .oem-available-at { margin-top: 1.6rem; letter-spacing: 1.5px; }
:root[data-oem="sonoranvisuals"] .start-btn:hover {
  background: var(--sv-green-deep);
  border-color: var(--sv-green-deep);
  color: #fff;
  box-shadow: 0 18px 38px -12px rgba(47, 77, 54, 0.7);
  transform: scale(1.04);
}

/* Logos lose their white glow (invisible on light) for a crisp daylight contour: a tight
   dark edge lifts the white mark off the light-steel splash gradient (was too low-contrast),
   plus a soft shadow for depth. Applies to the splash + in-tour logo (also helps over bright panos). */
:root[data-oem="sonoranvisuals"] .property-logo,
:root[data-oem="sonoranvisuals"] .premium-loader-logo {
  /* Single drop-shadow ONLY. iOS Safari rasterizes CHAINED drop-shadow() filters on a
     transparent PNG as an opaque gray bounding-box rectangle (visible behind the splash
     wordmark on iPhone, fine on desktop Chrome). One shadow keeps the depth without the bug. */
  filter: drop-shadow(0 2px 6px rgba(22, 22, 22, 0.40));
}

/* -- IN-TOUR LOGO ----------------------------------------------------------
   The Matterport-compliance relocation that used to live here has been REMOVED.
   It pushed the mark to a small top-LEFT badge and hid it entirely on phones, to
   dodge Matterport Mattertag navigation. This standalone shell is Pano2VR only.
   The Matterport path was stripped in the one-off build, so that constraint no
   longer exists. Logo returns to centred, full size, and visible on mobile. */
:root[data-oem="sonoranvisuals"] .tour-logo-overlay {
  justify-content: center;
  top: 26px;
  padding-left: 0;
}
:root[data-oem="sonoranvisuals"] .tour-logo-overlay img { width: 300px !important; }

/* SPLASH LOGO: the base shell sizes every logo off --logo-width-desktop (320px),
   which suits a squarish badge. The Sonoran Visuals mark is a 5.25:1 wordmark, so
   at 320px it reads as a thin strip rather than a hero. Override for this pack
   only, leaving the shared token alone for other brands. */
:root[data-oem="sonoranvisuals"] .course-logo-container .property-logo { width: 460px; }
@media (max-width: 800px) {
  :root[data-oem="sonoranvisuals"] .course-logo-container .property-logo { width: 320px !important; }
}
@media (max-width: 560px) {
  :root[data-oem="sonoranvisuals"] .course-logo-container .property-logo { width: 250px !important; }
}

@media (max-width: 800px) {
  :root[data-oem="sonoranvisuals"] .tour-logo-overlay { top: 16px !important; }
  :root[data-oem="sonoranvisuals"] .tour-logo-overlay img { width: 210px !important; }
}
@media (max-width: 560px) {
  :root[data-oem="sonoranvisuals"] .tour-logo-overlay { top: 12px !important; }
  :root[data-oem="sonoranvisuals"] .tour-logo-overlay img { width: 170px !important; }
}
/* ── REMOVE THE IN-TOUR AI CONCIERGE (product decision) ───────────────────────
   The in-tour concierge chat (the bar "Contact/Chat" button + the floating "Ask
   AI" FAB) is pulled from the OEM tour: it errored on the OEM site (tourConcierge
   requires a dealerId) and a smaller bar clears Matterport's tag detail panel
   without the fragile yield hack. Hiding rather than deleting keeps the change
   reversible and touches no JS (refreshConciergeFab still runs harmlessly on a
   hidden FAB). The lead path (ePrice / Request Info) is a separate button and
   stays. NOTE: a product decision, not brand — graduate to the OEM shell (and
   fully delete the concierge markup/backend) once its fate is settled globally.
   TO RESTORE: delete this block. */
/* REVISED for the standalone shell. The bar Contact button is BACK. It was hidden
   here as part of pulling the AI concierge, but openContactHub opens
   #concierge-panel, and that panel is two things stacked: #hub-actions (Call /
   Text / socials) and #concierge-chat (the AI). The scope makes the contact hub
   the PRIMARY CTA for a one-off dealer tour, so hiding its only entry point took
   the whole contact path with it.
   The AI half genuinely has no backend here (tourConcierge was stripped), so the
   floating FAB and the chat form stay hidden. openPanel only greets and focuses
   the input when window.conciergeEnabled is true, which it never is in this build,
   so the panel opens as a clean contact hub with no dead chat box. */
:root[data-oem="sonoranvisuals"] #concierge-fab { display: none !important; }
:root[data-oem="sonoranvisuals"] #concierge-chat { display: none !important; }

/* ── COMPACT DESKTOP BAR so it clears Matterport's bottom chrome in embeds ─────
   At the ~1280px embed width the full bar was ~948px (only ~166px margins), so its
   ends overlapped MP's bottom-left toolbar + bottom-right logo (fine on a wide 27"
   monitor, cramped in the 1280x722 site embed). Tighten spacing/labels so the bar
   stays centred with generous margins that clear MP's corners. HIDE CONTROLS goes
   icon-only (its label drove ~200px; the tooltip still explains it). Desktop only
   (mobile ≤800px already uses the launcher). KNOBS: --sv-bar-btn-pad / font-size.
   Verify visually in the embed; nudge padding/gap if it still touches MP. */
@media (min-width: 801px) {
  :root[data-oem="sonoranvisuals"] #ui-bar { gap: 5px; padding: 8px 11px; }
  :root[data-oem="sonoranvisuals"] #ui-bar .action-btn { padding: 7px 10px; font-size: 0.76rem; }
  :root[data-oem="sonoranvisuals"] #ui-bar .action-btn i { font-size: 1em; }
  :root[data-oem="sonoranvisuals"] #ui-bar .hide-btn .hide-btn-text { display: none !important; }
}

/* "Experience Crafted By" watermark on the LIGHT splash:
   - muted-ink text (default white was invisible on the near-white gradient);
   - bottom-CENTER on desktop (master pins it bottom-right at right:40px; mobile is already
     full-width centered), so it mirrors the mobile layout;
   - a dark contour on the Sonoran logo so its baked-in WHITE "360" reads on the near-white
     splash (was white-on-white; it's a raster PNG so the glyph can't be recoloured in CSS). */
:root[data-oem="sonoranvisuals"] .branding { color: var(--sv-ink-soft); left: 0; right: auto; width: 100%; text-align: center; }
:root[data-oem="sonoranvisuals"] .branding:hover { color: var(--sv-ink); }
:root[data-oem="sonoranvisuals"] .branding img { filter: drop-shadow(0 0 1.5px rgba(22, 22, 22, 0.72)) drop-shadow(0 1px 2px rgba(22, 22, 22, 0.4)); }

/* The Matterport safe-area lift that used to live here is REMOVED. It pushed
   #ui-container up by --sv-mp-safe so a clear strip stayed at the very bottom for
   Matterport toolbar, logo and Help/Terms under partner terms. No Matterport in this
   build, so the bar now falls through to the master shell: flush to the bottom on
   mobile, 40px up on desktop. */

/* ---- LOADING SCREEN: light frost, calm ------------------------------- */
:root[data-oem="sonoranvisuals"] #tour-loading-screen {
  background: linear-gradient(rgba(245, 248, 250, 0.86), rgba(227, 234, 239, 0.92));
}
:root[data-oem="sonoranvisuals"] .loading-text {
  color: var(--sv-ink);
  opacity: 0.75;
  letter-spacing: 4px;
}
/* Wireframe loader: delicate blue rings on frost (replaces the dark glowing sphere). */
:root[data-oem="sonoranvisuals"] .sphere-container { opacity: 0.3; }
@media (min-width: 801px) { :root[data-oem="sonoranvisuals"] .sphere-container { opacity: 0.22; } }
:root[data-oem="sonoranvisuals"] .ring {
  border-width: 1px;
  border-color: var(--sv-green);
  box-shadow: none;
  opacity: 0.55;
}
:root[data-oem="sonoranvisuals"] .ring:nth-child(7) { border-width: 1.5px; opacity: 0.85; }
/* Loader logo: a calm fade, no harsh glow / grayscale. */
:root[data-oem="sonoranvisuals"] .premium-loader-logo {
  animation: alLoaderPulse 2.6s infinite ease-in-out;
  filter: drop-shadow(0 6px 16px rgba(22, 22, 22, 0.16));
}
/* Brand-reveal mark (design.loaderMotion=converge) — replaces the static loader logo above on
   first entry, so it takes the SAME calm daylight contour tuned for this frost, not the heavier
   splash contour. FILTER ONLY: the converge itself comes from the shell, and the shell ships
   .lm-mark unfiltered on purpose so each pack sets the treatment its own loader needs. */
:root[data-oem="sonoranvisuals"] .lm-mark {
  filter: drop-shadow(0 6px 16px rgba(22, 22, 22, 0.16));
}
@keyframes alLoaderPulse {
  0%, 100% { opacity: 0.7; transform: scale(0.99); }
  50% { opacity: 1; transform: scale(1.01); }
}

/* ---- ACTION BAR — refined architectural daylight bar (overhaul v1) ----
   Fixes contrast: high-contrast INK icons + labels on a more solid frosted
   white, hairline separators between tools (architectural), and ONE quiet
   accent — a calm solid-blue ePrice (no glow/pulse). !important here only
   to override master-shell's own !important on the CTA/hide buttons. */
:root[data-oem="sonoranvisuals"] .ui-bar-glass {
  background: var(--sv-bar-bg);            /* faint cool tint → material presence (tunable knob) */
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 20px 50px -20px rgba(22, 22, 22, 0.45), 0 2px 6px rgba(22, 22, 22, 0.07);
}
/* Tools: borderless, ink, high-contrast; refined sentence-case labels. */
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn {
  background: transparent;
  border: none;
  border-radius: 12px;
  color: var(--sv-ink);
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  letter-spacing: var(--sv-btn-tracking);
  text-transform: uppercase;
  box-shadow: none;
  text-shadow: none;                       /* kill the dark pano glow on light */
  transition: background .45s ease, color .45s ease;
}
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn i { color: var(--sv-ink); text-shadow: none; filter: none; transition: color .45s ease; }
/* Divider: a FIXED-height centered Sonoran Visuals-blue line, identical on every button. */
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn + .action-btn::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 50%;
  height: 18px;
  transform: translateY(-50%);
  width: 1px;
  background: var(--sv-divider);
}
/* Calm hover: colour only. transform:none on the button kills the translateY(-4px)
   LIFT that caused the edge-bounce; no icon scale / glow either. */
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn:hover {
  background: rgba(65, 105, 73, 0.10) !important;
  color: var(--sv-green) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
}
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn:hover i { color: var(--sv-green) !important; transform: none !important; filter: none !important; }
/* ePrice = the one confident accent: solid Sonoran Visuals blue, calm (no glow/pulse). */
:root[data-oem="sonoranvisuals"] #ui-bar .cta-glow-btn {
  background: var(--sv-green) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 7px;
  margin: 0 4px;
  animation: none !important;
  box-shadow: 0 8px 18px -8px rgba(47, 77, 54, 0.7) !important;
}
:root[data-oem="sonoranvisuals"] #ui-bar .cta-glow-btn i { color: #fff !important; }
:root[data-oem="sonoranvisuals"] #ui-bar .cta-glow-btn:hover { background: var(--sv-green-deep) !important; color: #fff !important; }
:root[data-oem="sonoranvisuals"] #ui-bar .cta-glow-btn:hover i { color: #fff !important; }
/* The chat button's ::before is the dealer-era "online" status dot — but it's the
   SAME pseudo the inter-button divider uses, so on the bar the two collide and it
   renders as a blue blob with a white box-shadow ring (the broken, asymmetric "right
   divider" of the CTA). Force it back to a clean hairline divider identical to every
   other one. (Drops the green "agent online" dot — a calm OEM tour doesn't need it.) */
:root[data-oem="sonoranvisuals"] #ui-bar .action-btn + .chat-cta-btn::before {
  top: 50%;
  right: auto;
  left: -7px;              /* -7 (not -5): every divider hugs the FOLLOWING button, but the CTA
                             pill has a margin, so its right divider read 7px away vs 5px on the
                             left. -7 pulls it back to 5px from the CTA → symmetric both sides. */
  width: 1px;
  height: 18px;
  border-radius: 0;
  background: var(--sv-divider);
  box-shadow: none;
  transform: translateY(-50%);
  z-index: auto;
}
/* Chat icon → ink, same as every other bar icon (base forces it steel-blue). */
:root[data-oem="sonoranvisuals"] #ui-bar .chat-cta-btn i { color: var(--sv-ink) !important; }
/* Hide-controls = a muted utility action. */
:root[data-oem="sonoranvisuals"] #ui-bar .hide-btn { background: transparent !important; color: var(--sv-ink-soft) !important; }
:root[data-oem="sonoranvisuals"] #ui-bar .hide-btn i { color: var(--sv-ink-soft); }
/* Hover tooltips: Montserrat, on a clean ink chip (not the config blue, which can
   go invisible) so they always read + match the button type. */
:root[data-oem="sonoranvisuals"] [data-tooltip]::after {
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  letter-spacing: 0.12em;
  background: rgba(255, 255, 255, 0.97);
  color: var(--sv-green);
  border: 1px solid var(--sv-line);
  box-shadow: 0 8px 22px -8px rgba(22, 22, 22, 0.4);
  transition: opacity 0.22s ease, transform 0.22s ease;   /* calm, no overshoot bounce */
  bottom: calc(100% + var(--sv-tooltip-lift));            /* lift it clear of the bar (tunable) */
}

/* The "Show controls" restore pill, on light — matches the bar: Montserrat caps,
   ink icon, calm blue hover with NO lift (kills the edge-bounce) and no glow/scale. */
/* The resting state used to be a near-opaque WHITE pill with ink text. Over a bright pano
   (an RV ceiling is close to white) it washed out and read as unfinished. The green-tinted
   hover state was the one that actually read, so that is now the resting state, and hover
   simply steps a shade darker. Same idea, one state later. */
:root[data-oem="sonoranvisuals"] #restore-ui-btn {
  background: rgba(65, 105, 73, 0.12);
  color: var(--sv-green);
  border: 1px solid rgba(65, 105, 73, 0.4);
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  letter-spacing: var(--sv-btn-tracking);
  box-shadow: 0 10px 24px -12px rgba(22, 22, 22, 0.35);
  transition: background .25s ease, border-color .25s ease, color .25s ease;
}
:root[data-oem="sonoranvisuals"] #restore-ui-btn i { color: var(--sv-green); }
:root[data-oem="sonoranvisuals"] #restore-ui-btn:hover {
  background: rgba(65, 105, 73, 0.24) !important;
  border-color: rgba(65, 105, 73, 0.6) !important;
  color: var(--sv-green-deep) !important;
  transform: translateX(-50%) translate3d(0, 0, 0) !important;   /* keep centering, drop the -4px lift */
  box-shadow: 0 10px 24px -12px rgba(22, 22, 22, 0.35) !important;
}
:root[data-oem="sonoranvisuals"] #restore-ui-btn:hover i {
  color: var(--sv-green-deep) !important;
  transform: none !important;
  text-shadow: none !important;
}

/* =======================================================================
   OVERLAYS / POPUPS (Phase 3) — editorial daylight product cards.
   Shared card chrome (scrim, card material, close, handle) restyles EVERY
   feature-card overlay at once; the #specs-overlay block then gives Specs
   the premium spec-sheet treatment. Heavy inline styles in the markup are
   handled via the theme-token mapping above + targeted !important where an
   inline literal (font-size/margin) would otherwise win.
   ======================================================================= */

/* Scrim: daylight frost instead of the base dark 0.8 wash (keeps base blur). */
:root[data-oem="sonoranvisuals"] .custom-overlay { background: var(--sv-overlay-scrim); }

/* Card material: crisp white, hairline mist border, soft diffuse shadow. */
:root[data-oem="sonoranvisuals"] .feature-card {
  background: var(--sv-canvas-1) !important;
  border: 1px solid var(--sv-line) !important;
  box-shadow: var(--sv-shadow) !important;
  border-radius: var(--sv-card-radius) !important;
}

/* Close: hairline ghost button; calm blue hover (not the base red + scale). */
:root[data-oem="sonoranvisuals"] .feature-close {
  background: transparent;
  border: 1px solid var(--sv-line);
  color: var(--sv-ink-soft);
  transition: background .35s ease, color .35s ease;
}
:root[data-oem="sonoranvisuals"] .feature-close:hover {
  background: rgba(65, 105, 73, 0.10);
  color: var(--sv-green);
  transform: none;
}

/* Bottom-sheet grab handle (mobile) → quiet mist. */
:root[data-oem="sonoranvisuals"] .bottom-sheet-handle { background: var(--sv-mist); }

/* Generic icon badge → architectural hairline frame, blue icon, no fill/glow.
   (Per-card inline tint backgrounds still show faintly; refined per card later.) */
:root[data-oem="sonoranvisuals"] .feature-icon-wrapper {
  border: 1px solid var(--sv-line);
  box-shadow: none;
}

/* ---- SPECS — premium spec-sheet: drop the badge, Teko title + blue rule,
   grey pills → clean hairline-ruled rows (label over value). ------------- */
:root[data-oem="sonoranvisuals"] #specs-overlay .feature-icon-wrapper { display: none; }

:root[data-oem="sonoranvisuals"] #specs-overlay h3 {
  font-size: clamp(2rem, 6vw, 2.7rem) !important;
  font-weight: 500 !important;
  line-height: 0.92 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase;
  color: var(--sv-ink) !important;
  margin: 4px 0 0 0 !important;
  padding-bottom: 18px;
}
/* Short blue rule under the title — the same connective motif as the splash. */
:root[data-oem="sonoranvisuals"] #specs-overlay h3::after {
  content: "";
  display: block;
  width: 46px;
  height: 2px;
  background: var(--sv-green);
  margin: 16px auto 0 auto;
}

/* The grid: column gap only — rows are separated by hairline rules, not pills. */
:root[data-oem="sonoranvisuals"] #specs-overlay .specs-grid {
  gap: 0 30px;
  margin-top: 26px;
}
:root[data-oem="sonoranvisuals"] #specs-overlay .spec-item {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--sv-spec-rule);
  border-radius: 0;
  padding: 13px 2px;
  gap: 4px;
}
:root[data-oem="sonoranvisuals"] #specs-overlay .spec-label {
  color: var(--sv-ink-soft);
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 0.64rem;
  letter-spacing: 0.18em;
  margin-bottom: 0;
}
:root[data-oem="sonoranvisuals"] #specs-overlay .spec-value {
  color: var(--sv-ink);
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 1.08rem;
}

/* ---- COMMAND CENTER (more-tools) — make the tool tiles match the bar buttons:
   Montserrat caps + ink icons (base uses font-body + a colour that vanishes on the
   white card). Title/eyebrow already inherit Teko + the blue accent via the token map. */
:root[data-oem="sonoranvisuals"] .tool-btn {
  font-family: 'Raleway', sans-serif;
  font-weight: 400 !important;
  letter-spacing: var(--sv-btn-tracking);
  color: var(--sv-ink) !important;
  border-color: var(--sv-line);
  background: transparent;
  box-shadow: none;
}
:root[data-oem="sonoranvisuals"] .tool-btn i {
  color: var(--sv-ink) !important;
  filter: none !important;
  text-shadow: none !important;
  transition: color 0.3s ease !important;   /* color-only → no transform/filter jitter into place */
}
:root[data-oem="sonoranvisuals"] .tool-btn:hover {
  background: rgba(65, 105, 73, 0.08);
  border-color: rgba(65, 105, 73, 0.35);
  transform: translateY(-4px);
  box-shadow: 0 14px 30px -16px rgba(22, 22, 22, 0.3);
}
:root[data-oem="sonoranvisuals"] .tool-btn:hover i {
  color: var(--sv-green) !important;
  filter: none !important;
  transform: none !important;   /* was scale(1.08) — the "jitter into place" pop */
}

/* =======================================================================
   FLOORPLAN PANEL (#sitemap-panel) — Sonoran Visuals blueprint treatment.
   The panel defaults are built for the dark shell (white text + white icons
   + faint white chips), so on light it reads wrong. Reskin: solid blue header
   with a white label + black icons on white chips, a clean white drawing canvas,
   a quiet daylight footer, soft daylight material, and the top-left resize "L"
   corner bracket removed.
   ======================================================================= */

/* Panel shell: white material, hairline border, soft daylight shadow (no dark glow).
   !important on the shadow to beat the mobile bottom-sheet rule's own !important; the
   two-way blur reads right whether the panel floats (desktop) or is a sheet (mobile). */
:root[data-oem="sonoranvisuals"] #sitemap-panel {
  background: var(--sv-canvas-1);
  border: none !important;              /* remove the thin border around the popup */
  box-shadow: 0 -6px 40px -14px rgba(22, 22, 22, 0.30), 0 24px 60px -22px rgba(22, 22, 22, 0.42) !important;
}

/* Header → light (the Sonoran Visuals title lockup is black+blue on white), hairline underline. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .drag-handle {
  background: var(--sv-fp-header-bg);
  border-bottom: 1px solid var(--sv-line);
  color: var(--sv-ink);
}
/* Two-tone Teko title lockup: BLACK model name + BLUE floorplan name (their brand look). */
:root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title #sm-title-model,
:root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title #sm-title-plan {
  font-family: 'Raleway', sans-serif;
  font-size: 1.55rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}
:root[data-oem="sonoranvisuals"] #sitemap-panel #sm-title-model { color: var(--sv-ink); }
:root[data-oem="sonoranvisuals"] #sitemap-panel #sm-title-plan { color: var(--sv-green); margin-left: 0.4rem; }
/* Mobile: the 1.55rem lockup ("MOBILE SUITES 38KSSB") overflows the ~230px title slot on a
   phone — clips the submodel and crowds the +/-/x controls. Shrink to fit. (Font-FAMILY change
   is a separate pass the founder wants to do across the tour.) */
@media (max-width: 800px) {
  :root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title #sm-title-model,
  :root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title #sm-title-plan {
    font-size: 0.9rem;
    letter-spacing: 0.01em;
  }
}
/* Ruler icon → black on the light header. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .sm-title > i { color: var(--sv-ink) !important; font-size: 0.9rem; }
/* The inline grey divider between zoom controls and close → quiet mist on light. */
:root[data-oem="sonoranvisuals"] #sm-header div[style*="border-left"] { border-left-color: var(--sv-line) !important; }

/* Zoom +/- and close X → ink icons on subtle light chips. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .header-zoom-btn,
:root[data-oem="sonoranvisuals"] #sitemap-panel .close-panel-icon {
  background: var(--sv-canvas-2);
  border: 1px solid var(--sv-line);
  color: var(--sv-ink);
}
:root[data-oem="sonoranvisuals"] #sitemap-panel .header-zoom-btn i,
:root[data-oem="sonoranvisuals"] #sitemap-panel .close-panel-icon i { color: var(--sv-ink); }
/* Calm hovers — quiet blue, no red, no bounce. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .header-zoom-btn:hover,
:root[data-oem="sonoranvisuals"] #sitemap-panel .close-panel-icon:hover {
  background: rgba(65, 105, 73, 0.12);
  border-color: rgba(65, 105, 73, 0.35);
  color: var(--sv-green);
  transform: none;
}
:root[data-oem="sonoranvisuals"] #sitemap-panel .header-zoom-btn:hover i,
:root[data-oem="sonoranvisuals"] #sitemap-panel .close-panel-icon:hover i { color: var(--sv-green); }

/* Footer disclaimer → quiet daylight strip, Open Sans. (Canvas stays white for the drawing.) */
:root[data-oem="sonoranvisuals"] #sitemap-panel .disclaimer-text {
  background: var(--sv-canvas-2);
  color: var(--sv-ink-soft);
  border-top: 1px solid var(--sv-line);
  font-family: 'Rubik', sans-serif;
  letter-spacing: 0.14em;
}

/* Remove the top-left resize "L" corner bracket. */
:root[data-oem="sonoranvisuals"] #sitemap-panel .resizer { display: none; }

/* =======================================================================
   FORMS + LEAD / CONTACT (Phase 3) — concierge-grade capture.
   The white-glove underline inputs + submit CTA are SHARED, so this lifts the
   finance and trade cards too. The #lead-gen-overlay gets the editorial header
   (drop the off-brand red badge → Teko title + blue rule, like Specs).
   ======================================================================= */

/* Shared white-glove inputs → refined hairline underline, ink text, blue focus. */
:root[data-oem="sonoranvisuals"] .white-glove-input {
  border-bottom: 1px solid var(--sv-line) !important;
  color: var(--sv-ink) !important;
  font-family: 'Rubik', sans-serif !important;
}
:root[data-oem="sonoranvisuals"] .white-glove-input::placeholder { color: var(--sv-ink-soft); opacity: 0.85; }
:root[data-oem="sonoranvisuals"] .white-glove-input:focus { border-bottom: 2px solid var(--sv-green) !important; }

/* Overlay submit CTAs (cta-glow-btn OUTSIDE the bar) → calm solid blue, no pulse. */
:root[data-oem="sonoranvisuals"] .custom-overlay .cta-glow-btn {
  background: var(--sv-green) !important;
  border-color: var(--sv-green) !important;
  color: #fff !important;
  animation: none !important;
  box-shadow: 0 10px 24px -10px rgba(47, 77, 54, 0.7) !important;
  letter-spacing: 0.06em;
}
:root[data-oem="sonoranvisuals"] .custom-overlay .cta-glow-btn:hover {
  background: var(--sv-green-deep) !important;
  border-color: var(--sv-green-deep) !important;
  color: #fff !important;
}
:root[data-oem="sonoranvisuals"] .custom-overlay .cta-glow-btn i { color: #fff !important; }

/* Lead / contact card → editorial concierge header (badge → Teko title + blue rule). */
:root[data-oem="sonoranvisuals"] #lead-gen-overlay .feature-icon-wrapper { display: none; }
:root[data-oem="sonoranvisuals"] #lead-gen-overlay h3 {
  font-size: clamp(1.9rem, 5.5vw, 2.5rem) !important;
  font-weight: 500 !important;
  line-height: 0.95 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase;
  color: var(--sv-ink) !important;
  margin: 4px 0 0 0 !important;
  padding-bottom: 16px;
}
:root[data-oem="sonoranvisuals"] #lead-gen-overlay h3::after {
  content: "";
  display: block;
  width: 46px;
  height: 2px;
  background: var(--sv-green);
  margin: 14px auto 4px auto;
}
:root[data-oem="sonoranvisuals"] #lead-gen-overlay p { color: var(--sv-ink-soft) !important; }

/* =======================================================================
   CONTENT CARDS (Phase 3) — Finance / Trade / Share / Feature info.
   Full editorial system, matching Specs + Lead: drop the off-brand icon badges,
   Teko hero title + blue rule, soft-ink copy, on-palette literals. Card-specific
   bits (finance result panel, share QR, secondary buttons) below.
   ======================================================================= */

/* Shared editorial header — hide the badge. */
:root[data-oem="sonoranvisuals"] #finance-overlay .feature-icon-wrapper,
:root[data-oem="sonoranvisuals"] #trade-overlay .feature-icon-wrapper,
:root[data-oem="sonoranvisuals"] #share-overlay .feature-icon-wrapper,
:root[data-oem="sonoranvisuals"] #feature-popup-overlay .feature-icon-wrapper { display: none; }

/* Shared editorial header — Teko hero title. */
:root[data-oem="sonoranvisuals"] #finance-overlay h3,
:root[data-oem="sonoranvisuals"] #trade-overlay h3,
:root[data-oem="sonoranvisuals"] #share-overlay h3,
:root[data-oem="sonoranvisuals"] #feature-popup-overlay h3 {
  font-family: 'Raleway', sans-serif !important;   /* feature-popup h3 has no inline font-heading */
  font-size: clamp(1.9rem, 5.5vw, 2.5rem) !important;
  font-weight: 500 !important;
  line-height: 0.95 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase;
  color: var(--sv-ink) !important;
  margin: 4px 0 0 0 !important;
  padding-bottom: 16px;
}
/* Shared editorial header — short blue rule under the title. */
:root[data-oem="sonoranvisuals"] #finance-overlay h3::after,
:root[data-oem="sonoranvisuals"] #trade-overlay h3::after,
:root[data-oem="sonoranvisuals"] #share-overlay h3::after,
:root[data-oem="sonoranvisuals"] #feature-popup-overlay h3::after {
  content: "";
  display: block;
  width: 46px;
  height: 2px;
  background: var(--sv-green);
  margin: 14px auto 4px auto;
}
/* Shared editorial header — soft-ink body copy. */
:root[data-oem="sonoranvisuals"] #finance-overlay p,
:root[data-oem="sonoranvisuals"] #trade-overlay p,
:root[data-oem="sonoranvisuals"] #share-overlay p,
:root[data-oem="sonoranvisuals"] #feature-popup-overlay p { color: var(--sv-ink-soft) !important; }

/* Secondary card buttons (finance/trade/share submit + Copy Link) → calm solid blue,
   no lift/bounce. (The primary lead CTA stays the accent; these mirror it in blue.) */
:root[data-oem="sonoranvisuals"] #finance-overlay .action-btn,
:root[data-oem="sonoranvisuals"] #trade-overlay .action-btn,
:root[data-oem="sonoranvisuals"] #share-overlay .action-btn {
  background: var(--sv-green) !important;
  border: 1px solid var(--sv-green) !important;
  color: #fff !important;
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-shadow: none !important;
  border-radius: 7px;
}
:root[data-oem="sonoranvisuals"] #finance-overlay .action-btn i,
:root[data-oem="sonoranvisuals"] #trade-overlay .action-btn i,
:root[data-oem="sonoranvisuals"] #share-overlay .action-btn i { color: #fff !important; }
:root[data-oem="sonoranvisuals"] #finance-overlay .action-btn:hover,
:root[data-oem="sonoranvisuals"] #trade-overlay .action-btn:hover,
:root[data-oem="sonoranvisuals"] #share-overlay .action-btn:hover {
  background: var(--sv-green-deep) !important;
  border-color: var(--sv-green-deep) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px -12px rgba(47, 77, 54, 0.7) !important;
  transform: none !important;
}
:root[data-oem="sonoranvisuals"] #finance-overlay .action-btn:hover i,
:root[data-oem="sonoranvisuals"] #trade-overlay .action-btn:hover i,
:root[data-oem="sonoranvisuals"] #share-overlay .action-btn:hover i { color: #fff !important; filter: none !important; transform: none !important; }

/* ---- FINANCE — labels + result panel + the monthly-payment number as a Teko hero. */
:root[data-oem="sonoranvisuals"] #finance-overlay label,
:root[data-oem="sonoranvisuals"] #finance-overlay .calc-pay-label { color: var(--sv-ink-soft) !important; }
:root[data-oem="sonoranvisuals"] #finance-overlay .calc-result-box {
  background: var(--sv-canvas-2) !important;
  border: 1px solid var(--sv-line) !important;
}
:root[data-oem="sonoranvisuals"] #finance-overlay #calc-result {
  font-family: 'Raleway', sans-serif !important;
  color: var(--sv-green) !important;
  font-size: 3.4rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}
:root[data-oem="sonoranvisuals"] #finance-overlay #finance-capture-form { border-top-color: var(--sv-line) !important; }

/* ---- TRADE — inner divider hairline. */
:root[data-oem="sonoranvisuals"] #trade-overlay [style*="border-top"] { border-top-color: var(--sv-line) !important; }

/* ---- SHARE — QR frame: keep white (scannability), add hairline + soft daylight shadow. */
:root[data-oem="sonoranvisuals"] #share-overlay #qrcode {
  border: 1px solid var(--sv-line) !important;
  box-shadow: 0 10px 30px -12px rgba(22, 22, 22, 0.25) !important;
}

/* =======================================================================
   BROCHURE frame (#brochure-overlay) — utility PDF viewer, Sonoran Visuals chrome.
   The address-strip header is already Sonoran Visuals blue via the token map; refine
   its type + buttons, soften the frame. Body + iframe stay white for the PDF.
   ======================================================================= */
:root[data-oem="sonoranvisuals"] #brochure-overlay .overlay-content {
  border: 1px solid var(--sv-line);
  box-shadow: var(--sv-shadow);
}
:root[data-oem="sonoranvisuals"] #brochure-overlay .address-strip {
  font-family: 'Raleway', sans-serif;
  letter-spacing: 0.08em;
}
/* "View Full Screen" + close → clean white-translucent controls on the blue strip. */
:root[data-oem="sonoranvisuals"] #brochure-overlay #btn-download-pdf {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 0.06em;
}
:root[data-oem="sonoranvisuals"] #brochure-overlay #btn-download-pdf:hover {
  background: rgba(255, 255, 255, 0.28) !important;
  transform: none !important;
}
:root[data-oem="sonoranvisuals"] #brochure-overlay .close-btn {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #fff !important;
}
:root[data-oem="sonoranvisuals"] #brochure-overlay .close-btn:hover {
  background: rgba(255, 255, 255, 0.3) !important;
  color: #fff !important;
  transform: none !important;
}

/* =======================================================================
   CONCIERGE / CONTACT HUB (#concierge-panel) — the branded Sonoran Visuals specialist.
   The panel is already light + token-mapped to blue; this crafts it into a calm
   daylight surface: Sonoran Visuals materials + type, a LIGHT editorial header (not a
   generic blue chat banner), refined quick-actions. Scoped selectors beat the
   component's inline <style> by specificity (no !important needed for colors).
   ======================================================================= */
:root[data-oem="sonoranvisuals"] #concierge-panel {
  --hub-text: var(--sv-ink);
  --hub-bg: rgba(255, 255, 255, 0.9);
  --hub-border: var(--sv-line);
  --hub-bot-bg: #ffffff;
  --hub-muted: var(--sv-canvas-2);
  border: 1px solid var(--sv-line);
  box-shadow: var(--sv-shadow);
  font-family: 'Rubik', sans-serif;
}
/* Header → light editorial with a hairline under it; blue headset icon, ink title. */
:root[data-oem="sonoranvisuals"] #concierge-head {
  background: var(--sv-canvas-1);
  color: var(--sv-ink);
  border-bottom: 1px solid var(--sv-line);
  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  letter-spacing: 0.03em;
}
:root[data-oem="sonoranvisuals"] #concierge-head > div > i { color: var(--sv-green); }
:root[data-oem="sonoranvisuals"] #concierge-close { color: var(--sv-ink-soft); opacity: 1; }
:root[data-oem="sonoranvisuals"] #concierge-close:hover { color: var(--sv-green); }
/* Mobile grab handle → mist (base is white, invisible on the light header). */
:root[data-oem="sonoranvisuals"] #concierge-head::before { background: var(--sv-mist) !important; opacity: 1 !important; }
/* Quick-action pills (Call / Text) → calm Sonoran Visuals blue-tint, Montserrat caps. */
:root[data-oem="sonoranvisuals"] .hub-act {
  border-color: var(--sv-line);
  background: rgba(65, 105, 73, 0.10);
  color: var(--sv-ink);
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
:root[data-oem="sonoranvisuals"] .hub-act i { color: var(--sv-green); }
:root[data-oem="sonoranvisuals"] .hub-act:hover { background: rgba(65, 105, 73, 0.18); border-color: rgba(65, 105, 73, 0.4); }
/* Social buttons → hairline, quiet, blue on hover. */
:root[data-oem="sonoranvisuals"] .hub-social { border-color: var(--sv-line); color: var(--sv-ink-soft); }
:root[data-oem="sonoranvisuals"] .hub-social:hover { border-color: var(--sv-green); color: var(--sv-green); }
/* Messages: bot bubble = clean white hairline; user bubble stays Sonoran Visuals blue (token). */
:root[data-oem="sonoranvisuals"] .cmsg.bot { background: #fff; border-color: var(--sv-line); color: var(--sv-ink); }
/* Input → ink text, quiet placeholder (blue focus already via token map). */
:root[data-oem="sonoranvisuals"] #concierge-input { border-color: var(--sv-line); color: var(--sv-ink); }
:root[data-oem="sonoranvisuals"] #concierge-input::placeholder { color: var(--sv-ink-soft); opacity: 0.85; }

/* =======================================================================
   FLOORPLAN RADAR (blueprint signature) — the blips + live vision-cone that
   overlay the floorplan drawing inside #sitemap-panel. Pure visual reskin: the
   blip structure + dataset + updateRadarFromTour() JS are UNTOUCHED (Pillar-A
   zone-dwell + active-blip sync depend on them). Markers-only per the founder;
   the drawing itself stays plain. Two fixes folded in: bigger cone + tighter
   follow (drop the 0.15s transition lag). Sizes are floorplan-pixel scale — they
   scale down with the fit-to-panel zoom, so the base values run large.
   ======================================================================= */

/* SIZING CORRECTION. The master-shell sizes assume a LARGE floorplan that fit-to-panel
   scales DOWN, which is why the note above says the base values run large. This plan is
   400x200 in a ~615px panel, so it scales UP (1.105x) and the assumption inverts. Measured
   before this block: 24px blip rendered at 31px = 7.0% of the plan width; tooltip at 26px
   type with a -75px offset rendered 155x62 = 35% of the plan wide and pushed clean off the
   top edge; cone 190px = 43% of the plan. All scaled to suit a small plan. If you ever swap
   in a high-res floorplan these will want raising again. */
:root[data-oem="sonoranvisuals"] .radar-blip {
  background: #fff;
  border: 1.5px solid var(--sv-green);
  box-shadow: 0 1px 5px -1px rgba(22, 22, 22, 0.4);
  width: 11px;
  height: 11px;
}
:root[data-oem="sonoranvisuals"] .radar-blip::before { inset: -2px; border-width: 1px; }

/* MOBILE INTERACTION HINT: killed. The master shell fades a "Tap to explore in 360" pill
   over the tour on phones for 5 seconds after load. A 360 tour is self-evident, and the
   banner is the first thing a shopper sees on a piece meant to feel premium. Hidden here
   rather than ripped out of the JS so it stays reversible: the shell sets display:flex
   inline, and a stylesheet !important outranks a non-important inline style. */
:root[data-oem="sonoranvisuals"] #interaction-prompt { display: none !important; }
/* Tooltip: small enough to sit inside the drawing instead of overflowing it, and close
   enough to the blip that an edge marker keeps its label on the plan. */
:root[data-oem="sonoranvisuals"] .radar-tooltip {
  top: -16px;
  font-size: 8px;
  padding: 2px 6px;
  border-radius: 4px;
  letter-spacing: 0.06em;
  white-space: nowrap;
  box-shadow: 0 3px 8px -3px rgba(22, 22, 22, 0.45);
}
:root[data-oem="sonoranvisuals"] .radar-blip:hover .radar-tooltip { top: -18px; }
/* Active blip ("you are here") → solid Sonoran Visuals blue with a white ring; anchors the cone. */
:root[data-oem="sonoranvisuals"] .radar-blip.active-blip {
  background: var(--sv-green);
  border-color: #fff;
}
/* Pulse ring → calm, slow, low-opacity breath (was a loud 0.8→2.5x pulse). */
:root[data-oem="sonoranvisuals"] .radar-blip::before {
  border-color: var(--sv-green);
  animation: alRadarPulse 2.8s ease-out infinite;
}
@keyframes alRadarPulse {
  0%   { transform: scale(0.9); opacity: 0.5; }
  100% { transform: scale(1.9); opacity: 0; }
}

/* Vision cone (the signature) → soft Sonoran Visuals-blue FOV wedge, BIGGER, tighter follow.
   Geometry (from/angle + rotate(var(--cone-rot))) is preserved so it still points where
   the shopper faces; only colour, size, and the follow transition change. */
:root[data-oem="sonoranvisuals"] .vision-cone {
  width: var(--sv-cone-size);
  height: var(--sv-cone-size);
  background: conic-gradient(from 330deg at 50% 50%,
    transparent 0deg,
    rgba(65, 105, 73, 0.10) 12deg,
    rgba(65, 105, 73, 0.42) 30deg,
    rgba(65, 105, 73, 0.10) 48deg,
    transparent 60deg);
  transition: transform var(--sv-cone-follow) linear;   /* was 0.15s → cut the follow-lag */
}

/* Room tooltip → the bar's Montserrat white-chip / blue-text style (was a big dark chip). */
:root[data-oem="sonoranvisuals"] .radar-tooltip {
  background: rgba(255, 255, 255, 0.97);
  color: var(--sv-green);
  border: 1px solid var(--sv-line);
  box-shadow: 0 10px 25px -8px rgba(22, 22, 22, 0.4);
  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* =======================================================================
   MODEL / FLOORPLAN SWITCHER (#lineup-overlay) — the OEM lineup browser.
   The render engine (group by category→model→family, cards, navigate) is
   GENERIC + catalog-driven in the shell; this is just the Sonoran Visuals skin.
   Browse-all grouped: Category → Model → (Family, G only) → floorplan cards.
   Two-tone brand lockup carries through: model names = ink, floorplans = blue.
   ======================================================================= */
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-panel {
  width: 92%;
  max-width: 920px;
  max-height: 88vh;
  background: var(--sv-canvas-1);
  border: 1px solid var(--sv-line);
  border-radius: var(--sv-card-radius);
  box-shadow: var(--sv-shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-align: left;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 22px 28px 18px;
  border-bottom: 1px solid var(--sv-line);
  flex-shrink: 0;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-sub {
  font-family: 'Rubik', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--sv-green);
  font-weight: 600;
  margin-bottom: 4px;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-title {
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 2.3rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--sv-ink);
  line-height: 0.95;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-close {
  background: transparent;
  border: 1px solid var(--sv-line);
  color: var(--sv-ink-soft);
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  transition: background .3s ease, color .3s ease;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-close:hover { background: rgba(65, 105, 73, 0.1); color: var(--sv-green); }
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-body { padding: 6px 28px 28px; overflow-y: auto; }

:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-category { margin-top: 24px; }
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-cat-label {
  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  font-size: 0.7rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--sv-green);
  padding-bottom: 8px;
  border-bottom: 2px solid var(--sv-green);
  display: inline-block;
  margin-bottom: 18px;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-model { margin-bottom: 22px; }
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-model-name {
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 1.7rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--sv-ink);
  line-height: 1;
  margin-bottom: 12px;
}
/* Brand wordmark header (when oems/{id}.lineLogos supplies one) — replaces the text line name.
   Sized to sit at roughly the text header's cap-height; left-aligned, contained. */
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-model-name .lineup-brand-logo {
  display: block;
  height: 30px;
  width: auto;
  max-width: 240px;
  object-fit: contain;
  object-position: left center;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-family { margin: 12px 0 14px; }
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-family-label {
  font-family: 'Rubik', sans-serif;
  font-weight: 600;
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
  margin-bottom: 10px;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(116px, 1fr));
  gap: 12px;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card {
  border: 1px solid var(--sv-line);
  border-radius: 10px;
  padding: 16px 12px 13px;
  text-align: center;
  cursor: pointer;
  background: var(--sv-canvas-1);
  transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card:hover {
  border-color: var(--sv-green);
  box-shadow: 0 10px 24px -14px rgba(22, 22, 22, 0.4);
  transform: translateY(-2px);
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card-plan {
  font-family: 'Raleway', sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 1;
  letter-spacing: -0.01em;
  white-space: nowrap;   /* sized to fit the longest plan (e.g. Delta 274RKW), never wrap/overflow */
  color: var(--sv-green);
  text-transform: uppercase;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card-model {
  font-family: 'Rubik', sans-serif;
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
  margin-top: 5px;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card-status {
  font-family: 'Rubik', sans-serif;
  font-size: 0.56rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sv-ink-soft);
  margin-top: 9px;
  opacity: 0.85;
}
/* Now touring → solid Sonoran Visuals blue. */
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-current {
  background: var(--sv-green);
  border-color: var(--sv-green);
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-current .lineup-card-plan,
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-current .lineup-card-model,
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-current .lineup-card-status { color: #fff; opacity: 1; }
/* Coming soon → muted, non-inviting. */
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-coming {
  cursor: default;
  opacity: 0.5;
  background: var(--sv-canvas-2);
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-coming:hover {
  border-color: var(--sv-line);
  box-shadow: none;
  transform: none;
}
:root[data-oem="sonoranvisuals"] #lineup-overlay .lineup-card.is-coming .lineup-card-plan { color: var(--sv-ink-soft); }

/* ==========================================================================
   MOBILE — the Matterport-compliance block that used to live here is REMOVED.
   It replaced the master shell full-width bottom bar and slide-up bottom sheets
   with a right-edge launcher, a vertical stack, and centred popups, purely so
   nothing spanned the screen edges and covered Matterport own logo/controls
   (partner terms). This standalone shell is Pano2VR only and the Matterport path
   was stripped, so none of that applies. Mobile now falls through to the master
   shell native treatment: bottom bar plus bottom sheets that slide up.
   It also killed .bottom-sheet-handle and re-centred #concierge-panel and
   #lineup-overlay, both of which were stripped from this build anyway.
   ========================================================================== */