/* Household profile editor. Scoped; no global styles touched.
   Class names avoid the global wildcard traps (-card / -tile / tag / badge / -input). */
#page-profile .hh-edit-btn{
  cursor:pointer; border:none; background:rgba(255,255,255,.9);
  border-radius:50%; width:30px; height:30px; display:grid; place-items:center;
  font-size:.85rem; line-height:1; padding:0; transition:.15s;
}
#page-profile .hh-edit-btn:hover{ background:#fff; transform:scale(1.08); }
#page-profile .hh-edit-btn:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
#page-profile .hh-card.add-card{ cursor:pointer; }

#hhModal{position:fixed;inset:0;z-index:100004;background:rgba(28,32,26,.62);display:none;
  align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
#hhModal.on{display:flex}
#hhModal .hhm-box{background:#FFFDFA;border-radius:24px;max-width:560px;width:100%;max-height:92vh;
  overflow-y:auto;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.35);
  font-family:'Nunito',system-ui,sans-serif;color:#33402f}
#hhModal h3{font-family:'Playfair Display',serif;font-size:1.5rem;color:#243447;margin:0 0 4px}
#hhModal .hhm-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
#hhModal .hhm-sub{color:#78766c !important;-webkit-text-fill-color:#78766c !important;font-size:.9rem;margin:0}
#hhModal .hhm-x{background:none;border:1px solid #EAE2D4;border-radius:10px;cursor:pointer;padding:9px 12px;
  color:#78766c;min-height:42px;font:inherit}
#hhModal .hhm-x:hover{background:#FBF6EC}
#hhModal .hhm-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:14px}
#hhModal .hhm-f{display:block}
#hhModal .hhm-f label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;color:#78766c !important;-webkit-text-fill-color:#78766c !important;margin-bottom:5px}
#hhModal .hhm-f input,#hhModal .hhm-f select{width:100%;border:1.5px solid #EAE2D4;border-radius:11px;
  padding:10px 12px;font:inherit;font-size:.94rem;color:#243447;background:#fff;min-height:44px}
#hhModal .hhm-f input:focus,#hhModal .hhm-f select:focus{border-color:#7d9e77;outline:none}
#hhModal .hhm-full{grid-column:1/-1}
#hhModal .hhm-hint{font-size:.78rem;color:#a09a8c !important;-webkit-text-fill-color:#a09a8c !important;margin:4px 0 0}
#hhModal .hhm-faces{display:flex;flex-wrap:wrap;gap:7px}
#hhModal .hhm-av{width:44px;height:44px;border-radius:12px;border:2px solid #EAE2D4;background:#fff;
  font-size:1.2rem;cursor:pointer;display:grid;place-items:center;padding:0}
#hhModal .hhm-av[aria-pressed="true"]{border-color:#5E7E57;background:#EAF1E4}
#hhModal .hhm-av:focus-visible{outline:3px solid #CF9E3F;outline-offset:2px}
#hhModal .hhm-feats{display:flex;flex-wrap:wrap;gap:7px}
#hhModal .hhm-feat{border:1.5px solid #EAE2D4;background:#fff;border-radius:999px;padding:8px 14px;
  font:inherit;font-size:.83rem;font-weight:700;color:#5E7E57;cursor:pointer;min-height:40px}
#hhModal .hhm-feat[aria-pressed="true"]{background:#5E7E57;border-color:#5E7E57;
  color:#fff !important;-webkit-text-fill-color:#fff !important}
#hhModal .hhm-feat:focus-visible{outline:3px solid #CF9E3F;outline-offset:2px}
#hhModal .hhm-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
#hhModal .hhm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;
  font:inherit;font-weight:800;font-size:.94rem;padding:12px 22px;cursor:pointer;border:2px solid transparent;
  line-height:1;min-height:46px}
#hhModal .hhm-btn--save{background:#5E7E57;color:#fff !important;-webkit-text-fill-color:#fff !important}
#hhModal .hhm-btn--save:hover{background:#4d6a47}
#hhModal .hhm-btn--ghost{background:#fff;color:#5E7E57;border-color:#EAE2D4}
#hhModal .hhm-btn--ghost:hover{border-color:#7d9e77}
#hhModal .hhm-btn--del{background:#fff;color:#C6764F;border-color:#F0DACE;margin-left:auto}
#hhModal .hhm-btn--del:hover{border-color:#C6764F}
#hhModal .hhm-err{color:#C6764F !important;-webkit-text-fill-color:#C6764F !important;font-size:.85rem;
  font-weight:700;margin:10px 0 0;display:none}
#hhModal .hhm-err.on{display:block}
@media (max-width:560px){
  #hhModal .hhm-box{padding:18px;border-radius:20px}
  #hhModal .hhm-grid{grid-template-columns:1fr}
  #hhModal .hhm-btn{width:100%}
  #hhModal .hhm-btn--del{margin-left:0}
}
@media (prefers-reduced-motion:reduce){#hhModal *,#page-profile .hh-edit-btn{transition:none !important}}