/* The birthday popup (/community/discover/). */
.bdPop { position: fixed; inset: 0; z-index: 950; display: grid; place-items: center; padding: var(--s-4); }
.bdPop[hidden] { display: none; }
.bdPop__veil { position: absolute; inset: 0; background: rgb(0 0 0 / .62); backdrop-filter: blur(6px);
  animation: bdFade .3s var(--ease-out); }
.bdPop.is-out { opacity: 0; transition: opacity .2s; }
.bdPop__box { position: relative; width: min(25rem, 100%); max-height: calc(100dvh - 2rem); overflow-y: auto;
  padding: var(--s-7, 2.25rem) var(--s-6) var(--s-5); border-radius: 24px; text-align: center;
  border: 1px solid rgb(240 198 74 / .35);
  background: radial-gradient(120% 70% at 50% 0%, rgb(240 198 74 / .16), transparent 60%), var(--surface-2);
  box-shadow: 0 40px 90px -30px rgb(0 0 0 / .9), 0 0 60px -20px rgb(240 198 74 / .35);
  animation: bdPop .45s cubic-bezier(.2, 1.3, .4, 1); }
.bdPop__cake { width: 4.5rem; height: 4.5rem; margin: 0 auto var(--s-4); border-radius: 50%; display: grid; place-items: center;
  font-size: 2.3rem; background: rgb(240 198 74 / .14); border: 1px solid rgb(240 198 74 / .35); }
.bdPop__cake span { display: inline-block; animation: bdBob 2.4s ease-in-out infinite; }
.bdPop__cake.is-party span { animation: bdParty .7s cubic-bezier(.2, 1.4, .4, 1) both; }
.bdPop__box h2 { margin: 0 0 .4rem; font-size: var(--fs-h3); color: var(--text-hi); }
.bdPop__lead { margin: 0 auto var(--s-5); max-width: 22rem; color: var(--text-mid); font-size: var(--fs-sm); line-height: 1.5; }
.bdPop__field { display: grid; gap: .35rem; text-align: left; margin-bottom: var(--s-4); font-size: var(--fs-sm); color: var(--text-mid); }
.bdPop__field input { width: 100%; padding: .8rem 1rem; border-radius: 14px; font: inherit; font-size: 1rem;
  color: var(--text-hi); background: var(--surface-1); border: 1px solid var(--cmx-hair, rgb(255 255 255 / .12));
  color-scheme: dark; }
.theme-light .bdPop__field input { color-scheme: light; }
.bdPop__field input:focus { outline: none; border-color: var(--y-yellow); box-shadow: 0 0 0 3px rgb(240 198 74 / .2); }
.bdPop__age { margin-bottom: var(--s-4); animation: bdFade .25s var(--ease-out); }
.bdPop__age[hidden], .bdPop__toggle[hidden], .bdPop__minor[hidden], .bdPop__err[hidden] { display: none; }
.bdPop__toggle { display: flex; gap: .8rem; align-items: center; text-align: left; cursor: pointer;
  padding: .8rem .9rem; border-radius: 14px; background: var(--surface-1); border: 1px solid rgb(240 198 74 / .3); }
.bdPop__toggle input { position: absolute; opacity: 0; pointer-events: none; }
.bdPop__switch { flex: none; position: relative; width: 2.6rem; height: 1.5rem; border-radius: 99px; background: var(--cmx-hair, #444);
  transition: background-color .2s; }
.bdPop__switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: calc(1.5rem - 6px); height: calc(1.5rem - 6px);
  border-radius: 50%; background: #fff; transition: translate .22s cubic-bezier(.3, 1.4, .5, 1); }
.bdPop__toggle input:checked + .bdPop__switch { background: var(--y-yellow); }
.bdPop__toggle input:checked + .bdPop__switch::after { translate: 1.1rem 0; }
.bdPop__toggle input:focus-visible + .bdPop__switch { outline: 2px solid var(--y-yellow); outline-offset: 2px; }
.bdPop__toggle b { display: block; color: var(--text-hi); font-size: var(--fs-sm); }
.bdPop__toggle i { font-style: normal; color: var(--text-lo); font-size: .78rem; }
.bdPop__minor { margin: 0; max-width: none; text-align: left; padding: .8rem .9rem; border-radius: 14px;
  background: var(--surface-1); color: var(--text-mid); font-size: .82rem; line-height: 1.5; }
.bdPop__minor b { color: var(--text-hi); }
.bdPop__err { margin: 0 0 var(--s-3); max-width: none; color: var(--y-red); font-size: var(--fs-sm); }
.bdPop__go { width: 100%; min-height: 3rem; }
.bdPop__later { margin-top: var(--s-3); border: 0; background: none; cursor: pointer; font: inherit;
  font-size: var(--fs-sm); color: var(--text-lo); }
.bdPop__later:hover { color: var(--text-hi); }
@keyframes bdPop { from { opacity: 0; transform: translateY(16px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes bdFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes bdBob { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-4px) rotate(-6deg); } }
@keyframes bdParty { from { transform: scale(.3) rotate(-30deg); } to { transform: scale(1) rotate(0); } }
@media (prefers-reduced-motion: reduce) { .bdPop__box, .bdPop__cake span, .bdPop__veil { animation: none; } }
/* Public ⇄ Private label, driven by the switch itself — no script needed. */
.bdPop__state { display: grid; gap: .1rem; }
.bdPop__off { display: none; }
.bdPop__toggle input:not(:checked) ~ .bdPop__state .bdPop__on { display: none; }
.bdPop__toggle input:not(:checked) ~ .bdPop__state .bdPop__off { display: block; }
.bdPop__later-note { font-size: .72rem !important; opacity: .8; }
