/* Haushalt: Mitglieder-Kacheln + Detail-Popup (Winki, 28.09.2026). */
.member-list.member-tiles{display:grid; grid-template-columns:repeat(auto-fill, minmax(9.5rem, 1fr)); gap:1rem;}
.member-tile{
  display:flex; flex-direction:column; align-items:center; gap:.45rem; padding:1.1rem .75rem 1rem;
  border:1px solid var(--border); border-radius:var(--radius-card, 16px); background:var(--surface); color:var(--ink);
  font:inherit; cursor:pointer; text-align:center; transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.member-tile:hover{background:var(--surface-hover); transform:translateY(-2px); box-shadow:0 8px 20px -14px rgba(0,0,0,.35);}
.member-tile:focus-visible{outline:2px solid var(--accent-strong); outline-offset:2px;}
.member-avatar.member-avatar-tile{width:6rem; height:6rem; font-size:2.4rem;}
.member-tile-name{font-weight:700; font-size:1rem; line-height:1.25; word-break:break-word;}
.member-tile-sub{font-size:.8rem; color:var(--ink-muted);}
/* Popup: die bisherige Karte ohne eigenen Rahmen, der Dialog ist der Rahmen. */
.member-detail-modal{width:min(560px, 100%);}
.member-detail-modal > .member-card{border:none; box-shadow:none; padding:0; background:none; margin-top:.3rem;}
.member-detail-modal .member-card-main{padding-right:2.6rem;}
@media (prefers-reduced-motion: reduce){ .member-tile{transition:none;} .member-tile:hover{transform:none;} }
@media (max-width:640px){ .member-list.member-tiles{grid-template-columns:repeat(2, minmax(0, 1fr));} .member-avatar.member-avatar-tile{width:4.8rem; height:4.8rem; font-size:1.9rem;} }
/* Eine Ebene unter den normalen Dialogen (z-index 30), damit Ernaehrungsform-, 16:8-,
   Ziele- und Bestaetigungs-Popups aus dem Mitglieder-Popup heraus darueber liegen. */
#memberDetailScrim{z-index:29;}