/* Mobile Community extracted feed and room surface styles. */

:root {
    --community-bg: #000000;
    --community-surface: rgba(255, 255, 255, 0.045);
    --community-card: rgba(255, 255, 255, 0.06);
    --community-text: #ffffff;
    --community-muted: rgba(255, 255, 255, 0.62);
    --community-faint: rgba(255, 255, 255, 0.46);
    --community-border: rgba(255, 255, 255, 0.09);
    --community-raised-shadow: 0 18px 46px rgba(0, 0, 0, 0.20);
}

html[data-theme="light"] {
    --community-bg: #ffffff;
    --community-surface: #ffffff;
    --community-card: #ffffff;
    --community-text: #050505;
    --community-muted: rgba(5, 5, 5, 0.58);
    --community-faint: rgba(5, 5, 5, 0.42);
    --community-border: rgba(5, 5, 5, 0.10);
    --community-raised-shadow: 0 10px 24px rgba(5, 5, 5, 0.055);
}

html:has(body.light-theme),
body.light-theme {
    --community-bg: #ffffff;
    --community-surface: #ffffff;
    --community-card: #ffffff;
    --community-text: #050505;
    --community-muted: rgba(5, 5, 5, 0.58);
    --community-faint: rgba(5, 5, 5, 0.42);
    --community-border: rgba(5, 5, 5, 0.10);
    --community-raised-shadow: 0 10px 24px rgba(5, 5, 5, 0.055);
}

html[data-theme="light-accent"],
html:has(body.light-accent-theme),
body.light-accent-theme {
    --community-bg: color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 5%, #ffffff 95%);
    --community-surface: color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 6%, #ffffff 94%);
    --community-card: rgba(255, 255, 255, 0.88);
    --community-text: #050505;
    --community-muted: rgba(5, 5, 5, 0.62);
    --community-faint: rgba(5, 5, 5, 0.44);
    --community-border: color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 16%, rgba(5, 5, 5, 0.12));
    --community-raised-shadow: 0 14px 34px rgba(5, 5, 5, 0.07);
}

/* community-feed-base */
#community-main-area {
    display: none;
}

#community-feed-shell {
    display: none;
}

html body.community-active #community-main-area {
    display: block;
}

html body.community-active #community-feed-shell {
    display: block;
    padding: calc(var(--mobile-app-header-height, 116px) + 12px) 16px 12px;
    background:
        radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--primary-color, #ff4d2e) 20%, transparent), transparent 36%),
        #000000;
    color: #ffffff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-sizing: border-box;
}

html body.community-active #arena-grid {
    padding-top: 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
    gap: 14px !important;
    background: #000000 !important;
}

.community-room-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.community-room-section-head h2 {
    margin: 0;
    color: var(--community-text);
    font-size: clamp(23px, 7vw, 34px);
    line-height: 1;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.community-room-section-head span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    color: var(--community-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.community-room-section-head i {
    color: var(--primary-color, #ff4d2e);
    font-size: 8px;
}

.community-room-rail {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 2px 14px;
    margin: 0 -2px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.community-room-rail::-webkit-scrollbar {
    display: none;
}

.community-room-card {
    flex: 0 0 132px;
    min-height: 96px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 7px;
    padding: 12px 10px 10px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--community-text) 7%, transparent);
    background: var(--community-card);
    background-size: cover;
    background-position: center;
    color: var(--community-text);
    box-shadow: none;
    scroll-snap-align: start;
    overflow: hidden;
    position: relative;
}

.community-room-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--community-bg) 74%, transparent));
    pointer-events: none;
}

.community-room-card.is-active {
    border-color: color-mix(in srgb, var(--community-text) 20%, transparent);
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e);
}

.community-room-card > * {
    position: relative;
    z-index: 1;
}

.community-room-icon {
    display: none !important;
}

.community-room-title {
    max-width: 100%;
    color: var(--community-text);
    font-size: 15px;
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.community-room-count {
    color: var(--community-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.community-feed-modes {
    display: inline-flex;
    gap: 22px;
    margin-top: 2px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
}

.community-feed-modes button {
    min-width: 0;
    min-height: 34px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--community-muted);
    box-shadow: none;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0;
    padding: 0;
}

.community-feed-modes button.is-active {
    background: transparent;
    color: var(--community-text);
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e);
}

/* Flat feed rows, in the spirit of the virtual map post list: no card box, no
   shadow, no radius — just content separated by a hairline. The container was
   competing with the post; the post should be the only thing you see. */
html body.community-active #arena-grid .mobile-community-card {
    box-sizing: border-box !important;
    cursor: pointer !important;
    margin: 0 !important;
    max-width: 100% !important;
    padding: 18px 20px 16px !important;
    position: relative !important;
    transition: background 0.18s ease !important;
    border-radius: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    overflow: visible !important;
}

/* Press feedback replaces the old raised-card affordance. */
html body.community-active #arena-grid .mobile-community-card:active {
    background: color-mix(in srgb, var(--community-text) 3.5%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-card:last-child {
    border-bottom: 0 !important;
}

/* The shape variants no longer need their own container treatment; they keep
   the same flat row so the feed reads as one continuous surface. */
html body.community-active #arena-grid .mobile-community-card.community-feed-hero,
html body.community-active #arena-grid .mobile-community-card.community-feed-media,
html body.community-active #arena-grid .mobile-community-card.community-feed-note,
html body.community-active #arena-grid .mobile-community-card.community-feed-essay,
html body.community-active #arena-grid .mobile-community-card.signal-short,
html body.community-active #arena-grid .mobile-community-card.signal-medium,
html body.community-active #arena-grid .mobile-community-card.signal-long {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-card > div:first-of-type {
    align-items: flex-start !important;
    margin-bottom: 12px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    justify-content: flex-start !important;
    width: 100% !important;
    margin-bottom: 0 !important;
}

/* Post copy is body text, not a headline. The old 30px/950 treatment turned
   every post into a billboard and forced the tall card around it. */
html body.community-active #arena-grid .mobile-community-card p {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
    font-size: 15px !important;
    line-height: 1.42 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html body.community-active #arena-grid .mobile-community-message {
    text-align: left !important;
    margin-bottom: 10px !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    max-width: none !important;
    margin: 10px 0 12px !important;
    justify-content: flex-start !important;
}

/* The media is the frame — it does not need a bordered well around it. */
html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    max-height: none !important;
    border-radius: 14px !important;
    background: transparent !important;
    border: 0 !important;
}

/* Stills keep their own proportions; 16/9 with cover was slicing the top and
   bottom off every portrait photo. Capped so one tall image can't push the
   next post out of view in a mixed-author feed. */
html body.community-active #arena-grid .mobile-community-media-stage img {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    max-height: 460px !important;
    border-radius: 20px !important;
    object-fit: contain !important;
    background: var(--community-surface) !important;
    border-color: var(--community-border) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 420px !important;
    aspect-ratio: auto !important;
    border-radius: 20px !important;
    object-fit: contain !important;
    background: #000000 !important;
    border-color: var(--community-border) !important;
    pointer-events: auto !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    font-size: clamp(19px, 5vw, 25px) !important;
    line-height: 1.18 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: -2px auto 14px !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.12em !important;
    opacity: 0.58 !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-room-source i {
    font-size: 10px !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid [data-community-action="open-post"]:active {
    background: color-mix(in srgb, var(--community-text) 2%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-actions button:hover {
    background: color-mix(in srgb, var(--community-text) 6%, transparent) !important;
    color: var(--community-text) !important;
}

html body.community-active #arena-grid [data-community-action="post-menu"]:hover {
    opacity: 0.8 !important;
}

html body.community-active #arena-grid [data-community-action="delete-post"]:hover {
    background: rgba(239, 68, 68, 0.1) !important;
}

.community-post-menu-trigger {
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
    opacity: 0.44;
    padding: 4px 8px;
    transition: opacity 0.2s ease;
    -webkit-appearance: none;
    appearance: none;
}

.community-post-menu-trigger:hover {
    opacity: 0.82;
}

.community-post-menu-scrim {
    position: fixed;
    inset: 0;
    z-index: 130040;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.community-post-menu-scrim[hidden] {
    display: none !important;
}

.community-post-menu {
    position: fixed;
    top: auto;
    left: 14px;
    right: 14px;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    width: auto;
    min-width: 0;
    z-index: 130050;
    overflow: hidden;
    border-radius: 18px;
    background: var(--community-card);
    border: 1px solid var(--community-border);
    box-shadow: 0 18px 54px rgba(0, 0, 0, 0.22);
    transform: none;
}

.community-post-action-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 130060;
    display: block;
    overflow: hidden;
    padding: 10px 14px calc(14px + env(safe-area-inset-bottom, 0px));
    border-radius: 22px 22px 0 0;
    background: var(--community-card);
    border-top: 1px solid var(--community-border);
    box-shadow: 0 -16px 44px rgba(0, 0, 0, 0.18);
}

.community-post-action-sheet[hidden] {
    display: none !important;
}

.community-post-action-sheet__handle {
    width: 38px;
    height: 4px;
    margin: 0 auto 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--community-text) 18%, transparent);
}

.community-post-menu-wrap {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 8;
}

.community-post-menu[hidden] {
    display: none !important;
}

.community-post-edit,
.community-post-delete {
    width: 100%;
    min-height: 52px;
    padding: 13px 16px;
    background: transparent;
    border: 0;
    text-align: left;
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
    transition: background 0.2s ease;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 14px;
}

.community-post-edit + .community-post-delete {
    margin-top: 4px;
}

.community-post-delete {
    color: #ef4444;
    -webkit-text-fill-color: #ef4444;
}

.community-post-edit {
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
}

.community-post-edit:hover {
    background: color-mix(in srgb, var(--community-text) 9%, transparent);
}

.community-post-delete:hover,
.community-comment-delete:hover {
    background: rgba(239, 68, 68, 0.10);
}

.community-detail-action {
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

.community-detail-action i {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

.community-owner-sheet {
    position: fixed;
    inset: 0;
    z-index: 130060;
    display: none;
    align-items: flex-end;
    justify-content: center;
}

.community-owner-sheet.is-open {
    display: flex;
}

.community-owner-sheet__scrim {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.38);
}

.community-owner-sheet__panel {
    position: relative;
    z-index: 1;
    width: min(100%, 560px);
    max-height: calc(88vh - env(safe-area-inset-top, 0px));
    padding: 10px 18px calc(18px + env(safe-area-inset-bottom, 0px));
    border-radius: 24px 24px 0 0;
    background: var(--community-bg);
    border: 1px solid var(--community-border);
    box-shadow: 0 -22px 60px rgba(0, 0, 0, 0.26);
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
}

.community-owner-sheet__handle {
    width: 42px;
    height: 5px;
    margin: 0 auto 16px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--community-text) 18%, transparent);
}

.community-owner-sheet__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.community-owner-sheet__eyebrow {
    display: block;
    margin-bottom: 6px;
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.community-owner-sheet__head h2 {
    margin: 0;
    font-size: 22px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.community-owner-sheet__icon-btn {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--community-text) 8%, transparent);
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
}

.community-owner-sheet__edit label {
    display: block;
    margin-bottom: 8px;
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

/* Community owner sheet controls stay light; JS reapplies these inline because broad theme rules target every textarea/button. */
.community-owner-sheet__edit textarea {
    width: 100%;
    min-height: 148px;
    resize: vertical;
    box-sizing: border-box;
    border: 1px solid rgba(15, 23, 42, 0.14);
    border-radius: 18px;
    padding: 14px;
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;
    caret-color: #050505 !important;
    color-scheme: light !important;
    font: inherit;
    font-size: 16px;
    line-height: 1.35;
    outline: none;
    box-shadow: inset 0 0 0 9999px #ffffff !important;
}

.community-owner-sheet__edit textarea:focus {
    border-color: var(--primary-color, #ff4d2e);
}

.community-owner-sheet__delete {
    display: none;
}

.community-owner-sheet__delete p {
    margin: 0 0 18px;
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
    font-size: 17px;
    line-height: 1.35;
    font-weight: 850;
}

.community-owner-sheet__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    margin-top: 18px;
}

.community-owner-sheet__secondary,
.community-owner-sheet__primary,
.community-owner-sheet__danger {
    min-height: 52px;
    border: 0;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 950;
    letter-spacing: 0;
}

.community-owner-sheet__secondary {
    background: color-mix(in srgb, var(--community-text) 8%, transparent);
    color: var(--community-text);
    -webkit-text-fill-color: var(--community-text);
}

.community-owner-sheet__primary {
    background: color-mix(in srgb, var(--primary-color, #ff4d2e) 88%, #ffffff 12%);
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
}

.community-owner-sheet__primary:disabled,
.community-owner-sheet__primary[disabled],
.community-owner-sheet__primary.is-disabled {
    background: rgba(15, 23, 42, 0.10) !important;
    color: rgba(15, 23, 42, 0.36) !important;
    -webkit-text-fill-color: rgba(15, 23, 42, 0.36) !important;
    opacity: 1 !important;
}

.community-owner-sheet__danger {
    display: none;
    background: #ef4444;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
}

.community-owner-sheet.is-deleting .community-owner-sheet__edit,
.community-owner-sheet.is-deleting .community-owner-sheet__primary {
    display: none;
}

.community-owner-sheet.is-deleting .community-owner-sheet__delete,
.community-owner-sheet.is-deleting .community-owner-sheet__danger {
    display: block;
}

.community-owner-sheet.is-busy button,
.community-owner-sheet.is-busy textarea {
    pointer-events: none;
    opacity: 0.58;
}

html[data-theme^="light"] body.community-active .community-owner-sheet__panel,
body.light-theme.community-active .community-owner-sheet__panel,
body.light-accent-theme.community-active .community-owner-sheet__panel {
    background: #ffffff;
    color: #050505;
    -webkit-text-fill-color: #050505;
}

.community-replies-count {
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    font-size: 11px;
    letter-spacing: 0;
    text-transform: none;
}

.comment-time {
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    font-size: 10px;
}

.community-comment-delete {
    background: transparent;
    border: 0;
    color: var(--community-muted);
    -webkit-text-fill-color: var(--community-muted);
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 10px;
    margin-left: auto;
}

/* community-all-rail-feature */
    html body.community-active .community-room-card.is-all {
        flex-basis: 188px !important;
        min-height: 104px !important;
        padding: 12px 13px 11px !important;
        justify-content: flex-end !important;
        border-color: color-mix(in srgb, var(--community-text) 7%, transparent) !important;
        box-shadow: none !important;
    }

    html body.community-active .community-room-card.is-all.is-active {
        border-color: color-mix(in srgb, var(--community-text) 20%, transparent) !important;
        box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e) !important;
    }

    html body.community-active .community-room-card.is-all .community-room-kicker {
        color: var(--community-text) !important;
        font-size: 9px !important;
        font-weight: 950 !important;
        letter-spacing: 0.14em !important;
        text-transform: uppercase !important;
        line-height: 1 !important;
        margin-bottom: 2px !important;
    }

    html body.community-active .community-room-card.is-all .community-room-title {
        font-size: 21px !important;
        letter-spacing: -0.035em !important;
        line-height: 0.98 !important;
    }

    html body.community-active .community-room-card.is-all .community-room-preview {
        display: block !important;
        width: 100% !important;
        color: var(--community-muted) !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        line-height: 1.18 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body.community-active .community-room-card.is-all .community-room-count {
        margin-top: 2px !important;
    }

    html body.community-active .community-room-card:not(.is-active) {
        border-color: color-mix(in srgb, var(--community-text) 7%, transparent) !important;
        box-shadow: none !important;
    }

/* community-main-feed-text-pass */
    html body.community-active #arena-grid {
        padding: 14px 0 calc(104px + env(safe-area-inset-bottom, 0px)) !important;
        background: var(--community-bg) !important;
    }

    html body.community-active #arena-grid .mobile-community-card {
        box-sizing: border-box !important;
        cursor: pointer !important;
        margin: 0 !important;
        max-width: 100% !important;
        padding: 18px 16px 20px !important;
        position: relative !important;
        transition: background 0.2s ease !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        border-bottom: 1px solid var(--community-border) !important;
        color: var(--community-text) !important;
        -webkit-text-fill-color: var(--community-text) !important;
    }

    html body.community-active #arena-grid .mobile-community-card:first-child {
        padding-top: 8px !important;
    }

    html body.community-active #arena-grid .mobile-community-card.community-feed-hero,
    html body.community-active #arena-grid .mobile-community-card.community-feed-media,
    html body.community-active #arena-grid .mobile-community-card.community-feed-note,
    html body.community-active #arena-grid .mobile-community-card.community-feed-essay {
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    html body.community-active #arena-grid .mobile-community-card > div:first-of-type {
        margin-bottom: 10px !important;
    }

    html body.community-active #arena-grid .mobile-community-meta-row {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 9px !important;
    }

    html body.community-active #arena-grid .profile-avatar {
        width: 38px !important;
        height: 38px !important;
        border-radius: 12px !important;
    }

    html body.community-active #arena-grid .mobile-community-author {
        max-width: 38vw !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
    }

    html body.community-active #arena-grid .mobile-community-timestamp {
        font-size: 10px !important;
        letter-spacing: 0.14em !important;
        opacity: 0.48 !important;
    }

    html body.community-active #arena-grid .mobile-community-message {
        margin: 0 0 12px !important;
    }

    html body.community-active #arena-grid .mobile-community-message p,
    html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
    html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
    html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
    html body.community-active #arena-grid .community-feed-essay .mobile-community-message p {
        max-width: none !important;
        margin: 0 !important;
        text-align: left !important;
        font-size: clamp(18px, 5.1vw, 24px) !important;
        line-height: 1.16 !important;
        font-weight: 400 !important;
        letter-spacing: -0.02em !important;
    }

    html body.community-active #arena-grid .community-feed-note .mobile-community-message p {
        font-size: clamp(17px, 4.7vw, 21px) !important;
    }

    html body.community-active #arena-grid .community-feed-essay .mobile-community-message p {
        font-size: clamp(16px, 4.35vw, 19px) !important;
        line-height: 1.34 !important;
        color: color-mix(in srgb, var(--community-text) 88%, transparent) !important;
        -webkit-text-fill-color: color-mix(in srgb, var(--community-text) 88%, transparent) !important;
    }

    html body.community-active #arena-grid .mobile-community-media-stage {
        margin: 10px 0 13px !important;
        width: 100% !important;
        max-width: none !important;
    }

    html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
    html body.community-active #arena-grid .mobile-community-media-stage img,
    html body.community-active #arena-grid .mobile-community-media-stage iframe {
        width: 100% !important;
        border-radius: 16px !important;
        box-shadow: none !important;
        border: 1px solid var(--community-border) !important;
        background: var(--community-surface) !important;
    }

    html body.community-active #arena-grid .mobile-community-media-stage video {
        width: 100% !important;
        height: auto !important;
        max-height: 420px !important;
        aspect-ratio: auto !important;
        border-radius: 16px !important;
        box-shadow: none !important;
        border: 1px solid var(--community-border) !important;
        background: #000000 !important;
        object-fit: contain !important;
        pointer-events: auto !important;
    }

    html body.community-active #arena-grid .mobile-community-media-stage img {
        height: auto !important;
        aspect-ratio: auto !important;
        max-height: 460px !important;
        object-fit: contain !important;
    }

/* community-section-surface-pass */
    html body.community-active .community-surface-sections {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 16px 30px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.075) !important;
    }

    html body.community-active .community-surface-block {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.community-active .community-surface-block + .community-surface-block {
        margin-top: 38px !important;
    }

    html body.community-active .community-feed-section-label {
        margin-top: 42px !important;
    }

    html body.community-active .community-surface-heading,
    html body.community-active .community-feed-section-label {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        margin-bottom: 12px !important;
        color: #ffffff !important;
    }

    html body.community-active .community-surface-heading span,
    html body.community-active .community-feed-section-label span {
        font-size: 12px !important;
        font-weight: 950 !important;
        letter-spacing: 0.14em !important;
        text-transform: uppercase !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }

    html body.community-active .community-pulse-strip .community-surface-heading span,
    html body.community-active .community-feed-section-label span {
        font-size: 11px !important;
        letter-spacing: 0.18em !important;
        color: rgba(255, 255, 255, 0.78) !important;
    }

    html body.community-active .community-surface-heading small,
    html body.community-active .community-feed-section-label small {
        color: rgba(255, 255, 255, 0.46) !important;
        font-size: 11px !important;
        font-weight: 900 !important;
        letter-spacing: 0.08em !important;
        text-transform: uppercase !important;
    }

    html body.community-active .community-spotlight-card {
        width: 100% !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 14px !important;
        text-align: left !important;
        border: 1px solid var(--community-border) !important;
        border-radius: 18px !important;
        padding: 14px !important;
        color: var(--community-text) !important;
        background: var(--community-card) !important;
        box-shadow: none !important;
        overflow: hidden !important;
        position: relative !important;
    }

    html body.community-active .community-spotlight-card.has-attachment {
        background: var(--community-card) !important;
    }

    html body.community-active .community-spotlight-copy {
        position: relative !important;
        z-index: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body.community-active .community-spotlight-attachment {
        width: 84px !important;
        height: 84px !important;
        border-radius: 18px !important;
        flex: 0 0 auto !important;
        background:
            linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.18)),
            var(--community-spotlight-thumb),
            #101010 !important;
        background-size: cover, cover, cover !important;
        background-position: center !important;
        border: 1px solid var(--community-border) !important;
    }

    html body.community-active .community-spotlight-room {
        width: fit-content !important;
        max-width: 100% !important;
        padding: 5px 9px !important;
        border-radius: 999px !important;
        background: color-mix(in srgb, var(--community-text) 6%, transparent) !important;
        color: var(--community-text) !important;
        font-size: 10px !important;
        font-weight: 950 !important;
        letter-spacing: 0.12em !important;
        text-transform: uppercase !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body.community-active .community-spotlight-copy strong {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        color: #ffffff !important;
        font-size: clamp(22px, 6vw, 30px) !important;
        font-weight: 950 !important;
        line-height: 1.02 !important;
        letter-spacing: -0.035em !important;
    }

    html body.community-active .community-spotlight-copy > span:last-child {
        color: rgba(255, 255, 255, 0.72) !important;
        font-size: 12px !important;
        font-weight: 850 !important;
    }

    html body.community-active .community-pulse-list {
        display: grid !important;
        gap: 10px !important;
        overflow: visible !important;
        padding: 0 !important;
        margin: 0 !important;
        scrollbar-width: auto !important;
        -webkit-overflow-scrolling: auto !important;
    }

    html body.community-active .community-pulse-list {
        grid-template-columns: 1fr !important;
    }

    html body.community-active .community-pulse-list::-webkit-scrollbar {
        display: none !important;
    }

    html body.community-active .community-pulse-item {
        width: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 11px !important;
        padding: 10px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
        color: #ffffff !important;
        text-align: left !important;
        box-shadow: none !important;
        overflow: hidden !important;
        position: relative !important;
    }

    html body.community-active .community-section-avatar {
        width: 36px !important;
        height: 36px !important;
        flex: 0 0 36px !important;
        border-radius: 12px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        background: color-mix(in srgb, var(--primary-color, #ff4d2e) 22%, #151515) !important;
        color: #ffffff !important;
        font-size: 16px !important;
        font-weight: 950 !important;
    }

    html body.community-active .community-pulse-thumb {
        width: 44px !important;
        height: 44px !important;
        flex: 0 0 44px !important;
        border-radius: 13px !important;
        display: inline-block !important;
        overflow: hidden !important;
        background:
            linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.18)),
            var(--community-pulse-thumb),
            #101010 !important;
        background-size: cover, cover, cover !important;
        background-position: center !important;
        border: 1px solid rgba(255, 255, 255, 0.11) !important;
    }

    html body.community-active .community-pulse-item > span:last-child {
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 3px !important;
        position: relative !important;
        z-index: 1 !important;
    }

    html body.community-active .community-pulse-item strong {
        color: #ffffff !important;
        font-size: 14px !important;
        font-weight: 950 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body.community-active .community-pulse-item small {
        display: -webkit-box !important;
        -webkit-line-clamp: 1 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        color: rgba(255,255,255,0.55) !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
    }

    html body.community-active .community-pulse-item em {
        display: block !important;
        color: color-mix(in srgb, var(--primary-color, #ff4d2e) 70%, rgba(255,255,255,0.55)) !important;
        font-size: 10px !important;
        font-style: normal !important;
        font-weight: 900 !important;
        letter-spacing: 0.08em !important;
        text-transform: uppercase !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body.community-active .community-feed-section-label {
        margin-bottom: 12px !important;
        padding-top: 0 !important;
    }

/* community-feed-top-rhythm-cleanup */
    html body.community-active #community-feed-shell {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        padding-bottom: 8px !important;
    }

    html body.community-active .community-room-rail {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    html body.community-active .community-feed-modes {
        margin: 0 !important;
    }

    html body.community-active #arena-grid {
        padding-top: 0 !important;
    }

    html body.community-active #arena-grid .mobile-community-card:first-child {
        margin-top: 0 !important;
        padding-top: 10px !important;
    }

/* Fix safe area color mismatch - set body background when community is active */
html:has(body.community-active),
body.community-active,
html body.community-active {
    background: var(--community-bg) !important;
    background-color: var(--community-bg) !important;
    background-image: none !important;
}

html body #create-modal.create-modal,
html[data-theme="light"] body #create-modal.create-modal,
html[data-theme="dark"] body #create-modal.create-modal {
    background: var(--background-color, #000000) !important;
}

html body #create-modal .modal-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    padding: calc(28px + env(safe-area-inset-top, 0px)) 18px calc(28px + env(safe-area-inset-bottom, 0px)) !important;
    background: var(--background-color, #000000) !important;
    color: var(--text-primary) !important;
}

html body #create-modal .modal-header {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

html body #create-modal .modal-title {
    font-size: 30px !important;
    line-height: 0.96 !important;
    font-weight: 950 !important;
    letter-spacing: -0.02em !important;
}

html body #create-modal #modal-public-content {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

html body #create-modal #modal-public-content > div,
html body #create-modal .input-group {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

html body #create-modal #post-text-bloc-select {
    height: 46px !important;
    padding: 0 2px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 18%, transparent) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    box-shadow: none !important;
}

html body #create-modal #mobile-post-room-context {
    min-height: 0 !important;
    margin-top: 11px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-secondary) !important;
    box-shadow: none !important;
}

html body #create-modal #mobile-post-room-context span:first-child {
    width: 7px !important;
    height: 7px !important;
    box-shadow: none !important;
}

html body #create-modal #post-message {
    min-height: 42dvh !important;
    height: 42dvh !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: 24px !important;
    line-height: 1.25 !important;
    font-weight: 760 !important;
    box-shadow: none !important;
}

html body #create-modal #post-message::placeholder {
    color: color-mix(in srgb, var(--text-secondary) 78%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-secondary) 78%, transparent) !important;
}

html body #create-modal #mobile-community-post-preview {
    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body #create-modal #community-post-media-btn {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-primary) !important;
    box-shadow: none !important;
}

html body #create-modal .modal-actions {
    margin-top: auto !important;
    padding-top: 16px !important;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 12%, transparent) !important;
}

html body #create-modal .modal-cancel-btn,
html body #create-modal .modal-submit-btn {
    border-radius: 999px !important;
    box-shadow: none !important;
}

/* community-neutral-light-pass */
html[data-theme="light"] body.community-active,
html[data-theme="light"] body.community-active #community-feed-shell,
html[data-theme="light"] body.community-active #arena-grid,
html[data-theme="light"] body.community-active .community-surface-sections,
html[data-theme="light"] body.community-active .community-surface-block {
    background: var(--community-bg) !important;
    background-color: var(--community-bg) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-room-card,
html[data-theme="light"] body.community-active .community-room-card.is-all,
html[data-theme="light"] body.community-active .community-spotlight-card,
html[data-theme="light"] body.community-active .community-spotlight-card.has-attachment {
    background: var(--community-card) !important;
    border-color: color-mix(in srgb, var(--community-text) 7%, transparent) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-room-card.has-image {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.12) 42%, rgba(0, 0, 0, 0.72) 100%),
        var(--community-room-thumb),
        var(--community-card) !important;
    background-size: cover, cover, cover !important;
    background-position: center !important;
    border-color: color-mix(in srgb, var(--community-text) 7%, transparent) !important;
    box-shadow: none !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] body.community-active .community-room-card::after {
    background: transparent !important;
}

html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-kicker,
html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.38) !important;
}

html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-preview,
html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-count {
    color: rgba(255, 255, 255, 0.82) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.82) !important;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.34) !important;
}

html[data-theme="light"] body.community-active .community-room-card.is-active,
html[data-theme="light"] body.community-active .community-room-card.is-all.is-active {
    border-color: color-mix(in srgb, var(--community-text) 18%, transparent) !important;
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e) !important;
}

html[data-theme="light"] body.community-active .community-spotlight-room,
html[data-theme="light"] body.community-active .community-section-avatar {
    background: color-mix(in srgb, var(--community-text) 6%, transparent) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-spotlight-copy strong,
html[data-theme="light"] body.community-active .community-pulse-item strong,
html[data-theme="light"] body.community-active .community-room-title,
html[data-theme="light"] body.community-active .community-room-card .community-room-title,
html[data-theme="light"] body.community-active .community-room-card.is-all .community-room-title {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-spotlight-copy > span:last-child,
html[data-theme="light"] body.community-active .community-pulse-item small,
html[data-theme="light"] body.community-active .community-pulse-item em,
html[data-theme="light"] body.community-active .community-room-card .community-room-preview,
html[data-theme="light"] body.community-active .community-room-card.is-all .community-room-preview,
html[data-theme="light"] body.community-active .community-room-card .community-room-count,
html[data-theme="light"] body.community-active .community-room-card.is-all .community-room-count {
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html[data-theme="light"] body.community-active .community-pulse-item {
    background: transparent !important;
    border-bottom-color: var(--community-border) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-feed-modes button {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html[data-theme="light"] body.community-active .community-feed-modes button.is-active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-kicker,
html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.42) !important;
}

html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-preview,
html[data-theme="light"] body.community-active .community-room-card.has-image .community-room-count {
    color: rgba(255, 255, 255, 0.84) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.84) !important;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.36) !important;
}

/* Community composer final pass */
html body #create-modal.create-modal {
    align-items: stretch !important;
    justify-content: flex-start !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    -webkit-text-size-adjust: 100% !important;
    background: var(--background-color, #000000) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}

html body #create-modal.create-modal.active {
    display: flex !important;
}

html body #create-modal.create-modal .modal-content {
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: var(--background-color, #000000) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    gap: 0 !important;
    padding: calc(54px + env(safe-area-inset-top, 0px)) 20px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

html body #create-modal .modal-header {
    flex: 0 0 auto !important;
    margin: 0 0 28px !important;
    padding: 0 !important;
}

html body #create-modal .modal-title {
    margin: 0 0 7px !important;
    font-size: clamp(32px, 10vw, 44px) !important;
    line-height: 0.96 !important;
    font-weight: 950 !important;
    letter-spacing: -0.04em !important;
}

html body #create-modal .posting-as {
    margin: 0 !important;
    color: var(--text-secondary) !important;
    -webkit-text-fill-color: var(--text-secondary) !important;
    font-size: 16px !important;
    line-height: 1.1 !important;
    font-weight: 760 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
}

html body #create-modal .posting-as::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--primary-color, #ff4d2e);
    flex: 0 0 auto;
}

html body #create-modal #modal-public-content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

html body #create-modal #modal-public-content > div:first-child {
    flex: 0 0 auto !important;
    margin: 0 0 16px !important;
}

html body #create-modal #post-text-bloc-select {
    width: 100% !important;
    height: 46px !important;
    padding: 0 32px 0 2px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 16%, transparent) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: -0.025em !important;
    box-shadow: none !important;
}

html body #create-modal #mobile-post-room-context {
    display: none !important;
}

html body #create-modal #mobile-post-room-context span:first-child {
    width: 7px !important;
    height: 7px !important;
    background: var(--primary-color) !important;
    box-shadow: none !important;
}

html body #create-modal #mobile-post-room-context span:nth-child(2) {
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: 0.16em !important;
}

html body #create-modal #mobile-post-room-context-name {
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
}

html body #create-modal .input-group {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    display: flex !important;
}

html body #create-modal #post-message {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 170px !important;
    height: clamp(190px, 30dvh, 250px) !important;
    max-height: 250px !important;
    padding: 20px 18px 58px !important;
    margin: 0 !important;
    border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    border-radius: 18px !important;
    outline: none !important;
    background: color-mix(in srgb, var(--text-primary) 2.5%, transparent) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: clamp(19px, 5.2vw, 24px) !important;
    line-height: 1.2 !important;
    font-weight: 760 !important;
    letter-spacing: -0.02em !important;
    resize: none !important;
    box-shadow: none !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    touch-action: manipulation !important;
    -webkit-text-size-adjust: 100% !important;
}

html body #create-modal #post-message:focus {
    min-height: 170px !important;
    height: clamp(190px, 30dvh, 250px) !important;
    max-height: 250px !important;
    padding: 20px 18px 58px !important;
    border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    border-radius: 18px !important;
    outline: none !important;
    background: color-mix(in srgb, var(--text-primary) 2.5%, transparent) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    font-size: clamp(19px, 5.2vw, 24px) !important;
    line-height: 1.2 !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    box-shadow: none !important;
}

html body #create-modal #post-message::placeholder {
    color: color-mix(in srgb, var(--text-secondary) 74%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-secondary) 74%, transparent) !important;
    opacity: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body #create-modal #mobile-community-post-preview {
    flex: 0 0 auto !important;
    max-height: 150px !important;
    margin: 12px 0 !important;
    border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    border-radius: 18px !important;
    background: color-mix(in srgb, var(--text-primary) 4%, transparent) !important;
    overflow: hidden !important;
}

html body #create-modal #modal-public-content > div:has(#community-post-media-btn) {
    flex: 0 0 auto !important;
    margin: 4px 0 16px !important;
    padding: 0 !important;
    justify-content: flex-start !important;
}

html body #create-modal #community-post-media-btn {
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    gap: 8px !important;
}

html body #create-modal #community-post-media-clear {
    color: var(--text-secondary) !important;
    -webkit-text-fill-color: var(--text-secondary) !important;
}

html body #create-modal .modal-actions {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 12px 0 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
}

html body #create-modal .modal-cancel-btn,
html body #create-modal .modal-submit-btn {
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html body #create-modal .modal-cancel-btn {
    background: color-mix(in srgb, var(--text-primary) 8%, transparent) !important;
    border: 0 !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}

html body #create-modal .modal-submit-btn {
    background: var(--text-primary) !important;
    border: 0 !important;
    color: var(--background-color) !important;
    -webkit-text-fill-color: var(--background-color) !important;
}

html body #create-modal .modal-submit-btn i {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Community owns its surface below the mobile app header now. */
html body.community-active #community-main-area {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

html body.community-active #community-feed-shell {
    margin-top: 0 !important;
    padding-top: calc(var(--mobile-app-header-height, 116px) + 8px) !important;
}

html body.community-active #arena-grid {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* community-feed-system-final
   Single owner for Community feed layout, action row, owner dots, and theme readability. */
html body.community-active,
html body.community-active #mobile-app-shell,
html body.community-active #mobile-app-content,
html body.community-active #community-main-area,
html body.community-active #community-feed-shell,
html body.community-active #arena-grid {
    box-sizing: border-box !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

html body.community-active #community-feed-shell {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 8px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    scroll-padding-left: 14px !important;
    scroll-padding-right: 14px !important;
    overflow-y: visible !important;
}


/* community-scroll-fluidity
   Keep Community vertical feed momentum native while letting the room rail swipe sideways. */
html body.community-active {
    overscroll-behavior-y: auto !important;
    touch-action: pan-y !important;
}

html body.community-active #mobile-app-shell,
html body.community-active #mobile-app-content {
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
}

html body.community-active #community-main-area,
html body.community-active #community-feed-shell {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-y: visible !important;
    overscroll-behavior-y: auto !important;
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    scroll-snap-type: x proximity !important;
    scroll-behavior: auto !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x pan-y !important;
}

html body.community-active #community-room-rail .community-room-card,
html body.community-active .community-room-rail .community-room-card {
    scroll-snap-align: start !important;
    scroll-snap-stop: normal !important;
    touch-action: pan-x pan-y !important;
}

html body.community-active #community-feed-modes,
html body.community-active .community-feed-modes {
    padding-left: 14px !important;
    padding-right: 14px !important;
}

html body.community-active #community-main-area *,
html body.community-active #arena-grid * {
    box-sizing: border-box !important;
    min-width: 0 !important;
}

html body.community-active #arena-grid {
    padding: 2px 0 0 !important;
    gap: 0 !important;
    background: var(--community-bg) !important;
    scroll-snap-type: none !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
}

html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 14px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    scroll-snap-align: none !important;
    scroll-snap-stop: normal !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y !important;
}

html body.community-active #arena-grid .mobile-community-card + .mobile-community-card {
    border-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta {
    grid-column: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10px !important;
    font-weight: 760 !important;
    letter-spacing: 0.1em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta i,
html body.community-active #arena-grid .mobile-community-rebyte-meta span {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: contents !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) 30px !important;
    grid-column: 1 / -1 !important;
    column-gap: 7px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding: 0 !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

html body.community-active #arena-grid .profile-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

html body.community-active #arena-grid .mobile-community-author {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 14px !important;
    line-height: 1 !important;
    /* Semibold marks the name without shouting over the post copy. */
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    grid-column: 3 !important;
    justify-self: start !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 620 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    grid-column: 4 !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: 8 !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    opacity: 1 !important;
    transform: none !important;
}

html body.community-active #arena-grid .community-post-menu-trigger i {
    display: block !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 18px !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    justify-content: flex-start !important;
    margin-top: -2px !important;
    margin-bottom: 4px !important;
    opacity: 0.5 !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10px !important;
    letter-spacing: 0.12em !important;
}

html body.community-active #arena-grid .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    padding: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p {
    margin: 0 !important;
    max-width: 100% !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif !important;
    font-size: clamp(14px, 3.25vw, 15px) !important;
    line-height: 1.36 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    text-align: left !important;
}



html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-media-hero .mobile-community-message p {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif !important;
    font-size: clamp(13.5px, 3.05vw, 14.5px) !important;
    line-height: 1.34 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
}



html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    display: flex !important;
    align-items: center !important;
    min-height: 26px !important;
    margin-top: 0 !important;
    margin-bottom: 2px !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message p {
    width: 100% !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 3px !important;
    margin-bottom: 5px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 132px !important;
    border-radius: 14px !important;
    border-color: var(--community-border) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    max-height: 280px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 8px !important;
    padding: 0 0 8px !important;
    border-top: 0 !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    flex: 0 0 auto !important;
    width: 34px !important;
    min-width: 0 !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    color: color-mix(in srgb, var(--community-text) 58%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .community-feed-action *,
html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action strong,
html body.community-active #arena-grid .community-feed-action span {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    flex: 0 0 auto !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-label {
    display: inline-flex !important;
    font-size: 8px !important;
    font-weight: 680 !important;
    letter-spacing: 0.06em !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline !important;
    position: static !important;
    font-size: 9.5px !important;
    font-weight: 760 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin-right: 1px !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement {
    color: var(--community-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement .community-action-label {
    display: none !important;
}
/* FINAL: Community feed action rail must visually match the current BYTES rail. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail,
html body.community-active #arena-grid .mobile-community-actions > div.bytes-tv-mobile-hero-rail {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding: 0 !important;
    border: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    color: rgba(17, 17, 17, 0.58) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child {
    justify-content: flex-start !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child strong[data-hero-action-count]:not([hidden]) {
    right: auto !important;
    left: 14px !important;
}

/* Use fixed action slots so the first icon can align left without breaking spacing. */
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    justify-content: space-between !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    right: -50% !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button::after,
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
}

/* Replace the old top-right post menu with the room label in the meta row. */
html body.community-active #arena-grid .mobile-community-meta-row {
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) auto !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    grid-column: 4 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: auto !important;
    max-width: min(36vw, 150px) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    overflow: hidden !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-align: right !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta i {
    flex: 0 0 auto !important;
    font-size: 10px !important;
}
/* Final feed polish: context badge, chosen typography, tighter rhythm. */
html body.community-active #arena-grid .mobile-community-card {
    padding-top: 8px !important;
    padding-bottom: 6px !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: 0 !important;
    margin-bottom: 5px !important;
    min-height: 0 !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    min-height: 0 !important;
    margin-bottom: 4px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    font-family: var(--font-family, inherit) !important;
    font-weight: var(--font-weight, 430) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 4px !important;
    margin-bottom: 7px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 2px !important;
    padding-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    min-height: 44px !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    max-width: min(39vw, 164px) !important;
    opacity: 1 !important;
    color: color-mix(in srgb, var(--community-text) 28%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte {
    color: color-mix(in srgb, var(--community-text) 38%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 9px !important;
    right: -50% !important;
    width: 1px !important;
    height: 20px !important;
    background: rgba(17, 17, 17, 0.08) !important;
    pointer-events: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 17px !important;
    line-height: 18px !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-label,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action [data-hero-action-label] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-count,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action strong[data-hero-action-count] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: rgba(17, 17, 17, 0.72) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    position: absolute !important;
    top: 1px !important;
    right: calc(50% - 22px) !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 4px 10px rgba(17, 17, 17, 0.18) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions,
body.dark-theme.community-active #arena-grid .mobile-community-actions,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions {
    border-top-color: transparent !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    color: rgba(255, 255, 255, 0.62) !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* Align the first Community action icon with the first letter of the post body. */
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child {
    justify-content: flex-start !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child strong[data-hero-action-count]:not([hidden]) {
    right: auto !important;
    left: 14px !important;
}

/* Keep Community engagement aligned with the post body, not the avatar column. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    border-top: 0 !important;
}

/* Remove the horizontal divider above Community engagement actions. */
html body.community-active #arena-grid .mobile-community-actions {
    border-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    border-top: 0 !important;
}

/* Align Community feed engagement with the current BYTES mobile action rail. */
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 1 1 0 !important;
    width: auto !important;
    height: 38px !important;
    min-width: 0 !important;
    min-height: 38px !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    color: color-mix(in srgb, var(--community-text) 56%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 9px !important;
    right: 0 !important;
    width: 1px !important;
    height: 20px !important;
    background: rgba(17, 17, 17, 0.08) !important;
    pointer-events: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 17px !important;
    line-height: 18px !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action[data-hero-action="comment"] .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action[data-hero-action="comment"] i {
    font-size: 18px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-action-label,
html body.community-active #arena-grid .mobile-community-actions [data-hero-action-label],
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-label {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-action-count,
html body.community-active #arena-grid .mobile-community-actions strong[data-hero-action-count] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: var(--community-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    position: absolute !important;
    top: 1px !important;
    right: calc(50% - 22px) !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 4px 10px rgba(17, 17, 17, 0.18) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-theme.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* The in-feed Community rail should occupy the same visual lane as the BYTES rail. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 0 !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions,
body.dark-theme.community-active #arena-grid .mobile-community-actions,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions {
    border-top-color: transparent !important;
}

/* Keep the room source centered above the byline in the main feed. */
html body.community-active #arena-grid .mobile-community-card > .mobile-community-room-source {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 4px !important;
    padding: 0 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    text-align: center !important;
    opacity: 0.58 !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-card > .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-card > .mobile-community-card-meta-wrap {
    margin-top: 0 !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .community-feed-action,
body.dark-theme.community-active #arena-grid .community-feed-action,
body.dark-accent-theme.community-active #arena-grid .community-feed-action {
    color: rgba(255, 255, 255, 0.62) !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .community-feed-action.has-engagement,
body.dark-theme.community-active #arena-grid .community-feed-action.has-engagement,
body.dark-accent-theme.community-active #arena-grid .community-feed-action.has-engagement {
    color: rgba(255, 255, 255, 0.96) !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-media-stage,
body.dark-theme.community-active #arena-grid .mobile-community-media-stage,
body.dark-accent-theme.community-active #arena-grid .mobile-community-media-stage {
    background: #050506 !important;
}

html body.community-active .community-room-card.has-image {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.14) 48%, rgba(0, 0, 0, 0.58) 100%),
        var(--community-room-thumb),
        var(--community-card) !important;
    background-size: cover, cover, cover !important;
    background-position: center !important;
}

html body.community-active .community-room-card.has-image::after {
    background: transparent !important;
}

html body.community-active .community-room-card.has-image .community-room-kicker,
html body.community-active .community-room-card.has-image .community-room-title,
html body.community-active .community-room-card.has-image .community-room-preview,
html body.community-active .community-room-card.has-image .community-room-count {
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.42) !important;
}

html[data-theme="light-accent"] body.community-active #community-feed-shell,
body.light-accent-theme.community-active #community-feed-shell,
html[data-theme="light-accent"] body.community-active #community-main-area,
body.light-accent-theme.community-active #community-main-area,
html[data-theme="light-accent"] body.community-active #arena-grid,
body.light-accent-theme.community-active #arena-grid {
    background:
        radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 10%, transparent), transparent 34%),
        var(--community-bg) !important;
    color: var(--community-text) !important;
    border-color: var(--community-border) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid,
body.light-accent-theme.community-active #arena-grid {
    padding-top: 10px !important;
    gap: 12px !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-card,
body.light-accent-theme.community-active #arena-grid .mobile-community-card {
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 9%, rgba(5, 5, 5, 0.05)) !important;
    border-radius: 22px !important;
    box-shadow: 0 10px 30px rgba(5, 5, 5, 0.035) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-message p,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-author,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-card,
body.light-accent-theme.community-active #arena-grid .mobile-community-message p,
body.light-accent-theme.community-active #arena-grid .mobile-community-author,
body.light-accent-theme.community-active #arena-grid .mobile-community-card {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-timestamp,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-room-source,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-room-source *,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action *,
body.light-accent-theme.community-active #arena-grid .mobile-community-timestamp,
body.light-accent-theme.community-active #arena-grid .mobile-community-room-source,
body.light-accent-theme.community-active #arena-grid .mobile-community-room-source *,
body.light-accent-theme.community-active #arena-grid .community-feed-action,
body.light-accent-theme.community-active #arena-grid .community-feed-action * {
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action.has-engagement,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action.has-engagement *,
body.light-accent-theme.community-active #arena-grid .community-feed-action.has-engagement,
body.light-accent-theme.community-active #arena-grid .community-feed-action.has-engagement * {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light-accent"] body.community-active .community-room-card.has-image,
body.light-accent-theme.community-active .community-room-card.has-image {
    border-color: rgba(255, 255, 255, 0.28) !important;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.24) 46%, rgba(0, 0, 0, 0.64) 100%),
        var(--community-room-thumb),
        #111111 !important;
    box-shadow: 0 12px 28px rgba(5, 5, 5, 0.08) !important;
}

html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-kicker,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-title,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-preview,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-count,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-kicker,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-title,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-preview,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-count {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 14px rgba(0, 0, 0, 0.52) !important;
}

/* community-feed-shell-gap-fix
   Bottom nav clearance belongs to the post list, not the room/tabs shell. */
html body.community-active #community-feed-shell {
    padding-top: calc(var(--mobile-app-header-height, 116px) + 4px) !important;
    padding-bottom: 8px !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
}

html body.community-active #community-feed-modes,
html body.community-active .community-feed-modes {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
}

html body.community-active #arena-grid {
    padding-top: 0 !important;
}

/* community-dark-room-active-recovery
   Active room controls should not turn into white pills in dark mode. */
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active,
body.dark-theme.community-active .community-room-card.is-active,
body.dark-accent-theme.community-active .community-room-card.is-active,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-all.is-active,
body.dark-theme.community-active .community-room-card.is-all.is-active,
body.dark-accent-theme.community-active .community-room-card.is-all.is-active {
    background: color-mix(in srgb, var(--community-text) 8%, var(--community-bg)) !important;
    border-color: color-mix(in srgb, var(--primary-color, #ff4d2e) 76%, transparent) !important;
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active::after,
body.dark-theme.community-active .community-room-card.is-active::after,
body.dark-accent-theme.community-active .community-room-card.is-active::after {
    background: transparent !important;
}

html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-kicker,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-title,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-preview,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-count,
body.dark-theme.community-active .community-room-card.is-active .community-room-kicker,
body.dark-theme.community-active .community-room-card.is-active .community-room-title,
body.dark-theme.community-active .community-room-card.is-active .community-room-preview,
body.dark-theme.community-active .community-room-card.is-active .community-room-count,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-kicker,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-title,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-preview,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-count {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    text-shadow: none !important;
}

/* community-composer-compact-input
   Keep the post composer usable without letting the textarea fill the whole screen. */
html body #create-modal #modal-public-content {
    flex: 0 1 auto !important;
}

html body #create-modal .input-group {
    flex: 0 0 auto !important;
    min-height: 0 !important;
}

html body #create-modal #post-message,
html body #create-modal #post-message:focus {
    flex: 0 0 auto !important;
    min-height: 170px !important;
    height: clamp(190px, 30dvh, 250px) !important;
    max-height: 250px !important;
    padding: 20px 18px 58px !important;
    font-size: clamp(19px, 5.2vw, 24px) !important;
    line-height: 1.2 !important;
    font-weight: 760 !important;
}

html body #create-modal #modal-public-content > div:has(#community-post-media-btn) {
    margin: -48px 0 20px 18px !important;
}

html body #create-modal .modal-submit-btn:disabled,
html body #create-modal .modal-submit-btn[disabled],
html body #create-modal .modal-submit-btn.is-disabled {
    background: color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}

/* Rebuilt create-post action row. Keep this after legacy composer rules. */
html body #create-modal .post-composer-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

html body #create-modal .post-composer-action {
    all: unset;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 42px !important;
    min-width: 0 !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    font: 850 14px/1 var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif) !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
}

html body #create-modal .post-composer-action--cancel {
    background: color-mix(in srgb, var(--text-primary) 7%, transparent) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}

html body #create-modal .post-composer-action--submit {
    background: var(--text-primary) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #create-modal .post-composer-action--submit *,
html body #create-modal .post-composer-action--submit span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #create-modal .post-composer-action:disabled,
html body #create-modal .post-composer-action[disabled],
html body #create-modal .post-composer-action.is-disabled {
    background: color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    cursor: not-allowed !important;
}

/* Center-stage Community feed. Keep this last so it wins over older timeline/card passes. */
html body.community-active #arena-grid .mobile-community-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 24px 20px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--community-text) 10%, transparent) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta,
html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: min(100%, 348px) !important;
    max-width: 348px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: block !important;
    margin-bottom: 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 42px !important;
    position: relative !important;
    text-align: center !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    flex: 0 0 auto !important;
    width: 54px !important;
    height: 54px !important;
    border-radius: 18px !important;
    margin: 0 auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-author {
    display: block !important;
    flex: 0 1 auto !important;
    max-width: 100% !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "·" !important;
    display: inline-block !important;
    margin-left: 7px !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-weight: 650 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    display: block !important;
    flex: 0 1 auto !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 650 !important;
    letter-spacing: 0.04em !important;
    text-align: center !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-meta-pill {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    opacity: 0.55 !important;
    text-align: center !important;
    font-size: 11px !important;
    font-weight: 780 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-message {
    display: block !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    padding: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(17px, 4.35vw, 21px) !important;
    line-height: 1.32 !important;
    font-weight: 520 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(16px, 4.1vw, 19px) !important;
    line-height: 1.34 !important;
    font-weight: 500 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    display: flex !important;
    justify-content: center !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    border-radius: 18px !important;
    object-fit: cover !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    max-height: 360px !important;
    object-fit: contain !important;
    background: #000000 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage img {
    height: auto !important;
    aspect-ratio: auto !important;
    max-height: 460px !important;
    object-fit: contain !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 0 !important;
    padding: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(20px, 8vw, 34px) !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: auto !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    gap: 5px !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 21px !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
}

/* Post detail action bar: larger than feed, still clean and icon-first. */
html body #enter-modal.post-detail-page .post-detail-engagement {
    padding: 12px 0 !important;
    background: var(--background, #ffffff) !important;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 8%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
}

html body #enter-modal.post-detail-page [id^="engagement-row-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 44px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 42px !important;
    padding-right: 20px !important;
}

html body #enter-modal.post-detail-page .community-detail-action {
    width: 42px !important;
    height: 48px !important;
    min-width: 42px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    color: color-mix(in srgb, var(--text-primary) 72%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

html body #enter-modal.post-detail-page .community-detail-action i,
html body #enter-modal.post-detail-page .community-detail-action .community-detail-action-icon {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

html body #enter-modal.post-detail-page .community-detail-action span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 780 !important;
    letter-spacing: 0 !important;
}

html body #enter-modal.post-detail-page .community-detail-action span[hidden] {
    display: none !important;
}

html[data-theme^="dark"] body #enter-modal.post-detail-page .community-detail-action,
body.dark-theme #enter-modal.post-detail-page .community-detail-action,
body.dark-accent-theme #enter-modal.post-detail-page .community-detail-action {
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Center-stage polish pass: tighter rhythm and cleaner social-card proportions. */
html body.community-active #arena-grid .mobile-community-card {
    --community-feed-lane: min(78vw, 330px);
    padding: 20px 18px 24px !important;
    min-height: 0 !important;
}

html body.community-active #arena-grid .mobile-community-card:first-child {
    padding-top: 18px !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta,
html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: var(--community-feed-lane) !important;
    max-width: var(--community-feed-lane) !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    margin-bottom: 7px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    gap: 6px !important;
    padding: 0 38px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    width: 50px !important;
    height: 50px !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--community-text) 10%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    gap: 6px !important;
}

html body.community-active #arena-grid .mobile-community-author {
    font-size: 17px !important;
    font-weight: 790 !important;
    line-height: 1.08 !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    margin-left: 6px !important;
    opacity: 0.75 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    font-size: 14px !important;
    font-weight: 560 !important;
    letter-spacing: 0.03em !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    top: 4px !important;
    right: 1px !important;
    width: 34px !important;
    height: 34px !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-post-menu-trigger i {
    font-size: 17px !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    margin-bottom: 15px !important;
    opacity: 0.48 !important;
    font-size: 10.5px !important;
    font-weight: 760 !important;
    letter-spacing: 0.14em !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-bottom: 15px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p {
    font-size: clamp(18px, 4.8vw, 22px) !important;
    line-height: 1.28 !important;
    font-weight: 570 !important;
    text-wrap: balance !important;
}

html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p {
    font-size: clamp(24px, 7vw, 31px) !important;
    line-height: 1.08 !important;
    font-weight: 640 !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(16px, 4.15vw, 19px) !important;
    line-height: 1.32 !important;
    font-weight: 520 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-bottom: 14px !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    border-radius: 16px !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    justify-content: space-between !important;
    gap: 0 !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: 40px !important;
    min-width: 40px !important;
    height: 38px !important;
    min-height: 38px !important;
    color: color-mix(in srgb, var(--community-text) 54%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement {
    color: color-mix(in srgb, var(--community-text) 76%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 20px !important;
}

/* Current feed: centered, readable, no room label, no floating action pill. */
html body.community-active #arena-grid .mobile-community-room-source {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-card {
    --community-feed-lane: min(88vw, 390px);
    padding: 18px 22px 22px !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: var(--community-feed-lane) !important;
    max-width: var(--community-feed-lane) !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-bottom: 13px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    font-size: clamp(15.5px, 4vw, 18px) !important;
    line-height: 1.36 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(15px, 3.85vw, 17px) !important;
    line-height: 1.34 !important;
    font-weight: 480 !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: 42px !important;
    min-width: 42px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: color-mix(in srgb, var(--community-text) 58%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 20px !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    font-size: 12px !important;
    font-weight: 700 !important;
}

/* Classic Community feed restore: avatar left, content right, room line visible. */
html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 24px 30px 28px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--community-text) 10%, transparent) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) 36px !important;
    column-gap: 18px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 64px !important;
    padding: 0 !important;
    position: relative !important;
    text-align: left !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    grid-column: 2 !important;
    display: flex !important;
    align-items: baseline !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author {
    display: inline-block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(20px, 5.2vw, 28px) !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "" !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    display: inline-block !important;
    flex: 0 0 auto !important;
    color: color-mix(in srgb, var(--community-text) 30%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(15px, 3.8vw, 20px) !important;
    line-height: 1 !important;
    font-weight: 740 !important;
    letter-spacing: 0.08em !important;
    white-space: nowrap !important;
    text-align: left !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: 36px !important;
    height: 36px !important;
    margin: 0 !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
}

html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    margin: 0 0 14px !important;
    opacity: 1 !important;
    color: color-mix(in srgb, var(--community-text) 28%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(13px, 3.25vw, 17px) !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin: 0 0 22px !important;
    padding: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(19px, 4.9vw, 30px) !important;
    line-height: 1.28 !important;
    font-weight: 430 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-wrap: auto !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(17px, 4.25vw, 22px) !important;
    line-height: 1.32 !important;
    font-weight: 430 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    display: block !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 14px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    color: color-mix(in srgb, var(--community-text) 52%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: clamp(20px, 5.25vw, 28px) !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-label {
    display: inline-flex !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(10px, 2.8vw, 15px) !important;
    line-height: 1 !important;
    font-weight: 860 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline-flex !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(11px, 2.9vw, 15px) !important;
    line-height: 1 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}

/* Restore 2026-06-11 Community feed sizing/layout. */
html body.community-active #arena-grid {
    padding: 2px 0 0 !important;
    gap: 0 !important;
    background: var(--community-bg) !important;
}

html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 14px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: contents !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) 30px !important;
    grid-column: 1 / -1 !important;
    column-gap: 7px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding: 0 !important;
    overflow: visible !important;
    text-align: left !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

html body.community-active #arena-grid .profile-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

html body.community-active #arena-grid .mobile-community-author {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 15px !important;
    line-height: 1 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "" !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    grid-column: 3 !important;
    justify-self: start !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 620 !important;
    letter-spacing: 0.08em !important;
    text-align: left !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    grid-column: 4 !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: 8 !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: -2px !important;
    margin-bottom: 4px !important;
    opacity: 0.5 !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    padding: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    margin: 0 !important;
    max-width: 100% !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif !important;
    font-size: clamp(14px, 3.25vw, 15.5px) !important;
    line-height: 1.36 !important;
    font-weight: 430 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-align: left !important;
    text-wrap: auto !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(13.5px, 3.05vw, 14.5px) !important;
    line-height: 1.34 !important;
    font-weight: 430 !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    display: flex !important;
    align-items: center !important;
    min-height: 26px !important;
    margin-top: 0 !important;
    margin-bottom: 2px !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message p {
    width: 100% !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 3px !important;
    margin-bottom: 5px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 132px !important;
    border-radius: 14px !important;
    border-color: var(--community-border) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    max-height: 280px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 2px !important;
    padding: 0 0 4px !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    color: color-mix(in srgb, var(--community-text) 58%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .community-feed-action *,
html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action strong,
html body.community-active #arena-grid .community-feed-action span {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    flex: 0 0 auto !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-label {
    display: inline-flex !important;
    font-size: 8px !important;
    font-weight: 680 !important;
    letter-spacing: 0.06em !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline !important;
    position: static !important;
    font-size: 9.5px !important;
    font-weight: 760 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin-right: 1px !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement {
    color: var(--community-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement .community-action-label {
    display: none !important;
}

/* TRUE EOF OVERRIDE: match the current BYTES mobile action rail in Community feed. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail,
html body.community-active #arena-grid .mobile-community-actions > div.bytes-tv-mobile-hero-rail {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding: 0 !important;
    border: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    color: rgba(17, 17, 17, 0.58) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 9px !important;
    right: 0 !important;
    width: 1px !important;
    height: 20px !important;
    background: rgba(17, 17, 17, 0.08) !important;
    pointer-events: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 17px !important;
    line-height: 18px !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-label,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action [data-hero-action-label] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-count,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action strong[data-hero-action-count] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: rgba(17, 17, 17, 0.72) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    position: absolute !important;
    top: 1px !important;
    right: calc(50% - 22px) !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 4px 10px rgba(17, 17, 17, 0.18) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions,
body.dark-theme.community-active #arena-grid .mobile-community-actions,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions {
    border-top-color: transparent !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    color: rgba(255, 255, 255, 0.62) !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* Align the first Community action icon with the first letter of the post body. */
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child {
    justify-content: flex-start !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child strong[data-hero-action-count]:not([hidden]) {
    right: auto !important;
    left: 14px !important;
}

/* Use fixed action slots so the first icon can align left without breaking spacing. */
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    justify-content: space-between !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    right: -50% !important;
}

/* Replace the old top-right post menu with the room label in the meta row. */
html body.community-active #arena-grid .mobile-community-meta-row {
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) auto !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    grid-column: 4 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: auto !important;
    max-width: min(36vw, 150px) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    overflow: hidden !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-align: right !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta i {
    flex: 0 0 auto !important;
    font-size: 10px !important;
}

/* Final Community feed overrides: latest rules win over legacy duplicated blocks. */
html body.community-active #arena-grid .mobile-community-card {
    padding-top: 8px !important;
    padding-bottom: 5px !important;
}

html body.community-active #arena-grid .mobile-community-message {
    min-height: 0 !important;
    margin-bottom: 4px !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    min-height: 0 !important;
    margin-bottom: 3px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif) !important;
    font-weight: var(--font-weight, 430) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 4px !important;
    margin-bottom: 6px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 1px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    min-height: 42px !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    max-width: min(40vw, 166px) !important;
    opacity: 1 !important;
    color: color-mix(in srgb, var(--community-text) 32%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte {
    color: color-mix(in srgb, var(--community-text) 42%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte span {
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta {
    display: none !important;
}

/* Reverted Community UI polish block. Kept here disabled so only the requested targeted fixes remain.
html body.community-active {
    --community-bg: #ffffff;
    --community-surface: #ffffff;
    --community-soft: #f7f8fa;
    --community-line: rgba(15, 23, 42, 0.08);
    --community-muted: rgba(15, 23, 42, 0.44);
    --community-text: #06070a;
    --community-accent: var(--primary-color, #ff4d2e);
}

html body.community-active #community-feed-shell {
    gap: 16px !important;
    padding-bottom: 18px !important;
    background: var(--community-bg) !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    gap: 14px !important;
    padding-top: 10px !important;
    padding-bottom: 18px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    scroll-padding-left: 24px !important;
    scroll-padding-right: 24px !important;
}

html body.community-active .community-room-card,
html body.community-active .community-room-card.is-all {
    flex-basis: 174px !important;
    min-height: 118px !important;
    padding: 15px 16px 14px !important;
    border-radius: 22px !important;
    border: 1px solid var(--community-line) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 248, 250, 0.96)) !important;
    color: var(--community-text) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
}

html body.community-active .community-room-card.has-image {
    border-color: rgba(255, 255, 255, 0.3) !important;
    background-size: cover !important;
    background-position: center !important;
}

html body.community-active .community-room-card.is-active,
html body.community-active .community-room-card.is-all.is-active {
    border-color: color-mix(in srgb, var(--community-accent) 34%, rgba(15, 23, 42, 0.1)) !important;
    box-shadow:
        0 16px 36px rgba(15, 23, 42, 0.08),
        inset 0 -4px 0 var(--community-accent) !important;
}

html body.community-active .community-room-card::after {
    background: linear-gradient(180deg, transparent 8%, rgba(0, 0, 0, 0.34)) !important;
}

html body.community-active .community-room-card:not(.has-image)::after {
    background: transparent !important;
}

html body.community-active .community-room-kicker,
html body.community-active .community-room-card.is-all .community-room-kicker {
    color: color-mix(in srgb, var(--community-text) 72%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.1em !important;
}

html body.community-active .community-room-title,
html body.community-active .community-room-card.is-all .community-room-title {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html body.community-active .community-room-card.has-image .community-room-kicker,
html body.community-active .community-room-card.has-image .community-room-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body.community-active .community-room-preview,
html body.community-active .community-room-card.is-all .community-room-preview {
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
}

html body.community-active .community-room-count,
html body.community-active .community-room-card.is-all .community-room-count {
    color: color-mix(in srgb, var(--community-text) 55%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active .community-room-card.has-image .community-room-preview,
html body.community-active .community-room-card.has-image .community-room-count {
    color: rgba(255, 255, 255, 0.82) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active .community-feed-modes {
    padding: 0 30px !important;
    gap: 26px !important;
}

html body.community-active .community-feed-modes button {
    min-height: 38px !important;
    font-size: 19px !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid {
    background: var(--community-bg) !important;
}

html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 18px 30px 19px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-line) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: block !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 52px minmax(0, max-content) minmax(0, 1fr) auto !important;
    column-gap: 10px !important;
    min-height: 46px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    width: 46px !important;
    height: 46px !important;
    border-radius: 15px !important;
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.02)) !important;
    border: 1px solid var(--community-line) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

html body.community-active #arena-grid .mobile-community-author {
    align-self: center !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 16px !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    align-self: center !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    align-self: center !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: -2px !important;
    margin-bottom: 9px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(15px, 3.75vw, 17px) !important;
    line-height: 1.35 !important;
    font-weight: 470 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 3px !important;
    padding-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    min-height: 38px !important;
    justify-content: space-between !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 12px !important;
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button::after,
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button::after {
    content: none !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    width: 19px !important;
    height: 19px !important;
    font-size: 18px !important;
    line-height: 19px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: color-mix(in srgb, var(--community-text) 68%, transparent) !important;
}
*/

/* BTAP signal plate: Community post object only. */
html body.community-active #arena-grid {
    --btap-signal-ink: #09090b;
    --btap-signal-muted: rgba(9, 9, 11, 0.46);
    --btap-signal-line: rgba(9, 9, 11, 0.09);
    --btap-signal-soft: #f5f6f8;
    --btap-signal-accent: var(--primary-color, #ff4015);
    background: #ffffff !important;
    padding: 2px 0 100px !important;
}

/* Flat feed row, like the virtual map post list: no card box, no shadow, no
   radius, no accent stripe — just content on a hairline. */
html body.community-active #arena-grid .mobile-community-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    column-gap: 11px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 16px 20px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border, rgba(9, 9, 11, 0.08)) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-card:active {
    background: rgba(9, 9, 11, 0.035) !important;
}

/* Accent stripe and corner tick removed with the card container — decoration
   that only made sense on a bordered tile. */
html body.community-active #arena-grid .mobile-community-card::before,
html body.community-active #arena-grid .mobile-community-card::after {
    content: none !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: contents !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 44px minmax(0, max-content) minmax(0, 1fr) auto !important;
    grid-column: 1 / -1 !important;
    column-gap: 9px !important;
    align-items: center !important;
    min-height: 44px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(9, 9, 11, 0.10) !important;
    background: var(--btap-signal-soft) !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-author {
    grid-column: 2 !important;
    color: var(--btap-signal-ink) !important;
    -webkit-text-fill-color: var(--btap-signal-ink) !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    grid-column: 3 !important;
    justify-self: start !important;
    color: var(--btap-signal-muted) !important;
    -webkit-text-fill-color: var(--btap-signal-muted) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0.11em !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    grid-column: 4 !important;
    justify-self: end !important;
    max-width: min(34vw, 128px) !important;
    min-height: 24px !important;
    margin: 0 !important;
    padding: 0 9px !important;
    border: 1px solid rgba(9, 9, 11, 0.10) !important;
    border-radius: 999px !important;
    background: rgba(9, 9, 11, 0.035) !important;
    color: rgba(9, 9, 11, 0.50) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-message {
    position: relative !important;
    margin-top: 7px !important;
    margin-bottom: 7px !important;
    padding: 11px 12px !important;
    border: 1px solid rgba(9, 9, 11, 0.07) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 4px 16px rgba(9, 9, 11, 0.045) !important;
}

html body.community-active #arena-grid .mobile-community-message::before {
    content: "" !important;
    position: absolute !important;
    left: -7px !important;
    top: 14px !important;
    width: 7px !important;
    height: 12px !important;
    border-radius: 999px 0 0 999px !important;
    background: var(--btap-signal-accent) !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    margin: 0 !important;
    color: var(--btap-signal-ink) !important;
    -webkit-text-fill-color: var(--btap-signal-ink) !important;
    font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif) !important;
    font-size: clamp(14px, 3.5vw, 16px) !important;
    line-height: 1.35 !important;
    font-weight: var(--font-weight, 520) !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 2px !important;
    margin-bottom: 8px !important;
    border-radius: 15px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 2px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    min-height: 34px !important;
    width: auto !important;
}

html body.community-active #arena-grid .mobile-community-actions > div.bytes-tv-mobile-hero-rail {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    min-height: 32px !important;
    width: auto !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 32px !important;
    min-height: 32px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(9, 9, 11, 0.045) !important;
    color: rgba(9, 9, 11, 0.52) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 30px !important;
    min-height: 30px !important;
    background: rgba(9, 9, 11, 0.045) !important;
    border-radius: 999px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button::after,
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button::after {
    content: none !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    width: 17px !important;
    height: 17px !important;
    font-size: 16px !important;
    line-height: 17px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: var(--btap-signal-ink) !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    top: -5px !important;
    right: -6px !important;
    min-width: 16px !important;
    height: 16px !important;
    background: var(--btap-signal-ink) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte {
    grid-column: 2 !important;
    justify-self: end !important;
    margin-top: -3px !important;
    margin-bottom: 5px !important;
    padding: 0 9px !important;
    min-height: 21px !important;
    border-radius: 999px !important;
    background: rgba(255, 64, 21, 0.08) !important;
    color: rgba(9, 9, 11, 0.54) !important;
}

/* Media stays in the content column so its left and right edges line up with the
   engagement row beneath it. The 16/9 crop was enforcing that alignment by making
   every image the same width; sizing to the media keeps the alignment without it. */
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-media-stage {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

/* height:auto over a max-height cap: the image sets its own height from its
   width, so it always fills the column edge to edge and stays flush with the
   actions row. A max-height with object-fit:contain would letterbox tall images
   inward and break that alignment. */
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-media-stage img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    aspect-ratio: auto !important;
    border-radius: 16px !important;
}

/* Card flattening (no radius/shadow/border, hairline between posts) lives in the
   inline <style> block in templates/mobile.html, which loads after this file and
   wins on both order and specificity. Only the engagement row is styled here. */


html body.community-active #arena-grid .mobile-community-actions .community-action-count,
html body.community-active #arena-grid .mobile-community-actions strong[data-hero-action-count] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: var(--community-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    position: absolute !important;
    top: 1px !important;
    right: calc(50% - 22px) !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 4px 10px rgba(17, 17, 17, 0.18) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-theme.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* The in-feed Community rail should occupy the same visual lane as the BYTES rail. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 0 !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions,
body.dark-theme.community-active #arena-grid .mobile-community-actions,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions {
    border-top-color: transparent !important;
}

/* Keep the room source centered above the byline in the main feed. */
html body.community-active #arena-grid .mobile-community-card > .mobile-community-room-source {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 4px !important;
    padding: 0 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    text-align: center !important;
    opacity: 0.58 !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-card > .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-card > .mobile-community-card-meta-wrap {
    margin-top: 0 !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .community-feed-action,
body.dark-theme.community-active #arena-grid .community-feed-action,
body.dark-accent-theme.community-active #arena-grid .community-feed-action {
    color: rgba(255, 255, 255, 0.62) !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .community-feed-action.has-engagement,
body.dark-theme.community-active #arena-grid .community-feed-action.has-engagement,
body.dark-accent-theme.community-active #arena-grid .community-feed-action.has-engagement {
    color: rgba(255, 255, 255, 0.96) !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-media-stage,
body.dark-theme.community-active #arena-grid .mobile-community-media-stage,
body.dark-accent-theme.community-active #arena-grid .mobile-community-media-stage {
    background: #050506 !important;
}

html body.community-active .community-room-card.has-image {
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.14) 48%, rgba(0, 0, 0, 0.58) 100%),
        var(--community-room-thumb),
        var(--community-card) !important;
    background-size: cover, cover, cover !important;
    background-position: center !important;
}

html body.community-active .community-room-card.has-image::after {
    background: transparent !important;
}

html body.community-active .community-room-card.has-image .community-room-kicker,
html body.community-active .community-room-card.has-image .community-room-title,
html body.community-active .community-room-card.has-image .community-room-preview,
html body.community-active .community-room-card.has-image .community-room-count {
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.42) !important;
}

html[data-theme="light-accent"] body.community-active #community-feed-shell,
body.light-accent-theme.community-active #community-feed-shell,
html[data-theme="light-accent"] body.community-active #community-main-area,
body.light-accent-theme.community-active #community-main-area,
html[data-theme="light-accent"] body.community-active #arena-grid,
body.light-accent-theme.community-active #arena-grid {
    background:
        radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 10%, transparent), transparent 34%),
        var(--community-bg) !important;
    color: var(--community-text) !important;
    border-color: var(--community-border) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid,
body.light-accent-theme.community-active #arena-grid {
    padding-top: 10px !important;
    gap: 12px !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-card,
body.light-accent-theme.community-active #arena-grid .mobile-community-card {
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid color-mix(in srgb, var(--accent-color, var(--primary-color, #ff4d2e)) 9%, rgba(5, 5, 5, 0.05)) !important;
    border-radius: 22px !important;
    box-shadow: 0 10px 30px rgba(5, 5, 5, 0.035) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-message p,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-author,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-card,
body.light-accent-theme.community-active #arena-grid .mobile-community-message p,
body.light-accent-theme.community-active #arena-grid .mobile-community-author,
body.light-accent-theme.community-active #arena-grid .mobile-community-card {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-timestamp,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-room-source,
html[data-theme="light-accent"] body.community-active #arena-grid .mobile-community-room-source *,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action *,
body.light-accent-theme.community-active #arena-grid .mobile-community-timestamp,
body.light-accent-theme.community-active #arena-grid .mobile-community-room-source,
body.light-accent-theme.community-active #arena-grid .mobile-community-room-source *,
body.light-accent-theme.community-active #arena-grid .community-feed-action,
body.light-accent-theme.community-active #arena-grid .community-feed-action * {
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action.has-engagement,
html[data-theme="light-accent"] body.community-active #arena-grid .community-feed-action.has-engagement *,
body.light-accent-theme.community-active #arena-grid .community-feed-action.has-engagement,
body.light-accent-theme.community-active #arena-grid .community-feed-action.has-engagement * {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html[data-theme="light-accent"] body.community-active .community-room-card.has-image,
body.light-accent-theme.community-active .community-room-card.has-image {
    border-color: rgba(255, 255, 255, 0.28) !important;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.24) 46%, rgba(0, 0, 0, 0.64) 100%),
        var(--community-room-thumb),
        #111111 !important;
    box-shadow: 0 12px 28px rgba(5, 5, 5, 0.08) !important;
}

html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-kicker,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-title,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-preview,
html[data-theme="light-accent"] body.community-active .community-room-card.has-image .community-room-count,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-kicker,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-title,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-preview,
body.light-accent-theme.community-active .community-room-card.has-image .community-room-count {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 14px rgba(0, 0, 0, 0.52) !important;
}

/* community-feed-shell-gap-fix
   Bottom nav clearance belongs to the post list, not the room/tabs shell. */
html body.community-active #community-feed-shell {
    padding-top: calc(var(--mobile-app-header-height, 116px) + 4px) !important;
    padding-bottom: 8px !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
}

html body.community-active #community-feed-modes,
html body.community-active .community-feed-modes {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
}

html body.community-active #arena-grid {
    padding-top: 0 !important;
}

/* community-dark-room-active-recovery
   Active room controls should not turn into white pills in dark mode. */
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active,
body.dark-theme.community-active .community-room-card.is-active,
body.dark-accent-theme.community-active .community-room-card.is-active,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-all.is-active,
body.dark-theme.community-active .community-room-card.is-all.is-active,
body.dark-accent-theme.community-active .community-room-card.is-all.is-active {
    background: color-mix(in srgb, var(--community-text) 8%, var(--community-bg)) !important;
    border-color: color-mix(in srgb, var(--primary-color, #ff4d2e) 76%, transparent) !important;
    box-shadow: inset 0 -3px 0 var(--primary-color, #ff4d2e) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
}

html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active::after,
body.dark-theme.community-active .community-room-card.is-active::after,
body.dark-accent-theme.community-active .community-room-card.is-active::after {
    background: transparent !important;
}

html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-kicker,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-title,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-preview,
html:not([data-theme="light"]):not([data-theme="light-accent"]) body.community-active .community-room-card.is-active .community-room-count,
body.dark-theme.community-active .community-room-card.is-active .community-room-kicker,
body.dark-theme.community-active .community-room-card.is-active .community-room-title,
body.dark-theme.community-active .community-room-card.is-active .community-room-preview,
body.dark-theme.community-active .community-room-card.is-active .community-room-count,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-kicker,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-title,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-preview,
body.dark-accent-theme.community-active .community-room-card.is-active .community-room-count {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    text-shadow: none !important;
}

/* community-composer-compact-input
   Keep the post composer usable without letting the textarea fill the whole screen. */
html body #create-modal #modal-public-content {
    flex: 0 1 auto !important;
}

html body #create-modal .input-group {
    flex: 0 0 auto !important;
    min-height: 0 !important;
}

html body #create-modal #post-message,
html body #create-modal #post-message:focus {
    flex: 0 0 auto !important;
    min-height: 170px !important;
    height: clamp(190px, 30dvh, 250px) !important;
    max-height: 250px !important;
    padding: 20px 18px 58px !important;
    font-size: clamp(19px, 5.2vw, 24px) !important;
    line-height: 1.2 !important;
    font-weight: 760 !important;
}

html body #create-modal #modal-public-content > div:has(#community-post-media-btn) {
    margin: -48px 0 20px 18px !important;
}

html body #create-modal .modal-submit-btn:disabled,
html body #create-modal .modal-submit-btn[disabled],
html body #create-modal .modal-submit-btn.is-disabled {
    background: color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}

/* Rebuilt create-post action row. Keep this after legacy composer rules. */
html body #create-modal .post-composer-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

html body #create-modal .post-composer-action {
    all: unset;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 42px !important;
    min-width: 0 !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    font: 850 14px/1 var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif) !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
}

html body #create-modal .post-composer-action--cancel {
    background: color-mix(in srgb, var(--text-primary) 7%, transparent) !important;
    color: var(--text-primary) !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}

html body #create-modal .post-composer-action--submit {
    background: var(--text-primary) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #create-modal .post-composer-action--submit *,
html body #create-modal .post-composer-action--submit span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #create-modal .post-composer-action:disabled,
html body #create-modal .post-composer-action[disabled],
html body #create-modal .post-composer-action.is-disabled {
    background: color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
    color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary) 34%, transparent) !important;
    cursor: not-allowed !important;
}

/* Center-stage Community feed. Keep this last so it wins over older timeline/card passes. */
html body.community-active #arena-grid .mobile-community-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 24px 20px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--community-text) 10%, transparent) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta,
html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: min(100%, 348px) !important;
    max-width: 348px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: block !important;
    margin-bottom: 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 42px !important;
    position: relative !important;
    text-align: center !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    flex: 0 0 auto !important;
    width: 54px !important;
    height: 54px !important;
    border-radius: 18px !important;
    margin: 0 auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-author {
    display: block !important;
    flex: 0 1 auto !important;
    max-width: 100% !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "·" !important;
    display: inline-block !important;
    margin-left: 7px !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-weight: 650 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    display: block !important;
    flex: 0 1 auto !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 650 !important;
    letter-spacing: 0.04em !important;
    text-align: center !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .mobile-community-meta-pill {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    grid-column: auto !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    opacity: 0.55 !important;
    text-align: center !important;
    font-size: 11px !important;
    font-weight: 780 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-message {
    display: block !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    padding: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(17px, 4.35vw, 21px) !important;
    line-height: 1.32 !important;
    font-weight: 520 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(16px, 4.1vw, 19px) !important;
    line-height: 1.34 !important;
    font-weight: 500 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    display: flex !important;
    justify-content: center !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    border-radius: 18px !important;
    object-fit: cover !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    max-height: 360px !important;
    object-fit: contain !important;
    background: #000000 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage img {
    height: auto !important;
    aspect-ratio: auto !important;
    max-height: 460px !important;
    object-fit: contain !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 0 !important;
    padding: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(20px, 8vw, 34px) !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: auto !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    gap: 5px !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 21px !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
}

/* Post detail action bar: larger than feed, still clean and icon-first. */
html body #enter-modal.post-detail-page .post-detail-engagement {
    padding: 12px 0 !important;
    background: var(--background, #ffffff) !important;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 8%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
}

html body #enter-modal.post-detail-page [id^="engagement-row-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 44px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 42px !important;
    padding-right: 20px !important;
}

html body #enter-modal.post-detail-page .community-detail-action {
    width: 42px !important;
    height: 48px !important;
    min-width: 42px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    color: color-mix(in srgb, var(--text-primary) 72%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

html body #enter-modal.post-detail-page .community-detail-action i,
html body #enter-modal.post-detail-page .community-detail-action .community-detail-action-icon {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

html body #enter-modal.post-detail-page .community-detail-action span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 780 !important;
    letter-spacing: 0 !important;
}

html body #enter-modal.post-detail-page .community-detail-action span[hidden] {
    display: none !important;
}

html[data-theme^="dark"] body #enter-modal.post-detail-page .community-detail-action,
body.dark-theme #enter-modal.post-detail-page .community-detail-action,
body.dark-accent-theme #enter-modal.post-detail-page .community-detail-action {
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Center-stage polish pass: tighter rhythm and cleaner social-card proportions. */
html body.community-active #arena-grid .mobile-community-card {
    --community-feed-lane: min(78vw, 330px);
    padding: 20px 18px 24px !important;
    min-height: 0 !important;
}

html body.community-active #arena-grid .mobile-community-card:first-child {
    padding-top: 18px !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta,
html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: var(--community-feed-lane) !important;
    max-width: var(--community-feed-lane) !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    margin-bottom: 7px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    gap: 6px !important;
    padding: 0 38px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    width: 50px !important;
    height: 50px !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--community-text) 10%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    gap: 6px !important;
}

html body.community-active #arena-grid .mobile-community-author {
    font-size: 17px !important;
    font-weight: 790 !important;
    line-height: 1.08 !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    margin-left: 6px !important;
    opacity: 0.75 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    font-size: 14px !important;
    font-weight: 560 !important;
    letter-spacing: 0.03em !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    top: 4px !important;
    right: 1px !important;
    width: 34px !important;
    height: 34px !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-post-menu-trigger i {
    font-size: 17px !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    margin-bottom: 15px !important;
    opacity: 0.48 !important;
    font-size: 10.5px !important;
    font-weight: 760 !important;
    letter-spacing: 0.14em !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-bottom: 15px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p {
    font-size: clamp(18px, 4.8vw, 22px) !important;
    line-height: 1.28 !important;
    font-weight: 570 !important;
    text-wrap: balance !important;
}

html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p {
    font-size: clamp(24px, 7vw, 31px) !important;
    line-height: 1.08 !important;
    font-weight: 640 !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(16px, 4.15vw, 19px) !important;
    line-height: 1.32 !important;
    font-weight: 520 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-bottom: 14px !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    border-radius: 16px !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    justify-content: space-between !important;
    gap: 0 !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: 40px !important;
    min-width: 40px !important;
    height: 38px !important;
    min-height: 38px !important;
    color: color-mix(in srgb, var(--community-text) 54%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement {
    color: color-mix(in srgb, var(--community-text) 76%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 20px !important;
}

/* Current feed: centered, readable, no room label, no floating action pill. */
html body.community-active #arena-grid .mobile-community-room-source {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-card {
    --community-feed-lane: min(88vw, 390px);
    padding: 18px 22px 22px !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    width: var(--community-feed-lane) !important;
    max-width: var(--community-feed-lane) !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-bottom: 13px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    font-size: clamp(15.5px, 4vw, 18px) !important;
    line-height: 1.36 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(15px, 3.85vw, 17px) !important;
    line-height: 1.34 !important;
    font-weight: 480 !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: 42px !important;
    min-width: 42px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: color-mix(in srgb, var(--community-text) 58%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: 20px !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    font-size: 12px !important;
    font-weight: 700 !important;
}

/* Classic Community feed restore: avatar left, content right, room line visible. */
html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 24px 30px 28px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--community-text) 10%, transparent) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) 36px !important;
    column-gap: 18px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 64px !important;
    padding: 0 !important;
    position: relative !important;
    text-align: left !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-byline {
    grid-column: 2 !important;
    display: flex !important;
    align-items: baseline !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author {
    display: inline-block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(20px, 5.2vw, 28px) !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "" !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    display: inline-block !important;
    flex: 0 0 auto !important;
    color: color-mix(in srgb, var(--community-text) 30%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(15px, 3.8vw, 20px) !important;
    line-height: 1 !important;
    font-weight: 740 !important;
    letter-spacing: 0.08em !important;
    white-space: nowrap !important;
    text-align: left !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: 36px !important;
    height: 36px !important;
    margin: 0 !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
}

html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    margin: 0 0 14px !important;
    opacity: 1 !important;
    color: color-mix(in srgb, var(--community-text) 28%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(13px, 3.25vw, 17px) !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin: 0 0 22px !important;
    padding: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(19px, 4.9vw, 30px) !important;
    line-height: 1.28 !important;
    font-weight: 430 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-wrap: auto !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(17px, 4.25vw, 22px) !important;
    line-height: 1.32 !important;
    font-weight: 430 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    display: block !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 14px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    color: color-mix(in srgb, var(--community-text) 52%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    font-size: clamp(20px, 5.25vw, 28px) !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-label {
    display: inline-flex !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(10px, 2.8vw, 15px) !important;
    line-height: 1 !important;
    font-weight: 860 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline-flex !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(11px, 2.9vw, 15px) !important;
    line-height: 1 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}

/* Restore 2026-06-11 Community feed sizing/layout. */
html body.community-active #arena-grid {
    padding: 2px 0 0 !important;
    gap: 0 !important;
    background: var(--community-bg) !important;
}

html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 14px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: contents !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) 30px !important;
    grid-column: 1 / -1 !important;
    column-gap: 7px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding: 0 !important;
    overflow: visible !important;
    text-align: left !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

html body.community-active #arena-grid .profile-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

html body.community-active #arena-grid .mobile-community-author {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 15px !important;
    line-height: 1 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-author::after {
    content: "" !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    grid-column: 3 !important;
    justify-self: start !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 620 !important;
    letter-spacing: 0.08em !important;
    text-align: left !important;
}

html body.community-active #arena-grid .community-post-menu-wrap {
    grid-column: 4 !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: 8 !important;
}

html body.community-active #arena-grid .community-post-menu-trigger {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
}

html body.community-active #arena-grid .mobile-community-room-source,
html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-room-source {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: -2px !important;
    margin-bottom: 4px !important;
    opacity: 0.5 !important;
    color: var(--community-muted) !important;
    -webkit-text-fill-color: var(--community-muted) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-room-source * {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    padding: 0 !important;
    text-align: left !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p {
    margin: 0 !important;
    max-width: 100% !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif !important;
    font-size: clamp(14px, 3.25vw, 15.5px) !important;
    line-height: 1.36 !important;
    font-weight: 430 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-align: left !important;
    text-wrap: auto !important;
}

html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.community-feed-hero .mobile-community-message p {
    font-size: clamp(13.5px, 3.05vw, 14.5px) !important;
    line-height: 1.34 !important;
    font-weight: 430 !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    display: flex !important;
    align-items: center !important;
    min-height: 26px !important;
    margin-top: 0 !important;
    margin-bottom: 2px !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message p {
    width: 100% !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 3px !important;
    margin-bottom: 5px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-media-stage .bloc-card-media-preview,
html body.community-active #arena-grid .mobile-community-media-stage img,
html body.community-active #arena-grid .mobile-community-media-stage iframe,
html body.community-active #arena-grid .mobile-community-media-stage video {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 132px !important;
    border-radius: 14px !important;
    border-color: var(--community-border) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage video {
    max-height: 280px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 2px !important;
    padding: 0 0 4px !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
}

html body.community-active #arena-grid .community-feed-action {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    color: color-mix(in srgb, var(--community-text) 58%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .community-feed-action *,
html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action strong,
html body.community-active #arena-grid .community-feed-action span {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action i,
html body.community-active #arena-grid .community-feed-action .community-action-icon {
    flex: 0 0 auto !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-label {
    display: inline-flex !important;
    font-size: 8px !important;
    font-weight: 680 !important;
    letter-spacing: 0.06em !important;
    line-height: 1 !important;
}

html body.community-active #arena-grid .community-feed-action .community-action-count {
    display: inline !important;
    position: static !important;
    font-size: 9.5px !important;
    font-weight: 760 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin-right: 1px !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement {
    color: var(--community-text) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .community-feed-action.has-engagement .community-action-label {
    display: none !important;
}

/* TRUE EOF OVERRIDE: match the current BYTES mobile action rail in Community feed. */
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail,
html body.community-active #arena-grid .mobile-community-actions > div.bytes-tv-mobile-hero-rail {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding: 0 !important;
    border: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    color: rgba(17, 17, 17, 0.58) !important;
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 9px !important;
    right: 0 !important;
    width: 1px !important;
    height: 20px !important;
    background: rgba(17, 17, 17, 0.08) !important;
    pointer-events: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 17px !important;
    line-height: 18px !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-label,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action [data-hero-action-label] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-count,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action strong[data-hero-action-count] {
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: rgba(17, 17, 17, 0.72) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    position: absolute !important;
    top: 1px !important;
    right: calc(50% - 22px) !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 4px 10px rgba(17, 17, 17, 0.18) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions,
body.dark-theme.community-active #arena-grid .mobile-community-actions,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions {
    border-top-color: transparent !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    color: rgba(255, 255, 255, 0.62) !important;
}

html[data-theme^="dark"] body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after,
body.dark-accent-theme.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* Align the first Community action icon with the first letter of the post body. */
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child {
    justify-content: flex-start !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:first-child strong[data-hero-action-count]:not([hidden]) {
    right: auto !important;
    left: 14px !important;
}

/* Use fixed action slots so the first icon can align left without breaking spacing. */
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    justify-content: space-between !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button:not(:last-child)::after {
    right: -50% !important;
}

/* Replace the old top-right post menu with the room label in the meta row. */
html body.community-active #arena-grid .mobile-community-meta-row {
    grid-template-columns: 42px minmax(0, max-content) minmax(0, 1fr) auto !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    grid-column: 4 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: auto !important;
    max-width: min(36vw, 150px) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    overflow: hidden !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-align: right !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta i {
    flex: 0 0 auto !important;
    font-size: 10px !important;
}

/* Final Community feed overrides: latest rules win over legacy duplicated blocks. */
html body.community-active #arena-grid .mobile-community-card {
    padding-top: 8px !important;
    padding-bottom: 5px !important;
}

html body.community-active #arena-grid .mobile-community-message {
    min-height: 0 !important;
    margin-bottom: 4px !important;
}

html body.community-active #arena-grid .mobile-community-card:not(.has-community-media) .mobile-community-message {
    min-height: 0 !important;
    margin-bottom: 3px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif) !important;
    font-weight: var(--font-weight, 430) !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 4px !important;
    margin-bottom: 6px !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 1px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    min-height: 42px !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    max-width: min(40vw, 166px) !important;
    opacity: 1 !important;
    color: color-mix(in srgb, var(--community-text) 32%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte {
    color: color-mix(in srgb, var(--community-text) 42%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte span {
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-rebyte-meta {
    display: none !important;
}

/* Reverted Community UI polish block. Kept here disabled so only the requested targeted fixes remain.
html body.community-active {
    --community-bg: #ffffff;
    --community-surface: #ffffff;
    --community-soft: #f7f8fa;
    --community-line: rgba(15, 23, 42, 0.08);
    --community-muted: rgba(15, 23, 42, 0.44);
    --community-text: #06070a;
    --community-accent: var(--primary-color, #ff4d2e);
}

html body.community-active #community-feed-shell {
    gap: 16px !important;
    padding-bottom: 18px !important;
    background: var(--community-bg) !important;
}

html body.community-active #community-room-rail,
html body.community-active .community-room-rail {
    gap: 14px !important;
    padding-top: 10px !important;
    padding-bottom: 18px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    scroll-padding-left: 24px !important;
    scroll-padding-right: 24px !important;
}

html body.community-active .community-room-card,
html body.community-active .community-room-card.is-all {
    flex-basis: 174px !important;
    min-height: 118px !important;
    padding: 15px 16px 14px !important;
    border-radius: 22px !important;
    border: 1px solid var(--community-line) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 248, 250, 0.96)) !important;
    color: var(--community-text) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
}

html body.community-active .community-room-card.has-image {
    border-color: rgba(255, 255, 255, 0.3) !important;
    background-size: cover !important;
    background-position: center !important;
}

html body.community-active .community-room-card.is-active,
html body.community-active .community-room-card.is-all.is-active {
    border-color: color-mix(in srgb, var(--community-accent) 34%, rgba(15, 23, 42, 0.1)) !important;
    box-shadow:
        0 16px 36px rgba(15, 23, 42, 0.08),
        inset 0 -4px 0 var(--community-accent) !important;
}

html body.community-active .community-room-card::after {
    background: linear-gradient(180deg, transparent 8%, rgba(0, 0, 0, 0.34)) !important;
}

html body.community-active .community-room-card:not(.has-image)::after {
    background: transparent !important;
}

html body.community-active .community-room-kicker,
html body.community-active .community-room-card.is-all .community-room-kicker {
    color: color-mix(in srgb, var(--community-text) 72%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.1em !important;
}

html body.community-active .community-room-title,
html body.community-active .community-room-card.is-all .community-room-title {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html body.community-active .community-room-card.has-image .community-room-kicker,
html body.community-active .community-room-card.has-image .community-room-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body.community-active .community-room-preview,
html body.community-active .community-room-card.is-all .community-room-preview {
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
}

html body.community-active .community-room-count,
html body.community-active .community-room-card.is-all .community-room-count {
    color: color-mix(in srgb, var(--community-text) 55%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active .community-room-card.has-image .community-room-preview,
html body.community-active .community-room-card.has-image .community-room-count {
    color: rgba(255, 255, 255, 0.82) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active .community-feed-modes {
    padding: 0 30px !important;
    gap: 26px !important;
}

html body.community-active .community-feed-modes button {
    min-height: 38px !important;
    font-size: 19px !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid {
    background: var(--community-bg) !important;
}

html body.community-active #arena-grid .mobile-community-card {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 18px 30px 19px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-line) !important;
    border-radius: 0 !important;
    background: var(--community-bg) !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: block !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 52px minmax(0, max-content) minmax(0, 1fr) auto !important;
    column-gap: 10px !important;
    min-height: 46px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    width: 46px !important;
    height: 46px !important;
    border-radius: 15px !important;
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.02)) !important;
    border: 1px solid var(--community-line) !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

html body.community-active #arena-grid .mobile-community-author {
    align-self: center !important;
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: 16px !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    align-self: center !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 12px !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    align-self: center !important;
    color: color-mix(in srgb, var(--community-text) 34%, transparent) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
}

html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-message {
    margin-top: -2px !important;
    margin-bottom: 9px !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    color: var(--community-text) !important;
    -webkit-text-fill-color: var(--community-text) !important;
    font-size: clamp(15px, 3.75vw, 17px) !important;
    line-height: 1.35 !important;
    font-weight: 470 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 3px !important;
    padding-top: 0 !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    min-height: 38px !important;
    justify-content: space-between !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 12px !important;
    color: color-mix(in srgb, var(--community-text) 48%, transparent) !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button::after,
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button::after {
    content: none !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    width: 19px !important;
    height: 19px !important;
    font-size: 18px !important;
    line-height: 19px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: color-mix(in srgb, var(--community-text) 68%, transparent) !important;
}
*/

/* BTAP signal plate: Community post object only. */
html body.community-active #arena-grid {
    --btap-signal-ink: #09090b;
    --btap-signal-muted: rgba(9, 9, 11, 0.46);
    --btap-signal-line: rgba(9, 9, 11, 0.09);
    --btap-signal-soft: #f5f6f8;
    --btap-signal-accent: var(--primary-color, #ff4015);
    background: #ffffff !important;
    padding: 2px 0 100px !important;
}

/* Flat feed row, like the virtual map post list: no card box, no shadow, no
   radius, no accent stripe — just content on a hairline. */
html body.community-active #arena-grid .mobile-community-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    column-gap: 11px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 16px 20px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--community-border, rgba(9, 9, 11, 0.08)) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

html body.community-active #arena-grid .mobile-community-card:active {
    background: rgba(9, 9, 11, 0.035) !important;
}

/* Accent stripe and corner tick removed with the card container — decoration
   that only made sense on a bordered tile. */
html body.community-active #arena-grid .mobile-community-card::before,
html body.community-active #arena-grid .mobile-community-card::after {
    content: none !important;
}

html body.community-active #arena-grid .mobile-community-card-meta-wrap {
    display: contents !important;
}

html body.community-active #arena-grid .mobile-community-meta-row {
    display: grid !important;
    grid-template-columns: 44px minmax(0, max-content) minmax(0, 1fr) auto !important;
    grid-column: 1 / -1 !important;
    column-gap: 9px !important;
    align-items: center !important;
    min-height: 44px !important;
}

html body.community-active #arena-grid .profile-avatar,
html body.community-active #arena-grid .mobile-community-meta-row .profile-avatar {
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(9, 9, 11, 0.10) !important;
    background: var(--btap-signal-soft) !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-author {
    grid-column: 2 !important;
    color: var(--btap-signal-ink) !important;
    -webkit-text-fill-color: var(--btap-signal-ink) !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-timestamp {
    grid-column: 3 !important;
    justify-self: start !important;
    color: var(--btap-signal-muted) !important;
    -webkit-text-fill-color: var(--btap-signal-muted) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0.11em !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--meta {
    grid-column: 4 !important;
    justify-self: end !important;
    max-width: min(34vw, 128px) !important;
    min-height: 24px !important;
    margin: 0 !important;
    padding: 0 9px !important;
    border: 1px solid rgba(9, 9, 11, 0.10) !important;
    border-radius: 999px !important;
    background: rgba(9, 9, 11, 0.035) !important;
    color: rgba(9, 9, 11, 0.50) !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase !important;
}

html body.community-active #arena-grid .mobile-community-message,
html body.community-active #arena-grid .mobile-community-media-stage,
html body.community-active #arena-grid .mobile-community-actions {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body.community-active #arena-grid .mobile-community-message {
    position: relative !important;
    margin-top: 7px !important;
    margin-bottom: 7px !important;
    padding: 11px 12px !important;
    border: 1px solid rgba(9, 9, 11, 0.07) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 4px 16px rgba(9, 9, 11, 0.045) !important;
}

html body.community-active #arena-grid .mobile-community-message::before {
    content: "" !important;
    position: absolute !important;
    left: -7px !important;
    top: 14px !important;
    width: 7px !important;
    height: 12px !important;
    border-radius: 999px 0 0 999px !important;
    background: var(--btap-signal-accent) !important;
}

html body.community-active #arena-grid .mobile-community-message p,
html body.community-active #arena-grid .community-feed-hero .mobile-community-message p,
html body.community-active #arena-grid .community-feed-media .mobile-community-message p,
html body.community-active #arena-grid .community-feed-note .mobile-community-message p,
html body.community-active #arena-grid .community-feed-essay .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-short .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-medium .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.signal-long .mobile-community-message p,
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-message p {
    margin: 0 !important;
    color: var(--btap-signal-ink) !important;
    -webkit-text-fill-color: var(--btap-signal-ink) !important;
    font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif) !important;
    font-size: clamp(14px, 3.5vw, 16px) !important;
    line-height: 1.35 !important;
    font-weight: var(--font-weight, 520) !important;
    letter-spacing: 0 !important;
}

html body.community-active #arena-grid .mobile-community-media-stage {
    margin-top: 2px !important;
    margin-bottom: 8px !important;
    border-radius: 15px !important;
    overflow: hidden !important;
}

html body.community-active #arena-grid .mobile-community-actions {
    margin-top: 2px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    min-height: 34px !important;
    width: auto !important;
}

html body.community-active #arena-grid .mobile-community-actions > div.bytes-tv-mobile-hero-rail {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    min-height: 32px !important;
    width: auto !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    position: relative !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 32px !important;
    min-height: 32px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(9, 9, 11, 0.045) !important;
    color: rgba(9, 9, 11, 0.52) !important;
    -webkit-text-fill-color: currentColor !important;
}

html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button {
    flex: 0 0 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 30px !important;
    min-height: 30px !important;
    background: rgba(9, 9, 11, 0.045) !important;
    border-radius: 999px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.bytes-tv-mobile-hero-rail__button::after,
html body.community-active #arena-grid .mobile-community-actions .bytes-tv-mobile-hero-rail__button::after {
    content: none !important;
    display: none !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action .community-action-icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action .bytes-tv-mobile-hero-rail__icon,
html body.community-active #arena-grid .mobile-community-actions .community-feed-action i {
    width: 17px !important;
    height: 17px !important;
    font-size: 16px !important;
    line-height: 17px !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement {
    color: var(--btap-signal-ink) !important;
}

html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement .community-action-count:not([hidden]),
html body.community-active #arena-grid .mobile-community-actions .community-feed-action.has-engagement strong[data-hero-action-count]:not([hidden]) {
    top: -5px !important;
    right: -6px !important;
    min-width: 16px !important;
    height: 16px !important;
    background: var(--btap-signal-ink) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid #ffffff !important;
}

html body.community-active #arena-grid .mobile-community-room-source.mobile-community-room-source--rebyte {
    grid-column: 2 !important;
    justify-self: end !important;
    margin-top: -3px !important;
    margin-bottom: 5px !important;
    padding: 0 9px !important;
    min-height: 21px !important;
    border-radius: 999px !important;
    background: rgba(255, 64, 21, 0.08) !important;
    color: rgba(9, 9, 11, 0.54) !important;
}

/* Media stays in the content column so its left and right edges line up with the
   engagement row beneath it. The 16/9 crop was enforcing that alignment by making
   every image the same width; sizing to the media keeps the alignment without it. */
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-media-stage {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

/* height:auto over a max-height cap: the image sets its own height from its
   width, so it always fills the column edge to edge and stays flush with the
   actions row. A max-height with object-fit:contain would letterbox tall images
   inward and break that alignment. */
html body.community-active #arena-grid .mobile-community-card.has-community-media .mobile-community-media-stage img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    aspect-ratio: auto !important;
    border-radius: 16px !important;
}

/* Card flattening (no radius/shadow/border, hairline between posts) lives in the
   inline <style> block in templates/mobile.html, which loads after this file and
   wins on both order and specificity. Only the engagement row is styled here. */