.matchapp-notification-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border-radius:50%;border:1px solid rgba(229,193,88,.34);background:rgba(255,255,255,.055);color:#efe2ae;cursor:pointer;flex:0 0 auto}
.matchapp-notification-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.matchapp-notification-button.has-notification{border-color:#E5C158;box-shadow:0 0 0 1px rgba(229,193,88,.15),0 0 18px rgba(229,193,88,.22);animation:matchBellGlow 2.8s ease-in-out infinite}
.matchapp-notification-button.has-notification svg{animation:matchBellRing 3.2s ease-in-out infinite;transform-origin:50% 10%}
.matchapp-notification-count{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;display:grid;place-items:center;background:#d94c73;color:#fff;border:2px solid #160c2e;font-size:9px;font-weight:900;line-height:1}
.matchapp-notification-count[hidden]{display:none!important}
.matchapp-notification-panel{position:fixed;right:16px;top:84px;z-index:5000;width:min(420px,calc(100vw - 24px));max-height:min(720px,calc(100dvh - 100px));overflow:auto;border:1px solid rgba(229,193,88,.34);border-radius:22px;background:linear-gradient(160deg,rgba(28,15,52,.985),rgba(10,9,18,.99));box-shadow:0 24px 80px rgba(0,0,0,.65);color:#fff;backdrop-filter:blur(22px)}
.matchapp-notification-panel[hidden]{display:none!important}.matchapp-notification-panel>header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 18px 13px;background:rgba(20,11,38,.96);border-bottom:1px solid rgba(255,255,255,.08)}
.matchapp-notification-panel header small{display:block;color:#E5C158;font-size:9px;font-weight:900;letter-spacing:.16em}.matchapp-notification-panel h2{font-size:22px;margin:2px 0 0}.matchapp-notification-close{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:transparent;color:#fff;font-size:22px;cursor:pointer}
.matchapp-notification-toolbar{display:flex;justify-content:space-between;gap:10px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.06)}.matchapp-notification-toolbar button,.matchapp-notification-toolbar a{background:none;border:0;color:#cdbdf0;font:inherit;font-size:11px;font-weight:800;text-decoration:none;cursor:pointer}
.matchapp-notification-list{display:grid;gap:1px}.matchapp-notification-item{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;text-align:left;padding:14px 16px;border:0;border-bottom:1px solid rgba(255,255,255,.055);background:transparent;color:#fff;cursor:pointer}.matchapp-notification-item:hover{background:rgba(255,255,255,.045)}.matchapp-notification-item.is-unread{background:linear-gradient(90deg,rgba(229,193,88,.11),transparent)}.matchapp-notification-kind{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(229,193,88,.28);color:#E5C158;background:rgba(229,193,88,.07)}
.matchapp-notification-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.matchapp-notification-copy strong{font-size:13px;color:#fff}.matchapp-notification-copy>span{font-size:12px;line-height:1.45;color:#c2b9cf}.matchapp-notification-copy small{font-size:10px;color:#7f748d}.matchapp-notification-empty{padding:28px 18px;color:#9e94ac;text-align:center;font-size:13px}
.matchapp-notification-settings{border-top:1px solid rgba(229,193,88,.16);padding:12px 16px 16px}.matchapp-notification-settings summary{cursor:pointer;color:#E5C158;font-weight:900;font-size:12px;padding:5px 0}.matchapp-notification-prefs{padding-top:10px}.matchapp-notification-prefs>label{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px;color:#ddd4e7}.matchapp-notification-prefs input{accent-color:#E5C158;width:18px;height:18px}.matchapp-notification-help{font-size:11px;line-height:1.45;color:#8f85a0;margin:0 0 8px}.matchapp-notification-delivery{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:13px}.matchapp-notification-delivery button{border:1px solid rgba(229,193,88,.3);border-radius:12px;background:rgba(229,193,88,.08);color:#f5e3a3;padding:10px 8px;font-weight:800;font-size:11px;cursor:pointer}.matchapp-notification-delivery small{grid-column:1/-1;color:#81788e;line-height:1.45}
.matchapp-card-availability.is-highlighted{animation:availabilityHighlight 1.35s ease}
@keyframes matchBellRing{0%,88%,100%{transform:rotate(0)}90%{transform:rotate(15deg)}92%{transform:rotate(-12deg)}94%{transform:rotate(8deg)}96%{transform:rotate(-5deg)}}@keyframes matchBellGlow{0%,100%{box-shadow:0 0 0 1px rgba(229,193,88,.1),0 0 12px rgba(229,193,88,.13)}50%{box-shadow:0 0 0 1px rgba(229,193,88,.25),0 0 23px rgba(229,193,88,.34)}}@keyframes availabilityHighlight{0%,100%{box-shadow:none}35%{box-shadow:0 0 0 2px rgba(229,193,88,.65),0 0 32px rgba(229,193,88,.22)}}
@media(max-width:600px){.matchapp-notification-panel{right:8px;left:8px;top:116px;width:auto;max-height:calc(100dvh - 126px);border-radius:18px}.matchapp-notification-delivery{grid-template-columns:1fr}.matchapp-notification-delivery small{grid-column:1}.matchapp-notification-button{width:100%;height:38px;border-radius:12px}}
@media(prefers-reduced-motion:reduce){.matchapp-notification-button,.matchapp-notification-button svg,.matchapp-card-availability.is-highlighted{animation:none!important}}

.matchapp-notification-floating{position:fixed!important;top:14px;right:14px;z-index:4800!important;width:42px!important;height:42px!important;background:rgba(20,11,38,.96)!important;box-shadow:0 8px 28px rgba(0,0,0,.38)}
@media(max-width:600px){
  body.page-home .matchapp-notification-button{border-radius:12px!important}
  .matchapp-notification-floating{top:10px!important;right:10px!important;width:40px!important;height:40px!important;border-radius:50%!important}
}

/* Taste DNA suggestion cards + per-notification delete controls */
.matchapp-notification-item{
  position:relative;
  display:block;
  padding:0;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.055);
  background:transparent;
  color:#fff;
}
.matchapp-notification-item:hover{background:rgba(255,255,255,.045)}
.matchapp-notification-item.is-unread{background:linear-gradient(90deg,rgba(229,193,88,.11),transparent)}
.matchapp-notification-open{
  width:100%;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:10px;
  align-items:start;
  text-align:left;
  padding:14px 52px 14px 16px;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  font:inherit;
}
.matchapp-notification-item.is-suggestion .matchapp-notification-open{
  grid-template-columns:62px minmax(0,1fr);
  padding-block:12px;
}
.matchapp-notification-poster{
  width:62px;
  height:92px;
  object-fit:contain;
  object-position:center;
  border-radius:9px;
  border:1px solid rgba(229,193,88,.34);
  background:rgba(255,255,255,.035);
  box-shadow:0 8px 22px rgba(0,0,0,.28);
}
.matchapp-notification-taste{
  color:#E5C158!important;
  font-size:9px!important;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.matchapp-notification-delete{
  position:absolute;
  top:9px;
  right:10px;
  z-index:1;
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  padding:0;
  border:1px solid rgba(255,82,82,.34);
  border-radius:10px;
  background:rgba(255,82,82,.08);
  color:#ff5b66;
  cursor:pointer;
}
.matchapp-notification-delete:hover,
.matchapp-notification-delete:focus-visible{
  background:rgba(255,82,82,.17);
  border-color:rgba(255,82,82,.72);
  outline:none;
}
.matchapp-notification-delete svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
@media(max-width:600px){
  .matchapp-notification-open{padding:13px 48px 13px 13px}
  .matchapp-notification-item.is-suggestion .matchapp-notification-open{grid-template-columns:56px minmax(0,1fr)}
  .matchapp-notification-poster{width:56px;height:84px}
  .matchapp-notification-delete{top:8px;right:8px}
}


/* Notification arrival emphasis + bulk controls (Android WebView and browsers). */
.matchapp-notification-toolbar{align-items:center;justify-content:flex-start;flex-wrap:wrap}
.matchapp-notification-toolbar a{margin-left:auto}
.matchapp-notification-toolbar button{min-height:36px;padding:0 9px;border-radius:9px}
.matchapp-notification-toolbar [data-notify-delete-all]{
  color:#ff7b86;
  border:1px solid rgba(255,91,102,.30);
  background:rgba(255,91,102,.075);
}
.matchapp-notification-toolbar [data-notify-delete-all]:hover,
.matchapp-notification-toolbar [data-notify-delete-all]:focus-visible{
  color:#ff9aa3;
  border-color:rgba(255,91,102,.68);
  background:rgba(255,91,102,.14);
  outline:none;
}
.matchapp-notification-toolbar button:disabled{opacity:.42;cursor:not-allowed}
.matchapp-notification-button.notification-arrived{
  animation:matchBellArrivalGlow 1.15s ease both,matchBellGlow 2.8s ease-in-out 1.15s infinite;
}
.matchapp-notification-button.notification-arrived svg{
  animation:matchBellArrival .92s cubic-bezier(.2,.9,.3,1) both;
  transform-origin:50% 10%;
}
@keyframes matchBellArrival{
  0%{transform:rotate(0) scale(1)}
  12%{transform:rotate(19deg) scale(1.08)}
  25%{transform:rotate(-16deg) scale(1.08)}
  38%{transform:rotate(13deg) scale(1.06)}
  51%{transform:rotate(-10deg) scale(1.05)}
  64%{transform:rotate(7deg) scale(1.03)}
  78%{transform:rotate(-4deg) scale(1.02)}
  100%{transform:rotate(0) scale(1)}
}
@keyframes matchBellArrivalGlow{
  0%,100%{box-shadow:0 0 0 1px rgba(229,193,88,.18),0 0 18px rgba(229,193,88,.26)}
  45%{box-shadow:0 0 0 3px rgba(229,193,88,.30),0 0 34px rgba(229,193,88,.52)}
}
@media(max-width:600px){
  .matchapp-notification-toolbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:8px;
    padding:10px 12px;
  }
  .matchapp-notification-toolbar button{min-height:44px;width:100%}
  .matchapp-notification-toolbar a{
    grid-column:1/-1;
    margin:0;
    min-height:36px;
    display:grid;
    place-items:center;
  }
}
@media(prefers-reduced-motion:reduce){
  .matchapp-notification-button.notification-arrived,
  .matchapp-notification-button.notification-arrived svg{animation:none!important}
}
