/* ==========================================================================
   V27.5.0 REUSABLE FAN / PROFILE COMPONENTS
   ========================================================================== */
.profile-office-title {
    margin: 0;
    color: #f8fafc;
    font-size: clamp(18px, 3.2vw, 25px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0.025em;
}

.person-profile-scroll-box {
    width: 100%;
    min-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}

.person-profile-scroll-content {
    min-width: 0;
    padding: 2px 2px 0;
}

.rcm-profile-header {
    width: 100%;
    min-width: 0;
    margin: 0 0 20px;
    padding: 16px;
    border: 1px solid #334155;
    border-radius: 14px;
    background: #0b1220;
}

.rcm-profile-identity-row {
    display: grid;
    grid-template-columns: minmax(118px, 190px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
    min-width: 0;
}

.rcm-profile-avatar {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border: 1px solid #475569;
    border-radius: 14px;
    background: #111827;
}

.rcm-profile-identity {
    min-width: 0;
}

.rcm-profile-name {
    max-width: 100%;
    margin: 0 0 8px;
    color: #ffffff;
    font-size: clamp(22px, 4.0vw, 34px);
    font-weight: 900;
    line-height: 0.98;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.rcm-profile-location {
    margin: 0 0 12px;
    color: #a9b6ca;
    font-size: clamp(13px, 2.8vw, 17px);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.rcm-profile-metrics {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    width: 100%;
    min-width: 0;
    margin: 6px 0 14px;
    padding: 9px 10px;
    border: 1px solid #2b3a50;
    border-radius: 10px;
    background: #111827;
}

.rcm-profile-metric {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
    min-width: 0;
    color: #dbeafe;
    text-decoration: none;
    white-space: nowrap;
    font-size: clamp(11px, 2.5vw, 15px);
    line-height: 1.1;
}

.rcm-profile-metric strong {
    color: #ffffff;
    font-size: 1.05em;
    font-weight: 900;
}

.rcm-profile-metric span {
    min-width: 0;
    font-weight: 700;
}

.rcm-profile-metric:hover,
.rcm-profile-metric:active {
    color: #ffffff;
}

.rcm-profile-metric-divider {
    color: #475569;
    font-size: 15px;
    line-height: 1;
}

.rcm-profile-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
}

.rcm-profile-action-form {
    min-width: 0;
    margin: 0;
}

.rcm-profile-action-button {
    width: 100%;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid #2f80d8;
    border-radius: 9px;
    background: #1976d2;
    color: #ffffff;
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}

.rcm-profile-action-button:hover,
.rcm-profile-action-button:active {
    background: #1565c0;
}

.rcm-profile-action-button.is-active-like {
    border-color: #f9a825;
    background: #f9a825;
    color: #111827;
}

.rcm-profile-action-button.is-active-follow {
    border-color: #3e9b45;
    background: #2e7d32;
}

.rcm-profile-received-likes {
    margin-top: 8px;
    color: #718096;
    font-size: 11px;
    font-weight: 700;
    text-align: right;
}

.person-profile-about {
    margin: 0 0 18px;
    padding: 16px;
    border: 1px solid #263244;
    border-radius: 12px;
    background: #111827;
}

.person-profile-about h2 {
    margin: 0 0 8px;
    font-size: 20px;
}

.person-profile-about p {
    margin: 0;
    color: #d5deea;
    font-size: 15px;
    line-height: 1.55;
    white-space: pre-line;
}

.person-profile-links {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.person-profile-links a {
    display: inline-block;
    padding: 7px 10px;
    border: 1px solid #334155;
    border-radius: 8px;
    background: #0f172a;
    color: #93c5fd;
    font-size: 14px;
    font-weight: 800;
}

.person-profile-preview-grid {
    min-width: 0;
}

.person-profile-preview-grid .band-card {
    min-width: 0;
}

.person-profile-preview-grid .band-card a {
    min-width: 0;
}

.person-profile-preview-grid .band-card a span {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 600px) {
    .content-panel-header:has(.profile-office-title) {
        padding-bottom: 12px;
    }

    .profile-office-title {
        font-size: clamp(17px, 4.8vw, 22px);
    }

    .rcm-profile-header {
        padding: 12px;
        margin-bottom: 14px;
    }

    .rcm-profile-identity-row {
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 12px;
    }

    .rcm-profile-avatar {
        border-radius: 11px;
    }

    .rcm-profile-name {
        margin-bottom: 6px;
        font-size: clamp(20px, 5.8vw, 27px);
        line-height: 0.98;
    }

    .rcm-profile-location {
        margin-bottom: 8px;
        font-size: 12px;
    }

    .rcm-profile-metrics {
        gap: 4px;
        margin: 4px 0 9px;
        padding: 7px 6px;
    }

    .rcm-profile-metric {
        gap: 3px;
        font-size: clamp(9px, 2.55vw, 11px);
    }

    .rcm-profile-metric-divider {
        font-size: 12px;
    }

    .rcm-profile-actions {
        gap: 7px;
    }

    .rcm-profile-action-button {
        min-height: 38px;
        padding: 7px 8px;
        font-size: 13px;
    }

    .rcm-profile-received-likes {
        font-size: 9px;
    }

    .person-profile-about {
        padding: 13px;
    }
}

@media (max-width: 390px) {
    .rcm-profile-identity-row {
        grid-template-columns: 78px minmax(0, 1fr);
        gap: 9px;
    }

    .rcm-profile-name {
        font-size: clamp(20px, 6.8vw, 28px);
    }

    .rcm-profile-metric {
        font-size: 9px;
    }
}

/* ========================================================================== 
   V27.5.0 PROFILE FOLLOWING ENTITY ROW
   Five entity categories are specified for the final toolbar.  Only Bands is
   active in this test build; the other categories remain visible but inert.
   ========================================================================== */
.person-following-card {
    min-width: 0;
}

.person-following-card h2 {
    margin-bottom: 10px;
}

.person-following-entity-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.person-following-entity-button {
    display: flex;
    min-width: 0;
    min-height: 58px;
    padding: 9px 5px;
    border: 1px solid #3b4a60;
    border-radius: 9px;
    background: #172033;
    color: #d7e7fb;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-align: center;
    text-decoration: none;
    line-height: 1;
    overflow: hidden;
}

.person-following-entity-button strong {
    color: #ffffff;
    font-size: clamp(15px, 2.8vw, 19px);
    font-weight: 900;
}

.person-following-entity-button span {
    max-width: 100%;
    color: inherit;
    font-size: clamp(9px, 1.8vw, 12px);
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.person-following-entity-button.is-active {
    border-color: #2f80d8;
    background: #173a62;
    color: #ffffff;
    cursor: pointer;
}

.person-following-entity-button.is-active:hover,
.person-following-entity-button.is-active:active {
    background: #1d4f85;
}

.person-following-entity-button.is-pending {
    opacity: 0.72;
    cursor: default;
}

@media (max-width: 600px) {
    .person-following-entity-row {
        gap: 4px;
    }

    .person-following-entity-button {
        min-height: 52px;
        padding: 7px 2px;
        border-radius: 7px;
    }

    .person-following-entity-button strong {
        font-size: 14px;
    }

    .person-following-entity-button span {
        font-size: clamp(7px, 2.2vw, 9px);
    }
}

/* ==========================================================================
   V27.5.0 MY PROFILE APP-STYLE LAYOUT
   ========================================================================== */
.my-profile-identity-card {
    display: grid;
    grid-template-columns: minmax(110px, 190px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
    margin: 0 0 16px;
    padding: 16px;
    border: 1px solid #334155;
    border-radius: 14px;
    background: #0b1220;
}

.my-profile-avatar {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border: 1px solid #475569;
    border-radius: 13px;
    background: #111827;
}

.my-profile-identity-content {
    min-width: 0;
}

.my-profile-identity-content h2 {
    margin: 0 0 8px;
    color: #ffffff;
    font-size: clamp(26px, 5vw, 42px);
    font-weight: 900;
    line-height: 1;
    overflow-wrap: anywhere;
}

.my-profile-location {
    margin: 0 0 12px;
    color: #a9b6ca;
    font-size: 15px;
    font-weight: 800;
}

.my-profile-description {
    margin: 0;
    color: #d5deea;
    font-size: 15px;
    line-height: 1.55;
    white-space: pre-line;
}

.my-profile-description.is-muted {
    color: #7f8da1;
}

.my-profile-social-links {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.my-profile-social-links a {
    display: inline-flex;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid #3b4a60;
    border-radius: 8px;
    background: #172033;
    color: #93c5fd;
    align-items: center;
    font-size: 12px;
    font-weight: 900;
}

.my-profile-social-links a:hover,
.my-profile-social-links a:active {
    background: #1d4f85;
    color: #ffffff;
}

.my-profile-visibility-notice {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #8a6425;
    border-radius: 10px;
    background: #3a2d16;
    color: #f4d58d;
}

.my-profile-visibility-notice a {
    color: #ffffff;
    font-weight: 900;
}

.my-profile-stat-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 16px;
}

.my-profile-stat {
    display: flex;
    min-width: 0;
    min-height: 74px;
    padding: 11px;
    border: 1px solid #334155;
    border-radius: 11px;
    background: #172033;
    color: #dbeafe;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    text-align: center;
}

.my-profile-stat strong {
    color: #ffffff;
    font-size: clamp(22px, 4vw, 30px);
    font-weight: 900;
}

.my-profile-stat span {
    color: #a9b6ca;
    font-size: 13px;
    font-weight: 800;
}

.my-profile-stat:hover,
.my-profile-stat:active {
    border-color: #60a5fa;
    background: #1d4f85;
    color: #ffffff;
}

@media (max-width: 600px) {
    .my-profile-identity-card {
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 12px;
        padding: 12px;
    }

    .my-profile-identity-content h2 {
        font-size: clamp(22px, 7vw, 32px);
    }

    .my-profile-description {
        font-size: 13px;
    }

    .my-profile-stat-row {
        gap: 6px;
    }

    .my-profile-stat {
        min-height: 64px;
        padding: 8px 5px;
    }

    .my-profile-stat span {
        font-size: 11px;
    }
}

/* ========================================================================== 
   V27.5.0 MY PROFILE SCROLL / ADAPTIVE FOOTER SHELL
   ========================================================================== */
.my-profile-scroll-box {
    width: 100%;
    min-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.my-profile-scroll-content {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 2px 2px 0;
}


/* V27.5.2 compact public profile typography */
.person-profile-preview-grid { gap: 12px; margin-top: 12px; }
.person-profile-preview-grid .band-card { padding: 13px; border-radius: 11px; }
.person-profile-preview-grid .band-card h2 { margin: 0 0 9px; font-size: 18px; line-height: 1.1; }
.person-profile-preview-grid .band-card h3 { margin-top: 15px !important; margin-bottom: 7px; font-size: 13px; line-height: 1.15; color: #cbd5e1; }
.person-profile-preview-grid .band-card p { font-size: 12px; line-height: 1.35; }
@media (max-width: 600px) {
    .person-profile-preview-grid { gap: 9px; margin-top: 9px; }
    .person-profile-preview-grid .band-card { padding: 10px; }
    .person-profile-preview-grid .band-card h2 { font-size: 16px; }
    .person-profile-preview-grid .band-card h3 { font-size: 12px; }
}

/* ========================================================================== 
   V27.5.4 PUBLIC PROFILE ACTIVITY TOOLBAR
   ========================================================================== */
.person-activity-card {
    min-width: 0;
}

.person-activity-card h2 {
    margin-bottom: 10px;
}

.person-activity-entity-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.person-activity-entity-button {
    display: flex;
    min-width: 0;
    min-height: 58px;
    padding: 9px 5px;
    border: 1px solid #8a6425;
    border-radius: 9px;
    background: #3a2d16;
    color: #fff2bd;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-align: center;
    text-decoration: none;
    line-height: 1;
    overflow: hidden;
}

.person-activity-entity-button strong {
    color: #ffffff;
    font-size: clamp(15px, 2.8vw, 19px);
    font-weight: 900;
}

.person-activity-entity-button span {
    max-width: 100%;
    color: inherit;
    font-size: clamp(9px, 1.8vw, 12px);
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.person-activity-entity-button:hover,
.person-activity-entity-button:active {
    border-color: #d49a32;
    background: #503b18;
    color: #ffffff;
}

.person-activity-entity-button.is-followers {
    border-color: #4c698e;
    background: #183453;
    color: #dbeafe;
}

.person-activity-entity-button.is-followers:hover,
.person-activity-entity-button.is-followers:active {
    background: #214a76;
}

@media (max-width: 600px) {
    .person-activity-entity-row {
        gap: 4px;
    }

    .person-activity-entity-button {
        min-height: 52px;
        padding: 7px 2px;
        border-radius: 7px;
    }

    .person-activity-entity-button strong {
        font-size: 14px;
    }

    .person-activity-entity-button span {
        font-size: clamp(7px, 2.2vw, 9px);
    }
}

/* ==========================================================================
   V27.5.43 BACKSTAGE FULLSCREEN ENTITY LIST FMD
   The dialog is re-parented to document.body by entity_list_modal.js so fixed
   positioning remains viewport-relative on phone and desktop app shells.
   ========================================================================== */
.rcm-entity-list-modal[hidden] {
    display: none !important;
}

.rcm-entity-list-modal {
    position: fixed;
    inset: 0;
    z-index: 18000;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));
    background: rgba(0, 0, 0, 0.78);
}

.rcm-entity-list-modal-dialog {
    display: flex;
    flex-direction: column;
    width: min(94vw, 560px);
    max-height: min(90dvh, 760px);
    overflow: hidden;
    box-sizing: border-box;
    border: 2px solid #3b4d66;
    border-radius: 14px;
    background: #0f1726;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.62);
}

.rcm-entity-list-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: 0 0 auto;
    padding: 10px 12px;
    border-bottom: 1px solid #334155;
    background: #162236;
}

.rcm-entity-list-modal-title {
    min-width: 0;
    color: #ffffff;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rcm-entity-list-modal-close {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    padding: 0;
    border: 1px solid #64748b;
    border-radius: 8px;
    background: #243247;
    color: #ffffff;
    font-size: 23px;
    font-weight: 700;
    line-height: 29px;
    cursor: pointer;
}

.rcm-entity-list-modal-close:hover,
.rcm-entity-list-modal-close:active {
    background: #334761;
}

.rcm-entity-list-modal-body {
    min-height: 220px;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 8px;
    box-sizing: border-box;
    background: #0b1220;
}

.rcm-entity-list-modal-loading,
.rcm-entity-list-modal-error {
    display: flex;
    min-height: 220px;
    align-items: center;
    justify-content: center;
    padding: 18px;
    color: #cbd5e1;
    font-size: 14px;
    font-weight: 800;
    text-align: center;
}

.rcm-entity-list-modal-error {
    color: #fecaca;
}

.rcm-entity-list-modal-content .band-relative-back-row,
.rcm-entity-list-modal-content .relative-back-row,
.rcm-entity-list-modal-content .profile-relative-back-row,
.rcm-entity-list-modal-content .band-relative-profile-name,
.rcm-entity-list-modal-content .relative-owner,
.rcm-entity-list-modal-content .profile-relative-owner,
.rcm-entity-list-modal-content .band-list-head h1,
.rcm-entity-list-modal-content .venue-list-head h1,
.rcm-entity-list-modal-content .musician-list-head h1,
.rcm-entity-list-modal-content .profile-list-head h1,
.rcm-entity-list-modal-content .event-follow-head h1 {
    display: none !important;
}

.rcm-entity-list-modal-content .band-list-head,
.rcm-entity-list-modal-content .venue-list-head,
.rcm-entity-list-modal-content .musician-list-head,
.rcm-entity-list-modal-content .profile-list-head,
.rcm-entity-list-modal-content .event-follow-head {
    margin: 0 0 8px !important;
}

.rcm-entity-list-modal-content .band-list-scroll-box,
.rcm-entity-list-modal-content .venue-list-scroll-box,
.rcm-entity-list-modal-content .musician-list-scroll-box,
.rcm-entity-list-modal-content .profile-list-scroll-box,
.rcm-entity-list-modal-content .event-follow-scroll {
    height: min(46dvh, 410px) !important;
    min-height: 210px !important;
}



@media (max-width: 600px) {
    .rcm-entity-list-modal {
        align-items: stretch;
        padding: max(8px, env(safe-area-inset-top)) 6px max(8px, env(safe-area-inset-bottom));
    }

    .rcm-entity-list-modal-dialog {
        width: 100%;
        max-height: calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)));
        margin: auto 0;
        border-radius: 12px;
    }

    .rcm-entity-list-modal-header {
        padding: 8px 9px;
    }

    .rcm-entity-list-modal-title {
        font-size: 17px;
    }

    .rcm-entity-list-modal-close {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
        font-size: 22px;
    }

    .rcm-entity-list-modal-body {
        min-height: 0;
        padding: 6px;
    }

    .rcm-entity-list-modal-content .band-list-scroll-box,
    .rcm-entity-list-modal-content .venue-list-scroll-box,
    .rcm-entity-list-modal-content .musician-list-scroll-box,
    .rcm-entity-list-modal-content .profile-list-scroll-box,
    .rcm-entity-list-modal-content .event-follow-scroll {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}

/* V27.7.10.5.14 — public Fan detail parity with My Fan; remove duplicate metrics. */
.rcm-public-fan-profile {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    min-width: 0;
}
.rcm-public-fan-identity-card {
    margin: 0;
}
.rcm-public-fan-stat-row {
    margin: 0;
}
.rcm-public-fan-relation-row {
    display: flex;
    justify-content: flex-start;
    min-width: 0;
}
.rcm-public-fan-relation-row .rcm-detail-relations {
    width: auto;
    margin: 0;
}
.rcm-public-fan-relation-row .rcm-detail-relation-buttons {
    justify-content: flex-start;
}
@media (max-width: 600px) {
    .rcm-public-fan-profile { gap: 9px; }
    .rcm-public-fan-relation-row .rcm-detail-relation-buttons { gap: 6px; }
}

/* V27.7.10.5.15 - Backstage lower tiles are informational; relationship detail opens only from the three canonical stats above. */
.person-following-entity-button.is-stat,.person-activity-entity-button.is-stat{cursor:default;pointer-events:none;text-decoration:none}.person-activity-entity-row{grid-template-columns:repeat(5,minmax(0,1fr))}.person-activity-entity-button.is-received{border-color:#6b4ea0;background:#2b2150;color:#efe7ff}@media(max-width:600px){.person-activity-entity-row{grid-template-columns:repeat(5,minmax(0,1fr))}.person-activity-entity-button.is-stat span{white-space:normal;line-height:1.05}}

/* V27.7.10.5.16 - shared Backstage relationship accordion.
   This MUST live in the globally loaded profile layer because relationship
   views are also injected into the reusable entity-list FMD; page-local CSS
   is not present when only .content-panel-body is fetched. */
.person-rel-head{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:4px 2px 8px;
}
.person-rel-head h1{
    margin:0;
    font-size:22px;
    line-height:1.1;
}
.person-rel-page{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
}
.person-rel-group{
    border:1px solid #315071;
    border-radius:10px;
    overflow:hidden;
    background:#091321;
    box-shadow:0 4px 14px rgba(0,0,0,.28);
}
.person-rel-group-head{
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin:0;
    padding:8px 11px;
    border:0;
    border-radius:0;
    background:linear-gradient(180deg,#1b466f 0%,#153653 100%);
    color:#fff;
    font:inherit;
    font-size:14px;
    font-weight:900;
    line-height:1.1;
    text-align:left;
    cursor:pointer;
}
.person-rel-group-head:hover,
.person-rel-group-head:focus-visible{
    background:linear-gradient(180deg,#245987 0%,#194266 100%);
    outline:none;
}
.person-rel-group-head>span{
    display:flex;
    align-items:center;
    gap:7px;
    min-width:0;
}
.person-rel-group-head strong{
    min-width:28px;
    padding:3px 7px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:#0b1829;
    color:#fff;
    font-size:12px;
    text-align:center;
}
.person-rel-chevron{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    flex:0 0 18px;
    font-size:15px;
    line-height:1;
    transition:transform .15s ease;
}
.person-rel-group-head[aria-expanded="false"] .person-rel-chevron{
    transform:rotate(-90deg);
}
.person-rel-group-body{
    display:flex;
    flex-direction:column;
    gap:7px;
    padding:7px;
    max-height:330px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:#356a9c #08111e;
}
.person-rel-group-body .rcm-relation-card{
    margin:0;
    flex:0 0 auto;
}
.person-rel-group-body[hidden]{
    display:none!important;
}
.rcm-entity-list-modal-content .person-rel-head{
    display:none;
}
.rcm-entity-list-modal-content .person-rel-page{
    overflow:visible;
    gap:8px;
}
.rcm-entity-list-modal-content .person-rel-group-body{
    max-height:min(330px,44vh);
}
@media(max-width:600px){
    .person-rel-head h1{font-size:20px}
    .person-rel-group-body{max-height:300px}
    .rcm-entity-list-modal-content .person-rel-group-body{max-height:min(300px,42vh)}
}

/* V27.7.10.5.18 Fan relationship/reminder parity. */
.rcm-public-fan-stat-row .my-profile-stat,
.my-fan-detail-card .my-profile-stat {
    position:relative;
}
.my-profile-reminder-stat {
    border-color:#8a6425;
    background:#2f2818;
}
.my-profile-reminder-stat:hover,
.my-profile-reminder-stat:active {
    border-color:#f2b233;
    background:#4a3514;
}
.person-reminders-page {
    width:100%;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
}
.person-reminders-list {
    display:flex;
    flex-direction:column;
    gap:8px;
}
.person-reminder-card {
    display:grid;
    grid-template-columns:minmax(0,1fr) 46px;
    align-items:center;
    gap:10px;
    min-height:72px;
    padding:8px;
    border:1px solid #31547b;
    border-radius:12px;
    background:#08111e;
    color:#fff;
}
.person-reminder-card:hover,
.person-reminder-card:focus-within {
    border-color:#60a5fa;
    background:#0d1c31;
}
.person-reminder-link {
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    align-items:center;
    gap:10px;
    min-width:0;
    color:#fff;
    text-decoration:none;
}
.person-reminder-link:focus-visible {outline:2px solid #60a5fa;outline-offset:2px;border-radius:8px}
.person-reminder-date {
    display:flex;
    min-height:54px;
    border:1px solid #287e64;
    border-radius:10px;
    background:#0d4a3a;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    line-height:1;
}
.person-reminder-date strong {font-size:11px;color:#f6b74b}
.person-reminder-date span {margin-top:4px;font-size:20px;font-weight:900}
.person-reminder-main {display:flex;min-width:0;flex-direction:column;gap:3px}
.person-reminder-main strong,
.person-reminder-main span,
.person-reminder-main small {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.person-reminder-main strong {color:#f4b21d;font-size:15px}
.person-reminder-main span {color:#dbeafe;font-size:13px;font-weight:800}
.person-reminder-main small {color:#94a3b8;font-size:11px}
.person-reminder-bell {font-size:22px;text-align:center}
.person-reminder-bell-button {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:1px;
    width:44px;
    min-height:44px;
    padding:3px;
    border:2px solid #f59e0b;
    border-radius:999px;
    background:#3b2a0b;
    color:#fbbf24;
    font:inherit;
    cursor:pointer;
    touch-action:manipulation;
}
.person-reminder-bell-button span[aria-hidden="true"]{font-size:20px;line-height:1}
.person-reminder-bell-button .person-reminder-bell-state{font-size:8px;font-weight:950;line-height:1;text-transform:uppercase}
.person-reminder-bell-button:hover,.person-reminder-bell-button:active{background:#5a3a08;border-color:#facc15}
.person-reminder-bell-button:disabled{opacity:.45;cursor:wait}
.person-reminders-empty {
    padding:18px 12px;
    border:1px dashed #334155;
    border-radius:10px;
    color:#a9b6ca;
    text-align:center;
}
.rcm-entity-list-modal-content .person-reminders-page {overflow:visible}
@media(max-width:600px){
    .my-profile-stat-row {grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
    .my-profile-stat {min-height:60px;padding:7px 3px}
    .my-profile-stat strong {font-size:clamp(19px,6vw,25px)}
    .my-profile-stat span {font-size:9px;line-height:1.05}
}

/* V27.7.10.5.20 — private Fan relationship header + stat alignment. */
.preference-list-head-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    width:100%;
}
.preference-my-fan-back{
    color:#fff!important;
    font-weight:950!important;
    text-decoration:none!important;
    font-size:15px;
    line-height:1.15;
}
.preference-my-fan-back:hover,.preference-my-fan-back:active{color:#dbeafe!important}
.preference-close-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 38px;
    width:38px;
    height:38px;
    border:1px solid #64748b;
    border-radius:50%;
    background:#132238;
    color:#fff!important;
    font-size:27px;
    font-weight:900;
    line-height:1;
    text-decoration:none!important;
}
.preference-close-button:hover,.preference-close-button:active{background:#1d3554}
.my-profile-stat-row,
.rcm-public-fan-stat-row{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    align-items:stretch;
}
.my-profile-stat-row .my-profile-stat,
.rcm-public-fan-stat-row .my-profile-stat{
    width:100%;
    min-width:0;
    min-height:72px;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    text-align:center;
}
.my-profile-stat-row .my-profile-stat span,
.rcm-public-fan-stat-row .my-profile-stat span{
    min-height:2.05em;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}
@media(max-width:600px){
    .preference-my-fan-back{font-size:14px}
    .preference-close-button{width:34px;height:34px;flex-basis:34px;font-size:24px}
    .my-profile-stat-row .my-profile-stat,.rcm-public-fan-stat-row .my-profile-stat{min-height:64px}
}


/* V27.7.10.5.21 public Fan readability / stat parity. */
.rcm-public-fan-identity-card .my-profile-identity-content h2{font-size:clamp(21px,5.4vw,29px)!important;line-height:1.02}
.rcm-public-fan-identity-card .my-profile-location{margin:2px 0 7px;font-size:12px;color:#cbd5e1}
.rcm-public-fan-identity-card .my-profile-location strong{color:#fff;font-weight:900}
.person-activity-entity-row{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:600px){
  .rcm-public-fan-identity-card .my-profile-identity-content h2{font-size:clamp(20px,6.2vw,26px)!important}
  .rcm-public-fan-stat-row{gap:5px!important}
  .rcm-public-fan-stat-row .my-profile-stat{padding:6px 3px!important}
}

/* V27.7.10.5.21 align Fan relation controls with their primary stats. */
.rcm-public-fan-relation-row{width:100%}
.rcm-public-fan-relation-row .rcm-detail-relations{width:100%}
.rcm-public-fan-relation-row .rcm-detail-relation-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;width:100%}
.rcm-public-fan-relation-row .rcm-detail-relation-button{width:100%;min-width:0;padding-left:4px;padding-right:4px}
.rcm-public-fan-relation-row .rcm-detail-relation-button.is-like{grid-column:1}
.rcm-public-fan-relation-row .rcm-detail-relation-button.is-follow{grid-column:3}

/* V27.7.10.5.22 Fan relation/state cleanup. */
.rcm-public-fan-relation-row .rcm-detail-relation-buttons{
    display:flex!important;
    align-items:center;
    justify-content:flex-start!important;
    gap:7px!important;
    width:auto!important;
}
.rcm-public-fan-relation-row .rcm-detail-relation-button{
    width:auto!important;
    min-width:76px!important;
    grid-column:auto!important;
}
.rcm-public-fan-stat-row .my-profile-stat:nth-child(1),
.rcm-public-fan-stat-row .my-profile-stat:nth-child(2),
.rcm-public-fan-stat-row .my-profile-stat:nth-child(3){border-color:#334155;background:#172238}
.rcm-public-fan-stat-row .my-profile-reminder-stat,
.my-profile-stat-row .my-profile-reminder-stat{border-color:#8a6300;background:#33270b}

/* RCM_APP_28.1.3.30 — Alerts owns an app-local Back control, not browser history. */
.person-alerts-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:4px 2px 8px;
}
.person-alerts-head h1{margin:0;font-size:22px;line-height:1.1}
.person-alerts-back-button{
    min-width:82px;
    min-height:34px;
    padding:5px 11px;
    border:2px solid #60a5fa;
    border-radius:8px;
    background:#172554;
    color:#fff;
    font-size:13px;
    font-weight:900;
    line-height:1;
    cursor:pointer;
}
.person-alerts-back-button:hover,.person-alerts-back-button:active{background:#1d4ed8;border-color:#93c5fd}
@media(max-width:600px){
    .person-alerts-head h1{font-size:20px}
    .person-alerts-back-button{min-width:76px;min-height:32px;padding:4px 9px;font-size:12px}
}

/* RCM_APP_28.1.3.34 — Alerts scroll ownership + day rollups. */
.person-reminders-page {
    height: calc(100dvh - 250px);
    min-height: 280px;
    max-height: 650px;
    overscroll-behavior-y: contain;
    touch-action: pan-y pinch-zoom;
}
.person-reminders-list[data-rcm-alert-groups="1"] {
    gap: 9px;
}
.person-reminder-day {
    border: 1px solid #35506f;
    border-radius: 11px;
    background: #0a1321;
    overflow: clip;
}
.person-reminder-day[open] {
    border-color: #4f6e91;
}
.person-reminder-day-header {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 8px 10px;
    list-style: none;
    cursor: pointer;
    background: #172438;
    color: #f8fafc;
    font-size: 13px;
    font-weight: 950;
    touch-action: manipulation;
}
.person-reminder-day-header::-webkit-details-marker {display:none}
.person-reminder-day-header::before {
    content: '▸';
    flex: 0 0 auto;
    color: #f6b74b;
    font-size: 13px;
    transition: transform .12s ease;
}
.person-reminder-day[open] > .person-reminder-day-header::before {transform:rotate(90deg)}
.person-reminder-day-label {flex:1;min-width:0}
.person-reminder-day-count {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:25px;
    height:25px;
    padding:0 7px;
    border-radius:999px;
    background:#0b1220;
    color:#f6b74b;
    font-size:12px;
    font-weight:950;
}
.person-reminder-day-body {
    display:flex;
    flex-direction:column;
    gap:8px;
    max-height:min(410px,48dvh);
    overflow-y:auto;
    overflow-x:hidden;
    padding:8px;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y pinch-zoom;
    overscroll-behavior-y:auto;
    scrollbar-gutter:stable;
}
.person-reminder-day-body .person-reminder-card {margin:0}

/* The reusable Backstage modal owns vertical scrolling. Loaded list fragments
   should not create an accidental second vertical scroller. */
.rcm-entity-list-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y pinch-zoom;
}
.rcm-entity-list-modal-content .person-reminders-page {
    height:auto;
    min-height:0;
    max-height:none;
    overflow:visible;
    touch-action:auto;
}

@media(max-width:600px){
    .person-reminders-page {
        height: calc(100dvh - 220px);
        min-height: 260px;
        max-height: none;
    }
    .person-reminder-day-header {min-height:44px;font-size:13px}
    .rcm-entity-list-modal-content .person-reminders-page {height:auto;min-height:0}
}