/* ==================================================================
 * Booking Modal Template — Question of the Moment
 * Direct port of V129 from booking-modal-concepts-v26.html.
 * Selectors scoped under #rvbt-ms-qm-root for (1,0,0) specificity.
 * ================================================================== */

#rvbt-ms-qm-root {
    /* Local design tokens (mirror V26 :root tokens) */
    --cream: #F5F2F0;
    --cream-deep: #EFEAE5;
    --ivory: #FBF8F4;
    --paper: #FFFFFF;
    --sage: #7E8B7A;
    --sage-soft: #B7C0B1;
    --sage-mist: #E5EAE0;
    --sage-line: #D7DECB;   /* waiting-list "light linen sage" set */
    --sage-deep: #4F5B46;
    --sage-darker: #39432E;
    --sage-key: #6E7C5A;
    --gold: #B0925E;
    --gold-soft: #D4BC8E;
    --gold-mist: #EFE6D3;
    --gold-deep: #8A6D38;   /* deep gold for hover/selected accents (was undefined) */
    --ink: #1A1410;
    --ink-soft: #3A332C;
    --mute: #7A6F63;
    --mute-soft: #A89E92;
    --line: #E5DED5;
    --line-soft: #EFEAE0;
    --shadow-sm: 0 2px 8px rgba(26, 20, 16, 0.04);
    --shadow-md: 0 6px 24px rgba(26, 20, 16, 0.06);
    --shadow-lg: 0 18px 60px rgba(26, 20, 16, 0.08);
    --shadow-xl: 0 32px 96px rgba(26, 20, 16, 0.10);
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;
    --r-xl: 24px;

    /* V129 root: radial cream gradient, full-viewport canvas */
    background: radial-gradient(ellipse at center, var(--ivory) 0%, var(--cream-deep) 100%);
    min-height: 100vh;
    position: relative;
    box-sizing: border-box;
    font-family: 'Inter RVBT', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    /* Explicit line-height — host body may set 1.6+, which inflates
       chip / picker heights. V129 source uses 1.6 on body but tight
       line-heights on individual components. Set our root to a neutral
       1.4 and override specific components below. */
    line-height: 1.4;
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    overflow: hidden;
}

#rvbt-ms-qm-root *,
#rvbt-ms-qm-root *::before,
#rvbt-ms-qm-root *::after {
    box-sizing: border-box;
}

/* Frame fills the canvas — center column with chips/question/pickers/foot.
   bottom padding reserved for the position:fixed .qm-foot bar. */
#rvbt-ms-qm-root .qm-frame {
    position: absolute;
    inset: 0;
    padding: 104px 32px 140px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Park corner (top-left signature) */
#rvbt-ms-qm-root .qm-park-corner {
    position: absolute;
    top: 80px;
    left: 38px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 13px;
    color: var(--mute);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

/* 5-dot wizard progress */
#rvbt-ms-qm-root .qm-dots {
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
}

#rvbt-ms-qm-root .qm-dots .d {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mute-soft);
    transition: all 0.2s ease;
}

#rvbt-ms-qm-root .qm-dots .d.done {
    background: var(--sage);
    width: 24px;
    border-radius: 4px;
}

#rvbt-ms-qm-root .qm-dots .d.active {
    background: var(--gold);
    width: 32px;
    border-radius: 4px;
    box-shadow: 0 0 0 5px var(--gold-mist);
}

/* Subhead under dots */
#rvbt-ms-qm-root .qm-park {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 14px;
    color: var(--mute);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 24px;
}

/* Chips row */
#rvbt-ms-qm-root .qm-chips {
    display: flex;
    gap: 10px;
    margin-bottom: 36px;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 760px;
}

#rvbt-ms-qm-root .qm-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink-soft);
    font-weight: 600;
    box-shadow: var(--shadow-sm);
    line-height: 1;
    white-space: nowrap;
}

#rvbt-ms-qm-root .qm-chip .ck {
    width: 14px;
    height: 14px;
    font-size: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--sage);
    color: var(--ivory);
    line-height: 1;
    flex-shrink: 0;
}

#rvbt-ms-qm-root .qm-chip [data-ms-adults-value],
#rvbt-ms-qm-root .qm-chip [data-ms-children-value],
#rvbt-ms-qm-root .qm-chip [data-ms-pets-value] {
    /* Inline counters — keep them flowing with the chip text */
    display: inline;
}

#rvbt-ms-qm-root .qm-chip.muted {
    background: transparent;
    border-style: dashed;
    color: var(--mute-soft);
    box-shadow: none;
}
/* Progress-chip states (painted by paintChips from STATE). A muted chip hides
   its check; the active step's chip gets a soft gold "current" treatment.
   Defined AFTER .muted so it wins the equal-specificity cascade. */
#rvbt-ms-qm-root .qm-chip.muted .ck { display: none; }
#rvbt-ms-qm-root .qm-chip.is-current {
    border-style: solid;
    border-color: var(--gold-soft);
    background: var(--gold-mist);
    color: var(--ink-soft);
}
/* Clickable progress chips (paintChips adds .is-nav to any chip the guest can
   jump to — earlier steps always, later steps once reachable). Pointer + a warm
   gold lift on hover/focus; non-nav chips keep the default cursor. */
#rvbt-ms-qm-root .qm-chip.is-nav {
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease, transform .12s ease;
}
#rvbt-ms-qm-root .qm-chip.is-nav:hover {
    border-style: solid;
    border-color: var(--gold-soft);
    background: var(--gold-mist);
    color: var(--ink);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}
#rvbt-ms-qm-root .qm-chip.is-nav:active { transform: translateY(0); }
#rvbt-ms-qm-root .qm-chip.is-nav:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

/* Hero question */
#rvbt-ms-qm-root .qm-q {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 88px;
    line-height: 1.02;
    color: var(--ink);
    text-align: center;
    letter-spacing: -0.018em;
    margin: 0 0 8px;
    max-width: 1000px;
    font-weight: 400;
    /* Higher stacking order + page-bg fill so the ymap visually
       slides UNDER this heading when the date picker animates in. */
    position: relative;
    z-index: 5;
    background: var(--cream);
    padding: 6px 24px;
}

#rvbt-ms-qm-root .qm-q em {
    font-style: italic;
    color: var(--gold);
}

#rvbt-ms-qm-root .qm-sub {
    font-size: 13.5px;
    color: var(--mute);
    text-align: center;
    margin: 0 0 32px;
    letter-spacing: 0.04em;
}

/* Stay-type tabs (pill toggle) */
#rvbt-ms-qm-root .qm-tabs {
    display: inline-flex;
    background: var(--paper);
    border-radius: 999px;
    padding: 5px;
    gap: 2px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 24px;
    border: 1px solid var(--line-soft);
}

#rvbt-ms-qm-root .qm-tabs .t {
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    cursor: pointer;
    border: none;
    background: transparent;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1;
}

#rvbt-ms-qm-root .qm-tabs .t.active {
    background: var(--ink);
    color: var(--ivory);
}

/* Big date pickers — arrive | arrow | depart | nights */
#rvbt-ms-qm-root .qm-pickers {
    display: flex;
    align-items: stretch;
    gap: 14px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 18px;
    box-shadow: var(--shadow-lg);
}

#rvbt-ms-qm-root .qm-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 14px 26px;
    border-radius: var(--r-lg);
    min-width: 200px;
}

#rvbt-ms-qm-root .qm-date.done {
    background: var(--ivory);
}

#rvbt-ms-qm-root .qm-date.active {
    background: var(--ink);
    color: var(--ivory);
    box-shadow: var(--shadow-md);
}

#rvbt-ms-qm-root .qm-date .dl {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}

#rvbt-ms-qm-root .qm-date.active .dl {
    color: #8b6d3a;
}

#rvbt-ms-qm-root .qm-date .dn {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 46px;
    line-height: 1;
    color: inherit;
}

#rvbt-ms-qm-root .qm-date .dm {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}

#rvbt-ms-qm-root .qm-date.active .dm {
    color: #8b6d3a;
}

#rvbt-ms-qm-root .qm-arrow {
    display: flex;
    align-items: center;
    color: var(--gold);
    font-size: 24px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
}

#rvbt-ms-qm-root .qm-nights {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    border-radius: var(--r-lg);
    background: var(--gold-mist);
    min-width: 120px;
}

#rvbt-ms-qm-root .qm-nights .nn {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 48px;
    line-height: 1;
    color: var(--gold);
}

#rvbt-ms-qm-root .qm-nights .nl {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    line-height: 1;
}

/* ── Step 1 stage: full-width carousel (date column + picker overlay removed) ─── */
#rvbt-ms-qm-root .qm-stage {
    align-self: stretch;
    width: auto;
    margin: 48px 6px 28px;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 0;
    align-items: start;
}

/* Vertical date card — slim column hugging the headline's left edge.
   No outer card; a right hairline separates it from the year strip. */
#rvbt-ms-qm-root .qm-pickers.qm-pickers--stack {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 0 18px 0 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    border-right: 1px solid var(--line-soft);
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: stretch;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
    padding: 12px 16px 14px;
    gap: 6px;
    border-radius: var(--r-md);
    background: transparent;
    transition: background .25s ease, border-color .25s ease;
    border: 1px solid transparent;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date.done {
    background: rgba(251, 248, 244, 0.6);
    border-color: var(--line-soft);
}

/* Active = currently being chosen. Soft cream-to-gold gradient with
   warm gold-leaf text. Light, refined, in-palette. */
#rvbt-ms-qm-root .qm-pickers--stack .qm-date.active {
    background: linear-gradient(229deg, #ffffff 0%, #f4eddb 100%);
    color: #8b6d3a;
    border-color: rgba(176, 146, 94, 0.35);
    box-shadow:
        0 10px 22px -14px rgba(176, 146, 94, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
    position: relative;
    overflow: hidden;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 22%;
    bottom: 22%;
    width: 2px;
    background: var(--gold);
    border-radius: 0 2px 2px 0;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    width: 100%;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date .dn {
    font-size: 44px;
    line-height: 1;
    letter-spacing: -0.02em;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date .dl {
    font-size: 9px;
}

#rvbt-ms-qm-root .qm-pickers--stack .qm-date .dm {
    margin-left: auto;
    text-align: right;
    line-height: 1.4;
    font-size: 10px;
    max-width: 60%;
}

/* Hide the heavy decorative dividers — segments stand on their own */
#rvbt-ms-qm-root .qm-pickers--stack .qm-stack-divider {
    display: none;
}

/* Nights — slim inline strip (not a heavy block).
   Sits below the dates with a hairline above and one gold mark on the left. */
#rvbt-ms-qm-root .qm-nights.qm-nights--stack {
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 10px 16px 4px;
    margin-top: 2px;
    border-radius: 0;
    background: transparent;
    border-top: 1px solid var(--line-soft);
    position: relative;
}

#rvbt-ms-qm-root .qm-nights.qm-nights--stack::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 16px;
    width: 18px;
    height: 1px;
    background: var(--gold);
}

#rvbt-ms-qm-root .qm-nights.qm-nights--stack .nn {
    font-size: 26px;
    color: var(--ink);
    letter-spacing: -0.01em;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
}

#rvbt-ms-qm-root .qm-nights.qm-nights--stack .nl {
    font-size: 9.5px;
    color: var(--mute);
    letter-spacing: 0.22em;
}

/* ── Year availability area — unified strip + decorative gold-frame overlay ───────── */
#rvbt-ms-qm-root .ymap-wrap {
    align-self: stretch;
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    display: block;
    position: relative;
    min-width: 0;
}

#rvbt-ms-qm-root .ymap-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 4px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--line-soft);
}

/* Decorative gold-bordered overlay — sits ON TOP of the leftmost card slot,
   258px wide (= mini card 248 + gap 10). Cards pan UNDER this frame.
   pointer-events:none lets clicks pass through to the cards. */
#rvbt-ms-qm-root .ymap-feature {
    position: absolute;
    top: 55px;                        /* aligns with viewport top (head + margin) */
    left: 0;
    width: 258px;
    height: 368px;
    border: 2px solid var(--gold);
    border-radius: var(--r-lg);
    background: transparent;
    pointer-events: none;
    z-index: 3;
    /* Outer drop-shadow only — the inner inset gold tint created a visible
       sliver between the border and the featured card photo. */
    box-shadow: 0 14px 28px -16px rgba(176, 146, 94, 0.45);
}

#rvbt-ms-qm-root .ymap-head .ttl {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -0.005em;
}

#rvbt-ms-qm-root .ymap-head .ttl small {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    margin-left: 12px;
}

/* ── Selected-stay summary (beneath the months carousel) ──────────────────
   Reveals once a full date range is chosen. Mirrors the template's editorial
   palette: Inter caps eyebrows for labels, Cormorant serif for the dates, and
   a soft gold pill for the night count. Slots are populated by the engine
   (paintNightsSummary): [data-ms-ns-checkin] / [data-ms-ns-checkout] /
   [data-ms-ns-nights] / [data-ms-ns-word]. */
#rvbt-ms-qm-root .qm-nights-summary {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 30px;
    width: fit-content;
    max-width: 100%;
    margin: 26px auto 0;
    padding: 16px 28px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-nights-summary[hidden] { display: none; }

#rvbt-ms-qm-root .qm-ns-leg {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
}
#rvbt-ms-qm-root .qm-ns-label {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-ns-date {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    line-height: 1;
    color: var(--ink);
    letter-spacing: -0.005em;
    white-space: nowrap;
}
/* Arrow sits between the two date legs; nudged down to align with the dates
   (not the eyebrow labels above them). */
#rvbt-ms-qm-root .qm-ns-sep {
    display: inline-flex;
    align-items: center;
    color: var(--gold);
    margin-top: 15px;
}
#rvbt-ms-qm-root .qm-ns-nights {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 13px;
    padding: 8px 18px;
    border-radius: 999px;
    background: var(--gold-mist);
    border: 1px solid var(--gold-soft);
}
#rvbt-ms-qm-root .qm-ns-nights-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    font-weight: 600;
    line-height: 1;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-ns-nights-word {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
}

/* Carousel nav chevrons */
#rvbt-ms-qm-root .ymap-nav {
    display: inline-flex;
    gap: 8px;
}

#rvbt-ms-qm-root .ymap-arrow {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--ink-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
    padding: 0;
}

#rvbt-ms-qm-root .ymap-arrow:hover:not([disabled]) {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
    transform: translateY(-1px);
}

#rvbt-ms-qm-root .ymap-arrow:active:not([disabled]) {
    transform: translateY(0) scale(0.96);
}

#rvbt-ms-qm-root .ymap-arrow[disabled] {
    opacity: 0.32;
    cursor: not-allowed;
}

/* Carousel viewport: clips the strip; sits to the right of the featured month.
   Negative margin-left pulls the viewport's left edge BEHIND the featured frame
   so mini cards visually "slide under" the frame's right border. The strip
   inside has no left padding, so the leftmost card actually starts inside the
   overlap zone (hidden by the featured frame via z-index) and emerges to the
   right of the frame. z-index keeps the viewport below the featured panel. */
#rvbt-ms-qm-root .ymap-viewport {
    position: relative;
    overflow: hidden;
    align-self: center;
    /* 10px padding so the leftmost card has a 10px gap inside the gold border */
    padding-left: 10px;
    z-index: 1;
    height: 368px;
    /* Soft edge mask only on the RIGHT — left side passes cleanly under the frame */
    -webkit-mask-image: linear-gradient(90deg, black 0, black calc(100% - 24px), transparent 100%);
            mask-image: linear-gradient(90deg, black 0, black calc(100% - 24px), transparent 100%);
}

/* Strip is wider than the viewport — translateX moves it. */
#rvbt-ms-qm-root .ymap-strip {
    display: flex;
    align-items: center;
    /* 20px gap so the gap between the gold border's right edge and the next
       visible card is 10px (= strip-gap 20 minus the 10px inside-border gap
       on the featured card's right). stepWidth() reads this dynamically so
       the carousel snap math stays correct. */
    gap: 20px;
    height: 100%;
    will-change: transform;
    transition: transform .45s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#rvbt-ms-qm-root .mini {
    /* Regular (non-featured) cards: 210×348. The featured card overrides
       flex-basis to 238 below — and the carousel's snap math reads each
       card's actual offsetLeft so variable widths work correctly. */
    flex: 0 0 210px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 12px 16px;
    border: 1px solid var(--line-soft);
    border-radius: var(--r-md);
    background: var(--ivory);
    transition: background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
    cursor: pointer;
    min-width: 0;
    height: 348px;
    align-self: center;
}

#rvbt-ms-qm-root .mini:hover {
    border-color: var(--gold-soft);
    background: #FFFCF6;
    transform: translateY(-3px);
    box-shadow: 0 12px 24px -16px rgba(26, 20, 16, 0.18);
}

#rvbt-ms-qm-root .mini.cur {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.9) 0%, transparent 70%),
        linear-gradient(180deg, #FBF8F4 0%, #F4ECD9 100%);
    border-color: var(--gold);
    box-shadow: 0 14px 28px -16px rgba(176, 146, 94, 0.45), inset 0 0 0 1px rgba(176, 146, 94, 0.12);
}

/* ────────────────────────────────────────────────────────────────────────────
   .is-featured — applied by JS to whichever strip card is currently at idx 0
   under the gold-border overlay. The card keeps its 238×348 layout box (so
   carousel snap math holds and no overlap with neighbors) and gains the
   hover-look styling permanently: gold border, brighter photo bg, darker
   text. Rich content (calendar grid + date range + "Your selection") is
   injected by JS.
   ──────────────────────────────────────────────────────────────────────────── */
#rvbt-ms-qm-root .mini.is-featured {
    border-color: var(--gold);
    background-color: transparent;
    box-shadow: 0 18px 36px -18px rgba(26, 20, 16, 0.5);
    z-index: 1;
    /* Featured card is 238×348 — wider than the 210 mini cards so it visually
       fills the gold border with 10px gap on all four sides. */
    flex: 0 0 238px;
}
/* (Featured-card cream-wash overlay removed — the in-range scrim handles
   contrast against the seasonal photo, no double overlay needed.) */
/* Darker text on the lighter overlay (mirrors hover legibility treatment) */
#rvbt-ms-qm-root .mini.is-featured[data-season] .nm        { color: #2d2316; text-shadow: 0 1px 2px rgba(255, 250, 235, 0.6); }
#rvbt-ms-qm-root .mini.is-featured[data-season] .occ-num   { color: #2d2316; text-shadow: none; }
#rvbt-ms-qm-root .mini.is-featured[data-season] .occ-num small { color: #654f2a; text-shadow: none; }
#rvbt-ms-qm-root .mini.is-featured[data-season] .occ-label,
#rvbt-ms-qm-root .mini.is-featured[data-season] .occ-tier  { color: #2d2316; }
/* "Your selection" subtitle under the month name — visible only on featured */
#rvbt-ms-qm-root .mini .nm .your-selection { display: none; }
#rvbt-ms-qm-root .mini.is-featured .nm .your-selection {
    display: block;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 8.5px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #654f2a;
    font-weight: 600;
    margin-top: 3px;
}
#rvbt-ms-qm-root .mini.is-featured .mini-grid,
#rvbt-ms-qm-root .mini.is-featured .month-occ {
    display: none !important;
}
#rvbt-ms-qm-root .mini.is-featured .nm {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: #7f6435;
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 1;
    text-align: left;
    font-weight: 500;
}

/* The injected featured content sits below the month name, fills the rest
   of the card. Calendar grid + date range meta. */
#rvbt-ms-qm-root .mini.is-featured .feature-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;
    width: 100%;
    margin-top: 8px;
}
#rvbt-ms-qm-root .mini.is-featured .feature-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}
#rvbt-ms-qm-root .mini.is-featured .feature-grid .d {
    /* No aspect-ratio — cells fill their grid cell (1fr × 1fr). Aspect-ratio
       was making cells square based on row height (33), which forced columns
       wider than the grid and caused horizontal overflow / clipping. */
    background: transparent;
    border-radius: 2px;
    min-width: 0;
    min-height: 0;
    transition: background .15s ease;
}
#rvbt-ms-qm-root .mini.is-featured .feature-grid .d.has {
    background: rgba(255, 250, 235, 0.45);
}
#rvbt-ms-qm-root .mini.is-featured .feature-grid .d.range {
    background: #8f7952b5;
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.18);
}
#rvbt-ms-qm-root .mini.is-featured .feature-grid .d.endpoint {
    background: #00000082;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3);
}
#rvbt-ms-qm-root .mini.is-featured .feature-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding-top: 10px;
}

/* ─── Interactive cal-grid (built on every card, shown by state) ───────────
   Decorative cards hide it. Featured / in-range / ranging-mode reveal it.
   Selected days carry .is-arrive / .is-depart, in-between days .is-range. */
#rvbt-ms-qm-root .mini .cal-grid {
    display: none;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 2px;
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    margin-top: 4px;
    padding: 0;
}
#rvbt-ms-qm-root .mini.is-featured .cal-grid,
#rvbt-ms-qm-root .mini.in-range .cal-grid,
#rvbt-ms-qm-root .ymap-wrap.is-ranging .mini .cal-grid {
    display: grid;
}
#rvbt-ms-qm-root .mini .cal-grid .d {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    /* Dark text — the in-range / ranging scrim now lightens the cell area,
       so dark digits read clearly against the cream-tinted photo. */
    color: rgba(26, 20, 16, 0.88);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    line-height: 1;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    min-width: 0;
    min-height: 0;
    transition: background .14s ease, color .14s ease, border-color .14s ease;
}
#rvbt-ms-qm-root .mini .cal-grid .d.has {
    background: rgba(255, 250, 235, 0.18);
}
#rvbt-ms-qm-root .ymap-wrap.is-ranging .mini .cal-grid .d.has:hover {
    background: rgba(26, 20, 16, 0.10);
    color: #1a1410;
    border-color: rgba(26, 20, 16, 0.18);
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-other {
    color: rgba(26, 20, 16, 0.30);
    cursor: default;
    pointer-events: none;
    background: transparent;
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-range {
    background: rgba(176, 146, 94, 0.70);
    color: #fff5e1;
    border-radius: 0;
    font-weight: 600;
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive,
#rvbt-ms-qm-root .mini .cal-grid .d.is-depart {
    background: #1a1410;
    color: #fff;
    border-color: #1a1410;
    box-shadow: 0 6px 16px -8px rgba(0, 0, 0, 0.65);
    font-weight: 700;
    border-radius: 6px;
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-depart {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive.is-depart {
    border-radius: 6px;
}
/* During ranging mode (or after a finalized selection), every in-play card
   — INCLUDING the featured one — gets a soft scrim so the grid + meta read
   crisply against the seasonal photo backgrounds. Top half stays bright so
   the calendar cells / day numbers feel airy; bottom half darkens so the
   white date/nights meta reads with strong contrast. */
#rvbt-ms-qm-root .ymap-wrap.is-ranging .mini::after,
#rvbt-ms-qm-root .mini.in-range::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(255, 250, 235, 0.18) 0%,
        rgba(255, 250, 235, 0.06) 38%,
        rgba(20, 14, 8, 0.30) 62%,
        rgba(20, 14, 8, 0.70) 100%);
    pointer-events: none;
    z-index: 0;
    transition: background .25s ease;
}
/* Featured card with selection — DEFAULT: softer cream wash up top with
   a moderate dark anchor at the bottom so the WHITE date/nights meta
   stays clearly readable. HOVER: same shape but deeper / more saturated
   for emphasis. Meta text is white in both states. */
#rvbt-ms-qm-root .mini.is-featured.in-range::after,
#rvbt-ms-qm-root .mini.is-featured.in-range:hover::after {
    background: linear-gradient(180deg,
        rgba(251, 248, 244, 0.55) 0%,
        rgba(244, 236, 217, 0.42) 45%,
        rgba(20, 14, 8, 0.45) 70%,
        rgba(20, 14, 8, 0.82) 100%);
}
/* Apply the cream-wash :hover::before treatment by DEFAULT for the
   selected featured card — this is the layer that makes the hover look
   appear "soft + open". User wants this visible without needing to hover. */
#rvbt-ms-qm-root .mini.is-featured.in-range[data-season]::before {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.45) 0%, rgba(255, 250, 235, 0.22) 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.42) 0%,
            rgba(244, 236, 217, 0.28) 50%,
            rgba(244, 236, 217, 0.38) 100%) !important;
}
/* Month name sits in the light upper area → dark ink for legibility */
#rvbt-ms-qm-root .mini.is-featured.in-range .nm {
    color: #2d2316;
    text-shadow: 0 1px 2px rgba(255, 250, 235, 0.7);
}
/* Meta (date range + nights) — WHITE in both default + hover, anchored
   by the dark bottom of the gradient. Heavy text-shadow holds legibility
   even where the gradient softens. */
#rvbt-ms-qm-root .mini.is-featured.in-range .feature-meta .lbl {
    color: #fff;
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 0.55),
        0 0 14px rgba(0, 0, 0, 0.35);
}
#rvbt-ms-qm-root .mini.is-featured.in-range .feature-meta .val {
    color: rgba(255, 245, 220, 0.94);
    text-shadow:
        0 2px 6px rgba(0, 0, 0, 0.55),
        0 0 12px rgba(0, 0, 0, 0.30);
}
#rvbt-ms-qm-root .mini { position: relative; }
#rvbt-ms-qm-root .mini > .nm,
#rvbt-ms-qm-root .mini > .cal-grid,
#rvbt-ms-qm-root .mini > .month-occ,
#rvbt-ms-qm-root .mini > .feature-content { position: relative; z-index: 1; }
/* Cursor hint: during ranging, the carousel itself reads as actionable */
#rvbt-ms-qm-root .ymap-wrap.is-ranging .mini { cursor: pointer; }
/* The featured-card grid is the user's anchor — explicit "click to start" hint */
#rvbt-ms-qm-root .ymap-wrap:not(.is-ranging) .mini.is-featured .cal-grid .d.has {
    cursor: pointer;
}

/* ─── Range-select hint overlay (animated "gif" over featured card) ──────
   Fires when guest clicks Continue without dates. A cursor traces from
   start to end; "Click to start" and "Click to end" tips fade in at each
   anchor. Uses CSS keyframes only (no JS animation tick / no GIF asset). */
#rvbt-ms-qm-root .mini.is-featured .bm-range-hint {
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    opacity: 0;
    transition: opacity .35s ease;
    border-radius: inherit;
    overflow: hidden;
}
#rvbt-ms-qm-root .mini.is-featured .bm-range-hint.is-visible { opacity: 1; }
#rvbt-ms-qm-root .mini.is-featured .bm-range-hint.is-leaving { opacity: 0; }
#rvbt-ms-qm-root .bm-range-hint .bm-rh-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(20, 14, 8, 0.62) 0%,
        rgba(20, 14, 8, 0.78) 100%);
}
#rvbt-ms-qm-root .bm-range-hint .bm-rh-caption {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    width: 86%;
    text-align: center;
    color: #fff;
}
#rvbt-ms-qm-root .bm-range-hint .bm-rh-caption strong {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.01em;
    margin-bottom: 4px;
    color: #fff;
}
#rvbt-ms-qm-root .bm-range-hint .bm-rh-caption span {
    display: block;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255, 250, 240, 0.88);
}
/* The cursor — sits at "start" cell, glides to "end" cell, loops */
#rvbt-ms-qm-root .bm-range-hint .bm-rh-cursor {
    position: absolute;
    top: 40%;
    left: 18%;
    width: 22px;
    height: 22px;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.55));
    animation: bm-rh-cursor-path 4.2s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
}
@keyframes bm-rh-cursor-path {
    0%, 8%   { top: 40%; left: 18%; opacity: 0; transform: scale(0.85); }
    14%      { top: 40%; left: 18%; opacity: 1; transform: scale(1); }
    /* Click pulse at start */
    18%      { transform: scale(0.78); }
    22%      { transform: scale(1); }
    /* Glide to end cell */
    55%      { top: 56%; left: 70%; opacity: 1; transform: scale(1); }
    /* Click pulse at end */
    62%      { transform: scale(0.78); }
    66%      { transform: scale(1); }
    /* Hold then fade */
    85%      { opacity: 1; transform: scale(1); }
    100%     { top: 56%; left: 70%; opacity: 0; transform: scale(0.85); }
}
/* "Click to start" tip — appears at start position */
#rvbt-ms-qm-root .bm-range-hint .bm-rh-tip {
    position: absolute;
    padding: 5px 10px;
    background: #fff;
    color: #1a1410;
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 8px 22px -10px rgba(0, 0, 0, 0.55);
    opacity: 0;
}
#rvbt-ms-qm-root .bm-range-hint .bm-rh-tip--start {
    top: calc(40% - 22px);
    left: 18%;
    transform: translateX(-30%);
    animation: bm-rh-tip-start 4.2s ease-in-out infinite;
}
#rvbt-ms-qm-root .bm-range-hint .bm-rh-tip--end {
    top: calc(56% - 22px);
    left: 70%;
    transform: translateX(-50%);
    animation: bm-rh-tip-end 4.2s ease-in-out infinite;
}
@keyframes bm-rh-tip-start {
    0%, 8%   { opacity: 0; }
    14%, 28% { opacity: 1; }
    36%, 100% { opacity: 0; }
}
@keyframes bm-rh-tip-end {
    0%, 50%  { opacity: 0; }
    58%, 78% { opacity: 1; }
    86%, 100% { opacity: 0; }
}
#rvbt-ms-qm-root .mini.is-featured .feature-meta .lbl {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    line-height: 1.05;
    letter-spacing: 0.005em;
    color: #fff;
    font-weight: 500;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
    width: 100%;
    text-transform: none;
}
#rvbt-ms-qm-root .mini.is-featured .feature-meta .val {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-style: normal;
    font-size: 13px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 245, 220, 0.92);
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
    width: 100%;
}

#rvbt-ms-qm-root .mini .nm {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-align: center;
    line-height: 1;
}

#rvbt-ms-qm-root .mini.cur .nm {
    color: var(--gold);
}

#rvbt-ms-qm-root .mini-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

#rvbt-ms-qm-root .mini-grid .d {
    aspect-ratio: 1 / 1;
    background: transparent;
    border-radius: 2px;
    transition: background .15s ease;
}

#rvbt-ms-qm-root .mini-grid .d.has {
    background: var(--line-soft);
}

#rvbt-ms-qm-root .mini:hover .mini-grid .d.has {
    background: var(--line);
}

#rvbt-ms-qm-root .mini-grid .d.range {
    background: var(--gold);
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.18);
}

#rvbt-ms-qm-root .mini-grid .d.endpoint {
    background: var(--ink);
    box-shadow: 0 0 0 1px rgba(26, 20, 16, 0.6);
}

/* Edge fades — soften the carousel boundary even past the mask */
#rvbt-ms-qm-root .ymap-fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 56px;
    pointer-events: none;
    z-index: 2;
}

#rvbt-ms-qm-root .ymap-fade--left {
    /* Hidden — cards now pass cleanly behind the featured frame's right border
       instead of fading at the viewport edge. */
    display: none;
}

#rvbt-ms-qm-root .ymap-fade--right {
    right: 0;
    background: linear-gradient(270deg, var(--cream) 0%, rgba(245, 242, 240, 0) 100%);
}

/* Hide the right fade when the strip can't slide further right (no off-screen content) */
#rvbt-ms-qm-root .ymap-wrap[data-ms-ymap-at-end="1"] .ymap-fade--right { opacity: 0; transition: opacity .25s ease; }
#rvbt-ms-qm-root .ymap-wrap[data-ms-ymap-at-start="1"] .ymap-fade--left { opacity: 0; transition: opacity .25s ease; }

/* Foot: preview (left) + cta (right) */
/* Foot is pinned to viewport bottom across every step that ships it.
   position:fixed used because #rvbt-ms-qm-root has overflow:hidden which
   breaks position:sticky inside this layout. */
#rvbt-ms-qm-root .qm-foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: none;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 24px max(32px, calc((100vw - 1100px) / 2)) 28px;
    z-index: 3;
    isolation: isolate;
    background: linear-gradient(to top, var(--cream) 0%, var(--cream) 55%, rgba(245, 242, 240, 0) 100%);
    pointer-events: auto;
}

#rvbt-ms-qm-root .qm-preview {
    flex: 1;
    text-align: left;
    color: var(--mute-soft);
    font-size: 11.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1.6;
    border-left: 1px dashed var(--line);
    padding-left: 16px;
}

#rvbt-ms-qm-root .qm-preview b {
    display: block;
    font-size: 9.5px;
    letter-spacing: 0.24em;
    color: var(--mute);
    font-weight: 600;
    margin-bottom: 6px;
}

#rvbt-ms-qm-root .qm-cta {
    display: flex;
    align-items: center;
    gap: 14px;
}

#rvbt-ms-qm-root .qm-signin {
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-decoration: none;
    padding: 14px 0;
}

#rvbt-ms-qm-root .qm-signin:hover {
    color: var(--ink);
}

#rvbt-ms-qm-root .cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 24px;
    border-radius: 999px;
    background: var(--ink);
    color: var(--ivory);
    border: 0;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1;
    box-shadow: var(--shadow-md);
    transition: background 0.18s ease;
}

#rvbt-ms-qm-root .cta:hover { background: var(--gold); }

#rvbt-ms-qm-root .cta .arrow {
    color: var(--gold);
    font-size: 14px;
}

#rvbt-ms-qm-root .cta:hover .arrow { color: var(--ivory); }

/* Faint mountain silhouette at bottom */
/* Mountains decorate the area behind/around qm-foot. JS relocates the
   <svg.qm-mtns> inside .qm-foot at runtime so they travel together when
   qm-foot becomes sticky at the bottom of the viewport. */
#rvbt-ms-qm-root .qm-mtns {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100vw;
    max-width: 100vw;
    height: 140px;
    pointer-events: none;
    opacity: 0.18;
    z-index: -1;
}

/* Mobile fallback */
@media (max-width: 1100px) {
    #rvbt-ms-qm-root .qm-stage { grid-template-columns: 1fr; gap: 22px; }
    #rvbt-ms-qm-root .qm-pickers.qm-pickers--stack { grid-column: 1; grid-row: auto; }
    #rvbt-ms-qm-root .ymap-wrap { grid-column: 1; grid-row: auto; }
    #rvbt-ms-qm-root .ymap-strip { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 900px) {
    #rvbt-ms-qm-root .qm-q { font-size: 56px; }
    #rvbt-ms-qm-root .qm-pickers { flex-direction: column; gap: 10px; }
    #rvbt-ms-qm-root .qm-date,
    #rvbt-ms-qm-root .qm-nights { width: 100%; min-width: 0; }
    #rvbt-ms-qm-root .qm-arrow { transform: rotate(90deg); justify-content: center; }
    #rvbt-ms-qm-root .qm-foot { flex-direction: column; align-items: stretch; gap: 18px; }
    #rvbt-ms-qm-root .qm-preview { border-left: 0; padding-left: 0; border-top: 1px dashed var(--line); padding-top: 14px; }
    #rvbt-ms-qm-root .qm-park-corner { display: none; }
}
@media (max-width: 600px) {
    #rvbt-ms-qm-root .qm-q { font-size: 40px; }
    #rvbt-ms-qm-root .qm-frame { padding: 80px 18px 32px 18px; }
    #rvbt-ms-qm-root .ymap-strip { grid-template-columns: repeat(4, 1fr); }
    #rvbt-ms-qm-root .ymap-wrap { padding: 18px 16px; }
    #rvbt-ms-qm-root .ymap-head .ttl { font-size: 18px; }
    #rvbt-ms-qm-root .qm-nights-summary { gap: 12px 20px; padding: 14px 18px; margin-top: 20px; }
    #rvbt-ms-qm-root .qm-ns-date { font-size: 20px; }
    #rvbt-ms-qm-root .qm-ns-nights-num { font-size: 22px; }
}

/* ==================================================================
 * Steps 2–5 — V129-aesthetic styles for sites/add-ons/guest/review.
 * All scoped under #rvbt-ms-qm-root for (1,0,0) specificity.
 * ================================================================== */

/* Frame variant for steps with longer content — let the canvas scroll.
   Bottom padding MUST out-size the fixed .qm-foot bar (~110px tall on
   desktop): it's the only thing letting the last content row scroll up
   past the footer. At the old 40px the final ~70px of every scroll step
   was permanently trapped under the footer (ms88 finding — the group
   panel's bottom row was unclickable at max scroll). */
#rvbt-ms-qm-root .qm-frame--scroll {
    position: relative;
    inset: auto;
    padding: 60px 32px 180px 32px;
}

/* Override the global `.qm-q { font-size: 88px }` for steps 2-5 — too tall
   when the page also has cards/forms. Bring it down to ~52px so the
   question stays the focal point but the rest fits the viewport. */
#rvbt-ms-qm-root[data-ms-step="2"] .qm-q,
#rvbt-ms-qm-root[data-ms-step="3"] .qm-q,
#rvbt-ms-qm-root[data-ms-step="4"] .qm-q,
#rvbt-ms-qm-root[data-ms-step="5"] .qm-q {
    font-size: 52px;
    margin-bottom: 6px;
    max-width: 880px;
}

/* ── Step 2 — Sites ─────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-toolbar {
    display: flex;
    align-items: center;
    /* Left-docked: the List/Map pill sits flush with the 780px content
       column's left edge (same rail as qm-sfilters / qm-group-bar /
       the lists), so every block on the step shares one left line. */
    justify-content: flex-start;
    width: 100%;
    max-width: 780px;
    margin: 8px auto 16px;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-tools-left {
    display: inline-flex;
    background: var(--paper);
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
    border: 1px solid var(--line-soft);
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-toggle {
    padding: 7px 16px;
    border-radius: 999px;
    background: transparent;
    border: 0;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    cursor: pointer;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.18s ease, background 0.18s ease;
}
#rvbt-ms-qm-root .qm-toggle svg { width: 13px; height: 13px; }
#rvbt-ms-qm-root .qm-toggle:hover { color: var(--ink); }
/* ── Filters reveal button — funnel pill docked on the RIGHT edge of
       the toolbar row (List/Map pill holds the left); unfolds the
       qm-sfilters rail below. Same pill language + height as the toggle
       group; open state fills with the rail's gold voice. The badge
       counts engaged filters so a collapsed rail never hides that the
       list is being narrowed. ── */
#rvbt-ms-qm-root .qm-filters-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;   /* right-dock: pushes to the container's right edge */
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: 999px;
    padding: 11px 16px;
    box-shadow: var(--shadow-sm);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    cursor: pointer;
    line-height: 1;
    transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}
#rvbt-ms-qm-root .qm-filters-btn svg { width: 13px; height: 13px; }
#rvbt-ms-qm-root .qm-filters-btn:hover { color: var(--ink); }
#rvbt-ms-qm-root .qm-filters-btn.is-open {
    background: rgba(176, 146, 94, 0.12);
    border-color: rgba(176, 146, 94, 0.45);
    color: var(--gold-deep);
}
#rvbt-ms-qm-root .qm-filters-n {
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--gold-deep);
    color: #FFF9EC;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#rvbt-ms-qm-root .qm-filters-n[hidden] { display: none; }
#rvbt-ms-qm-root .qm-toggle.is-active {
    background: linear-gradient(180deg, var(--ink-soft) 0%, var(--ink) 100%);
    color: var(--ivory);
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
#rvbt-ms-qm-root .qm-multi {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: var(--mute);
    letter-spacing: 0.04em;
}

#rvbt-ms-qm-root .qm-sites {
    /* ms21: full-width Atelier cards stacked under category dividers */
    display: block;
    width: 100%;
    max-width: 780px;
    margin: 0 auto 14px;
}
#rvbt-ms-qm-root .qm-site {
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 14px 16px;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: relative;
}
#rvbt-ms-qm-root .qm-site:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}
#rvbt-ms-qm-root .qm-site.is-selected {
    border-color: var(--ink);
    box-shadow: 0 0 0 3px var(--gold-mist);
}
#rvbt-ms-qm-root .qm-site-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
#rvbt-ms-qm-root .qm-site-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.1;
}
#rvbt-ms-qm-root .qm-site-cost {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 16px;
    color: var(--gold);
}
#rvbt-ms-qm-root .qm-site-meta {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mute);
    line-height: 1.4;
}
#rvbt-ms-qm-root .qm-site-toosmall {
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #a43333;
    margin-top: 4px;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-map-host {
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-ms-qm-root .qm-map-placeholder {
    background: var(--paper);
    border: 1px dashed var(--line);
    border-radius: var(--r-lg);
    padding: 36px 20px;
    text-align: center;
    color: var(--mute);
    font-size: 13px;
}
#rvbt-ms-qm-root .qm-waitlist {
    color: var(--mute);
    font-size: 11px;
    letter-spacing: 0.04em;
    text-decoration: underline;
    text-underline-offset: 3px;
    margin-bottom: 16px;
}
#rvbt-ms-qm-root .qm-waitlist:hover { color: var(--ink); }

/* ──────────────────────────────────────────────────────────────────
   Step 5 — Sites (extended: group bar, loading/error/empty, card foot,
   map polygons + tooltip + legend)
   ────────────────────────────────────────────────────────────────── */

/* Group-booking bar — shown when 1+ sites selected */
#rvbt-ms-qm-root .qm-group-bar {
    width: 100%;
    max-width: 780px;
    margin: 0 auto 14px;
    padding: 12px 18px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.7) 0%, rgba(244, 238, 226, 0.65) 100%);
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}
#rvbt-ms-qm-root .qm-group-bar[hidden] { display: none; }
#rvbt-ms-qm-root .qm-group-bar-text {
    display: inline-flex;
    /* baseline (not center): the count is now a sans figure close in size
       to the label, so a shared BASELINE is what actually puts the two on
       one line — and it survives a label that wraps to a second line
       (the number stays locked to the first line instead of drifting to
       the block's middle). */
    align-items: baseline;
    gap: 8px;
    /* Selected-count copy holds the bar's LEFT edge; the View button's
       auto margin docks the View / Clear-all pills on the right. */
}
#rvbt-ms-qm-root .qm-group-bar-text strong {
    /* ms234 — was 26px Cormorant + transform:translateY(2px).
       CormorantGaramond-600.woff2 ships OLD-STYLE figures: 3/5/7/9 drop to
       -275 units BELOW the baseline, 4 to -190, while 6 rises to 661 and 8
       to 574 and 1/2 only reach x-height. So the count changed height AND
       vertical position with every value, and no single translate could
       line it up — "1 site selected" looked fine while "3 sites selected"
       hung a quarter-em low. Inter (already loaded, 600 cut) with lining +
       tabular figures gives one flat, even digit height at every count, and
       it reads plainly at a glance instead of decoratively. Sized close to
       the label so number + label scan as a single line. */
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 15px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--gold-deep);
    font-variant-numeric: lining-nums tabular-nums;
    -webkit-font-feature-settings: 'lnum' 1, 'tnum' 1;
    font-feature-settings: 'lnum' 1, 'tnum' 1;
}
#rvbt-ms-qm-root .qm-group-bar-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-group-clear {
    background: transparent;
    border: 1px solid rgba(176,146,94,0.28);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
#rvbt-ms-qm-root .qm-group-clear:hover {
    color: #C57878;
    border-color: #C57878;
    background: #FFF1F1;
}
/* "View" — opens the selection-cart popup; the positive twin of the
   quiet/destructive Clear-all pill. Shown only when 1+ picks exist
   (paintGroupCount toggles display). */
#rvbt-ms-qm-root .qm-group-view {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;   /* docks the View + Clear-all pair on the right */
    background: rgba(176, 146, 94, 0.12);
    border: 1px solid rgba(176, 146, 94, 0.45);
    color: var(--gold-deep);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
#rvbt-ms-qm-root .qm-group-view svg {
    width: 13px;
    height: 13px;
    display: block;
    /* Optical fix: the cart drawing sits low in its 16×16 viewBox
       (empty space above the basket rim) — lift it to the label's
       visual center. */
    margin-top: -1px;
}
#rvbt-ms-qm-root .qm-group-view:hover {
    background: var(--gold-deep);
    border-color: var(--gold-deep);
    color: #FFF9EC;
}
/* ── qm-sdiv--filter — sub-bar under the selection bar: the Category
       filter (left slot) + a browsing title in the category-divider
       design (qm-sdiv-t: "Sites" or the picked category — it replaces
       the per-category dividers in the list) stacked over the
       single-or-group hint (right). Width-locked to the selection bar
       above so the two read as one unit. Filled/toggled by
       paintSiteFilters(). The doubled .qm-sdiv.qm-sdiv--filter selector
       deliberately outranks the base .qm-sdiv divider rules
       (text-align:center / margins) that sit later in this file. ── */
#rvbt-ms-qm-root .qm-sdiv.qm-sdiv--filter {
    width: 100%;
    max-width: 780px;
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    text-align: left;
}
#rvbt-ms-qm-root .qm-sdiv.qm-sdiv--filter[hidden] { display: none; }
#rvbt-ms-qm-root .qm-sdiv--filter .qm-sdiv-cat { display: inline-flex; align-items: center; }
#rvbt-ms-qm-root .qm-sdiv--filter .qm-sdiv-right {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    text-align: right;
}
#rvbt-ms-qm-root .qm-sdiv--filter .qm-multi--hint { text-align: right; }
/* Availability counter riding the browsing title — same number + uppercase-
   label voice as the selection bar's counter (ms234: both moved off the
   serif onto Inter lining figures), split off the title by a hairline
   rule. */
#rvbt-ms-qm-root .qm-sdiv--filter .qm-sdiv-t .qm-sdiv-t-n {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    margin-left: 6px;
    padding-left: 13px;
    border-left: 1px solid rgba(176, 146, 94, 0.35);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 500;
    color: var(--mute);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-sdiv--filter .qm-sdiv-t .qm-sdiv-t-n b {
    /* ms234 — twin of the selection-bar count, same reason: Cormorant's
       old-style figures hung 3/5/7/9 a quarter-em BELOW the shared
       baseline this row already aligns on, so "7 available" read as a
       dropped digit. Inter lining/tabular figures sit level at every
       value. One step down from the bar's 15px — this counter is the
       subordinate of the two. */
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--gold-deep);
    font-variant-numeric: lining-nums tabular-nums;
    -webkit-font-feature-settings: 'lnum' 1, 'tnum' 1;
    font-feature-settings: 'lnum' 1, 'tnum' 1;
}
/* "Back to Categories" — replaces the Select Category dropdown while a
   category's site list is open (drilled view); returns to the index. */
#rvbt-ms-qm-root .qm-catback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--paper);
    border: 1px solid rgba(176, 146, 94, 0.45);
    border-radius: 999px;
    padding: 13px 20px;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-deep);
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
#rvbt-ms-qm-root .qm-catback:hover { background: var(--gold-mist); }
#rvbt-ms-qm-root .qm-catback svg { width: 14px; height: 14px; stroke: currentColor; fill: none; }
/* Wider category field — it's the sub-bar's main control now; the caret
   docks on the field's right edge like a classic select. */
#rvbt-ms-qm-root .qm-sdiv--filter .qm-ffield { min-width: 260px; }
#rvbt-ms-qm-root .qm-sdiv--filter .qm-ffield-v { width: 100%; }
#rvbt-ms-qm-root .qm-sdiv--filter .qm-ffield .qm-fcaret { margin-left: auto; }
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-sdiv.qm-sdiv--filter { flex-wrap: wrap; row-gap: 6px; }
    #rvbt-ms-qm-root .qm-sdiv--filter .qm-ffield { min-width: 0; width: 100%; }
}

/* Loading skeleton */
#rvbt-ms-qm-root .qm-sites-loading {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-ms-qm-root .qm-sites-loading[hidden] { display: none; }
#rvbt-ms-qm-root .qm-skel-card {
    height: 124px;
    border-radius: var(--r-lg);
    background:
        linear-gradient(90deg, rgba(255,254,251,0.4) 0%, rgba(244,238,226,0.7) 50%, rgba(255,254,251,0.4) 100%);
    background-size: 200% 100%;
    border: 1px solid rgba(176, 146, 94, 0.12);
    animation: qm-skeleton-shimmer 1.4s ease-in-out infinite;
}
@keyframes qm-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Error + empty states */
#rvbt-ms-qm-root .qm-sites-error,
#rvbt-ms-qm-root .qm-sites-empty {
    width: 100%;
    max-width: 760px;
    margin: 4px auto 14px;
    padding: 22px 24px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.7) 0%, rgba(244, 238, 226, 0.6) 100%);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-sites-error[hidden],
#rvbt-ms-qm-root .qm-sites-empty[hidden] { display: none; }
#rvbt-ms-qm-root .qm-state-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ivory);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-state-icon--soft {
    background: #c9bba0;
    font-weight: 400;
    font-size: 16px;
}
#rvbt-ms-qm-root .qm-state-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-state-sub {
    margin-top: 3px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    color: var(--ink-soft);
    line-height: 1.4;
}

/* Site card improvements — meta dot, foot row with Select button */
#rvbt-ms-qm-root .qm-site-meta {
    display: flex;
    align-items: center;
    gap: 6px;
}
#rvbt-ms-qm-root .qm-site-dot {
    color: rgba(0,0,0,0.25);
    font-size: 14px;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-site-foot {
    margin-top: 6px;
    padding-top: 10px;
    border-top: 1px solid rgba(176,146,94,0.14);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
#rvbt-ms-qm-root .qm-site-select {
    background: transparent;
    border: 1px solid rgba(176,146,94,0.32);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    margin-left: auto;
}
#rvbt-ms-qm-root .qm-site-select:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
}
#rvbt-ms-qm-root .qm-site.is-selected .qm-site-select {
    background: linear-gradient(180deg, var(--gold) 0%, var(--gold-deep) 100%);
    border-color: var(--gold-deep);
    color: var(--ivory);
    box-shadow: 0 3px 10px rgba(176, 146, 94, 0.28);
}
#rvbt-ms-qm-root .qm-site.is-selected .qm-site-select::before {
    content: "✓ ";
    margin-right: 2px;
}
#rvbt-ms-qm-root .qm-site.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
#rvbt-ms-qm-root .qm-site.is-disabled .qm-site-select { display: none; }
#rvbt-ms-qm-root .qm-site-cat {
    color: var(--gold-deep);
    font-weight: 600;
}

/* ─── Map view (scoped overrides for the shared rvbt-ms-map* shell) ── */
#rvbt-ms-qm-root .qm-map-host {
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.6) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: var(--r-lg);
    padding: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
}
#rvbt-ms-qm-root .qm-map-host[hidden] { display: none; }
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map {
    position: relative;
    border-radius: var(--r-md);
    overflow: hidden;
    background: #ECE6D9;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__img {
    display: block;
    width: 100%;
    height: auto;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
/* Polygon strokes render in SCREEN px (vector-effect: non-scaling-stroke
   set by renderMap) — the map image is ~2560px displayed at ~850px, so
   viewBox-scaled strokes thinned to ~0.5px and the overlays vanished
   into the map art (ms77 fix). States must read at a glance:
   gold glow = open · darkened = unavailable · sage = yours. */
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__poly {
    pointer-events: all;
    transition: fill 0.18s ease, stroke 0.18s ease, stroke-width 0.18s ease;
    stroke-width: 2;
    stroke-linejoin: round;
}
/* ms79 color scheme (user spec): GREEN = available · RED = unavailable.
   Selected = deep forest green, heavier fill + stroke than available. */
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__poly[data-state="available"] {
    fill: rgba(76, 160, 80, 0.42);
    stroke: #2F7D33;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__poly[data-state="available"]:hover {
    fill: rgba(76, 160, 80, 0.62);
    stroke: #256628;
    stroke-width: 3;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__poly[data-state="selected"] {
    fill: rgba(27, 94, 32, 0.72);
    stroke: #104014;
    stroke-width: 3;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__poly[data-state="booked"] {
    fill: rgba(211, 66, 56, 0.40);
    stroke: rgba(160, 38, 30, 0.75);
    stroke-width: 1.5;
    cursor: not-allowed;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip {
    position: absolute;
    background: var(--ink);
    color: var(--ivory);
    padding: 10px 14px;
    border-radius: var(--r-md);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    line-height: 1.4;
    pointer-events: none;
    z-index: 10;
    max-width: 220px;
    box-shadow: 0 6px 22px rgba(0,0,0,0.25);
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip[hidden] { display: none; }
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip strong {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    color: var(--ivory);
    display: block;
    margin-bottom: 2px;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip-cat {
    display: block;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
    margin-top: 2px;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip-price {
    display: block;
    color: var(--gold);
    font-weight: 600;
    margin-top: 4px;
    font-size: 13px;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip-price small {
    font-weight: 400;
    color: rgba(245, 240, 232, 0.7);
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__tip-warn {
    display: block;
    color: #ffb4b4;
    margin-top: 4px;
    font-size: 11px;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__legend {
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    color: var(--ink-soft);
    flex-wrap: wrap;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.06em;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__sw {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    display: inline-block;
}
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__sw--avail  { background: rgba(76,160,80,0.42); border: 1px solid #2F7D33; }
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__sw--sel    { background: rgba(27,94,32,0.72); border: 1px solid #104014; }
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-map__sw--booked { background: rgba(211,66,56,0.40); border: 1px solid rgba(160,38,30,0.75); }

/* Inline error inside map host (when map_url missing) */
#rvbt-ms-qm-root .qm-map-host .rvbt-ms-error {
    padding: 30px 20px;
    text-align: center;
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13px;
    line-height: 1.5;
}

/* ── Step 3 — Add-ons ───────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-addons {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-ms-qm-root .qm-addon {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-addon:hover { border-color: var(--gold); }
#rvbt-ms-qm-root .qm-addon.is-selected {
    border-color: var(--ink);
    background: var(--ivory);
}
#rvbt-ms-qm-root .qm-addon-tick {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--ivory);
    border: 1px solid var(--line);
    color: var(--mute);
    font-size: 18px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
    font-weight: 600;
}
#rvbt-ms-qm-root .qm-addon.is-selected .qm-addon-tick {
    background: var(--ink);
    color: var(--gold);
    border-color: var(--ink);
}
#rvbt-ms-qm-root .qm-addon-body { flex: 1; min-width: 0; }
#rvbt-ms-qm-root .qm-addon-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1.2;
}
#rvbt-ms-qm-root .qm-addon-cost {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mute);
    margin-top: 2px;
    line-height: 1.2;
}

#rvbt-ms-qm-root .qm-running {
    display: inline-flex;
    align-items: baseline;
    gap: 14px;
    background: var(--gold-mist);
    border-radius: 999px;
    padding: 12px 22px;
    margin: 4px 0 18px;
}
#rvbt-ms-qm-root .qm-running-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 600;
}
#rvbt-ms-qm-root .qm-running-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    color: var(--gold);
}

/* ── Step 4 — Guest form ────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-form {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 18px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 24px;
    box-shadow: var(--shadow-md);
}
#rvbt-ms-qm-root .qm-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 14px 18px;
}
#rvbt-ms-qm-root .qm-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
#rvbt-ms-qm-root .qm-field--span { grid-column: 1 / -1; }
#rvbt-ms-qm-root .qm-field-lab {
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-field input,
#rvbt-ms-qm-root .qm-field textarea,
#rvbt-ms-qm-root .qm-field select {
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    padding: 6px 0;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 14px;
    color: var(--ink);
    line-height: 1.4;
    width: 100%;
    transition: border-color 0.18s ease;
}
#rvbt-ms-qm-root .qm-field textarea { resize: vertical; min-height: 60px; }
#rvbt-ms-qm-root .qm-field input:focus,
#rvbt-ms-qm-root .qm-field textarea:focus,
#rvbt-ms-qm-root .qm-field select:focus {
    outline: none;
    border-bottom-color: var(--ink);
}
#rvbt-ms-qm-root .qm-terms-row {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--mute);
    margin-top: 4px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}
#rvbt-ms-qm-root .qm-terms-row input[type="checkbox"] {
    accent-color: var(--ink);
    width: 16px;
    height: 16px;
}

/* ══════════════════════════════════════════════════════════════════════
   "PASSPORT" contact-form skin — a split card (warm intro rail + field
   area) with boxed fields. SCOPED to .qm-form--passport so it changes ONLY
   the contact-form container; the DB-webform rendering, sign-in prompt,
   waitlist panel, counter, tag-input and error logic are all untouched.
   ══════════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-form--passport {
    display: grid;
    grid-template-columns: 260px 1fr;
    /* Full step width — the card's right edge aligns with the footer's
       Continue button (both center on a 1100px content area) and it scales
       down responsively on narrower screens via width:100% + the frame's
       own side padding. */
    max-width: 1100px;
    padding: 0;                 /* rail + main own their own padding */
    overflow: hidden;           /* clip the rail's gradient to the card radius */
    align-items: stretch;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail {
    background: linear-gradient(170deg, #F7F3EA 0%, #F1EADC 100%);
    border-right: 1px solid var(--line-soft);
    padding: 30px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-h {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--ink);
    margin: 0;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-h em { font-style: italic; color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-p {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    line-height: 1.65;
    color: var(--mute);
    margin: 0;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-p span { color: var(--ink-soft); }
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-ticks { display: flex; flex-direction: column; gap: 10px; }
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-tick {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-tick::before {
    content: '\2713';
    color: var(--gold-deep);
    font-weight: 700;
    flex: 0 0 auto;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-rail-sig {
    margin-top: auto;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    color: var(--gold-deep);
    font-size: 15px;
}
#rvbt-ms-qm-root .qm-form--passport .qm-form-main { padding: 28px 30px 32px; }

/* Boxed fields — DIRECT children of .qm-field only, so the tag-input
   (.qm-tagbox), numeric counter (.qm-wf-numrow) and choice groups keep their
   own widgets untouched. */
#rvbt-ms-qm-root .qm-form--passport .qm-field > input,
#rvbt-ms-qm-root .qm-form--passport .qm-field > select,
#rvbt-ms-qm-root .qm-form--passport .qm-field > textarea {
    border: 1px solid #E7E0D2;
    border-radius: 10px;
    background: #FFF;
    padding: 11px 13px;
    line-height: 1.35;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
#rvbt-ms-qm-root .qm-form--passport .qm-field > input:focus,
#rvbt-ms-qm-root .qm-form--passport .qm-field > select:focus,
#rvbt-ms-qm-root .qm-form--passport .qm-field > textarea:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(176, 146, 94, 0.12);
    background: #FFF;
}
/* Invalid fields keep the rose cue on the boxed border. */
#rvbt-ms-qm-root .qm-form--passport .qm-field.is-invalid > input,
#rvbt-ms-qm-root .qm-form--passport .qm-field.is-invalid > select,
#rvbt-ms-qm-root .qm-form--passport .qm-field.is-invalid > textarea {
    border-color: #C57878;
    background: #FFF9F9;
}
/* Box the email tag-input to match (it uses border-bottom by default). */
#rvbt-ms-qm-root .qm-form--passport .qm-tagbox {
    border: 1px solid #E7E0D2;
    border-radius: 10px;
    background: #FFF;
    padding: 7px 10px;
}
#rvbt-ms-qm-root .qm-form--passport .qm-field.is-invalid .qm-tagbox { border-color: #C57878; }
/* Give each field a touch more breathing room between label and box. */
#rvbt-ms-qm-root .qm-form--passport .qm-field { gap: 6px; }

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-form--passport { grid-template-columns: 1fr; }
    #rvbt-ms-qm-root .qm-form--passport .qm-form-rail {
        border-right: 0;
        border-bottom: 1px solid var(--line-soft);
        padding: 22px 20px;
    }
    #rvbt-ms-qm-root .qm-form--passport .qm-form-rail-sig { margin-top: 4px; }
    #rvbt-ms-qm-root .qm-form--passport .qm-form-main { padding: 22px 20px 26px; }
}

/* ── Step 5 — Review ────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-review {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 14px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px 26px;
    box-shadow: var(--shadow-md);
    display: flex;
    flex-direction: column;
    gap: 14px;
}
#rvbt-ms-qm-root .qm-review-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 1px dotted var(--line);
}
#rvbt-ms-qm-root .qm-review-row:last-child { border-bottom: 0; padding-bottom: 0; }
#rvbt-ms-qm-root .qm-review-lab {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    flex-shrink: 0;
    line-height: 1.4;
}
#rvbt-ms-qm-root .qm-review-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    text-align: right;
    line-height: 1.4;
}
#rvbt-ms-qm-root .qm-review-sub {
    font-size: 12px;
    color: var(--mute);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
}

#rvbt-ms-qm-root .qm-pay {
    width: 100%;
    max-width: 600px;
    margin: 0 auto 14px;
}
#rvbt-ms-qm-root .qm-pay select {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 14px;
    font-size: 14px;
    color: var(--ink);
    width: 100%;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1.4;
}

#rvbt-ms-qm-root .qm-total {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 18px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    background: var(--ink);
    color: var(--ivory);
    padding: 18px 26px;
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-md);
}
#rvbt-ms-qm-root .qm-total-lab {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold-soft);
    font-weight: 600;
}
#rvbt-ms-qm-root .qm-total-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 36px;
    line-height: 1;
    color: var(--gold);
}

#rvbt-ms-qm-root .cta--final {
    background: linear-gradient(135deg, var(--ink) 0%, var(--gold-deep, #8E7344) 100%);
    box-shadow: var(--shadow-lg);
}
#rvbt-ms-qm-root .cta--final:hover {
    background: var(--gold);
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-form-grid { grid-template-columns: 1fr; }
    /* left (was center): the List/Map pill docks to the content
       column's left edge on mobile too, matching desktop. */
    #rvbt-ms-qm-root .qm-toolbar { flex-direction: column; align-items: flex-start; }
}

/* ── Step 2 — Rig type & length form ────────────────────────────── */
#rvbt-ms-qm-root .qm-rig {
    display: flex;
    gap: 18px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px;
    box-shadow: var(--shadow-lg);
    margin-bottom: 14px;
    width: 100%;
    max-width: 720px;
}
#rvbt-ms-qm-root .qm-rig-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    min-width: 0;
}
#rvbt-ms-qm-root .qm-rig-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-rig-select,
#rvbt-ms-qm-root .qm-rig-input {
    background: var(--ivory);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 14px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.2;
    width: 100%;
    transition: border-color 0.18s ease;
}
#rvbt-ms-qm-root .qm-rig-select:focus,
#rvbt-ms-qm-root .qm-rig-input:focus {
    outline: none;
    border-color: var(--ink);
    background: var(--paper);
}
#rvbt-ms-qm-root .qm-rig-hint {
    font-size: 12px;
    color: var(--mute);
    text-align: center;
    letter-spacing: 0.04em;
    margin: 0 0 14px;
}

/* ── Step 4 — Party counters ────────────────────────────────────── */
#rvbt-ms-qm-root .qm-counters {
    display: flex;
    gap: 16px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px;
    box-shadow: var(--shadow-md);
    margin: 0 auto 18px;
    max-width: 720px;
    width: 100%;
    justify-content: center;
}
#rvbt-ms-qm-root .qm-counter {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}
#rvbt-ms-qm-root .qm-counter-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-counter-row {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
#rvbt-ms-qm-root .qm-counter-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--ivory);
    color: var(--ink);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    transition: background 0.15s ease, border-color 0.15s ease;
}
#rvbt-ms-qm-root .qm-counter-btn:hover {
    background: var(--ink);
    color: var(--gold);
    border-color: var(--ink);
}
#rvbt-ms-qm-root .qm-counter-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 32px;
    color: var(--ink);
    line-height: 1;
    min-width: 32px;
    text-align: center;
}

@media (max-width: 600px) {
    #rvbt-ms-qm-root .qm-rig { flex-direction: column; }
    #rvbt-ms-qm-root .qm-counters { flex-wrap: wrap; }
    #rvbt-ms-qm-root .qm-counter { flex: 1 1 30%; }
}

/* ────────────────────────────────────────────────────────────────────
 * Step 2 — REDESIGNED rig picker
 *  - SVG radio cards (rig type)
 *  - Custom large-handle slider (length)
 *  - Multi-rig support (add another rig for group bookings)
 * ──────────────────────────────────────────────────────────────────── */

#rvbt-ms-qm-root .qm-rig-list {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

#rvbt-ms-qm-root .qm-rig-card {
    background: #ffffff9c;
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px 26px 26px;
    position: relative;
}

#rvbt-ms-qm-root .qm-rig-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

#rvbt-ms-qm-root .qm-rig-card-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--gold-deep, #8E7344);
    font-style: italic;
    letter-spacing: 0.04em;
}

#rvbt-ms-qm-root .qm-rig-remove {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--mute);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.18s ease;
}

#rvbt-ms-qm-root .qm-rig-remove:hover {
    background: #fdf5f5;
    border-color: #d8a3a3;
    color: #a43333;
}

/* SVG rig-type radio grid */
#rvbt-ms-qm-root .qm-rig-types {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}

#rvbt-ms-qm-root .qm-rig-type {
    background: var(--ivory);
    border: 2px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 12px 8px 10px;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    position: relative;
    color: var(--mute);
}

#rvbt-ms-qm-root .qm-rig-type:hover {
    border-color: var(--gold);
    background: var(--paper);
    transform: translateY(-1px);
    color: var(--ink-soft);
}

#rvbt-ms-qm-root .qm-rig-type input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

#rvbt-ms-qm-root .qm-rig-type.is-selected {
    /* Soft cream-gold treatment instead of harsh dark ink */
    background: linear-gradient(180deg, var(--paper) 0%, var(--gold-mist) 100%);
    border-color: var(--gold);
    color: var(--ink);
    box-shadow: 0 8px 22px rgba(176, 146, 94, 0.22), 0 0 0 3px rgba(176, 146, 94, 0.12);
    transform: translateY(-1px);
}

#rvbt-ms-qm-root .qm-rig-type.is-selected .qm-rig-type-icon {
    color: var(--gold-deep, #8E7344);
}

#rvbt-ms-qm-root .qm-rig-type.is-selected .qm-rig-type-name {
    color: var(--ink);
    font-weight: 600;
}

#rvbt-ms-qm-root .qm-rig-type.is-selected .qm-rig-type-sub {
    color: var(--gold-deep, #8E7344);
    opacity: 1;
}

#rvbt-ms-qm-root .qm-rig-type.is-selected::after {
    /* Gold checkmark badge in top-right */
    content: "\2713";
    position: absolute;
    top: -6px;
    right: -6px;
    width: 22px;
    height: 22px;
    background: var(--gold);
    color: var(--ivory);
    border: 2px solid var(--paper);
    border-radius: 50%;
    font-size: 11px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.45);
}

#rvbt-ms-qm-root .qm-rig-type-icon {
    width: 80px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

#rvbt-ms-qm-root .qm-rig-type-icon svg {
    width: 100%;
    height: 100%;
    color: inherit;
}

#rvbt-ms-qm-root .qm-rig-type-label {
    text-align: center;
    line-height: 1.2;
}

#rvbt-ms-qm-root .qm-rig-type-name {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 14px;
    color: inherit;
    line-height: 1.1;
}

#rvbt-ms-qm-root .qm-rig-type-sub {
    display: block;
    font-size: 8.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: inherit;
    opacity: 0.7;
    font-weight: 600;
    line-height: 1;
    margin-top: 3px;
}

/* Length slider */
#rvbt-ms-qm-root .qm-rig-length {
    background: var(--ivory);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 18px 22px 14px;
}

#rvbt-ms-qm-root .qm-rig-length-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 18px;
}

#rvbt-ms-qm-root .qm-rig-length-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
}

#rvbt-ms-qm-root .qm-rig-length-display {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

#rvbt-ms-qm-root .qm-rig-length-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    color: var(--ink);
    line-height: 1;
}

#rvbt-ms-qm-root .qm-rig-length-unit {
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 600;
}

#rvbt-ms-qm-root .qm-slider-wrap {
    position: relative;
    height: 36px;
    display: flex;
    align-items: center;
    margin-bottom: 6px;
}

#rvbt-ms-qm-root .qm-slider-track {
    position: absolute;
    left: 18px;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    height: 8px;
    background: var(--line-soft);
    border-radius: 99px;
    pointer-events: none;
}

#rvbt-ms-qm-root .qm-slider-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--gold) 0%, var(--gold-deep, #8E7344) 100%);
    border-radius: 99px;
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.35);
}

/* Native range input — styled to render the large grabbable handle */
#rvbt-ms-qm-root .qm-slider-input {
    position: relative;
    width: 100%;
    height: 36px;
    background: transparent;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: grab;
    z-index: 2;
}

#rvbt-ms-qm-root .qm-slider-input:active { cursor: grabbing; }

#rvbt-ms-qm-root .qm-slider-input:focus { outline: none; }

/* WebKit thumb */
#rvbt-ms-qm-root .qm-slider-input::-webkit-slider-runnable-track {
    height: 36px;
    background: transparent;
    border: 0;
}

#rvbt-ms-qm-root .qm-slider-input::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ink);
    border: 3px solid var(--ivory);
    box-shadow: 0 6px 18px rgba(26, 20, 16, 0.32), inset 0 0 0 4px var(--ink), inset 0 0 0 6px var(--gold);
    cursor: grab;
    margin-top: 0;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

#rvbt-ms-qm-root .qm-slider-input:hover::-webkit-slider-thumb {
    transform: scale(1.08);
}

#rvbt-ms-qm-root .qm-slider-input:active::-webkit-slider-thumb {
    transform: scale(1.12);
    cursor: grabbing;
    box-shadow: 0 10px 28px rgba(26, 20, 16, 0.42), inset 0 0 0 4px var(--ink), inset 0 0 0 6px var(--gold);
}

/* Firefox thumb + track */
#rvbt-ms-qm-root .qm-slider-input::-moz-range-track {
    height: 36px;
    background: transparent;
    border: 0;
}

#rvbt-ms-qm-root .qm-slider-input::-moz-range-thumb {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--ink);
    border: 3px solid var(--ivory);
    box-shadow: 0 6px 18px rgba(26, 20, 16, 0.32);
    cursor: grab;
    transition: transform 0.12s ease;
}

#rvbt-ms-qm-root .qm-slider-input:hover::-moz-range-thumb { transform: scale(1.08); }

#rvbt-ms-qm-root .qm-slider-ticks {
    display: flex;
    justify-content: space-between;
    padding: 0 12px;
    margin-top: 4px;
    font-size: 9.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute-soft);
    font-weight: 600;
}

/* Add-another-rig button */
#rvbt-ms-qm-root .qm-rig-add {
    display: flex;
    align-items: center;
    gap: 16px;
    background: transparent;
    border: 2px dashed var(--gold);
    border-radius: var(--r-xl);
    padding: 16px 22px;
    width: 100%;
    max-width: 900px;
    margin: 16px auto 18px;
    cursor: pointer;
    color: var(--gold-deep, #8E7344);
    transition: background 0.18s ease, transform 0.12s ease;
    text-align: left;
    font-family: inherit;
}

#rvbt-ms-qm-root .qm-rig-add:hover {
    background: var(--gold-mist);
    transform: translateY(-1px);
}

#rvbt-ms-qm-root .qm-rig-add-plus {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ink);
    font-size: 22px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(176, 146, 94, 0.35);
}

#rvbt-ms-qm-root .qm-rig-add-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
}

#rvbt-ms-qm-root .qm-rig-add-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
}

#rvbt-ms-qm-root .qm-rig-add-sub {
    font-size: 11px;
    letter-spacing: 0.06em;
    color: var(--mute);
}

/* Compact summary state — premium muted card that blends into the cream paper */
#rvbt-ms-qm-root .qm-rig-summary {
    display: none;
    align-items: center;
    gap: 18px;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"] {
    padding: 14px 22px 14px 26px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.55) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.16);
    border-radius: var(--r-lg);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -1px 0 rgba(176, 146, 94, 0.06);
    position: relative;
    overflow: hidden;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Editorial gold rule on the left edge — like a fine letterhead mark */
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 2px;
    background: linear-gradient(180deg,
        transparent 0%,
        rgba(176, 146, 94, 0.5) 22%,
        rgba(176, 146, 94, 0.75) 50%,
        rgba(176, 146, 94, 0.5) 78%,
        transparent 100%);
}

/* Soft warm-paper sheen at the top */
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% -20%, rgba(255, 250, 235, 0.4) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"]:hover {
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.85) 0%, rgba(248, 242, 228, 0.78) 100%);
    border-color: rgba(176, 146, 94, 0.3);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.75),
        0 4px 14px rgba(176, 146, 94, 0.1);
}

#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-summary { display: flex; }
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-card-head,
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-types,
#rvbt-ms-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-length { display: none; }

#rvbt-ms-qm-root .qm-rig-summary-icon {
    flex-shrink: 0;
    width: 60px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gold-deep);
    opacity: 0.78;
}
#rvbt-ms-qm-root .qm-rig-summary-icon svg { width: 100%; height: 100%; }

#rvbt-ms-qm-root .qm-rig-summary-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    line-height: 1.15;
}

#rvbt-ms-qm-root .qm-rig-summary-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 23px;
    font-weight: 500;
    color: var(--ink);
    line-height: 1.05;
    letter-spacing: 0.005em;
}

#rvbt-ms-qm-root .qm-rig-summary-meta {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 500;
}

#rvbt-ms-qm-root .qm-rig-summary-edit,
#rvbt-ms-qm-root .qm-rig-summary-remove {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(176, 146, 94, 0.22);
    background: rgba(255, 254, 252, 0.55);
    color: var(--ink-soft);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    padding: 0;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
#rvbt-ms-qm-root .qm-rig-summary-edit svg { width: 14px; height: 14px; }
#rvbt-ms-qm-root .qm-rig-summary-edit:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(176, 146, 94, 0.2);
}
#rvbt-ms-qm-root .qm-rig-summary-remove {
    font-size: 22px;
    line-height: 1;
    font-weight: 300;
}
#rvbt-ms-qm-root .qm-rig-summary-remove:hover {
    color: #C57878;
    border-color: #C57878;
    background: #FFF1F1;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(197, 120, 120, 0.18);
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-rig-types { grid-template-columns: repeat(2, 1fr); }
    #rvbt-ms-qm-root .qm-rig-card { padding: 18px 16px 22px; }
    #rvbt-ms-qm-root .qm-rig-summary-name { font-size: 19px; }
}
@media (max-width: 480px) {
    #rvbt-ms-qm-root .qm-rig-add { flex-direction: column; text-align: center; gap: 10px; padding: 18px; }
    #rvbt-ms-qm-root .qm-rig-summary { gap: 10px; }
    #rvbt-ms-qm-root .qm-rig-summary-icon { width: 44px; height: 26px; }
}

/* Smart size-mismatch warning under the slider */
#rvbt-ms-qm-root .qm-rig-warning {
    margin-top: 14px;
    padding: 10px 14px 10px 36px;
    border-radius: var(--r-md);
    font-family: 'Inter RVBT', 'Inter', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    line-height: 1.45;
    color: var(--ink);
    background: linear-gradient(180deg, #FFF8E5, #FAEFCD);
    border: 1px solid var(--gold);
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.12);
    position: relative;
}
#rvbt-ms-qm-root .qm-rig-warning::before {
    content: "!";
    position: absolute;
    left: 10px;
    top: 10px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ivory);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-rig-warning[data-tone="long"] {
    background: linear-gradient(180deg, #FFF1F1, #FFE4E4);
    border-color: #C57878;
}
#rvbt-ms-qm-root .qm-rig-warning[data-tone="long"]::before {
    background: #C57878;
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Who's coming with you (Adults / Children / Pets)
   ────────────────────────────────────────────────────────────────── */

#rvbt-ms-qm-root .qm-people {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
    margin-bottom: 18px;
}

#rvbt-ms-qm-root .qm-people-tile {
    background: linear-gradient(180deg, #ffffff14 0%, rgba(255, 255, 255, 0.6) 100%);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 26px 22px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    box-shadow: var(--shadow-md);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    position: relative;
    overflow: hidden;
}
#rvbt-ms-qm-root .qm-people-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 55% at 50% -10%, rgba(255,250,235,0.5) 0%, transparent 70%);
    pointer-events: none;
}
#rvbt-ms-qm-root .qm-people-tile:hover {
    transform: translateY(-2px);
    border-color: rgba(176, 146, 94, 0.3);
    box-shadow: 0 6px 18px rgba(176, 146, 94, 0.14), 0 1px 3px rgba(80, 60, 30, 0.05);
}

#rvbt-ms-qm-root .qm-people-icon {
    width: 70px;
    height: 70px;
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-people-icon svg {
    width: 100%;
    height: 100%;
    opacity: 0.85;
}

#rvbt-ms-qm-root .qm-people-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-people-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    color: var(--ink);
    line-height: 1.05;
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-people-sub {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}

#rvbt-ms-qm-root .qm-people-counter {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 4px;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-people-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--line-soft);
    background: rgba(255,255,255,0.85);
    color: var(--ink-soft);
    font-size: 22px;
    line-height: 1;
    font-weight: 300;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    padding: 0;
}
#rvbt-ms-qm-root .qm-people-btn:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(176, 146, 94, 0.18);
}
#rvbt-ms-qm-root .qm-people-btn:active {
    transform: translateY(0);
}
#rvbt-ms-qm-root .qm-people-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    font-weight: 500;
    color: var(--ink);
    min-width: 36px;
    text-align: center;
    line-height: 1;
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-people { grid-template-columns: 1fr; gap: 12px; }
    #rvbt-ms-qm-root .qm-people-tile { flex-direction: row; text-align: left; padding: 18px 20px; }
    #rvbt-ms-qm-root .qm-people-tile .qm-people-text { flex: 1; align-items: flex-start; }
    #rvbt-ms-qm-root .qm-people-icon { width: 50px; height: 50px; flex-shrink: 0; }
    #rvbt-ms-qm-root .qm-people-name { font-size: 22px; }
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Per-person pricing notice
   ────────────────────────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-people-info {
    margin-top: 6px;
    padding: 16px 22px 18px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.55) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.16);
    border-radius: var(--r-lg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    position: relative;
    overflow: hidden;
}
#rvbt-ms-qm-root .qm-people-info::before {
    content: "";
    position: absolute;
    left: 0; top: 16%; bottom: 16%;
    width: 2px;
    background: linear-gradient(180deg,
        transparent 0%,
        rgba(176, 146, 94, 0.55) 22%,
        rgba(176, 146, 94, 0.78) 50%,
        rgba(176, 146, 94, 0.55) 78%,
        transparent 100%);
}
#rvbt-ms-qm-root .qm-people-info-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.14);
}
#rvbt-ms-qm-root .qm-people-info-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 19px;
    color: var(--ink);
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-people-info-eyebrow {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-people-info-rows {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
#rvbt-ms-qm-root .qm-people-info-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-start;
}
#rvbt-ms-qm-root .qm-people-info-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-people-info-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1.1;
}
#rvbt-ms-qm-root .qm-people-info-value[data-cost="paid"] {
    color: var(--gold-deep);
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-people-info-rows { grid-template-columns: 1fr; gap: 8px; }
    #rvbt-ms-qm-root .qm-people-info-row { flex-direction: row; justify-content: space-between; align-items: center; }
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Options & Extras picker
   Compact SQUARE cards in a responsive auto-fill grid (mirrors the original
   .qm-people-tile look): icon on top · name/desc/cost · +/- stepper pinned
   at the bottom. The grid wraps, so a long catalog stays a tidy grid rather
   than a tall single column. Quantity-driven by wireExtrasStep(); the tally
   bar below shows the live subtotal.
   ────────────────────────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-extras {
    width: 100%;
    max-width: 860px;
    margin: 20px auto 8px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
#rvbt-ms-qm-root .qm-extras-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
    gap: 16px;
    align-items: stretch;
}
#rvbt-ms-qm-root .qm-extra {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 24px 18px 20px;
    background: linear-gradient(180deg, #ffffff14 0%, rgba(255, 255, 255, 0.6) 100%);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-md);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
    position: relative;
    overflow: hidden;
}
#rvbt-ms-qm-root .qm-extra::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 55% at 50% -10%, rgba(255,250,235,0.5) 0%, transparent 70%);
    pointer-events: none;
}
#rvbt-ms-qm-root .qm-extra:hover {
    transform: translateY(-2px);
    border-color: rgba(176, 146, 94, 0.3);
    box-shadow: 0 6px 18px rgba(176, 146, 94, 0.14), 0 1px 3px rgba(80, 60, 30, 0.05);
}
#rvbt-ms-qm-root .qm-extra.is-selected {
    border-color: var(--gold-soft);
    background: linear-gradient(180deg, var(--gold-mist) 0%, rgba(239,230,211,0.4) 100%);
    box-shadow: 0 6px 18px rgba(176, 146, 94, 0.18);
}
#rvbt-ms-qm-root .qm-extra-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-extra-icon svg { width: 100%; height: 100%; opacity: 0.9; }
#rvbt-ms-qm-root .qm-extra-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-extra-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 23px;
    line-height: 1.05;
    font-weight: 500;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-extra-desc {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    line-height: 1.3;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-extra-cost {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    margin-top: 2px;
}
#rvbt-ms-qm-root .qm-extra-counter {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex: 0 0 auto;
    margin-top: auto;      /* pin to the bottom so cards in a row line up */
    padding-top: 4px;
    position: relative;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-extra-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 30px;
    font-weight: 500;
    color: var(--ink);
    min-width: 28px;
    text-align: center;
    line-height: 1;
}
/* Disabled stepper buttons (shared .qm-people-btn): muted + non-interactive.
   Override the hover rule so a disabled button never lifts/gilds. */
#rvbt-ms-qm-root .qm-people-btn:disabled {
    opacity: 0.3;
    cursor: default;
}
#rvbt-ms-qm-root .qm-people-btn:disabled:hover {
    color: var(--ink-soft);
    border-color: var(--line-soft);
    background: rgba(255,255,255,0.85);
    transform: none;
    box-shadow: none;
}
#rvbt-ms-qm-root .qm-extras-empty {
    text-align: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11.5px;
    letter-spacing: 0.06em;
    color: var(--mute-soft);
    padding: 2px 0 4px;
}
#rvbt-ms-qm-root .qm-extras-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 22px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-extras-bar-leg {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
#rvbt-ms-qm-root .qm-extras-bar-leg--total { text-align: right; }
#rvbt-ms-qm-root .qm-extras-bar-eyebrow {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-extras-bar-count {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 13px;
    color: var(--ink-soft);
    font-weight: 600;
}
#rvbt-ms-qm-root .qm-extras-bar-total {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 30px;
    line-height: 1;
    color: var(--ink);
    font-weight: 600;
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-extras-list { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
    #rvbt-ms-qm-root .qm-extra { padding: 18px 12px 16px; gap: 10px; }
    #rvbt-ms-qm-root .qm-extra-icon { width: 48px; height: 48px; }
    #rvbt-ms-qm-root .qm-extra-name { font-size: 20px; }
    #rvbt-ms-qm-root .qm-extra-counter { gap: 9px; }
    #rvbt-ms-qm-root .qm-extra .qm-people-btn { width: 34px; height: 34px; font-size: 20px; }
    #rvbt-ms-qm-root .qm-extra-val { font-size: 26px; min-width: 22px; }
    #rvbt-ms-qm-root .qm-extras-bar-total { font-size: 26px; }
}
@media (max-width: 430px) {
    #rvbt-ms-qm-root .qm-extras-list { grid-template-columns: repeat(2, 1fr); }
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Vehicles & parking-pass advisory
   ────────────────────────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-vehicles {
    margin-top: 14px;
    padding: 18px 22px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.6) 0%, rgba(247, 241, 226, 0.55) 100%);
    border: 1px solid rgba(176, 146, 94, 0.18);
    border-radius: var(--r-lg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    position: relative;
    overflow: hidden;
}
#rvbt-ms-qm-root .qm-vehicles[hidden] { display: none; }
#rvbt-ms-qm-root .qm-vehicles-head {
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-vehicles-icon {
    flex-shrink: 0;
    width: 64px;
    height: 36px;
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.85;
}
#rvbt-ms-qm-root .qm-vehicles-icon svg { width: 100%; height: 100%; }
#rvbt-ms-qm-root .qm-vehicles-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    line-height: 1.15;
}
#rvbt-ms-qm-root .qm-vehicles-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-vehicles-sub {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-vehicles-counter {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
#rvbt-ms-qm-root .qm-vehicles-note {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.14);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-vehicles-note strong {
    color: var(--gold-deep);
    font-weight: 600;
}

@media (max-width: 720px) {
    #rvbt-ms-qm-root .qm-vehicles-head { flex-wrap: wrap; }
    #rvbt-ms-qm-root .qm-vehicles-counter { width: 100%; justify-content: flex-end; }
}

/* Standalone variant — when vehicles owns the whole step (Step 3) */
#rvbt-ms-qm-root .qm-vehicles--standalone {
    margin-top: 18px;
    padding: 26px 26px;
    box-shadow: var(--shadow-md);
}

/* Empty-state shown on Step 3 when no parking pass is configured */
#rvbt-ms-qm-root .qm-vehicles-empty {
    margin-top: 18px;
    padding: 22px 26px;
    background: linear-gradient(180deg, rgba(232, 244, 232, 0.4) 0%, rgba(218, 235, 218, 0.35) 100%);
    border: 1px solid rgba(126, 139, 122, 0.3);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-vehicles-empty[hidden] { display: none; }
#rvbt-ms-qm-root .qm-vehicles-empty-mark {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #7E8B7A;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
#rvbt-ms-qm-root .qm-vehicles-empty-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-vehicles-empty-sub {
    margin-top: 3px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    color: var(--ink-soft);
    line-height: 1.4;
}

/* ────────────────────────────────────────────────────────────────────────────
   Step 1 date picker — slides in when Arrive/Depart/Nights is clicked.
   .qm-stage acts as the positioning context; .ymap-wrap exits up & out, the
   .qm-date-picker fades up into place. Z-index keeps the exiting ymap under
   the .qm-q heading (which has its own cream background to occlude).
   ──────────────────────────────────────────────────────────────────────────── */

/* Clickable affordance on the left date column */
#rvbt-ms-qm-root .qm-pickers--stack .qm-date,
#rvbt-ms-qm-root .qm-pickers--stack .qm-nights {
    cursor: pointer;
    transition: background .25s ease, border-color .25s ease, transform .2s ease;
}
#rvbt-ms-qm-root .qm-pickers--stack .qm-date:hover,
#rvbt-ms-qm-root .qm-pickers--stack .qm-nights:hover {
    transform: translateX(2px);
    border-color: rgba(176, 146, 94, 0.45);
}
#rvbt-ms-qm-root .qm-pickers--stack .qm-date.is-editing,
#rvbt-ms-qm-root .qm-pickers--stack .qm-nights.is-editing {
    border-color: var(--gold);
    box-shadow: 0 8px 22px -14px rgba(176, 146, 94, 0.45);
}

/* Make .qm-stage a stacking + positioning context */
#rvbt-ms-qm-root .qm-stage {
    position: relative;
    isolation: isolate;
}

/* ymap-wrap now spans the full single-column stage (date-picker removed). */
#rvbt-ms-qm-root .qm-stage > .ymap-wrap {
    grid-column: 1;
    grid-row: 1;
}

/* Default visible state for ymap-wrap (already styled elsewhere) */
#rvbt-ms-qm-root .qm-stage > .ymap-wrap {
    position: relative;
    z-index: 1;
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

/* Picker overlays the EXACT same grid cell as .ymap-wrap (column 2, full
   row span on desktop). `grid-column: 2` already places it in the carousel
   column — its absolutely-positioned containing block is the GRID AREA,
   not the stage's padding-box, so we do NOT add a horizontal offset. */
#rvbt-ms-qm-root .qm-stage > .qm-date-picker {
    position: absolute;
    inset: 0;
    z-index: 2;
    transform: translateY(24px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: grid;
    grid-template-rows: auto auto;
    gap: 10px;
    align-content: start;
}
/* Override `hidden` HTML attribute so picker stays in DOM (class drives state) */
#rvbt-ms-qm-root .qm-stage > .qm-date-picker[hidden] {
    display: grid;
}

/* Picker-mode toggle: ymap exits up & under heading; picker rises in */
#rvbt-ms-qm-root .qm-stage[data-ms-picker-mode="1"] > .ymap-wrap {
    transform: translateY(-120%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition-delay: 0s, 0s, .55s;
}
#rvbt-ms-qm-root .qm-stage[data-ms-picker-mode="1"] > .qm-date-picker {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: .2s, .2s, 0s;
}

/* ─── Date picker head — Arrive / Depart tabs + nights field + close ────── */
/* dp-head is kept in DOM for JS refs but visually hidden — the left date
   column already shows Arrive/Depart/Nights so a duplicate header here is
   redundant. The close button is rendered as a floating element instead. */
#rvbt-ms-qm-root .qm-date-picker .dp-head {
    display: none !important;
}
/* Floating close button — top-right corner of the picker overlay */
#rvbt-ms-qm-root .qm-date-picker .dp-close-float {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--ivory);
    color: var(--mute);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
    z-index: 4;
}
#rvbt-ms-qm-root .qm-date-picker .dp-close-float:hover {
    border-color: var(--ink);
    color: var(--ink);
    background: rgba(26, 20, 16, 0.04);
}
#rvbt-ms-qm-root .qm-date-picker .dp-tabs {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 14px;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
    text-align: left;
    min-width: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab:not(.dp-tab--nights):hover {
    background: rgba(245, 242, 240, 0.6);
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab.is-active {
    background: linear-gradient(229deg, #ffffff 0%, #f4eddb 100%);
    border-color: rgba(176, 146, 94, 0.45);
    box-shadow: 0 6px 18px -12px rgba(176, 146, 94, 0.45);
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab.is-active .dp-tab-label {
    color: #8b6d3a;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    letter-spacing: -0.01em;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab.is-active .dp-tab-value {
    color: #8b6d3a;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab-arrow {
    color: var(--gold);
    font-family: 'Cormorant RVBT', Georgia, serif;
    font-size: 22px;
}
#rvbt-ms-qm-root .qm-date-picker .dp-tab--nights {
    margin-left: auto;
    cursor: default;
    border: 1px solid var(--line-soft);
    background: transparent;
    padding: 8px 12px;
}
#rvbt-ms-qm-root .qm-date-picker .dp-nights-input {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
#rvbt-ms-qm-root .qm-date-picker .dp-step {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--ink-soft);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-step:hover {
    background: rgba(176, 146, 94, 0.08);
    border-color: var(--gold);
    color: var(--gold);
}
#rvbt-ms-qm-root .qm-date-picker [data-ms-dp-nights-input] {
    width: 44px;
    text-align: center;
    border: 0;
    background: transparent;
    font-family: 'Cormorant RVBT', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    -moz-appearance: textfield;
    outline: none;
    padding: 0;
}
#rvbt-ms-qm-root .qm-date-picker [data-ms-dp-nights-input]::-webkit-outer-spin-button,
#rvbt-ms-qm-root .qm-date-picker [data-ms-dp-nights-input]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-close {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--mute);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-close:hover {
    border-color: var(--ink);
    color: var(--ink);
    background: rgba(26, 20, 16, 0.04);
}

/* ─── Calendar (two months side-by-side for easy cross-month range select) ── */
#rvbt-ms-qm-root .qm-date-picker .dp-calendar {
    position: relative;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
    padding: 22px 56px 18px;
}
/* Four-month strip — months flex-fill the calendar width so each owns a
   generous column (~240px wide). Vertical hairline dividers separate them
   with a confident-but-elegant rule that's clearly visible (not a phantom). */
#rvbt-ms-qm-root .qm-date-picker .dp-months {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
}
#rvbt-ms-qm-root .qm-date-picker .dp-cal-month {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 22px;
    position: relative;
}
#rvbt-ms-qm-root .qm-date-picker .dp-cal-month:first-child { padding-left: 4px; }
#rvbt-ms-qm-root .qm-date-picker .dp-cal-month:last-child  { padding-right: 4px; }
/* Vertical divider between months — visible but soft. Sits centered in the
   inter-month gutter and fades at the very top/bottom for an editorial feel. */
#rvbt-ms-qm-root .qm-date-picker .dp-cal-month + .dp-cal-month::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(26, 20, 16, 0.18) 14%,
        rgba(26, 20, 16, 0.18) 86%,
        transparent 100%
    );
}
/* Nav buttons anchored at the month-title row baseline, inset from card edge */
#rvbt-ms-qm-root .qm-date-picker .dp-nav {
    position: absolute;
    top: 22px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--paper);
    color: var(--ink-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
    padding: 0;
    z-index: 2;
}
#rvbt-ms-qm-root .qm-date-picker .dp-nav--prev { left: 14px; }
#rvbt-ms-qm-root .qm-date-picker .dp-nav--next { right: 14px; }
#rvbt-ms-qm-root .qm-date-picker .dp-nav:active { transform: scale(0.94); }
#rvbt-ms-qm-root .qm-date-picker .dp-nav:hover {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
}
#rvbt-ms-qm-root .qm-date-picker .dp-month-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1;
    letter-spacing: 0.01em;
    text-align: center;
    margin-bottom: 12px;
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-date-picker .dp-dow {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(26, 20, 16, 0.08);
}
#rvbt-ms-qm-root .qm-date-picker .dp-dow span {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
}
#rvbt-ms-qm-root .qm-date-picker .dp-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day {
    aspect-ratio: 1 / 1;
    border: 1px solid transparent;
    background: transparent;
    color: var(--ink);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, color .15s ease, transform .12s ease, box-shadow .15s ease;
    padding: 0;
    min-width: 0;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day:hover:not(:disabled):not(.is-other) {
    background: rgba(176, 146, 94, 0.14);
    color: #6e5527;
    border-color: rgba(176, 146, 94, 0.35);
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-other {
    color: var(--mute-soft);
    opacity: 0.35;
    cursor: default;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-today {
    color: #8b6d3a;
    font-weight: 700;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-today::after {
    content: '';
    position: absolute;
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--gold);
}
#rvbt-ms-qm-root .qm-date-picker .dp-day {
    position: relative;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-range {
    background: rgba(176, 146, 94, 0.22);
    color: #6e5527;
    border-radius: 0;
    font-weight: 600;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-arrive,
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-depart {
    background: var(--ink);
    color: var(--ivory);
    border-color: var(--ink);
    border-radius: 8px;
    box-shadow: 0 6px 18px -8px rgba(26, 20, 16, 0.55);
    font-weight: 600;
    z-index: 1;
}
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-arrive { border-top-right-radius: 0; border-bottom-right-radius: 0; }
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-depart { border-top-left-radius: 0; border-bottom-left-radius: 0; }
/* Same-day stay (Arrive == Depart): keep full rounding */
#rvbt-ms-qm-root .qm-date-picker .dp-day.is-arrive.is-depart {
    border-radius: var(--r-sm);
}
#rvbt-ms-qm-root .qm-date-picker .dp-day:disabled {
    cursor: not-allowed;
    opacity: 0.3;
}

/* ─── Quick-preset pills ───────────────────────────────────────────────── */
#rvbt-ms-qm-root .qm-date-picker .dp-quick {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 4px 0;
    flex-wrap: wrap;
}
#rvbt-ms-qm-root .qm-date-picker .dp-quick-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    margin-right: 4px;
}
#rvbt-ms-qm-root .qm-date-picker .dp-quick-pill {
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: transparent;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ink-soft);
    cursor: pointer;
    transition: all .15s ease;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-date-picker .dp-quick-pill:hover {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
}

/* ────────────────────────────────────────────────────────────────────────────
   Seasonal backgrounds for mini month cards
   Dec / Jan / Feb → winter, Mar / Apr / May → spring,
   Jun / Jul / Aug → summer, Sep / Oct / Nov → fall.
   Each card uses a full-bleed background image + gradient overlay for legibility.
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-ms-qm-root .mini[data-season] {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    border: 1px solid transparent;
    box-shadow: 0 10px 24px -16px rgba(26, 20, 16, 0.35);
    /* Month name AT TOP, calendar grid below */
    flex-direction: column;
    justify-content: flex-start;
    max-height: 500px;
    min-height: 320px;
    /* 348 = 368 (gold border height) - 20 (10px gap on top + 10px gap on bottom).
       Card sits inside the gold border with 10px breathing room all around. */
    height: 348px;
    padding: 16px 14px 18px;
    gap: 14px;
}

/* Specificity (1,2,0) beats .mini:hover (1,1,1) so the photo persists on hover. */
#rvbt-ms-qm-root .mini[data-season="winter"] { background-image: url('../../assets/img/seasons/winter.jpg'); }
#rvbt-ms-qm-root .mini[data-season="spring"] { background-image: url('../../assets/img/seasons/spring.jpg'); }
#rvbt-ms-qm-root .mini[data-season="summer"] { background-image: url('../../assets/img/seasons/summer.jpg'); }
#rvbt-ms-qm-root .mini[data-season="fall"]   { background-image: url('../../assets/img/seasons/fall.jpg'); }

/* Cream/gold overlay matching the featured panel — soft radial at top with a
   translucent linear wash so the seasonal photo bleeds through warmly. */
#rvbt-ms-qm-root .mini[data-season]::before {
    content: "";
    position: absolute;
    inset: 1px;             /* leave the 1px border zone uncovered */
    z-index: 0;
    border-radius: inherit;
    /* Top 20% gets a stronger cream wash (image reads lighter); bottom gets a
       subtle ink tint (image reads darker); middle stays nearly clear. */
    background:
        radial-gradient(120% 120% at 50% 0%, rgb(255 250 235 / 25%) 0%, transparent 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.52) 0%,
            rgba(244, 236, 217, 0.10) 22%,
            rgba(244, 236, 217, 0.05) 60%,
            rgba(26, 20, 16, 0.20) 100%);
    transition: background .3s ease;
}

/* Inner content sits above the overlay */
#rvbt-ms-qm-root .mini[data-season] > * {
    position: relative;
    z-index: 1;
}

/* Hover: brighten + lift more */
#rvbt-ms-qm-root .mini[data-season]:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    background-color: transparent;
    box-shadow: 0 18px 36px -18px rgba(26, 20, 16, 0.5);
}
/* Hover: light cream wash — image stays clearly visible, just gently
   washed for a dreamier look. Fonts darken below for legibility. */
#rvbt-ms-qm-root .mini[data-season]:hover::before {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.45) 0%, rgba(255, 250, 235, 0.22) 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.42) 0%,
            rgba(244, 236, 217, 0.28) 50%,
            rgba(244, 236, 217, 0.38) 100%);
}

/* Hover: darken the text/labels for legibility on the lighter overlay */
#rvbt-ms-qm-root .mini[data-season]:hover .nm        { color: #2d2316; text-shadow: 0 1px 2px rgba(255, 250, 235, 0.6); }
#rvbt-ms-qm-root .mini[data-season]:hover .occ-num   { color: #2d2316; text-shadow: none; }
#rvbt-ms-qm-root .mini[data-season]:hover .occ-num small { color: #654f2a; text-shadow: none; }
#rvbt-ms-qm-root .mini[data-season]:hover .occ-label,
#rvbt-ms-qm-root .mini[data-season]:hover .occ-tier  { color: #2d2316; }
#rvbt-ms-qm-root .mini[data-season]:hover .occ-foot-line { background: linear-gradient(90deg, rgba(45, 35, 22, 0.55), transparent); }

/* Month label — full name, larger Cormorant serif */
#rvbt-ms-qm-root .mini[data-season] .nm {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0.015em;
    text-transform: none;
    color: #654f2a;
    text-align: center;
    line-height: 1.05;
    text-shadow: 0 1px 2px rgba(255, 250, 235, 0.5);
    padding: 4px 2px 2px;
}

/* Calendar grid sits AT TOP of card (parent .mini is flex column-reverse).
   Lives directly on the cream/gold overlay — no frosted backdrop, like the
   featured panel. The heat-map cells provide their own contrast. */
#rvbt-ms-qm-root .mini[data-season] .mini-grid {
    padding: 4px 2px 0;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 0;
    box-shadow: none;
    gap: 3px;
}

/* Empty leading/trailing cells stay invisible */
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d {
    background: transparent;
    border-radius: 3px;
    transition: background .2s ease, transform .12s ease;
}

/* ─── Heat-map scale ────────────────────────────────────────────────────────
   Painted dynamically by wireQmHeatMap on Step 1 load. Cells with `.has` get
   a heat class h1..h5 — gradient ivory → gold → ink. */
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.has {
    /* fallback for cells that haven't been painted yet */
    background: rgba(251, 248, 244, 0.45);
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.h1 {
    background: rgba(251, 248, 244, 0.78);    /* ivory — lots of availability */
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.h2 {
    background: rgba(239, 230, 211, 0.85);    /* gold-mist — comfortable */
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.h3 {
    background: rgb(203 190 168 / 51%);
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.h4 {
    background: var(--gold);                  /* gold — high demand */
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.h5 {
    background: #473c3682;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.booked {
    background: rgba(26, 20, 16, 0.65);        /* ink — booked solid */
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.25);
}
/* Past dates appear muted */
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.past {
    background: rgba(251, 248, 244, 0.12);
}
#rvbt-ms-qm-root .mini[data-season]:hover .mini-grid .d.h1 { transform: scale(1.05); }
#rvbt-ms-qm-root .mini[data-season]:hover .mini-grid .d.h2 { transform: scale(1.05); }
#rvbt-ms-qm-root .mini[data-season]:hover .mini-grid .d.h3 { transform: scale(1.05); }
#rvbt-ms-qm-root .mini[data-season]:hover .mini-grid .d.h4 { transform: scale(1.05); }
#rvbt-ms-qm-root .mini[data-season]:hover .mini-grid .d.h5 { transform: scale(1.05); }

#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.range {
    background: var(--gold);
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.5);
}
#rvbt-ms-qm-root .mini[data-season] .mini-grid .d.endpoint {
    background: var(--ink);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.45);
}

/* ────────────────────────────────────────────────────────────────────────────
   Month occupancy meter — replaces the per-day .mini-grid on seasonal cards.
   A single gradient progress bar showing overall booked-% for the whole month,
   styled in the warm cream/gold/ink palette to match the editorial page.
   .ymap-feature is untouched (still shows the full per-day calendar).
   ──────────────────────────────────────────────────────────────────────────── */

/* Hide the per-day heat-map grid on the mini cards — replaced by the meter. */
#rvbt-ms-qm-root .mini[data-season] .mini-grid {
    display: none;
}

#rvbt-ms-qm-root .mini[data-season] .month-occ {
    position: relative;
    z-index: 1;
    margin-top: auto;        /* push to the bottom of the card */
    padding: 14px 4px 4px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Caption row above the bar — booked % + tier badge */
#rvbt-ms-qm-root .mini[data-season] .month-occ-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

#rvbt-ms-qm-root .mini[data-season] .occ-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    letter-spacing: -0.02em;
    text-shadow: 0 1px 4px rgba(26, 20, 16, 0.55), 0 1px 2px rgba(26, 20, 16, 0.45);
}

#rvbt-ms-qm-root .mini[data-season] .occ-num small {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 600;
    margin-left: 3px;
    color: #ffffff;
    letter-spacing: 0.04em;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
}

/* Tier badge: WIDE OPEN / EASY / FILLING / BUSY / PEAK */
#rvbt-ms-qm-root .mini[data-season] .occ-tier {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 999px;
    line-height: 1;
    border: 1px solid currentColor;
    white-space: nowrap;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
/* Tier badges — all white text with subtle backgrounds that hint at tier intensity */
#rvbt-ms-qm-root .mini[data-season] .occ-tier {
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
    border-color: rgba(255, 255, 255, 0.55);
}
#rvbt-ms-qm-root .mini[data-season] .occ-tier[data-tier="open"]    { background: rgba(79, 95, 75, 0.35); }
#rvbt-ms-qm-root .mini[data-season] .occ-tier[data-tier="easy"]    { background: rgba(126, 139, 122, 0.38); }
#rvbt-ms-qm-root .mini[data-season] .occ-tier[data-tier="filling"] { background: rgba(165, 138, 93, 0.40); }
#rvbt-ms-qm-root .mini[data-season] .occ-tier[data-tier="busy"]    { background: rgba(127, 100, 53, 0.45); }
#rvbt-ms-qm-root .mini[data-season] .occ-tier[data-tier="peak"]    {
    background: linear-gradient(135deg, rgba(176, 146, 94, 0.65) 0%, rgba(127, 100, 53, 0.75) 100%);
    border-color: rgba(255, 255, 255, 0.5);
}

/* Track + fill: gold gradient capsule with subtle tick marks at quarters */
#rvbt-ms-qm-root .mini[data-season] .month-occ-track {
    position: relative;
    height: 10px;
    border-radius: 999px;
    background: rgb(117 106 91 / 39%);
    border: 1px solid rgb(79 58 23 / 30%);
    box-shadow:
        inset 0 1px 2px rgba(26, 20, 16, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.4);
    overflow: hidden;
}

/* Quartile ticks across the track (subtle) */
#rvbt-ms-qm-root .mini[data-season] .month-occ-track::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(
        90deg,
        transparent calc(25% - 0.5px), rgba(176, 146, 94, 0.32) 25%, rgba(176, 146, 94, 0.32) calc(25% + 0.5px), transparent calc(25% + 0.5px),
        transparent calc(50% - 0.5px), rgba(176, 146, 94, 0.32) 50%, rgba(176, 146, 94, 0.32) calc(50% + 0.5px), transparent calc(50% + 0.5px),
        transparent calc(75% - 0.5px), rgba(176, 146, 94, 0.32) 75%, rgba(176, 146, 94, 0.32) calc(75% + 0.5px), transparent calc(75% + 0.5px)
    );
    pointer-events: none;
}

#rvbt-ms-qm-root .mini[data-season] .month-occ-fill {
    position: relative;
    height: 100%;
    width: 0;               /* animated to target % by JS */
    border-radius: 999px;
    background: linear-gradient(90deg,
        #d4bc8e 0%,
        #b0925e 55%,
        #7f6435 100%);
    box-shadow:
        0 0 10px rgba(176, 146, 94, 0.5),
        inset 0 1px 0 rgba(255, 250, 235, 0.45);
    transition: width 1.1s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Bright leading-edge tick on the fill — like a measurement line */
#rvbt-ms-qm-root .mini[data-season] .month-occ-fill::after {
    content: "";
    position: absolute;
    right: -1px;
    top: -2px;
    bottom: -2px;
    width: 2px;
    border-radius: 1px;
    background: rgba(255, 250, 235, 0.95);
    box-shadow: 0 0 10px rgba(255, 250, 235, 0.8), 0 0 18px rgba(176, 146, 94, 0.5);
    opacity: 0;
    transition: opacity .4s ease 1s;
}
#rvbt-ms-qm-root .mini[data-season] .month-occ.is-painted .month-occ-fill::after {
    opacity: 1;
}

/* Foot caption — "Booked" label below the bar */
#rvbt-ms-qm-root .mini[data-season] .occ-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 2px;
}

#rvbt-ms-qm-root .mini[data-season] .occ-foot .occ-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 600;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
}
#rvbt-ms-qm-root .mini[data-season] .occ-foot .occ-foot-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.75), transparent);
}

/* Hover: slight glow lift on the bar */
#rvbt-ms-qm-root .mini[data-season]:hover .month-occ-fill {
    box-shadow:
        0 0 16px rgba(176, 146, 94, 0.7),
        inset 0 1px 0 rgba(255, 250, 235, 0.55);
}

/* Hovering a mini card hints it's clickable (will become featured) */
#rvbt-ms-qm-root .mini[data-season] {
    cursor: pointer;
}

/* ────────────────────────────────────────────────────────────────────────────
   Drag carousel cursor + closed-month indicator
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-ms-qm-root .ymap-strip {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}
#rvbt-ms-qm-root .ymap-strip:active {
    cursor: grabbing;
}

#rvbt-ms-qm-root .mini[data-season].is-closed {
    cursor: not-allowed;
    filter: grayscale(0.55) brightness(0.92);
}
#rvbt-ms-qm-root .mini[data-season].is-closed::before {
    background:
        linear-gradient(180deg, rgba(26, 20, 16, 0.42) 0%, rgba(26, 20, 16, 0.6) 100%),
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.10) 0%, transparent 70%) !important;
}
#rvbt-ms-qm-root .mini[data-season].is-closed:hover {
    transform: none !important;
    border-color: rgba(189, 38, 38, 0.55) !important;
}
#rvbt-ms-qm-root .mini[data-season] .closed-msg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-4deg);
    z-index: 3;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    font-weight: 700;
    color: #fff2dd;
    background: linear-gradient(135deg, rgba(189, 38, 38, 0.85) 0%, rgba(120, 22, 22, 0.92) 100%);
    border: 1px solid rgba(255, 242, 221, 0.45);
    padding: 8px 14px;
    border-radius: 4px;
    box-shadow: 0 6px 18px -8px rgba(26, 20, 16, 0.6);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    white-space: nowrap;
    pointer-events: none;
}

/* On hover of closed card, don't darken the fonts (keep them white over the dark wash) */
#rvbt-ms-qm-root .mini[data-season].is-closed:hover .nm,
#rvbt-ms-qm-root .mini[data-season].is-closed:hover .occ-num,
#rvbt-ms-qm-root .mini[data-season].is-closed:hover .occ-tier,
#rvbt-ms-qm-root .mini[data-season].is-closed:hover .occ-label {
    color: rgba(255, 242, 221, 0.85);
}

/* ────────────────────────────────────────────────────────────────────────────
   End-of-range cap card — appears after the last bookable month, signals
   that the user has reached the configured maximum future booking date.
   No photo background — pure editorial typography on a cream-paper card.
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-ms-qm-root .mini.mini--endcap {
    flex: 0 0 210px;
    height: 348px;
    min-height: 320px;
    max-height: 500px;
    padding: 22px 16px;
    border: 1px dashed rgba(176, 146, 94, 0.6);
    border-radius: var(--r-md);
    background:
        radial-gradient(80% 70% at 50% 0%, rgba(255, 250, 235, 0.95) 0%, rgba(244, 236, 217, 0.6) 100%),
        linear-gradient(180deg, var(--ivory) 0%, var(--cream-deep) 100%);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.5),
        0 10px 24px -16px rgba(176, 146, 94, 0.35);
    cursor: default;
    overflow: hidden;
    position: relative;
}

#rvbt-ms-qm-root .mini.mini--endcap::after {
    content: '';
    position: absolute;
    inset: 6px;
    border: 1px solid rgba(176, 146, 94, 0.18);
    border-radius: 6px;
    pointer-events: none;
}

#rvbt-ms-qm-root .mini.mini--endcap .endcap-inner {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    padding: 8px;
}

#rvbt-ms-qm-root .mini.mini--endcap svg {
    color: var(--gold);
    opacity: 0.7;
    margin-bottom: 2px;
}

#rvbt-ms-qm-root .mini.mini--endcap .endcap-eyebrow {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 700;
    margin-top: 2px;
}

#rvbt-ms-qm-root .mini.mini--endcap .endcap-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: #654f2a;
    line-height: 1.1;
    letter-spacing: -0.005em;
    margin: 4px 0 2px;
}

#rvbt-ms-qm-root .mini.mini--endcap .endcap-date {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-size: 16px;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 4px;
}

#rvbt-ms-qm-root .mini.mini--endcap .endcap-note {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    line-height: 1.5;
    color: var(--mute);
    max-width: 22ch;
    margin: 4px auto 0;
}

/* Decorative corner notches give it a "ticket stub" feel */
#rvbt-ms-qm-root .mini.mini--endcap::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 12px;
    border-radius: 0 0 16px 16px;
    background: var(--cream);
    border-bottom: 1px dashed rgba(176, 146, 94, 0.45);
    z-index: 2;
}

/* ============================================================================
 * Responsive — Step 1 (Dates) carousel + date picker stack
 *
 * On screens ≤ 900px, the .qm-stage switches from "date column | carousel"
 * grid to a single column with the date picker on TOP and the carousel BELOW
 * (matching the user's mobile spec). The .qm-date-picker overlay also has its
 * hard-coded `left:calc(240px + 32px)` reset so it spans the full row.
 * ========================================================================= */
@media (max-width: 900px) {
    /* Single-column stage: picker row 1, carousel row 2 */
    #rvbt-ms-qm-root .qm-stage {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        gap: 18px;
        margin: 24px 4px 20px;
    }
    /* Date picker column always row 1, full width, horizontal compact layout */
    #rvbt-ms-qm-root .qm-pickers.qm-pickers--stack {
        grid-column: 1 !important;
        grid-row: 1 !important;
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 8px;
        padding: 0;
        border-right: 0;
        border-bottom: 1px solid var(--line-soft);
        padding-bottom: 14px;
    }
    /* Override the late-defined desktop rules that force ymap-wrap + picker into
       grid-column 2 */
    #rvbt-ms-qm-root .qm-stage > .ymap-wrap {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }
    #rvbt-ms-qm-root .qm-stage > .qm-date-picker {
        grid-column: 1 !important;
        grid-row: 2 !important;
        left: 0 !important; /* reset the hardcoded 240+32 inset for desktop */
        right: 0 !important;
    }
    /* Restriction notice bar + nights summary need explicit rows here —
       the pickers/carousel above claim rows 1-2 explicitly, and grid
       auto-placement would otherwise drop these into row 1 (overlapping
       the date pickers, as it did in ms76 testing). */
    #rvbt-ms-qm-root .qm-stage > .qm-restr-bar {
        grid-column: 1 !important;
        grid-row: 3 !important;
    }
    #rvbt-ms-qm-root .qm-stage > .qm-nights-summary {
        grid-column: 1 !important;
        grid-row: 4 !important;
    }
    /* Make each date card flex-equally in the row */
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date,
    #rvbt-ms-qm-root .qm-pickers--stack .qm-nights {
        flex: 1 1 0;
        min-width: 0;
        padding: 8px 10px;
    }
    /* Smaller, mobile-compatible date typography */
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date .dn {
        font-size: 24px;
    }
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date .dl {
        font-size: 8px;
    }
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date .dm {
        font-size: 9px;
        max-width: 100%;
    }
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date-row {
        gap: 6px;
    }
    /* Nights column more compact */
    #rvbt-ms-qm-root .qm-pickers--stack .qm-nights {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 8px 6px;
    }
    #rvbt-ms-qm-root .qm-pickers--stack .qm-nights .nn { font-size: 22px; line-height: 1; }
    #rvbt-ms-qm-root .qm-pickers--stack .qm-nights .nl { font-size: 8px; }
}

@media (max-width: 900px) {
    /* Hide the "Featuring this month" subtitle on mobile — title alone is enough */
    #rvbt-ms-qm-root .ymap-head .ttl small { display: none; }
    /* Remove ymap-wrap horizontal padding so feature (position:absolute left:0)
       aligns with the viewport's content area */
    #rvbt-ms-qm-root .ymap-wrap { padding: 0 !important; }
    /* Date picker on mobile stacks under the title — single month visible. */
    #rvbt-ms-qm-root .qm-date-picker .dp-calendar {
        padding: 16px 14px 14px;
    }
    /* Hide months 2-4 on tight viewports — user navigates via prev/next */
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month--n2,
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month--n3,
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month--n4 { display: none; }
    /* Single month flexes to full width; no per-side padding or divider */
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month {
        padding: 0 8px;
    }
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month + .dp-cal-month::before {
        display: none;
    }
    /* Modal frame already provides a close button — hide picker's float-X to
       avoid overlap with the calendar's top-right (DOW "Sa" header / next arrow) */
    #rvbt-ms-qm-root .qm-date-picker .dp-close-float { display: none; }
    /* Nav arrows: small inset so they don't crowd month title */
    #rvbt-ms-qm-root .qm-date-picker .dp-nav {
        width: 28px;
        height: 28px;
        top: 14px;
    }
    #rvbt-ms-qm-root .qm-date-picker .dp-nav--prev { left: 8px; }
    #rvbt-ms-qm-root .qm-date-picker .dp-nav--next { right: 8px; }
}

/* Tablet / narrow desktop — 2 months across (auto via flex:1 distribution) */
@media (max-width: 1200px) and (min-width: 901px) {
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month--n3,
    #rvbt-ms-qm-root .qm-date-picker .dp-cal-month--n4 { display: none; }
}

@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-date-picker .dp-month-title { font-size: 16px; }
    #rvbt-ms-qm-root .qm-date-picker .dp-day { font-size: 10px; }
    #rvbt-ms-qm-root .qm-date-picker .dp-quick-pill { font-size: 9px; padding: 5px 10px; }
    #rvbt-ms-qm-root .qm-date-picker .dp-quick-label { font-size: 8px; }
}

@media (max-width: 640px) {
    /* Tighter mobile sizing */
    #rvbt-ms-qm-root .qm-q {
        font-size: 28px !important;
        line-height: 1.1;
    }
    #rvbt-ms-qm-root .qm-chips { gap: 6px; }
    #rvbt-ms-qm-root .qm-chip { font-size: 9px; padding: 4px 8px; }
    /* Featured frame + carousel: shrink */
    #rvbt-ms-qm-root .ymap-feature {
        width: 218px;
        height: 318px;
        top: 50px;
    }
    #rvbt-ms-qm-root .ymap-viewport {
        height: 318px;
        padding-left: 10px;
    }
    #rvbt-ms-qm-root .mini {
        flex: 0 0 178px;
        height: 298px;
        min-height: 0 !important;
    }
    #rvbt-ms-qm-root .mini.is-featured {
        flex: 0 0 198px;
    }
    #rvbt-ms-qm-root .mini[data-season] {
        height: 298px;
        min-height: 0 !important;
    }
    #rvbt-ms-qm-root .mini.mini--endcap {
        flex: 0 0 178px;
        height: 298px;
        min-height: 0 !important;
    }
    /* Headline area padding — bottom padding is increased so the scrollable
       content can scroll PAST the fixed .qm-foot button bar at the bottom */
    #rvbt-ms-qm-root .qm-frame { padding: 60px 14px 140px 14px; }
    #rvbt-ms-qm-root .qm-frame--scroll { padding: 60px 14px 210px 14px; }
    #rvbt-ms-qm-root .ymap-head .ttl { font-size: 16px; }
    #rvbt-ms-qm-root .ymap-head { margin-bottom: 10px; }
    /* Even smaller date picker tappable area on tight screens */
    #rvbt-ms-qm-root .qm-pickers--stack .qm-date .dn { font-size: 20px; }
}

@media (max-width: 380px) {
    /* Extra tight — ultra-narrow phones */
    #rvbt-ms-qm-root .qm-q { font-size: 24px !important; }
    #rvbt-ms-qm-root .ymap-feature {
        width: 198px;
        height: 288px;
    }
    #rvbt-ms-qm-root .ymap-viewport { height: 288px; }
    #rvbt-ms-qm-root .mini {
        flex: 0 0 158px;
        height: 268px;
        min-height: 0 !important;
    }
    #rvbt-ms-qm-root .mini.is-featured {
        flex: 0 0 178px;
    }
    #rvbt-ms-qm-root .mini[data-season] {
        height: 268px;
        min-height: 0 !important;
    }
    #rvbt-ms-qm-root .mini.mini--endcap {
        flex: 0 0 158px;
        height: 268px;
        min-height: 0 !important;
    }
}

/* ══════════════════════════════════════════════════════════════════
   ms8 — Site Lock notice (Step 2) + Category Mode (Step 3)
   ══════════════════════════════════════════════════════════════════ */

/* Step 2 (Locks) — "your exact site isn't guaranteed" callout.
   paintLockNote() flips it to a sage confirmation (.is-locked) once a
   Site/Buddy Lock is held. */
#rvbt-ms-qm-root .qm-locknote {
    width: 100%;
    max-width: 760px;
    margin: -16px auto 24px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(180deg, rgba(255, 250, 240, 0.9) 0%, var(--gold-mist) 100%);
    border: 1px solid rgba(176, 146, 94, 0.34);
    border-left: 3px solid var(--gold);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
    transition: background 0.25s ease, border-color 0.25s ease;
    text-align: left;
}
#rvbt-ms-qm-root .qm-locknote-ic {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    color: var(--gold);
    margin-top: 1px;
}
#rvbt-ms-qm-root .qm-locknote-ic svg { width: 100%; height: 100%; }
#rvbt-ms-qm-root .qm-locknote-text {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13px;
    line-height: 1.4;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-locknote.is-locked {
    background: linear-gradient(180deg, rgba(246, 250, 244, 0.9) 0%, var(--sage-mist) 100%);
    border-color: rgba(126, 139, 122, 0.42);
    border-left-color: var(--sage);
}
#rvbt-ms-qm-root .qm-locknote.is-locked .qm-locknote-ic { color: var(--sage); }

/* Step 3 (Sites) — Category Mode context note */
#rvbt-ms-qm-root .qm-sites-context {
    width: 100%;
    /* 780px: the note's BOX shares the step's content column
       (qm-sfilters / qm-group-bar / lists are 780) — it sat 10px inset
       each side at 760, reading misaligned. Copy stays centered inside
       (user call 2026-07-24). */
    max-width: 780px;
    margin: -20px auto 22px;
    padding: 11px 16px;
    text-align: center;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--mute);
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-sites-context[hidden] { display: none; }
#rvbt-ms-qm-root .qm-sites-context strong { color: var(--gold); font-weight: 600; }

/* Step 3 (Sites) — Category Mode cards */
#rvbt-ms-qm-root .qm-cats {
    /* ms32: category cards now use the full-width Atelier card (qm-asite), so
       stack them single-column exactly like .qm-sites for visual parity. */
    display: block;
    width: 100%;
    max-width: 780px;
    margin: 0 auto 16px;
}
#rvbt-ms-qm-root .qm-cats[hidden] { display: none; }
#rvbt-ms-qm-root .qm-cat {
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 16px 18px 14px;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
#rvbt-ms-qm-root .qm-cat:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}
#rvbt-ms-qm-root .qm-cat.is-selected {
    border-color: var(--ink);
    box-shadow: 0 0 0 3px var(--gold-mist);
}
#rvbt-ms-qm-root .qm-cat-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}
#rvbt-ms-qm-root .qm-cat-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.05;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-cat-price {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-cat-meta {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-cat-foot {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid rgba(176, 146, 94, 0.14);
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
#rvbt-ms-qm-root .qm-cat-select {
    background: transparent;
    border: 1px solid rgba(176, 146, 94, 0.32);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 7px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
#rvbt-ms-qm-root .qm-cat-select:hover {
    border-color: var(--gold);
    background: var(--gold-mist);
}
#rvbt-ms-qm-root .qm-cat.is-selected .qm-cat-select {
    background: linear-gradient(180deg, var(--gold) 0%, var(--gold-soft) 100%);
    border-color: var(--gold);
    color: var(--ivory);
    box-shadow: 0 3px 10px rgba(176, 146, 94, 0.28);
}
#rvbt-ms-qm-root .qm-cat.is-selected .qm-cat-select::before {
    content: "\2713 ";
    margin-right: 2px;
}
@media (max-width: 560px) {
    #rvbt-ms-qm-root .qm-cats { grid-template-columns: 1fr; }
    #rvbt-ms-qm-root .qm-locknote { margin-top: -8px; }
    #rvbt-ms-qm-root .qm-sites-context { margin-top: -10px; }
}

/* ══════════════════════════════════════════════════════════════════
   ms12 — running grand total in the footer (sits before Back/Continue)
   ══════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-foot-total {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    margin-right: 4px;
    padding-right: 16px;
    border-right: 1px dashed var(--line);
    line-height: 1.05;
}
#rvbt-ms-qm-root .qm-foot-total[hidden] { display: none; }
#rvbt-ms-qm-root .qm-foot-total-label {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 8.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    margin-bottom: 3px;
}
#rvbt-ms-qm-root .qm-foot-total-amount {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    font-weight: 600;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}
@media (max-width: 560px) {
    #rvbt-ms-qm-root .qm-foot-total { margin-right: 0; padding-right: 12px; }
    #rvbt-ms-qm-root .qm-foot-total-amount { font-size: 20px; }
}

/* ── Footer total → interactive receipt-breakdown trigger ──────────────────
   The running total becomes a hover/click button that reveals the full price
   breakdown above the footer. A small chevron after the amount flips up while
   the popover is open. */
#rvbt-ms-qm-root .qm-foot-total[role="button"] {
    cursor: pointer;
    border-radius: 10px 0 0 10px;
    margin-left: -6px;
    padding-left: 10px;
    transition: background 0.15s ease;
}
#rvbt-ms-qm-root .qm-foot-total[role="button"]:hover,
#rvbt-ms-qm-root .qm-foot-total.is-rcp-open { background: rgba(176, 146, 94, 0.10); }
#rvbt-ms-qm-root .qm-foot-total[role="button"]:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}
#rvbt-ms-qm-root .qm-foot-total[role="button"] .qm-foot-total-amount::after {
    content: "";
    display: inline-block;
    width: 6px; height: 6px;
    margin-left: 8px;
    border-right: 1.5px solid var(--mute);
    border-bottom: 1.5px solid var(--mute);
    transform: translateY(-3px) rotate(45deg);            /* chevron pointing down */
    transition: transform 0.18s ease, border-color 0.18s ease;
    vertical-align: middle;
}
#rvbt-ms-qm-root .qm-foot-total.is-rcp-open .qm-foot-total-amount::after {
    transform: translateY(0) rotate(-135deg);             /* flips up when open */
    border-color: var(--gold-deep);
}

/* The breakdown popover (mirrors .qm-profile-menu chrome). */
#rvbt-ms-qm-root .qm-receipt-pop {
    position: absolute;
    z-index: 60;
    width: 300px;
    max-width: min(320px, calc(100vw - 24px));
    padding: 15px 17px 16px;
    background: #FFFDF8;
    border: 1px solid rgba(176, 146, 94, 0.35);
    border-radius: 14px;
    box-shadow: 0 18px 44px -18px rgba(26, 20, 16, 0.45),
                inset 0 1px 0 rgba(255, 255, 255, 0.8);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: var(--ink);
    animation: qm-pm-in .18s ease;
}
#rvbt-ms-qm-root .qm-rcp-head {
    display: flex; flex-direction: column; gap: 2px;
    padding-bottom: 11px; margin-bottom: 10px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.22);
}
#rvbt-ms-qm-root .qm-rcp-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px; font-weight: 600; color: var(--ink); line-height: 1.1;
}
#rvbt-ms-qm-root .qm-rcp-dates { font-size: 11px; color: var(--mute); letter-spacing: 0.02em; }
#rvbt-ms-qm-root .qm-rcp-rows { display: flex; flex-direction: column; gap: 8px; }
#rvbt-ms-qm-root .qm-rcp-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; font-size: 12.5px; }
#rvbt-ms-qm-root .qm-rcp-name { color: var(--ink-soft); display: flex; flex-direction: column; gap: 1px; min-width: 0; }
#rvbt-ms-qm-root .qm-rcp-detail { font-size: 10.5px; color: var(--mute-soft); letter-spacing: 0.01em; }
#rvbt-ms-qm-root .qm-rcp-amt { font-weight: 600; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
#rvbt-ms-qm-root .qm-rcp-empty { font-size: 12.5px; color: var(--mute); padding: 3px 0; }
#rvbt-ms-qm-root .qm-rcp-mid {
    margin-top: 10px; padding-top: 10px;
    border-top: 1px solid rgba(176, 146, 94, 0.22);
    display: flex; flex-direction: column; gap: 7px;
}
#rvbt-ms-qm-root .qm-rcp-sub .qm-rcp-name,
#rvbt-ms-qm-root .qm-rcp-sub .qm-rcp-amt { color: var(--mute); font-weight: 600; }
#rvbt-ms-qm-root .qm-rcp-disc .qm-rcp-amt { color: var(--sage-key); }
#rvbt-ms-qm-root .qm-rcp-grand {
    margin-top: 11px; padding-top: 12px;
    border-top: 1.5px solid rgba(176, 146, 94, 0.35);
    display: flex; align-items: baseline; justify-content: space-between;
}
#rvbt-ms-qm-root .qm-rcp-grand span:first-child {
    font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
    font-weight: 600; color: var(--mute);
}
#rvbt-ms-qm-root .qm-rcp-grand span:last-child {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums;
}
#rvbt-ms-qm-root .qm-foot.qm-foot--rcpopen { z-index: 90; }

/* ══════════════════════════════════════════════════════════════════
   ms17 — Order-summary receipt (Review step): elegant single card
   ══════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-receipt {
    width: 100%;
    max-width: 600px;
    margin: 8px auto 18px;
    padding: 26px 30px 22px;
    background: linear-gradient(180deg, var(--ivory) 0%, var(--paper) 34%);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-md);
    position: relative;
    text-align: left;
}
/* (The gold hairline that used to run across the card's top edge is gone. It
   was drawn at top:0 inset 30px, which was fine when the receipt opened with
   its own padding — but the stay header now bleeds to the card's edges, so the
   line cut straight across the two date panels.) */
/* ══════════════════════════════════════════════════════════════════
   STAY SUMMARY — "Double panel" (option 3 of the mockup set at
   master.rvbtsystem.com/stay-header-mockups/, chosen 2026-08-10).

   Arrival and departure are two facing panels, each on its OWN ground, so
   which date is which is carried by the layout and not by the words alone.
   The seam bar underneath holds the countable facts on white, which keeps
   the numbers off the tinted grounds where they read worst.

   Bleeds to the receipt card's padding edges (the card is 26px 30px) and
   takes its top corners; overflow:hidden so the two grounds are clipped by
   that radius instead of squaring off the card.
   ══════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-stay {
    margin: -26px -30px 20px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.30);
    border-radius: var(--r-xl) var(--r-xl) 0 0;
    overflow: hidden;
}
#rvbt-ms-qm-root .qm-stay-panels { display: flex; flex-wrap: wrap; }
#rvbt-ms-qm-root .qm-stay-panel {
    flex: 1 1 190px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px 22px;
    background: #FBF7EE;
}
#rvbt-ms-qm-root .qm-stay-panel--out {
    /* Translucent so the card's own ivory shows through and the two panels
       differ by a softer step than the solid --gold-mist did. Effective colour
       over the card is ~#F3EDDF, on which the label still measures 6.16:1. */
    background: #efe6d3a1;
    text-align: right;
}
#rvbt-ms-qm-root .qm-stay-lab {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    /* #6B5427, a shade below --gold-deep. The mockup used --gold-deep, which
       measures 4.54:1 on the arrival ground but only 3.91:1 on the deeper
       departure ground -- under WCAG AA for 9px text, on the very word that
       tells a guest which date they are reading. This shade holds the gold and
       clears AA on BOTH grounds (6.72:1 / 5.79:1), so the two panels can keep
       the different backgrounds that are the whole idea of the design. */
    color: #6B5427;
}
#rvbt-ms-qm-root .qm-stay-date {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-stay-date:empty { display: none; }
#rvbt-ms-qm-root .qm-stay-time {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11px;
    line-height: 1.35;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-stay-time:empty { display: none; }

/* Seam bar — the countable facts, on white between the panels and the receipt. */
#rvbt-ms-qm-root .qm-stay-bar {
    padding: 11px 22px;
    background: var(--paper);
    border-top: 1px solid rgba(176, 146, 94, 0.22);
}
#rvbt-ms-qm-root .qm-stay-facts {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    /* No column-gap: the dividers own the horizontal spacing, so the space
       either side of a rule stays exactly equal. */
    column-gap: 0;
    row-gap: 6px;
}
#rvbt-ms-qm-root .qm-stay-facts:empty { display: none; }
#rvbt-ms-qm-root .qm-stay-fact {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
}
/* Vertical rule between facts, carried as a ::before on every chip AFTER the
   first so a wrapped chip takes its rule with it instead of leaving one
   stranded at the end of a line. */
#rvbt-ms-qm-root .qm-stay-fact + .qm-stay-fact::before {
    content: "";
    flex: 0 0 auto;
    align-self: center;
    width: 1px;
    height: 12px;
    /* 10/6 rather than 14/8: with five chips in the bar the wider spacing put
       the row 6px over the 554px available at a 600px card, so it wrapped on
       the demo content alone. This leaves ~18px spare. */
    margin: 0 6px 0 10px;
    background: rgba(176, 146, 94, 0.45);
}
/* Set by paintStayPanel() when the chips no longer fit on one line -- CSS
   cannot see line breaks, so the rules drop wholesale and a plain gap takes
   over, rather than every wrapped line opening with a rule separating nothing. */
#rvbt-ms-qm-root .qm-stay-facts.is-wrapped { column-gap: 16px; }
#rvbt-ms-qm-root .qm-stay-facts.is-wrapped .qm-stay-fact + .qm-stay-fact::before { display: none; }
#rvbt-ms-qm-root .qm-stay-fact-lab {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}
/* Reset the tracking so the colon hugs its word ("TOTAL ADULTS:", not " :"). */
#rvbt-ms-qm-root .qm-stay-fact-sep { letter-spacing: 0; margin-left: -0.02em; }
#rvbt-ms-qm-root .qm-stay-fact-val {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}
/* Waiting-list note ("No payment now · ..."). */
#rvbt-ms-qm-root .qm-stay-note {
    margin-top: 8px;
    text-align: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11px;
    line-height: 1.45;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-stay-note:empty { display: none; }

@media (max-width: 560px) {
    /* Stacked, each panel is a full-width row. Departure keeps its own ground
       so the pairing still reads, but its text returns to the left: right-
       aligning a full-width row would put the two dates on opposite edges of
       the card with no shared axis to compare them along. */
    #rvbt-ms-qm-root .qm-stay-panel { flex: 1 1 100%; padding: 15px 20px; }
    #rvbt-ms-qm-root .qm-stay-panel--out { text-align: left; }
    #rvbt-ms-qm-root .qm-stay-bar { padding: 11px 18px; }
    #rvbt-ms-qm-root .qm-stay-facts { column-gap: 14px; row-gap: 6px; }
    #rvbt-ms-qm-root .qm-stay-fact + .qm-stay-fact::before { display: none; }
}

/* (.qm-receipt-top retired with the old header — the band above replaces it.) */
#rvbt-ms-qm-root .qm-receipt-eyebrow {
    display: block;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    margin-bottom: 8px;
}
/* (.qm-receipt-stay / -meta / -times retired in ms236 — the labelled stay band
   above replaces all three. Their painters became paintStayPanel().) */
#rvbt-ms-qm-root .qm-receipt-foot {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.12);
    text-align: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11px;
    letter-spacing: 0.08em;
    color: var(--mute-soft);
}
#rvbt-ms-qm-root .qm-receipt-foot:empty { display: none; }
/* Consent rows on the Review step (terms & conditions + any SMS/marketing
   consent), relocated here from the Contact form. The CARDS themselves are
   styled entirely by the shared .qm-consent* rules — this host only supplies
   the stacking rhythm that .qm-form-grid[data-ms-wf-rendered] gives them on
   the Contact step, at receipt width instead of the 1100px Passport width. */
#rvbt-ms-qm-root .qm-receipt-consent {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(176, 146, 94, 0.16);
    text-align: left;
}
#rvbt-ms-qm-root .qm-receipt-consent[hidden] { display: none; }
/* Rows arrive carrying an inert inline `grid-column: span N` from the Contact
   step's .qm-wf-row grid; this host is a flex column, so neutralise it. */
#rvbt-ms-qm-root .qm-receipt-consent > .qm-field { grid-column: auto !important; margin-top: 0; }
/* The receipt card is narrow — let a long agreement sentence wrap above the
   "Read more" control instead of squeezing both onto one line. */
#rvbt-ms-qm-root .qm-receipt-consent .qm-terms-row { flex-wrap: wrap; }
#rvbt-ms-qm-root .qm-receipt-body {
    display: flex;
    flex-direction: column;
    gap: 7px;
}
/* Classic receipt line: name (+detail) · dotted leader · amount */
#rvbt-ms-qm-root .qm-receipt-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
}
#rvbt-ms-qm-root .qm-receipt-row-name {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 13px;
    color: var(--ink);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-receipt-row-detail {
    font-size: 11px;
    color: var(--mute-soft);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-receipt-lead {
    flex: 1 1 auto;
    align-self: flex-end;
    min-width: 14px;
    border-bottom: 1px dotted rgba(122, 111, 99, 0.4);
    transform: translateY(-3px);
}
#rvbt-ms-qm-root .qm-receipt-row-amt {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 13px;
    color: var(--ink-soft);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-receipt-empty {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 12px;
    color: var(--mute);
    text-align: center;
    padding: 4px 0;
}
/* Coupon row */
#rvbt-ms-qm-root .qm-receipt-coupon {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.12);
}
#rvbt-ms-qm-root .qm-receipt-coupon-input {
    flex: 1 1 auto;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    padding: 5px 0;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-receipt-coupon-input::placeholder {
    color: var(--mute-soft);
    text-transform: none;
    letter-spacing: 0.02em;
}
#rvbt-ms-qm-root .qm-receipt-coupon-input:focus {
    outline: none;
    border-bottom-color: var(--ink);
}
#rvbt-ms-qm-root .qm-receipt-coupon-btn {
    flex: 0 0 auto;
    padding: 7px 18px;
    border-radius: 999px;
    border: 1px solid var(--ink);
    background: transparent;
    color: var(--ink);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
#rvbt-ms-qm-root .qm-receipt-coupon-btn:hover {
    background: var(--ink);
    color: var(--ivory);
}
#rvbt-ms-qm-root .qm-receipt-coupon-btn.is-applied {
    background: var(--gold-mist);
    border-color: var(--gold);
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-receipt-coupon-msg {
    margin-top: 8px;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11px;
    letter-spacing: 0.02em;
    color: var(--sage);
}
#rvbt-ms-qm-root .qm-receipt-coupon-msg[hidden] { display: none; }
#rvbt-ms-qm-root .qm-receipt-coupon-msg.is-error { color: #a43333; }
/* Subtotal + discount lines (appear when a valid coupon is applied) */
#rvbt-ms-qm-root .qm-receipt-adjust {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-top: 10px;
}
#rvbt-ms-qm-root .qm-receipt-adjust:empty { display: none; }
#rvbt-ms-qm-root .qm-receipt-row--discount .qm-receipt-row-name,
#rvbt-ms-qm-root .qm-receipt-row--discount .qm-receipt-row-amt {
    color: var(--sage);
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-receipt-row--discount .qm-receipt-lead {
    border-bottom-color: rgba(126, 139, 122, 0.5);
}
/* Taxes & fees pending / unavailable line (ms126) — quiet, italicised so it
   never reads as a firm charge while the authoritative quote is loading. */
#rvbt-ms-qm-root .qm-receipt-row--muted .qm-receipt-row-name,
#rvbt-ms-qm-root .qm-receipt-row--muted .qm-receipt-row-amt {
    color: var(--mute);
    font-style: italic;
    font-weight: 500;
}
#rvbt-ms-qm-root .qm-receipt-total-calc {
    color: var(--mute);
    font-style: italic;
    font-size: 0.62em;
    letter-spacing: 0.02em;
}
/* Footer price-breakdown popover: pre-tax note + "Subtotal" (not Total) cue. */
#rvbt-ms-qm-root .qm-rcp-note .qm-rcp-name,
#rvbt-ms-qm-root .qm-rcp-note .qm-rcp-amt {
    color: var(--mute);
    font-style: italic;
}
#rvbt-ms-qm-root .qm-rcp-grand--sub span:last-child { color: var(--ink-soft); }

/* "Applicable Fees & Taxes" combined line + (i) breakdown tooltip (ms127) —
   mirrors the guest portal's amount-breakdown row. Pure hover/focus reveal
   (clicking the tabindex icon focuses it → focus-within shows the tooltip),
   so it works for mouse, keyboard AND touch. */
#rvbt-ms-qm-root .qm-receipt-row--feetax .qm-receipt-row-name {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
#rvbt-ms-qm-root .qm-ft-info {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    color: var(--mute-soft);
    cursor: help;
    outline: none;
    transition: color 0.15s ease;
}
#rvbt-ms-qm-root .qm-ft-info:hover,
#rvbt-ms-qm-root .qm-ft-info:focus-visible { color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-ft-info svg { width: 14px; height: 14px; }
#rvbt-ms-qm-root .qm-ft-tip {
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    min-width: 190px;
    max-width: 260px;
    background: var(--ink);
    color: #fff;
    border-radius: 10px;
    padding: 11px 13px;
    box-shadow: 0 14px 34px -12px rgba(26, 20, 16, 0.55);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s;
    z-index: 40;
    text-align: left;
    white-space: normal;
    cursor: default;
}
#rvbt-ms-qm-root .qm-ft-tip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--ink);
}
#rvbt-ms-qm-root .qm-ft-info:hover .qm-ft-tip,
#rvbt-ms-qm-root .qm-ft-info:focus .qm-ft-tip,
#rvbt-ms-qm-root .qm-ft-info:focus-within .qm-ft-tip,
#rvbt-ms-qm-root .qm-ft-info:focus-visible .qm-ft-tip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}
#rvbt-ms-qm-root .qm-ft-tip-title {
    display: block;
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
    font-weight: 600;
    margin-bottom: 7px;
}
#rvbt-ms-qm-root .qm-ft-tip-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 18px;
    font-size: 12px;
    line-height: 1.5;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
}
#rvbt-ms-qm-root .qm-ft-tip-row span:last-child {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-ft-tip { left: auto; right: -4px; transform: translateY(4px); }
    #rvbt-ms-qm-root .qm-ft-info:hover .qm-ft-tip,
    #rvbt-ms-qm-root .qm-ft-info:focus .qm-ft-tip,
    #rvbt-ms-qm-root .qm-ft-info:focus-within .qm-ft-tip { transform: translateY(0); }
    #rvbt-ms-qm-root .qm-ft-tip::after { left: auto; right: 8px; transform: none; }
}
/* Editable extra rows — −/+ stepper + remove ✕ */
#rvbt-ms-qm-root .qm-receipt-row--edit { align-items: center; }
#rvbt-ms-qm-root .qm-receipt-stepper {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-left: 10px;
    flex: 0 0 auto;
}
#rvbt-ms-qm-root .qm-receipt-step {
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--paper);
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
#rvbt-ms-qm-root .qm-receipt-step:hover:not(:disabled) {
    border-color: var(--gold);
    color: var(--gold-deep);
    background: var(--gold-mist);
}
#rvbt-ms-qm-root .qm-receipt-step:disabled { opacity: 0.35; cursor: default; }
#rvbt-ms-qm-root .qm-receipt-qval {
    min-width: 14px;
    text-align: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 12.5px;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}
#rvbt-ms-qm-root .qm-receipt-remove {
    flex: 0 0 auto;
    margin-left: 10px;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* round light chip; hover flips dark (user call 2026-07-24) */
    background: #F1EADB;
    color: #8A8178;
    border-radius: 999px;
    font-size: 10px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
#rvbt-ms-qm-root .qm-receipt-remove:hover { background: #1a1410; color: #F6EFDF; }
/* Total */
#rvbt-ms-qm-root .qm-receipt-total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin-top: 14px;
    padding-top: 15px;
    border-top: 1.5px solid rgba(176, 146, 94, 0.4);
}
#rvbt-ms-qm-root .qm-receipt-total-label {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-receipt-total-amount {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 33px;
    font-weight: 600;
    line-height: 1;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

/* Long-term: "first month's payment" schedule note beneath the total. Warm,
   quiet band — explains that only the first period is due now and the rest is
   billed monthly in the guest portal. */
#rvbt-ms-qm-root .qm-receipt-lt-note {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 11px;
    padding: 10px 13px;
    background: rgba(176, 146, 94, 0.08);
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 10px;
}
#rvbt-ms-qm-root .qm-receipt-lt-note-main {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-receipt-lt-note-sub {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 11px;
    line-height: 1.45;
    color: var(--ink-soft);
}

/* ══════════════════════════════════════════════════════════════════
   ms19 — Contact step: family-member detail blocks + relocated terms
   ══════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-family {
    width: 100%;
    max-width: 1100px;            /* aligns with the widened contact form */
    margin: 4px auto 16px;
}
#rvbt-ms-qm-root .qm-family[hidden] { display: none; }
#rvbt-ms-qm-root .qm-family-head {
    text-align: center;
    margin: 6px 0 16px;
}
#rvbt-ms-qm-root .qm-family-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.1;
    color: var(--ink);
    margin: 0;
}
#rvbt-ms-qm-root .qm-family-sub {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 12.5px;
    letter-spacing: 0.04em;
    color: var(--mute);
    margin: 5px 0 0;
}
#rvbt-ms-qm-root .qm-family-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
#rvbt-ms-qm-root .qm-family-member {
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 16px 20px 18px;
    box-shadow: var(--shadow-sm);
}
#rvbt-ms-qm-root .qm-family-member-label {
    display: block;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    margin-bottom: 12px;
}
#rvbt-ms-qm-root .qm-family-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 18px;
}
/* Email row spans both columns (5th field under first/last + rel/phone). */
#rvbt-ms-qm-root .qm-family-grid .qm-family-span { grid-column: 1 / -1; }
/* Muted "optional" tag beside a field label. */
#rvbt-ms-qm-root .qm-field-opt {
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: 0.75;
    margin-left: 5px;
}
#rvbt-ms-qm-root .qm-terms {
    width: 100%;
    max-width: 1100px;   /* align with the widened Passport form */
    margin: 0 auto 16px;
}
@media (max-width: 560px) {
    #rvbt-ms-qm-root .qm-family-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════
   ms21 — "Atelier" site cards: category dividers · full-width available
   cards · Light-Linen-Sage waiting-list cards (Sites step)
   ══════════════════════════════════════════════════════════════════ */
/* category divider band (centered, editorial) */
/* ── Filter rail on the Sites step — ONE row: category dropdown + quick
       toggles + price sort. Same pill language as the group-bar's Clear all;
       active state fills with the deep gold. The rail NEVER wraps — on
       narrow screens it pans horizontally (hidden scrollbar, app-filter
       style), so it stays a clean single line everywhere. ── */
#rvbt-ms-qm-root .qm-sfilters {
    width: 100%;
    max-width: 780px;
    margin: 0 auto 14px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 2px 6px;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}
#rvbt-ms-qm-root .qm-sfilters::-webkit-scrollbar { display: none; }
#rvbt-ms-qm-root .qm-sfilters[hidden] { display: none; }
/* The rail's controls stretch to cover the full row — no dead space on
   the right (the Category field moved down to the qm-sdiv sub-bar).
   flex-basis stays auto, so when the row gets too tight they shrink to
   content and the rail's horizontal pan takes over as before. */
#rvbt-ms-qm-root .qm-sfilters .qm-ffield,
#rvbt-ms-qm-root .qm-sfilters .qm-fcheck { flex: 1 1 auto; }
#rvbt-ms-qm-root .qm-sfilters .qm-fcheck { justify-content: center; }
#rvbt-ms-qm-root .qm-fchip {
    flex: 0 0 auto;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 254, 251, 0.7);
    border: 1px solid rgba(176, 146, 94, 0.28);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 7px 13px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
#rvbt-ms-qm-root .qm-fchip svg { width: 13px; height: 13px; flex: 0 0 auto; }
#rvbt-ms-qm-root .qm-fchip b { font-weight: 600; color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-fchip:hover { border-color: rgba(176, 146, 94, 0.55); color: var(--ink); }
#rvbt-ms-qm-root .qm-fchip.is-active {
    background: var(--gold-deep);
    border-color: var(--gold-deep);
    color: #FFFDF8;
    box-shadow: 0 2px 10px rgba(140, 110, 60, 0.25);
}
#rvbt-ms-qm-root .qm-fchip.is-active b { color: #FFFDF8; }
/* Labeled dropdown FIELD — small caption over the current value, classic
   form-control anatomy, so guests instantly read it as a filter. */
#rvbt-ms-qm-root .qm-ffield {
    flex: 0 0 auto;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    background: rgba(255, 254, 251, 0.85);
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 12px;
    padding: 8px 14px;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
#rvbt-ms-qm-root .qm-ffield:hover { border-color: rgba(176, 146, 94, 0.6); }
#rvbt-ms-qm-root .qm-ffield.is-open,
#rvbt-ms-qm-root .qm-ffield.is-active {
    border-color: var(--gold-deep);
    box-shadow: 0 2px 12px rgba(140, 110, 60, 0.14);
}
#rvbt-ms-qm-root .qm-ffield-k {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 8.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-ffield.is-active .qm-ffield-k { color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-ffield-v {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-ffield-v b { font-weight: 600; color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-ffield .qm-fcaret {
    width: 11px;
    height: 11px;
    color: var(--mute);
    transition: transform 0.18s ease;
}
#rvbt-ms-qm-root .qm-ffield.is-open .qm-fcaret { transform: rotate(180deg); }
/* Checkbox-style toggles — a real tick box, unmistakably a filter. */
#rvbt-ms-qm-root .qm-fcheck {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
    background: rgba(255, 254, 251, 0.85);
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 12px;
    padding: 0 15px;
    align-self: stretch;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--ink-soft);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}
#rvbt-ms-qm-root .qm-fcheck:hover { border-color: rgba(176, 146, 94, 0.6); color: var(--ink); }
#rvbt-ms-qm-root .qm-fcheck.is-on {
    border-color: var(--gold-deep);
    color: var(--ink);
    box-shadow: 0 2px 12px rgba(140, 110, 60, 0.14);
}
#rvbt-ms-qm-root .qm-fcheck-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    border-radius: 5px;
    border: 1.5px solid rgba(176, 146, 94, 0.5);
    background: #FFFEFB;
    color: #FFFDF8;
    flex: 0 0 auto;
    transition: background 0.15s ease, border-color 0.15s ease;
}
#rvbt-ms-qm-root .qm-fcheck-box svg { width: 10px; height: 10px; }
#rvbt-ms-qm-root .qm-fcheck.is-on .qm-fcheck-box {
    background: var(--gold-deep);
    border-color: var(--gold-deep);
}
/* Active option tick inside the dropdown menu */
#rvbt-ms-qm-root .qm-fdrop-item .tick { display: inline-flex; color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-fdrop-item .tick svg { width: 12px; height: 12px; }

/* Review-step submit error (the shell's .rvbt-ms-overlay .rvbt-ms-error rule
   doesn't reach the template surface, so scope one here). */
#rvbt-ms-qm-root .qm-submit-error:empty { display: none; }
#rvbt-ms-qm-root .qm-submit-error {
    width: 100%;
    /* 600px, matching .qm-receipt above it. This was 720px, so every notice
       overhung the card it belonged to by 60px on each side. */
    max-width: 600px;
    margin: 14px auto 0;
}
#rvbt-ms-qm-root .qm-submit-error .rvbt-ms-error {
    padding: 14px 16px;
    border-left: 3px solid #C57878;
    background: #FFF1F1;
    color: #A44A4A;
    border-radius: 12px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 500;
}

/* Submit-error host on the Review step — visible reason when Confirm fails. */
#rvbt-ms-qm-root .qm-submit-error { width: 100%; max-width: 600px; margin: 0 auto; }
#rvbt-ms-qm-root .qm-submit-error:empty { display: none; }
#rvbt-ms-qm-root .qm-submit-error .rvbt-ms-error {
    background: #FFF1F1;
    border: 1px solid rgba(197, 120, 120, 0.55);
    border-radius: 12px;
    padding: 12px 16px;
    margin-bottom: 14px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    line-height: 1.5;
    color: #A44A4A;
}

/* Existing-account recovery — shown when the email already has an account. Not
   an "error"; a warm prompt offering Sign In / Continue as Guest. */
#rvbt-ms-qm-root .qm-existing-acct {
    background: #FBF7EF;
    border: 1px solid #E7E0D2;
    border-radius: 12px;
    padding: 14px 16px;
    margin: 0 auto 14px;
    max-width: 600px;   /* align with .qm-receipt */
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
}
#rvbt-ms-qm-root .qm-existing-acct-msg {
    font-size: 13px;
    line-height: 1.55;
    color: #5C5346;
    margin-bottom: 12px;
}
#rvbt-ms-qm-root .qm-existing-acct-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
#rvbt-ms-qm-root .qm-ea-btn {
    appearance: none;
    border: 1px solid #D8CFBD;
    border-radius: 10px;
    padding: 10px 18px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
#rvbt-ms-qm-root .qm-ea-btn--primary {
    background: var(--gold, #B0925E);
    border-color: var(--gold, #B0925E);
    color: #FFF;
}
#rvbt-ms-qm-root .qm-ea-btn--primary:hover {
    box-shadow: 0 4px 14px rgba(176, 146, 94, 0.28);
}
#rvbt-ms-qm-root .qm-ea-btn--ghost {
    background: #FFF;
    color: #5C5346;
}
#rvbt-ms-qm-root .qm-ea-btn--ghost:hover {
    border-color: var(--gold, #B0925E);
    background: #FFFDF8;
}

/* ── Waiting-list request panel (Contact step) — legacy order-confirm
       parity in the modal's own language: notice card, watch-for cards,
       when-it-opens + reach segments, recipient rows. ── */
/* Same card anatomy as .qm-form (the container right below it) so the two
   read as one column: identical width, paper background, radius, shadow. */
#rvbt-ms-qm-root .qm-wlpanel {
    width: 100%;
    max-width: 1100px;   /* align with the widened Passport form below it */
    margin: 0 auto 18px;
    padding: 24px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-md);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
#rvbt-ms-qm-root .qm-wlpanel-load {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-wl-notice { display: flex; gap: 12px; align-items: flex-start; }
#rvbt-ms-qm-root .qm-wl-notice-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(120, 140, 110, 0.16);
    color: #5A6B52;
}
#rvbt-ms-qm-root .qm-wl-notice-badge svg { width: 17px; height: 17px; }
#rvbt-ms-qm-root .qm-wl-notice-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.15;
}
#rvbt-ms-qm-root .qm-wl-notice-desc {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    color: var(--ink-soft);
    line-height: 1.55;
    margin-top: 3px;
}
#rvbt-ms-qm-root .qm-wl-axis-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    margin-bottom: 8px;
}
#rvbt-ms-qm-root .qm-wl-axis-label span {
    text-transform: none;
    letter-spacing: 0.02em;
    font-weight: 400;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-wl-watchgrid { display: flex; flex-wrap: wrap; gap: 8px; }
#rvbt-ms-qm-root .qm-wl-wcard {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    background: rgba(255, 254, 251, 0.85);
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 12px;
    padding: 10px 15px;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: var(--ink-soft);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}
#rvbt-ms-qm-root .qm-wl-wcard:hover { border-color: rgba(176, 146, 94, 0.6); color: var(--ink); }
#rvbt-ms-qm-root .qm-wl-wcard.is-on {
    border-color: var(--gold-deep);
    color: var(--ink);
    box-shadow: 0 2px 12px rgba(140, 110, 60, 0.14);
}
#rvbt-ms-qm-root .qm-wl-wcard.is-on .qm-fcheck-box {
    background: var(--gold-deep);
    border-color: var(--gold-deep);
}
#rvbt-ms-qm-root .qm-wl-seg { display: flex; flex-wrap: wrap; gap: 8px; }
#rvbt-ms-qm-root .qm-wl-opt {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 254, 251, 0.85);
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 999px;
    padding: 8px 15px;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--ink-soft);
    transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}
/* Visually-hidden radio — !important beats the shell's input hardening
   (same override class as the anchor-hover gotcha). */
#rvbt-ms-qm-root .qm-wl-opt input {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    appearance: none;
    -webkit-appearance: none;
    pointer-events: none;
}
#rvbt-ms-qm-root .qm-wl-opt:hover { border-color: rgba(176, 146, 94, 0.6); color: var(--ink); }
#rvbt-ms-qm-root .qm-wl-opt.is-on {
    background: var(--gold-deep);
    border-color: var(--gold-deep);
    color: #FFFDF8;
}
#rvbt-ms-qm-root .qm-wl-opt.is-disabled { opacity: 0.45; cursor: not-allowed; }
#rvbt-ms-qm-root .qm-wl-recip { margin-top: 10px; }
#rvbt-ms-qm-root .qm-wl-recip-head {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: var(--ink-soft);
    margin-bottom: 6px;
}
#rvbt-ms-qm-root .qm-wl-recip-head span { font-weight: 400; color: var(--mute); }
#rvbt-ms-qm-root .qm-wl-recip-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 6px; }
#rvbt-ms-qm-root .qm-wl-recip-row input {
    flex: 1 1 auto;
    max-width: 340px;
    background: #FFFEFB;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 10px;
    padding: 8px 12px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-wl-recip-row input:focus { outline: none; border-color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-wl-recip-row input.is-invalid { border-color: #A4543F; background: rgba(164, 84, 63, 0.04); }
#rvbt-ms-qm-root .qm-wl-recip-row input.is-valid { border-color: #6F8F6A; }
#rvbt-ms-qm-root .qm-wl-recip-err {
    flex-basis: 100%;
    display: none;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: #A4543F;
    margin: 0 0 0 2px;
}
#rvbt-ms-qm-root .qm-wl-recip-row.has-err .qm-wl-recip-err { display: block; }
#rvbt-ms-qm-root .qm-wl-recip-x {
    background: transparent;
    border: 0;
    color: var(--mute);
    cursor: pointer;
    font-size: 13px;
    padding: 4px;
}
#rvbt-ms-qm-root .qm-wl-recip-x:hover { color: #C57878; }
#rvbt-ms-qm-root .qm-wl-recip-add {
    background: transparent;
    border: 0;
    color: var(--gold-deep);
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 600;
    padding: 2px 0;
}
#rvbt-ms-qm-root .qm-wl-invalid {
    background: #FFF1F1;
    border: 1px solid rgba(197, 120, 120, 0.5);
    border-radius: 10px;
    padding: 10px 14px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    color: #A44A4A;
}
#rvbt-ms-qm-root .qm-wl-invalid[hidden] { display: none; }
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-wlpanel { padding: 14px; }
    #rvbt-ms-qm-root .qm-wl-recip-row input { max-width: none; }
}
#rvbt-ms-qm-root .qm-fdrop-menu {
    position: absolute;
    z-index: 80;
    min-width: 240px;
    max-width: 320px;
    background: #FFFEFB;
    border: 1px solid rgba(176, 146, 94, 0.32);
    border-radius: 12px;
    box-shadow: 0 16px 44px rgba(70, 52, 28, 0.18);
    padding: 6px;
    animation: qmFdropIn 0.16s ease;
}
@keyframes qmFdropIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: none; }
}
#rvbt-ms-qm-root .qm-fdrop-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 9px 12px;
    border-radius: 8px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    color: var(--ink-soft);
    text-align: left;
    transition: background 0.15s ease, color 0.15s ease;
}
#rvbt-ms-qm-root .qm-fdrop-item:hover { background: rgba(244, 238, 226, 0.75); color: var(--ink); }
#rvbt-ms-qm-root .qm-fdrop-item.is-active { color: var(--ink); font-weight: 600; }
#rvbt-ms-qm-root .qm-fdrop-item .n {
    color: var(--gold-deep);
    font-weight: 600;
    font-size: 11.5px;
}
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-fchip { font-size: 10px; padding: 6px 11px; }
    #rvbt-ms-qm-root .qm-ffield { padding: 6px 11px; }
    #rvbt-ms-qm-root .qm-ffield-v { font-size: 11.5px; }
    #rvbt-ms-qm-root .qm-fcheck { font-size: 10.5px; padding: 0 12px; gap: 7px; }
}
/* "No sites match these filters" state + its reset chip */
#rvbt-ms-qm-root .qm-sites-nomatch {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    padding: 40px 20px;
}
#rvbt-ms-qm-root .qm-fchip--clear { margin-top: 4px; }
/* Band headers (Too small / Waiting list) — the section icons are
   stroke-drawn (clock, ruler), unlike the fill-drawn category star. */
#rvbt-ms-qm-root .qm-sdiv--section { margin-top: 40px; }
#rvbt-ms-qm-root .qm-sdiv--section .qm-sdiv-t svg { fill: none; stroke: var(--gold); }

#rvbt-ms-qm-root .qm-sdiv{text-align:center;margin:24px 0 14px;}
#rvbt-ms-qm-root .qm-sdiv:first-child{margin-top:4px;}
#rvbt-ms-qm-root .qm-sdiv-t{display:inline-flex;align-items:center;gap:9px;font-family:'Cormorant RVBT','Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:600;color:var(--ink);line-height:1.05;}
#rvbt-ms-qm-root .qm-sdiv-t svg{width:17px;height:17px;fill:var(--gold);}
#rvbt-ms-qm-root .qm-sdiv-s{font-size:11.5px;color:var(--mute);letter-spacing:.04em;margin-top:3px;}
#rvbt-ms-qm-root .qm-sdiv-s .cnt{color:var(--gold-deep);font-weight:600;}
#rvbt-ms-qm-root .qm-sdiv-rule{width:60px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);margin:11px auto 0;}

/* shared pills / facts / amenities */
#rvbt-ms-qm-root .qm-catpill{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--gold-deep);background:var(--gold-mist);border:1px solid rgba(176,146,94,.28);border-radius:999px;padding:5px 11px;align-self:flex-start;}
#rvbt-ms-qm-root .qm-catpill svg{width:11px;height:11px;fill:var(--gold);}
/* Sites-left counter pill riding the Category chip — sage when stocked,
   urgent terracotta when only 1–2 sites remain in the category. */
#rvbt-ms-qm-root .qm-cat-pillrow{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;flex-wrap:wrap;}
#rvbt-ms-qm-root .qm-cat-pillrow .qm-catpill{align-self:auto;}
#rvbt-ms-qm-root .qm-catpill--left{color:#3F6B44;background:#EDF3EA;border-color:rgba(63,107,68,.30);}
#rvbt-ms-qm-root .qm-catpill--left.is-low{color:#A9432F;background:#FBEDE8;border-color:rgba(169,67,47,.32);}
/* Per-category quantity stepper — borderless, sits in the card foot just
   LEFT of the Select button, with a small question caption above it: how
   many sites the guest wants from this category (the actual sites are
   system-assigned at booking). The sites-left pill decreases live with it.
   margin-left:auto docks the stepper+Select pair on the foot's right edge
   (the price block keeps the left). */
#rvbt-ms-qm-root .qm-cat-qty{display:inline-flex;flex-direction:column;align-items:center;gap:3px;margin-left:auto;}
#rvbt-ms-qm-root .qm-cat-qty-k{font-family:'Inter RVBT','Inter',sans-serif;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--mute);white-space:nowrap;}
#rvbt-ms-qm-root .qm-cat-qty-row{display:inline-flex;align-items:center;gap:8px;}
#rvbt-ms-qm-root .qm-cat-qty-btn{width:32px;height:32px;border:0;border-radius:999px;background:transparent;color:var(--gold-deep);font-size:20px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .18s ease,color .18s ease;}
#rvbt-ms-qm-root .qm-cat-qty-btn:hover:not(:disabled){background:var(--gold-mist);}
#rvbt-ms-qm-root .qm-cat-qty-btn:disabled{color:var(--mute);cursor:default;opacity:.4;}
#rvbt-ms-qm-root .qm-cat-qty-n{min-width:24px;text-align:center;font-family:'Cormorant RVBT','Cormorant Garamond',Georgia,serif;font-size:20px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;}
/* ── LEDGER card header (site + category cards) — one baseline row: the
   serif name holds the left, a faint dotted leader ties across, and the
   meta cluster sits far right in quiet caps: kind eyebrow (★ Category /
   ★ {category name}) · specs (Up to N ft · Sleeps N) · picked-count, with
   the sites-left STATUS pill as the only boxed element on the row's edge.
   Replaces the stacked pill-row + facts band. ── */
#rvbt-ms-qm-root .qm-asite-head--ledger{display:flex;align-items:center;gap:12px;min-width:0;}
#rvbt-ms-qm-root .qm-asite-head--ledger .qm-asite-nm{margin:0;flex:0 1 auto;min-width:0;}
#rvbt-ms-qm-root .qm-lead{flex:1 1 16px;min-width:16px;border-bottom:1px dotted rgba(176,146,94,.4);}
/* CENTER the meta cluster — the caps items and the sites-left pill share
   one vertical middle (baseline alignment left the pill riding high). */
#rvbt-ms-qm-root .qm-headmeta{display:inline-flex;align-items:center;white-space:nowrap;flex:0 0 auto;}
#rvbt-ms-qm-root .qm-headmeta-k{display:inline-flex;align-items:center;gap:5px;font-family:'Inter RVBT','Inter',sans-serif;font-size:9.5px;line-height:1;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);}
#rvbt-ms-qm-root .qm-headmeta-k svg{width:11px;height:11px;fill:var(--gold);}
#rvbt-ms-qm-root .qm-headmeta-i{display:inline-flex;align-items:center;font-family:'Inter RVBT','Inter',sans-serif;font-size:9.5px;line-height:1;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);}
#rvbt-ms-qm-root .qm-headmeta-i::before{content:'\00b7';margin:0 8px;color:var(--mute);opacity:.55;}
#rvbt-ms-qm-root .qm-headmeta-i--sel{color:var(--gold-deep);}
#rvbt-ms-qm-root .qm-headmeta-i--sel svg{width:11px;height:11px;stroke:currentColor;fill:none;margin-right:4px;}
#rvbt-ms-qm-root .qm-headmeta .qm-catpill--left{margin-left:10px;}
@media (max-width:640px){
    #rvbt-ms-qm-root .qm-asite-head--ledger{flex-wrap:wrap;row-gap:6px;}
    #rvbt-ms-qm-root .qm-lead{display:none;}
    #rvbt-ms-qm-root .qm-headmeta{white-space:normal;flex-wrap:wrap;row-gap:5px;}
}
#rvbt-ms-qm-root .qm-fact{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);}
#rvbt-ms-qm-root .qm-fact svg{width:15px;height:15px;stroke:var(--gold);}
/* Icon-only amenities — BARE glyphs, no circle/chip chrome; larger icons.
   The name shows as a styled tooltip bubble on hover (data-tip → ::after,
   ink-on-cream with a small arrow), instant — no sluggish native title. */
#rvbt-ms-qm-root .qm-amen{position:relative;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;padding:2px;cursor:default;}
#rvbt-ms-qm-root .qm-amen svg{width:19px;height:19px;stroke:var(--gold);fill:var(--gold);}
#rvbt-ms-qm-root .qm-amen::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(3px);background:var(--ink);color:var(--ivory);font-family:'Inter RVBT','Inter',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.06em;line-height:1;padding:7px 11px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;box-shadow:0 4px 14px rgba(0,0,0,.18);z-index:20;}
#rvbt-ms-qm-root .qm-amen::before{content:'';position:absolute;bottom:calc(100% + 3px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ink);opacity:0;pointer-events:none;transition:opacity .15s ease;z-index:20;}
#rvbt-ms-qm-root .qm-amen:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}
#rvbt-ms-qm-root .qm-amen:hover::before{opacity:1;}
#rvbt-ms-qm-root .qm-amen svg circle,#rvbt-ms-qm-root .qm-amen svg path[fill="none"]{fill:none;}

/* price + select button */
#rvbt-ms-qm-root .qm-price-k{font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);display:block;}
#rvbt-ms-qm-root .qm-price-amt{font-family:'Cormorant RVBT','Cormorant Garamond',Georgia,serif;font-size:26px;font-weight:600;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums;}
#rvbt-ms-qm-root .qm-price-amt .per{font-family:'Inter RVBT','Inter',sans-serif;font-size:12px;font-weight:400;color:var(--mute);}
#rvbt-ms-qm-root .qm-price-rate{display:block;font-size:11px;color:var(--mute-soft);margin-top:3px;}
/* Select / View Sites — same compact pill size as the rate-plan chips
   (30 AMP / 50 AMP): 6px×12px padding, 10.5px caps, 1px border. */
#rvbt-ms-qm-root .qm-selbtn{display:inline-flex;align-items:center;gap:6px;font-family:'Inter RVBT','Inter',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:999px;border:1px solid var(--gold);background:var(--paper);color:var(--gold-deep);cursor:pointer;transition:.18s ease;white-space:nowrap;}
#rvbt-ms-qm-root .qm-selbtn:hover{background:var(--gold-mist);}
#rvbt-ms-qm-root .qm-selbtn.is-sel{background:linear-gradient(180deg,var(--gold),var(--gold-deep));border-color:var(--gold-deep);color:var(--ivory);box-shadow:0 3px 12px rgba(176,146,94,.32);}
#rvbt-ms-qm-root .qm-selbtn svg{width:12px;height:12px;stroke:currentColor;fill:none;}
#rvbt-ms-qm-root .qm-toosmall{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:#a43333;font-weight:600;}

/* ── ms251: card-foot CTA column. "More info" moved OUT of here onto the
      amenity row, so Select stands alone. Deliberately NO margin-left:auto:
      the foot is already justify-content:space-between (site cards) and the
      category card's qty stepper owns the auto margin (a second one would
      strand the stepper mid-row). align-self:flex-end bottom-aligns it with
      the price block. ── */
#rvbt-ms-qm-root .qm-asite-cta{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    align-self:flex-end;
    gap:8px;
}
/* WIDTH LOCK. Measured from Inter-600 at 10.5px/.12em tracking, including the
   12px icon, 6px gap, 12px side padding and 1px border:
     SELECT 91.3px · SELECTED 107.7px · VIEW SITES 115.7px
   so an unpinned button JUMPS 16.4px wider the instant it is pressed. Until
   ms251 the More-info pill sat in this column and, being wider than every
   label, silently held the width; with it gone the floor has to be explicit.
   118px clears the longest label (View Sites) with a hair to spare. */
#rvbt-ms-qm-root .qm-asite-cta .qm-selbtn{
    min-width:118px;
    justify-content:center;
}
/* The too-small note is prose, not a pill (~28 chars). Left to size the
   column it would drag the button out to its own length, so it contributes
   nothing (width:0) and then fills whatever the button resolves to
   (min-width:100%), wrapping inside that width. Flex items are blockified,
   so width applies even though it's a <span>. */
#rvbt-ms-qm-root .qm-asite-cta .qm-toosmall{
    width:0;
    min-width:100%;
    text-align:center;
    line-height:1.35;
}
/* ── ms253: "More info" sits on the amenity row as a LINK, not a control —
      underlined text, no pill, no border, so it reads as a link beside the
      icons instead of competing with Select.
      It follows the icons DIRECTLY: the earlier margin-left:auto shoved it to
      the card's far right edge, stranding it a long way from the icons it
      belongs to. Just the row's own 7px gap plus a 3px nudge now. ── */
#rvbt-ms-qm-root .qm-infolink{
    all:unset;
    margin-left:3px;
    align-self:center;
    cursor:pointer;
    font-family:'Inter RVBT','Inter',system-ui,sans-serif;
    font-size:11px;
    font-weight:600;
    letter-spacing:.04em;
    line-height:1.4;
    color:var(--gold-deep);
    white-space:nowrap;
    text-decoration:underline;
    text-underline-offset:3px;
    text-decoration-color:rgba(176,146,94,.55);
    transition:color .18s ease,text-decoration-color .18s ease;
}
#rvbt-ms-qm-root .qm-infolink:hover{
    color:var(--ink);
    text-decoration-color:var(--ink);
}
#rvbt-ms-qm-root .qm-infolink:focus-visible{
    outline:2px solid rgba(176,146,94,.55);
    outline-offset:3px;
    border-radius:3px;
}

/* Atelier available card */
#rvbt-ms-qm-root .qm-asite{display:flex;background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:14px;transition:border-color .18s,box-shadow .18s,transform .18s;}
#rvbt-ms-qm-root .qm-asite:hover{border-color:var(--gold-soft);box-shadow:var(--shadow-md);transform:translateY(-2px);}
#rvbt-ms-qm-root .qm-asite.is-selected{border-color:var(--ink);box-shadow:0 0 0 3px var(--gold-mist),var(--shadow-md);}
#rvbt-ms-qm-root .qm-asite.is-disabled{opacity:.6;}
#rvbt-ms-qm-root .qm-asite.is-disabled .qm-asite-ph{filter:grayscale(.55);}
#rvbt-ms-qm-root .qm-asite-ph{flex:0 0 196px;position:relative;background:var(--sage-mist);}
#rvbt-ms-qm-root .qm-asite-photo{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;}
/* ms245 — background-IMAGE here, NOT the `background` shorthand.
   The shorthand resets every longhand it omits, so this rule was silently
   wiping the background-size:cover / background-position:center set one line
   above (identical specificity, later in the cascade) and restoring the
   initial background-repeat:repeat. Ordinary site cards never showed the bug
   because roomPhotoHTML only adds --scene when there is NO thumbnail; the
   waiting-list cards keep --scene AND layer an inline background-image on
   top, so their photo painted at natural size from the top-left and TILED —
   the "cut off at the bottom and repeated" look. The longhand leaves
   cover/center standing for the inline URL. */
#rvbt-ms-qm-root .qm-asite-photo--scene{background-image:linear-gradient(155deg,#EFE6D3 0%,#B7C0B1 55%,#7E8B7A 100%);}
#rvbt-ms-qm-root .qm-asite-glz{position:absolute;inset:0;background:linear-gradient(125deg,rgba(255,250,235,.12),rgba(26,20,16,.06));}
#rvbt-ms-qm-root .qm-asite-col{flex:1;min-width:0;display:flex;flex-direction:column;}
#rvbt-ms-qm-root .qm-asite-meta{padding:18px 22px 16px;flex:1;display:flex;flex-direction:column;}
#rvbt-ms-qm-root .qm-asite-nm{font-family:'Cormorant RVBT','Cormorant Garamond',Georgia,serif;font-size:25px;font-weight:600;color:var(--ink);line-height:1.05;margin:11px 0 0;}
#rvbt-ms-qm-root .qm-asite-facts{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:13px;}
/* ms251: align-items centre + the link's margin-left:auto dock it at the
   row's right edge, level with the amenity icons. */
#rvbt-ms-qm-root .qm-asite-amens{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:14px;}
/* flex-end: the Select/View-Sites pill (and the qty stepper beside it)
   bottoms out level with the price block's LAST line — the 30/50 AMP
   rate-pill row — so CTA and rate chips share one line. */
#rvbt-ms-qm-root .qm-asite-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 22px;border-top:1px solid var(--line-soft);background:var(--ivory);}

/* Light-Linen-Sage waiting-list card */
#rvbt-ms-qm-root .qm-wlcard{display:flex;background:linear-gradient(180deg,#F4F6EF,#EAEEE0);border:1px solid var(--sage-line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:14px;}
/* sage-mist floor mirrors .qm-asite-ph: the inline background-image REPLACES
   the --scene gradient, so a thumbnail that 404s would otherwise leave a
   transparent hole where the photo should be. */
#rvbt-ms-qm-root .qm-wl-ph{flex:0 0 188px;position:relative;background:var(--sage-mist);}
#rvbt-ms-qm-root .qm-wl-ph .qm-asite-photo--scene{position:absolute;inset:0;filter:saturate(.8) brightness(.96);}
#rvbt-ms-qm-root .qm-wl-glz{position:absolute;inset:0;background:linear-gradient(180deg,rgba(86,97,70,.12) 0%,rgba(57,68,46,.5) 100%);}
#rvbt-ms-qm-root .qm-wl-name{position:absolute;left:15px;right:13px;bottom:13px;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.4);}
#rvbt-ms-qm-root .qm-wl-name b{display:block;font-family:'Cormorant RVBT','Cormorant Garamond',serif;font-size:20px;font-weight:600;line-height:1.05;}
#rvbt-ms-qm-root .qm-wl-name span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;opacity:.92;}
#rvbt-ms-qm-root .qm-wl-body{flex:1;min-width:0;padding:18px 22px;display:flex;flex-direction:column;justify-content:center;gap:11px;border-left:1px solid var(--sage-line);}
#rvbt-ms-qm-root .qm-wl-chip{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;background:#E4E9D6;color:var(--sage-deep);font-size:9.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:999px;}
#rvbt-ms-qm-root .qm-wl-chip svg{width:12px;height:12px;stroke:var(--sage-deep);fill:none;}
#rvbt-ms-qm-root .qm-wl-title{font-family:'Cormorant RVBT','Cormorant Garamond',serif;font-size:23px;font-weight:600;color:var(--sage-darker);line-height:1.05;}
#rvbt-ms-qm-root .qm-wl-sub{font-size:13px;color:var(--sage-deep);max-width:52ch;line-height:1.45;}
#rvbt-ms-qm-root .qm-wl-sub b{color:var(--sage-darker);}
#rvbt-ms-qm-root .qm-wl-sub.alert{color:#a43333;}
#rvbt-ms-qm-root .qm-wl-cta{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-top:2px;}
#rvbt-ms-qm-root .qm-wl-datebox{display:flex;flex-direction:column;gap:1px;padding:7px 14px;background:rgba(255,255,255,.6);border:1px solid var(--sage-line);border-radius:var(--r-sm);}
#rvbt-ms-qm-root .qm-wl-datebox-k{font-size:9px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--sage-key);}
#rvbt-ms-qm-root .qm-wl-datebox-d{font-size:14px;font-weight:600;color:var(--sage-darker);font-variant-numeric:tabular-nums;}
#rvbt-ms-qm-root .qm-wl-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;background:var(--sage);color:#fff;border:1px solid var(--sage);cursor:pointer;transition:.18s ease;}
#rvbt-ms-qm-root .qm-wl-btn:hover{background:var(--sage-deep);border-color:var(--sage-deep);}
#rvbt-ms-qm-root .qm-wl-btn.is-on{background:var(--sage-darker);border-color:var(--sage-darker);}
#rvbt-ms-qm-root .qm-wl-btn svg{width:14px;height:14px;stroke:#fff;fill:none;}
#rvbt-ms-qm-root .qm-wl-note{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--sage-key);}
#rvbt-ms-qm-root .qm-wl-note svg{width:13px;height:13px;stroke:var(--sage);fill:none;}

@media(max-width:600px){
  #rvbt-ms-qm-root .qm-asite{flex-direction:column;}
  #rvbt-ms-qm-root .qm-asite-ph{flex:none;height:150px;}
  #rvbt-ms-qm-root .qm-wlcard{flex-direction:column;}
  #rvbt-ms-qm-root .qm-wl-ph{flex:none;height:140px;}
  #rvbt-ms-qm-root .qm-wl-body{border-left:none;border-top:1px solid var(--sage-line);}
}

/* ── ms38: dead past-day calendar cells — check-in must be a future date ── */
#rvbt-ms-qm-root .mini .cal-grid .d.is-past {
    color: rgba(26, 20, 16, 0.22);
    cursor: default;
    pointer-events: none;
    background: transparent;
}

/* ── ms38/ms39: sites-step "select a site to continue" footer note.
       A soft terracotta pill in the CTA row — same warm language as the rest
       of the page (rounded, hairline border, Inter), with an exclamation coin
       so it reads as guidance, not a crash. Nudges on every blocked click. ── */
#rvbt-ms-qm-root .qm-cta .qm-gate-note {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 15px 9px 10px;
    background: rgba(164, 84, 63, 0.08);
    border: 1px solid rgba(164, 84, 63, 0.28);
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #A4543F;
    margin-right: auto;
    white-space: nowrap;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    animation: qm-gate-note-in .3s ease;
}
#rvbt-ms-qm-root .qm-cta .qm-gate-note::before {
    content: '!';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #A4543F;
    color: #FFF6EA;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1;
    flex: 0 0 auto;
}
#rvbt-ms-qm-root .qm-cta .qm-gate-note[hidden] { display: none; }
#rvbt-ms-qm-root .qm-cta .qm-gate-note.is-nudging { animation: qm-gate-nudge .38s ease; }
@keyframes qm-gate-note-in {
    from { opacity: 0; transform: translateX(-4px); }
    to   { opacity: 1; transform: none; }
}
@keyframes qm-gate-nudge {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(-5px); }
    50%  { transform: translateX(4px); }
    75%  { transform: translateX(-2px); }
    100% { transform: translateX(0); }
}
@media (max-width: 640px) {
    /* ── Phone action bar (ms40/ms41): elegant stacked rows ──
       [ gate note — full row, centered            ]
       [ TOTAL ······································ $120.00 ]
       [ (← Back pill)  (Continue ————————————→) ]
       The Total becomes a receipt-style line (label left, serif amount
       right, dashed hairline below) — the same pricing language as the
       Review receipt — and the buttons share one comfortable row. */
    #rvbt-ms-qm-root .qm-cta { flex-wrap: wrap; gap: 12px; }

    /* The editorial "Up next" preview is desktop furniture — on phones it
       floats semi-transparent over the cards and crowds the sticky bar. */
    #rvbt-ms-qm-root .qm-foot .qm-preview { display: none; }

    /* The fixed bar is TALLER on phones (note + total + buttons stack), so
       the desktop gradient's long transparent top let cards ghost through
       the Total row. Near-solid cream with a short fade + a soft top shadow
       seats the bar on the content, and padding drops to phone scale
       (honoring the iPhone home-indicator inset). */
    #rvbt-ms-qm-root .qm-foot {
        padding: 14px 20px calc(16px + env(safe-area-inset-bottom, 0px));
        gap: 0;
        background: linear-gradient(to top, var(--cream) 0%, var(--cream) 88%, rgba(245, 242, 240, 0) 100%);
        box-shadow: 0 -12px 26px -18px rgba(26, 20, 16, 0.30);
    }

    #rvbt-ms-qm-root .qm-cta .qm-gate-note {
        order: -1;
        flex: 1 1 100%;
        justify-content: center;
        white-space: normal;
        text-align: center;
        font-size: 11.5px;
        line-height: 1.35;
        padding: 8px 12px;
        margin-right: 0;
        border-radius: 12px;
    }

    /* Total: full-width receipt row above the buttons. */
    #rvbt-ms-qm-root .qm-cta .qm-foot-total {
        flex: 1 1 100%;
        flex-direction: row;
        align-items: baseline;
        justify-content: space-between;
        border-right: 0;
        border-bottom: 1px dashed var(--line);
        margin-right: 0;
        padding: 0 2px 10px;
    }
    #rvbt-ms-qm-root .qm-cta .qm-foot-total-label  { margin-bottom: 0; font-size: 9.5px; }
    #rvbt-ms-qm-root .qm-cta .qm-foot-total-amount { font-size: 24px; }

    /* Back: compact bordered pill — a real tap target instead of bare text. */
    #rvbt-ms-qm-root .qm-cta .qm-signin {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 46px;
        padding: 0 15px;
        border: 1px solid rgba(176, 146, 94, 0.35);
        border-radius: 999px;
        background: rgba(255, 254, 251, 0.65);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
    }

    /* Continue: shares the row with Back and owns the remaining width
       (flex-basis 0 so its long label can't force a wrap onto its own line);
       type tightened a touch so every step's label fits beside the pill. */
    #rvbt-ms-qm-root .qm-cta .cta {
        flex: 1 1 0;
        min-width: 0;
        justify-content: center;
        min-height: 46px;
        padding: 14px 12px;
        font-size: 10.5px;
        letter-spacing: 0.13em;
        white-space: nowrap;
    }
}

/* ── ms39: selection-status bar — permanent, fixed-height, no layout shift.
       Empty state reads as a quiet placeholder (dashed hairline, muted copy);
       a selection wakes it into the gold-trimmed count strip. Same box both
       states, so the cards below never move. ── */
#rvbt-ms-qm-root .qm-group-bar { min-height: 52px; }
#rvbt-ms-qm-root .qm-group-bar.is-empty {
    background: rgba(255, 254, 251, 0.45);
    border-style: dashed;
    border-color: rgba(176, 146, 94, 0.22);
    box-shadow: none;
}
#rvbt-ms-qm-root .qm-group-bar.is-empty .qm-group-bar-label {
    color: var(--mute);
    opacity: 0.85;
}
#rvbt-ms-qm-root .qm-group-bar-text strong:empty { display: none; }
#rvbt-ms-qm-root .qm-group-bar .qm-group-bar-label { transition: color .18s ease; }
#rvbt-ms-qm-root .qm-group-bar:not(.is-empty) .qm-group-bar-label { color: var(--ink-soft); }

/* ── Total-available figure on the selection bar — echoes the bar's own
       serif-number + uppercase-label language, holding the bar's LEFT edge
       (the selected-count text carries margin-left:auto and clusters right
       with View / Clear all). Painted by paintGroupCount() once
       availability lands. ── */
#rvbt-ms-qm-root .qm-group-bar-avail {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-group-bar-avail strong {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 19px;
    line-height: 1;
    font-weight: 500;
    color: var(--gold-deep);
}
#rvbt-ms-qm-root .qm-group-bar-avail[hidden] { display: none; }
@media (max-width: 640px) {
    /* Narrow screens: let the bar wrap instead of overflowing — the View
       button keeps its auto margin, so the pill pair stays on the right
       edge even when it drops to its own row. */
    #rvbt-ms-qm-root .qm-group-bar { flex-wrap: wrap; row-gap: 4px; }
}

/* ── ms45: per-site tabs on the extras steps (group bookings).
       "Adding for  (Site 12·2) (Site 14) (Site 18·1)" — the active site's
       panel is what the steppers edit; badges show each site's count. ── */
#rvbt-ms-qm-root .qm-extras-rooms {
    width: 100%;
    max-width: 780px;
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
#rvbt-ms-qm-root .qm-extras-rooms[hidden] { display: none; }
#rvbt-ms-qm-root .qm-extras-rooms-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    margin-right: 4px;
}
#rvbt-ms-qm-root .qm-room-tab {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 15px;
    border: 1px solid rgba(176, 146, 94, 0.30);
    border-radius: 999px;
    background: rgba(255, 254, 251, 0.65);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--ink-soft);
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}
#rvbt-ms-qm-root .qm-room-tab:hover { border-color: var(--gold); color: var(--ink); }
#rvbt-ms-qm-root .qm-room-tab.is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--ivory);
}
#rvbt-ms-qm-root .qm-room-tab-n {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--gold);
    color: #FFF6E1;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}
#rvbt-ms-qm-root .qm-room-tab.is-active .qm-room-tab-n { background: var(--gold); }

/* ── ms45: DB-webform fields on the Contact step ──
       Rendered from the park's webform builder in the modal's own design;
       these cover the pieces the static grid never needed. ── */
#rvbt-ms-qm-root .qm-form-sep {
    height: 1px;
    background: var(--line);
    margin: 8px 0;
}
#rvbt-ms-qm-root .qm-wf-req { color: #A4543F; font-weight: 700; }
#rvbt-ms-qm-root .qm-wf-html {
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-soft);
    padding: 4px 2px;
}
#rvbt-ms-qm-root .qm-wf-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 4px;
}
#rvbt-ms-qm-root .qm-wf-choice {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border: 1px solid rgba(176, 146, 94, 0.30);
    border-radius: 999px;
    background: rgba(255, 254, 251, 0.65);
    font-size: 12.5px;
    color: var(--ink-soft);
    cursor: pointer;
}
#rvbt-ms-qm-root .qm-field.is-invalid input,
#rvbt-ms-qm-root .qm-field.is-invalid textarea,
#rvbt-ms-qm-root .qm-field.is-invalid select {
    border-color: #A4543F;
    background: rgba(164, 84, 63, 0.04);
}
#rvbt-ms-qm-root .qm-field-err {
    display: block;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: #A4543F;
    margin-top: 5px;
    animation: qm-gate-note-in .25s ease;
}
#rvbt-ms-qm-root .qm-terms-row.is-invalid { outline: 1px dashed #A4543F; outline-offset: 6px; border-radius: 6px; }

/* ══════════════════════════════════════════════════════════════════════
   Consent cards (ms124) — the acknowledgment fields at the tail of the
   contact webform: a short "I agree to the terms" checkbox and any long
   SMS/marketing consent. enhanceConsentFields() dresses both as calm tinted
   cards; long blurbs collapse behind a "Read consent" accordion so the form
   stays tidy. Presentation only — inputs keep their name/value/flag wiring.
   ══════════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-consent {
    background: linear-gradient(180deg, #FAF7F0 0%, #F5F0E6 100%);
    border: 1px solid rgba(176, 146, 94, 0.24);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    transition: border-color .18s ease, background .18s ease;
}
#rvbt-ms-qm-root .qm-consent.is-checked {
    border-color: rgba(176, 146, 94, 0.52);
    background: linear-gradient(180deg, #F7F1E4 0%, #F0E8D6 100%);
}
#rvbt-ms-qm-root .qm-consent.is-invalid {
    outline: none;
    border-color: #C57878;
    background: #FFF7F5;
}

/* Short agreement / short single-option card — a calm checkbox row. */
#rvbt-ms-qm-root .qm-consent--check {
    padding: 12px 15px;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-consent--check.qm-terms-row {
    font-size: 12.5px;
    line-height: 1.45;
    margin-top: 0;
    align-items: flex-start;
    /* Match the SMS-consent head (.qm-consent-head) so the two consent rows
       sit on the same rhythm. */
    gap: 11px;
}
/* The agreement sentence takes the free space, which pushes the sibling
   "Read more" to the row's right edge — the same job .qm-consent-title's
   flex:1 1 auto does on the SMS card. Without this the text is flex:0 1 auto,
   shrinks to its content, and "Read more" hugs the end of the sentence. */
/* flex: 0 1 auto — NOT 1 1 auto. A <label> blockified as a flex item is a hit
   area the size of its BOX, so a growing label makes the whole empty band a
   pointer-cursored checkbox toggle: the exact row-wide affordance we removed,
   reintroduced as layout. The label must hug its text; "Read more" is pushed
   right by margin-left:auto on .qm-consent-toggle instead. */
#rvbt-ms-qm-root .qm-terms-row .qm-terms-text { flex: 0 1 auto; min-width: 0; }
#rvbt-ms-qm-root .qm-consent--check input[type="checkbox"] {
    accent-color: var(--gold-deep);
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    margin-top: 1px;
    cursor: pointer;
}
/* (a dead `.qm-consent--check a` rule lived here — it carried no !important so
   the shell's anchor hardening in assets/css/booking-modal.css:1874 overrode it
   entirely. The only anchor in a consent card is the inline poplink, styled
   with !important further down.) */

/* The checkbox is now one of only two affordances on the row, so it must show
   focus. The shared .qm-field rule sets outline:none, which matched it. */
#rvbt-ms-qm-root .qm-consent--check input[type="checkbox"]:focus-visible,
#rvbt-ms-qm-root .qm-consent-cb:focus-visible {
    outline: 2px solid var(--gold-deep);
    outline-offset: 2px;
}

/* Accordion card — long consent tucked behind a "Read consent" toggle. */
#rvbt-ms-qm-root .qm-consent--accordion { padding: 3px 14px 3px 15px; }
#rvbt-ms-qm-root .qm-consent-head {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px 2px 10px 0;
    /* NOT pointer: the row is not a click target. Only the checkbox, its
       <label for> title, and the "Read more" button react — a row-wide pointer
       advertised an interaction that does not exist (user 2026-08-07). */
    cursor: default;
}
/* The label text IS a toggle target, on both consent rows. */
#rvbt-ms-qm-root .qm-consent-title,
#rvbt-ms-qm-root .qm-terms-text { cursor: pointer; }
#rvbt-ms-qm-root .qm-consent-cb {
    accent-color: var(--gold-deep);
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    cursor: pointer;
}
#rvbt-ms-qm-root .qm-consent-title {
    /* Hugs its text — see the note on .qm-terms-text. A stretched label box is
       a stretched click target. */
    flex: 0 1 auto;
    color: var(--ink-soft) !important;
    line-height: 1.35;
}
#rvbt-ms-qm-root .qm-consent-title .qm-wf-req { color: #A4543F; }
#rvbt-ms-qm-root .qm-consent-toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    /* Pushes the toggle to the row's right edge without inflating the label's
       hit area — the label hugs its text (flex: 0 1 auto) and this eats the
       remaining space instead. */
    margin-left: auto;
    border: 0;
    background: transparent;
    padding: 4px 2px;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--gold-deep);
    white-space: nowrap;
    transition: color .15s ease;
}
#rvbt-ms-qm-root .qm-consent-toggle:hover { color: var(--ink); }
/* .qm-consent-chev removed 2026-08-07 — the toggle opens a popup, not an
   inline accordion, so the chevron was a misleading affordance. */
#rvbt-ms-qm-root .qm-consent-body {
    max-height: 600px;
    overflow: hidden;
    opacity: 1;
    margin: 0 4px 10px 28px;
    transition: max-height .30s ease, opacity .22s ease, margin .22s ease;
}
#rvbt-ms-qm-root .qm-consent--accordion.is-collapsed .qm-consent-body {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    margin-bottom: 0;
}
#rvbt-ms-qm-root .qm-consent-text {
    margin: 0;
    padding: 11px 13px;
    border-left: 2px solid var(--gold-soft);
    background: rgba(255, 255, 255, 0.6);
    border-radius: 0 8px 8px 0;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    line-height: 1.62;
    color: var(--mute);
}
/* Keep a required-consent error line fully visible even when collapsed. */
#rvbt-ms-qm-root .qm-consent .qm-field-err { margin: 2px 4px 8px 28px; }

/* Live "looks good" state — legacy shows a green border on valid input. */
#rvbt-ms-qm-root .qm-field.is-valid input,
#rvbt-ms-qm-root .qm-field.is-valid textarea,
#rvbt-ms-qm-root .qm-field.is-valid select {
    border-color: #6F8F6A;
}
/* Top-of-form validation summary — the legacy "One thing to fix…" banner. */
#rvbt-ms-qm-root .qm-wf-banner {
    width: 100%;
    margin: 0 0 16px;
    padding: 13px 16px;
    background: rgba(164, 84, 63, 0.07);
    border: 1px solid rgba(164, 84, 63, 0.26);
    border-radius: 10px;
    animation: qm-gate-note-in .25s ease;
}
#rvbt-ms-qm-root .qm-wf-banner[hidden] { display: none; }
#rvbt-ms-qm-root .qm-wf-banner-title {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #A4543F;
    margin-bottom: 6px;
}
#rvbt-ms-qm-root .qm-wf-banner ul {
    margin: 0;
    padding-left: 18px;
}
#rvbt-ms-qm-root .qm-wf-banner li {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #8C4A38;
    line-height: 1.55;
}

/* ── ms53: email tag-input chips (legacy tag-input parity) ── */
#rvbt-ms-qm-root .qm-tagbox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    border-bottom: 1px solid var(--line);
}
#rvbt-ms-qm-root .qm-field.is-invalid .qm-tagbox { border-color: #A4543F; }
#rvbt-ms-qm-root .qm-field.is-valid .qm-tagbox { border-color: #6F8F6A; }
#rvbt-ms-qm-root .qm-tagbox-chips { display: contents; }
#rvbt-ms-qm-root .qm-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px 5px 11px;
    background: rgba(176, 146, 94, 0.12);
    border: 1px solid rgba(176, 146, 94, 0.30);
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-soft);
    line-height: 1;
}
#rvbt-ms-qm-root .qm-tag-x {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--mute);
    font-size: 10px;
    line-height: 1;
    padding: 2px;
    cursor: pointer;
}
#rvbt-ms-qm-root .qm-tag-x:hover { color: #A4543F; }
#rvbt-ms-qm-root .qm-tagbox-entry {
    flex: 1 1 140px;
    min-width: 120px;
    border: 0 !important;
    background: transparent;
    padding: 6px 2px;
    font: inherit;
    color: inherit;
    outline: none;
}

/* ── ms56: webform-builder grid — the rendered DB form uses the admin's own
       row-N / col-md-X layout. The outer grid becomes a simple column of rows;
       each .qm-wf-row is its own grid sized to the row's span total, so its
       fields always fill the full width. Phones stack everything. ── */
#rvbt-ms-qm-root .qm-form-grid[data-ms-wf-rendered="1"] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
#rvbt-ms-qm-root .qm-wf-row {
    display: grid;
    gap: 14px 18px;
    align-items: start;
}
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-wf-row { grid-template-columns: 1fr !important; }
    #rvbt-ms-qm-root .qm-wf-row .qm-field { grid-column: auto !important; }
}

/* Google Places dropdown must float above the modal overlay. */
.pac-container {
    z-index: 2147483000 !important;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    border-radius: 10px;
    border: 1px solid rgba(176, 146, 94, 0.30);
    box-shadow: 0 14px 34px -14px rgba(26, 20, 16, 0.35);
}

/* ── ms59: cold-load dimming while the DB webform definition arrives ── */
#rvbt-ms-qm-root .qm-form-grid.qm-wf-loading {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

/* ── ms60: price-type pills on site cards (30 AMP / 50 AMP…) ── */
#rvbt-ms-qm-root .qm-rateplans {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}
#rvbt-ms-qm-root .qm-rateplan {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 11px;
    border: 1px solid rgba(176, 146, 94, 0.32);
    border-radius: 999px;
    background: rgba(255, 254, 251, 0.7);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.05em;
    font-weight: 600;
    color: var(--ink-soft);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
#rvbt-ms-qm-root .qm-rateplan b { font-weight: 700; }
#rvbt-ms-qm-root .qm-rateplan:hover { border-color: var(--gold); color: var(--ink); }
#rvbt-ms-qm-root .qm-rateplan.is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--ivory);
}
#rvbt-ms-qm-root .qm-rateplan.is-active b { color: var(--gold); }

/* ── ms64: available-coupon chips on the Review receipt ── */
#rvbt-ms-qm-root .qm-coupon-offers { margin: 2px 0 10px; }
#rvbt-ms-qm-root .qm-coupon-offers[hidden] { display: none; }
#rvbt-ms-qm-root .qm-coupon-offers-msg {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    color: var(--mute);
    line-height: 1.5;
    margin-bottom: 7px;
}
#rvbt-ms-qm-root .qm-coupon-offers-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
#rvbt-ms-qm-root .qm-coupon-offer {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px dashed rgba(176, 146, 94, 0.55);
    border-radius: 8px;
    background: rgba(255, 254, 251, 0.7);
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    transition: border-color .15s ease, background .15s ease;
}
#rvbt-ms-qm-root .qm-coupon-offer:hover { border-color: var(--gold); background: #FFFDF8; }
#rvbt-ms-qm-root .qm-coupon-offer-code {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-coupon-offer-off {
    font-size: 11px;
    font-weight: 600;
    color: var(--gold-deep);
}

/* ── ms67: coupon section = its own tinted panel on the receipt ── */
#rvbt-ms-qm-root .qm-coupon-panel {
    margin: 16px 0 14px;
    padding: 14px 16px 15px;
    background: rgba(176, 146, 94, 0.075);
    border: 1px solid rgba(176, 146, 94, 0.20);
    border-radius: 12px;
}
#rvbt-ms-qm-root .qm-coupon-panel-head {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 10px;
}
#rvbt-ms-qm-root .qm-coupon-panel .qm-coupon-offers { margin: 0 0 10px; }
#rvbt-ms-qm-root .qm-coupon-panel .qm-receipt-coupon { margin: 0; }
#rvbt-ms-qm-root .qm-coupon-panel .qm-coupon-offer { background: #FFFEFB; }

/* ── ms99: Contact-step returning-guest sign-in prompt ──
   Aligns with the .qm-form card (720px, centered). Signed-out = warm gold
   invitation; signed-in = calm sage confirmation. */
#rvbt-ms-qm-root .qm-contact-signin {
    display: flex;
    align-items: center;
    gap: 13px;
    width: 100%;
    max-width: 1100px;   /* align with the widened Passport form below it */
    margin: 0 auto 18px;
    padding: 13px 15px 13px 14px;
    border-radius: 14px;
    box-sizing: border-box;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
}
#rvbt-ms-qm-root .qm-contact-signin.is-signedout {
    background: rgba(176, 146, 94, 0.085);
    border: 1px solid rgba(176, 146, 94, 0.22);
}
#rvbt-ms-qm-root .qm-contact-signin.is-signedin {
    background: rgba(126, 139, 122, 0.10);
    border: 1px solid rgba(126, 139, 122, 0.28);
}
#rvbt-ms-qm-root .qm-csi-ic {
    flex: 0 0 auto;
    width: 34px; height: 34px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
}
#rvbt-ms-qm-root .qm-contact-signin.is-signedout .qm-csi-ic { background: var(--gold-mist); color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-contact-signin.is-signedin  .qm-csi-ic { background: var(--sage-mist); color: var(--sage-deep); }
#rvbt-ms-qm-root .qm-csi-ic svg { width: 18px; height: 18px; display: block; }
#rvbt-ms-qm-root .qm-csi-txt {
    flex: 1 1 auto;
    font-size: 13.5px;
    line-height: 1.42;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-csi-txt b { color: var(--ink); font-weight: 600; }
#rvbt-ms-qm-root .qm-csi-btn.cta {
    flex: 0 0 auto;
    padding: 10px 20px;
    font-size: 12px;
    white-space: nowrap;
}
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-contact-signin { flex-wrap: wrap; gap: 10px 12px; }
    #rvbt-ms-qm-root .qm-csi-txt { flex: 1 1 55%; }
    #rvbt-ms-qm-root .qm-csi-btn.cta { flex: 1 1 100%; justify-content: center; }
}

/* ── ms70: guest sign-in popup + profile chip ──
       The popup lives on document.body (OUTSIDE #rvbt-ms-qm-root), so every
       rule is hard-reset against theme bleed (themes love styling <button>). */
.qm-login-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483200 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    /* the dim lives on the wrap itself — immune to empty-div/stacking quirks */
    background: rgba(26, 20, 16, 0.42) !important;
}
.qm-login-back {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    background: rgba(26, 20, 16, 0.42) !important;
    /* themes love `div:empty{display:none}` — this div is intentionally empty */
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto;
}
.qm-login-wrap .qm-login-card {
    position: relative;
    width: min(400px, calc(100vw - 36px));
    background-color: #FFFEFB !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 16px;
    padding: 26px 26px 22px;
    box-shadow: 0 30px 70px -22px rgba(26, 20, 16, 0.5);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #1a1410;
    animation: qm-gate-note-in .25s ease;
}
.qm-login-wrap button.qm-login-x {
    all: unset;
    position: absolute; top: 12px; right: 14px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 6px;
}
.qm-login-wrap button.qm-login-x:hover { color: #1a1410; }
.qm-login-wrap .qm-login-head { font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif; font-size: 26px; font-weight: 600; color: #1a1410; margin: 0 0 4px; }
.qm-login-wrap .qm-login-sub { font-size: 12.5px; color: #8A8178; line-height: 1.5; margin: 0 0 16px; }
.qm-login-wrap .qm-field { display: flex; flex-direction: column; gap: 4px; margin: 0 0 13px; }
.qm-login-wrap .qm-field-lab { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600; color: #8A8178; }
.qm-login-wrap .qm-login-card input {
    -webkit-appearance: none; appearance: none;
    border: 0 !important;
    border-bottom: 1px solid rgba(176, 146, 94, 0.4) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 32px 8px 2px !important;
    margin: 0;
    font: inherit; font-size: 14px; color: #1a1410;
    outline: none; width: 100%;
    box-sizing: border-box;
}
.qm-login-wrap .qm-login-card input:focus { border-bottom-color: #B0925E !important; }
.qm-login-wrap button.qm-login-eye {
    all: unset;
    position: absolute; right: 0; bottom: 8px;
    width: 22px; height: 22px;
    color: #8A8178; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.qm-login-wrap button.qm-login-eye svg { width: 20px; height: 20px; display: block; }
.qm-login-wrap button.qm-login-eye.is-on { color: #B0925E; }
.qm-login-wrap .qm-login-err { font-size: 12px; font-weight: 600; color: #A4543F; margin: 2px 0 10px; }
.qm-login-wrap .qm-login-err[hidden] { display: none; }
.qm-login-wrap button.qm-login-submit {
    all: unset;
    display: flex; align-items: center; justify-content: center; gap: 10px;
    width: 100%;
    box-sizing: border-box;
    padding: 14px 24px;
    border-radius: 999px;
    background: #1a1410;
    color: #FFF9EC;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600;
    cursor: pointer;
    margin-top: 4px;
    text-align: center;
    transition: background 0.18s ease;
}
.qm-login-wrap button.qm-login-submit:hover { background: #B0925E; }
.qm-login-wrap button.qm-login-submit[disabled] { opacity: 0.6; cursor: default; }
.qm-login-wrap .qm-login-submit .arrow { color: #B0925E; }
.qm-login-wrap .qm-login-submit:hover .arrow { color: #FFF9EC; }
.qm-login-wrap a.qm-login-forgot {
    display: inline-block; margin-top: 12px;
    font-size: 12px; font-weight: 600; color: #8A8178;
    text-decoration: none; border-bottom: 1px dashed rgba(176, 146, 94, 0.5);
}
.qm-login-wrap a.qm-login-forgot:hover { color: #1a1410; }

/* ── Lock wizard (Buddy / Area) — reuses the login popup chrome ────────────
   The wrap/card/close/field/input styles are inherited from .qm-login-wrap /
   .qm-login-card above; these add the wizard-specific step bar, info/summary
   panels and the two-button action row. Warm cream + gold, light mode only. */
.qm-lwz-wrap .qm-lwz-card { width: min(460px, calc(100vw - 32px)); padding: 24px 26px 22px; }
.qm-lwz-wrap .qm-lwz-body { display: block; }
.qm-lwz-wrap .qm-lwz-steps { display: flex; gap: 6px; margin: 2px 0 18px; }
.qm-lwz-wrap .qm-lwz-steps span {
    height: 4px; flex: 1; border-radius: 2px;
    background: #E5DED5; transition: background .2s ease;
}
.qm-lwz-wrap .qm-lwz-steps span.is-on { background: #B0925E; }
.qm-lwz-wrap .qm-lwz-title { font-size: 22px; margin: 0 0 14px; }
.qm-lwz-wrap .qm-lwz-info {
    display: flex; gap: 11px; align-items: flex-start;
    background: #F5F2F0; border-radius: 12px;
    padding: 13px 15px; margin: 0 0 15px;
    font-size: 13px; line-height: 1.55; color: #3A332C;
}
.qm-lwz-wrap .qm-lwz-info svg { flex-shrink: 0; color: #B0925E; margin-top: 1px; }
.qm-lwz-wrap .qm-lwz-info strong { color: #1a1410; font-weight: 600; }
.qm-lwz-wrap .qm-lwz-lead { font-size: 13.5px; line-height: 1.6; color: #3A332C; margin: 0 0 16px; }
.qm-lwz-wrap .qm-lwz-lead strong { color: #1a1410; font-weight: 600; }
.qm-lwz-wrap .qm-lwz-err { margin: 0 0 13px; }
.qm-lwz-wrap .qm-lwz-summary {
    background: #F5F2F0; border-radius: 12px;
    padding: 6px 16px; margin: 0 0 14px;
}
.qm-lwz-wrap .qm-lwz-row {
    display: flex; justify-content: space-between; gap: 12px;
    padding: 9px 0; font-size: 13px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.14);
}
.qm-lwz-wrap .qm-lwz-row:last-child { border-bottom: 0; }
.qm-lwz-wrap .qm-lwz-row span:first-child { color: #8A8178; }
.qm-lwz-wrap .qm-lwz-row span:last-child { font-weight: 600; color: #1a1410; text-align: right; word-break: break-word; }
.qm-lwz-wrap .qm-lwz-note {
    font-size: 12px; line-height: 1.55; color: #7A6F63;
    margin: 0 0 16px; padding-left: 12px;
    border-left: 3px solid #EFE6D3;
}
.qm-lwz-wrap .qm-lwz-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin-top: 4px; }
.qm-lwz-wrap .qm-lwz-btn {
    all: unset;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    box-sizing: border-box; cursor: pointer;
    padding: 12px 20px; border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.qm-lwz-wrap .qm-lwz-btn--go { background: #1a1410; color: #FFF9EC; }
.qm-lwz-wrap .qm-lwz-btn--go:hover { background: #B0925E; }
.qm-lwz-wrap .qm-lwz-btn--go .arrow { color: #B0925E; transition: color .18s ease; }
.qm-lwz-wrap .qm-lwz-btn--go:hover .arrow { color: #FFF9EC; }
.qm-lwz-wrap .qm-lwz-btn--ghost { color: #7A6F63; box-shadow: inset 0 0 0 1px rgba(176, 146, 94, 0.35); }
.qm-lwz-wrap .qm-lwz-btn--ghost:hover { color: #1a1410; background: rgba(176, 146, 94, 0.10); }
@media (max-width: 460px) {
    .qm-lwz-wrap .qm-lwz-actions { flex-direction: column-reverse; }
    .qm-lwz-wrap .qm-lwz-btn { width: 100%; }
}

#rvbt-ms-qm-root .qm-signin--profile {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-transform: none;
    letter-spacing: 0.02em;
    font-size: 12.5px;
    /* ms86: the chip is an interactive menu trigger now — pointer cursor +
       a soft gold hover tint so it reads as clickable. */
    cursor: pointer;
    padding: 8px 13px;
    border-radius: 999px;
    transition: background .16s ease, box-shadow .16s ease;
}
#rvbt-ms-qm-root .qm-signin--profile:hover {
    /* !important required: the shell's theme-hardening reset declares
       `.rvbt-ms-template-overlay a:hover { background: transparent
       !important }` which silently eats any normal-weight background on
       anchors inside the overlay. Higher specificity + !important wins. */
    background: rgba(176, 146, 94, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(176, 146, 94, 0.30);
    color: var(--ink);
}
#rvbt-ms-qm-root .qm-signin-avatar {
    width: 26px; height: 26px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid rgba(176, 146, 94, 0.45);
    display: inline-flex; align-items: center; justify-content: center;
}
#rvbt-ms-qm-root .qm-signin-avatar--initial {
    background: var(--ink);
    color: var(--gold);
    font-size: 12px;
    font-weight: 700;
}
#rvbt-ms-qm-root .qm-signin-name { color: var(--ink); font-weight: 600; }

/* ── ms145: remembered-guest "Welcome back" chip — the small "Not you?"
   escape hatch sits inside the chip; muted until hovered. */
#rvbt-ms-qm-root .qm-signin-forget {
    margin-left: 2px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #7A6F63;
    box-shadow: inset 0 0 0 1px rgba(122, 111, 99, 0.30);
    transition: color .16s ease, box-shadow .16s ease, background .16s ease;
}
#rvbt-ms-qm-root .qm-signin-forget:hover {
    color: #A4543F;
    background: rgba(164, 84, 63, 0.10);
    box-shadow: inset 0 0 0 1px rgba(164, 84, 63, 0.35);
}

/* ── ms75: admin Restrictions on the step-1 calendar ──────────────────────
   Day cells gated by the park's booking rules. Cells stay clickable —
   clicking one flashes the reason pill instead of dying silently.
   .is-restr    = day can't serve the current role (check-in when idle,
                  check-out while ranging): dimmed digit + strike.
   .is-closedday= park fully closed that day: dimmed + diagonal hatch.  */
#rvbt-ms-qm-root .mini .cal-grid .d.has.is-restr {
    color: rgba(26, 20, 16, 0.30);
    background: transparent;
    text-decoration: line-through;
    text-decoration-color: rgba(164, 84, 63, 0.55);
    text-decoration-thickness: 1px;
    font-weight: 400;
}
#rvbt-ms-qm-root .ymap-wrap.is-ranging .mini .cal-grid .d.has.is-restr:hover {
    background: rgba(164, 84, 63, 0.10);
    color: rgba(26, 20, 16, 0.45);
    border-color: rgba(164, 84, 63, 0.25);
}
#rvbt-ms-qm-root .mini .cal-grid .d.has.is-closedday {
    color: rgba(26, 20, 16, 0.26);
    background: repeating-linear-gradient(
        135deg,
        transparent 0 3px,
        rgba(26, 20, 16, 0.10) 3px 4px
    );
    font-weight: 400;
}
/* Selected range endpoints always beat gate styling (classes can coexist
   for one frame during repaints — the solid ink chip must win). */
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive.is-restr,
#rvbt-ms-qm-root .mini .cal-grid .d.is-depart.is-restr,
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive.is-closedday,
#rvbt-ms-qm-root .mini .cal-grid .d.is-depart.is-closedday,
#rvbt-ms-qm-root .mini .cal-grid .d.is-arrive.is-fullday,
#rvbt-ms-qm-root .mini .cal-grid .d.is-depart.is-fullday {
    color: #fff;
    background: #1a1410;
    text-decoration: none;
}

/* ── ms144: real occupancy — fully-booked nights (every unit taken).
   Warm rust wash + strike; clicking flashes the reason pill like closed
   days do (the cell stays clickable — never a silent dead click). */
#rvbt-ms-qm-root .mini .cal-grid .d.has.is-fullday {
    color: rgba(26, 20, 16, 0.32);
    background: rgba(164, 84, 63, 0.14);
    text-decoration: line-through;
    text-decoration-color: rgba(164, 84, 63, 0.75);
    text-decoration-thickness: 1px;
    font-weight: 400;
}
#rvbt-ms-qm-root .mini .cal-grid .d.has.is-fullday:hover {
    background: rgba(164, 84, 63, 0.22);
    color: rgba(26, 20, 16, 0.45);
}

/* ── ms144: occupancy meters — loading / no-data states. The meta row keeps
   its height while the number is empty so the real % never causes a layout
   jump; a month with no real data keeps the quiet bar and no number at all. */
#rvbt-ms-qm-root .mini[data-season] .month-occ-meta { min-height: 38px; }
#rvbt-ms-qm-root .mini[data-season] .month-occ.is-loading .month-occ-track {
    opacity: 0.45;
    animation: qm-occ-pulse 1.4s ease-in-out infinite;
}
#rvbt-ms-qm-root .mini[data-season] .month-occ.is-nodata .month-occ-track,
#rvbt-ms-qm-root .mini[data-season] .month-occ.is-nodata .occ-foot {
    opacity: 0.35;
}
@keyframes qm-occ-pulse {
    0%, 100% { opacity: 0.45; }
    50%      { opacity: 0.20; }
}

/* Restriction notice bar (ms76) — its OWN reserved row just below the
   month carousel, never overlaying the date cells. The bar is always in
   the layout with a fixed min-height, so the notice appearing/leaving
   causes ZERO layout shift (same pattern as the sites-step group bar).
   Terracotta guidance language shared with qm-gate-note. */
#rvbt-ms-qm-root .qm-restr-bar {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    margin-top: 12px;
    width: 100%;
}
#rvbt-ms-qm-root .qm-restr-note {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    max-width: min(100%, 620px);
    padding: 9px 18px 9px 14px;
    background: rgba(164, 84, 63, 0.07);
    border: 1px solid rgba(164, 84, 63, 0.26);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.45;
    color: #A4543F;
    animation: qm-gate-note-in .3s ease;
}
#rvbt-ms-qm-root .qm-restr-note[hidden] { display: none; }
#rvbt-ms-qm-root .qm-restr-note svg { flex: 0 0 auto; }
#rvbt-ms-qm-root .qm-restr-note .qm-restr-txt {
    min-width: 0;
    overflow-wrap: break-word;
}
/* Blocked-click flash: brief nudge so repeat offenders notice the notice. */
#rvbt-ms-qm-root .qm-restr-note.is-flash { animation: qm-gate-nudge .38s ease; }
@media (max-width: 900px) {
    #rvbt-ms-qm-root .qm-restr-bar { min-height: 42px; margin-top: 10px; }
}
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-restr-bar {
        min-height: 40px;
        margin-top: 8px;
        padding: 0 2px;
    }
    #rvbt-ms-qm-root .qm-restr-note {
        align-items: flex-start;
        gap: 8px;
        max-width: 100%;
        padding: 8px 12px 8px 10px;
        border-radius: 10px;
        font-size: 11.5px;
        line-height: 1.4;
    }
    /* Icon rides the first text line when the message wraps. */
    #rvbt-ms-qm-root .qm-restr-note svg { margin-top: 1px; }
}

/* ── ms83: signed-in profile menu (hover/tap on the footer chip) ──────────
   Paper card anchored above the chip inside .qm-cta. Same warm language as
   the rest of the page: cream fill, hairline gold border, soft shadow. */
#rvbt-ms-qm-root .qm-cta { position: relative; }
#rvbt-ms-qm-root .qm-profile-menu {
    position: absolute;
    z-index: 60;
    min-width: 232px;
    max-width: min(300px, 92vw);
    padding: 6px;
    background: #FFFDF8;
    border: 1px solid rgba(176, 146, 94, 0.35);
    border-radius: 14px;
    box-shadow: 0 18px 44px -18px rgba(26, 20, 16, 0.45),
                inset 0 1px 0 rgba(255, 255, 255, 0.8);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    animation: qm-pm-in .18s ease;
}
@keyframes qm-pm-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px 10px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.22);
    margin-bottom: 5px;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-head .qm-signin-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-head .qm-signin-avatar--initial {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #1a1410;
    color: #E8C87D;
    font-size: 14px;
    font-weight: 700;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-id {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-id b {
    font-size: 13px;
    font-weight: 700;
    color: #2A211B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-id small {
    font-size: 11px;
    color: rgba(42, 33, 27, 0.55);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 9px 11px;
    border: 0;
    background: transparent;
    border-radius: 9px;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: #3A2E24;
    text-decoration: none;
    cursor: pointer;
    text-align: left;
    transition: background .14s ease, color .14s ease;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item svg { flex: 0 0 auto; opacity: .75; }
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item:hover {
    background: rgba(176, 146, 94, 0.12);
    color: #1a1410;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item--out {
    color: #A4543F;
    margin-top: 3px;
    border-top: 1px solid rgba(176, 146, 94, 0.18);
    border-radius: 0 0 9px 9px;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item--out:hover {
    background: rgba(164, 84, 63, 0.10);
    color: #8A4030;
}
#rvbt-ms-qm-root .qm-profile-menu .qm-pm-item--out[disabled] {
    opacity: .6;
    cursor: default;
}

/* ms84: lift the fixed footer above the carousel while the profile menu is
   open — cards normally paint over the z-index:3 footer and were washing
   the menu out. Toggled by showQmProfileMenu()/closeQmProfileMenu(). */
#rvbt-ms-qm-root .qm-foot.qm-foot--pmopen { z-index: 90; }

/* ── ms88: group-booking guest assignment (Contact step) ──────────────────
   Paper panel below the lead-guest webform. Each site row: name · segmented
   "Group leader's details / Different guest" toggle · leader star. Choosing
   "Different guest" expands a compact 2-col mini-form. */
#rvbt-ms-qm-root .qm-ga-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    /* Warm light chip (was a near-black #1a1410 pill — the one dark
       element on the cream editorial screens): soft gold-washed paper,
       deep-gold type, hairline gold ring — the same family as the
       CATEGORY / site-tag badges. */
    background: linear-gradient(180deg, #FDF8EE 0%, #F3E9D3 100%);
    color: var(--gold-deep);
    border: 1px solid rgba(176, 146, 94, 0.45);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    white-space: nowrap;
}
/* Same card family as .qm-form above — identical width, radius, border and
   shadow so the two containers align as one column (ms92 user fix). */
#rvbt-ms-qm-root .qm-group-assign {
    width: 100%;
    max-width: 1100px;   /* align with the widened Passport form */
    margin: 0 auto 18px;
    padding: 24px;
    background: var(--paper, #FFFDF8);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-md);
}
#rvbt-ms-qm-root .qm-group-assign[hidden] { display: none; }
#rvbt-ms-qm-root .qm-ga-head { margin-bottom: 14px; }
#rvbt-ms-qm-root .qm-ga-title {
    margin: 10px 0 6px;
    font-size: 20px;
    line-height: 1.2;
}
#rvbt-ms-qm-root .qm-ga-sub {
    margin: 0;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    line-height: 1.55;
    color: rgba(42, 33, 27, 0.62);
}
/* Group-name field — EXACT same .qm-field pattern as the contact form's
   fields above (ms93 user spec); only width/spacing are scoped here. */
#rvbt-ms-qm-root .qm-ga-name {
    max-width: 400px;
    margin: 2px 0 16px;
}
/* Boxed border to match the Passport contact-form fields — the group-assign
   block sits outside .qm-form--passport, so its input otherwise only inherits
   the plain underline (.qm-field input). Mirrors the passport input styling. */
#rvbt-ms-qm-root .qm-ga-name > input {
    border: 1px solid #E7E0D2;
    border-radius: 10px;
    background: #FFF;
    padding: 11px 13px;
    line-height: 1.35;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
#rvbt-ms-qm-root .qm-ga-name > input:focus {
    border-color: var(--gold, #B0925E);
    box-shadow: 0 0 0 3px rgba(176, 146, 94, 0.12);
    background: #FFF;
}
#rvbt-ms-qm-root .qm-ga-opt {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: rgba(42, 33, 27, 0.50);
}
#rvbt-ms-qm-root .qm-ga-row {
    padding: 13px 2px 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.18);
}
#rvbt-ms-qm-root .qm-ga-row:first-child { border-top: 0; }
#rvbt-ms-qm-root .qm-ga-row-head {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
#rvbt-ms-qm-root .qm-ga-site {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    color: #2A211B;
    min-width: 84px;
}
#rvbt-ms-qm-root .qm-ga-seg {
    display: inline-flex;
    background: rgba(176, 146, 94, 0.10);
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 999px;
    padding: 2px;
    gap: 2px;
}
#rvbt-ms-qm-root .qm-ga-seg-btn {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 6px 13px;
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 600;
    color: rgba(42, 33, 27, 0.60);
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-ga-seg-btn.is-active {
    background: #1a1410;
    color: #FFF6E4;
}
#rvbt-ms-qm-root .qm-ga-leader {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    padding: 6px 12px;
    border: 1px solid rgba(176, 146, 94, 0.30);
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 600;
    color: rgba(42, 33, 27, 0.55);
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
#rvbt-ms-qm-root .qm-ga-leader input { position: absolute; opacity: 0; pointer-events: none; }
#rvbt-ms-qm-root .qm-ga-leader svg { opacity: .55; }
#rvbt-ms-qm-root .qm-ga-leader.is-on {
    background: rgba(176, 146, 94, 0.16);
    border-color: var(--gold, #B0925E);
    color: #6B5636;
}
#rvbt-ms-qm-root .qm-ga-leader.is-on svg { opacity: 1; color: var(--gold-deep, #8A6B3F); }
#rvbt-ms-qm-root .qm-ga-mini {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 14px;
    margin-top: 12px;
    padding: 14px;
    background: rgba(176, 146, 94, 0.06);
    border: 1px solid rgba(176, 146, 94, 0.20);
    border-radius: 12px;
}
#rvbt-ms-qm-root .qm-ga-mini .qm-field { margin: 0; }
#rvbt-ms-qm-root .qm-ga-mini input.qm-ga-bad {
    border-color: #A4543F !important;
    box-shadow: 0 0 0 1px rgba(164, 84, 63, 0.35);
}
#rvbt-ms-qm-root .qm-ga-err {
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(164, 84, 63, 0.08);
    border: 1px solid rgba(164, 84, 63, 0.28);
    border-radius: 10px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    color: #A4543F;
}
#rvbt-ms-qm-root .qm-ga-err[hidden] { display: none; }
/* Review-step group summary strip above the site rows */
#rvbt-ms-qm-root .qm-receipt-group {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 9px 12px;
    margin-bottom: 10px;
    background: rgba(176, 146, 94, 0.08);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: 10px;
}
#rvbt-ms-qm-root .qm-receipt-group-txt {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #4A3B2E;
}
/* Extras-step "Group booking · N sites" badge rides in the tabs row */
#rvbt-ms-qm-root .qm-extras-rooms .qm-ga-badge { margin-right: 12px; }
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-group-assign { padding: 16px 14px 14px; }
    #rvbt-ms-qm-root .qm-ga-mini { grid-template-columns: 1fr; }
    #rvbt-ms-qm-root .qm-ga-row-head { gap: 8px; }
    #rvbt-ms-qm-root .qm-ga-leader { margin-left: 0; }
    #rvbt-ms-qm-root .qm-ga-seg { flex-wrap: wrap; }
}

/* ── ms156: selection cart popup ──
       Opened by the sites-step group bar's "View" button; lists every
       selected site/category with per-item remove + Clear all. Lives on
       document.body (OUTSIDE #rvbt-ms-qm-root) like the sign-in popup,
       so every rule is hard-reset against theme bleed. */
.qm-cart-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483200 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(26, 20, 16, 0.42) !important;
    padding: 18px;
}
.qm-cart-wrap .qm-cart-card {
    position: relative;
    box-sizing: border-box;
    width: min(460px, calc(100vw - 36px));
    max-height: min(640px, calc(100vh - 48px));
    display: flex;
    flex-direction: column;
    background-color: #FFFEFB !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 16px;
    padding: 24px 24px 20px;
    box-shadow: 0 30px 70px -22px rgba(26, 20, 16, 0.5);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #1a1410;
    animation: qm-gate-note-in .25s ease;
}
.qm-cart-wrap button.qm-cart-x {
    all: unset;
    position: absolute; top: 12px; right: 14px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 4px;
}
.qm-cart-wrap button.qm-cart-x:hover { color: #1a1410; }
.qm-cart-wrap .qm-cart-head {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px; font-weight: 600; color: #1a1410; margin: 0 0 2px;
}
.qm-cart-wrap .qm-cart-sub { font-size: 12px; color: #8A8178; margin: 0 0 12px; }
.qm-cart-wrap .qm-cart-ghint {
    font-size: 11.5px; color: #5E6B57; line-height: 1.45;
    background: #F3F1E7;
    border: 1px solid rgba(126, 139, 122, 0.35);
    border-radius: 10px;
    padding: 8px 12px; margin: 0 0 10px;
}
.qm-cart-wrap .qm-cart-ghint[hidden] { display: none !important; }
.qm-cart-wrap .qm-cart-list {
    overflow-y: auto;
    flex: 0 1 auto;
    min-height: 0;
    margin: 0 -6px;
    padding: 0 6px;
}
.qm-cart-wrap .qm-cart-row {
    display: flex; align-items: center; gap: 12px;
    padding: 11px 2px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.16);
}
.qm-cart-wrap .qm-cart-row:last-child { border-bottom: 0; }
.qm-cart-wrap .qm-cart-row-info {
    flex: 1 1 auto; min-width: 0;
    display: flex; flex-direction: column; gap: 2px;
}
.qm-cart-wrap .qm-cart-row-info b {
    font-size: 13.5px; font-weight: 600; color: #1a1410;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qm-cart-wrap .qm-cart-row-info span {
    font-size: 11px; letter-spacing: 0.04em; color: #8A8178;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qm-cart-wrap .qm-cart-row-price {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px; font-weight: 600; color: #6B5B3E; white-space: nowrap;
}
.qm-cart-wrap button.qm-cart-row-x {
    all: unset;
    box-sizing: border-box;
    width: 26px; height: 26px;
    border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 auto;
    font-size: 11px; line-height: 1; color: #8A8178;
    border: 1px solid rgba(176, 146, 94, 0.28);
    cursor: pointer;
    transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.qm-cart-wrap button.qm-cart-row-x:hover {
    color: #A4543F; border-color: #C57878; background: #FFF1F1;
}
.qm-cart-wrap .qm-cart-empty {
    font-size: 12.5px; color: #8A8178; line-height: 1.5;
    padding: 14px 2px 6px;
}
.qm-cart-wrap .qm-cart-total {
    display: flex; align-items: baseline; justify-content: space-between;
    border-top: 1px solid rgba(176, 146, 94, 0.35);
    margin-top: 4px; padding-top: 12px;
}
.qm-cart-wrap .qm-cart-total[hidden] { display: none !important; }
.qm-cart-wrap .qm-cart-total-label {
    font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
    font-weight: 600; color: #8A8178;
}
.qm-cart-wrap .qm-cart-total-amt {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px; font-weight: 600; color: #1a1410;
}
.qm-cart-wrap .qm-cart-note { font-size: 10.5px; color: #B3A895; margin-top: 2px; }
.qm-cart-wrap .qm-cart-note[hidden] { display: none !important; }
.qm-cart-wrap .qm-cart-foot {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; margin-top: 16px;
}
.qm-cart-wrap button.qm-cart-clear {
    all: unset;
    box-sizing: border-box;
    font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
    font-weight: 500; color: #8A8178;
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 999px;
    padding: 8px 16px; cursor: pointer; text-align: center;
    transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.qm-cart-wrap button.qm-cart-clear:hover {
    color: #C57878; border-color: #C57878; background: #FFF1F1;
}
.qm-cart-wrap button.qm-cart-done {
    all: unset;
    box-sizing: border-box;
    font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
    font-weight: 600; color: #FFF9EC;
    background: #1a1410;
    border-radius: 999px;
    padding: 10px 22px; cursor: pointer; text-align: center;
    transition: background .18s ease;
}
.qm-cart-wrap button.qm-cart-done:hover { background: #B0925E; }

/* ── ms167: All-categories accordion (FAQ pattern) ──
       The bookable list groups under clickable category header rows;
       each folds its site cards out (grid-rows 0fr→1fr animation).
       Flat list returns when a single category is filtered. ── */
#rvbt-ms-qm-root .qm-acchead {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.9) 0%, rgba(244, 238, 226, 0.75) 100%);
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: var(--r-lg);
    padding: 14px 18px;
    margin: 0 0 10px;
    cursor: pointer;
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
    transition: border-color .18s ease, box-shadow .18s ease;
}
#rvbt-ms-qm-root .qm-acchead:hover { border-color: rgba(176, 146, 94, 0.55); }
#rvbt-ms-qm-root .qm-acchead.is-open {
    border-color: var(--gold-deep);
    box-shadow: 0 2px 12px rgba(140, 110, 60, 0.12);
}
#rvbt-ms-qm-root .qm-acchead-name {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.05;
}
#rvbt-ms-qm-root .qm-acchead-name svg { width: 15px; height: 15px; fill: var(--gold); }
#rvbt-ms-qm-root .qm-acchead-sel {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 600;
    color: #FFF9EC;
    background: var(--gold-deep);
    border-radius: 999px;
    padding: 4px 10px;
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-acchead-meta {
    margin-left: auto;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
    white-space: nowrap;
}
#rvbt-ms-qm-root .qm-acchead-meta b {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
    color: var(--gold-deep);
}
#rvbt-ms-qm-root .qm-acchead-caret {
    width: 14px;
    height: 14px;
    color: var(--mute);
    flex: 0 0 auto;
    transition: transform .25s ease;
}
#rvbt-ms-qm-root .qm-acchead.is-open .qm-acchead-caret { transform: rotate(180deg); }
#rvbt-ms-qm-root .qm-accbody {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s ease;
}
#rvbt-ms-qm-root .qm-accbody.is-open { grid-template-rows: 1fr; }
#rvbt-ms-qm-root .qm-accbody-in { overflow: hidden; min-height: 0; }
@media (max-width: 640px) {
    #rvbt-ms-qm-root .qm-acchead { padding: 12px 14px; gap: 9px; }
    #rvbt-ms-qm-root .qm-acchead-name { font-size: 17px; }
    #rvbt-ms-qm-root .qm-acchead-meta { font-size: 9.5px; }
}

/* ── Consent "Read more" popup (ms177) — body-mounted like .qm-cart-wrap,
      every control hard-reset (all:unset) so no theme button styles leak. ── */
/* ── Submitting block ────────────────────────────────────────────────────────
   Full-page scrim shown the instant Confirm is pressed and held until the
   redirect lands. Replaces the old "Submitting…" button relabel, which was easy
   to miss and left the rest of the page clickable mid-request.
   Body-appended like .qm-conpop-wrap, so it uses literal colours (the --paper
   etc. custom properties are scoped to #rvbt-ms-qm-root) and !important on
   layout to survive park themes. Sits ABOVE the consent popup (…300). */
.qm-submitting-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483400 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(26, 20, 16, 0.58) !important;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    cursor: wait !important;
    animation: qm-submitting-in .14s ease both;
}
@keyframes qm-submitting-in { from { opacity: 0; } to { opacity: 1; } }
.qm-submitting-wrap .qm-submitting {
    box-sizing: border-box;
    width: min(430px, 100%);
    background: #FFFEFB;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(26, 20, 16, 0.35);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #2A241D;
    padding: 32px 28px 26px;
    text-align: center;
}
.qm-submitting-wrap .qm-submitting-spin {
    width: 34px;
    height: 34px;
    margin: 0 auto 16px;
    border-radius: 50%;
    border: 2.5px solid rgba(176, 146, 94, 0.28);
    border-top-color: #B0925E;
    animation: qm-submitting-spin .8s linear infinite;
}
@keyframes qm-submitting-spin { to { transform: rotate(360deg); } }
.qm-submitting-wrap .qm-submitting-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 25px;
    font-weight: 600;
    color: #1a1410;
    line-height: 1.2;
}
.qm-submitting-wrap .qm-submitting-sub {
    margin-top: 7px;
    font-size: 13.5px;
    line-height: 1.5;
    color: #6B6152;
}
.qm-submitting-wrap .qm-submitting-warn {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(176, 146, 94, 0.22);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.45;
    color: #8C5A2B;
}
@media (max-width: 480px) {
    .qm-submitting-wrap .qm-submitting { padding: 26px 20px 22px; }
    .qm-submitting-wrap .qm-submitting-title { font-size: 22px; }
}
/* Respect reduced-motion: keep the state legible, drop the spin + fade. */
@media (prefers-reduced-motion: reduce) {
    .qm-submitting-wrap { animation: none; }
    .qm-submitting-wrap .qm-submitting-spin { animation: none; border-top-color: #B0925E; }
}

.qm-conpop-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483300 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(26, 20, 16, 0.42) !important;
    padding: 18px;
}
.qm-conpop-wrap .qm-conpop {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: min(660px, 100%);
    max-height: min(82vh, 780px);
    background: #FFFEFB;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(26, 20, 16, 0.35);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #2A241D;
    padding: 22px 26px 20px;
}
/* Quiet close — same treatment as the selection cart's ✕ */
.qm-conpop-wrap button.qm-conpop-x {
    all: unset;
    position: absolute; top: 15px; right: 17px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 6px;
}
.qm-conpop-wrap button.qm-conpop-x:hover { color: #1a1410; }
.qm-conpop-wrap .qm-conpop-head { margin: 0 28px 4px 0; padding: 0; border: 0; }
.qm-conpop-wrap .qm-conpop-title {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    font-weight: 600;
    color: #1a1410;
    line-height: 1.15;
}
.qm-conpop-wrap .qm-conpop-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    margin-top: 12px;
    scrollbar-width: thin;
    scrollbar-color: rgba(176, 146, 94, 0.4) transparent;
}
.qm-conpop-wrap .qm-conpop-body::-webkit-scrollbar { width: 8px; }
.qm-conpop-wrap .qm-conpop-body::-webkit-scrollbar-track { background: transparent; }
.qm-conpop-wrap .qm-conpop-body::-webkit-scrollbar-thumb { background: rgba(176, 146, 94, 0.4); border-radius: 8px; }
.qm-conpop-wrap .qm-conpop-text {
    font-size: 13.5px;
    line-height: 1.7;
    color: #4A4238;
    white-space: pre-line;
    margin: 0;
}
.qm-conpop-wrap .qm-conpop-frame {
    display: block;
    width: 100%;
    height: min(62vh, 600px);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: 10px;
    background: #FFF;
}
.qm-conpop-wrap .qm-conpop-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(176, 146, 94, 0.22);
}
.qm-conpop-wrap button.qm-conpop-done {
    all: unset;
    box-sizing: border-box;
    background: #1a1410;
    color: #F6EFDF;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-align: center;
    padding: 11px 26px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .18s ease;
}
.qm-conpop-wrap button.qm-conpop-done:hover { background: #B0925E; }
/* The consent popup's OK button only — a slimmer control than the confirm
   dialog's "Yes, remove", which keeps the 11px .qm-conpop-done padding.
   Scoped by its own class so the two never drift into each other. */
.qm-conpop-wrap button.qm-conpop-ok {
    padding-top: 5px;
    padding-bottom: 5px;
}
/* The linked PHRASE inside the terms sentence (e.g. "Terms & Conditions")
   stays an inline <a> so it reads as part of the sentence.
   !important is REQUIRED here: the shell hardens every anchor in the overlay
   against park themes with `color: inherit !important; text-decoration: none
   !important` (assets/css/booking-modal.css:1874-1887). Without it this link is
   indistinguishable from the surrounding text. */
#rvbt-ms-qm-root .qm-terms-row a[data-ms-consent-pop] {
    color: var(--gold-deep) !important;
    font-weight: 600;
    text-decoration: underline !important;
    text-underline-offset: 2px;
    cursor: pointer;
}
/* --ink, matching .qm-consent-toggle:hover — both controls open the SAME popup,
   so they must not hover to different colours. */
#rvbt-ms-qm-root .qm-terms-row a[data-ms-consent-pop]:hover { color: var(--ink) !important; }

/* "Read more" on the terms row is now a real .qm-consent-toggle BUTTON — the
   same element and classes as the SMS-consent one — so its colour, font-size
   and hover come straight from that rule (~line 6598) and cannot drift.
   A <button> is also immune to the anchor hardening above, which is exactly
   why the SMS one always looked right and this one did not.
   Only its placement in the row is specific to the terms layout. */
#rvbt-ms-qm-root .qm-terms-row .qm-consent-more { align-self: flex-start; }

/* ── Review step (8) polish — ms178 ─────────────────────────────── */
/* "One last look — review your order, then confirm." — easier to read */
#rvbt-ms-qm-root[data-ms-step="8"] .qm-sub {
    font-size: 17px;
    line-height: 1.5;
    color: #4A4238;
}
/* Confirm variant of the consent popup (Review ✕ buttons) */
.qm-conpop-wrap .qm-conpop--confirm { width: min(460px, 100%); }
.qm-conpop-wrap .qm-conpop-note {
    font-size: 12px;
    line-height: 1.55;
    color: #6B5E4E;
    background: #F7F2E9;
    border: 1px solid rgba(176, 146, 94, 0.25);
    border-radius: 10px;
    padding: 9px 12px;
    margin: 10px 0 0;
}
.qm-conpop-wrap .qm-conpop-foot--confirm { gap: 10px; }
.qm-conpop-wrap button.qm-conpop-ghost {
    all: unset;
    box-sizing: border-box;
    background: #F4EEE2;
    color: #6B5E4E;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-align: center;
    padding: 11px 22px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}
.qm-conpop-wrap button.qm-conpop-ghost:hover { background: #E9E0CC; color: #2A241D; }

/* ── ms203: restriction popup — native dialog for date-pick rules ──
   Lives on document.body (OUTSIDE #rvbt-ms-qm-root), same theme-bleed-proof
   pattern as .qm-login-wrap / .qm-conpop-wrap. Anatomy mirrors the modal's
   established .qm-conpop dialog exactly: gold-hairline cream card, quiet ✕,
   Inter caps eyebrow, left-aligned Cormorant serif title, hairline-topped
   footer, ink pill button with gold hover. Terracotta appears only as the
   eyebrow's leading dot — the restriction accent, not an alert color. */
.qm-restr-popup {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483210 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(26, 20, 16, 0.42) !important;
    padding: 18px;
}
.qm-restr-popup[hidden] { display: none !important; }
.qm-restr-popup .qm-restr-popup-back {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    background: transparent !important;
    display: block !important;
    pointer-events: auto;
}
.qm-restr-popup .qm-restr-popup-card {
    position: relative;
    box-sizing: border-box;
    width: min(460px, 100%);
    /* Same canvas as the date-picker stage (#rvbt-ms-qm-root): ivory→cream
       radial, plus a UNIQUE left-side scene in the modal's palette — NO
       mountain silhouettes (those belong to the main modal's qm-mtns):
       a pine cluster on the left standing on a gentle meadow line, with a
       faint gold sun and birds above. Watermark opacities throughout. */
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 460 110' preserveAspectRatio='none'%3E%3Cpath d='M0,110 L0,100 C80,92 180,96 280,100 C350,103 420,102 460,104 L460,110 Z' fill='%237E8B7A' fill-opacity='.12'/%3E%3Cpath d='M12,58 L0,84 L24,84 Z M12,70 L-2,100 L26,100 Z M9,100 h6 v6 h-6 Z' fill='%237E8B7A' fill-opacity='.18'/%3E%3Cpath d='M40,34 L24,68 L56,68 Z M40,52 L20,92 L60,92 Z M36,92 h8 v10 h-8 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Cpath d='M78,50 L65,78 L91,78 Z M78,62 L61,96 L95,96 Z M75,96 h6 v8 h-6 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Ccircle cx='130' cy='34' r='15' fill='%23B0925E' fill-opacity='.15'/%3E%3Cpath d='M158,26 q4,-4 8,0 q4,-4 8,0 M172,16 q3.5,-3.5 7,0 q3.5,-3.5 7,0' stroke='%23B0925E' stroke-opacity='.30' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% 100px,
        radial-gradient(ellipse at 50% 38%, #FBF8F4 0%, #EFEAE5 100%) !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(26, 20, 16, 0.35);
    padding: 24px 26px 20px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #2A241D;
    text-align: left;
    animation: qm-gate-note-in .25s ease;
}
/* Quiet close — same treatment as .qm-conpop-x / the selection cart's ✕ */
.qm-restr-popup button.qm-restr-popup-x {
    all: unset;
    position: absolute; top: 15px; right: 17px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 6px;
}
.qm-restr-popup button.qm-restr-popup-x:hover { color: #1a1410; }
.qm-restr-popup .qm-restr-popup-eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #8A8178;
    margin: 0 28px 6px 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qm-restr-popup .qm-restr-popup-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 1.12;
    color: #1a1410;
    margin: 0 24px 0 0;
}
.qm-restr-popup .qm-restr-popup-body {
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.7;
    color: #4A4238;
    margin: 12px 0 0;
    overflow-wrap: break-word;
}
/* Icon rows — one line per rule, in the same soft note chip the modal's
   dialogs use (.qm-conpop-note). */
.qm-restr-popup .qm-restr-popup-rules {
    list-style: none;
    margin: 12px 0 0;
    padding: 4px 14px;
    /* Paper card on the cream canvas — same layering as the pickers. */
    background: #FFFFFF;
    border: 1px solid rgba(176, 146, 94, 0.25);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(26, 20, 16, 0.04);
}
.qm-restr-popup .qm-restr-popup-rules[hidden] { display: none; }
.qm-restr-popup .qm-restr-popup-rules li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-size: 12.5px;
    font-weight: 500;
    color: #4A4238;
}
.qm-restr-popup .qm-restr-popup-rules li + li {
    border-top: 1px solid rgba(176, 146, 94, 0.18);
}
.qm-restr-popup .qm-restr-popup-rules li svg {
    flex: 0 0 auto;
    width: 15px; height: 15px;
    color: #A4543F;
}
.qm-restr-popup .qm-restr-popup-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.22);
}
/* Slim ink pill — "OK, got it" on the modal's dark fill, with NO vertical
   padding (user-specified): the pill hugs its text line, gold on hover. */
.qm-restr-popup button.qm-restr-popup-ok {
    all: unset;
    box-sizing: border-box;
    background: #1a1410;
    color: #F6EFDF;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.8;
    padding: 5px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .18s ease;
}
.qm-restr-popup button.qm-restr-popup-ok:hover { background: #B0925E; }
.qm-restr-popup button.qm-restr-popup-ok:focus-visible {
    outline: 2px solid #B0925E;
    outline-offset: 3px;
}
@media (max-width: 640px) {
    .qm-restr-popup { padding: 14px; }
    .qm-restr-popup .qm-restr-popup-card { padding: 20px 20px 16px; border-radius: 16px; }
    .qm-restr-popup .qm-restr-popup-title { font-size: 22px; }
}

/* ── ms223: "See on map" pill over the site-card photo ─────────────────── */
#rvbt-ms-qm-root .qm-seemap {
    position: absolute; left: 10px; bottom: 10px; z-index: 2;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px; border: 0; border-radius: 999px; cursor: pointer;
    background: rgba(26, 20, 16, 0.62); color: #FFFDF7;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
    -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
    box-shadow: 0 2px 10px rgba(26, 20, 16, 0.35);
    transition: background 0.18s ease, transform 0.18s ease;
}
#rvbt-ms-qm-root .qm-seemap:hover { background: rgba(26, 20, 16, 0.8); transform: translateY(-1px); }
#rvbt-ms-qm-root .qm-seemap svg { width: 13px; height: 13px; flex: 0 0 auto; }

/* ── ms223: "See on map" popup ── body-mounted like the cart/conpop chassis:
      literal colors + !important on the wrap so park-page CSS can't bleed in.
      Engine + numbers ported from the guest portal's attention-page site-map
      modal (site-map-modal.php); palette swapped to the wizard's forest green. */
.qm-sitemap-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483260 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(26, 20, 16, 0.5) !important;
    padding: 18px;
}
.qm-sitemap-wrap .qm-sitemap-card {
    position: relative;
    box-sizing: border-box;
    display: flex; flex-direction: column;
    width: min(980px, calc(100vw - 24px));
    max-height: min(780px, calc(100vh - 32px));
    background-color: #FFFEFB !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 70px -22px rgba(26, 20, 16, 0.55);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #1a1410;
    animation: qm-gate-note-in .25s ease;
}
.qm-sitemap-wrap .qm-sitemap-head {
    display: flex; align-items: flex-start; gap: 14px;
    padding: 18px 22px 14px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.18);
}
.qm-sitemap-wrap .qm-sitemap-copy { flex: 1; min-width: 0; }
.qm-sitemap-wrap .qm-sitemap-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px; font-weight: 600; color: #1a1410; line-height: 1.1;
}
.qm-sitemap-wrap .qm-sitemap-sub { font-size: 12.5px; color: #8A8178; margin-top: 2px; line-height: 1.45; }
.qm-sitemap-wrap .qm-sitemap-sub b { color: #1a1410; font-weight: 600; }
.qm-sitemap-wrap button.qm-sitemap-x {
    all: unset;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 9px;
    background: #F3F1E7; color: #8A8178;
    font-size: 13px; line-height: 1; text-align: center;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.qm-sitemap-wrap button.qm-sitemap-x:hover { background: #EAE6D8; color: #1a1410; }
.qm-sitemap-wrap .qm-sitemap-stage {
    position: relative;
    flex: 1 1 auto;
    /* min-height is LOAD-BEARING (attention-modal lesson): the card is
       max-height, and this stage's only children are absolutely positioned —
       with flex:1;min-height:0 it measures 0px and the map renders 0×0. */
    min-height: min(58vh, 480px);
    overflow: hidden;
    background: repeating-linear-gradient(45deg, #F7F4EE 0 10px, #F3F0E7 10px 20px);
    /* Own every gesture: without this the browser hijacks one-finger drags
       for page scroll and two-finger pinch for page zoom. */
    touch-action: none;
    cursor: grab;
}
.qm-sitemap-wrap .qm-sitemap-stage.is-panning { cursor: grabbing; }
.qm-sitemap-wrap .qm-sitemap-canvas {
    position: absolute; top: 0; left: 0;
    transform-origin: 0 0;
    will-change: transform;
    /* Only preset jumps animate; wheel/pinch/drag set .is-live first. */
    transition: transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.qm-sitemap-wrap .qm-sitemap-canvas.is-live { transition: none; }
.qm-sitemap-wrap .qm-sitemap-canvas img {
    display: block; width: 100%; height: 100%;
    user-select: none; -webkit-user-drag: none;
}
.qm-sitemap-wrap .qm-sitemap-canvas svg {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    overflow: visible;
    pointer-events: none;
}
/* Everything outside the chosen site is dimmed so the eye lands on the plot. */
.qm-sitemap-wrap .qm-sitemap-scrim { fill: rgba(26, 20, 16, 0.5); }
.qm-sitemap-wrap .qm-sitemap-poly {
    fill: rgba(27, 94, 32, 0.3);
    stroke: #1B5E20; stroke-width: 3;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;   /* constant outline at any zoom */
}
.qm-sitemap-wrap .qm-sitemap-pulse {
    fill: none; stroke: #2F7D33;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    animation: qm-sitemap-pulse 2.1s ease-out infinite;
}
@keyframes qm-sitemap-pulse {
    0%        { stroke-width: 2;  opacity: 0.85; }
    70%, 100% { stroke-width: 16; opacity: 0; }
}
.qm-sitemap-wrap .qm-sitemap-tag {
    position: absolute;
    padding: 4px 11px;
    background: #1B5E20; color: #fff;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px; font-weight: 700; line-height: 1.3;
    white-space: nowrap;
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(26, 20, 16, 0.35);
    /* Counter-scaled in JS so the label stays legible at any zoom. */
    transform-origin: 50% 100%;
    pointer-events: none;
    transition: opacity 0.25s ease;
}
/* Multi-site popups: fixed-screen-size tags pile up at whole-map zoom, so JS
   hides them (qm-tags-far) until the guest zooms in past 2×. */
.qm-sitemap-wrap .qm-sitemap-canvas.qm-tags-far .qm-sitemap-tag { opacity: 0; }
.qm-sitemap-wrap .qm-sitemap-tag::after {
    content: '';
    position: absolute; top: 100%; left: 50%;
    margin-left: -4px;
    border: 4px solid transparent;
    border-top-color: #1B5E20;
}
.qm-sitemap-wrap .qm-sitemap-loading {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    display: flex; align-items: center; justify-content: center; gap: 10px;
    background: #FBF9F3;
    font-size: 13px; color: #8A8178;
}
.qm-sitemap-wrap .qm-sitemap-loading[hidden] { display: none !important; }
.qm-sitemap-wrap .qm-sitemap-spin {
    width: 17px; height: 17px;
    border: 2px solid #E4DAD0; border-top-color: #6B5B3E; border-radius: 50%;
    animation: qm-sitemap-spin 0.7s linear infinite;
}
@keyframes qm-sitemap-spin { to { transform: rotate(360deg); } }
.qm-sitemap-wrap .qm-sitemap-foot {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    padding: 11px 20px;
    border-top: 1px solid rgba(176, 146, 94, 0.18);
    background: #FBF9F3;
}
.qm-sitemap-wrap .qm-sitemap-zoom { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; }
.qm-sitemap-wrap button.qm-sitemap-zbtn {
    all: unset;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: 26px; height: 26px;
    display: flex; align-items: center; justify-content: center;
    background: #fff; border: 1px solid #E4DAD0; border-radius: 7px;
    color: #8A8178; font-size: 15px; font-weight: 700; line-height: 1; text-align: center;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.qm-sitemap-wrap button.qm-sitemap-zbtn:hover:not(:disabled) { background: #F7F4EE; border-color: #D8CCC0; color: #1a1410; }
.qm-sitemap-wrap button.qm-sitemap-zbtn:disabled { opacity: 0.4; cursor: default; }
.qm-sitemap-wrap .qm-sitemap-range {
    flex: 1; min-width: 70px;
    -webkit-appearance: none; appearance: none;
    height: 4px; margin: 0;
    background: #E9E0D6; border-radius: 999px;
    cursor: pointer;
}
.qm-sitemap-wrap .qm-sitemap-range::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 15px; height: 15px; border-radius: 50%;
    background: #1B5E20; border: 2px solid #fff;
    box-shadow: 0 1px 4px rgba(26, 20, 16, 0.3);
    cursor: grab;
}
.qm-sitemap-wrap .qm-sitemap-range::-moz-range-thumb {
    width: 15px; height: 15px; border-radius: 50%;
    background: #1B5E20; border: 2px solid #fff;
    box-shadow: 0 1px 4px rgba(26, 20, 16, 0.3);
    cursor: grab;
}
.qm-sitemap-wrap .qm-sitemap-zval {
    flex: 0 0 auto;
    min-width: 46px; text-align: right;
    font-size: 11.5px; font-weight: 700; color: #8A8178;
    font-variant-numeric: tabular-nums;
}
.qm-sitemap-wrap .qm-sitemap-toggle {
    flex: 0 0 auto;
    display: flex; gap: 4px; padding: 3px;
    background: #F3F1E7;
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: 999px;
}
.qm-sitemap-wrap .qm-sitemap-toggle button {
    all: unset;
    box-sizing: border-box;
    padding: 6px 13px; border-radius: 999px;
    font-size: 11px; font-weight: 600; color: #8A8178;
    cursor: pointer; white-space: nowrap; text-align: center;
    transition: background 0.15s ease, color 0.15s ease;
}
.qm-sitemap-wrap .qm-sitemap-toggle button:hover { color: #1a1410; }
.qm-sitemap-wrap .qm-sitemap-toggle button.is-active {
    background: #fff; color: #1B5E20;
    box-shadow: 0 1px 3px rgba(26, 20, 16, 0.12);
}
@media (max-width: 640px) {
    .qm-sitemap-wrap { padding: 8px; }
    .qm-sitemap-wrap .qm-sitemap-card { width: 100%; max-height: 94vh; }
    .qm-sitemap-wrap .qm-sitemap-head { padding: 14px 14px 11px; }
    .qm-sitemap-wrap .qm-sitemap-title { font-size: 19px; }
    .qm-sitemap-wrap .qm-sitemap-foot { padding: 10px 12px; flex-direction: column; align-items: stretch; gap: 9px; }
    .qm-sitemap-wrap .qm-sitemap-zoom { order: 2; }
    .qm-sitemap-wrap .qm-sitemap-toggle { order: 1; justify-content: center; }
    .qm-sitemap-wrap .qm-sitemap-toggle button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .qm-sitemap-wrap .qm-sitemap-canvas { transition: none; }
    .qm-sitemap-wrap .qm-sitemap-pulse { animation: none; opacity: 0; }
}

/* ── ms230: Filters trigger inside the selection bar (category browsing).
      Sized like its View/Clear-all neighbors so the right dock reads as one
      cluster; funnel + count badge match the toolbar original. ── */
#rvbt-ms-qm-root .qm-group-filters {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    color: var(--mute);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    line-height: 1;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
/* display:inline-flex above would beat the UA's [hidden] rule. */
#rvbt-ms-qm-root .qm-group-filters[hidden] { display: none; }
#rvbt-ms-qm-root .qm-group-filters svg { width: 13px; height: 13px; }
#rvbt-ms-qm-root .qm-group-filters:hover { color: var(--ink); border-color: rgba(176, 146, 94, 0.45); }
#rvbt-ms-qm-root .qm-group-filters.is-open {
    background: rgba(176, 146, 94, 0.12);
    border-color: rgba(176, 146, 94, 0.45);
    color: var(--gold-deep);
}
/* Filters sits RIGHT of Clear all (user spec), so the right-dock auto
   margin belongs to View (its original owner) whenever the View/Clear pair
   is on screen. With nothing selected that pair collapses (display:none) —
   the empty bar hands the dock to Filters instead. */
#rvbt-ms-qm-root .qm-group-bar.is-empty .qm-group-filters { margin-left: auto; }

/* ══════════════════════════════════════════════════════════════════════
   ms237 — "More info" popup (qm-ipop): what the site HAS, and who the rate
   COVERS. Opened from the card foot's More-info pill on both site and
   category cards.

   BODY-APPENDED, like .qm-conpop-wrap — so every colour here is a LITERAL.
   The --paper/--gold-deep/--mute custom properties are declared on
   #rvbt-ms-qm-root and simply do not resolve out on <body>; a var() here
   would silently fall back to nothing. Layout carries !important for the
   same reason the consent popup does: park themes rewrite bare divs.
   ══════════════════════════════════════════════════════════════════════ */
.qm-ipop-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483310 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    /* Identical page-dim to .qm-restr-popup — two dialogs in the same flow
       must not darken the page by different amounts. */
    background: rgba(26, 20, 16, 0.42) !important;
    padding: 18px;
    animation: qm-ipop-in .16s ease both;
}
@keyframes qm-ipop-in { from { opacity: 0; } to { opacity: 1; } }
.qm-ipop-wrap .qm-ipop {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: min(620px, 100%);
    max-height: min(86vh, 860px);
    /* Same canvas as .qm-restr-popup-card (the step-1 booking-rules popup):
       ivory→cream radial + a watermark scene along the bottom edge, so the
       two dialogs read as one family. The scene is REDRAWN at viewBox
       0 0 620 110 — the restriction card is 460px wide and its art is
       preserveAspectRatio='none', so reusing that file here would stretch
       every tree ~35% wider. Palette is the modal's own: #7E8B7A pine,
       #B0925E gold. No mountain silhouettes — those belong to qm-mtns. */
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 620 110' preserveAspectRatio='none'%3E%3Cpath d='M0,110 L0,100 C110,92 245,96 380,100 C470,103 565,102 620,104 L620,110 Z' fill='%237E8B7A' fill-opacity='.12'/%3E%3Cpath d='M16,58 L2,84 L30,84 Z M16,70 L0,100 L32,100 Z M12,100 h8 v6 h-8 Z' fill='%237E8B7A' fill-opacity='.18'/%3E%3Cpath d='M54,34 L36,68 L72,68 Z M54,52 L31,92 L77,92 Z M49,92 h10 v10 h-10 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Cpath d='M105,50 L90,78 L120,78 Z M105,62 L86,96 L124,96 Z M101,96 h8 v8 h-8 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Cpath d='M150,62 L139,84 L161,84 Z M150,72 L136,100 L164,100 Z M147,100 h6 v6 h-6 Z' fill='%237E8B7A' fill-opacity='.16'/%3E%3Ccircle cx='176' cy='34' r='15' fill='%23B0925E' fill-opacity='.15'/%3E%3Cpath d='M214,26 q4,-4 8,0 q4,-4 8,0 M232,16 q3.5,-3.5 7,0 q3.5,-3.5 7,0' stroke='%23B0925E' stroke-opacity='.30' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% 100px,
        radial-gradient(ellipse at 50% 38%, #FBF8F4 0%, #EFEAE5 100%) !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(26, 20, 16, 0.35);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #2A241D;
    /* Body-appended, so anything without its own line-height inherits the
       PARK THEME's <body> value — 1.5 on hello-elementor here, but nothing
       guarantees that on the next park's theme, and this popup's small caps
       labels are exactly what a stray 2.0 would inflate. Pin it; the specific
       rules below still override where they need to. */
    line-height: 1.5;
    text-align: left;
    padding: 24px 26px 20px;
    animation: qm-gate-note-in .25s ease;
}
.qm-ipop-wrap button.qm-ipop-x {
    all: unset;
    position: absolute; top: 15px; right: 17px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 6px;
}
.qm-ipop-wrap button.qm-ipop-x:hover { color: #1a1410; }

/* ── Head: eyebrow · serif name · stay price · spec chips ── */
.qm-ipop-wrap .qm-ipop-head {
    display: block;
    margin: 0 30px 0 0;
    padding: 0 0 14px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.22);
}
.qm-ipop-wrap .qm-ipop-eyebrow {
    display: block;
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #8A6D38;
    margin-bottom: 5px;
}
.qm-ipop-wrap .qm-ipop-title {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 30px;
    font-weight: 600;
    line-height: 1.12;
    color: #1a1410;
}
.qm-ipop-wrap .qm-ipop-price {
    display: block;
    margin-top: 5px;
    font-size: 12.5px;
    line-height: 1.4;
    color: #6B6152;
    font-variant-numeric: lining-nums tabular-nums;
}
.qm-ipop-wrap .qm-ipop-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 11px;
}
.qm-ipop-wrap .qm-ipop-spec {
    display: inline-flex;
    align-items: center;
    /* 5px vertical padding (as asked) on a TIGHT, explicit line box.
       Measured, not guessed: hello-elementor sets body{line-height:1.5} and
       this popup is body-appended, so the chip was inheriting it — 14.3px of
       leading wrapped around a 9.5px label, which is the bulk. Copying the
       Got-it button's 1.8 here would have made it TALLER; a caps-only
       metadata chip wants its line box tight, unlike a CTA pill.
         before: 14.3 + 4×2 + 2 border ≈ 24.3px
         after:  10.5 + 5×2 + 2 border ≈ 22.5px
       Horizontal stays 10px so the row doesn't widen as it slims. No
       descender risk — chip content is uppercase + digits only. */
    line-height: 1.1;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(176, 146, 94, 0.3);
    /* White on the cream canvas — the same paper-on-card layering the
       restriction popup's rule list uses. A cream chip would vanish here. */
    background: #FFFFFF;
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6B6152;
    white-space: nowrap;
}

/* ── Scrolling body ── */
.qm-ipop-wrap .qm-ipop-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    margin-top: 16px;
    scrollbar-width: thin;
    scrollbar-color: rgba(176, 146, 94, 0.4) transparent;
}
.qm-ipop-wrap .qm-ipop-body::-webkit-scrollbar { width: 8px; }
.qm-ipop-wrap .qm-ipop-body::-webkit-scrollbar-track { background: transparent; }
.qm-ipop-wrap .qm-ipop-body::-webkit-scrollbar-thumb { background: rgba(176, 146, 94, 0.4); border-radius: 8px; }
.qm-ipop-wrap .qm-ipop-sec { margin: 0 0 20px; }
.qm-ipop-wrap .qm-ipop-h {
    margin: 0 0 10px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #8A8178;
}

/* ── Amenities: icon + NAME (the card badges are icon-only and capped at 4;
      this is where the guest actually gets to read the list) ── */
/* Paper card on the cream canvas — same layering as
   .qm-restr-popup-rules (white fill, gold hairline, whisper shadow). */
.qm-ipop-wrap ul.qm-ipop-amens {
    list-style: none;
    margin: 0;
    padding: 12px 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
    background: #FFFFFF;
    border: 1px solid rgba(176, 146, 94, 0.25);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(26, 20, 16, 0.04);
}
.qm-ipop-wrap li.qm-ipop-amen {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0;
    font-size: 13px;
    line-height: 1.35;
    color: #3A332C;
}
.qm-ipop-wrap .qm-ipop-amen-ic {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #EFE6D3;
    color: #8A6D38;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.qm-ipop-wrap .qm-ipop-amen-ic svg { width: 14px; height: 14px; display: block; }
.qm-ipop-wrap .qm-ipop-none {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: #6B6152;
}

/* ── "Who this rate covers" — the adults/children/pets blocks. Cream panel
      + gold left rule so the money language reads as a notice, not body copy. ── */
.qm-ipop-wrap .qm-ipop-inc {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    margin-bottom: 8px;
    border-radius: 12px;
    border: 1px solid rgba(176, 146, 94, 0.25);
    /* Gold rule marks it as the money notice; white paper so it reads on
       the cream canvas (a cream gradient here would sink into it). */
    border-left: 3px solid #B0925E;
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(26, 20, 16, 0.04);
}
.qm-ipop-wrap .qm-ipop-inc:last-child { margin-bottom: 0; }
.qm-ipop-wrap .qm-ipop-inc-ic {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    color: #8A6D38;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.qm-ipop-wrap .qm-ipop-inc-ic svg { width: 22px; height: 22px; display: block; }
.qm-ipop-wrap .qm-ipop-inc-tx { min-width: 0; }
.qm-ipop-wrap .qm-ipop-inc-k {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8A6D38;
    margin-bottom: 4px;
}
.qm-ipop-wrap p.qm-ipop-inc-p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: #3A332C;
}
.qm-ipop-wrap p.qm-ipop-desc {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.65;
    color: #4A4238;
}
.qm-ipop-wrap p.qm-ipop-fine {
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.18);
    font-size: 11.5px;
    line-height: 1.5;
    color: #8A8178;
}

/* ── Foot ── */
.qm-ipop-wrap .qm-ipop-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(176, 146, 94, 0.22);
}
/* Slim ink pill — the exact twin of .qm-restr-popup-ok, including the
   5px vertical padding (user-specified) and the 1.8 line-height that keeps
   the pill hugging its text line. Gold on hover. */
.qm-ipop-wrap button.qm-ipop-done {
    all: unset;
    box-sizing: border-box;
    background: #1a1410;
    color: #F6EFDF;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.8;
    padding: 5px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .18s ease;
}
.qm-ipop-wrap button.qm-ipop-done:hover { background: #B0925E; }
.qm-ipop-wrap button.qm-ipop-done:focus-visible {
    outline: 2px solid #B0925E;
    outline-offset: 3px;
}

@media (max-width: 560px) {
    /* Mirrors the restriction popup's own narrow-screen step-down
       (14px gutter, 20/20/16 card, 16px radius, 22px title). The pill stays
       right-docked and slim — stretching it would break the 5px-padding
       silhouette the two dialogs now share. */
    .qm-ipop-wrap { padding: 14px; }
    .qm-ipop-wrap .qm-ipop { padding: 20px 20px 16px; border-radius: 16px; max-height: 90vh; }
    .qm-ipop-wrap .qm-ipop-title { font-size: 22px; }
    .qm-ipop-wrap ul.qm-ipop-amens { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .qm-ipop-wrap, .qm-ipop-wrap .qm-ipop { animation: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   ms247 — SITE TYPES EXPLAINER (qm-stx), opened from a category card's
   headline. Same body-appended chassis as qm-ipop / qm-conpop, so every
   colour is a LITERAL (the --gold-deep etc. custom properties are scoped
   to #rvbt-ms-qm-root and do not resolve on <body>) and layout carries
   !important to survive park themes. Wider than qm-ipop — this one is a
   page, not a note.
   ══════════════════════════════════════════════════════════════════════ */
.qm-stx-wrap {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 2147483320 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(26, 20, 16, 0.42) !important;
    padding: 18px;
    animation: qm-ipop-in .16s ease both;
}
.qm-stx-wrap .qm-stx {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: min(860px, 100%);
    max-height: min(88vh, 900px);
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 860 110' preserveAspectRatio='none'%3E%3Cpath d='M0,110 L0,100 C150,92 340,96 530,100 C650,103 780,102 860,104 L860,110 Z' fill='%237E8B7A' fill-opacity='.12'/%3E%3Cpath d='M22,58 L8,84 L36,84 Z M22,70 L6,100 L38,100 Z M18,100 h8 v6 h-8 Z' fill='%237E8B7A' fill-opacity='.18'/%3E%3Cpath d='M72,34 L54,68 L90,68 Z M72,52 L49,92 L95,92 Z M67,92 h10 v10 h-10 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Cpath d='M140,50 L125,78 L155,78 Z M140,62 L121,96 L159,96 Z M136,96 h8 v8 h-8 Z' fill='%237E8B7A' fill-opacity='.22'/%3E%3Ccircle cx='232' cy='34' r='15' fill='%23B0925E' fill-opacity='.15'/%3E%3Cpath d='M286,26 q4,-4 8,0 q4,-4 8,0 M304,16 q3.5,-3.5 7,0 q3.5,-3.5 7,0' stroke='%23B0925E' stroke-opacity='.30' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% 100px,
        radial-gradient(ellipse at 50% 38%, #FBF8F4 0%, #EFEAE5 100%) !important;
    opacity: 1 !important;
    border: 1px solid rgba(176, 146, 94, 0.3);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(26, 20, 16, 0.35);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    color: #2A241D;
    line-height: 1.5;
    text-align: left;
    padding: 24px 26px 20px;
    animation: qm-gate-note-in .25s ease;
}
.qm-stx-wrap button.qm-stx-x {
    all: unset;
    position: absolute; top: 15px; right: 17px;
    font-size: 13px; line-height: 1; color: #8A8178;
    cursor: pointer; padding: 6px;
}
.qm-stx-wrap button.qm-stx-x:hover { color: #1a1410; }

.qm-stx-wrap .qm-stx-head { margin: 0 30px 0 0; padding: 0 0 14px; border-bottom: 1px solid rgba(176,146,94,.22); }
.qm-stx-wrap .qm-stx-eyebrow {
    display: block; font-size: 9.5px; font-weight: 600; letter-spacing: .18em;
    text-transform: uppercase; color: #8A6D38; margin-bottom: 5px;
}
.qm-stx-wrap .qm-stx-title {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 30px; font-weight: 600; line-height: 1.12; color: #1a1410;
}
.qm-stx-wrap .qm-stx-sub { display: block; margin-top: 5px; font-size: 12.5px; color: #6B6152; }

/* Type rail — one chip per category, pans horizontally on narrow screens. */
.qm-stx-wrap .qm-stx-rail {
    display: flex; gap: 7px; flex-wrap: nowrap;
    overflow-x: auto; scrollbar-width: none;
    margin: 14px 0 0; padding-bottom: 2px;
}
.qm-stx-wrap .qm-stx-rail::-webkit-scrollbar { display: none; }
.qm-stx-wrap button.qm-stx-chip {
    all: unset;
    box-sizing: border-box; flex: 0 0 auto; cursor: pointer;
    line-height: 1.1; padding: 6px 12px; border-radius: 999px;
    border: 1px solid rgba(176,146,94,.3); background: #FFFFFF;
    font-size: 10px; font-weight: 600; letter-spacing: .1em;
    text-transform: uppercase; color: #6B6152; white-space: nowrap;
    transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.qm-stx-wrap button.qm-stx-chip:hover { color: #8A6D38; border-color: rgba(176,146,94,.55); }
.qm-stx-wrap button.qm-stx-chip.is-on { background: #1a1410; border-color: #1a1410; color: #F6EFDF; }

.qm-stx-wrap .qm-stx-body {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; margin-top: 16px;
    scrollbar-width: thin; scrollbar-color: rgba(176,146,94,.4) transparent;
}
.qm-stx-wrap .qm-stx-body::-webkit-scrollbar { width: 8px; }
.qm-stx-wrap .qm-stx-body::-webkit-scrollbar-track { background: transparent; }
.qm-stx-wrap .qm-stx-body::-webkit-scrollbar-thumb { background: rgba(176,146,94,.4); border-radius: 8px; }

/* Hero */
.qm-stx-wrap .qm-stx-hero { display: flex; gap: 14px; align-items: center; }
.qm-stx-wrap .qm-stx-photo {
    flex: 0 0 auto; width: 108px; height: 78px; border-radius: 12px;
    background-size: cover; background-position: center; background-repeat: no-repeat;
    border: 1px solid rgba(176,146,94,.25);
}
.qm-stx-wrap .qm-stx-heroTx { min-width: 0; }
.qm-stx-wrap .qm-stx-nm {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 25px; font-weight: 600; line-height: 1.15; color: #1a1410;
}
.qm-stx-wrap .qm-stx-badge {
    display: inline-block; margin-top: 4px; padding: 3px 9px; border-radius: 999px;
    background: #EFE6D3; color: #8A6D38;
    font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; line-height: 1.3;
}
.qm-stx-wrap .qm-stx-lead { display: block; margin-top: 6px; font-size: 13px; line-height: 1.55; color: #4A4238; }

/* Fact chips — the slim 5px pill the rest of this modal family uses. */
.qm-stx-wrap .qm-stx-facts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.qm-stx-wrap .qm-stx-fact {
    display: inline-flex; align-items: center; line-height: 1.1; padding: 5px 10px;
    border-radius: 999px; border: 1px solid rgba(176,146,94,.3); background: #FFFFFF;
    font-size: 9.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
    color: #6B6152; white-space: nowrap;
}

/* Diagram — white paper card so the drawing reads on the cream canvas. */
.qm-stx-wrap .qm-stx-dia {
    margin-top: 14px; padding: 10px 14px 12px; background: #FFFFFF;
    border: 1px solid rgba(176,146,94,.25); border-radius: 12px;
    box-shadow: 0 2px 8px rgba(26,20,16,.04);
}
.qm-stx-wrap .qm-stx-svg { display: block; width: 100%; height: auto; }
.qm-stx-wrap p.qm-stx-cap {
    margin: 6px 0 0; text-align: center; font-size: 12.5px; line-height: 1.5; color: #6B6152;
}
.qm-stx-wrap p.qm-stx-desc { margin: 14px 0 0; font-size: 13.5px; line-height: 1.65; color: #3A332C; }

.qm-stx-wrap .qm-stx-amens { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.qm-stx-wrap .qm-stx-amen {
    display: inline-flex; align-items: center; gap: 6px; line-height: 1.2;
    padding: 5px 11px; border-radius: 999px; background: #FFFFFF;
    border: 1px solid rgba(176,146,94,.22); font-size: 12px; color: #3A332C;
}
.qm-stx-wrap .qm-stx-amen svg { width: 13px; height: 13px; color: #8A6D38; flex: 0 0 auto; }

/* 360 walk-through */
.qm-stx-wrap a.qm-stx-tour {
    display: inline-flex; align-items: center; gap: 7px; margin-top: 14px;
    padding: 9px 16px; border-radius: 999px; text-decoration: none;
    background: #EFE6D3; border: 1px solid rgba(176,146,94,.45); color: #8A6D38;
    font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    transition: background .18s ease, color .18s ease;
}
.qm-stx-wrap a.qm-stx-tour:hover { background: #8A6D38; color: #FFF9EC; }
.qm-stx-wrap a.qm-stx-tour svg { width: 13px; height: 13px; stroke: currentColor; fill: none; }

/* Size comparison */
.qm-stx-wrap .qm-stx-cmp {
    margin-top: 18px; padding: 12px 14px 6px; background: #FFFFFF;
    border: 1px solid rgba(176,146,94,.25); border-radius: 12px;
    box-shadow: 0 2px 8px rgba(26,20,16,.04);
}
.qm-stx-wrap .qm-stx-h {
    margin: 0 0 10px; font-size: 10px; font-weight: 700; letter-spacing: .16em;
    text-transform: uppercase; color: #8A8178;
}
.qm-stx-wrap .qm-stx-cmpRow { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.qm-stx-wrap .qm-stx-cmpNm {
    flex: 0 0 132px; font-size: 12px; color: #4A4238;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qm-stx-wrap .qm-stx-cmpBar { flex: 1 1 auto; height: 9px; border-radius: 999px; background: #F1ECE2; overflow: hidden; }
.qm-stx-wrap .qm-stx-cmpBar i { display: block; height: 100%; border-radius: 999px; background: #C9C0AE; }
.qm-stx-wrap .qm-stx-cmpFt {
    flex: 0 0 46px; text-align: right; font-size: 11px; font-weight: 600;
    color: #6B6152; font-variant-numeric: lining-nums tabular-nums;
}
.qm-stx-wrap .qm-stx-cmpRow.is-on .qm-stx-cmpNm { color: #1a1410; font-weight: 600; }
.qm-stx-wrap .qm-stx-cmpRow.is-on .qm-stx-cmpBar i { background: linear-gradient(90deg, #B0925E, #8A6D38); }
.qm-stx-wrap .qm-stx-cmpRow.is-on .qm-stx-cmpFt { color: #8A6D38; }

/* Foot — Got it keeps the family's slim 5px ink pill; Choose is its ghost twin. */
.qm-stx-wrap .qm-stx-foot {
    display: flex; justify-content: flex-end; align-items: center; gap: 10px;
    margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(176,146,94,.22);
}
.qm-stx-wrap button.qm-stx-done,
.qm-stx-wrap button.qm-stx-choose {
    all: unset;
    box-sizing: border-box; cursor: pointer; text-align: center;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase;
    line-height: 1.8; padding: 5px 16px; border-radius: 999px;
    transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.qm-stx-wrap button.qm-stx-done { background: #1a1410; color: #F6EFDF; }
.qm-stx-wrap button.qm-stx-done:hover { background: #B0925E; }
.qm-stx-wrap button.qm-stx-choose {
    background: transparent; color: #8A6D38; border: 1px solid rgba(176,146,94,.5);
}
.qm-stx-wrap button.qm-stx-choose:hover { background: #EFE6D3; }
.qm-stx-wrap button.qm-stx-choose[disabled] { opacity: .45; cursor: default; }
.qm-stx-wrap button.qm-stx-done:focus-visible,
.qm-stx-wrap button.qm-stx-choose:focus-visible,
.qm-stx-wrap button.qm-stx-chip:focus-visible { outline: 2px solid #B0925E; outline-offset: 3px; }

@media (max-width: 620px) {
    .qm-stx-wrap { padding: 14px; }
    .qm-stx-wrap .qm-stx { padding: 20px 18px 16px; border-radius: 16px; max-height: 92vh; }
    .qm-stx-wrap .qm-stx-title { font-size: 22px; }
    .qm-stx-wrap .qm-stx-hero { flex-direction: column; align-items: flex-start; }
    .qm-stx-wrap .qm-stx-photo { width: 100%; height: 132px; }
    .qm-stx-wrap .qm-stx-cmpNm { flex-basis: 96px; }
}
@media (prefers-reduced-motion: reduce) {
    .qm-stx-wrap, .qm-stx-wrap .qm-stx { animation: none; }
}

/* Clickable category headline on the card (category browsing only). Inherits
   the h3's serif so it still reads as the title it replaced, not as a control. */
#rvbt-ms-qm-root .qm-catname-btn {
    all: unset;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    color: inherit;
    font: inherit;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: rgba(176, 146, 94, 0.6);
    text-underline-offset: 5px;
    transition: color .18s ease, text-decoration-color .18s ease;
}
#rvbt-ms-qm-root .qm-catname-btn svg {
    width: 15px; height: 15px; flex: 0 0 auto;
    color: var(--gold-deep); opacity: .65;
    transition: opacity .18s ease;
}
#rvbt-ms-qm-root .qm-catname-btn:hover { color: var(--gold-deep); text-decoration-color: var(--gold-deep); }
#rvbt-ms-qm-root .qm-catname-btn:hover svg { opacity: 1; }
#rvbt-ms-qm-root .qm-catname-btn:focus-visible { outline: 2px solid rgba(176,146,94,.55); outline-offset: 3px; border-radius: 4px; }


/* ══════════════════════════════════════════════════════════════════════
   "That site has just been taken" (ms249).

   save-order returns room_unavailable when the site a guest is holding gets
   booked by somebody else while they are still filling in the form. That used
   to surface as a flat red strip carrying the backend's own sentence and no way
   forward: the Confirm button simply failed again, so the guest was stuck on a
   dead screen holding a site that no longer exists.

   Built on the same chassis as .qm-existing-acct (the modal's established
   pattern for "something blocked you, here is the way out") and it reuses that
   card's .qm-ea-btn buttons verbatim, so the two recovery notices are the same
   component in two tones. Width matches .qm-receipt so it sits square under it.
   ══════════════════════════════════════════════════════════════════════ */
#rvbt-ms-qm-root .qm-unavail {
    width: 100%;
    max-width: 600px;
    margin: 0 auto 14px;
    padding: 16px 18px;
    background: linear-gradient(180deg, #FFF8F6 0%, #FDF1EE 100%);
    border: 1px solid rgba(197, 120, 120, 0.42);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    text-align: left;
}
#rvbt-ms-qm-root .qm-unavail-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
#rvbt-ms-qm-root .qm-unavail-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #F4DAD4;
    color: #A4543F;
}
#rvbt-ms-qm-root .qm-unavail-icon svg { width: 15px; height: 15px; display: block; }
#rvbt-ms-qm-root .qm-unavail-title {
    margin: 0;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--ink);
    letter-spacing: -0.005em;
}
#rvbt-ms-qm-root .qm-unavail-msg {
    margin: 0 0 13px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ink-soft);
}
#rvbt-ms-qm-root .qm-unavail-msg strong { font-weight: 600; color: var(--ink); }
/* "Nothing has been charged" — the single most reassuring fact available, so it
   gets its own quiet line rather than being buried mid-paragraph. */
#rvbt-ms-qm-root .qm-unavail-note {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--mute);
}
#rvbt-ms-qm-root .qm-unavail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
/* The buttons ARE .qm-ea-btn — same component as the existing-account notice,
   so the two never drift apart. Only the primary tint differs. */
#rvbt-ms-qm-root .qm-unavail .qm-ea-btn { flex: 0 1 auto; }
@media (max-width: 460px) {
    /* Full-width stacked buttons beat two cramped ones at this width. */
    #rvbt-ms-qm-root .qm-unavail .qm-ea-btn { flex: 1 1 100%; }
}