#content{max-width:1180px;margin:0 auto}.households{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.household{width:100%;min-height:150px;text-align:left;display:flex;align-items:center;gap:20px;padding:24px;border:1px solid var(--border);border-radius:26px;background:linear-gradient(130deg,rgba(255,255,255,.085),rgba(255,255,255,.035));color:var(--text);cursor:pointer;font:inherit}.household:hover,.household:focus-visible{border-color:#a87cff;outline:2px solid transparent;background:rgba(139,92,246,.17)}.house-icon{flex:none;width:62px;height:62px;display:grid;place-items:center;border-radius:50%;background:var(--house-color);font-size:30px}.house-main{flex:1;min-width:0}.house-main strong{display:block;font-size:1.45rem;margin-bottom:12px}.mini-avatars{display:flex;align-items:center;min-height:43px;padding-left:6px}.mini-avatars img{width:43px;height:43px;object-fit:cover;border-radius:50%;border:3px solid #342344;margin-left:-7px}.house-note{display:block;color:var(--muted);font-size:.92rem;margin-top:7px}.house-arrow{font-size:1.7rem;color:#d9baff}.household:disabled{cursor:default;opacity:.7}.people-title{font-size:clamp(1.8rem,5vw,2.7rem);margin:0 0 24px}.people-grid{margin-top:10px}.empty-note{border:1px solid var(--border);border-radius:22px;padding:32px;color:var(--muted)}#back{margin-bottom:25px}#back-button{background:none;border:0;color:#e0c7ff;cursor:pointer;font:700 1rem system-ui;padding:10px 0}footer a{color:#bfa2ff;text-decoration:none;font-weight:800}@media(max-width:700px){.households{grid-template-columns:1fr;gap:13px}.household{min-height:112px;padding:17px;gap:14px}.house-icon{width:52px;height:52px;font-size:25px}.house-main strong{font-size:1.25rem;margin-bottom:5px}}
/* Fotky z Pozořic a barevné iniciály u nových domácností. */
.mini-avatar{width:43px;height:43px;display:grid;place-items:center;flex:none;overflow:hidden;border-radius:50%;border:3px solid #342344;margin-left:-7px;background:var(--member-color);color:#20142c;font-weight:800;font-size:.82rem}
.mini-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar-wrap.initial-avatar{display:grid;place-items:center;background:var(--member-color);color:#20142c;font-size:2.8rem;font-weight:850}
@media(max-width:560px){.people-grid .avatar-wrap.initial-avatar{font-size:2.3rem}}

/* Karty osob prebiraji beze zmeny puvodni vzhled ze /style.css. */
.people-grid .avatar-wrap{flex:0 0 148px;width:148px;height:148px;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.12)}
.people-grid .avatar-photo{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:560px){.people-grid .avatar-wrap{flex-basis:118px;width:118px;height:118px}}


/* Rozliseni domacnosti – jemny barevny akcent, ne syté plochy. */
.household{
  position:relative;isolation:isolate;overflow:hidden;
  border-color:color-mix(in srgb,var(--house-color) 32%,rgba(255,255,255,.1));
  background:linear-gradient(110deg,
    color-mix(in srgb,var(--house-color) 12%,#30263a) 0%,
    color-mix(in srgb,var(--house-color) 4%,#292032) 72%);
  box-shadow:0 12px 34px rgba(0,0,0,.12);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.household::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
  background:var(--house-color);
}
.household:hover,.household:focus-visible{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--house-color) 72%,white 10%);
  background:linear-gradient(110deg,
    color-mix(in srgb,var(--house-color) 19%,#30263a),
    color-mix(in srgb,var(--house-color) 7%,#292032));
  box-shadow:0 18px 38px rgba(0,0,0,.22);
  outline:2px solid transparent;
}
.house-icon{
  background:color-mix(in srgb,var(--house-color) 19%,#2a2035);
  color:var(--house-color);
  border:1px solid color-mix(in srgb,var(--house-color) 46%,transparent);
  font-weight:600;
}
.house-main strong{color:#fff7ff}
.house-arrow{color:var(--house-color);font-weight:700}
@media(prefers-reduced-motion:reduce){.household{transition:none}}


/* Avatary domacnosti: samostatne portrety s jemnym podbarvenim. */
.household .mini-avatars {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  padding-left: 0;
  min-height: 48px;
}
.household .mini-avatars .mini-avatar {
  box-sizing: border-box;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  background: color-mix(in srgb, var(--member-color, #a879e6) 22%, #51405f);
  box-shadow: 0 3px 9px rgba(0,0,0,.16);
}
.household .mini-avatars .mini-avatar img {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  background: transparent;
  box-shadow: none;
}
@media(max-width:700px) {
  .household .mini-avatars { gap: 7px; min-height: 43px; }
  .household .mini-avatars .mini-avatar { flex-basis: 43px; width: 43px; height: 43px; }
}

/* Portraits: override generic .card span padding, which reduced the image
   content box from 148x148 to 112x120 and displaced the portrait. */
.people-grid .avatar-wrap {
  box-sizing: border-box;
  flex: 0 0 148px;
  width: 148px;
  height: 148px;
  padding: 0;
  margin-top: 0;
  border-radius: 50%;
  overflow: hidden;
}
.people-grid .avatar-wrap .avatar-photo {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  object-fit: cover;
  object-position: center;
  border-radius: 0;
  clip-path: none;
  image-rendering: auto;
}
@media (max-width: 560px) {
  .people-grid .avatar-wrap { flex-basis: 118px; width: 118px; height: 118px; }
}