/* HelloHudsons v1.6.5 — shared front-end UI layer
   - Approved Family Home header is now global.
   - Bubble/rounded typography becomes the site-wide default.
   - Family Pages buttons match the Home nav pill style.
*/

:root{
  --hh-global-black:#15151a;
  --hh-bubble-font:"Arial Rounded MT Bold","Trebuchet MS",Arial,sans-serif;
}

/* ------------------------------
   GLOBAL BULBOUS TYPOGRAPHY
   Keep designed image lettering (Family Page title / quote art / Pet Pic title)
   untouched because those are image assets, not live text.
-------------------------------- */
body.hh-shell-body,
body.hh-fresh-body{
  font-family:var(--hh-bubble-font)!important;
}
.hh-app,
.hh-site-content,
.hh-site-content .hh-app,
.hh-fresh-main,
.hh-site-footer,
.hh-mobile-nav{
  font-family:var(--hh-bubble-font)!important;
}
button,
input,
select,
textarea{
  font-family:inherit;
}
.hh-app p,
.hh-app a,
.hh-app span,
.hh-app small,
.hh-app strong,
.hh-app label,
.hh-app li,
.hh-app td,
.hh-app th{
  font-family:inherit;
}

/* Preserve intentional handwritten/live-art treatments. */
.hh-fresh-standalone-date{
  font-family:"Bradley Hand","Segoe Print","Comic Sans MS",cursive!important;
}
.hh-pet-pic-card .hh-pet-pic-caption{
  font-family:"Comic Sans MS","Bradley Hand",cursive!important;
}
.hh-pet-pic-card .hh-pet-pic-date{
  font-family:"Arial Rounded MT Bold",Arial,sans-serif!important;
}

/* ------------------------------
   APPROVED HEADER — GLOBAL
-------------------------------- */
.hh-fresh-skip{
  position:fixed;
  top:8px;
  left:8px;
  z-index:10002;
  background:#fff;
  padding:12px 18px;
  border:2px solid var(--hh-global-black);
  border-radius:12px;
  transform:translateY(-160%);
}
.hh-fresh-skip:focus{transform:none}

.hh-fresh-header{
  position:sticky;
  top:0;
  z-index:9000;
  background:#fff;
  border:0;
  box-shadow:none;
}
.admin-bar .hh-fresh-header{top:32px}

.hh-fresh-header:after{
  content:"";
  display:block;
  height:7px;
  background:linear-gradient(90deg,
    #ff8a00 0 14%,
    #00cfc1 14% 28%,
    #bfff00 28% 42%,
    #ffe45b 42% 56%,
    #3c8dff 56% 70%,
    #ff5f9f 70% 84%,
    #00cfc1 84%);
}

.hh-fresh-header-inner{
  max-width:1380px;
  margin:auto;
  display:grid;
  grid-template-columns:235px minmax(0,1fr) auto;
  align-items:center;
  gap:22px;
  padding:12px 22px 6px;
}
.hh-fresh-brand{
  display:block;
  width:235px;
}
.hh-fresh-brand img{
  display:block;
  width:100%;
  height:84px;
  object-fit:contain;
}

.hh-fresh-nav{
  display:flex;
  justify-content:center;
  gap:13px;
  min-width:0;
  padding:9px 6px;
}
.hh-fresh-link{
  --tile:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:78px;
  min-height:52px;
  padding:10px 13px;
  border:1.5px solid #302238;
  border-radius:999px;
  background:linear-gradient(180deg,#ffffffb8,transparent 60%),var(--tile);
  box-shadow:
    inset 0 3px 0 #fff,
    inset 0 -3px 0 #30223812,
    0 0 0 3px #fff,
    0 0 0 4.5px #302238,
    0 7px 0 3px #30223818;
  color:#15151a;
  text-decoration:none!important;
  transition:.15s ease;
}
.hh-fresh-link>span{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  flex:none;
}
.hh-fresh-link svg,
.hh-notify-button svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.hh-fresh-link small{
  font-family:var(--hh-bubble-font)!important;
  font-size:12px;
  font-weight:900;
  letter-spacing:-.25px;
  white-space:nowrap;
}
.hh-fresh-home{--tile:#94bdff}
.hh-fresh-schedule{--tile:#62eadf}
.hh-fresh-todos{--tile:#ffe968}
.hh-fresh-learn{--tile:#c78cff}
.hh-fresh-workouts{--tile:#ff9bc3}
.hh-fresh-pets{--tile:#a9f247}
.hh-fresh-huddlings{--tile:#ffb978}
.hh-fresh-link:hover{transform:translateY(-2px)}
.hh-fresh-link[aria-current=page]{
  text-decoration:underline!important;
  text-underline-offset:4px;
  text-decoration-thickness:2px!important;
  box-shadow:
    inset 0 3px 0 #fff,
    0 0 0 3px #fff,
    0 0 0 4.5px #302238,
    0 7px 0 3px #30223842;
}

.hh-fresh-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.hh-notification-wrap{position:relative}
.hh-notify-button{
  position:relative;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  padding:0;
  background:#ffe969;
  border:2px solid var(--hh-global-black);
  border-radius:50%;
  box-shadow:inset 0 3px 0 #fff8,0 3px 0 #17171718;
}
.hh-notify-button em{
  position:absolute;
  right:-6px;
  top:-8px;
  background:#ff4d9b;
  border:2px solid var(--hh-global-black);
  min-width:22px;
  line-height:18px;
  border-radius:12px;
  font-size:11px;
  font-style:normal;
  font-weight:800;
}

.hh-fresh-account{position:relative}
.hh-fresh-account summary{
  display:flex;
  align-items:center;
  justify-content:center;
  width:46px;
  min-width:46px;
  min-height:46px;
  padding:0;
  list-style:none;
  border:2px solid var(--hh-global-black);
  border-radius:16px;
  background:#fff;
  box-shadow:inset 0 3px 0 #fff8,0 3px 0 #17171718;
  cursor:pointer;
}
.hh-fresh-account summary::-webkit-details-marker{display:none}
.hh-fresh-account-avatar,
.hh-fresh-account-name,
.hh-fresh-account-chevron{display:none!important}
.hh-fresh-account-menuicon{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  width:100%;
  height:100%;
}
.hh-fresh-account-menuicon i{
  display:block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#1d1d22;
}
.hh-fresh-account-links{
  position:absolute;
  top:calc(100% + 12px);
  right:0;
  width:225px;
  padding:8px;
  background:#fff;
  border:2px solid var(--hh-global-black);
  border-radius:17px;
  box-shadow:5px 6px 0 #17171718;
  z-index:50;
}
.hh-fresh-account-links a{
  display:block;
  padding:11px 10px;
  border-radius:9px;
  font-size:14px;
  color:inherit;
  text-decoration:none;
}
.hh-fresh-account-links a:hover{background:#6ce7dc}

.hh-notification-drawer{
  position:absolute;
  right:0;
  top:calc(100% + 16px);
  width:360px;
  max-height:70vh;
  overflow:auto;
  padding:18px;
  background:#fff;
  border:2px solid var(--hh-global-black);
  border-radius:20px;
  box-shadow:5px 6px 0 #17171718;
  z-index:60;
}
.hh-notification-drawer[hidden]{display:none!important}
.hh-notification-drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.hh-notification-drawer-head span{
  font-size:10px;
  font-weight:800;
  letter-spacing:1px;
}
.hh-notification-drawer h3{font-size:22px;margin:5px 0}
.hh-notification-close{
  width:36px;
  height:36px;
  border:2px solid var(--hh-global-black);
  border-radius:11px;
  background:#ff9bc3;
  font-size:24px!important;
}
.hh-notification-pop-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 0;
  border-top:1px solid #eee;
  text-decoration:none;
}
.hh-notification-pop-dot{
  flex:none;
  width:8px;
  height:8px;
  background:#ff5fa3;
  border-radius:50%;
}
.hh-notification-pop-row strong{display:block;font-size:14px}
.hh-notification-pop-row small{display:block;margin-top:5px;font-size:12px;line-height:1.45}
.hh-notification-pop-row time{margin-left:auto;white-space:nowrap;font-size:11px}
.hh-notification-pop-empty{text-align:center;padding:20px 0}
.hh-notification-all{display:block;padding-top:14px;font-size:13px;font-weight:800}

.hh-fresh-date-row{
  max-width:1380px;
  margin:-4px auto 0;
  padding:0 22px 2px;
  display:flex;
  justify-content:flex-end;
}
.hh-fresh-standalone-date{
  margin:0;
  padding:0 6px 2px;
  color:#20212a;
  background:linear-gradient(transparent 60%,#95eef2 60% 90%,transparent 90%);
  font-size:13px;
  font-weight:700;
  line-height:1;
  letter-spacing:-.3px;
  white-space:nowrap;
}

/* ------------------------------
   FAMILY PAGES BUTTONS
-------------------------------- */
.hh-family-pages-buttons{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:24px!important;
  max-width:1050px;
}
.hh-family-page-button{
  --person-tile:#94bdff;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  min-height:96px;
  padding:12px 20px!important;
  border:1.5px solid #302238!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#ffffffa8,transparent 62%),var(--person-tile)!important;
  box-shadow:
    inset 0 4px 0 #fff,
    inset 0 -4px 0 #30223812,
    0 0 0 4px #fff,
    0 0 0 5.5px #302238,
    0 8px 0 4px #30223818!important;
  text-decoration:none!important;
  transition:.15s ease;
}
.hh-family-page-button:nth-child(1){--person-tile:#94bdff}
.hh-family-page-button:nth-child(2){--person-tile:#62eadf}
.hh-family-page-button:nth-child(3){--person-tile:#ffe968}
.hh-family-page-button:nth-child(4){--person-tile:#c78cff}
.hh-family-page-button:nth-child(5){--person-tile:#ff9bc3}
.hh-family-page-button:nth-child(6){--person-tile:#a9f247}
.hh-family-page-button:hover{transform:translateY(-3px)}
.hh-family-page-button img,
.hh-family-page-button .hh-member-photo{
  flex:none;
  width:68px!important;
  height:68px!important;
  object-fit:cover;
  border:3px solid #302238!important;
  border-radius:50%!important;
  background:#fff;
  box-shadow:0 0 0 4px #fff;
}
.hh-family-page-button h3{
  margin:0!important;
  color:#15151a;
  font-family:var(--hh-bubble-font)!important;
  font-size:22px!important;
  font-weight:900!important;
  line-height:1!important;
}

/* Don't show the old descriptive line if stale cached markup is encountered. */
.hh-family-page-button p{display:none!important}

@media(max-width:1000px){
  .hh-fresh-header-inner{
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px 14px;
    padding:10px 20px 6px;
  }
  .hh-fresh-brand{
    width:230px;
  }
  .hh-fresh-brand img{height:78px}
  .hh-fresh-actions{
    grid-column:2;
    grid-row:1;
  }
  .hh-fresh-nav{
    grid-column:1/-1;
    grid-row:2;
    justify-content:center;
    gap:12px;
  }
  .hh-fresh-link{min-width:72px}
  .hh-notification-drawer{
    position:fixed;
    top:110px;
    right:20px;
  }
  .hh-fresh-date-row{
    padding:0 20px 2px;
    margin-top:-3px;
  }
}
@media(max-width:782px){
  .admin-bar .hh-fresh-header{top:46px}
}
@media(max-width:700px){
  .hh-family-pages-buttons{
    grid-template-columns:1fr!important;
    gap:20px!important;
  }
}
@media(max-width:650px){
  .hh-fresh-header-inner{padding:8px 14px 6px}
  .hh-fresh-brand{width:min(205px,100%)}
  .hh-fresh-brand img{height:70px}
  .hh-fresh-nav{
    justify-content:flex-start;
    overflow-x:auto;
    gap:12px;
    padding:8px 6px 12px;
    scrollbar-width:thin;
  }
  .hh-fresh-link{
    flex:0 0 auto;
    min-width:78px;
    min-height:46px;
    padding:9px 12px;
  }
  .hh-notification-drawer{
    top:96px;
    right:14px;
    left:14px;
    width:auto;
    max-height:calc(100svh - 120px);
  }
  .hh-fresh-date-row{
    padding:0 14px 2px;
    margin-top:-2px;
  }
  .hh-fresh-standalone-date{font-size:12px}
  .hh-family-page-button{
    min-height:84px;
    padding:10px 16px!important;
  }
  .hh-family-page-button img,
  .hh-family-page-button .hh-member-photo{
    width:58px!important;
    height:58px!important;
  }
  .hh-family-page-button h3{font-size:19px!important}
}


/* v1.6.6 — Family Pages includes pets too */
.hh-family-page-button-pet:nth-last-child(2){--person-tile:#a9f247}
.hh-family-page-button-pet:nth-last-child(1){--person-tile:#ffb5cf}

.hh-family-page-pet-photo,
.hh-family-page-pet-placeholder{
  flex:none;
  display:grid;
  place-items:center;
  width:68px!important;
  height:68px!important;
  border:3px solid #302238!important;
  border-radius:50%!important;
  background:#fff;
  box-shadow:0 0 0 4px #fff;
  object-fit:cover;
}
.hh-family-page-pet-placeholder{
  font-size:28px;
}
@media(max-width:650px){
  .hh-family-page-pet-photo,
  .hh-family-page-pet-placeholder{
    width:58px!important;
    height:58px!important;
  }
}


/* v1.6.7 — approved Hello Hudsons typography system
   DynaPuff = playful display / buttons
   Quicksand = light, rounded reading text
   Coming Soon = handwritten accents
*/
:root{
  --hh-display-font:"DynaPuff","Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  --hh-body-font:"Quicksand","Trebuchet MS",Arial,sans-serif;
  --hh-hand-font:"Coming Soon","Bradley Hand","Segoe Print",cursive;
}

/* Base reading text */
body.hh-shell-body,
body.hh-fresh-body,
.hh-app,
.hh-site-content,
.hh-site-footer,
.hh-mobile-nav{
  font-family:var(--hh-body-font)!important;
  font-weight:400;
}

/* Big personality text */
.hh-app h1,
.hh-app h2,
.hh-app h3,
.hh-app h4,
.hh-app h5,
.hh-app h6,
.hh-fresh-link small,
.hh-family-page-button h3,
.hh-card-link,
.hh134-quick-card strong,
.hh-today-card-head h3,
.hh-today-card-head small,
.hh134-kicker,
.hh-mini-kicker,
.hh-fresh-login,
.hh-notify-button,
.hh-notification-close,
.hh-fresh-account-links a{
  font-family:var(--hh-display-font)!important;
}

.hh-app h1,
.hh-app h2{
  font-weight:600!important;
  letter-spacing:-.02em;
}
.hh-app h3,
.hh-app h4{
  font-weight:500!important;
}

/* Navigation and button labels */
.hh-fresh-link small{
  font-weight:500!important;
  letter-spacing:-.02em!important;
}
.hh-card-link,
.hh134-quick-card strong,
.hh-family-page-button h3{
  font-weight:600!important;
}

/* Thin rounded body copy */
.hh-app p,
.hh-app li,
.hh-app td,
.hh-app th,
.hh-app label,
.hh-app small,
.hh-app .description,
.hh-app .hh-family-copy,
.hh-app .hh-today-row,
.hh-app .hh-notice-row,
.hh-app .hh-pet-story,
.hh-app .hh-list-item,
.hh-app .hh-course,
.hh-app .hh-widget{
  font-family:var(--hh-body-font)!important;
  font-weight:400;
}

/* Light metadata */
.hh-app small,
.hh-app .hh-kicker,
.hh-app .description,
.hh-app .hh-today-row time,
.hh-app .hh-notice-row time,
.hh-app .hh-family-copy small{
  font-weight:300!important;
}

/* Handwritten accents */
.hh-fresh-standalone-date,
.hh134-live-date,
.hh-profile .hh-mood,
.hh-pet-pic-card .hh-pet-pic-caption{
  font-family:var(--hh-hand-font)!important;
}

/* Preserve Pet Pic visual treatment */
.hh-pet-pic-card .hh-pet-pic-date{
  font-family:var(--hh-display-font)!important;
  font-weight:600!important;
}

/* Family Page buttons should feel like the nav */
.hh-family-page-button{
  font-family:var(--hh-display-font)!important;
}
.hh-family-page-button h3{
  font-size:21px!important;
  line-height:1.05!important;
}

/* Form controls */
input,
select,
textarea{
  font-family:var(--hh-body-font)!important;
}
button{
  font-family:var(--hh-display-font)!important;
}

/* Slightly airier reading text */
.hh-app p,
.hh-app li{
  line-height:1.5;
}


/* v1.6.11 — stronger Quick Access supporting text */
.hh134-quick-card small{
  font-family:var(--hh-body-font)!important;
  font-weight:600!important;
  color:#4d5260!important;
  opacity:1!important;
  letter-spacing:0!important;
}


/* v1.6.12 — family block layout + label consistency */
.hh-clubhouse-dashboard .hh-today-card-head small,
.hh-clubhouse-dashboard .hh-family-mini .hh-mini-kicker{
  font-family:var(--hh-body-font)!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
  color:#5f6774!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-mini-kicker{
  color:#3b4655!important;
  font-weight:800!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-section-heading h2{
  margin-top:4px!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px 10px!important;
  padding-top:2px!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid>a.hh-family-sticker{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
  gap:8px!important;
  padding:2px 2px 0!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  min-width:0!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid>a.hh-family-sticker:hover{
  background:transparent!important;
  box-shadow:none!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-photo{
  width:78px!important;
  height:78px!important;
  flex:0 0 78px!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-photo img,
.hh-clubhouse-dashboard .hh-family-mini .hh-family-photo .avatar,
.hh-clubhouse-dashboard .hh-family-mini .hh-family-photo .hh-pet-mini-avatar{
  width:72px!important;
  height:72px!important;
  border-radius:999px!important;
  border:5px solid #fff!important;
  outline:2px solid #111!important;
  box-shadow:3px 3px 0 #111!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid>a:nth-child(n) .hh-family-photo{
  transform:none!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-copy{
  min-width:0!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-copy strong{
  display:block!important;
  font-size:14px!important;
  line-height:1.15!important;
  color:#111!important;
}
.hh-clubhouse-dashboard .hh-family-mini .hh-family-copy small{
  display:none!important;
}
@media(max-width:1180px){
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:900px){
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:640px){
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-sticker-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-photo{
    width:68px!important;
    height:68px!important;
    flex-basis:68px!important;
  }
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-photo img,
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-photo .avatar,
  .hh-clubhouse-dashboard .hh-family-mini .hh-family-photo .hh-pet-mini-avatar{
    width:62px!important;
    height:62px!important;
  }
}


/* ============================================================
   v1.6.29 — Family Pages landing page
   Uses the same editable die-cut family sticker language approved on Family Home.
   ============================================================ */
.hh-family-pages-landing{
  width:min(1120px,calc(100% - 36px));
  margin:34px auto 70px;
}
.hh-family-pages-intro{
  text-align:center;
  margin:0 auto 22px;
}
.hh-family-pages-intro>span{
  display:inline-block;
  color:#158d98;
  font-family:var(--hh-body-font)!important;
  font-size:12px;
  font-weight:800;
  letter-spacing:.17em;
}
.hh-family-pages-intro h1{
  margin:4px 0 5px;
  color:#15151a;
  font-family:var(--hh-bubble-font)!important;
  font-size:clamp(38px,5vw,66px)!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:-.04em;
}
.hh-family-pages-intro p{
  margin:0;
  color:#52606d;
  font-family:var(--hh-body-font)!important;
  font-size:16px;
  font-weight:600;
}
.hh-family-pages-stage{
  position:relative;
  padding:34px 34px 38px;
  border:3px solid #302238;
  border-radius:34px;
  background:#fff;
  box-shadow:0 8px 0 rgba(48,34,56,.11);
  overflow:visible;
}
.hh-family-pages-stage:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:10px;
  border-radius:30px 30px 0 0;
  background:linear-gradient(90deg,#ff8a00 0 14%,#00c2b8 14% 28%,#a9f247 28% 42%,#ffe968 42% 57%,#94bdff 57% 71%,#ff6b9d 71% 86%,#62eadf 86% 100%);
}
.hh-family-pages-sticker-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:34px 40px;
  align-items:end;
  justify-items:center;
}
.hh-family-page-sticker{
  --hh-page-accent:#94bdff;
  --hh-page-pill:#ffe968;
  width:100%;
  min-width:0;
  min-height:218px;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:0;
  padding:12px 8px 0!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#15151a!important;
  text-decoration:none!important;
  transform:none;
  transition:transform .16s ease;
  overflow:visible!important;
}
.hh-family-page-sticker:hover{
  transform:translateY(-6px) scale(1.025);
}
.hh-family-page-pos-1{--hh-page-accent:#94bdff;--hh-page-pill:#ffe968;}
.hh-family-page-pos-2{--hh-page-accent:#62eadf;--hh-page-pill:#ff9bc3;}
.hh-family-page-pos-3{--hh-page-accent:#ffe968;--hh-page-pill:#94bdff;}
.hh-family-page-pos-4{--hh-page-accent:#c78cff;--hh-page-pill:#62eadf;}
.hh-family-page-pos-5{--hh-page-accent:#a9f247;--hh-page-pill:#ffd089;}
.hh-family-page-pos-6{--hh-page-accent:#ff9bc3;--hh-page-pill:#62eadf;}
.hh-family-page-photo{
  position:relative;
  z-index:1;
  width:184px;
  height:184px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:visible!important;
}
.hh-family-page-photo img,
.hh-family-page-photo .avatar,
.hh-family-page-photo .hh-member-photo,
.hh-family-page-pet-photo{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:184px!important;
  max-height:184px!important;
  padding:0!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:
    drop-shadow(0 0 0 #fff)
    drop-shadow(1px 0 0 #fff)
    drop-shadow(-1px 0 0 #fff)
    drop-shadow(0 1px 0 #fff)
    drop-shadow(0 -1px 0 #fff)
    drop-shadow(1px 1px 0 #fff)
    drop-shadow(-1px 1px 0 #fff)
    drop-shadow(1px -1px 0 #fff)
    drop-shadow(-1px -1px 0 #fff)
    drop-shadow(3px 0 0 var(--hh-page-accent))
    drop-shadow(-3px 0 0 var(--hh-page-accent))
    drop-shadow(0 3px 0 var(--hh-page-accent))
    drop-shadow(0 -3px 0 var(--hh-page-accent))
    drop-shadow(2.5px 2.5px 0 var(--hh-page-accent))
    drop-shadow(-2.5px 2.5px 0 var(--hh-page-accent))
    drop-shadow(2.5px -2.5px 0 var(--hh-page-accent))
    drop-shadow(-2.5px -2.5px 0 var(--hh-page-accent))
    drop-shadow(0 5px 6px rgba(21,21,26,.12))!important;
}
.hh-family-page-name{
  position:relative;
  z-index:3;
  display:inline-block;
  margin-top:-18px;
  padding:6px 16px 7px;
  color:#15151a;
  background:var(--hh-page-pill);
  border:2px solid #302238;
  border-radius:999px;
  box-shadow:0 3px 0 rgba(48,34,56,.14);
  font-family:var(--hh-bubble-font)!important;
  font-size:17px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
}
.hh-family-page-pet-placeholder{
  width:118px!important;
  height:118px!important;
  display:grid!important;
  place-items:center!important;
  align-self:flex-end;
  margin-bottom:18px;
  border:3px solid #302238!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 0 0 4px #fff,0 0 0 7px var(--hh-page-accent)!important;
  font-size:48px!important;
}

@media(max-width:900px){
  .hh-family-pages-landing{margin-top:24px;}
  .hh-family-pages-stage{padding:30px 22px 34px;}
  .hh-family-pages-sticker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;}
  .hh-family-page-sticker{min-height:205px;}
  .hh-family-page-photo{width:170px;height:170px;}
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{max-width:170px!important;max-height:170px!important;}
}
@media(max-width:560px){
  .hh-family-pages-landing{width:min(100% - 22px,1120px);margin:18px auto 54px;}
  .hh-family-pages-intro{margin-bottom:16px;}
  .hh-family-pages-intro h1{font-size:38px!important;}
  .hh-family-pages-intro p{font-size:14px;}
  .hh-family-pages-stage{padding:25px 10px 28px;border-radius:26px;}
  .hh-family-pages-stage:before{height:8px;border-radius:22px 22px 0 0;}
  .hh-family-pages-sticker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 6px;}
  .hh-family-page-sticker{min-height:160px;padding:8px 2px 0!important;}
  .hh-family-page-photo{width:132px;height:132px;}
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{max-width:132px!important;max-height:132px!important;}
  .hh-family-page-name{margin-top:-14px;padding:5px 11px 6px;font-size:14px;}
}
@media(max-width:380px){
  .hh-family-page-photo{width:118px;height:118px;}
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{max-width:118px!important;max-height:118px!important;}
  .hh-family-page-name{font-size:13px;}
}


/* v1.6.30 — lock Family Pages landing spacing. */
.hh-family-pages-landing{
  margin-top:9px!important;
}
.hh-family-pages-intro{
  margin-bottom:7px!important;
}
@media(max-width:900px){
  .hh-family-pages-landing{margin-top:4px!important;}
  .hh-family-pages-intro{margin-bottom:7px!important;}
}
@media(max-width:560px){
  .hh-family-pages-landing{margin-top:4px!important;}
  .hh-family-pages-intro{margin-bottom:6px!important;}
}


/* v1.6.31 — Family Pages typography + clean sticker halos.
   Match the approved DynaPuff / Quicksand site system and remove Safari drop-shadow artifacts. */
.hh-family-pages-intro>span{
  font-family:var(--hh-body-font)!important;
  font-weight:800!important;
}
.hh-family-pages-intro h1{
  font-family:var(--hh-display-font)!important;
  font-weight:700!important;
  letter-spacing:-.025em!important;
}
.hh-family-pages-intro p{
  font-family:var(--hh-body-font)!important;
  font-weight:600!important;
}
.hh-family-page-name{
  font-family:var(--hh-display-font)!important;
  font-weight:700!important;
  letter-spacing:-.01em!important;
}

/* Use the same lightweight halo approach as the locked Family Home stickers.
   The uploaded PNGs already contain the white die-cut edge, so there is no need
   for the large stack of white + colored drop-shadows that caused random dots. */
.hh-family-page-photo img,
.hh-family-page-photo .avatar,
.hh-family-page-photo .hh-member-photo,
.hh-family-page-pet-photo{
  filter:
    drop-shadow(1.7px 0 0 var(--hh-page-accent))
    drop-shadow(-1.7px 0 0 var(--hh-page-accent))
    drop-shadow(0 1.7px 0 var(--hh-page-accent))
    drop-shadow(0 -1.7px 0 var(--hh-page-accent))
    drop-shadow(1.25px 1.25px 0 var(--hh-page-accent))
    drop-shadow(-1.25px 1.25px 0 var(--hh-page-accent))
    drop-shadow(1.25px -1.25px 0 var(--hh-page-accent))
    drop-shadow(-1.25px -1.25px 0 var(--hh-page-accent))!important;
}


/* ============================================================
   v1.6.32 — Family Pages responsive crew layout
   Wide desktop: 6 across
   Split-screen/tablet: 3 x 2
   Phone: 2 x 3
   Also nudges the heading group slightly upward.
   ============================================================ */

.hh-family-pages-landing{
  margin-top:-3px!important;
}
.hh-family-pages-intro{
  transform:translateY(-10px);
  margin-bottom:-2px!important;
}

/* Wide desktop: one clean row of all six family members. */
.hh-family-pages-stage{
  padding:30px 22px 34px!important;
}
.hh-family-pages-sticker-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:end!important;
}
.hh-family-page-sticker{
  min-height:166px!important;
  padding:8px 2px 0!important;
}
.hh-family-page-photo{
  width:142px!important;
  height:142px!important;
}
.hh-family-page-photo img,
.hh-family-page-photo .avatar,
.hh-family-page-photo .hh-member-photo,
.hh-family-page-pet-photo{
  max-width:142px!important;
  max-height:142px!important;
}
.hh-family-page-name{
  margin-top:-14px!important;
  padding:5px 12px 6px!important;
  font-size:14px!important;
}

/* Smaller desktops / split-screen / tablet: 3 across, 2 rows. */
@media(max-width:1099px){
  .hh-family-pages-landing{
    margin-top:0!important;
  }
  .hh-family-pages-intro{
    transform:translateY(-8px);
    margin-bottom:2px!important;
  }
  .hh-family-pages-stage{
    padding:30px 24px 34px!important;
  }
  .hh-family-pages-sticker-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:26px 24px!important;
  }
  .hh-family-page-sticker{
    min-height:198px!important;
    padding:8px 4px 0!important;
  }
  .hh-family-page-photo{
    width:170px!important;
    height:170px!important;
  }
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{
    max-width:170px!important;
    max-height:170px!important;
  }
  .hh-family-page-name{
    margin-top:-16px!important;
    padding:5px 14px 6px!important;
    font-size:16px!important;
  }
}

/* Phone: 2 across, 3 rows. */
@media(max-width:650px){
  .hh-family-pages-landing{
    width:min(100% - 22px,1120px)!important;
    margin-top:3px!important;
  }
  .hh-family-pages-intro{
    transform:translateY(-4px);
    margin-bottom:5px!important;
  }
  .hh-family-pages-stage{
    padding:24px 10px 28px!important;
  }
  .hh-family-pages-sticker-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:22px 8px!important;
  }
  .hh-family-page-sticker{
    min-height:158px!important;
    padding:6px 1px 0!important;
  }
  .hh-family-page-photo{
    width:132px!important;
    height:132px!important;
  }
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{
    max-width:132px!important;
    max-height:132px!important;
  }
  .hh-family-page-name{
    margin-top:-13px!important;
    padding:5px 10px 6px!important;
    font-size:14px!important;
  }
}

@media(max-width:380px){
  .hh-family-page-photo{
    width:116px!important;
    height:116px!important;
  }
  .hh-family-page-photo img,
  .hh-family-page-photo .avatar,
  .hh-family-page-photo .hh-member-photo,
  .hh-family-page-pet-photo{
    max-width:116px!important;
    max-height:116px!important;
  }
}


/* v1.6.35 — account switching + orange date underline */
.hh-fresh-standalone-date{
  background:linear-gradient(transparent 60%,#ff8a00 60% 90%,transparent 90%)!important;
}
.hh-account-status{
  padding:10px 12px 9px;
  margin:0 0 5px;
  border-bottom:1px solid rgba(48,34,56,.12);
  color:#5a6170;
  font-family:var(--hh-body-font)!important;
  font-size:11px;
  line-height:1.35;
}
.hh-account-status strong{
  display:block;
  margin-top:2px;
  color:#20212a;
  font-size:13px;
}
.hh-fresh-account-links .hh-switch-account,
.hh-user-menu-pop .hh-switch-account{
  font-weight:800!important;
  color:#16458f!important;
}


/* v1.6.38 — independent Hello Hudsons family session. */
.hh-fresh-account-links button,
.hh-user-menu-pop button{
  width:100%;display:block;text-align:left;padding:11px 10px;border:0;border-radius:9px;background:transparent;color:inherit;font:inherit;cursor:pointer;
}
.hh-fresh-account-links button:hover,.hh-user-menu-pop button:hover{background:#6ce7dc}
.hh-fresh-login{font:inherit;cursor:pointer}
body.hh-family-switcher-open{overflow:hidden!important}
.hh-family-switcher[hidden]{display:none!important}
.hh-family-switcher{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;padding:24px}
.hh-family-switcher-backdrop{position:absolute;inset:0;border:0;background:rgba(18,20,31,.58);backdrop-filter:blur(8px)}
.hh-family-switcher-card{position:relative;width:min(760px,calc(100vw - 30px));max-height:min(780px,calc(100vh - 30px));overflow:auto;background:#fff;border:3px solid #24202c;border-radius:30px;box-shadow:0 18px 55px rgba(20,18,28,.28);padding:30px}
.hh-family-switcher-close{position:absolute;right:18px;top:14px;width:42px;height:42px;border:2px solid #24202c;border-radius:50%;background:#fff;font:700 26px/1 Arial Rounded MT Bold,Arial,sans-serif;cursor:pointer}
.hh-family-switcher-kicker{font-family:Quicksand,sans-serif;font-weight:800;letter-spacing:.18em;color:#158b97;font-size:12px}
.hh-family-switcher-card h2{font-family:DynaPuff,sans-serif;font-size:clamp(28px,5vw,44px);margin:4px 0 8px;color:#17171d}
.hh-family-switcher-card>p{font-family:Quicksand,sans-serif;margin:0 0 20px;color:#5c6470;font-weight:600}
.hh-family-switcher-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.hh-family-person{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:14px 8px 12px;border:2px solid #302238;border-radius:22px;background:#fff;box-shadow:0 4px 0 rgba(48,34,56,.10);cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.hh-family-person:hover,.hh-family-person:focus-visible{transform:translateY(-3px);box-shadow:0 7px 0 rgba(48,34,56,.11)}
.hh-family-person.is-active{border-color:#ff8a00}.hh-family-person.is-selected{outline:4px solid #c6ff73;outline-offset:2px}
.hh-family-person-photo{width:88px;height:88px;display:grid;place-items:center}
.hh-family-person-photo img{max-width:88px;max-height:88px;width:100%!important;height:100%!important;object-fit:contain!important;border-radius:18px}
.hh-family-person strong{font-family:DynaPuff,sans-serif;font-size:14px;color:#17171d}
.hh-family-person small{font-family:Quicksand,sans-serif;font-size:11px;color:#6a7380;font-weight:700}
.hh-family-password-wrap{display:grid;grid-template-columns:1fr auto;align-items:end;gap:12px;margin-top:20px;padding:18px;border-radius:20px;background:#f4f8ff}
.hh-family-password-wrap label{display:grid;gap:6px;font-family:Quicksand,sans-serif;font-weight:700}
.hh-family-password-wrap input{width:100%;min-height:46px;padding:10px 13px;border:2px solid #302238;border-radius:14px;font:inherit}
.hh-family-confirm{min-height:46px;padding:10px 17px;border:2px solid #302238;border-radius:14px;background:#c6ff73;font-family:DynaPuff,sans-serif;cursor:pointer}.hh-family-confirm:disabled{opacity:.45;cursor:not-allowed}
.hh-family-admin-note{margin-top:18px;padding:13px 15px;border-radius:16px;background:#fff4c7;font-family:Quicksand,sans-serif;font-weight:700;color:#4b4230}
.hh-family-switcher-error{margin:14px 0 0!important;padding:10px 12px;border-radius:12px;background:#ffe2e7;color:#8e1932!important;font-weight:700!important}
.hh-family-switcher.is-busy .hh-family-person,.hh-family-switcher.is-busy .hh-family-confirm{pointer-events:none;opacity:.65}
@media(max-width:760px){.hh-family-switcher{padding:10px}.hh-family-switcher-card{padding:26px 18px 20px}.hh-family-switcher-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hh-family-password-wrap{grid-template-columns:1fr}.hh-family-person-photo{width:74px;height:74px}.hh-family-person-photo img{max-width:74px;max-height:74px}}


/* ============================================================
   v1.6.39 — Family login polish + password-required switching
   ============================================================ */

/* Logged-out Family Home wall */
.hh-family-only-wall{
  position:relative!important;
  width:min(650px,calc(100% - 34px))!important;
  margin:105px auto 70px!important;
  padding:92px 38px 42px!important;
  text-align:center!important;
  background:#fff!important;
  border:3px solid #24202c!important;
  border-radius:30px!important;
  box-shadow:10px 11px 0 #b8ff22!important;
  overflow:visible!important;
}
.hh-family-only-wall h2{
  margin:0 0 24px!important;
  font-family:DynaPuff,sans-serif!important;
  font-size:clamp(30px,5vw,48px)!important;
  color:#17171d!important;
}
.hh-family-only-wall .hh-btn{
  min-width:180px;
}
.hh-keepout-hanger{
  position:absolute;
  left:50%;
  top:-78px;
  width:250px;
  height:126px;
  transform:translateX(-50%);
  pointer-events:none;
}
.hh-keepout-cord{
  position:absolute;
  top:0;
  width:4px;
  height:61px;
  border-radius:999px;
  background:#302238;
  transform-origin:top center;
}
.hh-keepout-cord.left{left:72px;transform:rotate(24deg)}
.hh-keepout-cord.right{right:72px;transform:rotate(-24deg)}
.hh-keepout-sign{
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%) rotate(-3deg);
  display:grid;
  place-items:center;
  width:220px;
  min-height:68px;
  padding:10px 20px;
  background:#ff8a00;
  border:3px solid #24202c;
  border-radius:18px;
  box-shadow:5px 6px 0 rgba(48,34,56,.18);
  color:#17171d;
  font-family:DynaPuff,sans-serif;
  font-size:26px;
  letter-spacing:.04em;
}

/* Family selector */
.hh-family-switcher-card{
  width:min(790px,calc(100vw - 30px))!important;
}
.hh-family-switcher-card>p:not(.hh-family-switcher-hint):not(.hh-family-switcher-error){
  display:none!important;
}
.hh-family-switcher-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.hh-family-person small:empty{display:none!important}
.hh-family-person small{
  min-height:0!important;
}
.hh-family-password-wrap{
  grid-template-columns:1fr auto!important;
  align-items:center!important;
  margin-top:20px!important;
}
.hh-family-password-wrap input{
  min-height:48px!important;
}
.hh-family-switcher-hint{
  margin:9px 2px 0!important;
  font-family:Quicksand,sans-serif!important;
  font-size:12px!important;
  font-weight:700!important;
  color:#68717d!important;
}
.hh-family-admin-note{display:none!important}

@media(max-width:760px){
  .hh-family-switcher-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .hh-family-password-wrap{
    grid-template-columns:1fr!important;
  }
  .hh-family-only-wall{
    margin-top:90px!important;
    padding:82px 22px 34px!important;
  }
}

/* The Hello Hudsons front end should feel like its own app, even while
   WordPress remains signed in as Emily in the same browser. */
body.hh-shell-body{margin-top:0!important}


/* v1.6.41 — login-wall polish + password rescue */
.hh-family-only-wall .hh-btn-yellow{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:190px!important;min-height:50px!important;padding:11px 24px 12px!important;
  background:#ffd84d!important;color:#17171d!important;border:3px solid #302238!important;
  border-radius:999px!important;box-shadow:0 4px 0 rgba(48,34,56,.16)!important;
  font-family:"Arial Rounded MT Bold","Arial Rounded MT",Arial,sans-serif!important;
  font-size:16px!important;font-weight:700!important;text-decoration:none!important
}
.hh-family-only-wall .hh-btn-yellow:hover{transform:translateY(-2px)!important;box-shadow:0 6px 0 rgba(48,34,56,.16)!important}

/* Make the hanging sign feel actually attached, and handwritten. */
.hh-keepout-hanger{top:-82px!important;width:250px!important;height:132px!important}
.hh-keepout-sign{
  top:61px!important;bottom:auto!important;width:220px!important;min-height:68px!important;
  font-family:"Coming Soon","Comic Sans MS",cursive!important;font-size:29px!important;
  font-weight:700!important;letter-spacing:.01em!important
}
.hh-keepout-cord{top:0!important;height:72px!important;width:4px!important;background:#302238!important}
.hh-keepout-cord.left{left:63px!important;transform:rotate(18deg)!important}
.hh-keepout-cord.right{right:63px!important;transform:rotate(-18deg)!important}

.hh-family-login-help{display:flex;justify-content:flex-end;margin-top:7px}
.hh-family-forgot,.hh-family-recovery-back{
  appearance:none;border:0;background:transparent;color:#2d5e8f;padding:4px 2px;
  font-family:Quicksand,sans-serif;font-weight:800;text-decoration:underline;cursor:pointer
}
.hh-family-forgot:disabled{opacity:.4;cursor:not-allowed}
.hh-family-recovery{
  margin-top:22px;padding:22px;border:3px solid #302238;border-radius:24px;
  background:#fffaf0;box-shadow:0 5px 0 rgba(48,34,56,.10)
}
.hh-family-recovery[hidden]{display:none!important}
.hh-family-recovery h3{margin:2px 0 3px;font-family:DynaPuff,sans-serif;font-size:25px}
.hh-family-recovery h4{margin:6px 0 12px;font-family:DynaPuff,sans-serif;font-size:18px}
.hh-family-recovery-person{margin:0 0 16px!important;color:#626b77!important;font-family:Quicksand,sans-serif!important;font-weight:700!important}
.hh-family-recovery-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hh-recovery-choice{
  display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;text-align:left;
  padding:16px;border:2px solid #302238;border-radius:18px;background:#fff;cursor:pointer;
  box-shadow:0 3px 0 rgba(48,34,56,.10)
}
.hh-recovery-choice:hover{transform:translateY(-2px)}
.hh-recovery-emoji{grid-row:1/3;font-size:28px;align-self:center}
.hh-recovery-choice strong{font-family:"Arial Rounded MT Bold","Arial Rounded MT",Arial,sans-serif;font-size:15px}
.hh-recovery-choice small{margin-top:4px;font-family:Quicksand,sans-serif;color:#67707c;line-height:1.35}
.hh-recovery-question-form,.hh-recovery-reset-form{display:grid;gap:11px}
.hh-recovery-question-form[hidden],.hh-recovery-reset-form[hidden]{display:none!important}
.hh-recovery-question{display:grid;gap:6px;font-family:Quicksand,sans-serif;font-weight:800}
.hh-recovery-question input,.hh-recovery-reset-form input{
  width:100%;min-height:46px;padding:10px 13px;border:2px solid #302238;border-radius:13px;background:#fff;font:inherit
}
.hh-family-recovery-message{
  margin:14px 0 0!important;padding:10px 12px;border-radius:12px;background:#ffe2e7;
  color:#8e1932!important;font-family:Quicksand,sans-serif!important;font-weight:800!important
}
.hh-family-recovery-message.is-ok{background:#e8ffd2;color:#285d23!important}
@media(max-width:650px){.hh-family-recovery-choices{grid-template-columns:1fr}.hh-family-only-wall .hh-btn-yellow{min-width:170px!important}}


/* ============================================================
   v1.6.42 — Family login + recovery refinement
   ============================================================ */

/* Bring the logged-out card back toward the wider original design. */
.hh-family-only-wall{
  width:min(760px,calc(100% - 40px))!important;
  max-width:760px!important;
  padding:92px 56px 48px!important;
}
.hh-family-only-wall h2{
  font-family:"Arial Rounded MT Bold","Arial Rounded MT",Arial,sans-serif!important;
  font-size:clamp(34px,4.2vw,46px)!important;
  line-height:1.08!important;
  letter-spacing:-.02em!important;
  max-width:none!important;
}
.hh-family-only-wall .hh-btn-yellow{
  font-family:DynaPuff,sans-serif!important;
  font-size:16px!important;
}

/* Cords extend behind the sign so they visibly connect to it. */
.hh-keepout-hanger{top:-86px!important;height:140px!important}
.hh-keepout-cord{
  height:92px!important;
  z-index:1!important;
}
.hh-keepout-cord.left{
  left:64px!important;
  transform:rotate(17deg)!important;
}
.hh-keepout-cord.right{
  right:64px!important;
  transform:rotate(-17deg)!important;
}
.hh-keepout-sign{
  top:70px!important;
  z-index:2!important;
  font-family:"Coming Soon","Comic Sans MS",cursive!important;
  font-weight:700!important;
}

/* Forgotten-password mode replaces the login choices instead of stacking
   underneath them, keeping the window compact and avoiding page scrolling. */
.hh-family-switcher-card.is-recovering{
  max-height:calc(100vh - 50px)!important;
  overflow:auto!important;
}
.hh-family-switcher-card.is-recovering>.hh-family-switcher-kicker,
.hh-family-switcher-card.is-recovering>#hh-family-switcher-title,
.hh-family-switcher-card.is-recovering>.hh-family-switcher-grid,
.hh-family-switcher-card.is-recovering>.hh-family-password-wrap,
.hh-family-switcher-card.is-recovering>.hh-family-login-help,
.hh-family-switcher-card.is-recovering>.hh-family-switcher-hint,
.hh-family-switcher-card.is-recovering>.hh-family-switcher-error{
  display:none!important;
}
.hh-family-switcher-card.is-recovering .hh-family-recovery{
  margin-top:0!important;
}
.hh-family-recovery{
  padding:18px!important;
}
.hh-family-recovery h3{
  font-size:22px!important;
  margin:1px 0 2px!important;
}
.hh-family-recovery-person{
  margin-bottom:11px!important;
}
.hh-family-recovery-choices{
  gap:10px!important;
}
.hh-recovery-choice{
  padding:13px!important;
}
.hh-recovery-choice small{
  line-height:1.25!important;
}
.hh-recovery-parent-form,
.hh-recovery-question-form,
.hh-recovery-reset-form{
  display:grid;
  gap:9px;
  margin-top:8px;
}
.hh-recovery-parent-form[hidden]{display:none!important}
.hh-recovery-parent-form h4{
  margin-bottom:2px!important;
}
.hh-recovery-parent-form p{
  margin:0 0 4px!important;
  color:#5e6875!important;
  font-family:Quicksand,sans-serif!important;
  font-weight:650!important;
  line-height:1.4!important;
}
.hh-recovery-parent-form input{
  width:100%;
  min-height:44px;
  padding:9px 12px;
  border:2px solid #302238;
  border-radius:13px;
  background:#fff;
  font-family:Quicksand,sans-serif;
  font-size:15px;
}

.hh-pw-request-note{
  display:block;
  margin-top:8px;
  color:#65707c;
  font-family:Quicksand,sans-serif;
  font-weight:700;
}
.hh-pw-approve{
  margin-top:9px!important;
}
.hh-pw-approve.is-approved{
  background:#dfffb8!important;
  color:#244916!important;
}

@media(max-width:650px){
  .hh-family-only-wall{
    width:calc(100% - 24px)!important;
    padding:84px 24px 36px!important;
  }
}


/* ============================================================
   v1.6.43 — login UX, recovery polish, unread notifications
   ============================================================ */

/* No duplicate top-right login button on the logged-out Family Home. */
.hh-fresh-header:not(:has(.hh-fresh-nav)) .hh-fresh-header-inner{
  justify-content:flex-start!important;
}

/* Password fields with an explicit show/hide control. */
.hh-secret-field{
  position:relative;
  width:100%;
}
.hh-secret-field input{
  width:100%!important;
  padding-right:48px!important;
}
.hh-secret-toggle{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#302238;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.hh-secret-toggle:hover{
  background:#f1edf5;
}
.hh-secret-toggle.is-visible{
  background:#e8ffd2;
}

/* Forgot-password navigation has its own rows. */
.hh-family-recovery-back-row{
  display:block;
  width:100%;
  margin-bottom:4px;
}
.hh-family-recovery-kicker-row{
  display:block;
  width:100%;
  margin-bottom:5px;
}
.hh-family-recovery-kicker-row .hh-family-switcher-kicker{
  display:block;
}

/* Successful parent request collapses to a simple confirmation. */
.hh-family-recovery.is-request-sent .hh-family-recovery-kicker-row,
.hh-family-recovery.is-request-sent>h3,
.hh-family-recovery.is-request-sent>.hh-family-recovery-person,
.hh-family-recovery.is-request-sent>.hh-family-recovery-choices,
.hh-family-recovery.is-request-sent>.hh-recovery-parent-form,
.hh-family-recovery.is-request-sent>.hh-recovery-question-form,
.hh-family-recovery.is-request-sent>.hh-recovery-reset-form{
  display:none!important;
}
.hh-family-recovery.is-request-sent{
  min-height:150px;
}
.hh-family-recovery.is-request-sent .hh-family-recovery-message{
  margin-top:16px!important;
  font-size:18px!important;
}

/* Subtle explicit admin route: passwords never need to be exposed to Emily. */
.hh-family-login-help{
  gap:14px;
  align-items:center;
}
.hh-family-admin-enter{
  appearance:none;
  border:0;
  background:transparent;
  color:#7d4d9d;
  padding:4px 2px;
  font-family:Quicksand,sans-serif;
  font-weight:800;
  text-decoration:underline;
  cursor:pointer;
}
.hh-family-admin-enter:disabled{
  opacity:.35;
  cursor:not-allowed;
}

/* Keep direct-login mode visually clean while the chooser opens. */
.hh-direct-family-login{
  min-height:42vh;
}

/* Password reset controls remain compact. */
.hh-recovery-parent-form .hh-secret-field,
.hh-recovery-reset-form .hh-secret-field{
  margin:0;
}

/* Notification approval details. */
.hh-pw-request-note{
  max-width:620px;
}


/* ============================================================
   v1.6.44 — calmer headings + secure parent access + eye UI
   + inline notifications + silly public entrance test
   ============================================================ */
:root{
  --hh-heading-font:"Arial Rounded MT Bold","Arial Rounded MT","Trebuchet MS",Arial,sans-serif;
}

/* DynaPuff is now an accent instead of the default for every headline. */
.hh-app h1,.hh-app h2,.hh-app h3,.hh-app h4,.hh-app h5,.hh-app h6,
.hh-section-title,.hh-family-switcher-card h2,.hh-family-switcher-card h3,.hh-family-switcher-card h4,
.hh-family-quest-card h2,.hh-notification-drawer h3,.hh-list-item h3,.hh-family-only-wall h2{
  font-family:var(--hh-heading-font)!important;
  font-weight:700!important;
  letter-spacing:-.025em!important;
}
.hh-family-switcher-kicker,.hh-eyebrow{
  font-family:var(--hh-hand-font)!important;
  font-weight:700!important;
  letter-spacing:.06em!important;
}

/* Mask custom family-password fields without advertising them to Safari as password-manager fields. */
.hh-mask-input{-webkit-text-security:disc}
.hh-mask-input.is-revealed{-webkit-text-security:none}

/* Eye toggle with a pupil that looks around on hover. */
.hh-secret-toggle{background:transparent!important;width:38px!important;height:38px!important}
.hh-eye-icon{
  position:relative;display:block;width:23px;height:14px;border:2px solid #302238;
  border-radius:55% 45% 55% 45% / 65% 65% 35% 35%;background:#fff;transform:rotate(-2deg)
}
.hh-eye-icon i{
  position:absolute;left:7px;top:3px;width:6px;height:6px;border-radius:50%;background:#302238
}
.hh-secret-toggle:hover .hh-eye-icon i{animation:hh-eye-look .95s ease-in-out infinite}
@keyframes hh-eye-look{
  0%{transform:translateX(-4px)}
  35%{transform:translateX(4px) translateY(-1px)}
  70%{transform:translateX(1px) translateY(2px)}
  100%{transform:translateX(-3px) translateY(-1px)}
}
.hh-secret-toggle.is-visible .hh-eye-icon::after{
  content:"";position:absolute;left:-3px;top:5px;width:27px;height:2px;border-radius:3px;
  background:#ff5f93;transform:rotate(-28deg)
}

/* Parent/admin access is useful, but it is never passwordless. */
.hh-family-admin-auth{
  margin-top:14px;padding:17px;border:2px solid #302238;border-radius:18px;
  background:#fff8e7;display:grid;gap:10px
}
.hh-family-admin-auth[hidden]{display:none!important}
.hh-family-admin-auth h3{margin:0!important;font-size:20px!important}
.hh-family-admin-auth p{margin:0!important;font:650 13px/1.45 var(--hh-body-font)!important;color:#596574!important}
.hh-family-admin-back{
  justify-self:start;border:0;background:transparent;padding:0;color:#2d5e8f;
  font:800 13px var(--hh-body-font);text-decoration:underline;cursor:pointer
}
.hh-family-admin-error{
  margin:0!important;padding:9px 11px!important;border-radius:11px;background:#ffe2e7;
  color:#8e1932!important;font:800 12px var(--hh-body-font)!important
}
.hh-family-switcher-card.is-admin-auth>.hh-family-password-wrap,
.hh-family-switcher-card.is-admin-auth>.hh-family-login-help,
.hh-family-switcher-card.is-admin-auth>.hh-family-switcher-hint,
.hh-family-switcher-card.is-admin-auth>.hh-family-switcher-error{display:none!important}

/* Notification dropdown items now expand in place. */
.hh-notification-pop-row{display:block!important;padding:0!important}
.hh-notification-pop-summary{
  width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:start;
  padding:12px 13px;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit
}
.hh-notification-pop-row.is-unread .hh-notification-pop-summary{background:#fff8dc}
.hh-notification-pop-summary:hover{background:#f7f6fb}
.hh-notification-pop-detail{
  padding:0 13px 13px 38px;border-top:1px dashed #d7d2dd;background:#fff
}
.hh-notification-pop-detail p{margin:10px 0!important;font:600 12px/1.45 var(--hh-body-font)!important;color:#4e5967!important}

/* Public card links that open the family quest. */
.hh-sticky-link{appearance:none;border:0;background:transparent;padding:0;font:inherit;font-weight:800;text-decoration:underline;cursor:pointer}

/* Secret Hudson Entrance Test — deliberately silly, not a security replacement. */
body.hh-family-quest-open{overflow:hidden!important}
.hh-family-quest[hidden]{display:none!important}
.hh-family-quest{position:fixed;inset:0;z-index:100020;display:grid;place-items:center;padding:24px}
.hh-family-quest-backdrop{position:absolute;inset:0;border:0;background:rgba(18,20,31,.58);backdrop-filter:blur(8px)}
.hh-family-quest-card{
  position:relative;width:min(650px,calc(100vw - 30px));max-height:calc(100vh - 30px);overflow:auto;
  padding:28px;background:#fff;border:3px solid #24202c;border-radius:30px;
  box-shadow:10px 12px 0 #b8ff22,0 24px 60px rgba(0,0,0,.22)
}
.hh-family-quest-close{
  position:absolute;top:17px;right:17px;width:44px;height:44px;border:2px solid #302238;border-radius:999px;
  background:#fff;font:800 20px var(--hh-heading-font);cursor:pointer
}
.hh-family-quest-card h2{margin:4px 50px 4px 0!important;font-size:clamp(28px,5vw,42px)!important}
.hh-family-quest-intro{margin:0 0 18px!important;font:650 14px var(--hh-body-font)!important;color:#5d6774!important}
.hh-quest-step{
  display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:start;
  margin:10px 0;padding:14px;border:2px dashed #cbc5d1;border-radius:18px;background:#fafafa;
  opacity:.38;filter:grayscale(.4);pointer-events:none;transition:.18s ease
}
.hh-quest-step.is-active{opacity:1;filter:none;pointer-events:auto;background:#fff;border-style:solid}
.hh-quest-number{
  width:38px;height:38px;display:grid;place-items:center;border:2px solid #302238;border-radius:999px;
  background:#ffd84d;font:800 16px var(--hh-heading-font)
}
.hh-quest-step strong{display:block;margin-bottom:8px;font:800 14px var(--hh-heading-font)}
.hh-quest-step input[type="range"]{width:100%;accent-color:#19c9bf}
.hh-quest-slider-labels{display:flex;justify-content:space-between;margin-top:2px;color:#707987;font:700 10px var(--hh-body-font)}
.hh-quest-slime{
  position:relative;width:116px;height:72px;border:3px solid #302238;border-radius:50% 48% 42% 55% / 57% 46% 61% 45%;
  background:#a8ff24;box-shadow:4px 5px 0 rgba(48,34,56,.16);cursor:pointer
}
.hh-quest-slime::before,.hh-quest-slime::after{
  content:"";position:absolute;top:19px;width:7px;height:9px;border-radius:50%;background:#302238
}
.hh-quest-slime::before{left:38px}.hh-quest-slime::after{right:38px}
.hh-quest-slime i{
  position:absolute;left:50%;top:39px;width:22px;height:9px;transform:translateX(-50%);
  border-bottom:3px solid #302238;border-radius:50%
}
.hh-quest-slime.is-booped{animation:hh-slime-boop .3s ease}
@keyframes hh-slime-boop{0%{transform:scale(1)}45%{transform:scale(1.12,.82) rotate(-3deg)}100%{transform:scale(1)}}
.hh-quest-step small{display:inline-block;margin-left:10px;color:#67707c;font:700 11px var(--hh-body-font)}
.hh-quest-phrase{
  display:inline-block;margin:0 0 8px;padding:5px 10px;border-radius:999px;background:#ffe6f0;color:#302238;
  font:700 18px var(--hh-hand-font);transform:rotate(-2deg)
}
.hh-quest-step input[type="text"]{
  width:100%;min-height:44px;padding:9px 12px;border:2px solid #302238;border-radius:13px;
  font:700 14px var(--hh-body-font)
}
.hh-quest-finish{width:100%;margin-top:12px}
.hh-family-quest-note{display:block;margin-top:8px;text-align:center;color:#66707d;font:700 11px var(--hh-body-font)}
@media(max-width:650px){
  .hh-family-quest-card{padding:22px 18px}
  .hh-quest-step{grid-template-columns:34px minmax(0,1fr);padding:12px}
  .hh-quest-number{width:32px;height:32px}
}