/* ==========================================================================
   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 {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 26px;
    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;
}

/* RCM_APP_28.3.6: the admin control panel buttons (admin account only). */
.my-profile-admin-panel {
    display: flex;
    flex: none;
    flex-direction: column;
    gap: 8px;
    width: 104px;
}

/* RCM_APP_28.8.22.3 (Luis, Oct-12): the switches on the left, the two (narrower) buttons on the right, across the whole card. */
.my-profile-admin-row {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.my-profile-admin-button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 7px 12px;
    border: 1px solid #b45309;
    border-radius: 9px;
    background: #3b2a0b;
    color: #fbbf24;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}

.my-profile-admin-button:hover,
.my-profile-admin-button:active {
    background: #57400f;
    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-public-preview-readonly{flex:0 0 auto;padding:4px 8px;border:1px solid #9ca3af;border-radius:999px;background:#4b5563;color:#f3f4f6;font-size:10px;font-weight:950;letter-spacing:.08em;white-space:nowrap}
.rcm-public-preview-readonly[hidden]{display:none!important}
.rcm-public-preview-zoom{display:flex;align-items:center;justify-content:center;gap:5px;margin-left:auto}
.rcm-public-preview-zoom[hidden]{display:none!important}
.rcm-public-preview-zoom button{width:30px;height:28px;padding:0;border:1px solid #64748b;border-radius:7px;background:#243247;color:#fff;font-size:19px;font-weight:900;line-height:1;cursor:pointer}
.rcm-public-preview-zoom span{min-width:42px;color:#cbd5e1;font-size:11px;font-weight:900;text-align:center}
.rcm-entity-list-modal-dialog.is-public-preview{width:min(96vw,680px);max-height:94dvh;border-color:#7c838c;background:#2f3338;box-shadow:0 18px 48px rgba(0,0,0,.62),0 0 0 3px rgba(156,163,175,.18)}
.rcm-entity-list-modal-dialog.is-public-preview .rcm-entity-list-modal-header{border-bottom-color:#6b7280;background:#444a51}
.rcm-entity-list-modal-dialog.is-public-preview .rcm-entity-list-modal-title{color:#f3f4f6}
.rcm-entity-list-modal-dialog.is-public-preview .rcm-entity-list-modal-body{background:#34383d}
.rcm-entity-list-modal-dialog.is-public-preview .rcm-public-preview-zoom button{border-color:#8b929b;background:#565c64;color:#f8fafc}
.rcm-entity-list-modal-dialog.is-public-preview .rcm-public-preview-zoom span{color:#e5e7eb}
.rcm-public-preview-modal-content{width:100%;min-width:0;transform-origin:top left;padding:5px;box-sizing:border-box;border:1px dashed #777f88;border-radius:10px;background:#292d32}
.rcm-public-preview-card{margin:0!important;width:100%!important}
.rcm-public-preview-modal-content a,
.rcm-public-preview-modal-content button,
.rcm-public-preview-modal-content input,
.rcm-public-preview-modal-content select,
.rcm-public-preview-modal-content textarea{pointer-events:none!important}
.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-list {
    display:flex;
    flex-direction:column;
    gap:8px;
}
/* RCM_APP_28.8.20.9: the Alerts card is the shared show ticket (.rcm-ticket in style.css); only its bell row here. */
.person-reminder-timeline {display:flex;align-items:center;justify-content:space-between;gap:6px}
.person-reminder-titleline {position:relative;min-width:0}
.person-reminder-card .rcm-ticket-time {flex:0 1 auto}
.person-reminder-confirm {grid-column:1 / -1}
.person-reminder-timeline .person-reminder-bell-button {width:26px;min-height:26px;padding:0;flex:0 0 auto}
.person-reminder-timeline .person-reminder-bell-button .person-reminder-bell-state {font-size:7px}
.person-reminder-timeline .person-reminder-bell-button span[aria-hidden="true"] {font-size:13px}
.person-reminder-day-tile {display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:38px;height:38px;flex:0 0 auto;border:2px solid #4ade80;border-radius:8px;background:#15803d;color:#fff;line-height:.95}
.person-reminder-day-tile small {font-size:8px;font-weight:900}
.person-reminder-day-tile b {font-size:17px;font-weight:950}
.person-reminder-card.is-muted > :not(.person-reminder-confirm) {opacity:.5;filter:grayscale(1)}
.person-reminder-confirm {display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:2px;padding:6px;border:1px solid #f59e0b;border-radius:9px;background:#1f1505;color:#fde68a;font-size:13px;font-weight:900}
.person-reminder-confirm[hidden] {display:none}
.person-reminder-confirm button {padding:5px 10px;border-radius:7px;font:inherit;font-size:12px;cursor:pointer}
.person-reminder-cancel {border:1px solid #475569;background:#172033;color:#e2e8f0}
.person-reminder-remove {border:1px solid #b91c1c;background:#7f1d1d;color:#fff}
.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;
}
@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}
}

/* Alerts page owns one vertical page scroller; each open day owns only its
   bounded 5.5-row list. Keep all page geometry here instead of layering a
   second person-reminders-page definition elsewhere in this stylesheet. */
.person-reminders-page {
    width: 100%;
    height: calc(100dvh - 250px);
    min-height: 280px;
    max-height: 650px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    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;
}
/* RCM_APP_28.8.21.7 (Luis, Oct-8): each Alerts day (and Used tickets) is one STACK of tickets -- swipe to flip,
   round and round; the top ticket whole, the next two peeking a few pixels below. */
.person-reminder-day-body {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    padding:8px 8px 4px;
    touch-action:pan-y pinch-zoom;
}
.person-reminder-day-body > .person-reminder-card {grid-area:1 / 1;margin:0;transition:transform var(--rcm-ticket-motion,.7s) ease;box-shadow:-5px -5px 12px rgba(71,85,105,.5);user-select:none;-webkit-user-drag:none}
.person-reminder-day-body > [data-stack-depth="0"] {z-index:3}
.person-reminder-day-body > [data-stack-depth="1"] {z-index:2;transform:translateY(7px) scale(.97);filter:brightness(.85);pointer-events:none}
.person-reminder-day-body > [data-stack-depth="2"] {z-index:1;transform:translateY(14px) scale(.94);filter:brightness(.7);pointer-events:none}
.person-reminder-day-body > [data-stack-depth="wait"] {visibility:hidden;pointer-events:none}
.person-reminder-day-body > .person-reminder-stack-count {grid-row:2;margin-top:18px}
.person-reminder-day-body > [data-used-history] {grid-row:3;margin-top:10px}
.person-reminder-stack-count {justify-self:center;color:#94a3b8;font-size:12px;font-weight:900;letter-spacing:1px}

/* 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}
}

/* RCM_APP_28.1.3.40 — superseded in .41 by rendered-height 3.5-card sizing. */

/* Alerts day body shows five complete rows plus half of the sixth when
   scrolling is available. JS measures rendered heights so the 5.5-row cue
   remains reliable with long performer names and narrow phones. */


/* RCM_APP_28.8.20.11: the Used tickets drawer (shows that are over) at the top of Alerts. */
.person-reminder-used {margin:0 0 9px;border:1px solid #6b7280;border-radius:11px;background:#2b2e33;overflow:clip}   /* 17.17: charcoal gray, always shown */
.person-reminder-used-stamp {display:inline-block;transform:rotate(-3deg);border:3px double #b0161a;border-radius:6px;padding:2px 9px;color:#d4393d;font:900 15px/1 'Arial Black',Arial,sans-serif;letter-spacing:3px;opacity:.9}   /* 17.17: a USED stamp line instead of the words Used tickets */
.person-reminder-card.is-used .rcm-ticket-stub img {filter:grayscale(.6)}

/* RCM_APP_28.8.20.14 (Luis, Oct-7): the red USED stamp on a used ticket; HISTORY tickets muted grey. */
.person-reminder-card.is-used {position:relative}
.rcm-ticket-stamp {position:absolute;right:30px;bottom:22px;z-index:8;pointer-events:none;transform:rotate(14deg);border:3px double #b0161a;border-radius:6px;padding:3px 8px;color:#b0161a;font:900 17px/1 'Arial Black',Arial,sans-serif;letter-spacing:3px;opacity:.8;text-align:center}   /* 28.8.20.17: slants down, sits low on the right, clear of the date */
.person-reminder-card.is-history {filter:grayscale(1);opacity:.75}
.person-reminder-history {display:flex;flex-direction:column;gap:8px}
.person-reminder-history-open {padding:9px;border:1px dashed #4b6584;border-radius:9px;background:#0f1b2d;color:#cbd5e1;font-weight:700;cursor:pointer}
.person-reminder-history-open.is-error {border-color:#dc2626;color:#fca5a5}
.person-reminder-history-wait {padding:12px;color:#fde68a;font-weight:700;text-align:center}
.my-profile-alerts {display:inline-flex;align-items:center;gap:3px;flex:none;padding:2px 8px;border:1px solid #f59e0b;border-radius:999px;background:#1f2937;color:#fde68a;font-size:14px;text-decoration:none}
.my-profile-alerts strong {font-size:12px;color:#fff}
.my-profile-location-text {flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-profile-identity-card > .my-profile-name {grid-column:1 / -1;min-width:0;margin:0;color:#fff;font-size:clamp(22px,6vw,34px);font-weight:900;line-height:1.1;white-space:nowrap}
.my-profile-name .rcm-card-marquee {display:block;max-width:100%}
/* RCM_APP_28.8.20.15: the Alerts sample for guests and unverified fans. */
.person-reminders-sample {display:flex;flex-direction:column;gap:9px}
.person-reminders-sample-label {color:#fde68a;font-weight:800;font-size:13px;text-align:center}
.person-reminders-sample-sign {padding:12px;border:2px solid #f59e0b;border-radius:12px;background:#2a1d05;color:#fde68a;font-size:14px;line-height:1.35;text-align:center}
.person-reminders-sample-sign strong {color:#fff}
.person-reminders-sample-join {display:block;width:max-content;margin:10px auto 0;padding:8px 18px;border-radius:999px;background:#f59e0b;color:#111;font-weight:900;text-decoration:none}
.rcm-ticket-date {display:block;margin:1px 0;color:rgba(0,0,0,.6);font-size:9px;line-height:1.1;font-weight:900;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}   /* 28.8.20.17: as GENERAL ADMISSION */
/* RCM_APP_28.8.21 (Luis, Oct-8): Server Pulse -- the admin VIP's busy/speed panel under the identity card. */
.server-pulse {margin:0 0 14px;border:1px solid #334155;border-radius:12px;background:#0b1220;overflow:hidden}
.server-pulse-bar {display:flex;align-items:center;gap:8px;padding:10px 12px;cursor:pointer;list-style:none;color:#e2e8f0;font-weight:900}
.server-pulse-bar::-webkit-details-marker {display:none}
.server-pulse-dot {flex:none;width:12px;height:12px;border-radius:50%;background:#64748b}
.server-pulse-dot.is-ok {background:#22c55e;box-shadow:0 0 6px #22c55e}
.server-pulse-dot.is-warn {background:#facc15;box-shadow:0 0 6px #facc15}
.server-pulse-dot.is-bad {background:#ef4444;box-shadow:0 0 6px #ef4444}
.server-pulse-title {flex:none;font-size:13px}
.server-pulse-now {flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;font-size:13px;color:#cbd5e1}
.server-pulse-body {display:flex;flex-direction:column;gap:8px;padding:0 4px 10px}   /* NO inner scroller: only the page scrolls */
.server-pulse-chart {padding:6px 6px 3px;border:1px solid #64748b;border-left:4px solid #22c55e;border-radius:10px;background:#020617;box-shadow:0 0 0 2px #0b1220}   /* 28.8.22.3: a clear frame around every chart */
.server-pulse-busiest, .server-pulse-empty {font-size:11px;color:#94a3b8;text-align:center}
.server-pulse-axis {display:flex;justify-content:space-between;font-size:10px;color:#64748b;font-weight:800}
.person-reminders-sample .person-reminder-card a {pointer-events:none}   /* 28.8.21.8: guest sample tickets are look-only */
/* RCM_APP_28.8.21.9 (Luis, Oct-8): the admin VIP's switches on My Fan. */
.my-profile-vip-switches {display:flex;flex:1;min-width:0;flex-direction:column;gap:8px;margin:0}
.vip-switch {display:flex;align-items:center;gap:10px;color:#e2e8f0;font-size:14px;font-weight:800;cursor:pointer}
.vip-switch input {position:absolute;opacity:0;width:1px;height:1px}
.vip-switch-track {position:relative;flex:none;width:40px;height:22px;border-radius:999px;background:#334155;border:1px solid #64748b;transition:background .15s}
.vip-switch-track::after {content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#cbd5e1;transition:transform .15s}
.vip-switch input:checked + .vip-switch-track {background:#16a34a;border-color:#4ade80}
.vip-switch input:checked + .vip-switch-track::after {transform:translateX(18px);background:#fff}
.vip-switch-danger {color:#fecaca}
.vip-switch-danger input:checked + .vip-switch-track {background:#dc2626;border-color:#fca5a5}
/* RCM_APP_28.8.21.15 (Luis, Oct-9): fans over time -- key column, smooth horizontal scroller, peak/half/quarter lines. */
.server-pulse-fans-main {display:flex;align-items:stretch;position:relative}
.server-pulse-fans-key {display:flex;flex-wrap:wrap;align-items:center;gap:3px 9px;margin:0 0 4px;padding:3px 6px;border:1px solid #334155;border-radius:6px;font-size:12px;font-weight:900;color:#f8fafc}   /* 28.8.22.2: one horizontal legend row across the top */
.server-pulse-fans-row {display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.server-pulse-fans-row.is-right {margin-left:auto}
.server-pulse-fans-row.is-right ~ .server-pulse-fans-row.is-right {margin-left:0}
.server-pulse-fans-row b {color:#fff}
.server-pulse-fans-total b {color:inherit}
.server-pulse-fans-row em {font-style:normal}
.server-pulse-fans-row.is-plain {color:#e2e8f0;font-weight:700}
.server-pulse-key-group {display:flex;flex-direction:column;gap:1px;line-height:1.15}   /* 28.8.24.14.5: a small cluster of keys stacked (a number with its small line under it) */
.server-pulse-key-group.is-right {margin-left:auto;align-items:flex-end}
.server-pulse-key-group.is-row {flex-direction:row;align-items:center;justify-content:space-between;width:100%}   /* 28.8.24.14.7.5: Add taps on the left, the time on the right, one line */
.server-pulse-sub {font-size:11px;font-weight:800}
.server-pulse-eq {gap:5px}
.server-pulse-eq-part {display:inline-flex;flex-direction:column;align-items:center;line-height:1}
.server-pulse-eq-part b {color:inherit}
.server-pulse-eq-part small {font-size:8px;font-weight:700}
.server-pulse-eq-slash {color:#94a3b8}
.server-pulse-fans-row i {display:inline-block;width:9px;height:9px;border-radius:2px}
.server-pulse-fans-total {color:#4ade80;font-size:13px}
.server-pulse-help {flex:none;width:18px;height:18px;padding:0;border:1px solid #64748b;border-radius:50%;background:#0f172a;color:#e2e8f0;font-size:11px;font-weight:900;line-height:1;cursor:pointer}
.server-pulse-help-text {margin:0 0 4px;padding:6px 8px;border:1px solid #475569;border-radius:8px;background:#0f172a;color:#cbd5e1;font-size:11px;line-height:1.35}
.server-pulse-host {display:contents}
.server-pulse-fans-scroller {flex:1;min-width:0;overflow-x:auto;overflow-y:hidden;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;overscroll-behavior-y:auto;scrollbar-width:none}
.server-pulse-fans-scroller::-webkit-scrollbar {display:none}
.server-pulse-fans-scroller.is-fixed {touch-action:pan-y}   /* nothing to slide: only up/down is the browser's, so a sideways swipe can never start Chrome's swipe-back */
.server-pulse-fans-track {position:relative;height:96px}
.server-pulse-chart .server-pulse-fans-track svg {position:sticky;left:0;display:block;height:96px;overflow:visible}
.server-pulse-fans-track svg * {pointer-events:none}   /* the chart's own svg is the touch target, never a line inside it that is redrawn mid-swipe */   /* stays in view while the track scrolls */
.server-pulse-fans-grid {font-size:10px;font-weight:800;fill:#94a3b8}
.server-pulse-fans-axis {align-items:center;gap:4px;white-space:nowrap;margin-top:4px}
.server-pulse-fans-axis button {flex:none;min-width:26px;height:22px;border:1px solid #475569;border-radius:6px;background:#0f172a;color:#f8fafc;font-weight:900;cursor:pointer}
.server-pulse-fans-axis span {min-width:0;overflow:hidden;text-overflow:ellipsis}
.server-pulse-fans-axis [data-strip-from], .server-pulse-fans-axis [data-strip-to] {flex:none}   /* 28.8.24.14.5: the two times are never cut short on a small phone */
.server-pulse-fans-axis [data-strip-middle] {flex:1;text-align:center}
.server-pulse-fans-axis button:disabled {opacity:.3;cursor:default}
.server-pulse-growth {position:relative}   /* 28.8.24.14.7: the fans chart's third view (cumulative fans); the finger is the chart's own: pinch and slide */
.server-pulse-growth svg {display:block;width:100%;height:96px;touch-action:none;overflow:hidden}
.server-pulse-growth svg * {pointer-events:none}

.person-reminder-day-body > .person-reminder-card.is-dragging{will-change:transform}   /* 17.13: the dragged ticket floats (ticket_motion.js lifts it out of the scrolling page) */

/* RCM_APP_28.8.24.14.7.17.15 (Luis, Oct-22): the administrator panel's test clock line, under Temporal testing; hidden while that switch is off. */
.vip-clock-line{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 0}
.vip-clock-line input[type="datetime-local"]{min-width:0;padding:4px 6px;border:1px solid #475569;border-radius:7px;background:#0f172a;color:#f3f4f6;font-size:13px}
.vip-clock-lock{display:inline-flex;align-items:center;gap:6px;color:#fde68a;font-size:13px;font-weight:800}
html.rcm-vip-temporal-off .vip-clock-line{display:none}

/* RCM_APP_28.8.24.14.7.17.16 (Luis, Oct-22): the administrator page's app-clock monitor: the red LED clock (same look as the Events clock) and the date in a small gray line under it. */
.rcm-detail-title-row.has-admin-clock{grid-template-columns:minmax(0,1fr) auto auto}
.admin-app-clock{display:flex;flex-direction:column;align-items:center;gap:2px}
.admin-app-clock-led{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid #7f1d1d;border-radius:6px;background:#070101;box-shadow:inset 0 0 7px rgba(255,0,0,.14),0 0 3px rgba(255,0,0,.15);color:#ff1616;font-family:"Lucida Console","Courier New",ui-monospace,monospace;font-size:18px;font-weight:900;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums lining-nums;text-shadow:0 0 1px #ff0000,0 0 3px rgba(255,0,0,.48)}
.admin-app-clock-meridiem{margin-left:.4em}
.admin-app-clock-date{color:#9ca3af;font-size:11px;font-weight:700;line-height:1}
.admin-app-clock.is-locked .admin-app-clock-date{color:#fde68a}

/* RCM_APP_28.8.24.14.7.17.19 (Luis, Oct-23): the leaderboard chart of Server Pulse (static/js/pulse_leaderboard.js): small rows, a fixed name width, the opens on the right. */
.pulse-leaders{display:flex;flex-direction:column;gap:3px;margin:0 0 8px;user-select:none}
.pulse-leaders-head{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:900}
.pulse-leaders-title{margin-right:auto;padding:3px 10px;border:1px solid #64748b;border-radius:7px;background:#172033;color:#f8fafc;font:inherit;font-weight:900;cursor:pointer}
.pulse-leaders-title:active{background:#22304a;border-color:#60a5fa}
.pulse-leaders-pills{display:flex;flex-wrap:wrap;gap:6px}
.pulse-leaders-chip{padding:2px 9px;border:1px solid #475569;border-radius:999px;background:#0f172a;color:#94a3b8;font-size:11px;font-weight:900;cursor:pointer}
.pulse-leaders-chip.is-on{border-color:#facc15;color:#facc15}
.pulse-leaders-day{display:flex;align-items:center;justify-content:space-between;color:#e2e8f0;font-size:12px;font-weight:800}
.pulse-leaders-step{width:34px;height:22px;border:1px solid #475569;border-radius:6px;background:#0f172a;color:#e2e8f0;font-size:15px;line-height:1;cursor:pointer}
.pulse-leaders-row{display:grid;grid-template-columns:14px 24px minmax(0,1fr) auto;align-items:center;gap:6px;min-height:26px;font-size:12px}
.pulse-leaders-place{color:#64748b;font-weight:900;text-align:right}
.pulse-leaders-row.is-plain{grid-template-columns:14px minmax(0,1fr) auto}
.pulse-leaders-pic{width:24px;height:24px;object-fit:cover;border-radius:4px;background:#1e293b}
.pulse-leaders-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#e2e8f0;font-weight:700}
.pulse-leaders-opens{color:#22c55e;font-size:13px}
.pulse-leaders-empty{padding:8px 0;color:#94a3b8;font-size:12px;text-align:center}
.pulse-leaders-hint{color:#64748b;font-size:10px;text-align:center}