/* GoWithHer UI stability fixes — 2026-08-27 */

/* Critical: app/admin rely on this class to control which UI is visible. */
.hidden{display:none!important}

/* Approved users should never keep stale loading/pending blocks visible. */
#loading.hidden,#pending.hidden,#clientApp.hidden,#companionApp.hidden,
#clientNav.hidden,#companionNav.hidden,#dashboard.hidden,#adminLogin.hidden{
  display:none!important;
}

/* Desktop: use the available canvas instead of forcing the whole app into a phone-width column. */
@media (min-width:851px){
  .app-shell{
    width:min(980px,calc(100% - 48px));
    max-width:980px;
    min-height:100vh;
  }
  .app-shell .top-inner{
    max-width:980px;
    padding:16px 28px;
  }
  .app-shell .page{
    padding:30px 30px 120px;
  }
  .bottom-nav{
    width:min(980px,calc(100% - 48px));
  }
  .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .profile-card{
    min-width:0;
  }
  .filter-bar{
    grid-template-columns:90px 90px 110px minmax(160px,1fr) 140px auto;
  }
}

/* Phones/tablets: no horizontal spill and larger tap targets. */
@media (max-width:850px){
  .app-shell{width:100%;max-width:none}
  .app-shell .page{padding-left:16px;padding-right:16px;padding-bottom:108px}
  .bottom-nav{width:100%;height:84px}
  .bottom-nav button{min-height:54px;touch-action:manipulation}
  .filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .filter-bar .filter-zone{grid-column:1/-1}
  .filter-bar .filter-go{grid-column:1/-1;width:100%}
  .profile-grid{grid-template-columns:1fr!important}
}

@media (max-width:430px){
  .filter-bar{grid-template-columns:1fr!important}
  .filter-bar .filter-zone,.filter-bar .filter-go{grid-column:auto}
}

/* Patch notes */
#patch-notes{margin:34px 0}.patch-notes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.patch-card{border:3px solid var(--ink);border-radius:24px;padding:18px;box-shadow:var(--shadow)}.patch-card h3{font-size:24px;margin:14px 0 8px}.patch-card ul{padding-left:20px;margin-bottom:0}.patch-card li{margin:8px 0;font-weight:750}.patch-toast{position:fixed;right:18px;top:86px;z-index:80;width:min(360px,calc(100% - 36px));background:var(--pink);border:3px solid var(--ink);border-radius:22px;padding:16px;box-shadow:7px 7px 0 var(--ink)}.patch-toast b{display:block;font-size:20px;margin:5px 28px 5px 0}.patch-toast p{margin:5px 0 10px}.patch-toast a{font-weight:1000}.patch-x{position:absolute;right:10px;top:10px;width:34px;height:34px;padding:0;box-shadow:none}

/* Diablitos / Diablitas social identity */
.devil-role{display:inline-flex;align-items:center;gap:5px;background:var(--cream);border:2px solid var(--ink);border-radius:999px;padding:5px 8px;font-size:9px;font-weight:1000;margin-bottom:9px;letter-spacing:.04em}.social-avatar-card{margin-bottom:18px}.social-avatar-preview,.social-avatar-placeholder{width:82px;height:82px;border-radius:50%;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);object-fit:cover;background:var(--cream)}.social-avatar-placeholder{display:grid;place-items:center;font-size:38px}

/* Community social avatars + six signals */
.emoji-composer.six{grid-template-columns:repeat(3,minmax(0,1fr))}.community-person{width:48px;height:48px;flex:0 0 auto}.community-avatar-img,.community-avatar-fallback{width:48px;height:48px;border-radius:50%;border:3px solid var(--ink);object-fit:cover;background:var(--cream)}.community-avatar-fallback{display:grid;place-items:center;font-size:24px}.emoji-message{position:relative;overflow:hidden}.community-who{display:grid;gap:2px}.community-who span{font-size:10px;font-weight:900}.community-who .ttl{font-size:9px;color:var(--muted);font-weight:1000}.emoji-message.exploding{animation:communityBoom .58s cubic-bezier(.18,.8,.38,1) forwards}.emoji-message.exploding::after{content:'✦  💥  ✹';position:absolute;inset:0;display:grid;place-items:center;background:var(--orange);font-size:34px;font-weight:1000;animation:boomFlash .58s ease-out forwards}@keyframes communityBoom{0%{transform:scale(1) rotate(0)}55%{transform:scale(1.08) rotate(-2deg)}100%{transform:scale(.05) rotate(8deg);opacity:0}}@keyframes boomFlash{0%{opacity:0;transform:scale(.3)}45%{opacity:1;transform:scale(1.2)}100%{opacity:0;transform:scale(2)}}

@media(max-width:850px){.patch-notes-grid{grid-template-columns:1fr}.patch-toast{top:70px}.emoji-composer.six{grid-template-columns:repeat(2,minmax(0,1fr))}}
