:root {
    --vpt-gold: #D4AF37;
    --vpt-gold-light: #E5C75B;
    --vpt-gold-pale: #F3DC7A;
    --vpt-gold-dark: #8C6B13;
    --vpt-black: #050505;
    --vpt-card: #101010;
    --vpt-card-2: #121212;
    --vpt-white: #F5F5F5;
    --vpt-silver: #C0C0C0;
    --vpt-muted: #9B9B9B;
}

.vptchat,
.vptchat * {
    box-sizing: border-box;
}

.vptchat {
    width: 100%;
    max-width: 1320px;
    margin: 26px auto 54px;
    padding: 0 16px;
    color: var(--vpt-white);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.vptchat button,
.vptchat textarea {
    font: inherit;
}

.vptchat button {
    -webkit-tap-highlight-color: transparent;
}

.vptchat-shell {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 8%, rgba(212,175,55,.10), transparent 28%),
        radial-gradient(circle at 88% 92%, rgba(140,107,19,.08), transparent 30%),
        linear-gradient(145deg, #121212 0%, #090909 48%, #050505 100%);
    border: 1px solid rgba(212,175,55,.38);
    border-radius: 26px;
    box-shadow:
        0 34px 90px rgba(0,0,0,.78),
        0 0 34px rgba(212,175,55,.08);
}

.vptchat-shell::before {
    content: "";
    position: absolute;
    top: 0;
    left: 9%;
    right: 9%;
    height: 1px;
    z-index: 4;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(229,199,91,.78), rgba(212,175,55,.96), rgba(229,199,91,.78), transparent);
}

.vptchat-brandbar {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 76px;
    padding: 15px 22px;
    background: rgba(5,5,5,.78);
    border-bottom: 1px solid rgba(212,175,55,.18);
}

.vptchat-brandmark {
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(212,175,55,.62);
    border-radius: 12px;
    background: linear-gradient(145deg, #171717, #070707);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 0 18px rgba(212,175,55,.07);
}

.vptchat-brandmark span {
    color: var(--vpt-gold-light);
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    transform: scaleX(1.08);
}

.vptchat-brandcopy {
    min-width: 0;
}

.vptchat-brand {
    color: #fff;
    font-size: 16px;
    font-weight: 950;
    letter-spacing: 2.3px;
    line-height: 1.1;
}

.vptchat-subbrand {
    margin-top: 4px;
    color: var(--vpt-gold);
    font-size: 8.5px;
    font-weight: 900;
    letter-spacing: 1.8px;
    line-height: 1.1;
}

.vptchat-live {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #d8d8d8;
    font-size: 8.5px;
    font-weight: 900;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.vptchat-live i,
.vptchat-room-meta i {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #72ff9b;
    box-shadow: 0 0 9px rgba(114,255,155,.65);
}

.vptchat-trustbar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 10px;
    padding: 10px 18px;
    text-align: center;
    color: #aaa;
    background: rgba(12,12,12,.84);
    border-bottom: 1px solid rgba(255,255,255,.055);
    font-size: 10px;
    line-height: 1.4;
}

.vptchat-trustbar strong {
    color: var(--vpt-gold-light);
    font-size: 9px;
    letter-spacing: 1.05px;
}

.vptchat-trust-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--vpt-gold);
    box-shadow: 0 0 10px rgba(212,175,55,.35);
}

.vptchat-picker {
    padding: 42px 34px 38px;
}

.vptchat-picker-head {
    max-width: 780px;
    margin: 0 auto 30px;
    text-align: center;
}

.vptchat-kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--vpt-gold);
    font-size: 9.5px;
    font-weight: 900;
    letter-spacing: 2.15px;
    text-transform: uppercase;
}

.vptchat-picker-head h2 {
    margin: 0 0 13px !important;
    color: #fff !important;
    font-size: clamp(34px, 4.1vw, 54px) !important;
    font-weight: 950 !important;
    line-height: 1.02 !important;
    letter-spacing: -.7px !important;
    text-transform: none !important;
}

.vptchat-picker-head p {
    max-width: 690px;
    margin: 0 auto !important;
    color: #b9b9b9 !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
}

.vptchat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
}

.vptchat-choice {
    position: relative;
    overflow: hidden;
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 15px;
    align-items: center;
    min-width: 0;
    min-height: 154px;
    padding: 18px !important;
    text-align: left !important;
    color: #fff !important;
    background: linear-gradient(145deg, rgba(18,18,18,.98), rgba(7,7,7,.99)) !important;
    border: 1px solid rgba(212,175,55,.25) !important;
    border-radius: 17px !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.42) !important;
    cursor: pointer;
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease !important;
}

.vptchat-choice::before {
    content: "";
    position: absolute;
    top: 0;
    left: 14%;
    right: 14%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(229,199,91,.55), transparent);
}

.vptchat-choice:hover,
.vptchat-choice:focus-visible {
    transform: translateY(-3px) !important;
    border-color: rgba(229,199,91,.72) !important;
    box-shadow: 0 21px 48px rgba(0,0,0,.55), 0 0 24px rgba(212,175,55,.09) !important;
    outline: none !important;
}

.vptchat-choice:focus-visible {
    outline: 2px solid var(--vpt-gold-light) !important;
    outline-offset: 3px !important;
}

.vptchat-choice.is-surprise {
    grid-column: span 2;
    background:
        radial-gradient(circle at 12% 22%, rgba(212,175,55,.15), transparent 30%),
        linear-gradient(145deg, #16130b, #080808 72%) !important;
    border-color: rgba(212,175,55,.55) !important;
}

.vptchat-choice-photo {
    position: relative;
    width: 66px;
    height: 66px;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(229,199,91,.72);
    border-radius: 50%;
    background: #090909;
    box-shadow:
        0 8px 22px rgba(0,0,0,.44),
        0 0 0 2px rgba(212,175,55,.08),
        0 0 18px rgba(212,175,55,.12);
}

.vptchat-choice-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}

.vptchat-choice-photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 34%;
    transform: scale(1.02);
    transition: transform .32s ease, filter .32s ease;
}

.vptchat-choice:hover .vptchat-choice-photo img,
.vptchat-choice:focus-visible .vptchat-choice-photo img {
    transform: scale(1.07);
    filter: brightness(1.04) saturate(1.03);
}

.vptchat-choice-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.vptchat-choice-copy strong {
    color: #fff;
    font-size: 17px;
    font-weight: 950;
    line-height: 1.15;
}

.vptchat-choice-copy small {
    margin-top: 4px;
    color: var(--vpt-gold-light);
    font-size: 8px;
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.vptchat-choice-copy em {
    margin-top: 8px;
    color: #a9a9a9;
    font-size: 11.5px;
    font-style: normal;
    line-height: 1.5;
}

.vptchat-choice-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 9px;
    min-height: 20px;
    padding: 4px 8px;
    color: var(--vpt-gold-pale);
    background: rgba(212,175,55,.075);
    border: 1px solid rgba(212,175,55,.22);
    border-radius: 999px;
    font-size: 7.8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .8px;
    text-transform: uppercase;
}

.vptchat-choice-cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
    color: #f2f2f2;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .85px;
    text-transform: uppercase;
}

.vptchat-choice-cta span {
    color: var(--vpt-gold-light);
    font-size: 14px;
    transition: transform .2s ease;
}

.vptchat-choice:hover .vptchat-choice-cta span {
    transform: translateX(3px);
}

.vptchat-room {
    min-height: 690px;
    background: #070707;
}

.vptchat-room-head {
    display: grid;
    grid-template-columns: 38px 48px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-height: 76px;
    padding: 12px 17px;
    background: rgba(10,10,10,.98);
    border-bottom: 1px solid rgba(212,175,55,.18);
}

.vptchat-back {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    color: #ddd !important;
    background: #101010 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
}

.vptchat-back svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vptchat-back:hover {
    color: var(--vpt-gold-light) !important;
    border-color: rgba(212,175,55,.42) !important;
}

.vptchat-room-avatar,
.vptchat-msg-avatar {
    position: relative;
    display: block;
    overflow: hidden;
    flex: 0 0 auto;
    background: #090909;
    border: 1px solid rgba(229,199,91,.56);
    border-radius: 50%;
    box-shadow:
        0 0 0 1px rgba(255,255,255,.05),
        0 0 14px rgba(212,175,55,.10);
}

.vptchat-room-avatar {
    width: 46px;
    height: 46px;
}

.vptchat-msg-avatar {
    width: 32px;
    height: 32px;
    margin-top: 2px;
}

.vptchat-room-avatar img,
.vptchat-msg-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 34%;
}

.vptchat-room-person {
    min-width: 0;
}

.vptchat-room-person strong {
    display: block;
    color: #fff;
    font-size: 15px;
    font-weight: 950;
    line-height: 1.15;
}

.vptchat-room-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    color: #9f9f9f;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .55px;
    text-transform: uppercase;
}

.vptchat-room-meta i {
    width: 5px;
    height: 5px;
    flex-basis: 5px;
}

.vptchat-room-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.vptchat-new-match,
.vptchat-language-toggle {
    min-height: 36px !important;
    padding: 8px 12px !important;
    color: #e8e8e8 !important;
    background: #101010 !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    letter-spacing: .85px !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
}

.vptchat-new-match:hover,
.vptchat-language-toggle:hover,
.vptchat-language.is-open .vptchat-language-toggle {
    color: #0a0a0a !important;
    background: var(--vpt-gold) !important;
    border-color: var(--vpt-gold) !important;
}

.vptchat-language {
    position: relative;
}

.vptchat-language-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.vptchat-language-chevron {
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}

.vptchat-language-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 80;
    width: 176px;
    overflow: hidden;
    padding: 6px;
    background: #090909;
    border: 1px solid rgba(212,175,55,.32);
    border-radius: 13px;
    box-shadow: 0 18px 44px rgba(0,0,0,.72);
}

.vptchat-language-menu[hidden] {
    display: none !important;
}

.vptchat-language-option {
    width: 100% !important;
    min-height: 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    color: #fff !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .5px !important;
    text-align: left !important;
    text-transform: uppercase !important;
}

.vptchat-language-option:hover {
    color: var(--vpt-gold-light) !important;
    background: rgba(212,175,55,.08) !important;
}

.vptchat-language-option.is-selected {
    color: #090909 !important;
    background: var(--vpt-gold) !important;
}

.vptchat-match-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 38px;
    padding: 8px 15px;
    color: #a7a7a7;
    background: linear-gradient(90deg, rgba(212,175,55,.045), rgba(255,255,255,.012), rgba(212,175,55,.045));
    border-bottom: 1px solid rgba(255,255,255,.05);
    font-size: 9px;
    line-height: 1.3;
}

.vptchat-match-label {
    color: var(--vpt-gold-light);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.1px;
}

.vptchat-match-detail {
    color: #d2d2d2;
    font-weight: 700;
}

.vptchat-free-status {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 30px;
    padding: 6px 14px;
    color: #9f9f9f;
    background: rgba(212,175,55,.028);
    border-bottom: 1px solid rgba(255,255,255,.035);
    font-size: 8.5px;
    line-height: 1.3;
}

.vptchat-free-status strong {
    color: #080808;
    background: linear-gradient(135deg, #f0d56e, #d4af37);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 7.2px;
    font-weight: 950;
    letter-spacing: .8px;
    line-height: 1;
    text-transform: uppercase;
}

.vptchat-free-usage {
    color: #b9b9b9;
    font-weight: 700;
}

.vptchat-messages {
    height: 500px;
    overflow-y: auto;
    padding: 26px 24px 18px;
    scrollbar-width: thin;
    scrollbar-color: rgba(212,175,55,.32) transparent;
}

.vptchat-message {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0 0 14px;
}

.vptchat-message.is-user {
    justify-content: flex-end;
}

.vptchat-bubble {
    max-width: min(76%, 720px);
    padding: 12px 14px;
    border-radius: 15px;
    font-size: 13px;
    line-height: 1.55;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.vptchat-message.is-ai .vptchat-bubble {
    color: #ededed;
    background: #101010;
    border: 1px solid rgba(212,175,55,.17);
    border-top-left-radius: 5px;
}

.vptchat-message.is-user .vptchat-bubble {
    color: #090909;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold));
    border: 1px solid rgba(255,255,255,.14);
    border-top-right-radius: 5px;
    font-weight: 650;
}

.vptchat-typing {
    min-height: 28px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 24px 7px 63px;
    color: #858585;
    font-size: 9px;
}

.vptchat-typing[hidden] {
    display: none !important;
}

.vptchat-typing span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--vpt-gold);
    animation: vptchat-dot 1.1s infinite ease-in-out;
}

.vptchat-typing span:nth-child(2) { animation-delay: .13s; }
.vptchat-typing span:nth-child(3) { animation-delay: .26s; }
.vptchat-typing em {
    margin-left: 5px;
    font-style: normal;
}

@keyframes vptchat-dot {
    0%, 60%, 100% { opacity: .25; transform: translateY(0); }
    30% { opacity: 1; transform: translateY(-3px); }
}

.vptchat-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
    align-items: end;
    padding: 12px 17px;
    background: rgba(5,5,5,.90);
    border-top: 1px solid rgba(255,255,255,.055);
}

.vptchat-input {
    width: 100% !important;
    min-height: 48px !important;
    max-height: 130px !important;
    resize: none !important;
    overflow-y: hidden;
    padding: 13px 15px !important;
    color: #fff !important;
    background: #0d0d0d !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    border-radius: 14px !important;
    outline: none !important;
    box-shadow: none !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
}

.vptchat-input:focus {
    border-color: rgba(212,175,55,.55) !important;
    box-shadow: 0 0 0 2px rgba(212,175,55,.06) !important;
}

.vptchat-send {
    min-width: 112px !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 18px !important;
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold), var(--vpt-gold-dark)) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 25px rgba(0,0,0,.28), 0 0 16px rgba(212,175,55,.08) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;
}

.vptchat-send:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

.vptchat-send:disabled {
    opacity: .55 !important;
    cursor: wait !important;
    transform: none !important;
}

.vptchat-footnote {
    padding: 0 17px 15px;
    color: #757575;
    background: rgba(5,5,5,.90);
    font-size: 8.8px;
    line-height: 1.45;
    text-align: center;
}

.vptchat-age {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(0,0,0,.90);
    backdrop-filter: blur(10px);
}

.vptchat-age[hidden] {
    display: none !important;
}

.vptchat-age-card {
    width: min(100%, 470px);
    padding: 34px 30px 30px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0%, rgba(212,175,55,.12), transparent 35%),
        linear-gradient(145deg, #141414, #060606);
    border: 1px solid rgba(212,175,55,.52);
    border-radius: 22px;
    box-shadow: 0 30px 90px rgba(0,0,0,.78), 0 0 30px rgba(212,175,55,.08);
}

.vptchat-age-kicker {
    color: var(--vpt-gold);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.vptchat-age-card h3 {
    margin: 11px 0 12px !important;
    color: #fff !important;
    font-size: 28px !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
}

.vptchat-age-card p {
    margin: 0 auto 23px !important;
    color: #b7b7b7 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.vptchat-age-actions {
    display: grid;
    grid-template-columns: 1fr 120px;
    gap: 9px;
}

.vptchat-age-enter,
.vptchat-age-exit {
    min-height: 46px !important;
    padding: 11px 15px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 950 !important;
    letter-spacing: .65px !important;
    text-transform: uppercase !important;
}

.vptchat-age-enter {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold)) !important;
    border: 1px solid var(--vpt-gold) !important;
}

.vptchat-age-exit {
    color: #eee !important;
    background: #101010 !important;
    border: 1px solid rgba(255,255,255,.13) !important;
}

@media (max-width: 980px) {
    .vptchat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vptchat-choice.is-surprise {
        grid-column: span 2;
    }
}

@media (max-width: 760px) {
    .vptchat {
        margin: 16px auto 34px;
        padding: 0 10px;
    }

    .vptchat-shell {
        border-radius: 19px;
    }

    .vptchat-brandbar {
        min-height: 66px;
        padding: 12px 14px;
    }

    .vptchat-brandmark {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
        border-radius: 10px;
    }

    .vptchat-brand {
        font-size: 14px;
        letter-spacing: 1.9px;
    }

    .vptchat-subbrand {
        font-size: 7.4px;
    }

    .vptchat-live {
        font-size: 7.2px;
    }

    .vptchat-picker {
        padding: 31px 16px 24px;
    }

    .vptchat-picker-head {
        margin-bottom: 23px;
    }

    .vptchat-picker-head h2 {
        font-size: clamp(31px, 9vw, 42px) !important;
    }

    .vptchat-picker-head p {
        font-size: 13px !important;
    }

    .vptchat-grid {
        gap: 9px;
    }

    .vptchat-choice {
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 11px;
        min-height: 135px;
        padding: 14px !important;
        border-radius: 14px !important;
    }

    .vptchat-choice-photo {
        width: 47px;
        height: 47px;
        font-size: 11px;
    }

    .vptchat-choice-copy strong {
        font-size: 15px;
    }

    .vptchat-choice-copy em {
        font-size: 10.6px;
    }

    .vptchat-room {
        min-height: 620px;
    }

    .vptchat-room-head {
        grid-template-columns: 34px 40px minmax(0, 1fr);
        min-height: 70px;
        padding: 10px 12px;
    }

    .vptchat-room-controls {
        grid-column: 1 / -1;
        justify-content: flex-end;
        padding-top: 3px;
    }

    .vptchat-room-avatar {
        width: 39px;
        height: 39px;
    }

    .vptchat-messages {
        height: 430px;
        padding: 20px 13px 14px;
    }

    .vptchat-bubble {
        max-width: 84%;
        font-size: 12.5px;
    }

    .vptchat-form {
        grid-template-columns: minmax(0, 1fr) 88px;
        padding: 10px 11px;
    }

    .vptchat-input {
        font-size: 16px !important;
    }

    .vptchat-send {
        min-width: 88px !important;
        padding: 11px 10px !important;
    }
}

@media (max-width: 520px) {
    .vptchat-grid {
        grid-template-columns: 1fr;
    }

    .vptchat-choice.is-surprise {
        grid-column: span 1;
    }

    .vptchat-choice {
        min-height: 124px;
    }

    .vptchat-trustbar span:last-child {
        width: 100%;
    }

    .vptchat-room-person strong {
        font-size: 14px;
    }

    .vptchat-room-meta {
        font-size: 7.1px;
    }

    .vptchat-match-strip {
        flex-direction: column;
        gap: 2px;
    }

    .vptchat-free-status {
        flex-wrap: wrap;
        gap: 6px;
        padding: 7px 10px;
        text-align: center;
    }

    .vptchat-age-actions {
        grid-template-columns: 1fr;
    }

    .vptchat-age-exit {
        min-height: 42px !important;
    }
}

/* =========================================================
   v1.0.5 — RETROTUBE / THEME COLOR ISOLATION
   ---------------------------------------------------------
   The picker cards and back control are intentionally NOT
   native <button> elements anymore. This prevents global
   RetroTube button:hover styles from painting them solid gold.
   The rules below also lock every remaining plugin button to
   the intended VoluptAI black / gold visual system.
   ========================================================= */

/* Custom role-buttons: reset theme inheritance completely. */
body .vptchat .vptchat-choice,
body .vptchat .vptchat-choice:hover,
body .vptchat .vptchat-choice:focus,
body .vptchat .vptchat-choice:focus-visible,
body .vptchat .vptchat-choice:active {
    color: #ffffff !important;
    background-color: #090909 !important;
    background-image: linear-gradient(145deg, rgba(18,18,18,.98), rgba(7,7,7,.99)) !important;
    border: 1px solid rgba(212,175,55,.25) !important;
    text-decoration: none !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
}

body .vptchat .vptchat-choice:hover,
body .vptchat .vptchat-choice:focus-visible {
    color: #ffffff !important;
    background-color: #090909 !important;
    background-image: linear-gradient(145deg, rgba(20,20,20,.99), rgba(8,8,8,1)) !important;
    border-color: rgba(229,199,91,.72) !important;
    box-shadow: 0 21px 48px rgba(0,0,0,.55), 0 0 24px rgba(212,175,55,.09) !important;
    transform: translateY(-3px) !important;
}

body .vptchat .vptchat-choice:active {
    background-color: #070707 !important;
    background-image: linear-gradient(145deg, rgba(15,15,15,.99), rgba(5,5,5,1)) !important;
    transform: translateY(-1px) !important;
}

body .vptchat .vptchat-choice.is-surprise,
body .vptchat .vptchat-choice.is-surprise:hover,
body .vptchat .vptchat-choice.is-surprise:focus,
body .vptchat .vptchat-choice.is-surprise:focus-visible,
body .vptchat .vptchat-choice.is-surprise:active {
    background-color: #0b0905 !important;
    background-image:
        radial-gradient(circle at 12% 22%, rgba(212,175,55,.15), transparent 30%),
        linear-gradient(145deg, #16130b, #080808 72%) !important;
    border-color: rgba(212,175,55,.55) !important;
}

body .vptchat .vptchat-choice.is-surprise:hover,
body .vptchat .vptchat-choice.is-surprise:focus-visible {
    border-color: rgba(229,199,91,.82) !important;
}

/* Lock all text inside cards so theme hover rules cannot recolor it. */
body .vptchat .vptchat-choice .vptchat-choice-copy strong,
body .vptchat .vptchat-choice:hover .vptchat-choice-copy strong,
body .vptchat .vptchat-choice:focus-visible .vptchat-choice-copy strong {
    color: #ffffff !important;
}

body .vptchat .vptchat-choice .vptchat-choice-copy small,
body .vptchat .vptchat-choice:hover .vptchat-choice-copy small,
body .vptchat .vptchat-choice:focus-visible .vptchat-choice-copy small,
body .vptchat .vptchat-choice .vptchat-choice-cta span,
body .vptchat .vptchat-choice:hover .vptchat-choice-cta span,
body .vptchat .vptchat-choice:focus-visible .vptchat-choice-cta span {
    color: var(--vpt-gold-light) !important;
}

body .vptchat .vptchat-choice .vptchat-choice-copy em,
body .vptchat .vptchat-choice:hover .vptchat-choice-copy em,
body .vptchat .vptchat-choice:focus-visible .vptchat-choice-copy em {
    color: #a9a9a9 !important;
}

body .vptchat .vptchat-choice .vptchat-choice-cta,
body .vptchat .vptchat-choice:hover .vptchat-choice-cta,
body .vptchat .vptchat-choice:focus-visible .vptchat-choice-cta {
    color: #f2f2f2 !important;
}

/* Back control: no native button = no RetroTube gold disc. */
body .vptchat .vptchat-back,
body .vptchat .vptchat-back:hover,
body .vptchat .vptchat-back:focus,
body .vptchat .vptchat-back:focus-visible,
body .vptchat .vptchat-back:active {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #dddddd !important;
    background: #101010 !important;
    background-color: #101010 !important;
    background-image: none !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
    cursor: pointer !important;
    text-decoration: none !important;
    -webkit-tap-highlight-color: transparent !important;
}

body .vptchat .vptchat-back:hover,
body .vptchat .vptchat-back:focus-visible {
    color: var(--vpt-gold-light) !important;
    background: #101010 !important;
    border-color: rgba(212,175,55,.58) !important;
    box-shadow: 0 0 0 1px rgba(212,175,55,.08), 0 0 14px rgba(212,175,55,.10) !important;
}

body .vptchat .vptchat-back:active {
    color: var(--vpt-gold-pale) !important;
    background: #0c0c0c !important;
    border-color: rgba(229,199,91,.66) !important;
}

body .vptchat .vptchat-back::before,
body .vptchat .vptchat-back::after {
    content: none !important;
    display: none !important;
}

body .vptchat .vptchat-back svg,
body .vptchat .vptchat-back:hover svg,
body .vptchat .vptchat-back:focus-visible svg,
body .vptchat .vptchat-back:active svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    fill: none !important;
    stroke: currentColor !important;
    pointer-events: none !important;
}

body .vptchat .vptchat-back svg path,
body .vptchat .vptchat-back:hover svg path,
body .vptchat .vptchat-back:focus-visible svg path,
body .vptchat .vptchat-back:active svg path {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* Remaining native plugin buttons: explicitly own every state. */
body .vptchat button.vptchat-new-match,
body .vptchat button.vptchat-language-toggle {
    color: #e8e8e8 !important;
    background: #101010 !important;
    background-color: #101010 !important;
    background-image: none !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
}

body .vptchat button.vptchat-new-match:hover,
body .vptchat button.vptchat-new-match:focus-visible,
body .vptchat button.vptchat-language-toggle:hover,
body .vptchat button.vptchat-language-toggle:focus-visible,
body .vptchat .vptchat-language.is-open button.vptchat-language-toggle {
    color: #090909 !important;
    background: var(--vpt-gold) !important;
    background-color: var(--vpt-gold) !important;
    background-image: none !important;
    border-color: var(--vpt-gold) !important;
}

body .vptchat button.vptchat-language-option,
body .vptchat button.vptchat-language-option:hover,
body .vptchat button.vptchat-language-option:focus-visible {
    color: #ffffff !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

body .vptchat button.vptchat-language-option:hover,
body .vptchat button.vptchat-language-option:focus-visible {
    color: var(--vpt-gold-light) !important;
    background: rgba(212,175,55,.08) !important;
    background-color: rgba(212,175,55,.08) !important;
}

body .vptchat button.vptchat-language-option.is-selected,
body .vptchat button.vptchat-language-option.is-selected:hover,
body .vptchat button.vptchat-language-option.is-selected:focus-visible {
    color: #090909 !important;
    background: var(--vpt-gold) !important;
    background-color: var(--vpt-gold) !important;
}

body .vptchat button.vptchat-send,
body .vptchat button.vptchat-send:hover,
body .vptchat button.vptchat-send:focus-visible,
body .vptchat button.vptchat-send:active {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold), var(--vpt-gold-dark)) !important;
    background-color: var(--vpt-gold) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    text-shadow: none !important;
}

body .vptchat button.vptchat-send:hover,
body .vptchat button.vptchat-send:focus-visible {
    filter: brightness(1.06) !important;
    transform: translateY(-1px) !important;
}

body .vptchat button.vptchat-age-enter,
body .vptchat button.vptchat-age-enter:hover,
body .vptchat button.vptchat-age-enter:focus-visible {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold)) !important;
    background-color: var(--vpt-gold) !important;
    border: 1px solid var(--vpt-gold) !important;
    text-shadow: none !important;
}

body .vptchat button.vptchat-age-exit,
body .vptchat button.vptchat-age-exit:hover,
body .vptchat button.vptchat-age-exit:focus-visible {
    color: #eeeeee !important;
    background: #101010 !important;
    background-color: #101010 !important;
    background-image: none !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    text-shadow: none !important;
}

/* Kill theme-generated decorative layers on plugin-native buttons. */
body .vptchat button.vptchat-new-match::before,
body .vptchat button.vptchat-new-match::after,
body .vptchat button.vptchat-language-toggle::before,
body .vptchat button.vptchat-language-toggle::after,
body .vptchat button.vptchat-language-option::before,
body .vptchat button.vptchat-language-option::after,
body .vptchat button.vptchat-send::before,
body .vptchat button.vptchat-send::after,
body .vptchat button.vptchat-age-enter::before,
body .vptchat button.vptchat-age-enter::after,
body .vptchat button.vptchat-age-exit::before,
body .vptchat button.vptchat-age-exit::after {
    content: none !important;
    display: none !important;
}


/* v1.2.0 — 100 companion free roster + usage guard */
@media (max-width: 760px) {
    .vptchat-choice-count {
        font-size: 7.2px;
        padding: 4px 7px;
    }
}


/* =========================================================
   v2.0.0 — HUMAN EXPERIENCE / DISCOVERY / SAVED MATCHES
   ========================================================= */

.vptchat-discovery-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 9px;
    margin-top: 18px;
}

.vptchat-roster-toggle,
.vptchat-saved-toggle,
.vptchat-roster-all,
.vptchat-roster-saved-only,
.vptchat-roster-close,
.vptchat-save-match,
.vptchat-copy-link,
.vptchat-stop {
    appearance: none;
    min-height: 36px;
    padding: 8px 13px;
    color: #e8e8e8;
    background: #101010;
    border: 1px solid rgba(212,175,55,.22);
    border-radius: 999px;
    box-shadow: none;
    font-size: 8px;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: .75px;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

.vptchat-roster-toggle:hover,
.vptchat-saved-toggle:hover,
.vptchat-roster-all:hover,
.vptchat-roster-saved-only:hover,
.vptchat-save-match:hover,
.vptchat-copy-link:hover,
.vptchat-roster-all.is-active,
.vptchat-roster-saved-only.is-active,
.vptchat-save-match.is-saved {
    color: #090909;
    background: var(--vpt-gold);
    border-color: var(--vpt-gold);
    transform: translateY(-1px);
}

.vptchat-saved-count {
    display: inline-grid;
    place-items: center;
    min-width: 18px;
    min-height: 18px;
    margin-left: 4px;
    padding: 0 5px;
    color: #090909;
    background: var(--vpt-gold-pale);
    border-radius: 999px;
    font-size: 7px;
}

.vptchat-roster-panel {
    margin: 0 0 24px;
    padding: 16px;
    background:
        radial-gradient(circle at 50% 0%, rgba(212,175,55,.07), transparent 32%),
        #080808;
    border: 1px solid rgba(212,175,55,.20);
    border-radius: 18px;
}

.vptchat-roster-panel[hidden] {
    display: none !important;
}

.vptchat-roster-tools {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto 38px;
    gap: 8px;
    align-items: end;
}

.vptchat-roster-search-wrap {
    min-width: 0;
}

.vptchat-roster-search-wrap > span {
    display: block;
    margin: 0 0 6px;
    color: #9f9f9f;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .8px;
    text-transform: uppercase;
}

.vptchat-roster-search {
    width: 100% !important;
    min-height: 40px !important;
    padding: 9px 12px !important;
    color: #fff !important;
    background: #0e0e0e !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}

.vptchat-roster-search:focus {
    border-color: rgba(212,175,55,.58) !important;
    outline: none !important;
}

.vptchat-roster-close {
    width: 38px;
    min-width: 38px;
    padding: 0;
    font-size: 18px;
}

.vptchat-roster-summary {
    margin: 10px 0;
    color: #777;
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: .4px;
}

.vptchat-roster-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 8px;
    max-height: 450px;
    overflow-y: auto;
    padding-right: 3px;
    scrollbar-width: thin;
    scrollbar-color: rgba(212,175,55,.30) transparent;
}

.vptchat-roster-card {
    appearance: none;
    min-width: 0;
    display: grid;
    grid-template-columns: 45px minmax(0,1fr) 18px;
    gap: 9px;
    align-items: center;
    padding: 9px;
    text-align: left;
    color: #fff;
    background: #0f0f0f;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.vptchat-roster-card:hover,
.vptchat-roster-card:focus-visible {
    background: #13120f;
    border-color: rgba(212,175,55,.48);
    transform: translateY(-1px);
    outline: none;
}

.vptchat-roster-card.is-saved {
    border-color: rgba(212,175,55,.34);
}

.vptchat-roster-card img {
    width: 45px;
    height: 45px;
    display: block;
    object-fit: cover;
    object-position: center 34%;
    border: 1px solid rgba(212,175,55,.42);
    border-radius: 50%;
}

.vptchat-roster-card-copy {
    min-width: 0;
}

.vptchat-roster-card-copy strong,
.vptchat-roster-card-copy span {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vptchat-roster-card-copy strong {
    color: #f4f4f4;
    font-size: 11px;
    font-weight: 900;
}

.vptchat-roster-card-copy span {
    margin-top: 3px;
    color: #8f8f8f;
    font-size: 8px;
}

.vptchat-roster-card em {
    color: var(--vpt-gold);
    font-size: 12px;
    font-style: normal;
    text-align: center;
}

.vptchat-message-stack {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.vptchat-message.is-user .vptchat-message-stack {
    align-items: flex-end;
}

.vptchat-message-actions {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 20px;
    padding-left: 3px;
    opacity: .56;
    transition: opacity .18s ease;
}

.vptchat-message:hover .vptchat-message-actions,
.vptchat-message:focus-within .vptchat-message-actions {
    opacity: 1;
}

.vptchat-message-action {
    appearance: none;
    min-height: 22px;
    margin: 0;
    padding: 3px 7px;
    color: #8c8679;
    background: transparent;
    border: 1px solid rgba(255,255,255,.055);
    border-radius: 999px;
    font-size: 6.8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .55px;
    text-transform: uppercase;
    cursor: pointer;
}

.vptchat-message-action:hover,
.vptchat-message-action:focus-visible {
    color: var(--vpt-gold-pale);
    border-color: rgba(212,175,55,.30);
    background: rgba(212,175,55,.055);
    outline: none;
}

.vptchat-system-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: fit-content;
    max-width: calc(100% - 24px);
    margin: 3px auto 14px;
    padding: 7px 10px;
    color: #8e8a82;
    background: rgba(255,255,255,.018);
    border: 1px solid rgba(255,255,255,.055);
    border-radius: 999px;
    font-size: 8px;
    line-height: 1.35;
    text-align: center;
}

.vptchat-system-note button {
    appearance: none;
    margin: 0;
    padding: 4px 8px;
    color: var(--vpt-gold-pale);
    background: rgba(212,175,55,.06);
    border: 1px solid rgba(212,175,55,.25);
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .5px;
    text-transform: uppercase;
    cursor: pointer;
}

.vptchat-stop {
    min-width: 72px !important;
    min-height: 48px !important;
    border-radius: 14px !important;
}

.vptchat-stop[hidden] {
    display: none !important;
}

.vptchat-form:has(.vptchat-stop:not([hidden])) {
    grid-template-columns: minmax(0,1fr) auto;
}

.vptchat-room-controls {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.vptchat-save-match,
.vptchat-copy-link {
    min-height: 36px !important;
}

@media (max-width: 1050px) {
    .vptchat-roster-grid {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .vptchat-roster-tools {
        grid-template-columns: 1fr 1fr 38px;
    }

    .vptchat-roster-search-wrap {
        grid-column: 1 / -1;
    }

    .vptchat-roster-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
        max-height: 410px;
    }

    .vptchat-message-actions {
        opacity: .82;
    }

    .vptchat-save-match,
    .vptchat-copy-link,
    .vptchat-new-match,
    .vptchat-language-toggle {
        min-height: 34px !important;
        padding: 7px 10px !important;
    }
}

@media (max-width: 520px) {
    .vptchat-roster-panel {
        padding: 11px;
    }

    .vptchat-roster-grid {
        grid-template-columns: 1fr;
    }

    .vptchat-roster-card {
        grid-template-columns: 42px minmax(0,1fr) 18px;
    }

    .vptchat-roster-card img {
        width: 42px;
        height: 42px;
    }

    .vptchat-room-controls {
        justify-content: flex-start;
    }

    .vptchat-system-note {
        border-radius: 12px;
        flex-wrap: wrap;
    }
}


/* =========================================================
   v2.1.0 — RETROTUBE HARD ISOLATION + PREMIUM CHAT POLISH
   Fixes theme button bleed visible in Browse All / message actions.
   ========================================================= */

/* Browse All: keep profiles dark, never solid theme-gold. */
body .vptchat button.vptchat-roster-card,
body .vptchat button.vptchat-roster-card:hover,
body .vptchat button.vptchat-roster-card:focus,
body .vptchat button.vptchat-roster-card:focus-visible,
body .vptchat button.vptchat-roster-card:active {
    color: #f4f4f4 !important;
    background-color: #0e0e0e !important;
    background-image: linear-gradient(145deg, #121212, #090909) !important;
    border: 1px solid rgba(212,175,55,.16) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
}

body .vptchat button.vptchat-roster-card:hover,
body .vptchat button.vptchat-roster-card:focus-visible {
    background-color: #12110d !important;
    background-image: linear-gradient(145deg, #17150d, #0a0a09) !important;
    border-color: rgba(229,199,91,.62) !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.32), 0 0 18px rgba(212,175,55,.055) !important;
    transform: translateY(-1px) !important;
}

body .vptchat button.vptchat-roster-card.is-saved {
    border-color: rgba(229,199,91,.52) !important;
    background-image: linear-gradient(145deg, rgba(212,175,55,.095), #0b0b0a) !important;
}

body .vptchat .vptchat-roster-card-copy strong {
    color: #f6f6f6 !important;
}

body .vptchat .vptchat-roster-card-copy span {
    color: #9c978b !important;
}

body .vptchat .vptchat-roster-card em {
    color: var(--vpt-gold-light) !important;
}

/* Search filter controls: secondary UI stays dark. */
body .vptchat button.vptchat-roster-all,
body .vptchat button.vptchat-roster-saved-only,
body .vptchat button.vptchat-roster-close {
    color: #cfc8b8 !important;
    background: #101010 !important;
    border: 1px solid rgba(212,175,55,.24) !important;
    box-shadow: none !important;
}

body .vptchat button.vptchat-roster-all:hover,
body .vptchat button.vptchat-roster-saved-only:hover,
body .vptchat button.vptchat-roster-close:hover,
body .vptchat button.vptchat-roster-all.is-active,
body .vptchat button.vptchat-roster-saved-only.is-active {
    color: var(--vpt-gold-pale) !important;
    background: #15130d !important;
    border-color: rgba(229,199,91,.58) !important;
    transform: translateY(-1px) !important;
}

/* Browse All remains the main discovery CTA; Saved is secondary. */
body .vptchat button.vptchat-roster-toggle {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold)) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
}

body .vptchat button.vptchat-saved-toggle {
    color: #d7d1c2 !important;
    background: #101010 !important;
    border: 1px solid rgba(212,175,55,.30) !important;
    box-shadow: none !important;
}

/* Save/Copy are useful utilities, not primary CTAs. */
body .vptchat button.vptchat-save-match,
body .vptchat button.vptchat-copy-link {
    color: #d8d3c8 !important;
    background: #0d0d0d !important;
    border: 1px solid rgba(212,175,55,.25) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

body .vptchat button.vptchat-save-match:hover,
body .vptchat button.vptchat-copy-link:hover,
body .vptchat button.vptchat-save-match:focus-visible,
body .vptchat button.vptchat-copy-link:focus-visible {
    color: var(--vpt-gold-pale) !important;
    background: #15130d !important;
    border-color: rgba(229,199,91,.58) !important;
}

body .vptchat button.vptchat-save-match.is-saved {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold)) !important;
    border-color: var(--vpt-gold) !important;
}

/* Copy / Regenerate must never inherit RetroTube's solid-gold button. */
body .vptchat button.vptchat-message-action,
body .vptchat button.vptchat-message-action:hover,
body .vptchat button.vptchat-message-action:focus,
body .vptchat button.vptchat-message-action:focus-visible,
body .vptchat button.vptchat-message-action:active {
    min-height: 22px !important;
    padding: 3px 7px !important;
    color: #8f8a80 !important;
    background: transparent !important;
    background-image: none !important;
    border: 1px solid rgba(255,255,255,.065) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transform: none !important;
    font-size: 6.8px !important;
}

body .vptchat button.vptchat-message-action:hover,
body .vptchat button.vptchat-message-action:focus-visible {
    color: var(--vpt-gold-pale) !important;
    background: rgba(212,175,55,.055) !important;
    border-color: rgba(212,175,55,.28) !important;
}

/* User message: premium dark-gold, less visually aggressive than solid yellow. */
body .vptchat .vptchat-message.is-user .vptchat-bubble {
    color: #f8f4e9 !important;
    background:
        radial-gradient(circle at 85% 15%, rgba(229,199,91,.10), transparent 42%),
        linear-gradient(145deg, #29220e, #171306) !important;
    border: 1px solid rgba(229,199,91,.48) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.18) !important;
    font-weight: 600 !important;
}

/* Keep Send as the only strong gold action in the composer. */
body .vptchat button.vptchat-send,
body .vptchat button.vptchat-send:hover,
body .vptchat button.vptchat-send:focus-visible {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold), var(--vpt-gold-dark)) !important;
    border-color: rgba(255,255,255,.15) !important;
}

/* New Match / language stay quiet so the conversation remains the focus. */
body .vptchat button.vptchat-new-match,
body .vptchat button.vptchat-language-toggle {
    color: #d8d8d8 !important;
    background: #0d0d0d !important;
    border-color: rgba(255,255,255,.12) !important;
    box-shadow: none !important;
}

body .vptchat button.vptchat-new-match:hover,
body .vptchat button.vptchat-language-toggle:hover {
    color: var(--vpt-gold-pale) !important;
    border-color: rgba(212,175,55,.42) !important;
    background: #12110e !important;
}

/* Cleaner match/status bars. */
.vptchat-match-strip {
    background: rgba(212,175,55,.018) !important;
}

.vptchat-free-status {
    background: rgba(255,255,255,.012) !important;
}

.vptchat-free-status strong {
    color: var(--vpt-gold-light) !important;
    background: rgba(212,175,55,.075) !important;
    border-color: rgba(212,175,55,.22) !important;
}

/* Make Browse All names/meta comfortably readable after theme isolation. */
.vptchat-roster-card-copy strong {
    font-size: 11.5px !important;
}

.vptchat-roster-card-copy span {
    margin-top: 4px !important;
    font-size: 8.4px !important;
}

@media (max-width: 760px) {
    body .vptchat button.vptchat-message-action {
        min-height: 24px !important;
        padding: 4px 8px !important;
    }
}


/* =========================================================
   v2.1.1 FIXED — COMPACT UI / COMPOSER / MESSAGE POLISH
   ========================================================= */
body .vptchat .vptchat-room-controls{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important}
body .vptchat button.vptchat-save-match,body .vptchat button.vptchat-copy-link,body .vptchat button.vptchat-new-match,body .vptchat button.vptchat-language-toggle,body .vptchat button.vptchat-roster-toggle,body .vptchat button.vptchat-saved-toggle,body .vptchat button.vptchat-roster-all,body .vptchat button.vptchat-roster-saved-only,body .vptchat button.vptchat-roster-close,body .vptchat button.vptchat-stop{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:34px!important;padding:7px 12px!important;font-size:7.4px!important;letter-spacing:.62px!important;line-height:1!important;white-space:nowrap!important}
body .vptchat button.vptchat-new-match,body .vptchat button.vptchat-language-toggle{min-height:34px!important;padding:7px 11px!important;font-size:7.1px!important}
.vptchat-saved-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
.vptchat-saved-count{display:inline-flex!important;align-items:center!important;justify-content:center!important;vertical-align:middle!important;flex:0 0 auto!important;min-width:17px!important;height:17px!important;min-height:17px!important;margin-left:0!important;padding:0 5px!important;font-size:7px!important;line-height:1!important;transform:translateY(-.5px)!important}
.vptchat-match-label{font-size:10px!important}.vptchat-match-detail{font-size:10px!important}.vptchat-free-status strong{font-size:8px!important}.vptchat-free-usage{font-size:10.5px!important;font-weight:600!important}.vptchat-room-meta{font-size:9.4px!important}
body .vptchat .vptchat-messages{padding:22px 18px 14px!important}
body .vptchat .vptchat-message{gap:8px!important;margin:0 0 12px!important}
body .vptchat .vptchat-bubble{font-size:13.2px!important;line-height:1.48!important;padding:11px 13px!important;overflow-wrap:anywhere!important;word-break:normal!important}
body .vptchat .vptchat-message.is-ai .vptchat-bubble{max-width:min(72%,640px)!important}
body .vptchat .vptchat-message.is-user .vptchat-bubble{width:auto!important;min-width:96px!important;max-width:min(48%,340px)!important;text-align:left!important;border-radius:16px!important;border-top-right-radius:6px!important;padding:11px 14px!important}
body .vptchat .vptchat-message.is-user .vptchat-message-stack{max-width:min(48%,340px)!important}
body .vptchat button.vptchat-message-action{min-height:20px!important;padding:2px 7px!important;font-size:6.2px!important;letter-spacing:.42px!important}
body .vptchat .vptchat-form{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:9px!important;align-items:center!important;padding:11px 18px!important}
body .vptchat .vptchat-form>*{min-width:0!important}
body .vptchat .vptchat-input{grid-column:1!important;min-height:46px!important;max-height:124px!important;padding:12px 14px!important;font-size:13px!important;line-height:1.4!important;border-radius:14px!important}
body .vptchat button.vptchat-stop,body .vptchat button.vptchat-send{align-self:stretch!important}
body .vptchat button.vptchat-stop{grid-column:2!important;min-width:106px!important;min-height:46px!important;border-radius:14px!important;color:#090909!important;background:linear-gradient(145deg,var(--vpt-gold-pale),var(--vpt-gold))!important;border:1px solid rgba(255,255,255,.14)!important}
body .vptchat button.vptchat-send{grid-column:2!important;min-width:112px!important;min-height:46px!important;padding:10px 16px!important;font-size:10px!important;letter-spacing:.55px!important;border-radius:14px!important}
body .vptchat .vptchat-form:has(.vptchat-stop:not([hidden])){grid-template-columns:minmax(0,1fr) auto!important}
body .vptchat .vptchat-form:has(.vptchat-stop:not([hidden])) button.vptchat-send{display:none!important}
.vptchat-footnote{font-size:9px!important;line-height:1.35!important}
@media(max-width:900px){body .vptchat .vptchat-message.is-user .vptchat-bubble,body .vptchat .vptchat-message.is-user .vptchat-message-stack{max-width:min(58%,320px)!important}}
@media(max-width:640px){body .vptchat .vptchat-messages{padding:18px 12px 12px!important}body .vptchat .vptchat-bubble{font-size:12.6px!important}body .vptchat .vptchat-message.is-user .vptchat-bubble,body .vptchat .vptchat-message.is-user .vptchat-message-stack{max-width:68%!important;min-width:90px!important}}


/* =========================================================
   v2.2.0 FINAL — BALANCED PREMIUM UI / ROBUST BUSY STATE
   ========================================================= */

/* The HTML hidden attribute must always win over theme/plugin button CSS. */
body .vptchat [hidden],
body .vptchat button[hidden],
body .vptchat .vptchat-stop[hidden],
body .vptchat .vptchat-send[hidden],
body .vptchat .vptchat-typing[hidden] {
    display: none !important;
}

/* Top controls: readable, but no longer oversized. */
body .vptchat .vptchat-room-controls {
    gap: 8px !important;
}
body .vptchat button.vptchat-save-match,
body .vptchat button.vptchat-copy-link,
body .vptchat button.vptchat-new-match,
body .vptchat button.vptchat-language-toggle {
    min-height: 36px !important;
    padding: 8px 13px !important;
    font-size: 8.6px !important;
    letter-spacing: .58px !important;
    line-height: 1 !important;
}

/* Discovery buttons should be readable and balanced. */
body .vptchat button.vptchat-roster-toggle,
body .vptchat button.vptchat-saved-toggle {
    min-height: 36px !important;
    padding: 8px 14px !important;
    font-size: 8.5px !important;
    letter-spacing: .55px !important;
}

/* SAVED + counter must be one clean inline unit. */
body .vptchat button.vptchat-saved-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
}
body .vptchat .vptchat-saved-count {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    min-width: 18px !important;
    width: auto !important;
    height: 18px !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: 0 5px !important;
    vertical-align: middle !important;
    transform: none !important;
    font-size: 7.7px !important;
    line-height: 18px !important;
}

/* Meta text was too tiny in 2.1.1. */
body .vptchat .vptchat-room-meta { font-size: 10px !important; }
body .vptchat .vptchat-match-label { font-size: 10.5px !important; }
body .vptchat .vptchat-match-detail { font-size: 10.5px !important; }
body .vptchat .vptchat-free-status strong { font-size: 8.4px !important; }
body .vptchat .vptchat-free-usage { font-size: 10.5px !important; font-weight: 600 !important; }
body .vptchat .vptchat-footnote { font-size: 9px !important; line-height: 1.35 !important; }

/* Conversation geometry. */
body .vptchat .vptchat-messages {
    padding: 22px 22px 15px !important;
}
body .vptchat .vptchat-message {
    gap: 9px !important;
    margin-bottom: 13px !important;
}
body .vptchat .vptchat-bubble {
    font-size: 13.1px !important;
    line-height: 1.5 !important;
    padding: 11px 14px !important;
    white-space: pre-wrap !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
}
body .vptchat .vptchat-message.is-ai .vptchat-message-stack {
    max-width: min(72%, 680px) !important;
}
body .vptchat .vptchat-message.is-ai .vptchat-bubble {
    width: fit-content !important;
    max-width: 100% !important;
}

/* User messages should look like the AI bubbles, only right-aligned and gold-accented. */
body .vptchat .vptchat-message.is-user {
    justify-content: flex-end !important;
}
body .vptchat .vptchat-message.is-user .vptchat-message-stack {
    width: fit-content !important;
    min-width: 132px !important;
    max-width: min(58%, 520px) !important;
    align-items: flex-end !important;
}
body .vptchat .vptchat-message.is-user .vptchat-bubble {
    display: block !important;
    width: auto !important;
    min-width: 132px !important;
    max-width: 100% !important;
    padding: 11px 14px !important;
    color: #f5f0e5 !important;
    background: linear-gradient(145deg, #1c180c, #11100b) !important;
    border: 1px solid rgba(229,199,91,.48) !important;
    border-radius: 15px !important;
    border-top-right-radius: 5px !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.20) !important;
    font-weight: 600 !important;
    text-align: left !important;
}

/* Copy / Regenerate: visible enough to use, still secondary. */
body .vptchat button.vptchat-message-action,
body .vptchat button.vptchat-message-action:hover,
body .vptchat button.vptchat-message-action:focus,
body .vptchat button.vptchat-message-action:focus-visible,
body .vptchat button.vptchat-message-action:active {
    min-height: 22px !important;
    padding: 3px 8px !important;
    font-size: 7px !important;
    letter-spacing: .42px !important;
}

/* Composer always has exactly one action button: SEND or STOP. */
body .vptchat .vptchat-form,
body .vptchat .vptchat-form:has(.vptchat-stop:not([hidden])) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 112px !important;
    gap: 10px !important;
    align-items: stretch !important;
    padding: 11px 18px !important;
}
body .vptchat .vptchat-input {
    grid-column: 1 !important;
    min-height: 48px !important;
    max-height: 126px !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    border-radius: 14px !important;
}
body .vptchat button.vptchat-send,
body .vptchat button.vptchat-stop {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 112px !important;
    min-width: 112px !important;
    min-height: 48px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 10px 13px !important;
    border-radius: 14px !important;
    font-size: 9.5px !important;
    letter-spacing: .48px !important;
    line-height: 1 !important;
    align-self: stretch !important;
}
body .vptchat button.vptchat-stop {
    color: #090909 !important;
    background: linear-gradient(145deg, var(--vpt-gold-pale), var(--vpt-gold)) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
}

/* Typing state remains subtle. */
body .vptchat .vptchat-typing {
    min-height: 26px !important;
    padding: 0 22px 7px 63px !important;
    font-size: 9px !important;
}

@media (max-width: 760px) {
    body .vptchat button.vptchat-save-match,
    body .vptchat button.vptchat-copy-link,
    body .vptchat button.vptchat-new-match,
    body .vptchat button.vptchat-language-toggle {
        min-height: 34px !important;
        padding: 7px 10px !important;
        font-size: 7.9px !important;
    }
    body .vptchat .vptchat-message.is-user .vptchat-message-stack,
    body .vptchat .vptchat-message.is-user .vptchat-bubble {
        min-width: 116px !important;
        max-width: 72% !important;
    }
    body .vptchat .vptchat-form,
    body .vptchat .vptchat-form:has(.vptchat-stop:not([hidden])) {
        grid-template-columns: minmax(0, 1fr) 96px !important;
        gap: 8px !important;
        padding: 10px 12px !important;
    }
    body .vptchat button.vptchat-send,
    body .vptchat button.vptchat-stop {
        width: 96px !important;
        min-width: 96px !important;
        min-height: 46px !important;
        font-size: 8.8px !important;
    }
}

@media (max-width: 480px) {
    body .vptchat .vptchat-messages { padding: 17px 11px 12px !important; }
    body .vptchat .vptchat-bubble { font-size: 12.5px !important; }
    body .vptchat .vptchat-message.is-user .vptchat-message-stack,
    body .vptchat .vptchat-message.is-user .vptchat-bubble {
        min-width: 104px !important;
        max-width: 78% !important;
    }
}
