/* iOS: without this, Safari inflates tiny/hidden text (ex. the font-size:0 wordmark
   trick), which opened a visible gap inside "the First Look" on real iPhones. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* The First Look app redesign preview
   Loaded after the legacy stylesheet so this entire visual pass is reversible. */

:root {
    --app-bg: #FAFAF8;
    --app-surface: #FFFDF9;
    --app-cream: #F8F4EC;
    --app-gold: #9A7344;
    --app-gold-dark: #765331;
    --app-gold-soft: #C4A059;
    --app-ink: #211F1C;
    --app-body: #4A453F;
    --app-muted: #8B8178;
    --app-line: #E9E2D9;
    --app-shadow: 0 18px 44px rgba(92, 70, 45, .12);
    --app-ease: cubic-bezier(.22, 1, .36, 1);
    --app-rail: 100px;
    --app-header: 82px;
    --app-list-width: min(37vw, 570px);
}

body {
    background: var(--app-bg);
    color: var(--app-ink);
}

/* App rail */
.app-rail {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--app-rail);
    z-index: 1400;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    background: var(--app-bg);
    border-right: 1px solid var(--app-line);
}

.app-rail-brand {
    height: var(--app-header);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 14px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 19px;
    font-weight: 600;
    line-height: .92;
    color: var(--app-ink);
    text-decoration: none;
    border-bottom: 0;
    visibility: hidden;
    pointer-events: none;
}

.app-rail-the {
    font-size: 15px;
    font-weight: 400;
    font-style: italic;
    line-height: 1;
}

.app-rail-nav,
.app-rail-secondary {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 18px 10px;
}

.app-rail-secondary {
    margin-top: auto;
    border-top: 0;
}

.app-rail-item {
    min-height: 72px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 4px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #625B53;
    font-family: 'Instrument Sans', sans-serif;
    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background .3s var(--app-ease), color .3s var(--app-ease);
}

.app-rail-item .icn { width: 20px; height: 20px; }
.app-rail-item:hover { background: #F3EDE4; color: var(--app-gold-dark); }
.app-rail-item.active { color: var(--app-gold); }
.app-rail-item.active::after { content: ''; width: 18px; height: 1.5px; background: var(--app-gold-soft); }
.app-rail-heart { font-family: 'Cormorant Garamond', serif; font-size: 27px; line-height: 18px; color: currentColor; }
.app-rail-help { width: 20px; height: 20px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 12px; }
.app-rail-share { color: var(--app-gold); }

/* Header and command bar */
body > header {
    height: var(--app-header);
    margin-left: var(--app-rail);
    padding: 0 26px 0 30px;
    background: rgba(250, 250, 248, .96);
    border-bottom: 0;
    gap: 22px;
}

body > header .logo { display: none; }
.desktop-wordmark {
    width: 176px;
    flex: 0 0 176px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: var(--app-ink);
    text-decoration: none;
    font-family: 'Cormorant Garamond', serif;
    line-height: .86;
}
.desktop-wordmark-the {
    margin-left: 2px;
    font-size: 24px;
    font-weight: 400;
    font-style: italic;
    line-height: .78;
}
.desktop-wordmark-name {
    font-size: 31px;
    font-weight: 500;
    white-space: nowrap;
    letter-spacing: -.025em;
}
.desktop-commandbar { display: flex; align-items: center; gap: 10px; min-width: 0; }
.desktop-commandbar button {
    flex-shrink: 0;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 17px;
    border: 1px solid var(--app-line);
    border-radius: 14px;
    background: var(--app-surface);
    box-shadow: 0 5px 18px rgba(92, 70, 45, .05);
    color: var(--app-ink);
    font-family: 'Instrument Sans', sans-serif;
    font-size: 13px;
    white-space: nowrap;
    cursor: pointer;
    transition: transform .3s var(--app-ease), border-color .3s var(--app-ease), box-shadow .3s var(--app-ease);
}
.desktop-commandbar button:hover { transform: translateY(-1px); border-color: #D7C8B5; box-shadow: 0 8px 20px rgba(92, 70, 45, .09); }
.desktop-commandbar .icn { color: #6E665D; }
.desktop-commandbar small { color: var(--app-muted); font-size: 10px; }
.command-star { color: var(--app-gold-soft); font-size: 14px; }

.header-right { margin-left: auto; gap: 14px; }
.header-signin {
    border: 0;
    background: transparent;
    color: var(--app-ink);
    font: 500 12.5px 'Instrument Sans', sans-serif;
    cursor: pointer;
}
.header-signin:hover { color: var(--app-gold-dark); }
.header-right .beta-badge,
.header-right .btn-submit,
.header-right .btn-shortlist { display: none; }
.header-right .btn-access {
    min-height: 46px;
    height: 46px;
    padding: 0 21px;
    border: 1px solid var(--app-gold);
    border-radius: 3px;
    background: var(--app-gold);
    color: #FFFDF9;
    box-shadow: 0 8px 22px rgba(139, 115, 85, .17);
    font-size: 12.5px;
    letter-spacing: .02em;
}
.header-right .btn-access:hover { background: var(--app-gold-dark); border-color: var(--app-gold-dark); }
.header-right .btn-access.member { background: #FCF6E9; color: #7E641E; border-color: #DCC89E; }

/* Desktop split browse */
.mobile-desktop-banner,
.mobile-toggle { margin-left: var(--app-rail); }
.main {
    margin-left: var(--app-rail);
    background: var(--app-bg);
}

@media (min-width: 769px) {
    .view-switch { display: none !important; }
    .main.view-map #map { display: block !important; flex: 1 1 auto; min-width: 0; }
    .main.view-list #map { display: none !important; }
    .main.view-map .sidebar {
        display: flex !important;
        width: var(--app-list-width) !important;
        padding: 0 !important;
        background: var(--app-bg);
        border-right: 1px solid var(--app-line);
        container: browse-list / inline-size;
    }
    .main.view-list .sidebar {
        display: flex !important;
        width: 100% !important;
        padding: 0 34px !important;
        background: var(--app-bg);
        border-right: 0;
    }
    .main.view-list .sidebar-top,
    .main.view-list .filters-row,
    .main.view-list .results-bar,
    .main.view-list #venueList { width: auto; max-width: none; margin-left: 0; margin-right: 0; }
    .main.view-list #venueList,
    .main.view-map #venueList { display: block; padding: 0 24px 28px; }
    .main.view-list .venue-card,
    .main.view-map .venue-card { margin-bottom: 16px; }
    .main.view-list .vc-photo,
    .main.view-map .vc-photo { height: auto; aspect-ratio: 1.12; }
    .main.view-list #venueList {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
        gap: 14px;
        padding-left: 0;
        padding-right: 0;
    }
    .main.view-list .results-bar,
    .main.view-list .sidebar-top { padding-left: 0; padding-right: 0; }
    .main.view-list .results-bar { min-height: 68px; padding-top: 14px; padding-bottom: 12px; }
    .main.view-list #venueList { padding-top: 12px; }
}

/* The full width research grid can carry two or three photo cards. Its text-only cards
   get a true three-row layout so wrapped names and guide signals determine the height. */
@media (min-width: 769px) {
    .main.view-list .venue-list.photos-off .venue-card,
    .main.view-list .venue-list.photos-off .venue-card.transparent {
        grid-template-rows: minmax(138px, auto);
        min-height: 138px;
    }
    .main.view-list .venue-list.photos-off .venue-card .vc-body,
    .main.view-list .venue-list.photos-off .venue-card.transparent .vc-body {
        min-height: 138px;
        padding: 19px 20px 18px;
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "name"
            "meta"
            "signals";
        align-content: center;
        row-gap: 7px;
    }
    .main.view-list .venue-list.photos-off .venue-card .card-signals {
        justify-content: flex-start;
        display: flex;
        min-height: 20px;
    }
    .main.view-list .venue-list.photos-off .venue-card.transparent .venue-card-meta {
        margin-top: 0;
    }
}

.sidebar-top { padding: 14px 24px 7px; }
.search-box {
    min-height: 46px;
    padding-left: 43px;
    border: 1px solid var(--app-line);
    border-radius: 14px;
    background: var(--app-surface);
    box-shadow: 0 5px 18px rgba(92, 70, 45, .045);
    font-size: 13px;
}
.search-field::before {
    content: '';
    position: absolute;
    left: 16px;
    top: 50%;
    width: 14px;
    height: 14px;
    border: 1.6px solid #786F65;
    border-radius: 50%;
    transform: translateY(-58%);
    pointer-events: none;
}
.search-field::after {
    content: '';
    position: absolute;
    left: 28px;
    top: 58%;
    width: 6px;
    height: 1.5px;
    background: #786F65;
    transform: rotate(45deg);
    pointer-events: none;
}
.filters-row {
    order: 0;
    margin: 0 24px 16px;
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}
.filters-row::-webkit-scrollbar { display: none; }
.filters-toggle { margin: 0 0 0 10px; min-height: 30px; padding: 0 12px; border-color: var(--app-line); box-shadow: none; }
@media (min-width: 769px) {
    .filters-row { display: flex; }
    .results-bar .filters-toggle { display: none; }
    .filters-row:has(#filterChips:empty) { display: none; }
}
#filterChips { flex-wrap: nowrap; }
#filterChips .fchip {
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid #E8E0D6;
    border-radius: 30px;
    background: #F4EFE8;
    color: #5D574F;
    box-shadow: none;
    font-size: 11px;
    font-weight: 500;
}
#filterChips .fchip:hover { border-color: #D6C6B3; background: #EEE6DB; }
#filterChips .fchip span { color: #9A7D58; font-size: 13px; }

/* One behavior-faithful filter modal, presented as an editorial two-column sheet. */
.fmodal .fm-body > .fm-sec { border-bottom: 0 !important; }
.fmodal .fm-prev-tag {
    display: inline-flex;
    align-items: center;
    margin-left: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    vertical-align: -1px;
}
.fmodal .fm-prev-tag .icn { width: 13px; height: 13px; color: #B69A74; }
@media (min-width: 769px) {
    .fmodal {
        width: min(700px, calc(100vw - 64px));
        max-width: 700px;
        max-height: min(820px, calc(100vh - 64px));
        border: 1px solid var(--app-line);
        border-radius: 16px;
        background: #FFFDF9;
        box-shadow: 0 30px 80px rgba(54, 42, 30, .22);
    }
    .fm-head { min-height: 92px; padding: 24px 28px 18px; box-sizing: border-box; border-bottom-color: var(--app-line); }
    .fm-title { font-family: 'Cormorant Garamond', serif; font-size: 28px; font-weight: 500; }
    .fm-x { left: 24px; color: var(--app-muted); }
    .fm-body {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 30px;
        padding: 6px 34px 16px;
    }
    .fm-sec { min-width: 0; padding: 20px 0 18px; border-bottom: 0; }
    #fmChipSec,
    #fmFactsSec { grid-column: 1 / -1; }
    #fmFactsSec { margin-top: 5px; padding-top: 24px; border-top: 0; }
    .fm-sec-title { font-family: 'Cormorant Garamond', serif; font-size: 21px; font-weight: 500; }
    #fmFactsBody .fm-seg {
        width: 330px;
        max-width: calc(100% - 86px);
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    #fmFactsBody .fm-seg button { width: 100%; padding-left: 7px; padding-right: 7px; }
    .filter-label {
        margin-bottom: 9px;
        color: #9A7D58;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: .13em;
        text-transform: uppercase;
    }
    .fmodal .filter-select,
    .fmodal .gc-input {
        min-height: 42px;
        padding: 8px 24px 8px 0;
        border: 0;
        border-bottom: 1px solid #CFC1AF;
        border-radius: 0;
        background-color: transparent;
        box-shadow: none;
        color: var(--app-ink);
        font-size: 13px;
    }
    .fmodal .filter-select:focus,
    .fmodal .gc-input:focus { border-bottom-color: var(--app-gold); }
    .fm-foot { min-height: 72px; padding: 13px 34px; border-top-color: var(--app-line); }
    .fm-show { min-height: 44px; border-radius: 3px; padding: 0 23px; }
    .fm-clear { color: var(--app-gold-dark); text-underline-offset: 4px; }
}

.results-bar {
    min-height: 64px;
    align-items: flex-end;
    padding: 12px 24px 11px;
    border-top: 0;
    border-bottom: 0;
}
.main.view-map .results-bar {
    min-height: 84px;
    padding-top: 10px;
    padding-bottom: 10px;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
}
.main.view-map .results-left,
.main.view-map .results-right { width: 100%; }
.main.view-map .results-left { justify-content: space-between; }
.main.view-map .results-right { justify-content: flex-end; }
.main.view-map .results-showall { margin-left: auto; }
.results-count {
    font-family: 'Cormorant Garamond', serif;
    font-size: 24px;
    font-weight: 500;
    color: var(--app-ink);
}
.results-count strong { font-weight: 500; }
.sort-select { border-color: transparent; background-color: transparent; box-shadow: none; color: var(--app-body); }
.card-density { opacity: .72; }
.photos-toggle.density-locked,
.photos-toggle:disabled {
    opacity: .46;
    cursor: not-allowed;
    box-shadow: none;
}

/* Site action language: compact, squared, tracked, and warm. Rounded geometry remains for
   filters, chips, segmented toggles, and icon only controls where the shape communicates state. */
.results-showall,
.results-export,
.results-compare,
.btn-primary,
.btn-ghost,
.fm-show,
.sl-close,
.sl-compare,
.sl-export,
.gate-tier-btn {
    border-radius: 3px !important;
    font-family: 'Instrument Sans', sans-serif;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
}
.results-showall,
.results-compare,
.btn-ghost,
.sl-close {
    border-color: #D9CBB6;
    background: rgba(255,253,249,.96);
    color: var(--app-ink);
}
.results-showall { padding: 6px 12px; }
.results-clear,
.fm-clear { text-decoration: none !important; letter-spacing: .08em; text-transform: uppercase; }

/* Venue cards */
.venue-card {
    display: grid;
    grid-template-columns: minmax(150px, 42%) 1fr;
    grid-template-rows: minmax(188px, 1fr) auto;
    min-height: 226px;
    overflow: hidden;
    border: 1px solid var(--app-line);
    border-radius: 13px;
    background: var(--app-surface);
    box-shadow: 0 8px 22px rgba(92, 70, 45, .055);
    transition: transform .35s var(--app-ease), border-color .35s var(--app-ease), box-shadow .35s var(--app-ease);
}
.venue-card:hover { transform: translateY(-2px); border-color: #D8C9B7; box-shadow: 0 14px 28px rgba(92, 70, 45, .10); }
.venue-card .vc-photo { grid-column: 1; grid-row: 1; width: 100%; height: 100% !important; min-height: 188px; border-radius: 0; }
.venue-card .vc-body { grid-column: 2; grid-row: 1; min-width: 0; padding: 29px 22px 20px; display: flex; flex-direction: column; }
.venue-card .venue-name { font-family: 'Cormorant Garamond', serif; font-size: 29px; font-weight: 500; line-height: 1.04; letter-spacing: -.025em; }
.venue-card .masked-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 29px;
    font-weight: 500;
    line-height: 1.04;
    letter-spacing: -.025em;
    color: var(--app-ink);
}
.venue-card .venue-card-meta { margin-top: 8px; font-size: 12.5px; color: var(--app-body); }
.venue-card .card-signals { margin-top: auto; padding-top: 22px; display: flex; flex-wrap: wrap; gap: 8px 12px; }
.venue-card .signal-chip { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; color: #5D574F; font-size: 11px; font-weight: 500; white-space: nowrap; }
.venue-card .signal-chip .icn { width: 14px; height: 14px; color: #393632; }
.venue-card .signal-chip + .signal-chip::before { content: none; }
.venue-card .vc-type-badge { background: rgba(255,253,249,.9); color: #705D45; backdrop-filter: blur(8px); }
.venue-card .tp-star { color: var(--app-gold-soft); font-size: 15px; margin-left: 8px; vertical-align: .08em; }
.venue-card .masked-locked { margin-top: auto; font-size: 11px; }
.venue-card .vc-facts {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 16px;
    border-top: 1px solid #F0EBE4;
    background: #FCFAF7;
    color: #615A52;
    font-size: 10.5px;
    white-space: nowrap;
    overflow: hidden;
}
.venue-card .vc-facts span { overflow: hidden; text-overflow: ellipsis; }
.venue-card .vc-facts b { color: #B8AD9F; font-weight: 400; }

/* Photos off is a dense research view, not the same card with an empty image column. */
.venue-list.photos-off .venue-card,
.venue-list.photos-off .venue-card.transparent {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(76px, auto);
    height: auto;
    min-height: 78px;
    margin-bottom: 8px;
    border-radius: 9px;
    content-visibility: visible;
    contain-intrinsic-size: auto 80px;
}
.venue-list.photos-off .venue-card .vc-body,
.venue-list.photos-off .venue-card.transparent .vc-body {
    grid-column: 1;
    grid-row: 1;
    min-height: 76px;
    padding: 13px 16px 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "name name"
        "meta signals";
    row-gap: 4px;
    column-gap: 18px;
    align-items: center;
    text-align: left;
}
.venue-list.photos-off .venue-card .venue-card-top { grid-area: name; min-width: 0; }
.venue-list.photos-off .venue-card .venue-card-meta { grid-area: meta; margin-top: 3px; min-width: 0; }
.venue-list.photos-off .venue-card .card-signals {
    grid-area: signals;
    align-self: center;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    max-width: none;
}
.venue-list.photos-off .venue-card .masked-locked {
    grid-area: signals;
    align-self: center;
    margin: 0;
    padding: 0;
}
.venue-list.photos-off .venue-card .venue-name { font-size: 20px; line-height: 1.08; }
.venue-list.photos-off .venue-card .masked-name { font-size: 20px; line-height: 1.08; }
.venue-list.photos-off .venue-card .vc-type { font-size: 9.5px; }
.venue-list.photos-off .venue-card.transparent .venue-card-meta { margin-top: 4px; }
.venue-list.photos-off .venue-card .vc-facts { display: none; }
.venue-list #rlSentinel { grid-column: 1 / -1; }

/* Half-width split cards need three calm text rows; forcing the one-row layout clips metadata. */
.main.cards-2up .venue-list.photos-off .venue-card:not(.transparent) {
    grid-template-rows: minmax(140px, auto);
    min-height: 140px;
}
.main.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .vc-body {
    min-height: 140px;
    padding-top: 16px;
    padding-bottom: 20px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "name"
        "meta"
        "signals";
    align-items: center;
    row-gap: 6px;
}
.main.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .card-signals {
    justify-content: flex-start;
    margin-top: 0;
    display: grid;
    grid-template-columns: minmax(0, max-content);
    gap: 7px;
}

.venue-list.tplock .venue-card.transparent {
    background: #FCF6E9;
    border-color: #E7D3AC;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent {
    grid-template-columns: minmax(150px, 42%) minmax(0, 1fr);
    grid-template-rows: minmax(188px, 1fr);
    min-height: 226px;
    align-self: stretch;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-photo {
    display: flex;
    grid-column: 1;
    grid-row: 1;
    min-height: 188px;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-body {
    grid-column: 2;
    grid-row: 1;
    min-height: 188px;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
    padding: 29px 22px 20px;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked {
    isolation: isolate;
    background: #E9DFD2;
    color: #9B7441;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked .vc-img {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.5) sepia(.12) brightness(.78);
    display: block !important;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(72,52,34,.24);
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked::after {
    content: none;
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked .icn {
    z-index: 2;
    width: 18px;
    height: 18px;
    box-sizing: content-box;
    padding: 13px;
    border: 1px solid rgba(155,116,65,.34);
    border-radius: 50%;
    background: rgba(255,253,249,.9);
    box-shadow: 0 10px 26px rgba(107,78,45,.12);
}
.venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-stock-note {
    position: absolute;
    left: 13px;
    bottom: 12px;
    z-index: 2;
    color: rgba(255,255,255,.94);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-shadow: 0 1px 8px rgba(32,21,12,.45);
}
.venue-list.tplock .venue-card.transparent .venue-card-meta { margin-top: 8px; }
.venue-list.tplock.photos-off .venue-card.transparent,
.venue-list.tplock.photos-off .venue-card.transparent .vc-body {
    min-height: 76px;
}
.venue-list.tplock.photos-off .venue-card.transparent { grid-template-rows: minmax(76px, auto); }
.venue-list.tplock.photos-off .venue-card.transparent .vc-body {
    grid-row: 1;
    padding: 13px 16px 12px;
    align-items: center;
    justify-content: initial;
    text-align: left;
}

/* Two column text cards need enough height for wrapped names, metadata, and both signals. */
.main.cards-2up .venue-list.tplock.photos-off .venue-card.transparent {
    grid-template-rows: minmax(140px, auto);
    min-height: 140px;
}
.main.cards-2up .venue-list.tplock.photos-off .venue-card.transparent .vc-body {
    min-height: 140px;
    padding-top: 16px;
    padding-bottom: 20px;
    align-content: center;
    row-gap: 8px;
}
.main.cards-2up .venue-list.photos-off .venue-card .venue-name,
.main.cards-2up .venue-list.photos-off .venue-card .masked-name {
    font-size: 18px;
}

/* The draggable split controls usable density. Below 500px the saved two column choice
   temporarily becomes one compact column, then returns when the pane is wide enough. */
.main.view-map.cards-2up.list-pane-compact #venueList {
    grid-template-columns: minmax(0, 1fr);
}
.main.view-map.cards-2up.list-pane-compact .venue-list.photos-off .venue-card,
.main.view-map.cards-2up.list-pane-compact .venue-list.tplock.photos-off .venue-card.transparent {
    grid-template-rows: minmax(82px, auto);
    min-height: 82px;
}
.main.view-map.cards-2up.list-pane-compact .venue-list.photos-off .venue-card .vc-body,
.main.view-map.cards-2up.list-pane-compact .venue-list.tplock.photos-off .venue-card.transparent .vc-body {
    min-height: 82px;
    padding: 13px 15px 15px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "name name"
        "meta signals";
    align-items: center;
    row-gap: 5px;
    column-gap: 12px;
}
.main.view-map.cards-2up.list-pane-compact .venue-list.photos-off .venue-card .card-signals {
    display: flex;
    justify-content: flex-end;
    gap: 5px 10px;
}

/* Free cards stay browseable and clean. Only transparent identity masking remains. */
.venue-list.gated .venue-card:not(.viewed):not(.transparent) .vc-photo::before,
.venue-list.gated .venue-card:not(.viewed):not(.transparent) .vc-photo::after { display: none; }
.venue-list.gated .venue-card:not(.viewed):not(.transparent) { opacity: 1; }

/* Map and docked detail */
#map { background: #ECE8E0; }
.leaflet-tile-pane { filter: saturate(.62) sepia(.08) brightness(1.04); }
.leaflet-control-zoom { border: 1px solid var(--app-line) !important; border-radius: 12px !important; overflow: hidden; box-shadow: var(--app-shadow) !important; }
.leaflet-control-zoom a { color: var(--app-ink) !important; background: rgba(255,253,249,.95) !important; }

/* Active filter chips belong over the map canvas, never over the list search controls. */
@media (min-width: 769px) {
    .main.view-map .map-filter-chips:not(:empty) { display: none !important; }
    .main.view-map .legend { left: calc(var(--app-list-width) + 24px); }
}
.area-cluster-wrap { background: transparent; border: 0; }
.area-cluster {
    width: 82px;
    min-height: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(226, 216, 203, .95);
    border-radius: 14px;
    background: rgba(255, 253, 249, .96);
    box-shadow: 0 12px 28px rgba(71, 53, 35, .15);
    color: var(--app-ink);
    font-family: 'Instrument Sans', sans-serif;
}
.area-cluster strong { font-size: 16px; line-height: 1; font-weight: 600; }
.area-cluster span { margin-top: 5px; color: #7D746A; font-size: 9.5px; font-weight: 500; }
.area-cluster.count-only { width: 44px; min-height: 44px; border-radius: 50%; }
.area-cluster.count-only strong { font-size: 13px; }
.area-cluster.count-only span { display: none; }

.desktop-map-toolbar {
    position: absolute;
    left: auto;
    right: 20px;
    bottom: 18px;
    width: auto;
    height: auto;
    z-index: 770;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0;
    border: 0;
    background: transparent;
    pointer-events: none;
}
.main.view-list .desktop-map-toolbar { left: auto; }
.list-resize-handle {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--app-list-width);
    z-index: 775;
    width: 14px;
    display: none;
    align-items: center;
    justify-content: center;
    transform: translateX(-7px);
    cursor: col-resize;
    touch-action: none;
}
.main.view-map .list-resize-handle { display: flex; }
.list-resize-handle::before {
    content: '';
    width: 1px;
    height: 100%;
    background: transparent;
    transition: width .18s ease, background .18s ease;
}
.list-resize-handle span {
    position: absolute;
    width: 5px;
    height: 46px;
    border-radius: 5px;
    background: #CDBEA9;
    box-shadow: 0 4px 14px rgba(92, 70, 45, .16);
    opacity: 0;
    transform: scaleY(.72);
    transition: opacity .18s ease, transform .18s ease;
}
.list-resize-handle:hover::before,
.list-resize-handle:focus-visible::before,
.list-resizing .list-resize-handle::before { width: 2px; background: #CDBEA9; }
.list-resize-handle:hover span,
.list-resize-handle:focus-visible span,
.list-resizing .list-resize-handle span { opacity: 1; transform: scaleY(1); }
.list-resize-handle:focus-visible { outline: none; }
.list-resizing { cursor: col-resize; user-select: none; }
.desktop-map-toggle {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    border: 1px solid rgba(219, 208, 194, .96);
    border-radius: 3px;
    background: rgba(255, 253, 249, .96);
    box-shadow: 0 12px 30px rgba(66, 49, 33, .16);
    color: var(--app-ink);
    font: 600 10.5px 'Instrument Sans', sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    pointer-events: auto;
    transition: color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.desktop-map-toggle:hover { color: var(--app-gold-dark); border-color: #CDBA9E; box-shadow: 0 16px 34px rgba(66, 49, 33, .19); transform: translateY(-1px); }
.desktop-map-toggle .icn { width: 16px; height: 16px; }

/* The map area action uses the same editorial control language, not the old pill CTA. */
.main.view-map .map-viewport-chip.on {
    gap: 11px;
    padding: 5px 5px 5px 14px;
    border-color: rgba(219, 208, 194, .96);
    border-radius: 4px;
    background: rgba(255, 253, 249, .96);
    box-shadow: 0 12px 30px rgba(66, 49, 33, .15);
    color: var(--app-body);
    font: 500 11.5px 'Instrument Sans', sans-serif;
}
.map-viewport-chip button {
    min-height: 34px;
    padding: 0 12px;
    border-radius: 3px;
    font: 600 9.5px 'Instrument Sans', sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
}

@media (min-width: 769px) {
    .detail-panel {
        position: absolute;
        top: auto;
        right: 24px;
        bottom: 60px;
        width: min(390px, calc(57vw - 48px));
        /* Keep a true 24px top inset. The old 48px subtraction plus a 60px bottom
           offset made the panel 12px taller than its container at short heights,
           so .main clipped the rounded top edge. */
        height: min(620px, calc(100% - 84px));
        border: 1px solid var(--app-line);
        border-radius: 15px;
        box-shadow: 0 24px 55px rgba(69, 51, 34, .2);
        transform: translateY(calc(100% + 50px));
        overflow: hidden;
        z-index: 780;
    }
    .detail-panel.open { transform: translateY(0); }
    .detail-panel.wide { width: min(720px, calc(57vw - 48px)); }
    .detail-header { min-height: 98px; padding: 28px 28px 20px; border-bottom: 0; background: rgba(255,253,249,.98); overflow: visible; }
    .detail-name { padding-top: 2px; font-size: 31px; font-weight: 500; line-height: 1.08; letter-spacing: -.025em; overflow: visible; }
    .detail-type-line { margin-top: 8px; font-size: 10px; letter-spacing: .11em; }
    .detail-body { padding: 4px 28px 30px; background: rgba(255,253,249,.98); }
    .detail-footer { padding: 12px 20px 18px; background: rgba(255,253,249,.98); }
    .detail-footer .btn-primary { border-radius: 3px; }
}

/* Detail drawer: one composed editorial story, not a stack of legacy dashboard boxes. */
.detail-body .unlock-teaser {
    margin-bottom: 28px !important;
    padding: 24px 24px 23px !important;
    border-radius: 11px !important;
    box-shadow: 0 12px 30px rgba(126, 96, 54, .07);
}
.detail-body .section-title {
    margin-bottom: 12px;
    color: #8A7254;
    font-size: 9.5px;
    letter-spacing: .13em;
}
.detail-body .sec-facts .stat-grid { gap: 12px; }
.detail-body .sec-facts .stat-box {
    min-width: 0;
    padding: 15px 13px 14px 0;
    border-radius: 0;
    background: transparent;
}
.detail-body .sec-facts .stat-box:nth-child(even) { padding-left: 0; border-left: 0; }
.detail-body .sec-facts .stat-val,
.detail-body .sec-facts .stat-box > div:first-child { font-family: 'Cormorant Garamond', serif; font-size: 18px !important; color: var(--app-ink) !important; }
.detail-body .sec-facts .stat-lbl { margin-top: 3px; font-size: 10.5px; }
.detail-body .venue-site-link {
    justify-content: flex-start;
    margin-top: 15px;
    padding: 8px 0 5px;
    border: 0;
    border-radius: 0;
    background: transparent;
    text-decoration: none;
}
.detail-body .venue-site-link:hover { border: 0; background: transparent; }

/* Detail content uses one open editorial language. Legacy dashboard boxes stay out. */
.detail-body .section { margin-bottom: 30px; }
.detail-body .section-title {
    margin-bottom: 14px;
    font-size: 11.5px;
    letter-spacing: .14em;
}
.detail-body .sec-money { border-radius: 0 !important; }
.detail-body .pdf-guide-card {
    margin: 2px 0 30px;
    padding: 20px !important;
    border: 0;
    border-radius: 10px;
    background: #F8F2E9;
    box-shadow: none;
}
.detail-body .pdf-guide-card > div { align-items: flex-start !important; }
.detail-body .pdf-guide-icon { padding-top: 3px; color: var(--app-gold); }
.detail-body .pdf-guide-title {
    margin: 0 0 12px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 22px;
    font-weight: 500;
}
.detail-body .btn-pdf {
    padding: 10px 15px;
    border: 1px solid #D8C7B0;
    border-radius: 2px;
    background: transparent;
    color: var(--app-gold-dark);
    font-size: 12px;
    letter-spacing: .06em;
}
.detail-body .btn-pdf:hover { border-color: var(--app-gold); background: #F8F2E9; color: var(--app-ink); }
.detail-body .sec-money > .stat-grid {
    gap: 12px;
    border: 0;
}
.detail-body .sec-money > .stat-grid .stat-cell {
    min-width: 0;
    padding: 16px 16px 15px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}
.detail-body .sec-money > .stat-grid .stat-cell:nth-child(even) {
    padding-left: 0;
    border-left: 0;
}
.detail-body .sec-money > .stat-grid .stat-num {
    font-size: 25px;
    font-weight: 500;
}
.detail-body .sec-money > .stat-grid .stat-lbl { margin-top: 5px; font-size: 12px; }
.detail-body .quote-list { gap: 0; border-top: 0; }
.detail-body .quote-row {
    padding: 12px 0 18px;
    border: 0;
    border-radius: 0;
    background: transparent;
}
.detail-body .quote-price {
    margin-bottom: 4px;
    font-family: 'Cormorant Garamond', serif;
    color: var(--app-ink);
    font-size: 25px;
    font-weight: 600;
}
.detail-body .quote-meta { font-size: 12.5px; }
.detail-body .info-box {
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--app-body);
    font-size: 15px;
    line-height: 1.65;
}
.detail-flag-row {
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid var(--app-line);
}
.detail-flag-link {
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: #AAA095;
    font: 500 11px 'Instrument Sans', sans-serif;
    text-decoration: none;
    cursor: pointer;
}
.detail-flag-link:hover { color: var(--app-body); }

/* Locked analytics is an editorial preview, not a card inside another card. */
.detail-body .analytics-locked-card .analytics-head {
    padding: 23px 0 13px;
    border: 0;
    border-top: 1px solid var(--app-line);
    border-radius: 0;
    background: transparent;
}
.detail-body .analytics-locked-card .analytics-head:hover { background: transparent; }
.detail-body .analytics-h-left { gap: 11px; }
.detail-body .analytics-ic { width: 16px; height: 16px; color: #9A7D58; }
.detail-body .analytics-h-main {
    font-size: 25px;
    font-weight: 500;
    letter-spacing: -.02em;
}
.detail-body .analytics-locked-body {
    min-height: 190px;
    padding: 16px 0 21px;
    border: 0;
    border-bottom: 1px solid var(--app-line);
    border-radius: 0;
    background: transparent;
}
.detail-body .analytics-locked-body .stat-cell {
    border: 0;
    border-radius: 0;
    background: transparent;
}
.detail-body .analytics-lock-over {
    gap: 7px;
    background: rgba(255,253,249,.67);
}
.detail-body .analytics-lock-over .lock-circle {
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.detail-body .analytics-lock-over .lock-circle .icn { width: 16px; height: 16px; color: #9A7D58; }
.detail-body .analytics-lock-over .lock-line {
    font: 500 20px/1.15 'Cormorant Garamond', serif;
    letter-spacing: -.015em;
    color: var(--app-ink);
}
.detail-body .analytics-lock-over .unlock-btn {
    padding: 3px 0 2px;
    border-radius: 0;
    border-bottom: 0;
    background: transparent;
    color: #8A6B43;
    font-size: 11.5px;
    font-weight: 600;
}
.detail-body .analytics-locked-card:hover .unlock-btn { background: transparent; color: #6E5131; }

.detail-body .sec-money { border-radius: 0 !important; }
.detail-body .sec-money[onclick] { background: #FCF6E9 !important; border-color: #E7D3AC !important; }
.detail-panel.locked-preview #dBody > .sec-money:not(:first-child) { display: none; }
.unlock-guide-tease {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 11px;
    align-items: start;
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid #E7D8C1;
}
.unlock-guide-tease .icn { width: 18px; height: 18px; margin-top: 1px; color: var(--app-gold); }
.unlock-guide-tease strong,
.unlock-guide-tease span { display: block; }
.unlock-guide-tease strong { font: 600 12px 'Instrument Sans', sans-serif; color: var(--app-ink); }
.unlock-guide-tease span { margin-top: 3px; font-size: 12px; line-height: 1.45; color: var(--app-muted); }

/* Paywall */
.gate-overlay { background: rgba(42, 35, 28, .22); backdrop-filter: blur(3px); }
.gate-modal {
    width: min(620px, calc(100vw - 40px));
    max-width: 620px;
    padding: 42px 34px 30px;
    border: 1px solid var(--app-line);
    border-radius: 15px;
    background: #FFFDF9;
    box-shadow: 0 30px 80px rgba(54, 42, 30, .25);
}
.gate-title { font-family: 'Cormorant Garamond', serif; font-size: 35px; font-weight: 500; letter-spacing: -.02em; }
.gate-body { max-width: 48ch; margin: 8px auto 23px; color: var(--app-body); font-size: 13px; }
.gate-counter { border-radius: 4px; background: #F5EEE3; color: #7A6347; }
.gate-tier { padding: 17px 20px; border-color: var(--app-line); border-radius: 11px; box-shadow: none; }
.gate-tier:hover { transform: translateY(-1px); border-color: #CEB998; box-shadow: 0 10px 24px rgba(92, 70, 45, .08); }
.gate-tier-name { font-size: 23px; font-weight: 500; }
.gate-tier.highlight { background: #FCF6E9; border-color: var(--app-gold-soft); box-shadow: 0 16px 36px rgba(167, 126, 69, .13); }
.gate-tier-badge { left: auto; right: 16px; top: 15px; border-radius: 3px; }
.gate-tier-btn { border-radius: 3px; width: 100%; justify-content: center; }
#gateTwoWkTier .gate-tier-btn { display: none; }
#gateSixMoTier .tag-gold { display: none; }
.gate-proof {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
    margin-top: 24px;
    padding-top: 21px;
    border-top: 1px solid var(--app-line);
}
.gate-proof-eyebrow { grid-column: 1 / -1; margin-bottom: 15px; text-align: left; }
.gate-proof-q {
    margin: 0;
    padding-right: 17px;
    border-right: 1px solid #EEE7DE;
    text-align: left;
    font-size: 15px;
    line-height: 1.48;
}
.gate-proof-q:last-child { padding-right: 0; padding-left: 2px; border-right: 0; }
.gate-proof-q .who { margin-top: 9px; }
#gateProofPlanner { grid-template-columns: minmax(0, 1fr); }
#gateProofPlanner .gate-proof-eyebrow { grid-column: 1; }
#gateProofPlanner .gate-proof-q { padding-right: 0; border-right: 0; }
.gate-contrib { display: block; }
.gate-foot { text-align: center; margin: 15px 0 8px; }
.gate-foot + .gate-foot { margin-top: 4px; }
.gate-paidlink { margin-top: 14px; color: var(--app-gold); text-decoration: none; font-weight: 600; }
.gate-dismiss,
.gate-skip-link,
.fm-unlock,
.vc-tpcard .tp-cta,
.pw-how a,
.gate-contrib a,
.gate-contrib a:hover { text-decoration: none; }

/* Share a quote keeps the live multi-step flow, with a quieter editorial surface. */
#overlay { background: rgba(42, 35, 28, .25); backdrop-filter: blur(4px); }
#overlay .modal {
    width: min(620px, calc(100vw - 40px));
    max-height: min(860px, calc(100dvh - 48px));
    border: 1px solid var(--app-line);
    border-radius: 16px;
    background: #FFFDF9;
    box-shadow: 0 30px 80px rgba(54, 42, 30, .24);
}
#overlay .modal-head {
    padding: 36px 38px 25px;
    border-bottom: 0;
    background: rgba(255,253,249,.98);
}
#overlay .modal-title {
    margin-bottom: 7px;
    font-size: 35px;
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: -.025em;
}
#overlay .modal-sub { max-width: 46ch; color: var(--app-body); font-size: 13px; }
#overlay .modal-close-btn { margin-top: -8px; color: var(--app-muted); }
#overlay .modal-back-btn { margin-bottom: 11px; text-decoration: none; }
#overlay .modal-body { padding: 14px 38px 34px; }
#overlay .path-picker { gap: 8px; padding: 0; border-top: 0; }
#overlay .path-card {
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 16px;
    padding: 18px 16px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    box-shadow: none;
}
#overlay .path-card:hover { background: #F8F2E9; }
#overlay .path-icon {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: #FBF3E6;
}
#overlay .path-title { font-size: 21px; font-weight: 500; }
#overlay .path-desc { max-width: 47ch; color: var(--app-body); font-size: 12px; }
#overlay .picker-note { margin-top: 18px; padding: 0; color: var(--app-muted); }
#overlay a,
#overlay button { text-decoration: none !important; }
#overlay .form-group { margin-bottom: 22px; }
#overlay .form-label { margin-bottom: 8px; color: #9A7D58; font-size: 10px; letter-spacing: .13em; }
#overlay .form-input,
#overlay .form-select,
#overlay .form-textarea {
    padding: 10px 2px 12px;
    border: 0;
    border-bottom: 1px solid #CFC1AF;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: 14px;
}
#overlay .form-input:focus,
#overlay .form-select:focus,
#overlay .form-textarea:focus { border-bottom-color: var(--app-gold); }
#overlay .form-textarea { padding: 13px 14px; border: 1px solid #DDD1C2; border-radius: 3px; background: #FCFAF6; }
#overlay .form-row { gap: 26px; }
#overlay .upload-zone { padding: 30px 22px; border: 1px solid #D8C9B7; border-radius: 3px; background: #FCFAF6; }
#overlay .privacy-strip { padding: 15px 0 0; border: 0; border-radius: 0; background: transparent; }
#overlay .more-toggle { border: 0; border-radius: 0; background: transparent; padding-left: 0; padding-right: 0; }
#overlay .modal-foot { padding: 0 38px 34px; }
#overlay .btn-primary { border-radius: 3px; }

/* Responsive: preserve the existing mobile List/Map engine and fold away the desktop rail. */
@media (max-width: 768px) {
    :root { --app-header: 58px; }
    html, body { max-width: 100%; overflow-x: hidden; }
    .app-rail { display: none; }
    body > header,
    .main,
    .mobile-desktop-banner,
    .mobile-toggle { margin-left: 0; }
    body > header { width: 100%; height: var(--app-header); padding: 0 14px; box-sizing: border-box; }
    body > header .header-right { min-width: 0; margin-left: auto; }
    body > header .logo { display: flex; }
    .desktop-commandbar,
    .desktop-wordmark,
    .desktop-map-toolbar,
    .header-signin,
    .list-resize-handle { display: none !important; }
    .header-right .btn-access { min-height: 38px; height: 38px; padding: 0 13px; font-size: 11px; }
    .sidebar-top { padding: 12px 14px 6px; }
    .filters-row { margin: 5px 14px 10px; }
    #fmFactsBody .fm-seg { width: 100%; max-width: none; }
    #fmFactsBody .fm-fact-row { display: block; }
    #fmFactsBody .fm-fact-k { display: block; margin-bottom: 7px; }
    .results-bar { min-height: 62px; padding: 10px 14px; }
    .results-count { font-size: 21px; }
    .main.view-map .results-bar { min-height: 62px; flex-wrap: nowrap; align-content: center; }
    .main.view-map .results-left,
    .main.view-map .results-right { width: auto; }
    .main.view-map .results-left { flex: 1 1 auto; }
    .main.view-map .results-right { flex: 0 0 auto; }
    .card-density { display: none !important; }
    .main.view-map.cards-2up #venueList { display: block !important; }
    .venue-card {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto;
        min-height: 0;
    }
    .venue-card .vc-photo {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }
    .venue-card .vc-body {
        grid-column: 1;
        grid-row: 2;
        min-height: 124px;
        padding: 18px 17px 16px;
    }
    .venue-card .venue-name { font-size: 25px; }
    .venue-card .venue-card-meta { margin-top: 6px; }
    .venue-card .card-signals { padding-top: 18px; }
    .venue-card .vc-facts { grid-row: 3; padding-left: 17px; padding-right: 17px; }
    .venue-list.photos-off .venue-card,
    .venue-list.photos-off .venue-card.transparent {
        grid-template-rows: minmax(72px, auto);
        height: auto;
        min-height: 72px;
    }
    .venue-list.photos-off .venue-card .vc-body,
    .venue-list.photos-off .venue-card.transparent .vc-body {
        grid-row: 1;
        min-height: 72px;
        padding: 12px 14px;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 12px;
    }
    .venue-list.photos-off .venue-card .venue-name { font-size: 19px; }
    .venue-list.photos-off .venue-card .card-signals { max-width: 138px; gap: 5px; }
    .venue-list.photos-off .venue-card .signal-chip { font-size: 10px; }
    .venue-list.photos-off .venue-card .signal-chip + .signal-chip::before { content: none; }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) {
        grid-template-rows: minmax(72px, auto);
        min-height: 72px;
    }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .vc-body {
        min-height: 72px;
        padding: 12px 14px;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "name name"
            "meta signals";
        align-items: center;
        row-gap: 4px;
    }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .card-signals {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-end;
        gap: 5px;
    }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 168px minmax(104px, auto);
        min-height: 0;
    }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-photo {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
        aspect-ratio: auto;
    }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-body {
        grid-column: 1;
        grid-row: 2;
        min-height: 104px;
        padding: 19px 17px 18px;
        justify-content: center;
        text-align: left;
    }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .masked-name { font-size: 24px; }
    .venue-list.tplock.photos-off .venue-card.transparent {
        grid-template-rows: minmax(72px, auto);
        min-height: 72px;
    }
    .venue-list.tplock.photos-off .venue-card.transparent .vc-body { min-height: 72px; }
    .main.view-map .sidebar:not(.mobile-hidden) ~ .map-filter-chips { display: none !important; }
    .gate-modal { padding: 36px 20px 26px; }
    .gate-title { font-size: 29px; }
    .gate-proof { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .gate-proof-eyebrow { grid-column: 1; text-align: center; }
    .gate-proof-q,
    .gate-proof-q:last-child { padding: 0; border: 0; text-align: center; }
    #overlay { align-items: flex-end; }
    #overlay .modal {
        width: 100%;
        max-width: none;
        max-height: 92dvh;
        border-radius: 16px 16px 0 0;
    }
    #overlay .modal-head { padding: 27px 20px 19px; }
    #overlay .modal-title { font-size: 30px; }
    #overlay .modal-body { padding: 20px 20px 28px; }
    #overlay .modal-foot { padding: 0 20px calc(24px + env(safe-area-inset-bottom)); }
    #overlay .form-row { gap: 0; }
    #overlay .form-input,
    #overlay .form-select,
    #overlay .form-textarea { font-size: 16px; }
    /* Pill + chips share ONE scrollable strip. overflow: visible let the chips escape the
       row and paint over the list and the open detail panel; the base width:100% pill
       (app.html mobile block) then shoved every chip out of frame — both owner catches,
       mobile test 2026-07-19. */
    .filters-row { width: auto; overflow-x: auto; display: flex; align-items: center; gap: 6px; }
    .filters-row:has(#filterChips:empty) { display: none; }
    #filterChips { flex: 0 0 auto; display: flex; flex-wrap: nowrap; gap: 6px; }
    #filterChips .fchip { flex: 0 0 auto; white-space: nowrap; }
}

/* Detail panel: a subtle hairline between the numbers, community quotes, and quick
   facts sections (owner ask 2026-07-19) — adjacent sections only, so no doubled lines. */
.detail-panel .section + .section,
.detail-panel .dt-hero + .section { border-top: 1px solid var(--app-line); padding-top: 18px; margin-top: 18px; }

/* Split cards respond to the draggable pane itself. They scale as one component instead of
   preserving desktop proportions until the title is forced into a narrow vertical stack. */
@media (min-width: 769px) and (max-width: 1120px) {
    .main.view-map .venue-card {
        grid-template-columns: minmax(124px, 38%) minmax(0, 1fr);
        grid-template-rows: minmax(170px, 1fr) auto;
        min-height: 202px;
    }
    .main.view-map .venue-card .vc-photo {
        grid-column: 1;
        grid-row: 1;
        min-height: 170px;
        aspect-ratio: auto;
    }
    .main.view-map .venue-card .vc-body {
        grid-column: 2;
        grid-row: 1;
        min-height: 170px;
    }
    .main.view-map .venue-card .vc-facts { grid-row: 2; }
    .main.view-map .venue-list.photos-off .venue-card { grid-template-rows: auto; }
    .main.view-map .venue-list.photos-off .venue-card .vc-body { grid-row: 1; min-height: 76px; }
}

@container browse-list (max-width: 540px) {
    .venue-card,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent {
        grid-template-columns: minmax(132px, 38%) minmax(0, 1fr);
        grid-template-rows: minmax(174px, 1fr) auto;
        min-height: 208px;
    }
    .venue-card .vc-photo,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-photo {
        min-height: 174px;
    }
    .venue-card .vc-body,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-body {
        min-height: 174px;
        padding: 21px 17px 16px;
    }
    .venue-card .venue-name,
    .venue-card .masked-name,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .masked-name {
        font-size: 25px;
        line-height: 1.02;
    }
    .venue-card .card-signals { padding-top: 15px; gap: 6px 9px; }
    .venue-card .signal-chip { font-size: 10px; gap: 5px; }
    .venue-card .vc-facts { min-height: 34px; padding: 7px 13px; }
}

@container browse-list (max-width: 440px) {
    .sidebar-top { padding-left: 14px; padding-right: 14px; }
    .main.view-map #venueList { padding-left: 14px; padding-right: 14px; }
    .results-bar { padding-left: 14px; padding-right: 14px; }
    .venue-card,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent {
        grid-template-columns: minmax(112px, 36%) minmax(0, 1fr);
        grid-template-rows: minmax(150px, 1fr) auto;
        min-height: 182px;
    }
    .venue-card .vc-photo,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-photo {
        min-height: 150px;
    }
    .venue-card .vc-body,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-body {
        min-height: 150px;
        padding: 17px 14px 14px;
    }
    .venue-card .venue-name,
    .venue-card .masked-name,
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .masked-name {
        font-size: 22px;
        line-height: 1.02;
    }
    .venue-card .venue-card-meta { margin-top: 6px; }
    .venue-card .card-signals { padding-top: 11px; gap: 5px 8px; }
    .venue-card .signal-chip { font-size: 9.5px; }
    .venue-card .signal-chip .icn { width: 12px; height: 12px; }
    .venue-card .vc-facts { min-height: 31px; padding: 6px 11px; font-size: 9.5px; }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-locked .icn { width: 15px; height: 15px; padding: 10px; }
    .venue-list.tplock:not(.photos-off) .venue-card.transparent .vc-stock-note { left: 10px; bottom: 9px; font-size: 7px; }
    .photos-toggle { padding-left: 10px; padding-right: 10px; }
}

/* Compact desktop keeps the rail, but gives the split list enough width to read cleanly. */
@media (min-width: 769px) and (max-width: 980px) {
    :root { --app-rail: 78px; }
    .app-rail { width: var(--app-rail); }
    .app-rail-item { min-height: 66px; padding-left: 4px; padding-right: 4px; font-size: 10px; }
    .app-rail-secondary { padding-left: 5px; padding-right: 5px; }
    body > header { padding-left: 24px; padding-right: 20px; gap: 18px; }
    .desktop-wordmark { width: 145px; flex-basis: 145px; }
    .desktop-wordmark-name { font-size: 27px; }
    .desktop-wordmark-the { font-size: 21px; }
    .main.view-map .sidebar { width: var(--app-list-width) !important; }
    .main.view-map.cards-2up #venueList { grid-template-columns: minmax(0, 1fr); }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) {
        grid-template-rows: minmax(78px, auto);
        min-height: 78px;
    }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .vc-body {
        min-height: 78px;
        padding: 12px 14px;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "name name"
            "meta signals";
        align-items: center;
        row-gap: 4px;
    }
    .main.view-map.cards-2up .venue-list.photos-off .venue-card:not(.transparent) .card-signals {
        display: flex;
        justify-content: flex-end;
        gap: 5px;
    }
    .desktop-map-toolbar { left: auto; }
    .main.view-map .map-filter-chips:not(:empty) { left: calc(var(--app-list-width) + 14px); }
    .main.view-map #venueList { padding-left: 14px; padding-right: 14px; }
    .sidebar-top { padding-left: 14px; padding-right: 14px; }
    .results-bar { padding-left: 14px; padding-right: 14px; }
    .venue-list.photos-off .venue-card .vc-body,
    .venue-list.photos-off .venue-card.transparent .vc-body {
        min-height: 78px;
        padding: 12px 14px;
        column-gap: 10px;
    }
    .venue-list.photos-off .venue-card .venue-name { font-size: 19px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .venue-list.photos-off .venue-card .signal-chip { font-size: 10px; }
    .venue-list.photos-off .venue-card .signal-chip + .signal-chip::before { content: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
