/* Town messages and surprise prizes (js/inbox.js). The card reuses the coffee pop-up styles in grumble.css (.cp, .cp-card, .cr-code...). */
.inbox-pop{z-index:9350}
.inbox-badge{display:grid;place-items:center;width:58px;height:58px;margin:2px auto 4px;border-radius:50%;border:3px solid #7c173e;background:#ffd23f;color:#7c173e;box-shadow:0 3px 0 #7c173e}
.inbox-badge svg{width:30px;height:30px}
.inbox-pop[data-kind="prize"] .inbox-badge{background:#ff5fa2;color:#fff}
.inbox-title{overflow-wrap:anywhere}
.inbox-body{white-space:pre-line;overflow-wrap:anywhere;font-size:15.5px}
.inbox-note{margin:6px 0 0;font-weight:600;font-size:14px;color:#d4136f}
.inbox-done{font:700 16px/1 'Fredoka',sans-serif;cursor:pointer}
.inbox-terms{margin-top:8px}
.inbox-copy-src{position:fixed;left:-9999px;top:0;opacity:0}
@media (max-height:600px){.inbox-badge{width:40px;height:40px}.inbox-badge svg{width:22px;height:22px}}

/* longer codes (up to 32 characters) shrink, and the longest wrap, so they never run out of the dashed box */
.cp-card .cp-code{max-width:none}
.cp-card .cp-code strong[data-len="m"]{font-size:clamp(15px,4.4vw,19px)}
.cp-card .cp-code strong[data-len="l"]{font-size:clamp(13px,3.6vw,15px);white-space:normal;overflow-wrap:anywhere}

/* press feedback inside the pop-up: a quick, subtle scale (grumble.css nudges these down instead) */
.inbox-pop .reward-copy,.inbox-pop .reward-book,.inbox-pop .inbox-done,.inbox-pop .cp-x{transition:transform 160ms cubic-bezier(.23,1,.32,1)}
.inbox-pop .reward-copy:active,.inbox-pop .reward-book:active,.inbox-pop .inbox-done:active,.inbox-pop .cp-x:active{transform:scale(.97)}
@media (prefers-reduced-motion:reduce){.inbox-pop .reward-copy:active,.inbox-pop .reward-book:active,.inbox-pop .inbox-done:active,.inbox-pop .cp-x:active{transform:none}}