/* Apollo Classificados — /anuncios screen (from approved market.html mockup) */
/* Loaded only on /anuncios. Wrapper: .mk-screen (maps to mockup .mk-screen). */

/* Page fonts not already shipped by core.js: Space Grotesk / Space Mono
   back --ff-main / --ff-mono, Lato is page-local (ticket typography only) */
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&family=Lato:wght@400;700&display=swap");

:root {
    --ff-ticket: "Lato", sans-serif; /* ticket-stub typography, distinct from --ff-main/--ff-heading */
    /* Mobile-app-first ticket geometry (phone base → enhanced @720 / @999) */
    --rt-w: min(300px, calc(100vw - 48px));
    --rt-h: 392px;
    --rt-media-h: 148px;
    --rt-fan-x: 108px;
    --rt-fan-y: 12px;
    --rt-fan-rot: 5.25deg;
    --rt-stage-h: min(640px, 88dvh);
    --market-pad-x: max(16px, env(safe-area-inset-left, 0px));
    --market-pad-r: max(16px, env(safe-area-inset-right, 0px));
    /* Fan geometry: no opacity falloff — depth reads from z-order + y + rotation.
       Scale step is the ONLY size differentiation between the centred card
       ("em evidência") and the extremes. Raise it to make the falloff visible. */
    --rt-fan-scale-step: 0.001;
    --market-ease-spring: cubic-bezier(0.22, 1.15, 0.36, 1);
    --market-ease-press: cubic-bezier(0.2, 0.9, 0.3, 1);
}

/* Shell owns body padding — screen uses .mk-screen gutter only. */

/* corner-shape law extension — the global override list in base.css names
   .btn/.tag/.pill/.av/etc; these page-specific circular/pill elements need
   the same true-round treatment (squircle would warp them). */

/* --- HERO --- */
.market-hero { padding: 36px 0 18px 0; }
.market-hero h1 { font-size: clamp(36px, 11vw, 80px); font-weight: 800; line-height: 0.9; letter-spacing: -0.04em; }
.market-hero h1 span { color: var(--accent); font-family: sans-serif; }
.classificados-eyebrow {
    font-family: var(--ff-mono);
    font-size: var(--fs-list-meta);
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--muted-txt);
    margin-top: var(--s-2);
}

/* --- PORTAL SEARCH BAR --- */
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
/* ── Portal search — chrome-less editorial field ────────────────────
   Deliberately has NO panel: no border box, no card fill, no radius,
   no drop shadow. The field is defined by white space and type alone,
   spanning the full content width so the page reads open rather than
   boxed. Its only structural mark is a hairline rule that is almost
   invisible at rest and blooms in --accent from the centre on focus.
   Delete the ::after pair if you want it fully markless.            */
.classificados-search {
    position: sticky;
    top: 0;
    z-index: 40;
    margin: 0 0 var(--s-6);
    padding-block: var(--s-3);
    isolation: isolate;
}
/* Page-coloured veil so the field stays legible once the ticket fan
   travels underneath — masked to nothing at its foot, so on a flat
   background it is completely invisible. Bleeds to the viewport edges. */
.classificados-search::before {
    content: '';
    position: absolute;
    inset: 0 calc(-1 * var(--market-pad-r)) -24px calc(-1 * var(--market-pad-x));
    background: var(--bg);
    -webkit-mask-image: linear-gradient(to bottom, #000 0 66%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0 66%, transparent 100%);
    pointer-events: none;
    z-index: -1;
}
.classificados-search-row {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--s-4);
    width: 100%;
    max-width: none;
    min-height: 60px;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
/* Resting hairline — structure without a border. */
.classificados-search-row::before {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 1px;
    background: rgba(var(--rgb-diff), .09);
    transition: background .35s var(--ease);
}
/* Focus rule — draws out from the centre. */
.classificados-search-row::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 1px;
    background: var(--accent);
    transform: scaleX(0);
    transform-origin: 50% 50%;
    transition: transform .55s var(--ease);
}
.classificados-search-row:focus-within::after { transform: scaleX(1); }
.classificados-search-row:hover::before { background: rgba(var(--rgb-diff), .16); }

.classificados-search-row select,
.classificados-search-row input {
    font-family: var(--ff-main);
    color: var(--txt-heading);
    background: none;
    border: none;
    outline: none;
    min-height: 60px;
}
/* Scope — a quiet uppercase mono label, not a control chip. */
.classificados-search-row select {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    padding: 0 20px 0 0;
    font-family: var(--ff-mono);
    font-size: calc(10.5px * var(--fs-u));
    font-weight: 400;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--muted-txt);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%23999' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 2px center;
    transition: color .3s var(--ease);
}
.classificados-search-row select:hover,
.classificados-search-row:focus-within select { color: var(--txt-heading); }
.classificados-search-row select:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
    border-radius: var(--r-xs);
}

/* Query — the largest, lightest type on the row. */
.classificados-search-row input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
    font-size: calc(18px * var(--fs-u));
    font-weight: 300;
    letter-spacing: -.012em;
}
.classificados-search-row input::placeholder {
    color: var(--muted-txt);
    opacity: .5;
    font-weight: 300;
    letter-spacing: -.008em;
}
.classificados-search-row input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    width: 13px; height: 13px;
    cursor: pointer;
    opacity: .3;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='%23000' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
    transition: opacity .25s var(--ease);
}
.classificados-search-row input::-webkit-search-cancel-button:hover { opacity: .7; }

/* Submit — a bare glyph that only gains weight on intent. */
.classificados-search-btn {
    flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    width: 44px; min-width: 44px; height: 44px;
    background: none;
    color: var(--muted-txt);
    border: none;
    border-radius: var(--r-pill);
    cursor: pointer;
    transition: color .3s var(--ease), background-color .3s var(--ease), transform .28s var(--market-ease-press);
    -webkit-tap-highlight-color: transparent;
}
.classificados-search-btn:hover {
    color: var(--txt-heading);
    background-color: rgba(var(--rgb-diff), .045);
}
.classificados-search-row:focus-within .classificados-search-btn { color: var(--accent); }
.classificados-search-btn:active { transform: scale(.94); }
.classificados-search-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.classificados-search-btn i { font-size: calc(19px * var(--fs-u)); }

@media (max-width: 520px) {
    .classificados-search-row { gap: var(--s-3); min-height: 54px; }
    .classificados-search-row select,
    .classificados-search-row input { min-height: 54px; }
    .classificados-search-row select { font-size: calc(9.5px * var(--fs-u)); letter-spacing: .12em; padding-right: 17px; }
    .classificados-search-row input { font-size: calc(16px * var(--fs-u)); }
    .classificados-search-btn { width: 40px; min-width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
    .classificados-search-row::after { transition: none; }
    .classificados-search-btn { transition: none; }
}

/* --- AWARENESS CTA (safety notice) --- */
/* Horizontal, discreet layout: icon (left) | content (center) | button (right).
   Minimal, clean, modern — no shadows, no gradients, no visual excess.
   Restores the ".mk-screen > .alert" margin-bottom lost when class changed. */
#ctaSafetyAwareness {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    margin-bottom: 60px;
    border: 1px solid rgba(var(--rgb-accent), .12);
    background: var(--black-1);
}
.cta-icon-badge {
    width: 44px; height: 44px;
    min-width: 44px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: rgba(var(--rgb-accent), .08);
    border: 1px solid rgba(var(--rgb-accent), .20);
}
.cta-icon-badge i { font-size: calc(18px * var(--fs-u)); color: var(--accent); }
#ctaSafetyAwareness .cta-card-title {
    font-size: calc(15px * var(--fs-u));
    font-weight: 700;
    letter-spacing: -0.005em;
    margin-bottom: 3px;
}
#ctaSafetyAwareness p {
    font-size: calc(13px * var(--fs-u));
    line-height: 1.5;
    color: rgba(255, 255, 255, .60);
    margin: 0;
}
#ctaSafetyAwareness .btn {
    white-space: nowrap;
    display: inline-flex; align-items: center; gap: 6px;
    font-size: calc(12px * var(--fs-u));
    font-weight: 700;
    padding: 10px 16px;
    transition: background .25s var(--ease), color .25s var(--ease);
}
#ctaSafetyAwareness .btn:hover {
    background: var(--accent); color: #fff;
}
@media (max-width: 768px) {
    #ctaSafetyAwareness {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        padding: 18px 18px calc(18px + env(safe-area-inset-bottom, 0px) * 0);
        margin-bottom: 36px;
    }
    #ctaSafetyAwareness .btn {
        width: 100%;
        min-height: 48px;
        justify-content: center;
        margin-top: 2px;
    }
}

/* --- LAYOUT UTILS — MOBILE APP FIRST (default); PC only @ 999px+ --- */
.mk-screen {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: var(--market-pad-x) !important;
    padding-right: var(--market-pad-r) !important;
}
.mk-screen > .alert { margin-bottom: 60px; }
@media (min-width: 999px) {
    :root {
        /* Desktop gutter promoted onto the SAME tokens the breakouts negate.
           Previously .mk-screen hard-coded 24px while --market-pad-* stayed 16px,
           so every full-bleed row stopped 8px short of each edge. */
        --market-pad-x: max(24px, env(safe-area-inset-left, 0px));
        --market-pad-r: max(24px, env(safe-area-inset-right, 0px));
    }
    .mk-screen {
        padding-left: var(--market-pad-x) !important;
        padding-right: var(--market-pad-r) !important;
        max-width: none !important;
    }
    .market-hero { padding: 60px 0 24px 0; }
    .market-hero h1 { font-size: clamp(48px, 6vw, 80px); }
    :root {
        --rt-w: 340px;
        --rt-h: 420px;
        --rt-media-h: 168px;
        --rt-fan-x: 180px;
        --rt-fan-y: 20px;
        --rt-fan-rot: 4deg;
        --rt-stage-h: 780px;
    }
}
@media (min-width: 720px) and (max-width: 998px) {
    :root {
        --rt-w: 318px;
        --rt-h: 408px;
        --rt-media-h: 158px;
        --rt-fan-x: 142px;
        --rt-fan-y: 16px;
        --rt-fan-rot: 4.5deg;
        --rt-stage-h: 720px;
    }
    .market-hero { padding: 48px 0 22px 0; }
}

.section-header { display: flex; justify-content: space-between; align-items: flex-end; margin: 0px; border: none!important; padding-bottom: 10px; gap: 12px; }
.section-title { font-size: calc(22px * var(--fs-u)); font-weight: 700; display: flex; align-items: center; gap: 10px; letter-spacing: -0.03em; }
.section-title i { color: var(--accent); }
.section-count { font-family: var(--ff-mono); font-size: calc(11px * var(--fs-u)); color: var(--gray-8); text-transform: uppercase; letter-spacing: .04em; }

/* View-toggle icon next to the "Repasses" / "Acomodações" titles —
   ONE icon, not a muted/active pair: its class (and title/aria-label)
   is swapped between ri-gallery-view-2 ("Ver anúncios sem efeito") and
   ri-carousel-view ("Ver anúncios em efeito fluido") in JS
   (setViewToggleState) to reflect whichever mode is CURRENTLY active,
   so there's never a
   second, unused icon sitting there for "muted" styling to apply to.
   Scoped two-deep (.section-title .market-view-toggle i) so it always
   wins over the broader ".section-title i { color: var(--accent) }"
   rule above regardless of source order. */
.market-view-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    margin: -10px -8px -10px 0;
    border-radius: var(--r-sm);
    -webkit-tap-highlight-color: transparent;
}
.section-title .market-view-toggle i {
    color: var(--muted);
    cursor: pointer;
    font-size: calc(17px * var(--fs-u));
    transition: color .2s var(--ease), transform .28s var(--market-ease-press);
}
.section-title .market-view-toggle i:hover { color: var(--accent); }
.section-title .market-view-toggle:active i { transform: scale(.9); color: var(--accent); }

.grid-layout {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    margin-bottom: 80px !important;
    height: auto !important;
    overflow: visible !important;
    position: relative !important;
}
@media (min-width: 999px) {
    .grid-layout {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 24px !important;
        margin-bottom: 160px !important;
    }
    .section-title { font-size: calc(24px * var(--fs-u)); }
}

/* --- FILTERS (labels rendered by app-market.js from APOLLO_MARKET_FILTERS) --- */
/* Registered so the mask edges interpolate instead of snapping.
   Unsupported browsers simply get an instant change — never a broken mask. */
@property --fr-fade-l { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --fr-fade-r { syntax: '<length>'; inherits: false; initial-value: 0px; }

/* Overflowing pills dissolve at both ends through a CLIP MASK rather than
   an edge shadow or a hard cut. Both fades default to 0px, which makes the
   mask fully opaque — so with JS absent nothing is ever clipped. The
   scroll-state hook below raises only the side that still has travel. */
.filters-row {
    --fr-fade-l: 0px;
    --fr-fade-r: 0px;
    display: flex;
    gap: 8px;
    margin-bottom: 28px;
    overflow-x: auto;
    padding: 4px 2px 12px;
    margin-left: -2px;
    margin-right: -2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 28px;
    -webkit-mask-image: linear-gradient(to right,
        transparent 0, #000 var(--fr-fade-l),
        #000 calc(100% - var(--fr-fade-r)), transparent 100%);
    mask-image: linear-gradient(to right,
        transparent 0, #000 var(--fr-fade-l),
        #000 calc(100% - var(--fr-fade-r)), transparent 100%);
    transition: --fr-fade-l .3s var(--ease), --fr-fade-r .3s var(--ease);
}
@media (prefers-reduced-motion: reduce) {
    .filters-row { transition: none; }
}
.filters-row::-webkit-scrollbar { display: none; }

.filter-pill {
    padding: 0 16px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: var(--r-pill);
    font-family: var(--ff-mono);
    font-size: calc(10px * var(--fs-u));
    font-weight: 600;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    transition:
        background .28s var(--ease),
        color .28s var(--ease),
        border-color .28s var(--ease),
        transform .28s var(--market-ease-press);
    background: transparent;
    color: var(--black-1);
    scroll-snap-align: start;
    -webkit-tap-highlight-color: transparent;
    flex-shrink: 0;
}
.filter-pill:hover { border-color: var(--black-1); }
.filter-pill:active { transform: scale(.96); }
/* Active state carries NO elevation shadow — weight comes from the solid
   fill and the ink-on-white contrast alone. */
.filter-pill.active {
    background: var(--black-1);
    color: var(--white-1);
    border-color: var(--black-1);
    box-shadow: none;
}

/* ========================================= */
/* CLASSIFICADOS — carousel + scoop tickets  */
/* ========================================= */
.classificados-stage {
    position: relative;
    margin-bottom: var(--s-5);
}
.classificados-stage.is-grid {
    background: #fff;
    margin-left: calc(-1 * var(--market-pad-x));
    margin-right: calc(-1 * var(--market-pad-r));
    padding-top: var(--s-4);
    padding-bottom: calc(var(--s-6) + env(safe-area-inset-bottom, 0px));
    padding-left: max(14px, env(safe-area-inset-left, 0px));
    padding-right: max(14px, env(safe-area-inset-right, 0px));
}

/* CAROUSEL / MARQUEE fan (default) — absolute --active/--x/--y/--rot */
#ticketCarousel.carousel {
    position: relative;
    display: block;
    z-index: 1;
    height: var(--rt-stage-h);
    /* TRUE edge-to-edge: negate the container gutter exactly, rather than
       100dvw + left:50% + -50dvw — that combination resolves `left:50%`
       against the padded containing block while 100dvw includes the
       scrollbar, leaving a gutter-sized gap at both extremes. */
    width: auto;
    left: auto;
    margin: -8px calc(-1 * var(--market-pad-r)) 28px calc(-1 * var(--market-pad-x));
    padding: 0;
    overflow: hidden !important;
    pointer-events: none;
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
}
.classificados-stage.is-grid #ticketCarousel.carousel {
    width: 100% !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    touch-action: auto;
}

article[type=ticket].carousel-item {
    --items: 5;
    --width: var(--rt-w, 300px);
    --x: calc(var(--active) * var(--rt-fan-x, 108px));
    --y: calc(var(--abs-active) * var(--rt-fan-y, 12px));
    --rot: calc(var(--active) * var(--rt-fan-rot, 5.25deg));
    /* Full opacity at every fan position — an off-centre repasse is still a
       real listing and must stay legible. Depth now comes from z-order,
       y-drop, rotation and this micro-scale, never from transparency. */
    --opacity: 1;
    --rt-scale: calc(1 - (var(--abs-active) * var(--rt-fan-scale-step, 0.001)));
    overflow: visible;
    position: absolute;
    z-index: var(--zIndex);
    width: var(--width);
    height: var(--rt-h, 392px);
    top: 50%;
    left: 50%;
    margin: calc(var(--rt-h, 392px) * -0.5) 0 0 calc(var(--width) * -0.5);
    transform-origin: 50% 145%;
    font-family: var(--ff-main);
    display: flex;
    flex-direction: column;
    gap: 0;
    background: transparent !important;
    isolation: isolate;
    pointer-events: all;
    touch-action: none;
    transform: translate(var(--x), var(--y)) rotate(var(--rot)) scale(var(--rt-scale, 1));
    transition:
        transform 0.75s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.35s var(--ease);
    opacity: var(--opacity);
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
article[type=ticket].carousel-item.is-pressing {
    transition-duration: .22s;
}
article[type=ticket].carousel-item.is-pressing:not(.is-popup) {
    transform: translate(var(--x), calc(var(--y) - 8px)) rotate(var(--rot)) scale(calc(var(--rt-scale, 1) * 0.985));
}
@media (hover: hover) and (pointer: fine) {
    article[type=ticket].carousel-item:hover {
        transform: translate(var(--x), calc(var(--y) - 15px)) rotate(var(--rot)) scale(var(--rt-scale, 1));
    }
    article[type=ticket].carousel-item:hover .top {
        box-shadow: inset 0 1px 0 0 rgba(var(--rgb-theme),.35), inset 0 0 0 1px rgba(var(--rgb-theme),.12);
    }
}

/* GRID VIEW — premium event trays (flex-wrap clusters) */
#ticketCarousel.grid-view {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--s-5) !important;
    height: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    max-width: 1100px;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    width: 100% !important;
    left: auto !important;
}
/*
   Same-event tray — flat luxury plate (mobile-app grade):
   matte surface, Apollo inset hairlines, no linear gradients.
   Festival logo top-right when PNG loads; card well is a clean nest.
*/
.rt-event-group {
    --event-glow: 168, 160, 148;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    position: relative;
    border-radius: calc(var(--r-lg) + 2px);
    background: var(--surface-2, var(--surface));
    border: 1px solid rgba(var(--rgb-diff), .07);
    box-shadow:
        var(--ins-shadow, inset 0 1px 0 0 rgba(var(--rgb-theme), .9), inset 0 0 0 1px rgba(var(--rgb-theme), .4)),
        0 22px 48px -30px rgba(var(--rgb-diff), .24);
    overflow: visible;
}
.rt-event-group::before { display: none; }
.rt-event-group.is-empty { display: none !important; }
.rt-event-group-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    padding: 16px 16px 14px;
    background: transparent;
    border-bottom: 1px solid rgba(var(--rgb-diff), .06);
}
.rt-event-group-head::after { display: none; }
.rt-event-group-brand {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.rt-event-group-eyebrow {
    font-family: var(--ff-mono);
    font-size: calc(9px * var(--fs-u));
    text-transform: uppercase;
    letter-spacing: .14em;
    color: rgba(var(--event-glow), .88);
    line-height: 1.2;
}
.rt-event-group-head h3 {
    font-family: var(--ff-heading);
    font-size: clamp(16px, 4.4vw, var(--fs-h6));
    font-weight: 700;
    color: var(--txt-heading);
    letter-spacing: -.025em;
    margin: 0;
    line-height: 1.12;
    max-width: 100%;
}
.rt-event-group-meta {
    font-family: var(--ff-mono);
    font-size: calc(10px * var(--fs-u));
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted-txt);
    line-height: 1.35;
}
.rt-event-group-logo {
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px;
    margin-top: -2px;
    border-radius: calc(var(--r-md) - 1px);
    background: rgba(var(--rgb-diff), .035);
    border: 1px solid rgba(var(--rgb-diff), .07);
    box-shadow:
        inset 0 1px 0 0 rgba(var(--rgb-theme), .55),
        0 6px 16px -10px rgba(var(--rgb-diff), .35);
    opacity: 0;
    transform: scale(.9);
    transition:
        opacity .4s var(--ease),
        transform .45s var(--market-ease-spring, cubic-bezier(.34, 1.4, .64, 1));
}
.rt-event-group-logo.is-visible {
    opacity: 1;
    transform: scale(1);
}
.rt-event-group-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 2px 8px rgba(var(--rgb-diff), .28));
    box-shadow: none !important;
}
.rt-event-grid {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px 10px 16px;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    box-sizing: border-box;
    border: none;
    border-radius: 0 0 calc(var(--r-lg) + 2px) calc(var(--r-lg) + 2px);
    background: transparent;
    box-shadow: none;
}
#ticketCarousel.grid-view .rt-event-group .rt-event-grid article[type=ticket].carousel-item:not(.is-popup) .top {
    box-shadow:
        inset 0 1px 0 0 rgba(255,255,255,.07),
        0 0 0 1px rgba(var(--rgb-diff), .06),
        0 12px 28px -18px rgba(var(--rgb-diff), .38);
}
#ticketCarousel.grid-view .rt-event-group .rt-event-grid article[type=ticket].carousel-item:not(.is-popup) .bottom {
    box-shadow:
        inset 0 1px 0 0 rgba(255,255,255,.05),
        0 0 0 1px rgba(var(--rgb-diff), .05);
}
/* :not(.is-popup) — grid !important resets must not beat FLIP popup (fixed + GSAP transform) */
#ticketCarousel.grid-view article[type=ticket].carousel-item:not(.is-popup) {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
    width: var(--rt-w) !important;
    max-width: min(var(--rt-w), 100%) !important;
    height: var(--rt-h) !important;
    transform: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
    touch-action: manipulation;
    transition:
        transform 0.38s var(--market-ease-spring),
        opacity 0.35s var(--ease),
        filter 0.35s var(--ease) !important;
}
#ticketCarousel.grid-view article[type=ticket].carousel-item.is-pressing:not(.is-closed):not(.is-popup) {
    transform: scale(0.978) translateY(2px) !important;
}
@media (hover: hover) and (pointer: fine) {
    #ticketCarousel.grid-view article[type=ticket].carousel-item:not(.is-popup):hover {
        transform: translateY(-6px) !important;
    }
    #ticketCarousel.grid-view article[type=ticket].carousel-item.is-closed:not(.is-popup):hover {
        transform: none !important;
    }
    #ticketCarousel.grid-view article[type=ticket].carousel-item:not(.is-popup):hover .top {
        box-shadow:
            inset 0 1px 0 0 rgba(255,255,255,.12),
            inset 0 0 0 1px rgba(255,255,255,.06),
            0 0 0 1px rgba(var(--event-glow, 168, 160, 148), .18),
            0 14px 32px -14px rgba(var(--event-glow, 168, 160, 148), .28);
    }
    #ticketCarousel.grid-view article[type=ticket].carousel-item:not(.is-popup):hover .bottom {
        box-shadow:
            inset 0 1px 0 0 rgba(255,255,255,.06),
            0 0 0 1px rgba(var(--event-glow, 168, 160, 148), .14);
    }
}
@media (min-width: 720px) {
    .rt-event-grid {
        justify-content: flex-start;
        gap: var(--s-3);
        padding: var(--s-4);
        border-radius: 0 0 var(--r-lg) var(--r-lg);
    }
    .rt-event-group-head { padding: var(--s-3) var(--s-4) calc(var(--s-3) + 2px); }
    .rt-event-group-meta { font-size: var(--fs-list-meta); }
    .rt-event-group-logo {
        width: 58px;
        height: 58px;
        padding: 8px;
    }
}

/*
   MARQUEE / CAROUSEL — same-event visual bond (no wrappers; physics intact).
   Shared --event-glow rim + ambient, amplified when adjacent in the fan.
   Sold/muted cards keep grayscale and drop the glow so they stay at the back.
*/
#ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed) {
    --eg-rim: rgba(var(--event-glow), .26);
    --eg-amb: rgba(var(--event-glow), .32);
    --eg-soft: rgba(var(--event-glow), .16);
}
#ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed) .top {
    box-shadow:
        inset 0 1px 0 0 rgba(255,255,255,.08),
        0 0 0 1px var(--eg-rim),
        0 10px 28px -8px var(--eg-amb),
        0 0 42px -10px var(--eg-soft);
    transition: box-shadow .45s var(--ease), transform .35s var(--ease);
}
#ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed) .bottom {
    box-shadow:
        inset 0 1px 0 0 rgba(255,255,255,.06),
        0 0 0 1px rgba(var(--event-glow), .18),
        0 8px 22px -10px rgba(var(--event-glow), .22);
    transition: box-shadow .45s var(--ease);
}
@media (hover: hover) and (pointer: fine) {
    #ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed):hover .top {
        box-shadow:
            inset 0 1px 0 0 rgba(255,255,255,.12),
            inset 0 0 0 1px rgba(255,255,255,.06),
            0 0 0 1px rgba(var(--event-glow), .38),
            0 14px 34px -8px rgba(var(--event-glow), .42),
            0 0 52px -8px rgba(var(--event-glow), .28);
    }
}
#ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed).is-pressing .top {
    box-shadow:
        inset 0 1px 0 0 rgba(255,255,255,.12),
        inset 0 0 0 1px rgba(255,255,255,.06),
        0 0 0 1px rgba(var(--event-glow), .34),
        0 12px 30px -8px rgba(var(--event-glow), .36),
        0 0 44px -8px rgba(var(--event-glow), .22);
}
/* Soft connecting plate — flat rim only (no gradient halos) */
#ticketCarousel.carousel article[type=ticket].rt-event-multi:not(.is-closed)::before,
#ticketCarousel.carousel article[type=ticket].rt-event-bond-l:not(.is-closed)::after,
#ticketCarousel.carousel article[type=ticket].rt-event-bond-r:not(.is-closed)::after {
    display: none;
}

/* Sold — muted + sits at end of group (JS sort) */
article[type=ticket].is-closed {
    opacity: .42;
    filter: grayscale(0.35);
    pointer-events: auto;
}
article[type=ticket].is-closed .top { cursor: default; }
#ticketCarousel.carousel article[type=ticket].is-closed {
    opacity: calc(var(--opacity, 1) * 0.45);
}
#ticketCarousel.carousel article[type=ticket].is-closed::before,
#ticketCarousel.carousel article[type=ticket].is-closed::after {
    display: none;
}

.rt-popup-placeholder {
    width: var(--rt-w, 340px);
    height: var(--rt-h, 420px);
    flex-shrink: 0;
    visibility: hidden;
    pointer-events: none;
}
.rt-ticket-scrim {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-modal, 900) - 1);
    background: rgba(0,0,0,.55);
    backdrop-filter: blur(18px) saturate(1.15);
    -webkit-backdrop-filter: blur(18px) saturate(1.15);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .4s var(--ease), visibility .4s;
}
.rt-ticket-scrim.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
article[type=ticket].is-popup {
    position: fixed !important;
    z-index: var(--z-modal, 900) !important;
    margin: 0 !important;
    /* top/left/width/transform owned by GSAP — do not !important-lock them */
    opacity: 1 !important;
    pointer-events: all !important;
    transform-style: preserve-3d;
    will-change: transform, width, height, top, left;
    height: auto !important;
    max-height: min(90dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px));
    max-width: none;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    scrollbar-width: none;
    filter: drop-shadow(0 28px 48px rgba(0,0,0,.45));
}
/* Beat any leftover grid !important layout locks while elevated */
#ticketCarousel.grid-view article[type=ticket].carousel-item.is-popup {
    position: fixed !important;
    z-index: var(--z-modal, 900) !important;
    height: auto !important;
    max-width: none !important;
    margin: 0 !important;
    opacity: 1 !important;
    pointer-events: all !important;
    transition: none !important;
}
article[type=ticket].is-popup::-webkit-scrollbar { display: none; }
body.rt-ticket-popup-open {
    overflow: hidden;
    touch-action: none;
}
body.rt-ticket-popup-open.rt-scroll-locked {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}

#ticketCarousel > article.app-market.resell:not([type=ticket]) {
    width: var(--rt-w);
    height: var(--rt-h);
}

/* Fixed-size frosted black ticket; scoop seam (not white notches).
   Geometry inherits :root --rt-* (phone → tablet → desktop). */
article[type=ticket] {
    background: transparent !important;
    isolation: isolate;
    width: var(--rt-w);
    height: var(--rt-h);
    flex-shrink: 0;
}
article[type=ticket] .top {
    position: relative;
    corner-shape: squircle squircle scoop scoop !important;
    border-radius: var(--r-lg) var(--r-lg) var(--r) var(--r);
    background: var(--black);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.10);
    border-bottom-color: transparent;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    cursor: pointer;
    z-index: 1;
    flex: 1 1 auto;
    min-height: 0;
    box-shadow: inset 0 1px 0 0 rgba(255,255,255,.08);
    transition: box-shadow .35s var(--ease), transform .35s var(--market-ease-press);
    -webkit-tap-highlight-color: transparent;
}
article[type=ticket] .bottom {
    position: relative;
    corner-shape: scoop scoop squircle squircle !important;
    border-radius: var(--r) var(--r) var(--r-lg) var(--r-lg);
    background: var(--black);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.10);
    border-top: 2px dashed rgba(255,255,255,.14);
    margin-top: -2px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--s-2);
    padding: 14px 16px;
    min-height: 64px;
    overflow: hidden;
    z-index: 1;
    flex: 0 0 auto;
    box-shadow: inset 0 1px 0 0 rgba(255,255,255,.06);
}

/* Fixed media height — never grows with thumb intrinsic size */
.rt-media {
    position: relative;
    width: 100%;
    height: var(--rt-media-h);
    flex: 0 0 var(--rt-media-h);
    overflow: hidden;
}
/* core.js stamps `box-shadow: var(--img-border)` on every <img>; on card
   media that reads as a frame line around the artwork. Cleared so the
   image meets the stub edge directly. */
.rt-media img { box-shadow: none; }
.rt-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: .92;
    display: block;
    box-shadow: none;
}
article[type=ticket].is-closed .rt-media img { filter: grayscale(1) brightness(.55); }
.rt-media::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.95) 0%, rgba(0,0,0,.45) 45%, transparent 78%);
    pointer-events: none;
}
article[type=ticket].is-popup .rt-media {
    height: clamp(160px, 42vw, 200px);
    flex: 0 0 clamp(160px, 42vw, 200px);
}
.rt-mediafoot {
    position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
    padding: var(--s-3) var(--s-4);
}
.rt-mediafoot .eyebrow {
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    letter-spacing: .1em; text-transform: uppercase;
    color: var(--white-700); margin-bottom: var(--s-1);
}
.rt-mediafoot h3 {
    color: var(--white); font-size: var(--fs-h5); line-height: 1.05;
}
.rt-status {
    position: absolute; top: var(--s-3); right: var(--s-3); z-index: 2;
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    letter-spacing: .08em; text-transform: uppercase;
    padding: 5px 10px; border-radius: var(--r-pill);
    background: rgba(0,0,0,.45); border: 1px solid rgba(255,255,255,.22);
    color: var(--white);
}
.rt-status.available { color: var(--alert-success); border-color: var(--alert-success); }

.rt-summary {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--s-2); padding: var(--s-3) var(--s-4);
    flex: 0 0 auto;
}
.rt-chips { display: flex; gap: var(--s-1); flex-wrap: wrap; }
.rt-chip {
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    letter-spacing: .04em; font-weight: 700;
    padding: 6px 10px; border-radius: var(--r-pill);
}
.rt-chip.qty { background: rgba(255,255,255,.10); color: var(--white); }
.rt-chip.type { background: var(--accent); color: var(--white); }
.rt-price {
    font-family: var(--ff-heading); font-weight: 700;
    font-size: var(--fs-h6); color: var(--white); text-align: right;
}
.rt-price small {
    display: block; font-family: var(--ff-mono); font-weight: 400;
    font-size: var(--fs-list-meta); color: var(--white-700);
    text-transform: uppercase; letter-spacing: .06em;
}
.rt-toggle {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    padding: 0 var(--s-4) var(--s-3);
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    letter-spacing: .1em; text-transform: uppercase; color: var(--white-700);
}
.rt-toggle svg { width: 10px; height: 10px; transition: transform .35s var(--ease); }
article[type=ticket].is-open .rt-toggle,
article[type=ticket].is-popup .rt-toggle { display: none; }

.rt-details { overflow: hidden; height: 0; opacity: 0; }
article[type=ticket].is-popup .rt-details { height: auto; opacity: 1; }
.rt-details-inner { padding: 0 var(--s-4) var(--s-4); }
.rt-desc {
    font-size: var(--fs-p3); line-height: 1.55; color: var(--white-700);
    padding-bottom: var(--s-3); border-bottom: 1px dashed rgba(255,255,255,.14);
    margin-bottom: var(--s-3);
}
.rt-lawnote { font-size: var(--fs-list-meta); color: var(--white-700); margin-top: var(--s-1); line-height: 1.4; }
.rt-lawnote b { color: var(--white); }

.rt-author {
    display: flex; align-items: center; gap: var(--s-2);
    padding-bottom: var(--s-3); margin-bottom: var(--s-3);
    border-bottom: 1px dashed rgba(255,255,255,.14);
}
.rt-avatar {
    width: 44px; height: 44px; border-radius: var(--r-sm);
    overflow: hidden; flex-shrink: 0;
    border: 1px solid rgba(255,255,255,.14);
}
.rt-avatar img { width: 100%; height: 100%; object-fit: cover; box-shadow: none; }
.rt-author-info { flex: 1; min-width: 0; }
.rt-author-name { display: flex; align-items: center; gap: 6px; }
.rt-author-name span {
    font-family: var(--ff-heading); font-weight: 700;
    font-size: var(--fs-p1); color: var(--white);
}
.rt-verified {
    width: 15px; height: 15px; border-radius: 50%; flex-shrink: 0;
    background: #1FA098; display: flex; align-items: center; justify-content: center;
}
.rt-verified svg { width: 8px; height: 8px; }
.rt-handle {
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    color: var(--white-700); margin-top: 1px;
}
.rt-trust {
    display: inline-flex; align-items: center; gap: 4px; margin-top: 5px;
    font-family: var(--ff-mono); font-size: var(--fs-list-meta); font-weight: 700;
    letter-spacing: .04em; text-transform: uppercase; color: #1FA098;
}
.rt-trust svg { width: 10px; height: 10px; }

.rt-timeline {
    display: flex; flex-direction: column; gap: var(--s-1);
    padding-bottom: var(--s-3); margin-bottom: var(--s-3);
    border-bottom: 1px dashed rgba(255,255,255,.14);
}
.rt-tl-row {
    display: flex; align-items: baseline; justify-content: space-between;
    font-size: var(--fs-p3);
}
.rt-tl-row .label { color: var(--white-700); }
.rt-tl-row .value { font-family: var(--ff-mono); font-weight: 700; color: var(--white); }
.rt-tl-row .value.closed { color: var(--alert-warning); }

article[type=ticket] .bottom .rt-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-shrink: 0;
    width: auto;
    min-height: 44px;
    padding: 10px 16px;
    border-radius: var(--r-pill);
    border: 1px solid rgba(255,255,255,.35);
    background: transparent;
    color: var(--white);
    font-family: var(--ff-mono);
    font-size: calc(11px * var(--fs-u));
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    cursor: pointer;
    transition:
        background .3s var(--ease),
        color .3s var(--ease),
        border-color .3s var(--ease),
        transform .28s var(--market-ease-press);
    -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
    article[type=ticket] .bottom .rt-cta:hover {
        background: var(--white);
        color: var(--black);
        border-color: var(--white);
    }
}
article[type=ticket] .bottom .rt-cta:active {
    transform: scale(.96);
    background: var(--white);
    color: var(--black);
    border-color: var(--white);
}
article[type=ticket] .bottom .rt-cta i { font-size: calc(14px * var(--fs-u)); line-height: 1; }
article[type=ticket] .bottom .rt-cta[disabled] {
    background: transparent;
    color: var(--white-700);
    border-color: rgba(255,255,255,.14);
    cursor: not-allowed;
}
article[type=ticket] .bottom .rt-cta[disabled]:hover,
article[type=ticket] .bottom .rt-cta[disabled]:active {
    background: transparent;
    color: var(--white-700);
    border-color: rgba(255,255,255,.14);
    transform: none;
}

.rt-disclaimer {
    text-align: center; font-size: var(--fs-list-meta); line-height: 1.5;
    color: var(--white-700); margin-top: var(--s-2);
}
.rt-disclaimer b { color: var(--white); }

.rt-barcode-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--s-2); width: 100%;
}
.rt-barcode-row .barcode {
    display: flex; align-items: flex-end; gap: 1.5px; height: 22px;
    background: none; opacity: 1; width: auto; flex: 1; min-width: 0;
}
.rt-barcode-row .barcode i { display: block; background: var(--white); width: 2px; }
.rt-code {
    font-family: var(--ff-mono); font-size: var(--fs-list-meta);
    color: var(--white-700); flex-shrink: 0;
}

/* --- ACCOMMODATION STYLES --- */
.accom-card {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--ease);
}
@media (hover: hover) and (pointer: fine) {
    .accom-card:hover { transform: translateY(-5px); }
}

.accom-img-wrap { position: relative; aspect-ratio: 4/3; border-bottom: 1px solid var(--border); }
.accom-img { width: 100%; height: 100%; object-fit: cover; }
.accom-badge {
    position: absolute; top: 10px; left: 10px;
    background: rgba(var(--rgb-theme), .9);
    backdrop-filter: blur(4px);
    padding: 4px 8px; border-radius: 6px;
    font-family: var(--ff-mono); font-size: calc(10px * var(--fs-u)); font-weight: 700; text-transform: uppercase;
}
.accom-content { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.accom-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.accom-title { font-size: calc(18px * var(--fs-u)); font-weight: 700; line-height: 1.2; }
.accom-rating {
    font-family: var(--ff-mono); font-size: calc(11px * var(--fs-u)); font-weight: 600;
    display: flex; align-items: center; gap: 4px;
    background: var(--surface); padding: 4px 8px; border-radius: var(--r-pill);
}
.accom-loc { font-family: var(--ff-mono); font-size: calc(12px * var(--fs-u)); color: var(--muted-txt); margin-bottom: 16px; display: flex; align-items: center; gap: 6px; }
.accom-footer { margin-top: auto; display: flex; justify-content: space-between; align-items: center; }
.accom-price { font-family: var(--ff-mono); font-size: calc(16px * var(--fs-u)); font-weight: 700; }
.accom-price span { font-size: calc(11px * var(--fs-u)); font-weight: 400; color: var(--muted-txt); margin-left: 2px; }
.btn-accom {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid var(--black-1); background: transparent; color: var(--black-1);
    font-family: var(--ff-mono); font-size: calc(10px * var(--fs-u)); font-weight: 700; text-transform: uppercase;
    min-height: 44px; padding: 10px 16px; border-radius: var(--r-pill);
    transition: background .3s var(--ease), color .3s var(--ease), transform .28s var(--market-ease-press);
    -webkit-tap-highlight-color: transparent;
}
.btn-accom i { font-size: calc(13px * var(--fs-u)); line-height: 1; }
@media (hover: hover) and (pointer: fine) {
    .btn-accom:hover { background: var(--black-1); color: var(--white-1); }
}
.btn-accom:active { transform: scale(.96); background: var(--black-1); color: var(--white-1); }

/* ========================================= */
/* ACOMODAÇÕES — MOBILE APP FIRST (default)  */
/* PC / ultra-wide ONLY via min-width: 999px  */
/* ========================================= */
.accom-body {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

/* Carousel host — in-flow on mobile (never absolute by default) */
.accom-carousel {
    position: relative !important;
    height: min(520px, 78dvh) !important;
    width: auto !important;
    left: auto !important;
    margin-left: calc(-1 * var(--market-pad-x)) !important;
    margin-right: calc(-1 * var(--market-pad-r)) !important;
    margin-bottom: 32px !important;
    pointer-events: none;
    overflow: visible !important;
    touch-action: pan-y;
}
.accom-carousel .app-market.accom {
    --width: min(280px, calc(100vw - 56px));
    --x: calc(var(--active) * 118px);
    --y: calc(var(--abs-active) * 14px);
    --rot: calc(var(--active) * -5deg);
    --opacity: 1;
    --rt-scale: calc(1 - (var(--abs-active) * var(--rt-fan-scale-step, 0.001)));
    position: absolute;
    z-index: var(--zIndex);
    width: var(--width);
    top: 50%;
    left: 50%;
    transform-origin: 50% 145%;
    pointer-events: all;
    touch-action: none;
    transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(var(--rot)) scale(var(--rt-scale, 1));
    transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s var(--ease);
    opacity: var(--opacity);
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
    .accom-carousel .app-market.accom:hover {
        transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y) - 10px)) rotate(var(--rot)) scale(var(--rt-scale, 1));
    }
}

/* Grid host — always in-flow, height from content (unlocks scroll-y) */
#accomGrid.grid-layout {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 7px !important;
    row-gap: 16px !important;
    margin-bottom: 80px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    width: 100% !important;
    left: auto !important;
    margin-left: 0 !important;
    position: relative !important;
    overflow: visible !important;
    pointer-events: auto !important;
}
#accomGrid.grid-layout .app-market.accom {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    transform: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
    pointer-events: auto !important;
}
#accomGrid.grid-layout .accom-title { font-size: calc(15px * var(--fs-u)); }
#accomGrid.grid-layout .accom-price { font-size: calc(14px * var(--fs-u)); }
#accomGrid.grid-layout .accom-rating { font-size: calc(10px * var(--fs-u)); }
#accomGrid.grid-layout .accom-loc { font-size: calc(11px * var(--fs-u)); }

/* Map — stacked full-bleed ABOVE cards (mobile default, both modes) */
.accom-map {
    border-radius: 0 !important;
    overflow: hidden;
    background: var(--surface);
    position: relative !important;
    width: auto !important;
    left: auto !important;
    margin-left: calc(-1 * var(--market-pad-x)) !important;
    margin-right: calc(-1 * var(--market-pad-r)) !important;
    height: 250px !important;
    margin-bottom: 24px !important;
    right: auto !important;
}
#accomGrid.grid-layout .accom-map {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    position: relative !important;
    width: auto !important;
    height: 250px !important;
    left: auto !important;
    margin-left: calc(-1 * var(--market-pad-x)) !important;
    margin-right: calc(-1 * var(--market-pad-r)) !important;
}

/* ── PC / ULTRA-WIDE (secondary) — no max-width clamp ── */
@media (min-width: 999px) {
    .accom-body { min-height: 460px !important; }

    .accom-carousel {
        position: absolute !important;
        top: 0 !important;
        left: calc(-1 * (100vw - 100%) / 2) !important;
        right: calc(45vw - (100vw - 100%) / 2) !important;
        width: auto !important;
        height: 460px !important;
        margin-left: 0 !important;
    }
    .accom-carousel .app-market.accom {
        --width: 280px;
        --x: calc(var(--active) * 150px);
        --y: calc(var(--abs-active) * 16px);
        --rot: calc(var(--active) * -4deg);
        --opacity: 1;
        transform-origin: 50% 150%;
    }

    #accomGrid.grid-layout {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 24px !important;
        margin-bottom: 160px !important;
    }
    #accomGrid.grid-layout .accom-title,
    #accomGrid.grid-layout .accom-price,
    #accomGrid.grid-layout .accom-rating,
    #accomGrid.grid-layout .accom-loc { font-size: inherit; }

    /* Carousel-mode map: 45vw flush to true viewport right (right:0 of
       the screen). margin-right breakout cancels .mk-screen padding so
       right:0 is not the padded content edge. z-index above fan cards. */
    .accom-map {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        margin-left: 0 !important;
        margin-right: calc(-1 * (100vw - 100%) / 2) !important;
        width: 45vw !important;
        height: 460px !important;
        margin-bottom: 0 !important;
        border-radius: var(--r-lg) 0 0 var(--r-lg) !important;
        z-index: 50 !important;
    }

    /* Grid-mode map: in-flow grid cell (2 cols × 2 rows) */
    #accomGrid.grid-layout .accom-map {
        position: static !important;
        right: auto !important;
        left: auto !important;
        margin-left: 0 !important;
        width: auto !important;
        height: auto !important;
        margin-bottom: 0 !important;
        grid-column: 3 / 5 !important;
        grid-row: 1 / 3 !important;
        border-radius: var(--r-lg) 0 0 var(--r-lg) !important;
    }
}

/* Leaflet base chrome we don't want (default popup arrow, attribution) */
.accom-map .leaflet-control-container { display: none; }
.accom-map-tip.leaflet-tooltip {
    background: var(--card);
    color: var(--txt-heading);
    border: 1px solid rgba(var(--rgb-diff), .08);
    border-radius: var(--r-sm);
    font-family: var(--ff-main);
    font-size: calc(12px * var(--fs-u));
    padding: 4px 10px;
    box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,.12));
}
.accom-map-tip.leaflet-tooltip::before { display: none; }

/* ========================================= */
/* SAFETY-CONSENT MODAL                      */
/* Uses the design system's own .modal-backdrop / .modal / .is-open      */
/* (from the universal layer above) instead of a bespoke lookalike —     */
/* these two rules are the only page-specific delta: this dialog is      */
/* content-heavy (legal copy + checklist) so it needs more room than the */
/* DS default 440px box, and stacked actions instead of the DS default   */
/* flex-end row. Scoped by #marketSafetyModal so nothing else is        */
/* affected — the shared .modal / .modal-actions rules stay untouched.  */
/* ========================================= */
#marketSafetyModal .modal {
    max-width: 600px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-height: 90vh;
    overflow-y: auto;
}
#marketSafetyModal .modal-actions {
    flex-direction: column;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 12px;
}

.modal-header-warning {
    display: flex; align-items: center; gap: 12px;
    padding-bottom: 20px; border-bottom: 1px solid var(--border);
}
.modal-header-warning i { font-size: calc(28px * var(--fs-u)); color: var(--accent); }
.modal-header-warning h2 {
    font-family: var(--ff-mono); font-size: calc(18px * var(--fs-u));
    font-weight: 700; color: var(--accent); letter-spacing: 0.05em; text-transform: uppercase;
}

.legal-text { font-family: var(--ff-main); font-size: calc(15px * var(--fs-u)); color: var(--black-1); line-height: 1.6; }
.legal-text p { margin-bottom: 16px; }
.legal-text b { font-weight: 700; }

.safety-list { margin: 16px 0 24px 0; display: flex; flex-direction: column; gap: 12px; }
.safety-list li {
    background: var(--surface);
    padding: 12px 16px;
    border-radius: var(--r-xs);
    font-size: calc(14px * var(--fs-u));
    display: flex; align-items: flex-start; gap: 10px;
}
.safety-list i { color: var(--accent); font-size: calc(16px * var(--fs-u)); margin-top: 2px; }

.warning-highlight {
    font-size: calc(13px * var(--fs-u)); color: var(--muted-txt); font-style: italic; border-left: 2px solid var(--border); padding-left: 12px;
}

.modal-consent {
    background: var(--surface-hover);
    padding: 16px;
    border-radius: var(--r-sm);
    border: 1px solid var(--border);
    margin-top: 8px;
}

.checkbox-wrapper-modal {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.checkbox-wrapper-modal input { display: none; }

.checkbox-wrapper-modal label {
    display: flex; align-items: flex-start; gap: 12px; cursor: pointer;
    font-size: calc(14px * var(--fs-u)); font-weight: 600; line-height: 1.4; user-select: none;
}

.custom-check-box {
    min-width: 24px; width: 24px; height: 24px;
    border: 2px solid var(--black-1);
    border-radius: var(--r-xs);
    display: flex; align-items: center; justify-content: center;
    transition: 0.2s var(--ease);
    background: var(--bg);
}
.custom-check-box::after {
    content: "\EB7B";
    font-family: "remixicon";
    font-size: calc(16px * var(--fs-u)); color: var(--white-1);
    opacity: 0; transform: scale(0.5); transition: 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.checkbox-wrapper-modal input:checked + label .custom-check-box {
    background: var(--accent);
    border-color: var(--accent);
}
.checkbox-wrapper-modal input:checked + label .custom-check-box::after {
    opacity: 1; transform: scale(1);
}

.btn-modal-main {
    width: 100%; padding: 18px;
    border-radius: var(--r-sm);
    font-family: var(--ff-mono); font-size: calc(14px * var(--fs-u)); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    background: var(--black-1); color: var(--white-1); border: none;
    transition: all 0.3s var(--ease);
    cursor: pointer;
    opacity: 0.5; pointer-events: none; filter: grayscale(100%);
}

.btn-modal-main.active {
    opacity: 1; pointer-events: auto; filter: grayscale(0%);
    background: var(--accent); box-shadow: 0 10px 30px rgba(var(--rgb-accent), .3);
}

.btn-text-only {
    background: none; border: none;
    font-family: var(--ff-main); font-size: calc(14px * var(--fs-u)); text-decoration: underline;
    color: var(--muted-txt); cursor: pointer; padding: 10px;
}
.btn-text-only:hover { color: var(--black-1); }

/* ========================================= */
/* TIPS LIGHTBOX — "Dicas de Segurança"      */
/* Separate from #marketSafetyModal above — pure information, no      */
/* consent-gate. Reuses .modal-backdrop/.modal/.modal-title/          */
/* .legal-text/.safety-list/.modal-actions/.btn-text-only; only this  */
/* ID gets a transparent, stronger blur instead of the DS default     */
/* tinted backdrop (background: rgba(...) + blur(8px)).               */
/* ========================================= */
#marketTipsModal { background: none; backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; }
#marketTipsModal .modal {
    max-width: 600px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-height: 90vh;
    overflow-y: auto;
}
#marketTipsModal .modal-title { margin-bottom: 0; }
#marketTipsModal .modal-title span { color: var(--accent); }
.modal-subtitle {
    font-family: var(--ff-mono); font-size: calc(13px * var(--fs-u)); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.05em; color: var(--accent);
}
.tips-disclaimer {
    margin-top: 8px;
    padding: 15px;
    border-left: 4px solid var(--alert-red);
    background: rgba(255, 107, 107, .08);
    border-radius: var(--r-xs);
}
.tips-disclaimer > i { color: var(--alert-red); font-size: calc(18px * var(--fs-u)); }
.tips-disclaimer .alert-title { color: var(--alert-red); margin-top: 8px; }
.tips-disclaimer p { margin-top: 10px; }

/* ========================================= */
/* PRE-CONTACT GATE — premium verify overlay */
/* Scoped under #preContactGate so market CSS */
/* (carousel / tickets / modals) stays intact. */
/* ========================================= */
html.pre-contact-open, body.pre-contact-open { overflow: hidden; }
body.pre-contact-open { position: fixed; left: 0; right: 0; width: 100%; }

#preContactGate {
    --proceed-bar-h: 120px;
    position: fixed; inset: 0;
    z-index: calc(var(--z-modal, 900) + 40);
    display: flex; flex-flow: column nowrap;
    background:
        radial-gradient(120% 80% at 10% -10%, rgba(var(--rgb-accent), .10), transparent 55%),
        radial-gradient(90% 60% at 100% 0%, rgba(var(--rgb-diff), .06), transparent 50%),
        var(--bg);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .4s var(--ease), visibility .4s;
}
#preContactGate.is-open {
    opacity: 1; visibility: visible; pointer-events: auto;
}

#preContactGate .pre-contact-gate__top {
    flex: 0 0 auto;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: calc(12px + env(safe-area-inset-top, 0px)) var(--s-4) 8px;
    max-width: 600px; width: 100%; margin: 0 auto;
}
#preContactGate .pre-contact-gate__brand {
    font-family: var(--ff-mono); font-size: 11px; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
}
#preContactGate .pre-contact-gate__brand span { color: var(--accent); }
#preContactGate .pre-contact-gate__close {
    width: 44px; height: 44px; min-width: 44px; border-radius: 50%; border: none; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--surface-hover); color: var(--txt-heading); font-size: 20px;
    transition: transform .25s var(--ease), background .25s var(--ease);
    -webkit-tap-highlight-color: transparent;
}
#preContactGate .pre-contact-gate__close:hover { transform: scale(1.05); background: var(--surface-3, var(--surface)); }

#preContactGate .pre-contact-gate__scroll {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

#preContactGate .content-wrap {
    display: flex; flex-flow: column nowrap;
    padding: var(--s-3) var(--s-4) var(--s-4);
    padding-bottom: calc(var(--proceed-bar-h, 120px) + var(--s-5));
    max-width: 600px; margin: 0 auto; gap: var(--s-6); width: 100%;
}

#preContactGate .verify-hero { display: flex; flex-flow: column nowrap; gap: var(--s-3); text-align: left; }
#preContactGate .verify-hero .label-section {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--ff-mono); font-size: 11px; font-weight: 600;
    text-transform: uppercase; letter-spacing: .12em;
    color: var(--txt-heading); background: var(--surface-hover);
    padding: 8px 14px; border-radius: var(--r-pill);
    align-self: flex-start;
    border: 1px solid rgba(var(--rgb-diff), 0.05);
    box-shadow: 0 4px 12px rgba(var(--rgb-ink, 0,0,0), 0.03);
}
#preContactGate .verify-hero .label-section i { font-size: 15px; color: var(--accent); }
#preContactGate .verify-hero h1 {
    font-size: clamp(2rem, 6vw, 2.75rem);
    font-weight: 500; line-height: 1.05; letter-spacing: -0.03em;
    color: var(--txt-heading);
}
#preContactGate .verify-hero p {
    font-size: var(--fs-p1, 15px); color: var(--txt-color);
    line-height: 1.65; max-width: 42ch; margin-top: 4px;
}
#preContactGate .verify-context {
    font-size: var(--fs-p3, 13px); color: var(--muted); line-height: 1.4;
}
#preContactGate .verify-context strong { color: var(--txt-heading); font-weight: 600; }

#preContactGate .options-hint {
    display: flex; align-items: center; gap: 10px;
    font-size: var(--fs-p2, 14px); color: var(--txt-color);
    background: var(--surface); padding: 14px 18px;
    border-radius: 16px; border: 1px solid rgba(var(--rgb-diff), 0.04);
    box-shadow: 0 2px 8px rgba(var(--rgb-ink, 0,0,0), 0.02);
}
#preContactGate .options-hint i { font-size: 18px; flex-shrink: 0; color: var(--accent); }

#preContactGate .options { display: flex; flex-flow: column nowrap; gap: var(--s-4); position: relative; }
#preContactGate .option-card {
    background: var(--card); border-radius: 28px; padding: var(--s-5);
    border: 1px solid rgba(var(--rgb-diff),.05);
    box-shadow: 0 4px 16px rgba(var(--rgb-ink, 0,0,0),.02), inset 0 1px 0 0 rgba(var(--rgb-theme),.6);
    transition: all .5s cubic-bezier(0.16, 1, 0.3, 1);
    width: 100%;
}
#preContactGate .option-card:hover {
    background: var(--surface);
    border-color: rgba(var(--rgb-diff),.08);
    box-shadow: 0 12px 32px rgba(var(--rgb-ink, 0,0,0),.05), inset 0 1px 0 0 rgba(var(--rgb-theme),.8);
    transform: translateY(-2px);
}
#preContactGate .option-card.is-expanded {
    background: var(--surface);
    border-color: rgba(var(--rgb-diff),.1);
    box-shadow: 0 16px 40px rgba(var(--rgb-ink, 0,0,0),.06), inset 0 1px 0 0 rgba(var(--rgb-theme),1);
}
#preContactGate .option-toggle {
    display: flex; flex-flow: column nowrap; align-items: flex-start; gap: var(--s-2);
    width: 100%; text-align: left; font-family: inherit; cursor: pointer;
    background: none; border: none; padding: 0; margin: 0; color: inherit;
}
#preContactGate .option-toggle .option-top {
    display: flex; align-items: center; justify-content: space-between; width: 100%; gap: var(--s-3);
}
#preContactGate .icon-circle {
    width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: var(--surface-hover); color: var(--txt-heading); font-size: 22px;
    transition: all .5s cubic-bezier(0.16, 1, 0.3, 1);
}
#preContactGate .icon-circle i { display: flex; align-items: center; justify-content: center; line-height: 1; }
#preContactGate .option-card:hover .icon-circle { transform: scale(1.08); }
#preContactGate .chev {
    color: var(--muted); font-size: 20px; flex-shrink: 0;
    transition: transform .5s cubic-bezier(0.16, 1, 0.3, 1), background .3s var(--ease), color .3s var(--ease);
    width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
    background: var(--surface-hover); border-radius: 50%;
}
#preContactGate .option-card.is-expanded .chev { transform: rotate(180deg); background: var(--txt-heading); color: var(--bg); }
#preContactGate .option-toggle h2 {
    font-size: var(--fs-h4, 18px); font-weight: 500; line-height: 1.2;
    margin-top: var(--s-3); letter-spacing: -0.01em;
}
#preContactGate .option-toggle p.option-desc,
#preContactGate .option-desc {
    font-size: var(--fs-p2, 14px); color: var(--txt-color); line-height: 1.5; margin-top: 6px;
}
#preContactGate .option-toggle .card-status {
    display: inline-flex; align-items: center; gap: 8px; margin-top: var(--s-2);
    font-size: var(--fs-p3, 13px); font-weight: 600; text-transform: uppercase; letter-spacing: .05em;
}
#preContactGate .option-toggle .card-status::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%;
    background: currentColor; box-shadow: 0 0 8px currentColor;
}
#preContactGate .option-card.is-safe .icon-circle { background: rgba(var(--rgb-accent),.12); color: var(--accent); }
#preContactGate .option-card.is-safe .card-status { color: var(--accent); }
#preContactGate .option-card.is-risky .icon-circle { background: rgba(255, 176, 32, 0.12); color: var(--alert-warning); }
#preContactGate .option-card.is-risky .card-status { color: var(--alert-warning); }
#preContactGate .option-card.is-muted .icon-circle { background: var(--surface-hover); color: var(--muted); }
#preContactGate .option-card.is-muted h2,
#preContactGate .option-card.is-muted p.option-desc { color: var(--muted); }
#preContactGate .option-card.is-muted .card-status { color: var(--muted); opacity: 0.7; }
#preContactGate .option-card.is-muted .card-status::before { box-shadow: none; }

#preContactGate .option-detail { overflow: hidden; height: 0; opacity: 0; }
#preContactGate .option-detail[hidden] { display: none; }
#preContactGate .option-detail__inner {
    width: 100%; margin-top: var(--s-4); padding-top: var(--s-4);
    border-top: 1px dashed rgba(var(--rgb-diff), 0.1);
    display: flex; flex-flow: column nowrap; gap: var(--s-3);
}
#preContactGate .list-count {
    font-size: var(--fs-p3, 13px); font-weight: 600; color: var(--txt-heading);
    text-transform: uppercase; letter-spacing: .05em;
}
#preContactGate .people-list {
    display: flex; flex-flow: column nowrap; gap: 4px;
    max-height: 280px; overflow-y: auto; padding-right: 4px; scroll-behavior: smooth;
}
#preContactGate .people-list::-webkit-scrollbar { width: 4px; }
#preContactGate .people-list::-webkit-scrollbar-track { background: transparent; }
#preContactGate .people-list::-webkit-scrollbar-thumb { background: var(--surface-4, var(--border)); border-radius: 4px; }
#preContactGate .person-row {
    display: flex; align-items: center; gap: 12px; padding: 10px 14px;
    border-radius: 16px; opacity: 0; transition: background .3s ease;
}
#preContactGate .person-row:hover { background: var(--surface-hover); }
#preContactGate .person-row .av {
    width: 38px; height: 38px; font-size: 13px; flex-shrink: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-weight: 600;
    background: linear-gradient(135deg, var(--surface-hover), var(--surface-2, var(--surface)));
    color: var(--txt-heading);
    border: 1px solid rgba(var(--rgb-diff),.04);
}
#preContactGate .person-row .handle {
    font-size: var(--fs-p2, 14px); font-weight: 500; color: var(--txt-heading);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#preContactGate .muted-warning,
#preContactGate .risky-note {
    display: flex; align-items: flex-start; gap: 12px;
    background: rgba(255, 176, 32, 0.06); padding: 16px 20px; border-radius: 20px;
    border: 1px solid rgba(255, 176, 32, 0.15);
}
#preContactGate .muted-warning i,
#preContactGate .risky-note i { font-size: 22px; color: var(--alert-warning); flex-shrink: 0; margin-top: -1px; }
#preContactGate .muted-warning p,
#preContactGate .risky-note p { font-size: var(--fs-p2, 14px); color: var(--txt-heading); line-height: 1.6; font-weight: 500; }
#preContactGate .tag-success {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(var(--rgb-accent), 0.12); color: var(--accent);
    padding: 10px 20px; border-radius: var(--r-pill); font-weight: 600; font-size: var(--fs-p2, 14px);
    align-self: flex-start; border: 1px solid rgba(var(--rgb-accent), 0.2);
}

#preContactGate .proceed-bar {
    position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
    padding: 0 var(--s-4) calc(var(--s-4) + var(--safe-bottom, 0px));
    background: linear-gradient(to top, var(--bg) 50%, transparent);
    pointer-events: none;
    transform: translateY(0);
}
#preContactGate .proceed-bar__row {
    max-width: 600px; margin: 0 auto; display: flex; align-items: center; gap: var(--s-3);
    background: rgba(var(--rgb-canvas, var(--rgb-theme)), 0.9);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    pointer-events: auto;
    padding: 12px 12px 12px 28px;
    border-radius: 99px;
    border: 1px solid rgba(var(--rgb-diff), 0.08);
    box-shadow: 0 24px 48px rgba(var(--rgb-ink, 0,0,0), 0.12), inset 0 1px 0 rgba(var(--rgb-theme), 0.8);
}
#preContactGate .proceed-bar.is-safe .proceed-bar__row { justify-content: space-between; }
#preContactGate .proceed-bar__label { font-size: var(--fs-p2, 14px); color: var(--txt-color); line-height: 1.3; }
#preContactGate .proceed-bar__label strong { color: var(--txt-heading); font-weight: 600; }
#preContactGate .btn-accent {
    background: var(--txt-heading); color: var(--bg); border: none; cursor: pointer;
    border-radius: var(--r-pill); padding: 16px 32px;
    font-size: var(--fs-p2, 14px); font-weight: 600; flex-shrink: 0; white-space: nowrap;
    transition: all .4s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 8px 16px rgba(var(--rgb-ink, 0,0,0), 0.1);
}
#preContactGate .btn-accent:hover:not([disabled]) {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 16px 24px rgba(var(--rgb-ink, 0,0,0), 0.15);
    background: var(--txt-color);
}
#preContactGate .btn-accent[disabled] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
#preContactGate .proceed-bar.is-danger .proceed-bar__row {
    border-radius: 28px; padding: 24px 28px;
    background: var(--alert-card, color-mix(in srgb, var(--alert-red) 12%, var(--bg)));
    border: 1px solid rgba(220, 38, 38, 0.2);
    align-items: flex-start;
    box-shadow: 0 24px 48px rgba(220, 38, 38, 0.05), inset 0 1px 0 rgba(var(--rgb-theme), 0.4);
}
#preContactGate .proceed-bar.is-danger i { font-size: 26px; color: var(--alert-red); flex-shrink: 0; margin-top: -2px; }
#preContactGate .proceed-bar__danger-title { font-size: var(--fs-p1, 15px); font-weight: 700; color: var(--alert-red); letter-spacing: -.01em; }
#preContactGate .proceed-bar__danger-sub { font-size: var(--fs-p2, 14px); color: var(--alert-red); line-height: 1.5; margin-top: 6px; opacity: 0.9; }

#preContactGate .verify-success {
    display: flex; flex-flow: column nowrap; gap: var(--s-3);
    background: var(--surface); border-radius: 32px; padding: var(--s-6) var(--s-5);
    box-shadow: 0 16px 40px rgba(var(--rgb-ink, 0,0,0),.06), inset 0 1px 0 0 rgba(var(--rgb-theme),1);
    border: 1px solid rgba(var(--rgb-diff),.06);
    align-items: center; text-align: center;
}
#preContactGate .verify-success code {
    font-family: var(--ff-mono); font-size: var(--fs-p3, 13px); color: var(--txt-heading);
    background: var(--surface-hover); padding: 10px 16px; border-radius: 12px;
    word-break: break-all; font-weight: 500;
}
#preContactGate .btn-secondary {
    background: var(--surface-3, var(--surface-hover)); color: var(--txt-heading);
    border-radius: var(--r-pill); padding: 14px 28px; font-size: var(--fs-p2, 14px);
    font-weight: 600; border: none; cursor: pointer; transition: all .3s ease; margin-top: var(--s-2);
}
#preContactGate .btn-secondary:hover { background: var(--surface-4, var(--border)); transform: translateY(-1px); }
#preContactGate .verify-footnote {
    display: flex; align-items: flex-start; gap: 12px;
    font-size: var(--fs-p3, 13px); color: var(--muted); line-height: 1.6;
    margin-top: var(--s-2); padding: 0 var(--s-2);
}
#preContactGate .verify-footnote i { font-size: 18px; flex-shrink: 0; margin-top: 1px; }

#preContactGate .scenario-switch {
    position: absolute; left: 50%; transform: translateX(-50%);
    bottom: calc(var(--proceed-bar-h, 120px) + var(--s-4));
    z-index: 3; display: inline-flex; align-items: center; gap: var(--s-2);
    background: rgba(var(--rgb-canvas, var(--rgb-theme)), 0.95); border-radius: var(--r-pill);
    padding: 8px 10px 8px 18px;
    box-shadow: 0 8px 24px rgba(var(--rgb-ink, 0,0,0), 0.1), inset 0 1px 0 0 rgba(var(--rgb-theme),1);
    border: 1px solid rgba(var(--rgb-diff), 0.08);
    font-size: var(--fs-p4, 12px); color: var(--muted); white-space: nowrap;
    backdrop-filter: blur(12px);
}
#preContactGate .scenario-switch__btn {
    background: var(--surface-hover); border: none; border-radius: 50%; width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center; color: var(--txt-heading);
    cursor: pointer; flex-shrink: 0; transition: all .3s ease;
}
#preContactGate .scenario-switch__btn:hover { background: var(--surface-3, var(--surface)); transform: scale(1.05); }
#preContactGate .scenario-switch__label { font-weight: 600; color: var(--txt-heading); min-width: 13ch; text-align: center; }

@media (max-width: 520px) {
    #preContactGate .proceed-bar.is-safe .proceed-bar__row {
        flex-flow: column nowrap; align-items: stretch; border-radius: 24px; padding: 16px;
    }
    #preContactGate .btn-accent { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
    #preContactGate .option-card,
    #preContactGate .option-detail,
    #preContactGate .chev,
    #preContactGate .proceed-bar { transition: none !important; }
    article[type=ticket].carousel-item,
    #ticketCarousel.grid-view article[type=ticket].carousel-item:not(.is-popup),
    article[type=ticket] .bottom .rt-cta,
    .filter-pill,
    .classificados-search-btn {
        transition-duration: .01ms !important;
    }
    article[type=ticket].carousel-item.is-pressing:not(.is-popup),
    #ticketCarousel.grid-view article[type=ticket].carousel-item.is-pressing:not(.is-closed):not(.is-popup) {
        transform: none !important;
    }
}

/* Thumb-zone Contato on phone — sticky feel at bottom of open ticket */
@media (max-width: 519px) {
    article[type=ticket].is-popup .bottom {
        position: sticky;
        bottom: 0;
        padding-bottom: max(14px, env(safe-area-inset-bottom, 0px));
        background: color-mix(in srgb, var(--black) 94%, transparent);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        z-index: 3;
    }
    article[type=ticket].is-popup .bottom .rt-cta {
        min-width: 118px;
        min-height: 48px;
    }
    .rt-status { padding: 7px 12px; }
    .rt-chip { padding: 7px 11px; }
}