@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500&family=Playfair+Display:ital,wght@1,700;1,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Poppins:wght@300;400;500;600&family=Allura&display=swap');

.story-avatar-btn,
.story-avatar-wrap {
    position: relative !important;
    display: inline-grid !important;
    place-items: center !important;
    border: 0 !important;
    padding: 3px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    cursor: pointer !important;
    line-height: 0 !important;
    flex: 0 0 auto !important;
}

.story-avatar-btn img,
.story-avatar-wrap img,
.creator-link .story-avatar-btn img {
    display: block !important;
    border-radius: 999px !important;
    object-fit: cover !important;
}

.story-avatar-btn.has-story,
.story-avatar-wrap.has-story,
.avatar-ring.has-story {
    background: conic-gradient(from 0deg,#ff2ccf,#ffb800,#7cf4c7,#7b2cff,#ff2ccf) !important;
    animation: deejaiStorySpin 1.2s linear infinite !important;
    box-shadow: 0 0 16px rgba(255,44,207,.38), 0 0 28px rgba(123,44,255,.24) !important;
}

.story-avatar-btn.has-story img,
.story-avatar-wrap.has-story img,
.avatar-ring.has-story img {
    border: 3px solid #050005 !important;
}

.creator-link.no-profile-link {
    pointer-events: auto !important;
    text-decoration: none !important;
}

.creator-role-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    margin-top: 2px !important;
}

.creator-role-row span {
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.view-profile-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.22) !important;
}

@keyframes deejaiStorySpin {
    to { filter: hue-rotate(360deg); transform: rotate(360deg); }
}

.story-avatar-btn.has-story img,
.story-avatar-wrap.has-story img,
.avatar-ring.has-story img {
    animation: deejaiStoryImgStable 1.2s linear infinite reverse !important;
}

@keyframes deejaiStoryImgStable {
    to { transform: rotate(360deg); }
}

.deejai-story-viewer {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483600 !important;
    display: none !important;
    background: #000 !important;
    color: #fff !important;
    overflow: hidden !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.deejai-story-viewer.show {
    display: block !important;
}

.deejai-story-media {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    background: #000 !important;
}

.deejai-story-gradient {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 34vh !important;
    background: linear-gradient(0deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.42) 38%,rgba(0,0,0,0) 100%) !important;
    pointer-events: none !important;
}

.deejai-story-caption {
    position: absolute !important;
    left: 18px !important;
    right: 18px !important;
    bottom: calc(30px + env(safe-area-inset-bottom)) !important;
    z-index: 4 !important;
    text-align: center !important;
    color: #fff !important;
    font-family: 'Oswald', Impact, 'Arial Narrow', sans-serif !important;
    font-size: clamp(24px, 7vw, 44px) !important;
    line-height: 1.09 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .03em !important;
    text-shadow: 0 3px 18px rgba(0,0,0,.9) !important;
}

.deejai-story-close {
    position: absolute !important;
    top: calc(18px + env(safe-area-inset-top)) !important;
    right: 16px !important;
    z-index: 6 !important;
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.38) !important;
    color: #fff !important;
    font-size: 34px !important;
    line-height: 1 !important;
    backdrop-filter: blur(14px) !important;
}

.deejai-story-bars {
    position: absolute !important;
    top: calc(12px + env(safe-area-inset-top)) !important;
    left: 10px !important;
    right: 66px !important;
    z-index: 5 !important;
    display: flex !important;
    gap: 5px !important;
}

.deejai-story-bar {
    flex: 1 !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.35) !important;
    overflow: hidden !important;
}

.deejai-story-bar > i {
    display: block !important;
    height: 100% !important;
    width: 0% !important;
    background: #fff !important;
    border-radius: inherit !important;
}

.deejai-story-tap-left,
.deejai-story-tap-right {
    position: absolute !important;
    top: 58px !important;
    bottom: 0 !important;
    z-index: 3 !important;
    background: transparent !important;
    border: 0 !important;
    color: transparent !important;
}

.deejai-story-tap-left { left: 0 !important; width: 38% !important; }
.deejai-story-tap-right { right: 0 !important; width: 62% !important; }


/* v37 - botão Ver Perfil somente nos feeds, nunca dentro da própria página de perfil */
body.public-profile-v11 .view-profile-pill {
    display: none !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row .view-profile-pill {
    display: inline-flex !important;
}


/* v38 - no feed, botão Ver Perfil abaixo da função e Follow menor */
body.feed-page:not(.public-profile-v11) .creator-role-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 5px !important;
    min-width: 0 !important;
    margin-top: 2px !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row span {
    display: block !important;
    max-width: none !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.05 !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row .view-profile-pill {
    display: inline-flex !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 14px !important;
    margin-top: 1px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

body.feed-page:not(.public-profile-v11) .creator-row .follow-btn {
    min-width: 92px !important;
    width: auto !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 18px !important;
    border-radius: 999px !important;
    font-size: 17px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (max-width: 420px) {
    body.feed-page:not(.public-profile-v11) .creator-row .follow-btn {
        min-width: 86px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 15px !important;
        font-size: 15px !important;
    }

    body.feed-page:not(.public-profile-v11) .creator-role-row .view-profile-pill {
        height: 26px !important;
        min-height: 26px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
    }
}


/* v39 - aproxima nome e descrição/função no topo dos cards */
body.feed-page:not(.public-profile-v11) .creator-link > div,
body.feed-page:not(.public-profile-v11) .creator-row .creator-link > div {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-width: 0 !important;
}

body.feed-page:not(.public-profile-v11) .creator-link strong,
body.feed-page:not(.public-profile-v11) .creator-row .creator-link strong {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.02 !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row {
    margin-top: -1px !important;
    gap: 3px !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row span,
body.feed-page:not(.public-profile-v11) .creator-link span {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.02 !important;
}

body.feed-page:not(.public-profile-v11) .creator-role-row .view-profile-pill {
    margin-top: 2px !important;
}

@media (max-width: 420px) {
    body.feed-page:not(.public-profile-v11) .creator-role-row {
        margin-top: -2px !important;
        gap: 2px !important;
    }
}


/* v40 - comentários: avatar real e botão enviar estilo aviãozinho */
.tiktok-comment-form {
    grid-template-columns: 42px minmax(0,1fr) 46px !important;
    gap: 10px !important;
    align-items: center !important;
}

.tiktok-comment-form .comment-icon,
.comment-icon {
    display: none !important;
}

.tiktok-comment-form .comment-send,
.comment-send {
    display: grid !important;
    place-items: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    background-image: none !important;
    color: #111 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.tiktok-comment-form .comment-send svg,
.comment-send svg {
    width: 27px !important;
    height: 27px !important;
    display: block !important;
    fill: none !important;
    stroke: #111 !important;
    stroke-width: 2.25 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.comment-item {
    grid-template-columns: 50px 1fr auto !important;
    align-items: start !important;
}

.comment-avatar {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    border-radius: 999px !important;
    object-fit: cover !important;
    background: #e9e9e9 !important;
    display: block !important;
}

@media (max-width: 420px) {
    .tiktok-comment-form {
        grid-template-columns: 42px minmax(0,1fr) 42px !important;
        gap: 8px !important;
    }
    .tiktok-comment-form .comment-send,
    .comment-send {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }
}


/* v41 - respostas nos comentários e ajuste visual do topo do perfil */
.comment-body {
    min-width: 0 !important;
}

.comment-meta {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.reply-comment-btn {
    display: inline !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #777 !important;
    font: inherit !important;
    font-weight: 700 !important;
    line-height: inherit !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.reply-comment-btn:active {
    opacity: .65 !important;
}

.comment-replies {
    margin-top: 12px !important;
    display: grid !important;
    gap: 10px !important;
}

.comment-item.comment-reply-item {
    grid-template-columns: 38px 1fr auto !important;
    gap: 9px !important;
    padding: 6px 0 2px !important;
}

.comment-reply-item .comment-avatar {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
}

.comment-reply-item p {
    font-size: 16px !important;
    line-height: 1.22 !important;
}

.tiktok-comment-form.is-replying input[name="comentario"] {
    box-shadow: inset 0 0 0 2px rgba(123,44,255,.28) !important;
}

body.public-profile-v11 .avatar-ring,
body.public-profile-v11 .profile-box .avatar-ring {
    background: #fff !important;
    box-shadow: 0 0 0 1px rgba(255,255,255,.65), 0 12px 34px rgba(0,0,0,.26) !important;
    padding: 4px !important;
}

body.public-profile-v11 .avatar-ring.has-story,
body.public-profile-v11 .profile-box .avatar-ring.has-story {
    background: conic-gradient(from 0deg,#ff2ccf,#ffb800,#7cf4c7,#7b2cff,#ff2ccf) !important;
    animation: deejaiStorySpin 1.2s linear infinite !important;
    box-shadow: 0 0 16px rgba(255,44,207,.38), 0 0 28px rgba(123,44,255,.24) !important;
}

body.public-profile-v11 .avatar-ring img,
body.public-profile-v11 .profile-box .avatar-ring img {
    border: 4px solid #000 !important;
}

body.public-profile-v11 .verified-badge {
    display: none !important;
}

body.public-profile-v11 .profile-name {
    font-size: clamp(25px, 7.2vw, 34px) !important;
    line-height: 1 !important;
    margin: 0 0 1px !important;
    letter-spacing: .08em !important;
}

body.public-profile-v11 .profile-user {
    margin: 0 0 3px !important;
    line-height: 1.05 !important;
}

body.public-profile-v11 .profile-role {
    margin: 0 0 10px !important;
    line-height: 1.09 !important;
    font-size: clamp(17px, 4.8vw, 22px) !important;
}

body.public-profile-v11 .avatar-ring {
    margin-bottom: 14px !important;
}

@media (max-width: 420px) {
    body.public-profile-v11 .profile-name {
        font-size: 25px !important;
        letter-spacing: .06em !important;
    }
    body.public-profile-v11 .profile-role {
        font-size: 18px !important;
    }
}


/* v42 - ajuste correto: aproxima nome e função apenas nos cards de playlist do perfil */
body.public-profile-v11 .profile-card .creator-link > div,
body.public-profile-v11 .profile-card .creator-row .creator-link > div {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-width: 0 !important;
}

body.public-profile-v11 .profile-card .creator-link strong,
body.public-profile-v11 .profile-card .creator-row .creator-link strong {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.02 !important;
}

body.public-profile-v11 .profile-card .creator-role-row {
    margin-top: -2px !important;
    gap: 0 !important;
    line-height: 1.02 !important;
}

body.public-profile-v11 .profile-card .creator-role-row span,
body.public-profile-v11 .profile-card .creator-link span {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.02 !important;
}

/* Nome da bio do perfil em texto normal: primeiras letras maiúsculas, demais minúsculas */
body.public-profile-v11 .profile-name {
    text-transform: none !important;
}


/* v43 - correção efetiva para perfil e cards de playlist */
body.public-profile-v11 .profile-box .profile-name,
body.public-profile-v11 .profile-name {
    text-transform: none !important;
    font-size: clamp(26px, 7vw, 34px) !important;
    line-height: 1.05 !important;
    margin: 0 0 3px !important;
    letter-spacing: .2px !important;
}
body.public-profile-v11 .profile-box .profile-user {
    margin: 0 0 8px !important;
    line-height: 1.15 !important;
}
body.public-profile-v11 .profile-box .profile-role {
    margin: 0 0 12px !important;
    line-height: 1.15 !important;
}
body.public-profile-v11 .profile-card .creator-row .creator-link > div {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 0 !important;
    min-width: 0 !important;
}
body.public-profile-v11 .profile-card .creator-row .creator-link strong {
    line-height: .98 !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.public-profile-v11 .profile-card .creator-row .creator-role-row {
    margin-top: -3px !important;
    line-height: 1 !important;
    gap: 0 !important;
}
body.public-profile-v11 .profile-card .creator-row .creator-role-row span,
body.public-profile-v11 .profile-card .creator-row .creator-link span {
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media(max-width:520px){
    body.public-profile-v11 .profile-box .profile-name,
    body.public-profile-v11 .profile-name {
        font-size: 26px !important;
    }
}


/* v44 - bio do perfil com linhas mais próximas */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio {
    line-height: 1.09 !important;
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    max-width: 470px !important;
}
body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br {
    line-height: 1.09 !important;
}
@media(max-width:520px){
    body.public-profile-v11 .profile-box .profile-bio,
    body.public-profile-v11 .profile-bio {
        line-height: 1.09 !important;
        margin-top: 7px !important;
    }
}


/* v45 - bio com 9% de espaço extra entre linhas */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio {
    line-height: 1.09 !important;
}
body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br {
    line-height: 1.09 !important;
}


/* v46 - bio do perfil mais junta: line-height 1.05 real */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio,
.public-profile-v11 .profile-box .profile-bio,
.public-profile-v11 .profile-bio {
    line-height: 1.05 !important;
    margin-top: 6px !important;
    margin-bottom: 8px !important;
}

body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br,
.public-profile-v11 .profile-box .profile-bio br,
.public-profile-v11 .profile-bio br {
    line-height: 1.05 !important;
}

@media(max-width:520px){
    body.public-profile-v11 .profile-box .profile-bio,
    body.public-profile-v11 .profile-bio,
    .public-profile-v11 .profile-box .profile-bio,
    .public-profile-v11 .profile-bio {
        line-height: 1.05 !important;
        margin-top: 6px !important;
        margin-bottom: 8px !important;
    }
}


/* v47 - bio do perfil com line-height 1.0 sem espaço extra */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio,
.public-profile-v11 .profile-box .profile-bio,
.public-profile-v11 .profile-bio {
    line-height: 1 !important;
    margin-top: 4px !important;
    margin-bottom: 6px !important;
}
body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br,
.public-profile-v11 .profile-box .profile-bio br,
.public-profile-v11 .profile-bio br {
    line-height: 1 !important;
}
@media(max-width:520px){
    body.public-profile-v11 .profile-box .profile-bio,
    body.public-profile-v11 .profile-bio,
    .public-profile-v11 .profile-box .profile-bio,
    .public-profile-v11 .profile-bio {
        line-height: 1 !important;
        margin-top: 4px !important;
        margin-bottom: 6px !important;
    }
}


/* v48 - corrige espaçamento duplicado da bio do perfil */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio,
.public-profile-v11 .profile-box .profile-bio,
.public-profile-v11 .profile-bio {
    line-height: 1 !important;
    white-space: pre-line !important;
    margin-top: 2px !important;
    margin-bottom: 4px !important;
}
body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br,
.public-profile-v11 .profile-box .profile-bio br,
.public-profile-v11 .profile-bio br {
    display: none !important;
    line-height: 0 !important;
}


/* v49 - bio do perfil com line-height 1.01 */
body.public-profile-v11 .profile-box .profile-bio,
body.public-profile-v11 .profile-bio,
.public-profile-v11 .profile-box .profile-bio,
.public-profile-v11 .profile-bio {
    line-height: 1.01 !important;
    margin-top: 2px !important;
    margin-bottom: 4px !important;
    white-space: pre-line !important;
}
body.public-profile-v11 .profile-box .profile-bio br,
body.public-profile-v11 .profile-bio br,
.public-profile-v11 .profile-box .profile-bio br,
.public-profile-v11 .profile-bio br {
    display: none !important;
    line-height: 0 !important;
}

/* v50 - Museo Sans 900 Italic somente no nome da página de perfil
   Coloque o arquivo da fonte no site em:
   assets/css/fonts/museo-sans/MuseoSans-900Italic.otf
*/
@font-face {
    font-family: "Deejai Museo Sans 900 Italic";
    src: url("fonts/museo-sans/MuseoSans-900Italic.otf") format("opentype");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

body.public-profile-v11 .profile-hero .profile-name,
body.public-profile-v11 .profile-box .profile-name {
    font-family: "Deejai Museo Sans 900 Italic", "Museo Sans", Arial, Helvetica, sans-serif !important;
    font-weight: 900 !important;
    font-style: italic !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}


/* v51 - legenda do story com destaque entre colchetes [ ] em fonte e degradê */
.story-caption-hint {
    margin: 6px 0 10px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    background: rgba(124,244,199,.08) !important;
    border: 1px solid rgba(124,244,199,.22) !important;
    color: #d9fdf2 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.story-caption-hint code {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.deejai-story-caption {
    left: 20px !important;
    right: 20px !important;
    bottom: calc(30px + env(safe-area-inset-bottom)) !important;
    max-width: min(88vw, 760px) !important;
    margin: 0 auto !important;
    font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
    font-size: clamp(34px, 10vw, 78px) !important;
    font-weight: 300 !important;
    line-height: .84 !important;
    letter-spacing: -.055em !important;
    text-transform: none !important;
    word-break: break-word !important;
    white-space: normal !important;
    text-wrap: balance !important;
    color: #f5f0ea !important;
    text-shadow: 0 3px 18px rgba(0,0,0,.78) !important;
}

.deejai-story-caption .story-caption-line {
    display: block !important;
}

.deejai-story-caption .story-caption-accent {
    display: inline-block !important;
    margin: 0 .04em !important;
    font-family: 'Allura', 'Apple Chancery', 'Segoe Script', cursive !important;
    font-size: 1.18em !important;
    font-weight: 400 !important;
    line-height: .72 !important;
    letter-spacing: 0 !important;
    transform: translateY(.02em) !important;
    background: linear-gradient(90deg,#ffcf4a 0%,#ff7ce5 35%,#a95bff 68%,#7cf4c7 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    text-shadow: none !important;
}

@media (max-width: 520px) {
    .deejai-story-caption {
        font-size: clamp(31px, 10.5vw, 58px) !important;
        line-height: .82 !important;
        letter-spacing: -.05em !important;
    }

    .deejai-story-caption .story-caption-accent {
        font-size: 1.16em !important;
    }
}


/* v52 - legenda do story no modelo da referência: texto normal clean + destaque [ ] serifado itálico */
.deejai-story-caption {
    left: 20px !important;
    right: 20px !important;
    bottom: calc(30px + env(safe-area-inset-bottom)) !important;
    max-width: min(88vw, 760px) !important;
    margin: 0 auto !important;
    font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif !important;
    font-size: clamp(36px, 11vw, 84px) !important;
    font-weight: 300 !important;
    line-height: .78 !important;
    letter-spacing: -.065em !important;
    text-transform: none !important;
    text-align: center !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
    text-wrap: balance !important;
    color: #f4f1ec !important;
    text-shadow: 0 3px 18px rgba(0,0,0,.78) !important;
}

.deejai-story-caption .story-caption-line {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.deejai-story-caption .story-caption-accent {
    display: inline-block !important;
    margin: 0 .025em !important;
    padding: 0 !important;
    font-family: "Playfair Display", "Bodoni 72", Didot, "Libre Bodoni", Georgia, serif !important;
    font-style: italic !important;
    font-size: 1.14em !important;
    font-weight: 800 !important;
    line-height: .68 !important;
    letter-spacing: -.035em !important;
    transform: translateY(.035em) !important;
    background: linear-gradient(135deg, #7CF4C7 0%, #A66BFF 52%, #4A7DFF 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    text-shadow: none !important;
}

.story-caption-hint {
    margin: 6px 0 10px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    background: rgba(124,244,199,.08) !important;
    border: 1px solid rgba(124,244,199,.22) !important;
    color: #d9fdf2 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}

.story-caption-hint code {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

@media (max-width: 520px) {
    .deejai-story-caption {
        font-size: clamp(34px, 11vw, 62px) !important;
        line-height: .78 !important;
        letter-spacing: -.062em !important;
    }

    .deejai-story-caption .story-caption-accent {
        font-size: 1.13em !important;
        line-height: .68 !important;
    }
}


/* v53 - legenda do story: destaque lilás da logo, posição a 50px e gradiente mais focado na área do texto */
.deejai-story-gradient {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 44vh !important;
    background: linear-gradient(0deg,
        rgba(0,0,0,.94) 0%,
        rgba(0,0,0,.88) 12%,
        rgba(0,0,0,.74) 26%,
        rgba(0,0,0,.48) 42%,
        rgba(0,0,0,.20) 60%,
        rgba(0,0,0,0) 80%) !important;
}

.deejai-story-caption {
    bottom: calc(50px + env(safe-area-inset-bottom)) !important;
    max-width: min(88vw, 720px) !important;
    text-shadow: 0 4px 22px rgba(0,0,0,.92) !important;
}

.deejai-story-caption .story-caption-accent {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: #7b2cff !important;
    color: #7b2cff !important;
    text-shadow: 0 4px 18px rgba(0,0,0,.78) !important;
}

@media (max-width: 520px) {
    .deejai-story-caption {
        bottom: calc(50px + env(safe-area-inset-bottom)) !important;
    }
}


/* v54 - story: legenda menor para caber em 3 linhas, tudo em minúsculo e destaque branco */
.deejai-story-caption {
    text-transform: lowercase !important;
    font-size: clamp(28px, 8.4vw, 62px) !important;
    line-height: .86 !important;
    letter-spacing: -.058em !important;
    max-width: min(82vw, 620px) !important;
}

.deejai-story-caption .story-caption-accent {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
    text-shadow: 0 4px 18px rgba(0,0,0,.86) !important;
}

@media (max-width: 520px) {
    .deejai-story-caption {
        font-size: clamp(26px, 8.2vw, 48px) !important;
        line-height: .86 !important;
        letter-spacing: -.055em !important;
        max-width: min(82vw, 520px) !important;
    }
}


/* v55 - stories com foto/vídeo e expiração de 24h */
.deejai-story-media-wrap {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: #000 !important;
}

.deejai-story-media-wrap .deejai-story-media,
video.deejai-story-media {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    background: #000 !important;
}


/* v56 - rádios no feed: remover botão ver perfil e colocar AO VIVO abaixo da função */
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    margin-top: -1px !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row .view-profile-pill {
    display: none !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed > .creator-row > .feed-live-badge {
    display: none !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-live-badge {
    display: inline-flex !important;
    position: static !important;
    align-self: flex-start !important;
    margin: -4px 0 0 0 !important;
    padding: 5px 12px !important;
    border-radius: 999px !important;
    background: #ff0033 !important;
    color: #fff !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    box-shadow: 0 8px 18px rgba(255,0,51,.18) !important;
}


/* v58 - rádio no feed: etiqueta AO VIVO quase colada abaixo de Estação de Rádio, com 4px */
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row {
    gap: 4px !important;
    margin-top: -1px !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row > span,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row > span {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-live-badge {
    margin: 0 !important;
    align-self: flex-start !important;
}


/* v59 - rádio no feed: AO VIVO abaixo de Estação de Rádio com 4px reais */
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row,
.feed-card.radio-card-feed .creator-role-row,
.feed-card.radio-card-feed .radio-role-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    margin-top: -1px !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row > span:first-child,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row > span:first-child,
.feed-card.radio-card-feed .creator-role-row > span:first-child,
.feed-card.radio-card-feed .radio-role-row > span:first-child {
    display: block !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row .feed-live-badge,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-live-badge,
.feed-card.radio-card-feed .creator-role-row .feed-live-badge,
.feed-card.radio-card-feed .radio-role-row .feed-live-badge,
.feed-card.radio-card-feed .creator-live-badge {
    display: inline-flex !important;
    position: static !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    align-self: flex-start !important;
}


/* v60 - stories: barra de progresso visível em degradê no topo e duração fixa de 30s */
.deejai-story-bars {
    top: calc(14px + env(safe-area-inset-top)) !important;
    left: 12px !important;
    right: 78px !important;
    z-index: 20 !important;
    gap: 5px !important;
    height: 5px !important;
}

.deejai-story-bar {
    height: 5px !important;
    background: rgba(255,255,255,.28) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 8px rgba(0,0,0,.38) !important;
}

.deejai-story-bar > i {
    height: 100% !important;
    width: 0% !important;
    display: block !important;
    background: linear-gradient(90deg,#ff2ccf 0%,#b12cff 52%,#7b2cff 100%) !important;
    border-radius: inherit !important;
    box-shadow: 0 0 10px rgba(177,44,255,.45) !important;
}

.deejai-story-close {
    z-index: 25 !important;
}


/* v61 - permitir que o JS mova a barra de progresso até 100% */
.deejai-story-bar > i {
    width: 0%;
    transition: width .08s linear !important;
}

/* DEEJAI CLUB fix: funções corretas + etiqueta ao vivo abaixo da função */
.feed-card.radio-card-feed .creator-role-row,
.feed-card.radio-card-feed .radio-role-row,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .creator-role-row,
body.feed-page:not(.public-profile-v11) .feed-card.radio-card-feed .radio-role-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    margin-top: -1px !important;
}
.feed-card.radio-card-feed .creator-role-row > span:first-child,
.feed-card.radio-card-feed .radio-role-row > span:first-child {
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.feed-card.radio-card-feed .creator-role-row .feed-live-badge,
.feed-card.radio-card-feed .radio-role-row .feed-live-badge,
.feed-card.radio-card-feed .creator-live-badge {
    display: inline-flex !important;
    position: static !important;
    align-self: flex-start !important;
    margin: 0 !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: #ff0033 !important;
    color: #fff !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
    text-transform: lowercase !important;
    box-shadow: 0 8px 18px rgba(255,0,51,.18) !important;
}