/*
 * Path: assets/css/nita-phase8-reference.css
 * Visual parity pass based on the supplied Nita mobile screenshots.
 * Presentation-only overrides; existing routes, API requests, forms, and room logic remain intact.
 */

:root {
    --nita-reference-green: #08cf78;
    --nita-reference-green-dark: #12a969;
    --nita-reference-pink: #e953b2;
    --nita-reference-yellow: #fff3a0;
    --nita-reference-muted: #989c9a;
}

body.app-nita:not(.app-admin) {
    background: #f6f6f6;
    color: #181c19;
}

.nita-mobile-discover-controls,
.profile-verification-link,
.nita-trending-jackpot,
.nita-newcomer-gift-float,
.nita-task-center-ad {
    display: none;
}

@media (max-width: 760px) {
    body.app-nita:not(.app-admin) {
        background-image: linear-gradient(180deg, #f5ebff 0, #fbf8fc 78px, #f6f6f6 235px);
        color: #191d1a;
        overflow-x: clip;
    }

    body.app-nita:not(.app-admin) main {
        padding-top: 0;
        padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    }

    body.app-nita:not(.app-admin) .site-header {
        position: relative;
        min-height: 61px;
        border: 0;
        background: rgba(255,255,255,.12);
        box-shadow: none;
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }

    body.app-nita:not(.app-admin) .header-inner {
        width: calc(100% - 28px);
        min-height: 61px;
        padding: 5px 0;
        gap: 7px;
    }

    /* The profile and inbox use their own native-style top rows in the reference. */
    body.app-nita.app-page-profile .site-header,
    body.app-nita.app-page-messages .site-header {
        display: none !important;
    }

    body.app-nita:not(.app-admin) .app-bottom-nav {
        position: fixed;
        inset-inline: 0;
        bottom: 0;
        z-index: 1000;
        display: grid;
        min-height: 69px;
        padding: 6px 9px calc(7px + env(safe-area-inset-bottom, 0px));
        gap: 2px;
        border-top: 1px solid rgba(230,233,231,.8);
        background: rgba(255,255,255,.91);
        box-shadow: 0 -7px 22px rgba(25,35,30,.06);
        -webkit-backdrop-filter: blur(18px) saturate(135%);
        backdrop-filter: blur(18px) saturate(135%);
    }

    body.app-nita:not(.app-admin) .app-nav-item {
        position: relative;
        min-width: 0;
        min-height: 51px;
        padding: 3px 2px 2px;
        gap: 2px;
        border-radius: 19px;
        color: #c1c4c2;
        background: transparent;
    }

    body.app-nita:not(.app-admin) .app-nav-icon {
        display: grid;
        place-items: center;
        min-height: 29px;
        color: currentColor;
        font-size: 23px;
        line-height: 1;
    }

    body.app-nita:not(.app-admin) .app-nav-icon svg {
        width: 25px;
        height: 25px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    body.app-nita:not(.app-admin) .app-nav-item.is-active {
        color: #0ba96a;
        background: radial-gradient(ellipse at 50% 8%, rgba(10,211,124,.22), rgba(10,211,124,.03) 75%);
    }

    body.app-nita:not(.app-admin) .app-nav-item.is-active .app-nav-icon svg {
        stroke-width: 2.15;
    }

    body.app-nita:not(.app-admin) .app-nav-label {
        max-width: 100%;
        color: currentColor;
        font-size: 9px;
        font-weight: 800;
        line-height: 1.2;
    }

    body.app-nita:not(.app-admin) .app-nav-badge {
        top: -2px;
        inset-inline-start: calc(50% + 5px);
        min-width: 20px;
        height: 20px;
        border: 2px solid #fff;
        background: #f36b53;
        font-size: 10px;
    }

    body.app-nita:not(.app-admin) .app-nav-create {
        width: 56px;
        height: 46px;
        align-self: center;
    }

    body.app-nita:not(.app-admin) .app-nav-create-button {
        width: 56px;
        height: 46px;
        border: 0;
        border-radius: 13px;
        color: #fff;
        background: linear-gradient(130deg, #12df83, #03c775);
        box-shadow: 0 4px 12px rgba(8,207,120,.17);
    }

    body.app-nita:not(.app-admin) .app-nav-create-button span {
        font-size: 36px;
        font-weight: 600;
    }

    /* Home/feed header: tabs and the map/search actions sit in one compact row. */
    body.app-nita.app-home.app-authenticated .site-header {
        min-height: 63px;
        background: rgba(255,255,255,.12);
        box-shadow: none;
    }

    body.app-nita.app-home.app-authenticated .header-inner {
        width: calc(100% - 26px);
        min-height: 63px;
        justify-content: space-between;
    }

    body.app-nita.app-home.app-authenticated .nita-mobile-home-header {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: space-between;
        gap: 8px;
    }

    body.app-nita.app-home .nita-mobile-home-tabs {
        flex: 1 1 auto;
        flex-direction: row;
        justify-content: flex-start;
        gap: clamp(15px, 5vw, 27px);
        overflow: visible;
    }

    body.app-nita.app-home .nita-mobile-home-tabs a {
        min-height: 42px;
        padding: 5px 0;
        color: #4e514f;
        font-size: 14px;
        font-weight: 800;
    }

    body.app-nita.app-home .nita-mobile-home-tabs a.is-active {
        color: #101411;
        font-size: 17px;
        font-weight: 1000;
    }

    body.app-nita.app-home .nita-mobile-home-tabs a.is-active::after {
        bottom: 3px;
        height: 5px;
        background: linear-gradient(90deg, #8df0aa, #dfff7e);
    }

    body.app-nita.app-home .nita-mobile-home-controls {
        gap: 8px;
        flex: 0 0 auto;
    }

    body.app-nita.app-home .nita-mobile-home-controls a {
        width: 37px;
        height: 39px;
        color: #df62bd;
    }

    body.app-nita.app-home .nita-mobile-home-controls a:first-child {
        color: #24bc79;
    }

    body.app-nita.app-home .nita-mobile-home-controls svg {
        width: 30px;
        height: 30px;
        stroke-width: 2.4;
    }

    body.app-nita.app-home .nita-home-wrap {
        padding-bottom: 10px;
    }

    body.app-nita.app-home .nita-promo-strip {
        width: calc(100% - 22px);
        gap: 7px;
        margin: 3px auto 19px;
    }

    body.app-nita.app-home .nita-promo-tile {
        min-height: 72px;
        gap: 5px;
        padding: 7px 8px;
        border-radius: 15px;
        box-shadow: none;
    }

    body.app-nita.app-home .nita-promo-yellow {
        background: linear-gradient(125deg, #fff7a4, #ffe78a);
    }

    body.app-nita.app-home .nita-promo-mint {
        background: linear-gradient(125deg, #a2f3b9, #64e9a1);
    }

    body.app-nita.app-home .nita-promo-art {
        width: 39px;
        height: 43px;
        font-size: 30px;
    }

    body.app-nita.app-home .nita-promo-copy {
        gap: 0;
    }

    body.app-nita.app-home .nita-promo-copy small,
    body.app-nita.app-home .nita-promo-copy em {
        display: none;
    }

    body.app-nita.app-home .nita-promo-copy strong {
        color: #252a26;
        font-size: clamp(10px, 3vw, 14px);
        line-height: 1.35;
    }

    body.app-nita.app-home .nita-explore {
        width: calc(100% - 20px);
        padding-top: 0;
    }

    body.app-nita.app-home .nita-section-bar {
        margin-bottom: 8px;
    }

    body.app-nita.app-home .nita-section-heading-copy h1 {
        color: #252a26;
        font-size: 16px;
        font-weight: 1000;
    }

    body.app-nita.app-home .nita-inline-tabs {
        min-height: 34px;
        gap: 21px;
        margin-bottom: 11px;
    }

    body.app-nita.app-home.app-authenticated .nita-explore > .nita-inline-tabs {
        display: none !important;
    }

    body.app-nita.app-home .nita-inline-tabs a {
        font-size: 13px;
    }

    body.app-nita.app-home .nita-inline-tabs a.is-active {
        font-size: 16px;
    }

    /* Two column poster cards, as shown in the supplied event-room screenshots. */
    body.app-nita.app-home .nita-room-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    body.app-nita.app-home .nita-room-item {
        min-width: 0;
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        background: transparent;
        box-shadow: none;
    }

    body.app-nita.app-home .nita-room-cover {
        aspect-ratio: .94;
        border-radius: 14px;
    }

    body.app-nita.app-home .nita-room-image {
        object-position: center;
    }

    body.app-nita.app-home .nita-room-fallback-art span {
        width: 70px;
        height: 70px;
        border-radius: 30px;
        font-size: 38px;
    }

    body.app-nita.app-home .nita-room-badges {
        inset: 8px 7px auto;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 4px;
    }

    body.app-nita.app-home .nita-room-category-pill {
        max-width: calc(100% - 31px);
        min-height: 19px;
        padding: 3px 7px;
        border-radius: 7px;
        font-size: 9px;
        line-height: 1.3;
    }

    body.app-nita.app-home .nita-room-public-pill {
        display: inline-block;
        width: 25px;
        min-width: 25px;
        height: 18px;
        max-width: 25px;
        padding: 0;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.9);
        border-radius: 4px;
        color: transparent;
        font-size: 0;
        background: linear-gradient(to bottom, #ce1126 0 33.33%, #fff 33.33% 66.66%, #000 66.66% 100%);
    }

    body.app-nita.app-home .nita-room-public-pill i {
        display: none;
    }

    body.app-nita.app-home .nita-room-bottom {
        inset: auto 8px 8px;
    }

    body.app-nita.app-home .nita-room-bottom h2 {
        margin-bottom: 4px;
        font-size: clamp(10px, 3vw, 13px);
        line-height: 1.35;
        text-shadow: 0 1px 4px rgba(0,0,0,.7);
    }

    body.app-nita.app-home .nita-room-bottom p {
        display: none;
    }

    body.app-nita.app-home .nita-room-meta {
        gap: 4px;
    }

    body.app-nita.app-home .nita-room-host-mini img,
    body.app-nita.app-home .nita-room-host-mini i {
        width: 19px;
        height: 19px;
        flex-basis: 19px;
    }

    body.app-nita.app-home .nita-room-host-mini strong,
    body.app-nita.app-home .nita-room-member-count {
        font-size: 8px;
    }

    body.app-nita.app-home .nita-wide-banner {
        min-height: 84px;
        padding: 0;
        border-radius: 12px;
        background-position: center;
        background-size: cover;
        box-shadow: none;
    }

    body.app-nita.app-home .nita-wide-banner > * {
        display: none !important;
    }

    body.app-nita.app-home .nita-wide-banner-community {
        background-image: url('/assets/images/nita-community-guidelines.svg');
    }

    body.app-nita.app-home .nita-wide-banner-family {
        background-image: url('/assets/images/nita-family-agency.svg');
    }

    body.app-nita.app-home .nita-wide-banner-svip {
        background-image: url('/assets/images/nita-task-center.svg');
    }

    body.app-nita.app-home .nita-trending-jackpot {
        display: block;
        width: calc(100% - 24px);
        height: auto;
        margin: 0 auto 8px;
        overflow: hidden;
        border-radius: 999px;
        line-height: 0;
        box-shadow: 0 4px 12px rgba(120, 45, 157, .13);
    }

    body.app-nita.app-home .nita-trending-jackpot img {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 1200 / 170;
        object-fit: cover;
    }

    body.app-nita.app-home .nita-view-all {
        margin-top: 12px;
    }

    body.app-nita.app-home .nita-stats-strip,
    body.app-nita.app-home .nita-shortcuts-section,
    body.app-nita.app-home .nita-community-panels,
    body.app-nita.app-home .nita-agent-cta,
    body.app-nita.app-home .nita-bottom-cta {
        width: calc(100% - 20px);
    }

    /* Empty following feed: centered question/creature silhouette and quiet text. */
    body.app-nita.app-home .nita-empty-state {
        min-height: 59vh;
        padding: 28px 16px 20px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    body.app-nita.app-home .nita-empty-state > span {
        position: relative;
        width: 166px;
        height: 65px;
        margin: 10px 0 25px;
        border-radius: 56% 44% 48% 52%;
        color: transparent;
        background: #70ee7b;
        box-shadow: 73px 19px 0 -17px #111;
        transform: rotate(-4deg);
    }

    body.app-nita.app-home .nita-empty-state > span::before {
        content: '?';
        position: absolute;
        top: -106px;
        right: -36px;
        color: #111;
        font-size: 66px;
        font-weight: 300;
        line-height: 1;
        transform: rotate(4deg);
    }

    body.app-nita.app-home .nita-empty-state > span::after {
        content: '';
        position: absolute;
        right: 19px;
        bottom: -9px;
        width: 24px;
        height: 18px;
        border-left: 2px solid #111;
        border-bottom: 2px solid #111;
        border-radius: 0 0 0 7px;
        box-shadow: -47px -1px 0 -1px #70ee7b, -47px 0 0 -0.5px #111;
    }

    body.app-nita.app-home .nita-empty-state strong {
        color: #a2a6a3;
        font-size: 15px;
        font-weight: 700;
    }

    body.app-nita.app-home .nita-empty-state p {
        color: #a4a8a5;
        font-size: 11px;
    }

    body.app-nita.app-home .nita-following-empty .button {
        margin-top: 9px;
    }

    /* Profile: no desktop site masthead, compact toolbar, wreath-like portrait, balance cards. */
    body.app-nita.app-page-profile .profile-section {
        width: calc(100% - 31px);
        padding-top: 7px;
        padding-bottom: 120px;
    }

    body.app-nita.app-page-profile .profile-section > .settings-page-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 46px;
        margin: 0 0 13px;
    }

    body.app-nita.app-page-profile .profile-section > .settings-page-heading > div:first-child {
        display: none;
    }

    body.app-nita.app-page-profile .profile-heading-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 10px;
        direction: rtl;
    }

    body.app-nita.app-page-profile .profile-verification-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        min-height: 36px;
        padding: 6px 12px;
        border: 1px solid #f4e889;
        border-radius: 11px;
        color: #99721a;
        background: linear-gradient(135deg, #fff9a8, #ffef74);
        box-shadow: 0 2px 5px rgba(185,147,22,.08);
        text-decoration: none;
        white-space: nowrap;
    }

    body.app-nita.app-page-profile .profile-verification-link > span {
        color: #b78a22;
        font-size: 20px;
        line-height: 1;
    }

    body.app-nita.app-page-profile .profile-verification-link > strong {
        font-size: 12px;
        font-weight: 1000;
    }

    body.app-nita.app-page-profile .profile-icon-action {
        width: 39px;
        height: 39px;
        border: 0;
        border-radius: 10px;
        color: #26302a;
        background: transparent;
        box-shadow: none;
        font-size: 25px;
    }

    body.app-nita.app-page-profile .profile-icon-action-edit {
        color: #26302a;
        background: transparent;
        border: 0;
    }

    body.app-nita.app-page-profile .profile-heading-actions .profile-icon-action:not(.profile-icon-action-edit) {
        margin-inline-start: auto;
    }

    body.app-nita.app-page-profile .profile-card {
        position: relative;
        display: grid;
        grid-template-columns: 152px minmax(0, 1fr);
        grid-template-areas: "avatar main" "stats stats";
        align-items: center;
        gap: 12px 11px;
        min-height: 183px;
        margin: 0;
        padding: 5px 0 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    body.app-nita.app-page-profile .profile-avatar {
        position: relative;
        width: 148px;
        height: 169px;
        border: 4px solid #e9c768;
        border-radius: 43% 43% 47% 47%;
        color: #fff;
        background: linear-gradient(145deg, #39cc9c, #6d4edb 54%, #f9d46e);
        box-shadow: 0 0 0 3px #19ae75, 0 0 0 6px #fff1b8, 0 5px 14px rgba(40,95,65,.12);
        overflow: hidden;
    }

    body.app-nita.app-page-profile .profile-avatar::before {
        content: '✦';
        position: absolute;
        z-index: 2;
        top: 4px;
        left: 50%;
        color: #ffe68d;
        font-size: 21px;
        text-shadow: 0 1px 3px #146844;
        transform: translateX(-50%);
        pointer-events: none;
    }

    body.app-nita.app-page-profile .profile-avatar::after {
        content: '';
        position: absolute;
        inset: 7px;
        border: 2px solid rgba(255,238,153,.8);
        border-radius: 42% 42% 46% 46%;
        pointer-events: none;
    }

    body.app-nita.app-page-profile .profile-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: inherit;
    }

    body.app-nita.app-page-profile .profile-main {
        min-width: 0;
        padding-inline-start: 0;
        align-self: center;
    }

    body.app-nita.app-page-profile .profile-main h2 {
        margin: 0 0 5px;
        color: #101411;
        font-size: clamp(18px, 5.1vw, 24px);
        font-weight: 1000;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-page-profile .profile-main > p:not(.profile-account-id):not(.profile-bio),
    body.app-nita.app-page-profile .profile-main .role-tag,
    body.app-nita.app-page-profile .profile-main .level-pill,
    body.app-nita.app-page-profile .profile-main .svip-badge,
    body.app-nita.app-page-profile .profile-main .profile-public-link {
        display: none !important;
    }

    body.app-nita.app-page-profile .profile-main .profile-account-id {
        margin: 5px 0 0;
        color: #858b87;
        font-size: 12px;
        text-align: right;
        direction: ltr;
    }

    body.app-nita.app-page-profile .profile-main .profile-bio {
        display: -webkit-box;
        margin: 7px 0 0;
        overflow: hidden;
        color: #7e8580;
        font-size: 10px;
        line-height: 1.55;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    body.app-nita.app-page-profile .profile-stats {
        display: grid;
        grid-area: stats;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
        margin-top: 5px;
    }

    body.app-nita.app-page-profile .profile-stats > a,
    body.app-nita.app-page-profile .profile-stats > div {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 0;
        min-height: 51px;
        padding: 0 3px;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    body.app-nita.app-page-profile .profile-stats > :last-child {
        display: none !important;
    }

    body.app-nita.app-page-profile .profile-stats strong {
        color: #151916;
        font-size: 25px;
        font-weight: 1000;
        line-height: 1;
    }

    body.app-nita.app-page-profile .profile-stats span {
        color: #777e79;
        font-size: 11px;
        font-weight: 600;
    }

    body.app-nita.app-page-profile .profile-balance-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 16px;
    }

    body.app-nita.app-page-profile .profile-balance-card {
        min-height: 132px;
        gap: 4px;
        padding: 13px 12px 10px;
        border-radius: 18px;
    }

    body.app-nita.app-page-profile .profile-balance-card::before {
        top: -30px;
        left: -29px;
        width: 94px;
        height: 94px;
        border-radius: 25px;
        opacity: .42;
    }

    body.app-nita.app-page-profile .profile-balance-card-mark {
        top: 8px;
        left: 8px;
        width: 37px;
        height: 38px;
        font-size: 30px;
    }

    body.app-nita.app-page-profile .profile-balance-card-label {
        font-size: 15px;
        font-weight: 1000;
    }

    body.app-nita.app-page-profile .profile-balance-card > strong {
        margin-top: 17px;
        font-size: 27px;
    }

    body.app-nita.app-page-profile .profile-balance-card-help {
        display: none;
    }

    body.app-nita.app-page-profile .profile-balance-card-cta {
        min-height: 30px;
        margin-top: auto;
        padding: 5px 9px;
        font-size: 10px;
        white-space: nowrap;
    }

    body.app-nita.app-page-profile .profile-quick-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin-top: 10px;
        direction: ltr;
    }

    body.app-nita.app-page-profile .profile-quick-action {
        min-height: 67px;
        padding: 9px 8px;
        border-radius: 12px;
        gap: 2px;
        direction: rtl;
    }

    body.app-nita.app-page-profile .profile-quick-action::before {
        top: -25px;
        left: -18px;
        width: 65px;
        height: 65px;
        border-radius: 20px;
        opacity: .14;
    }

    body.app-nita.app-page-profile .profile-quick-icon {
        position: absolute;
        top: 5px;
        left: 6px;
        width: 29px;
        height: 29px;
        font-size: 25px;
    }

    body.app-nita.app-page-profile .profile-quick-action strong {
        font-size: 11px;
        font-weight: 1000;
        line-height: 1.25;
    }

    body.app-nita.app-page-profile .profile-quick-value {
        max-width: 100%;
        font-size: 11px;
        line-height: 1.2;
    }

    body.app-nita.app-page-profile .profile-quick-note {
        display: none;
    }

    body.app-nita.app-page-profile .profile-premium-banner {
        min-height: 126px;
        gap: 8px;
        margin-top: 11px;
        padding: 13px 12px;
        border-radius: 19px;
        background: linear-gradient(115deg, #fff0a7, #ffea9a 58%, #fff4c1);
    }

    body.app-nita.app-page-profile .profile-premium-banner::before {
        left: -16px;
        bottom: -80px;
        width: 190px;
        height: 190px;
        border-width: 22px;
    }

    body.app-nita.app-page-profile .profile-premium-crown {
        flex: 0 0 46px;
        width: 46px;
        height: 46px;
        font-size: 38px;
    }

    body.app-nita.app-page-profile .profile-premium-copy small {
        font-size: 7px;
    }

    body.app-nita.app-page-profile .profile-premium-copy strong {
        font-size: 16px;
        line-height: 1.45;
    }

    body.app-nita.app-page-profile .profile-premium-copy em {
        font-size: 9px;
    }

    body.app-nita.app-page-profile .profile-premium-cta {
        min-height: 31px;
        padding: 6px 10px;
        border-radius: 999px;
        font-size: 10px;
        white-space: nowrap;
    }

    body.app-nita.app-page-profile .nita-task-center-ad {
        display: block;
        margin-top: 12px;
        overflow: hidden;
        border-radius: 13px;
        line-height: 0;
    }

    body.app-nita.app-page-profile .nita-task-center-ad img {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 1200 / 270;
        object-fit: cover;
    }

    body.app-nita.app-page-profile .profile-promo-grid {
        /* Keep the discovery cards close to the task banner, like the reference. */
        margin-top: 14px;
    }

    body.app-nita.app-page-profile .profile-rooms-heading {
        margin-top: 30px;
    }

    /* Inbox list: official notification row + Nita-like spacing and round avatars. */
    body.app-nita.app-page-messages .messages-page {
        width: calc(100% - 28px);
        padding-top: 8px;
        padding-bottom: 125px;
    }

    body.app-nita.app-page-messages .messages-page-heading {
        min-height: 52px;
        margin: 0 0 9px;
        gap: 6px;
    }

    body.app-nita.app-page-messages .messages-heading-copy {
        min-width: 0;
    }

    body.app-nita.app-page-messages .messages-page-heading .section-kicker,
    body.app-nita.app-page-messages .messages-page-heading p {
        display: none !important;
    }

    body.app-nita.app-page-messages .messages-page-tabs {
        gap: clamp(18px, 5vw, 29px);
    }

    body.app-nita.app-page-messages .messages-page-tab {
        min-height: 45px;
        color: #9a9f9c;
        font-size: 18px;
        font-weight: 800;
    }

    body.app-nita.app-page-messages .messages-page-tab.is-active {
        color: #111612;
        font-size: 23px;
        font-weight: 1000;
    }

    body.app-nita.app-page-messages .messages-page-tab.is-active::after {
        height: 5px;
        background: linear-gradient(90deg, #80efa5, #e1ff86);
    }

    body.app-nita.app-page-messages .messages-notifications-link {
        display: none !important;
    }

    body.app-nita.app-page-messages .messages-layout {
        display: block;
        gap: 0;
    }

    body.app-nita.app-page-messages .messages-sidebar {
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    body.app-nita.app-page-messages .messages-sidebar-heading {
        padding: 0 2px 5px;
        border: 0;
    }

    body.app-nita.app-page-messages .messages-sidebar-heading h2,
    body.app-nita.app-page-messages .message-start-details {
        display: none !important;
    }

    body.app-nita.app-page-messages .conversation-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        overflow: visible;
    }

    body.app-nita.app-page-messages .conversation-item {
        position: relative;
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 85px;
        padding: 8px 0;
        border: 0;
        border-bottom: 0;
        border-radius: 0;
        background: transparent;
    }

    body.app-nita.app-page-messages .conversation-item .avatar {
        width: 67px;
        height: 67px;
        flex: 0 0 67px;
        border-radius: 50%;
        object-fit: cover;
    }

    body.app-nita.app-page-messages .conversation-item-body {
        display: flex;
        flex: 1 1 auto;
        min-width: 0;
        flex-direction: column;
        gap: 3px;
    }

    body.app-nita.app-page-messages .conversation-item-body strong {
        display: block;
        color: #242825;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.45;
    }

    body.app-nita.app-page-messages .conversation-item-body small {
        display: none;
    }

    body.app-nita.app-page-messages .conversation-item-body > span {
        display: block;
        overflow: hidden;
        color: #a0a4a1;
        font-size: 12px;
        line-height: 1.5;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.app-nita.app-page-messages .conversation-item-meta {
        display: flex;
        flex: 0 0 46px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 8px;
        min-width: 42px;
        text-align: left;
    }

    body.app-nita.app-page-messages .conversation-item-time {
        color: #a0a4a1;
        font-size: 11px;
        line-height: 1.2;
        white-space: nowrap;
    }

    body.app-nita.app-page-messages .conversation-item-meta .conversation-unread {
        display: inline-grid;
        place-items: center;
        min-width: 21px;
        height: 21px;
        padding: 0 6px;
        border-radius: 50%;
        color: #fff;
        background: #f3664f;
        font-size: 11px;
        font-weight: 1000;
        line-height: 1;
    }

    body.app-nita.app-page-messages .nita-official-message-row {
        min-height: 90px;
    }

    body.app-nita.app-page-messages .nita-official-avatar {
        position: relative;
        display: grid;
        place-items: center;
        width: 67px;
        height: 67px;
        flex: 0 0 67px;
        border-radius: 50%;
        color: #fff;
        background: #07c976;
        font-size: 22px;
        font-style: italic;
        font-weight: 1000;
        box-shadow: inset 0 0 0 2px rgba(255,255,255,.8);
    }

    body.app-nita.app-page-messages .nita-official-avatar::before {
        content: '';
        position: absolute;
        inset: 5px;
        border: 2px solid rgba(255,255,255,.45);
        border-radius: 50%;
    }

    body.app-nita.app-page-messages .nita-official-avatar > strong {
        position: relative;
        z-index: 1;
        color: #fff;
        font-size: 22px;
        font-style: italic;
        font-weight: 1000;
    }

    body.app-nita.app-page-messages .nita-official-avatar > i {
        position: absolute;
        top: 7px;
        left: 7px;
        display: grid;
        place-items: center;
        width: 15px;
        height: 15px;
        border: 2px solid #fff;
        border-radius: 50%;
        color: #fff;
        background: #13cb80;
        font-size: 9px;
        font-style: normal;
    }

    body.app-nita.app-page-messages .nita-official-verified {
        display: inline-grid;
        place-items: center;
        width: 14px;
        height: 14px;
        margin-inline-start: 4px;
        border-radius: 50%;
        color: #fff;
        background: #12c77b;
        font-size: 9px;
        vertical-align: 1px;
    }

    body.app-nita.app-page-messages .messages-layout:has(.message-thread-panel .compact-empty) .message-thread-panel {
        display: none;
    }

    body.app-nita.app-page-messages .messages-layout:has(.message-thread-panel .direct-message-list) .messages-sidebar {
        display: none;
    }

    /* Discovery top bar with native Nita-style wordmark and two shortcut icons. */
    body.app-nita.app-discover .site-header {
        min-height: 66px;
        background: rgba(255,255,255,.18);
    }

    body.app-nita.app-discover .header-inner {
        width: calc(100% - 28px);
        min-height: 66px;
        justify-content: space-between;
    }

    body.app-nita.app-discover .brand {
        display: inline-flex !important;
        align-items: center;
        justify-content: flex-end;
        min-width: 0;
        margin-inline-start: 0;
        gap: 0;
    }

    body.app-nita.app-discover .brand > img,
    body.app-nita.app-discover .brand > .brand-mark,
    body.app-nita.app-discover .brand-copy {
        display: none !important;
    }

    body.app-nita.app-discover .brand::after {
        content: 'nita';
        display: block;
        color: #193027;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 37px;
        font-style: italic;
        font-weight: 1000;
        letter-spacing: -2px;
        line-height: 1;
    }

    body.app-nita.app-discover .nita-mobile-discover-controls {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        flex: 0 0 auto;
        margin-inline-end: auto;
    }

    body.app-nita.app-discover .nita-mobile-discover-controls a {
        display: grid;
        place-items: center;
        width: 39px;
        height: 40px;
        color: #24be7c;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }

    body.app-nita.app-discover .nita-mobile-discover-controls a:last-child {
        color: #e5bb29;
    }

    body.app-nita.app-discover .nita-mobile-discover-controls svg {
        display: block;
        width: 30px;
        height: 30px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.15;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    body.app-nita.app-discover .main-nav,
    body.app-nita.app-discover .header-actions {
        display: none !important;
    }

    body.app-nita.app-discover .nita-discover-page {
        width: calc(100% - 24px);
        padding-top: 0;
        padding-bottom: 25px;
    }

    body.app-nita.app-discover .nita-discover-heading {
        display: none;
    }

    body.app-nita.app-discover .nita-discover-search {
        gap: 7px;
        min-height: 37px;
        margin: 0 0 12px;
        padding: 3px 8px 3px 10px;
        border: 1px solid rgba(235,238,235,.8);
        border-radius: 14px;
        background: rgba(255,255,255,.83);
        box-shadow: none;
    }

    body.app-nita.app-discover .nita-discover-search > span {
        font-size: 21px;
    }

    body.app-nita.app-discover .nita-discover-search input {
        min-height: 28px;
        padding: 3px 0;
        font-size: 11px;
    }

    body.app-nita.app-discover .nita-discover-search button {
        min-height: 28px;
        padding: 4px 10px;
        font-size: 10px;
    }

    body.app-nita.app-discover .nita-discover-tabs {
        gap: 17px;
        margin-bottom: 12px;
    }

    body.app-nita.app-discover .nita-discover-tabs a {
        padding-block: 5px 8px;
        font-size: 12px;
    }

    body.app-nita.app-discover .nita-discover-tabs a.is-active {
        font-size: 14px;
        text-decoration-thickness: 4px;
    }

    body.app-nita.app-discover .nita-people-list {
        gap: 13px;
    }

    body.app-nita.app-discover .nita-person-card {
        grid-template-columns: 88px minmax(0, 1fr);
        grid-template-areas: "photo details" "photo action";
        align-items: start;
        gap: 5px 10px;
        padding: 0 0 12px;
        border-bottom: 0;
        background: transparent;
    }

    body.app-nita.app-discover .nita-person-photo {
        aspect-ratio: .88;
        border-radius: 14px;
        box-shadow: none;
    }

    body.app-nita.app-discover .nita-person-details {
        align-self: start;
        padding-top: 2px;
    }

    body.app-nita.app-discover .nita-person-details h2 {
        margin-bottom: 2px;
        color: #292d2a;
        font-size: 14px;
        font-weight: 900;
        line-height: 1.4;
    }

    body.app-nita.app-discover .nita-person-username {
        margin-bottom: 4px;
        font-size: 9px;
    }

    body.app-nita.app-discover .nita-person-details p {
        margin: 3px 0 4px;
        color: #888f8b;
        font-size: 9px;
        line-height: 1.5;
        -webkit-line-clamp: 2;
    }

    body.app-nita.app-discover .nita-person-activity {
        gap: 4px 7px;
        color: #929894;
        font-size: 8px;
    }

    body.app-nita.app-discover .nita-person-actions {
        align-self: end;
        justify-self: start;
    }

    body.app-nita.app-discover .nita-person-actions a {
        min-width: 75px;
        min-height: 28px;
        padding: 4px 11px;
        border: 1.5px solid #22bd79;
        border-radius: 11px;
        color: #16a666;
        background: rgba(255,255,255,.65);
        font-size: 10px;
    }

    body.app-nita.app-discover .nita-discover-banner {
        min-height: 83px;
        padding: 0;
        border-radius: 13px;
        background-image: url('/assets/images/nita-family-ranking.svg');
        background-position: center;
        background-size: cover;
    }

    body.app-nita.app-discover .nita-discover-banner > * {
        display: none !important;
    }

    body.app-nita.app-discover .nita-discover-shortcuts {
        gap: 7px;
        margin-top: 25px;
    }

    /* Newcomer gift ad: fixed left-side ornament, with a dismiss control. */
    body.app-nita:not(.app-admin):not(.app-live-room) .nita-newcomer-gift-float {
        position: fixed;
        left: 10px;
        bottom: calc(80px + env(safe-area-inset-bottom, 0px));
        z-index: 950;
        display: block;
        width: 93px;
        height: 151px;
        pointer-events: none;
    }

    body.app-nita:not(.app-admin):not(.app-live-room) .nita-newcomer-gift-float[hidden] {
        display: none !important;
    }

    body.app-nita .nita-floating-ad-link {
        position: absolute;
        left: 0;
        bottom: 0;
        display: block;
        width: 82px;
        height: 110px;
        pointer-events: auto;
        line-height: 0;
    }

    body.app-nita .nita-floating-ad-link img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        filter: drop-shadow(0 3px 5px rgba(80,65,18,.16));
    }

    body.app-nita .nita-floating-ad-close {
        position: absolute;
        z-index: 3;
        top: -1px;
        left: -2px;
        display: grid;
        place-items: center;
        width: 26px;
        height: 26px;
        padding: 0;
        border: 2px solid #fff;
        border-radius: 50%;
        color: #20b978;
        background: #fff;
        box-shadow: 0 1px 6px rgba(15,80,45,.16);
        font-size: 24px;
        font-weight: 500;
        line-height: 1;
        cursor: pointer;
        pointer-events: auto;
    }

    body.app-nita .nita-floating-ad-mini {
        position: absolute;
        right: -4px;
        bottom: 1px;
        display: grid;
        grid-template-columns: 31px minmax(0, 1fr);
        align-items: center;
        gap: 4px;
        width: 100px;
        min-height: 56px;
        padding: 5px 5px 5px 3px;
        border: 1px solid rgba(255,255,255,.9);
        border-radius: 15px;
        color: #fff;
        background: linear-gradient(145deg, rgba(18,90,55,.94), rgba(17,61,38,.96));
        box-shadow: 0 5px 13px rgba(18,50,28,.19);
        text-decoration: none;
        pointer-events: auto;
    }

    body.app-nita .nita-floating-ad-mini-art {
        display: grid;
        place-items: center;
        width: 31px;
        height: 38px;
        border-radius: 10px;
        color: #ffe375;
        background: linear-gradient(135deg, #38d78a, #07623b);
        font-size: 24px;
    }

    body.app-nita .nita-floating-ad-mini-copy {
        display: flex;
        min-width: 0;
        flex-direction: column;
        gap: 3px;
    }

    body.app-nita .nita-floating-ad-mini-copy strong {
        color: #fff3b0;
        font-size: 8px;
        font-weight: 1000;
        line-height: 1.35;
    }

    body.app-nita .nita-floating-ad-mini-copy small {
        color: #fff;
        font-size: 7px;
        line-height: 1.2;
    }

    body.app-nita .nita-floating-ad-mini-bars {
        position: absolute;
        left: 9px;
        top: 8px;
        display: flex;
        align-items: center;
        gap: 2px;
        height: 13px;
    }

    body.app-nita .nita-floating-ad-mini-bars i {
        width: 3px;
        height: 8px;
        border-radius: 2px;
        background: #13d67c;
    }

    body.app-nita .nita-floating-ad-mini-bars i:nth-child(2) { height: 13px; }
    body.app-nita .nita-floating-ad-mini-bars i:nth-child(3) { height: 10px; }
    body.app-nita .nita-floating-ad-mini-bars i:nth-child(4) { height: 6px; }

    /* Hide only decorative desktop chrome; no form, link or API control is removed. */
    body.app-nita:not(.app-admin) .site-footer {
        margin-bottom: calc(71px + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 390px) {
    body.app-nita.app-home .nita-promo-tile {
        min-height: 67px;
        padding-inline: 6px;
    }

    body.app-nita.app-home .nita-promo-art {
        width: 31px;
        font-size: 25px;
    }

    body.app-nita.app-page-profile .profile-card {
        grid-template-columns: 132px minmax(0, 1fr);
        gap: 10px 8px;
    }

    body.app-nita.app-page-profile .profile-avatar {
        width: 128px;
        height: 153px;
    }

    body.app-nita.app-page-profile .profile-balance-card {
        min-height: 126px;
        padding-inline: 9px;
    }

    body.app-nita.app-page-profile .profile-balance-card-cta {
        padding-inline: 7px;
        font-size: 9px;
    }

    body.app-nita.app-page-messages .conversation-item .avatar,
    body.app-nita.app-page-messages .nita-official-avatar {
        width: 61px;
        height: 61px;
        flex-basis: 61px;
    }

    body.app-nita .nita-floating-ad-link {
        width: 74px;
        height: 100px;
    }

    body.app-nita .nita-floating-ad-mini {
        width: 94px;
    }
}

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


/* Data-backed floating room preview, separate from the newcomer-gift ad. */
@media (max-width: 760px) {
    body.app-nita:not(.app-admin):not(.app-live-room) .nita-live-room-float {
        position: fixed;
        left: 14px;
        bottom: calc(138px + env(safe-area-inset-bottom, 0px));
        z-index: 960;
        width: 140px;
        min-height: 97px;
        padding: 4px;
        border: 1px solid rgba(255,255,255,.94);
        border-radius: 17px;
        background: rgba(255,255,255,.96);
        box-shadow: 0 5px 18px rgba(20,40,30,.18);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }

    body.app-nita .nita-live-room-float[hidden] {
        display: none !important;
    }

    body.app-nita .nita-live-room-close {
        position: absolute;
        z-index: 3;
        top: -8px;
        left: -8px;
        display: grid;
        place-items: center;
        width: 25px;
        height: 25px;
        padding: 0;
        border: 2px solid #fff;
        border-radius: 50%;
        color: #16b777;
        background: #fff;
        box-shadow: 0 1px 7px rgba(10,70,40,.2);
        font-size: 23px;
        line-height: 1;
        cursor: pointer;
        pointer-events: auto;
    }

    body.app-nita .nita-live-room-link {
        display: grid;
        grid-template-columns: 56px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        min-height: 88px;
        color: #202820;
        text-decoration: none;
    }

    body.app-nita .nita-live-room-cover {
        position: relative;
        display: grid;
        place-items: center;
        width: 56px;
        height: 79px;
        overflow: hidden;
        border-radius: 12px;
        background: linear-gradient(150deg, var(--nita-live-room-cover, #12c982), #1b4e77 85%);
    }

    body.app-nita .nita-live-room-cover > img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.app-nita .nita-live-room-cover-fallback {
        color: rgba(255,255,255,.94);
        font-size: 32px;
        font-weight: 900;
    }

    body.app-nita .nita-live-room-equalizer {
        position: absolute;
        right: 6px;
        bottom: 7px;
        display: flex;
        align-items: center;
        gap: 3px;
        height: 17px;
        padding: 4px 6px;
        border-radius: 999px;
        background: rgba(0,0,0,.38);
    }

    body.app-nita .nita-live-room-equalizer i {
        display: block;
        width: 3px;
        height: 7px;
        border-radius: 4px;
        background: #18e48a;
        animation: nita-live-room-bars 850ms ease-in-out infinite alternate;
    }

    body.app-nita .nita-live-room-equalizer i:nth-child(2) { height: 12px; animation-delay: 130ms; }
    body.app-nita .nita-live-room-equalizer i:nth-child(3) { height: 9px; animation-delay: 260ms; }
    body.app-nita .nita-live-room-equalizer i:nth-child(4) { height: 5px; animation-delay: 390ms; }

    body.app-nita .nita-live-room-live-dot {
        position: absolute;
        top: 6px;
        right: 6px;
        width: 8px;
        height: 8px;
        border: 1.5px solid #fff;
        border-radius: 50%;
        background: #11da7d;
        box-shadow: 0 0 0 3px rgba(17,218,125,.2);
    }

    body.app-nita .nita-live-room-copy {
        display: flex;
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        overflow: hidden;
    }

    body.app-nita .nita-live-room-copy strong {
        display: -webkit-box;
        max-width: 100%;
        overflow: hidden;
        color: #232a25;
        font-size: 9px;
        font-weight: 900;
        line-height: 1.4;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    body.app-nita .nita-live-room-copy small {
        display: block;
        max-width: 100%;
        overflow: hidden;
        color: #7b827d;
        font-size: 8px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.app-nita .nita-live-room-copy em {
        display: block;
        color: #0da86a;
        font-size: 8px;
        font-style: normal;
        font-weight: 800;
        white-space: nowrap;
    }
}

@media (max-width: 390px) {
    body.app-nita:not(.app-admin):not(.app-live-room) .nita-live-room-float {
        left: 10px;
        width: 132px;
        bottom: calc(132px + env(safe-area-inset-bottom, 0px));
    }

    body.app-nita .nita-live-room-link {
        grid-template-columns: 51px minmax(0, 1fr);
        gap: 6px;
    }

    body.app-nita .nita-live-room-cover {
        width: 51px;
        height: 74px;
    }
}

@keyframes nita-live-room-bars {
    from { transform: scaleY(.6); opacity: .72; }
    to { transform: scaleY(1.25); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.app-nita .nita-live-room-equalizer i {
        animation: none !important;
    }
}


/* The ranking ornament is mobile-only; avoid its SVG intrinsic size on desktop. */
body.app-nita .messages-ranking-ornament {
    display: none;
}

/* Phase 9 inbox polish: small crossed-swords shortcut and data-backed official avatar. */
@media (max-width: 760px) {
    body.app-nita.app-page-messages .messages-page-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    body.app-nita.app-page-messages .messages-heading-copy {
        flex: 1 1 auto;
        min-width: 0;
    }
    body.app-nita.app-page-messages .messages-ranking-ornament {
        display: grid;
        flex: 0 0 35px;
        place-items: center;
        width: 35px;
        height: 43px;
        margin-inline-start: 8px;
        border-radius: 12px;
        color: #42617b;
        background: transparent;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }
    body.app-nita.app-page-messages .messages-ranking-ornament svg {
        display: block;
        width: 34px;
        height: 36px;
        filter: drop-shadow(0 1px 1px rgba(35, 63, 48, .12));
    }
    body.app-nita.app-page-messages .messages-ranking-ornament:focus-visible {
        outline: 2px solid #13c77a;
        outline-offset: 2px;
    }
    body.app-nita.app-page-messages .nita-official-avatar {
        position: relative;
        overflow: hidden;
        padding: 0;
        background: #08c879;
    }
    body.app-nita.app-page-messages .nita-official-avatar > img {
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        object-fit: cover;
    }
    body.app-nita.app-page-messages .nita-official-avatar::before {
        z-index: 1;
        pointer-events: none;
    }
    body.app-nita.app-page-messages .nita-official-avatar > i {
        z-index: 2;
    }
    body.app-nita.app-page-messages .nita-official-message-row .conversation-item-meta {
        align-self: stretch;
        justify-content: center;
        min-height: 54px;
    }
    body.app-nita.app-page-messages .nita-official-message-row .conversation-item-time {
        display: block;
        min-height: 12px;
    }
}

/* Phase 10 profile polish: visible account badges and accessible copy-ID action. */
@media (max-width: 760px) {
    body.app-nita.app-page-profile .profile-main .profile-account-id {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 5px;
        width: fit-content;
        max-width: 100%;
        min-height: 24px;
        margin: 5px 0 0 auto;
        color: #858b87;
        font-size: 12px;
        text-align: right;
        direction: ltr;
    }

    body.app-nita.app-page-profile .profile-account-id-value {
        white-space: nowrap;
    }

    body.app-nita.app-page-profile .profile-copy-id {
        display: inline-grid;
        flex: 0 0 22px;
        place-items: center;
        width: 22px;
        height: 22px;
        padding: 0;
        border: 0;
        border-radius: 6px;
        color: #77817a;
        background: rgba(115, 126, 118, .09);
        font-size: 13px;
        line-height: 1;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    body.app-nita.app-page-profile .profile-copy-id.is-copied {
        color: #fff;
        background: #0cbd72;
    }

    body.app-nita.app-page-profile .profile-copy-status {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    body.app-nita.app-page-profile .profile-badge-row {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 5px;
        max-width: 100%;
        margin-top: 7px;
    }

    body.app-nita.app-page-profile .profile-main .profile-badge-row .role-tag,
    body.app-nita.app-page-profile .profile-main .profile-badge-row .level-pill,
    body.app-nita.app-page-profile .profile-main .profile-badge-row .svip-badge {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-height: 22px;
        margin: 0;
        padding: 3px 7px;
        border-radius: 8px;
        font-size: 9px;
        font-weight: 900;
        line-height: 1.2;
        white-space: nowrap;
    }

    body.app-nita.app-page-profile .profile-main .profile-badge-row .role-tag {
        border: 1px solid #dbe8df;
        color: #53665a;
        background: #f0f8f2;
    }

    body.app-nita.app-page-profile .profile-role-symbol {
        color: #a38a42;
        font-size: 12px;
    }

    body.app-nita.app-page-profile .profile-main .profile-badge-row .level-pill {
        border: 1px solid #bfead4;
        color: #07864e;
        background: #e6fff1;
    }

    body.app-nita.app-page-profile .profile-main .profile-badge-row .svip-badge {
        border: 1px solid #f0d68b;
        color: #8c6822;
        background: #fff5c9;
    }

    body.app-nita.app-page-profile .profile-stats > a:focus-visible,
    body.app-nita.app-page-profile .profile-copy-id:focus-visible,
    body.app-nita.app-page-profile .profile-balance-card:focus-visible,
    body.app-nita.app-page-profile .profile-quick-action:focus-visible,
    body.app-nita.app-page-profile .profile-premium-banner:focus-visible {
        outline: 2px solid #0cc777;
        outline-offset: 3px;
    }

    body.app-nita.app-page-profile .profile-balance-card,
    body.app-nita.app-page-profile .profile-quick-action {
        transition: transform .16s ease, box-shadow .16s ease;
    }

    body.app-nita.app-page-profile .profile-balance-card:active,
    body.app-nita.app-page-profile .profile-quick-action:active {
        transform: scale(.985);
    }
}

@media (max-width: 390px) {
    body.app-nita.app-page-profile .profile-badge-row {
        gap: 3px;
        margin-top: 5px;
    }

    body.app-nita.app-page-profile .profile-main .profile-badge-row .role-tag,
    body.app-nita.app-page-profile .profile-main .profile-badge-row .level-pill,
    body.app-nita.app-page-profile .profile-main .profile-badge-row .svip-badge {
        min-height: 20px;
        padding: 2px 5px;
        font-size: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.app-nita.app-page-profile .profile-balance-card,
    body.app-nita.app-page-profile .profile-quick-action {
        transition: none !important;
    }
}


/*
 * Phase 11 — remaining mobile screens.
 * Scoped presentation adjustments only; no forms, routes, or application data are changed.
 */
body.app-nita .page-hero,
body.app-nita .premium-page-hero,
body.app-nita .wallet-balance-card,
body.app-nita .wallet-notice,
body.app-nita .create-room-panel,
body.app-nita .voice-lobby-hero,
body.app-nita .svip-tier-card,
body.app-nita .gift-store-card,
body.app-nita .ranking-row,
body.app-nita .settings-card,
body.app-nita .notification-list {
    min-width: 0;
}

body.app-nita :is(.page-hero, .premium-page-hero, .wallet-balance-card, .wallet-notice, .create-room-panel, .voice-lobby-hero, .svip-tier-card, .gift-store-card, .ranking-row, .settings-card, .notification-list) {
    overflow-wrap: anywhere;
}

body.app-nita :is(.page-hero, .premium-page-hero) {
    scroll-margin-top: 16px;
}

body.app-nita :is(.nita-discover-page, .profile-section, .messages-page, .wallet-page, .gifts-page, .svip-page, .rankings-page, .notifications-page, .settings-page, .voice-lobby-page, .public-profile-page) {
    min-width: 0;
}

body.app-nita :is(.wallet-page, .settings-page, .notifications-page, .rankings-page, .gifts-page, .svip-page, .public-profile-page) :is(a, button, input, select, textarea) {
    -webkit-tap-highlight-color: transparent;
}

@media (max-width: 760px) {
    /* People discovery: taller portrait cards and a consistent light surface. */
    body.app-nita.app-discover .nita-people-list {
        gap: 11px;
    }

    body.app-nita.app-discover .nita-person-card {
        grid-template-columns: minmax(92px, 27vw) minmax(0, 1fr);
        grid-template-areas: "photo details" "photo action";
        align-items: start;
        gap: 6px 11px;
        padding: 0 0 11px;
        border-bottom: 1px solid rgba(224, 232, 226, .76);
    }

    body.app-nita.app-discover .nita-person-photo {
        width: 100%;
        aspect-ratio: 0.76;
        border: 1px solid rgba(226, 237, 229, .85);
        border-radius: 17px;
        background: linear-gradient(145deg, #dff8e9, #f6e9fb);
        overflow: hidden;
    }

    body.app-nita.app-discover .nita-person-photo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.app-nita.app-discover .nita-person-details {
        min-width: 0;
    }

    body.app-nita.app-discover .nita-person-details h2,
    body.app-nita.app-discover .nita-person-username,
    body.app-nita.app-discover .nita-person-details p {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-discover .nita-person-activity {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 8px;
        line-height: 1.5;
    }

    body.app-nita.app-discover .nita-discover-search:focus-within {
        border-color: rgba(12, 196, 113, .55);
        box-shadow: 0 0 0 3px rgba(12, 196, 113, .09);
    }

    body.app-nita.app-discover .nita-discover-shortcuts {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin: 19px 0 9px;
    }

    body.app-nita.app-discover .nita-discover-shortcuts > a {
        min-width: 0;
        min-height: 75px;
        padding: 10px 5px;
        border: 1px solid #e8f0e9;
        border-radius: 15px;
        background: rgba(255, 255, 255, .9);
        text-align: center;
    }

    body.app-nita.app-discover .nita-discover-shortcuts > a > span {
        display: grid;
        place-items: center;
        width: 29px;
        height: 29px;
        margin: 0 auto 5px;
        border-radius: 10px;
        color: #09985b;
        background: #e4faec;
        font-size: 18px;
    }

    body.app-nita.app-discover .nita-discover-shortcuts > a strong {
        display: block;
        color: #26342b;
        font-size: 10px;
        line-height: 1.35;
    }

    body.app-nita.app-discover .nita-discover-shortcuts > a small {
        display: block;
        margin-top: 3px;
        color: #8d9990;
        font-size: 8px;
        line-height: 1.35;
    }

    /* Full room catalogue: match the Nita poster-card grid without changing links. */
    body.app-nita.app-page-rooms .page-hero {
        margin: 4px 10px 0;
        padding: 0;
        border: 0;
        border-radius: 19px;
        background: linear-gradient(125deg, #e5ffef, #f5fff8 58%, #fff6d9);
        box-shadow: none;
    }

    body.app-nita.app-page-rooms .page-hero-inner {
        gap: 12px;
        padding: 15px 14px;
    }

    body.app-nita.app-page-rooms .page-hero-inner > div {
        min-width: 0;
    }

    body.app-nita.app-page-rooms .page-hero h1 {
        margin: 0 0 4px;
        color: #25362b;
        font-size: 21px;
        font-weight: 1000;
    }

    body.app-nita.app-page-rooms .page-hero p {
        margin: 0;
        color: #75877b;
        font-size: 10px;
        line-height: 1.65;
    }

    body.app-nita.app-page-rooms .page-hero .section-kicker {
        color: #11a768;
        font-size: 8px;
        letter-spacing: .06em;
    }

    body.app-nita.app-page-rooms .page-hero-inner > .button {
        flex-shrink: 0;
        min-height: 34px;
        border-radius: 11px;
        white-space: nowrap;
    }

    body.app-nita.app-page-rooms .page-hero + .section {
        padding-top: 13px;
    }

    body.app-nita.app-page-rooms .room-grid {
        align-items: stretch;
    }

    body.app-nita.app-page-rooms .room-card {
        height: 100%;
        border: 1px solid #e5eee7;
        border-radius: 16px;
        background: #fff;
        box-shadow: 0 4px 13px rgba(45, 76, 54, .045);
    }

    body.app-nita.app-page-rooms .room-cover {
        overflow: hidden;
        border-radius: 15px 15px 0 0;
    }

    body.app-nita.app-page-rooms .room-cover-photo {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.app-nita.app-page-rooms .room-card-body {
        min-width: 0;
        padding: 10px;
    }

    body.app-nita.app-page-rooms .room-card-body h3 {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-page-rooms .create-room-panel {
        margin-top: 19px;
        padding: 15px;
        border: 1px solid #e3eee6;
        border-radius: 19px;
        background: #fff;
        box-shadow: none;
    }

    body.app-nita.app-page-rooms .create-room-form {
        gap: 12px;
    }

    /* Voice/video lobby shared layout. */
    body.app-nita :is(.voice-lobby-page .voice-room-grid, .public-profile-page .room-grid) {
        align-items: stretch;
    }

    body.app-nita .voice-room-card {
        min-width: 0;
        border: 1px solid #e4eee7;
        border-radius: 17px;
        background: #fff;
        box-shadow: 0 4px 14px rgba(40, 72, 49, .045);
    }

    body.app-nita .voice-room-card-art {
        min-height: 118px;
    }

    body.app-nita .voice-room-card-body {
        min-width: 0;
        padding: 11px;
    }

    body.app-nita .voice-room-card-body h3 {
        overflow-wrap: anywhere;
    }

    body.app-nita .voice-lobby-toolbar {
        align-items: flex-start;
        gap: 9px;
        margin: 17px 0 12px;
    }

    body.app-nita .voice-lobby-toolbar > .button {
        flex: 0 0 auto;
        max-width: 46%;
        white-space: normal;
    }

    body.app-nita .voice-lobby-limit {
        margin-top: 15px;
        padding: 12px;
        border: 1px solid #e3ece5;
        border-radius: 15px;
        background: #fff;
        color: #849188;
        font-size: 9px;
        line-height: 1.8;
    }

    /* Wallet, store and virtual memberships: airy light cards, two-column shop. */
    body.app-nita .wallet-heading {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 14px;
    }

    body.app-nita .wallet-heading > div {
        min-width: 0;
    }

    body.app-nita .wallet-heading h1 {
        color: #26352b;
        font-size: 22px;
        font-weight: 1000;
    }

    body.app-nita .wallet-heading p {
        color: #849188;
        font-size: 10px;
        line-height: 1.7;
    }

    body.app-nita .wallet-balance-card {
        position: relative;
        overflow: hidden;
        padding: 18px 16px;
        border: 1px solid #bfead1;
        border-radius: 21px;
        color: #175739;
        background: linear-gradient(125deg, #d7ffe5, #f0fff5 57%, #fff6c9);
        box-shadow: none;
    }

    body.app-nita .wallet-balance-copy,
    body.app-nita .wallet-balance-copy strong {
        position: relative;
        z-index: 1;
    }

    body.app-nita .wallet-balance-copy > span {
        color: #508566;
        font-size: 11px;
    }

    body.app-nita .wallet-balance-copy strong {
        display: block;
        margin-top: 6px;
        color: #087c48;
        font-size: clamp(25px, 8vw, 34px);
        overflow-wrap: anywhere;
    }

    body.app-nita .wallet-balance-copy strong small {
        font-size: 12px;
    }

    body.app-nita .wallet-balance-copy p {
        max-width: 270px;
        color: #6a8d78;
        font-size: 9px;
        line-height: 1.7;
    }

    body.app-nita .wallet-coin-art {
        color: rgba(13, 167, 95, .13);
        font-size: 100px;
        line-height: .9;
    }

    body.app-nita .wallet-notice {
        gap: 10px;
        margin-top: 11px;
        padding: 12px;
        border: 1px solid #e5eee7;
        border-radius: 16px;
        background: #fff;
        box-shadow: none;
    }

    body.app-nita .wallet-notice strong {
        color: #3f5848;
        font-size: 11px;
    }

    body.app-nita .wallet-notice p {
        color: #87948b;
        font-size: 9px;
        line-height: 1.8;
    }

    body.app-nita .wallet-section {
        margin-top: 21px;
    }

    body.app-nita .wallet-section .section-heading {
        margin-bottom: 10px;
    }

    body.app-nita .wallet-section .section-heading h2 {
        color: #2a3a30;
        font-size: 16px;
        font-weight: 1000;
    }

    body.app-nita .wallet-section .section-heading p {
        color: #8a978e;
        font-size: 9px;
    }

    body.app-nita .wallet-transaction-list {
        overflow: hidden;
        border: 1px solid #e6eee8;
        border-radius: 17px;
        background: #fff;
    }

    body.app-nita .wallet-transaction {
        min-width: 0;
        gap: 9px;
        padding: 12px 10px;
        border-bottom: 1px solid #eef3ef;
    }

    body.app-nita .wallet-transaction:last-child {
        border-bottom: 0;
    }

    body.app-nita .tx-main {
        min-width: 0;
    }

    body.app-nita .tx-main strong {
        color: #35473b;
        font-size: 10px;
    }

    body.app-nita .tx-main small {
        display: block;
        overflow-wrap: anywhere;
        color: #8a978f;
        font-size: 8px;
        line-height: 1.6;
    }

    body.app-nita .tx-amount {
        flex: 0 0 auto;
        font-size: 11px;
    }

    body.app-nita .tx-amount span {
        display: block;
        font-size: 8px;
    }

    body.app-nita .gift-store-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    body.app-nita .gift-store-card {
        min-width: 0;
        padding: 13px 9px;
        border: 1px solid #e4eee6;
        border-radius: 17px;
        background: #fff;
        box-shadow: none;
    }

    body.app-nita .gift-store-art {
        width: 68px;
        height: 68px;
        border: 1px solid #f2e8b8;
        border-radius: 22px;
        background: linear-gradient(140deg, #fff8ce, #fff0f6);
    }

    body.app-nita .gift-store-card h2 {
        color: #35473a;
        font-size: 12px;
    }

    body.app-nita .gift-store-card > strong {
        color: #b18724;
        font-size: 14px;
    }

    body.app-nita .gift-store-card > p {
        color: #8b978e;
    }

    body.app-nita .gift-store-card .button {
        min-height: 34px;
        border-radius: 11px;
        white-space: normal;
    }

    body.app-nita .svip-tier-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    body.app-nita .svip-tier-card {
        min-width: 0;
        padding: 12px 10px;
        border: 1px solid #eee4f8;
        border-radius: 17px;
        background: linear-gradient(155deg, #fff, #fcf8ff);
        box-shadow: none;
    }

    body.app-nita .svip-tier-top {
        gap: 5px;
    }

    body.app-nita .svip-tier-emblem {
        flex: 0 0 31px;
        width: 31px;
        height: 31px;
        font-size: 22px;
    }

    body.app-nita .svip-tier-level {
        font-size: 10px;
    }

    body.app-nita .svip-tier-price strong {
        font-size: 21px;
    }

    body.app-nita .svip-tier-coins,
    body.app-nita .svip-tier-upgrade-cost {
        font-size: 9px;
        overflow-wrap: anywhere;
    }

    body.app-nita .svip-tier-card p {
        font-size: 9px;
        line-height: 1.7;
    }

    body.app-nita .svip-tier-card .button {
        min-height: 36px;
        padding: 8px 7px;
        border-radius: 11px;
        font-size: 9px;
        white-space: normal;
    }

    /* Rankings and public profiles. */
    body.app-nita .rankings-page .rankings-tabs {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
        padding: 4px;
        border: 1px solid #e4ede6;
        border-radius: 15px;
        background: #fff;
    }

    body.app-nita .rankings-page .rankings-tabs a {
        min-width: 0;
        min-height: 35px;
        display: grid;
        place-items: center;
        padding: 5px 4px;
        border-radius: 10px;
        color: #819087;
        font-size: 9px;
        line-height: 1.35;
        text-align: center;
    }

    body.app-nita .rankings-page .rankings-tabs a.active {
        color: #087f4c;
        background: #e4faec;
    }

    body.app-nita .ranking-list {
        gap: 7px;
    }

    body.app-nita .ranking-row {
        min-width: 0;
        border: 1px solid #e5eee7;
        border-radius: 15px;
        background: #fff;
        box-shadow: none;
    }

    body.app-nita .ranking-person {
        min-width: 0;
    }

    body.app-nita .ranking-person strong,
    body.app-nita .ranking-person small,
    body.app-nita .ranking-score strong,
    body.app-nita .ranking-score small {
        overflow-wrap: anywhere;
    }

    body.app-nita .public-profile-cover {
        padding: 12px;
        border-radius: 19px;
    }

    body.app-nita .public-profile-card {
        padding: 12px;
        border-radius: 16px;
        background: rgba(255, 255, 255, .95);
    }

    /* Settings and notifications. */
    body.app-nita .settings-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 11px;
    }

    body.app-nita .settings-card {
        padding: 14px;
        border: 1px solid #e4eee6;
        border-radius: 17px;
        background: #fff;
        box-shadow: none;
    }

    body.app-nita .settings-card .admin-panel-heading h2 {
        font-size: 14px;
    }

    body.app-nita .settings-card .form-stack {
        gap: 12px;
    }

    body.app-nita .settings-card :is(input, select, textarea) {
        max-width: 100%;
        border-radius: 11px;
    }

    body.app-nita .notifications-page .notification-list {
        border: 1px solid #e5eee7;
        border-radius: 17px;
        box-shadow: none;
    }

    body.app-nita .notifications-page .notification-item {
        display: grid;
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 8px;
        padding: 11px;
    }

    body.app-nita .notifications-page .notification-icon {
        width: 36px;
        height: 36px;
        border-radius: 12px;
        font-size: 17px;
    }

    body.app-nita .notifications-page .notification-content {
        min-width: 0;
    }

    body.app-nita .notifications-page .notification-item > form {
        grid-column: 2;
        justify-self: start;
        margin-top: -2px;
    }

    body.app-nita .notifications-page .notification-item > form .button {
        min-height: 30px;
        padding: 6px 12px;
        border-radius: 10px;
    }

    body.app-nita .settings-page-heading > form,
    body.app-nita .settings-page-heading > a {
        flex: 0 0 auto;
    }

    body.app-nita .settings-page-heading > form .button,
    body.app-nita .settings-page-heading > a.button {
        min-height: 34px;
        padding: 7px 9px;
        border-radius: 11px;
        font-size: 9px;
        white-space: normal;
    }

    /* Authentication screens: remove excessive side-by-side layout on phones. */
    body.app-nita .auth-section {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-top: 12px;
        padding-bottom: 22px;
    }

    body.app-nita .auth-aside {
        padding: 16px;
        border-radius: 19px;
    }

    body.app-nita .auth-aside h1 {
        font-size: 25px;
    }

    body.app-nita .auth-panel {
        padding: 16px;
        border-radius: 19px;
    }

    body.app-nita .auth-panel .form-stack {
        gap: 12px;
    }

    body.app-nita .auth-panel :is(input, select, textarea) {
        min-height: 43px;
        border-radius: 12px;
    }

    /* Avoid content hidden behind the fixed navigation and Android safe-area. */
    body.app-nita:not(.app-admin):not(.app-live-room) main {
        padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    }

    body.app-nita:not(.app-admin) :is(.nita-discover-page, .profile-section, .messages-page, .wallet-page, .gifts-page, .svip-page, .rankings-page, .notifications-page, .settings-page, .voice-lobby-page, .public-profile-page) {
        scroll-margin-bottom: calc(85px + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 390px) {
    body.app-nita.app-discover .nita-person-card {
        grid-template-columns: 84px minmax(0, 1fr);
        gap: 5px 9px;
    }

    body.app-nita .gift-store-grid,
    body.app-nita .svip-tier-grid {
        gap: 7px;
    }

    body.app-nita .gift-store-card {
        padding-inline: 7px;
    }

    body.app-nita .wallet-heading {
        flex-wrap: wrap;
    }

    body.app-nita .voice-lobby-toolbar > .button {
        max-width: 42%;
        padding-inline: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.app-nita .ranking-row,
    body.app-nita .gift-store-card,
    body.app-nita .room-card {
        transition: none !important;
    }
}


/* Phase 12 — live-room controls and room detail mobile pass */
/* Restore the dedicated immersive room palette after the general mobile shell. */
body.app-nita.app-live-room {
    --bg: #12131c;
    --surface: #20222e;
    --surface-2: #2b2d3b;
    --text: #f7f7fb;
    --muted: #b9bdca;
    --line: rgba(255, 255, 255, .11);
    background: #12131c;
    color: #f7f7fb;
}

body.app-nita.app-live-room main {
    padding-top: 0;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
}

body.app-nita.app-live-room .voice-room-page {
    width: min(1000px, calc(100% - 32px));
    margin-inline: auto;
    padding-top: 14px;
    padding-bottom: 28px;
}

body.app-nita.app-live-room :is(.voice-stage-panel, .video-gallery-panel, .voice-control-panel) {
    border-color: rgba(255, 255, 255, .1);
    background: linear-gradient(150deg, #20222e, #191a25);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
}

body.app-nita.app-live-room :is(.voice-stage-heading h2, .voice-control-copy h2, .voice-listeners-wrap h3) {
    color: #f7f7fb;
}

body.app-nita.app-live-room :is(.voice-stage-heading p, .voice-control-copy p) {
    color: #b9bdca;
}

body.app-nita.app-live-room .voice-seat {
    border-color: rgba(255, 255, 255, .12);
    color: #e7eaf1;
    background: linear-gradient(150deg, #292b39, #1b1c27);
}

body.app-nita.app-live-room .voice-seat.is-empty {
    border-color: rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .025);
}

body.app-nita.app-live-room .voice-seat-avatar {
    border-color: rgba(8, 207, 120, .24);
    color: #70edb0;
    background: rgba(8, 207, 120, .12);
}

body.app-nita.app-live-room .voice-seat strong {
    color: #f4f5f8;
}

body.app-nita.app-live-room .voice-seat small,
body.app-nita.app-live-room .voice-seat-number {
    color: #a7adbd;
}

body.app-nita.app-live-room .voice-seat.is-taken {
    border-color: rgba(8, 207, 120, .55);
    background: radial-gradient(circle at 50% 15%, rgba(8, 207, 120, .15), transparent 68%), #20232e;
}

body.app-nita.app-live-room .voice-seat.is-mine {
    border-color: rgba(233, 83, 178, .75);
    box-shadow: inset 0 0 0 1px rgba(233, 83, 178, .2);
}

body.app-nita.app-live-room .voice-control-buttons .button {
    min-height: 42px;
    border-radius: 13px;
    font-size: 12px;
    font-weight: 800;
}

body.app-nita.app-live-room .voice-listeners-wrap {
    border-top-color: rgba(255, 255, 255, .1);
}

body.app-nita.app-live-room .voice-listeners > :not(.chat-empty) {
    border-color: rgba(255, 255, 255, .12);
    color: #e5e8ef;
    background: #292b38;
}

body.app-nita.app-live-room .voice-room-disclaimer {
    border-color: rgba(255, 255, 255, .1);
    color: #aeb3c1;
    background: #20222e;
}

body.app-nita.app-live-room [data-voice-debug-panel] {
    color: #e6e8ef;
    border-color: rgba(255, 255, 255, .12);
    border-radius: 15px;
    background: #1b1d28;
}

body.app-nita.app-live-room [data-voice-debug-panel] p {
    color: #b8bdca;
    line-height: 1.8;
}

/* Standard room detail page: keep actions, live chat and gift tools usable on phones. */
body.app-nita.app-page-room .room-detail-section {
    width: min(1000px, calc(100% - 32px));
    margin-inline: auto;
    padding-top: 18px;
    padding-bottom: 28px;
}

body.app-nita.app-page-room .room-detail-cover {
    min-width: 0;
    overflow: hidden;
    border-radius: 22px;
}

body.app-nita.app-page-room .room-detail-cover-photo {
    display: block;
    width: 100%;
    max-height: 260px;
    object-fit: cover;
}

body.app-nita.app-page-room .room-detail-grid {
    align-items: start;
    gap: 16px;
}

body.app-nita.app-page-room :is(.room-detail-main, .room-info-panel, .room-chat-panel) {
    min-width: 0;
}

body.app-nita.app-page-room .room-info-panel {
    border-radius: 18px;
}

body.app-nita.app-page-room .room-detail-description,
body.app-nita.app-page-room .room-chat-helper {
    overflow-wrap: anywhere;
    line-height: 1.8;
}

body.app-nita.app-page-room .room-chat-messages {
    overscroll-behavior: contain;
    overflow-wrap: anywhere;
}

body.app-nita.app-page-room .room-chat-form :is(textarea, input) {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 760px) {
    body.app-nita.app-live-room .site-header {
        min-height: 53px;
        border-bottom-color: rgba(255, 255, 255, .08);
        background: #171923;
    }

    body.app-nita.app-live-room .header-inner {
        width: calc(100% - 20px);
        min-height: 53px;
        padding-block: 5px;
    }

    body.app-nita.app-live-room .voice-room-page {
        width: calc(100% - 20px);
        padding-top: 10px;
        padding-bottom: 22px;
    }

    body.app-nita.app-live-room .voice-room-topbar {
        align-items: center;
        gap: 8px;
        margin-bottom: 10px;
    }

    body.app-nita.app-live-room .voice-room-topbar .text-link {
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        font-size: 11px;
    }

    body.app-nita.app-live-room .voice-room-topbar .voice-live-badge {
        padding: 6px 9px;
        font-size: 9px;
    }

    body.app-nita.app-live-room .voice-room-hero {
        min-height: 0;
        gap: 10px;
        padding: 17px 14px;
        border-radius: 19px;
    }

    body.app-nita.app-live-room .voice-room-hero h1 {
        margin-block: 4px 7px;
        font-size: clamp(20px, 6vw, 27px);
        line-height: 1.35;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-live-room .voice-room-hero p {
        font-size: 10px;
        line-height: 1.7;
    }

    body.app-nita.app-live-room .voice-room-host {
        flex-wrap: wrap;
        gap: 4px 7px;
        margin-top: 8px;
        font-size: 10px;
    }

    body.app-nita.app-live-room .voice-room-emblem {
        width: 58px;
        height: 58px;
        flex-basis: 58px;
        border-radius: 18px;
        font-size: 31px;
    }

    body.app-nita.app-live-room .voice-room-notice,
    body.app-nita.app-live-room .voice-room-error {
        margin-block: 10px;
        padding: 10px 11px;
        border-radius: 12px;
        font-size: 11px;
        line-height: 1.75;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-live-room :is(.voice-stage-panel, .video-gallery-panel, .voice-control-panel) {
        margin-top: 11px;
        padding: 12px;
        border-radius: 17px;
    }

    body.app-nita.app-live-room .voice-stage-heading {
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 11px;
    }

    body.app-nita.app-live-room .voice-stage-heading h2,
    body.app-nita.app-live-room .voice-control-copy h2 {
        font-size: 14px;
        line-height: 1.5;
    }

    body.app-nita.app-live-room .voice-stage-heading p,
    body.app-nita.app-live-room .voice-control-copy p {
        font-size: 10px;
        line-height: 1.7;
    }

    body.app-nita.app-live-room .voice-stage-count {
        flex: 0 0 auto;
        padding: 6px 8px;
        font-size: 9px;
    }

    body.app-nita.app-live-room .voice-seat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.app-nita.app-live-room .voice-seat {
        min-height: 112px;
        gap: 6px;
        padding: 10px 6px;
        border-radius: 14px;
    }

    body.app-nita.app-live-room .voice-seat-avatar {
        width: 38px;
        height: 38px;
        font-size: 20px;
    }

    body.app-nita.app-live-room .voice-seat strong {
        font-size: 10px;
        line-height: 1.45;
    }

    body.app-nita.app-live-room .voice-seat small {
        font-size: 8px;
    }

    body.app-nita.app-live-room .voice-control-buttons {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        margin-top: 11px;
    }

    body.app-nita.app-live-room .voice-control-buttons .button {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        padding: 9px 7px;
        font-size: 10px;
        white-space: normal;
        line-height: 1.4;
    }

    body.app-nita.app-live-room .voice-control-buttons :is([data-voice-join], [data-video-join], [data-voice-leave], [data-video-leave]) {
        grid-column: 1 / -1;
    }

    body.app-nita.app-live-room .voice-listeners-wrap {
        margin-top: 14px;
        padding-top: 12px;
    }

    body.app-nita.app-live-room .voice-listeners-wrap h3 {
        font-size: 13px;
    }

    body.app-nita.app-live-room .voice-listeners {
        gap: 6px;
    }

    body.app-nita.app-live-room .voice-listeners > :not(.chat-empty) {
        max-width: 100%;
        padding: 7px 9px;
        font-size: 9px;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-live-room .video-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    body.app-nita.app-live-room .video-tile {
        min-height: 0;
        aspect-ratio: 4 / 5;
        border-radius: 13px;
    }

    body.app-nita.app-live-room .video-tile-label {
        right: 5px;
        left: 5px;
        bottom: 5px;
        padding: 5px 6px;
        font-size: 8px;
    }

    body.app-nita.app-live-room .video-gallery-empty {
        min-height: 100px;
        padding: 13px;
        font-size: 10px;
    }

    body.app-nita.app-live-room .room-interaction-tools-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    body.app-nita.app-live-room .room-live-interactions {
        padding: 12px;
        border-radius: 17px;
    }

    body.app-nita.app-live-room .room-gift-choice-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 5px;
    }

    body.app-nita.app-live-room .room-gift-choice {
        min-height: 88px;
        padding: 7px 3px;
        border-radius: 11px;
    }

    body.app-nita.app-live-room .room-gift-choice-art {
        width: 35px;
        height: 35px;
        font-size: 23px;
    }

    body.app-nita.app-live-room .room-gift-choice strong {
        font-size: 9px;
    }

    body.app-nita.app-live-room .room-reaction-buttons {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 5px;
    }

    body.app-nita.app-live-room .room-reaction-buttons button {
        min-height: 65px;
        padding: 6px 2px;
    }

    body.app-nita.app-live-room .room-reaction-buttons button span {
        font-size: 21px;
    }

    body.app-nita.app-live-room .room-reaction-buttons button small {
        font-size: 8px;
    }

    body.app-nita.app-live-room .voice-room-disclaimer {
        margin-top: 10px;
        padding: 10px 11px;
        border-radius: 12px;
        font-size: 9px;
    }

    body.app-nita.app-live-room [data-voice-debug-panel] {
        margin-block: 10px !important;
        padding: 10px;
        font-size: 11px;
    }

    body.app-nita.app-live-room [data-voice-debug-log] {
        max-height: 32vh !important;
        font-size: 10px !important;
    }

    body.app-nita.app-page-room .room-detail-section {
        width: calc(100% - 20px);
        padding-top: 12px;
        padding-bottom: 24px;
    }

    body.app-nita.app-page-room .room-detail-cover {
        border-radius: 17px;
    }

    body.app-nita.app-page-room .room-detail-cover-photo {
        max-height: 190px;
    }

    body.app-nita.app-page-room .room-detail-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    body.app-nita.app-page-room .room-info-panel {
        padding: 13px;
        border-radius: 16px;
    }

    body.app-nita.app-page-room .room-live-entry-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }

    body.app-nita.app-page-room .room-live-entry-actions .button,
    body.app-nita.app-page-room .room-info-panel .button {
        width: 100%;
        min-height: 42px;
    }

    body.app-nita.app-page-room .room-chat-messages {
        max-height: 42vh;
        min-height: 150px;
        padding: 9px;
        border-radius: 13px;
    }
}

@media (max-width: 390px) {
    body.app-nita.app-live-room .voice-room-hero {
        padding: 14px 11px;
    }

    body.app-nita.app-live-room .voice-room-emblem {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
        border-radius: 15px;
        font-size: 27px;
    }

    body.app-nita.app-live-room .voice-stage-panel,
    body.app-nita.app-live-room .video-gallery-panel,
    body.app-nita.app-live-room .voice-control-panel {
        padding: 10px;
    }

    body.app-nita.app-live-room .voice-seat {
        min-height: 104px;
    }

    body.app-nita.app-live-room .video-gallery {
        grid-template-columns: minmax(0, 1fr);
    }

    body.app-nita.app-live-room .video-tile {
        aspect-ratio: 16 / 10;
    }

    body.app-nita.app-live-room .room-gift-choice-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


/* Phase 13 — discovery people list and search controls.
   Uses existing profile URLs and database-backed users only. */
body.app-nita.app-discover .nita-discover-results-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    margin: 15px 0 13px;
}

body.app-nita.app-discover .nita-discover-results-heading h2 {
    margin: 3px 0 0;
    color: #202722;
    font-size: 17px;
    font-weight: 950;
    line-height: 1.35;
}

body.app-nita.app-discover .nita-discover-result-count {
    flex: 0 0 auto;
    padding: 5px 9px;
    border: 1px solid #dff2e5;
    border-radius: 999px;
    color: #178a5a;
    background: #effbf3;
    font-size: 10px;
    font-weight: 850;
}

body.app-nita.app-discover .nita-discover-tabs {
    direction: rtl;
    align-items: center;
    justify-content: flex-start;
    gap: 23px;
    padding: 0 2px;
    border-bottom: 1px solid rgba(223, 230, 225, .72);
}

body.app-nita.app-discover .nita-discover-tabs a {
    position: relative;
    color: #7e8781;
    text-decoration: none;
    transition: color .16s ease;
}

body.app-nita.app-discover .nita-discover-tabs a.is-active {
    color: #17221b;
    text-decoration: none;
}

body.app-nita.app-discover .nita-discover-tabs a.is-active::after {
    position: absolute;
    inset-inline: -3px;
    bottom: 1px;
    height: 5px;
    border-radius: 99px;
    background: #8df2a8;
    content: "";
    z-index: -1;
}

body.app-nita.app-discover .nita-person-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 7px;
    min-width: 0;
}

body.app-nita.app-discover .nita-person-title-row h2 {
    min-width: 0;
    margin: 0;
}

body.app-nita.app-discover .nita-person-role {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 6px;
    border-radius: 999px;
    color: #168554;
    background: #e4f9eb;
    font-size: 8px;
    font-weight: 900;
    line-height: 1.5;
}

body.app-nita.app-discover .nita-person-role-admin {
    color: #9a6a08;
    background: #fff3bf;
}

body.app-nita.app-discover .nita-person-role-moderator {
    color: #5f50af;
    background: #eee8ff;
}

body.app-nita.app-discover .nita-person-photo {
    position: relative;
}

body.app-nita.app-discover .nita-person-live-mark {
    position: absolute;
    inset-inline-end: 5px;
    bottom: 5px;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    background: #0bc97a;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .14);
    font-size: 14px;
    line-height: 1;
}

body.app-nita.app-discover .nita-person-room-count {
    color: #14965c;
}

body.app-nita.app-discover .nita-mobile-discover-controls a:last-child {
    color: #e65bb8;
}

body.app-nita.app-discover .nita-discover-empty {
    border-radius: 22px;
}

body.app-nita.app-discover .nita-discover-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    padding: 7px 14px;
    border: 1px solid #b9ebcb;
    border-radius: 12px;
    color: #128a55;
    background: #effbf3;
    text-decoration: none;
}

@media (max-width: 760px) {
    body.app-nita.app-discover .nita-discover-page {
        padding-top: 1px;
    }

    body.app-nita.app-discover .nita-discover-results-heading {
        margin: 11px 0 10px;
    }

    body.app-nita.app-discover .nita-discover-results-heading h2 {
        font-size: 15px;
    }

    body.app-nita.app-discover .nita-discover-result-count {
        padding: 4px 8px;
        font-size: 9px;
    }

    body.app-nita.app-discover .nita-discover-tabs {
        gap: 21px;
        margin-bottom: 13px;
        padding-bottom: 2px;
    }

    body.app-nita.app-discover .nita-person-card {
        grid-template-columns: clamp(72px, 23vw, 94px) minmax(0, 1fr) 66px;
        grid-template-areas: "photo details action";
        align-items: center;
        gap: 6px 9px;
        padding: 0 0 13px;
        border-bottom: 1px solid rgba(224, 232, 226, .78);
    }

    body.app-nita.app-discover .nita-person-photo {
        position: relative;
        display: block;
        width: 100%;
        aspect-ratio: .79;
        border-radius: 16px;
        overflow: hidden;
        background: linear-gradient(145deg, #e1f8eb, #f7eafa);
    }

    body.app-nita.app-discover .nita-person-photo img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.app-nita.app-discover .nita-person-details {
        min-width: 0;
        padding: 0;
    }

    body.app-nita.app-discover .nita-person-title-row h2 {
        color: #222a25;
        font-size: 13px;
        font-weight: 950;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-discover .nita-person-username {
        display: inline-block;
        max-width: 100%;
        margin: 2px 0 4px;
        color: #858e88;
        font-size: 9px;
        overflow-wrap: anywhere;
    }

    body.app-nita.app-discover .nita-person-details p {
        display: -webkit-box;
        margin: 2px 0 5px;
        overflow: hidden;
        color: #7f8982;
        font-size: 9px;
        line-height: 1.55;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    body.app-nita.app-discover .nita-person-activity {
        display: flex;
        flex-wrap: wrap;
        gap: 3px 7px;
        color: #8e9791;
        font-size: 8px;
        line-height: 1.45;
    }

    body.app-nita.app-discover .nita-person-actions {
        align-self: center;
        justify-self: stretch;
        min-width: 0;
    }

    body.app-nita.app-discover .nita-person-actions a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        min-height: 32px;
        padding: 5px 4px;
        border: 1.5px solid #27bf7c;
        border-radius: 11px;
        color: #18a667;
        background: rgba(255, 255, 255, .82);
        font-size: 9px;
        font-weight: 900;
        text-align: center;
        text-decoration: none;
        white-space: normal;
    }

    body.app-nita.app-discover .nita-person-actions a:active {
        background: #e7faee;
        transform: scale(.98);
    }

    body.app-nita.app-discover .nita-person-live-mark {
        inset-inline-end: 4px;
        bottom: 4px;
        width: 21px;
        height: 21px;
        font-size: 12px;
    }

    body.app-nita.app-discover .nita-discover-banner {
        margin-block: 2px 5px;
        min-height: 77px;
    }

    body.app-nita.app-discover .nita-discover-shortcuts {
        margin-top: 21px;
    }
}

@media (max-width: 390px) {
    body.app-nita.app-discover .nita-person-card {
        grid-template-columns: 70px minmax(0, 1fr) 59px;
        gap: 5px 7px;
    }

    body.app-nita.app-discover .nita-person-photo {
        aspect-ratio: .76;
        border-radius: 13px;
    }

    body.app-nita.app-discover .nita-person-title-row h2 {
        font-size: 12px;
    }

    body.app-nita.app-discover .nita-person-actions a {
        min-height: 30px;
        font-size: 8px;
    }
}