/* These body-level cards never resize or scroll the Library panels. */
/* App updates use the existing friend-listening card's colors and controls. */
.library-update-notice{box-sizing:border-box;width:min(460px,calc(100vw - 32px));min-height:86px;padding:14px 14px 14px 12px;border:0;border-radius:18px;background:linear-gradient(135deg,rgba(16,24,35,.98),rgba(8,12,18,.98));box-shadow:-18px 22px 54px rgba(0,0,0,.42);color:#fff;display:grid;grid-template-columns:46px minmax(0,1fr) 40px;align-items:center;gap:12px;font-family:var(--font-body,Arial,sans-serif)}
.library-update-notice .favorites-listen-with-notice-icon{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#74e8a2,#7d63ff);box-shadow:0 10px 26px rgba(105,223,196,.2),inset 0 0 0 3px rgba(255,255,255,.14)}
.library-update-notice.favorites-listen-with-notice.has-action{grid-template-columns:46px minmax(0,1fr) 40px}
.library-update-notice .favorites-listen-with-notice-icon svg{width:25px;height:23px;fill:#061018}
.library-update-notice .favorites-listen-with-notice-copy{min-width:0;display:grid;gap:4px}
.library-update-notice .favorites-listen-with-notice-copy strong{font-size:.98rem;font-weight:950;color:#fff}
.library-update-notice .favorites-listen-with-notice-copy small{font-size:.82rem;font-weight:400;color:rgba(223,238,255,.72)}
.library-update-notice .favorites-listen-with-notice-copy :is(strong,small){white-space:normal;overflow-wrap:anywhere;line-height:1.35}
.library-update-notice .favorites-listen-with-notice-close{width:40px;height:40px;align-self:start;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:rgba(223,238,255,.76);font:900 24px/1 Arial,sans-serif;cursor:pointer}
.library-update-notice .library-update-notice-actions{display:flex;flex-wrap:wrap;gap:8px;grid-column:2 / -1;grid-row:2}
.library-update-notice .favorites-listen-with-notice-action{min-height:44px;padding:8px 16px;border:0;border-radius:999px;background:linear-gradient(135deg,#74e8a2,#7d63ff);color:#061018;font:900 .82rem/1.3 var(--font-body,Arial,sans-serif);cursor:pointer;box-shadow:0 10px 22px rgba(105,223,196,.16)}
.library-update-notice .favorites-listen-with-notice-action.is-secondary{background:rgba(255,255,255,.08);color:#fff;box-shadow:none}
.library-update-notice button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.elara-update-check{display:flex;align-items:center;gap:9px;background:transparent;color:inherit;border:1px solid currentColor;border-radius:12px;padding:10px 12px;min-height:44px;margin:12px 6px;cursor:pointer;font:inherit;font-size:14px;text-align:left}
.elara-update-check:focus-visible{outline:3px solid #63d7e3;outline-offset:3px}
.elara-update-symbol{display:grid;place-items:center;flex:none;width:24px;height:24px}.elara-update-symbol svg{width:24px;height:24px;fill:currentColor}
.private-sidebar .elara-update-check{margin:10px 0;font-size:12px;flex-shrink:0}
.library-desktop-notices{position:fixed;z-index:2700;top:calc(var(--favorites-connections-panel-top,72px) + 16px);right:max(16px,var(--favorites-connections-panel-right,0px));width:min(460px,calc(100vw - 32px));display:grid;gap:10px;pointer-events:none}
.library-desktop-notices>.library-mobile-notice{position:relative;inset:auto;width:100%;margin:0;opacity:0;transform:translateX(calc(100% + 36px));transition:opacity .22s ease,transform .28s cubic-bezier(.18,.88,.24,1);pointer-events:auto}
.library-desktop-notices>.library-mobile-notice.is-visible{opacity:1;transform:translateX(0)}
.library-desktop-notices>.library-mobile-notice.is-dismissing{opacity:0;transform:translateX(calc(100% + 44px));pointer-events:none}
@media(prefers-reduced-motion:reduce){.library-desktop-notices>.library-mobile-notice{transition:none;transform:none}}
.library-mobile-notices {
  position:fixed;
  z-index:2700;
  top:calc(env(safe-area-inset-top,0px) + 12px);
  left:max(12px,env(safe-area-inset-left,0px));
  right:max(12px,env(safe-area-inset-right,0px));
  width:auto;
  max-width:480px;
  margin-inline:auto;
  display:grid;
  gap:10px;
  pointer-events:none;
}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices > .library-mobile-notice {
  position:relative;
  inset:auto;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  padding:14px;
  border-radius:24px;
  opacity:0;
  transform:translateY(calc(-100% - env(safe-area-inset-top,0px) - 24px));
  transition:transform .32s cubic-bezier(.22,.8,.25,1),opacity .25s ease;
  pointer-events:auto;
  box-shadow:0 12px 36px rgba(0,0,0,.38);
}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices > .library-mobile-notice.is-visible {opacity:1;transform:translateY(0)}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices > .library-mobile-notice.is-dismissing {opacity:0;pointer-events:none}
.library-mobile-message {
  display:grid;
  grid-template-columns:minmax(0,1fr) 40px;
  align-items:center;
  gap:12px;
  background:var(--favorites-notification-bar-background,linear-gradient(110deg,#e2ff64,#d5f15e));
  color:var(--favorites-notification-bar-text-color,#0b0b0f);
  border:1px solid rgba(255,255,255,.25);
  font:700 15px/1.4 var(--font-body,Arial,sans-serif);
}
.library-mobile-message-copy {min-width:0;overflow-wrap:anywhere}
.library-mobile-message-close {
  display:grid;place-items:center;
  width:40px;height:40px;padding:0;
  border:0;border-radius:50%;background:#0b0b0f;color:#fff;
  font:700 24px/1 Arial,sans-serif;cursor:pointer;
}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice {grid-template-columns:42px minmax(0,1fr) 40px;gap:10px}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice-copy {grid-column:2;grid-row:1}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice-copy :is(strong,small) {white-space:normal;overflow-wrap:anywhere;line-height:1.35}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice-icon {grid-column:1;grid-row:1;align-self:start;width:42px;height:42px}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice-close {grid-column:3;grid-row:1;width:40px;height:40px;align-self:start}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices .favorites-listen-with-notice-action {grid-column:2 / 4;grid-row:2;justify-self:start;min-height:44px;min-width:88px}
body:is(.favorites-page,.library-notices-page) .library-mobile-notices [data-playlist-join-notice]:not(.has-avatar) .favorites-listen-with-notice-copy {grid-column:1 / 3}
.library-mobile-notices button:focus-visible {outline:3px solid #fff;outline-offset:3px}
@media (prefers-reduced-motion:reduce) {
  body:is(.favorites-page,.library-notices-page) .library-mobile-notices > .library-mobile-notice,
  body:is(.favorites-page,.library-notices-page) .library-mobile-notices > .library-mobile-notice.is-visible {transition:none;transform:none}
}
