/* Keep the effective member avatar on the shared identity/adornment pipeline.
   A 48px box reserves the full 28px avatar + 10px Genius decoration on each side. */
.connected-root .topbar .live-top-actions .header-profile-shortcut{
 display:inline-flex;align-items:center;justify-content:center;flex:0 0 48px;
 width:48px;min-width:48px;height:48px;min-height:48px;padding:10px;
 border:0;border-radius:50%;background:transparent;overflow:visible;
}
.connected-root .header-profile-shortcut .live-avatar{
 width:28px;height:28px;min-width:28px;flex:0 0 28px;
}
/* The generic member silhouette survives image failures and renderer resets.
   Do not use pseudo-elements: the shared ring renderer owns those. */
.connected-root .header-profile-shortcut .live-avatar:not(.has-avatar-image){
 font-size:0;color:transparent;
 background-color:var(--live-soft);
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='10' r='4' fill='%23756889'/%3E%3Cpath d='M6 24v-3a8 8 0 0 1 16 0v3' fill='%23756889'/%3E%3C/svg%3E");
 background-position:center;background-size:cover;background-repeat:no-repeat;
}
.connected-root .topbar .header-profile-shortcut:focus-visible{outline:3px solid var(--live-accent,#8a6bb0);outline-offset:2px}
.connected-root .topbar .live-top-actions{overflow:visible}
@media(max-width:860px){
 .connected-root .topbar{gap:6px}
 .connected-root[data-room="porch"][data-porch-compact] .topbar{height:56px;min-height:56px}
 .connected-root .topbar .getaway-top-brand{min-width:0}
 .connected-root .topbar .getaway-top-brand strong{overflow-wrap:anywhere}
}
/* The added moon keeps its own touch target. Let the title wrap naturally on
   narrow phones, and let the header grow instead of overlapping at larger text. */
@media(max-width:600px){
 .connected-root .topbar,
 .connected-root[data-room="porch"][data-porch-fit] .topbar,
 .connected-root[data-room="porch"][data-porch-compact] .topbar,
 .connected-root[data-fridge-fit] .topbar{height:auto;min-height:60px;flex-wrap:wrap;padding-block:6px;overflow:visible}
 .connected-root .topbar .getaway-top-brand{flex:1 1 96px;min-width:0}
 .connected-root .topbar .live-top-actions{flex:0 0 auto;margin-left:auto}
}
@media(max-width:380px){
 .connected-root .topbar,
 .connected-root[data-room="porch"][data-porch-fit] .topbar,
 .connected-root[data-fridge-fit] .topbar{padding-inline:9px;gap:4px}
 .connected-root .topbar .live-top-actions{gap:2px}
 .connected-root .topbar .live-top-actions>button[data-live-action="members"],
 .connected-root .topbar .live-top-actions>button[data-live-action="sign-out"]{padding-inline:6px;min-width:44px;min-height:44px;font-size:11px}
}