.friendspace-identity-beta {
    overflow: hidden;
    border: 1px solid #27364d;
    border-top: 4px solid #f26419;
    border-radius: 8px;
    background: #fffdf9;
    box-shadow: 0 7px 20px rgba(15, 23, 42, .1);
}

.friendspace-identity-beta-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    color: #fff;
    background:
        linear-gradient(115deg, rgba(31, 45, 65, .97), rgba(45, 61, 84, .94)),
        repeating-linear-gradient(90deg, transparent 0, transparent 31px, rgba(255,255,255,.06) 32px);
}

.friendspace-identity-beta-header p,
.friendspace-identity-lane > p {
    color: #fdba74;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .15em;
}

.friendspace-identity-beta-header p span {
    display: inline-flex;
    margin-left: .35rem;
    padding: .15rem .35rem;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 999px;
    color: #fff;
    font-family: Inter, sans-serif;
    font-size: .5rem;
    letter-spacing: .08em;
}

.friendspace-identity-beta-header h2 {
    margin-top: .2rem;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1.18rem;
    line-height: 1.15;
}

.friendspace-identity-beta-header small {
    display: block;
    max-width: 37rem;
    margin-top: .25rem;
    color: #cbd5e1;
    font-size: .7rem;
}

.friendspace-identity-beta-header > strong {
    flex: none;
    color: #fed7aa;
    font-family: Inter, sans-serif;
    font-size: .7rem;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .025em;
    line-height: 1.35;
    text-align: right;
    text-rendering: optimizeLegibility;
}

.friendspace-identity-beta-lanes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    background: #dfd7ce;
}

.friendspace-identity-mobile-tabs { display: none; }

.friendspace-identity-lane {
    display: flex;
    min-height: 11.3rem;
    padding: .85rem;
    flex-direction: column;
    background: #fffdf9;
}

.friendspace-identity-lane-people { box-shadow: inset 0 3px #f26419; }
.friendspace-identity-lane-culture { box-shadow: inset 0 3px #7c3aed; }
.friendspace-identity-lane-local { box-shadow: inset 0 3px #0f8b78; }
.friendspace-identity-lane-culture > p { color: #6d28d9; }
.friendspace-identity-lane-local > p { color: #0f766e; }

.friendspace-identity-lane h3 {
    margin-top: .3rem;
    color: #202b3c;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1rem;
}

.friendspace-identity-lane > span {
    display: block;
    margin-top: .3rem;
    color: #64748b;
    font-size: .7rem;
    line-height: 1.35;
}

.friendspace-identity-summary-item {
    display: block;
}

.friendspace-identity-summary-item + .friendspace-identity-summary-item {
    margin-top: .2rem;
}

.friendspace-identity-circle-avatars {
    display: flex;
    min-height: 2rem;
    margin-top: .55rem;
    align-items: center;
}

.friendspace-identity-circle-avatars img,
.friendspace-identity-circle-avatars i {
    width: 2rem;
    height: 2rem;
    margin-right: -.35rem;
    border: 2px solid #fffdf9;
    border-radius: 999px;
    object-fit: cover;
    background: #e2e8f0;
}

.friendspace-identity-circle-avatars i {
    display: grid;
    place-items: center;
    color: #64748b;
    font-size: .65rem;
}

.friendspace-identity-lane nav {
    display: flex;
    margin-top: auto;
    padding-top: .75rem;
    flex-wrap: wrap;
    gap: .4rem .7rem;
}

.friendspace-identity-lane nav a {
    color: #c2410c;
    font-size: .65rem;
    font-weight: 900;
}

.friendspace-identity-lane-culture nav a { color: #6d28d9; }
.friendspace-identity-lane-local nav a { color: #0f766e; }
.friendspace-identity-lane nav a:hover { text-decoration: underline; }

.friendspace-identity-beta > footer {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .6rem .8rem;
    border-top: 1px solid #e7ded3;
    color: #64748b;
    background: #fff8ee;
    font-size: .66rem;
}

.friendspace-identity-beta > footer > i { color: #f26419; }
.friendspace-identity-beta > footer a { margin-left: auto; color: #c2410c; font-weight: 900; white-space: nowrap; }

body.friendspace-identity-beta-enabled .friendspace-social-compass { order: 1; }
body.friendspace-identity-beta-enabled #friendspace-identity-beta { order: 2; }
body.friendspace-identity-beta-enabled #echo-stories-strip { order: 3; }
body.friendspace-identity-beta-enabled #friendspace-first-week { order: 4; }
body.friendspace-identity-beta-enabled #inner-circle-spotlight-strip { order: 5; }
body.friendspace-identity-beta-enabled .friendspace-conversations-heading { order: 6; }
body.friendspace-identity-beta-enabled #post-composer { order: 7; }
body.friendspace-identity-beta-enabled #main-feed-container { order: 8; }

body.friendspace-identity-beta-enabled .friendspace-conversations-heading h2::after {
    content: ' from your people';
}

@media (max-width: 820px) {
    .friendspace-identity-beta { width: 100%; max-width: 100%; overflow: hidden; }
    .friendspace-identity-beta-header { align-items: flex-start; }
    .friendspace-identity-beta-header > strong { display: none; }
    .friendspace-identity-mobile-tabs {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .35rem;
        padding: .55rem;
        border-bottom: 1px solid #dfd7ce;
        background: #fff8ee;
    }
    .friendspace-identity-mobile-tabs button {
        display: grid;
        min-width: 0;
        min-height: 44px;
        padding: .38rem .2rem;
        place-items: center;
        align-content: center;
        gap: .2rem;
        border: 1px solid #e2e8f0;
        border-radius: .55rem;
        color: #64748b;
        background: #fff;
        font-size: .74rem;
        font-weight: 850;
        line-height: 1.15;
    }
    .friendspace-identity-mobile-tabs button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .friendspace-identity-mobile-tabs button i { color: #f26419; }
    .friendspace-identity-mobile-tabs button[aria-selected="true"] {
        border-color: #f26419;
        color: #9a3412;
        background: #fff1e7;
        box-shadow: inset 0 -2px #f26419;
    }
    .friendspace-identity-beta-lanes { grid-template-columns: 1fr; }
    .friendspace-identity-lane { display: none; min-height: 9.2rem; }
    .friendspace-identity-lane.is-active { display: flex; }
    .friendspace-identity-lane > p { font-size: .68rem; }
    .friendspace-identity-lane h3 { font-size: 1.12rem; line-height: 1.2; }
    .friendspace-identity-lane > span { font-size: .875rem; line-height: 1.45; }
    .friendspace-identity-lane nav a { font-size: .8rem; line-height: 1.3; }
    .friendspace-identity-beta > footer { font-size: .8rem; line-height: 1.4; }
    .friendspace-identity-beta > footer { align-items: flex-start; }
}

@media (max-width: 480px) {
    .friendspace-identity-beta-header { padding: .8rem; }
    .friendspace-identity-beta-header h2 { font-size: 1.08rem; }
    .friendspace-identity-beta-header small { font-size: .8rem; line-height: 1.4; }
    .friendspace-identity-mobile-tabs { padding: .48rem; }
    .friendspace-identity-mobile-tabs button { font-size: .75rem; }
    .friendspace-identity-lane { min-height: 9.25rem; padding: .9rem; }
    .friendspace-identity-beta > footer { display: grid; grid-template-columns: auto 1fr; }
    .friendspace-identity-beta > footer a { grid-column: 2; margin-left: 0; }
}
