/* Meet: a tapped name tag grows into the middle of the screen with a big photo (js/meet.js). */
.meet{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px}
.meet[hidden]{display:none}
.meet-bg{position:absolute;inset:0;background:rgba(14,14,14,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:opacity .35s}
.meet:not(.in) .meet-bg{opacity:0}
.meet-box{position:relative;container-type:size;display:grid;place-items:center;scale:var(--k,1);filter:drop-shadow(0 18px 24px rgba(0,0,0,.3))}
/* the popped tag is the same sticker, only bigger: no peel, no drag offset */
/* !important because hints.css curls a hovered or .curl tag with more specific selectors, which won on the big copy */
.meet .tag{--pc:0px!important;clip-path:none!important;translate:none;rotate:var(--r,0deg);cursor:pointer}
.meet .tag::after{content:none!important;display:none!important}
.meet-x{position:absolute;top:calc(14px + env(safe-area-inset-top));right:14px;font:500 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.04em;background:#fff;color:var(--ink);border:0;border-radius:999px;padding:10px 14px;min-height:44px;cursor:pointer;transition:opacity .3s}
.meet:not(.in) .meet-x{opacity:0}
/* roll call (js/meet.js): after the Family link, everything but the family steps back for a moment */
.wall.rollcall .cell:not(#family):not(:has(.tag)){opacity:.22;transition:opacity .5s,scale .14s}
.wall.calm .cell{transition:opacity .6s,scale .14s}