/* Family Circle owner/live board */
.family-command{overflow:hidden}
.family-command__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1rem;
}
.family-summary{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.75rem;
}
.family-summary>div{
    display:grid;
    gap:.1rem;
    padding:.9rem 1rem;
    border:1px solid var(--vq-border,#d8e2e6);
    border-radius:.9rem;
    background:#f8fbfb;
}
.family-summary strong{
    color:#075e68;
    font-size:1.6rem;
    line-height:1;
}
.family-summary span{color:#657786;font-size:.82rem;font-weight:700}
.family-member-board{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.75rem;
}
.family-member-tile{
    min-width:0;
    display:grid;
    gap:.55rem;
    padding:1rem;
    border:1px solid var(--vq-border,#d8e2e6);
    border-radius:1rem;
    background:#fff;
}
.family-member-tile__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:.75rem;
}
.family-member-tile h3{margin:0;font-size:1.02rem}
.family-member-meta{margin:0;color:#657786;font-size:.82rem}
.family-status-pill{
    display:inline-flex;
    width:max-content;
    align-items:center;
    min-height:1.8rem;
    padding:.25rem .55rem;
    border-radius:999px;
    background:#edf6f7;
    color:#075e68;
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.03em;
}
.family-status-pill[data-state="paused"]{background:#fff4df;color:#855e13}
.family-status-pill[data-state="offline"]{background:#f0f2f4;color:#59636f}
.family-member-controls{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
}
.family-member-controls .vq-button{
    min-height:2.35rem;
    padding:.45rem .7rem;
    font-size:.8rem;
}
.family-owner-note{
    padding:.65rem .75rem;
    border-radius:.7rem;
    background:#f8fbfb;
    color:#52616f;
    font-size:.78rem;
}
@media(max-width:47.999rem){
    .family-command__head{display:grid}
    .family-command__head .vq-button{width:100%}
    .family-member-board{grid-template-columns:1fr}
    .family-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:24rem){
    .family-summary{grid-template-columns:1fr}
}

.family-privacy-details{padding:.65rem .75rem;border:1px solid var(--vq-border,#d8e2e6);border-radius:.7rem;background:#fbfdfd}
.family-privacy-details summary{color:#38536e;font-size:.82rem;font-weight:800;cursor:pointer}
.family-privacy-details p{margin:.55rem 0 0}