/* Wondering Imp v0.8.19 — dismiss unwanted matches + larger mobile app logo */

/* Match dismissal controls */
.match-title-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.match-dismiss-button{
  border:1px solid rgba(227,219,201,.95);
  background:#fffdf8;
  color:#5f6d67;
  border-radius:10px;
  padding:7px 10px;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.match-dismiss-button:hover,.match-dismiss-button:focus-visible{background:#f4efe4;color:#173d33;border-color:#cfbf9d}
.match-dismiss-button:focus-visible{outline:3px solid rgba(216,170,78,.24);outline-offset:2px}

/* Action toast used by the temporary Undo after hiding a match. */
.toast.has-action{pointer-events:auto;display:flex;align-items:center;gap:12px;max-width:min(440px,calc(100vw - 28px))}
.toast.has-action button{border:1px solid #ffffff66;background:#ffffff14;color:#fff;border-radius:9px;padding:7px 10px;font-weight:900}
.toast.has-action button:hover,.toast.has-action button:focus-visible{background:#ffffff26}

/* The PNG includes transparent breathing room around the round Imp mark.
   Scaling the image itself makes the visible mascot approximately the same
   visual height as the mobile Sign in / Sign out button without stealing
   extra horizontal room from the toolbar. */
@media(max-width:780px){
  .mobile-brand{overflow:visible;justify-content:center}
  .mobile-brand img{transform:scale(1.28);transform-origin:center;will-change:transform}
  .match-title{align-items:flex-start;gap:10px}
  .match-title-actions{gap:6px}
}

@media(max-width:430px){
  .match-title{display:grid;grid-template-columns:1fr;gap:9px}
  .match-title-actions{justify-content:flex-start}
  .match-dismiss-button{padding:7px 9px}
}