.wm-wp-push-pwa-control {
  background: var(--wm-push-ui-background);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: clamp(1rem, 2.5vw, 1.5rem);
  box-shadow: 0 1.25rem 3.5rem
    color-mix(in srgb, var(--wm-push-ui-text) 12%, transparent);
  box-sizing: border-box;
  color: var(--wm-push-ui-text);
  container-type: inline-size;
  font-family: inherit;
  margin-block: clamp(1rem, 3vw, 2rem);
  max-width: 56rem;
  min-inline-size: 0;
  width: 100%;
  overflow-wrap: anywhere;
  padding: clamp(1.25rem, 4vw, 2.5rem);
  position: relative;
}

.wm-wp-push-pwa-control *,
.wm-wp-push-pwa-control *::before,
.wm-wp-push-pwa-control *::after {
  box-sizing: border-box;
}

.wm-wp-push-pwa-control [hidden] {
  display: none !important;
}

.wm-wp-push-pwa-control__hero {
  align-items: flex-start;
  display: grid;
  gap: 1rem;
  grid-template-columns: auto minmax(0, 1fr);
}

.wm-wp-push-pwa-control__hero-icon {
  align-items: center;
  background: var(--wm-push-ui-primary);
  border-radius: 1rem;
  color: var(--wm-push-ui-primary-contrast);
  display: inline-flex;
  flex: 0 0 auto;
  height: 3.5rem;
  justify-content: center;
  width: 3.5rem;
}

.wm-wp-push-pwa-control__hero-icon svg {
  fill: currentColor;
  height: 1.6rem;
  width: 1.6rem;
}

.wm-wp-push-pwa-control__eyebrow {
  color: var(--wm-push-ui-primary);
  font-size: 0.75rem;
  font-weight: 750;
  letter-spacing: 0.09em;
  margin: 0 0 0.35rem;
  text-transform: uppercase;
}

.wm-wp-push-pwa-control h2,
.wm-wp-push-pwa-control h3,
.wm-wp-push-pwa-control p {
  color: inherit;
}

.wm-wp-push-pwa-control h2 {
  font-size: clamp(1.55rem, 4vw, 2.25rem);
  font-weight: 760;
  letter-spacing: -0.025em;
  line-height: 1.12;
  margin: 0;
}

.wm-wp-push-pwa-control__intro {
  color: var(--wm-push-ui-muted) !important;
  font-size: clamp(0.95rem, 2vw, 1.05rem);
  line-height: 1.65;
  margin: 0.75rem 0 0;
  max-width: 44rem;
}

.wm-wp-push-pwa-progress {
  display: grid;
  gap: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  list-style: none;
  margin: clamp(1.5rem, 4vw, 2.25rem) 0;
  padding: 0;
  position: relative;
}

.wm-wp-push-pwa-progress li {
  align-items: center;
  color: var(--wm-push-ui-muted);
  display: flex;
  font-size: 0.82rem;
  font-weight: 650;
  gap: 0.55rem;
  min-width: 0;
  position: relative;
}

.wm-wp-push-pwa-progress li:not(:last-child)::after {
  background: var(--wm-push-ui-border);
  content: "";
  height: 1px;
  inset-inline: calc(2rem + 0.5rem) 0.5rem;
  position: absolute;
  top: 1rem;
  z-index: 0;
}

.wm-wp-push-pwa-progress li > span:first-child {
  align-items: center;
  background: var(--wm-push-ui-surface);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 2rem;
  height: 2rem;
  justify-content: center;
  position: relative;
  width: 2rem;
  z-index: 1;
}

.wm-wp-push-pwa-progress__label {
  background: var(--wm-push-ui-background);
  flex: 0 1 auto;
  line-height: 1.35;
  min-width: 0;
  padding-inline: 0.2rem;
  position: relative;
  z-index: 2;
}

.wm-wp-push-pwa-control[data-wm-push-mode="install-required"]
  [data-wm-push-progress="install"],
.wm-wp-push-pwa-control[data-wm-push-mode="open-required"]
  [data-wm-push-progress="open"],
.wm-wp-push-pwa-control[data-wm-push-mode="default"]
  [data-wm-push-progress="enable"],
.wm-wp-push-pwa-control[data-wm-push-mode="mismatch"]
  [data-wm-push-progress="enable"],
.wm-wp-push-pwa-control[data-wm-push-mode="sync-required"]
  [data-wm-push-progress="enable"] {
  color: var(--wm-push-ui-primary);
}

.wm-wp-push-pwa-control[data-wm-push-mode="install-required"]
  [data-wm-push-progress="install"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="open-required"]
  [data-wm-push-progress="open"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="default"]
  [data-wm-push-progress="enable"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="mismatch"]
  [data-wm-push-progress="enable"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="sync-required"]
  [data-wm-push-progress="enable"]
  > span:first-child {
  background: var(--wm-push-ui-primary);
  border-color: var(--wm-push-ui-primary);
  color: var(--wm-push-ui-primary-contrast);
}

.wm-wp-push-pwa-control[data-wm-push-mode="open-required"]
  [data-wm-push-progress="install"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="default"]
  [data-wm-push-progress="install"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="default"]
  [data-wm-push-progress="open"]
  > span:first-child,
.wm-wp-push-pwa-control[data-wm-push-mode="granted"]
  .wm-wp-push-pwa-progress
  li
  > span:first-child {
  background: var(--wm-push-ui-success);
  border-color: var(--wm-push-ui-success);
  color: var(--wm-push-ui-primary-contrast);
}

.wm-wp-push-pwa-control[data-wm-push-guide="direct"]
  [data-wm-push-progress="install"],
.wm-wp-push-pwa-control[data-wm-push-guide="direct"]
  [data-wm-push-progress="open"] {
  display: none;
}

.wm-wp-push-pwa-control[data-wm-push-guide="direct"]
  .wm-wp-push-pwa-progress {
  grid-template-columns: minmax(0, 1fr);
}

.wm-wp-push-pwa-control__status {
  align-items: flex-start;
  background: var(--wm-push-ui-surface);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: 0.85rem;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 3.5rem;
  padding: 0.9rem 1rem;
}

.wm-wp-push-pwa-control__sticky {
  background: var(--wm-push-ui-background);
  border-radius: 1rem;
  padding-block: 0.45rem;
  position: sticky;
  top: max(0.5rem, env(safe-area-inset-top));
  z-index: 1000;
}

.wm-wp-push-pwa-control__status-mark {
  background: var(--wm-push-ui-primary);
  border: 0.3rem solid
    color-mix(in srgb, var(--wm-push-ui-primary) 18%, var(--wm-push-ui-surface));
  border-radius: 999px;
  height: 1rem;
  margin-top: 0.15rem;
  width: 1rem;
}

.wm-wp-push-pwa-control__status p {
  font-size: 0.92rem;
  font-weight: 620;
  line-height: 1.5;
  margin: 0;
}

.wm-wp-push-pwa-control[data-wm-push-state="granted"]
  .wm-wp-push-pwa-control__status {
  border-color: var(--wm-push-ui-success);
}

.wm-wp-push-pwa-control[data-wm-push-state="granted"]
  .wm-wp-push-pwa-control__status-mark {
  background: var(--wm-push-ui-success);
  border-color: color-mix(
    in srgb,
    var(--wm-push-ui-success) 18%,
    var(--wm-push-ui-surface)
  );
}

.wm-wp-push-pwa-control[data-wm-push-state="denied"]
  .wm-wp-push-pwa-control__status,
.wm-wp-push-pwa-control[data-wm-push-state="error"]
  .wm-wp-push-pwa-control__status,
.wm-wp-push-pwa-control[data-wm-push-state="worker-conflict"]
  .wm-wp-push-pwa-control__status,
.wm-wp-push-pwa-control[data-wm-push-state="insecure"]
  .wm-wp-push-pwa-control__status {
  border-color: var(--wm-push-ui-attention);
}

.wm-wp-push-pwa-control[data-wm-push-state="denied"]
  .wm-wp-push-pwa-control__status-mark,
.wm-wp-push-pwa-control[data-wm-push-state="error"]
  .wm-wp-push-pwa-control__status-mark,
.wm-wp-push-pwa-control[data-wm-push-state="worker-conflict"]
  .wm-wp-push-pwa-control__status-mark,
.wm-wp-push-pwa-control[data-wm-push-state="insecure"]
  .wm-wp-push-pwa-control__status-mark {
  background: var(--wm-push-ui-attention);
  border-color: color-mix(
    in srgb,
    var(--wm-push-ui-attention) 18%,
    var(--wm-push-ui-surface)
  );
}

.wm-wp-push-pwa-install {
  margin-block-start: 1rem;
}

.wm-wp-push-pwa-install__guide {
  background: var(--wm-push-ui-surface);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: 1rem;
  padding: clamp(1rem, 3vw, 1.5rem);
}

.wm-wp-push-pwa-install__guide > h3 {
  font-size: clamp(1.1rem, 2.5vw, 1.35rem);
  line-height: 1.3;
  margin: 0;
}

.wm-wp-push-pwa-install__guide > h3 + p {
  color: var(--wm-push-ui-muted);
  line-height: 1.55;
  margin: 0.45rem 0 0;
}

.wm-wp-push-pwa-install__note {
  border-inline-start: 0.2rem solid var(--wm-push-ui-border);
  color: var(--wm-push-ui-muted) !important;
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0.8rem 0 0;
  padding-inline-start: 0.75rem;
}

.wm-wp-push-pwa-install__steps {
  display: grid;
  gap: 0.75rem;
  list-style: none;
  margin: 1.25rem 0;
  padding: 0;
}

.wm-wp-push-pwa-install__steps li {
  align-items: flex-start;
  background: var(--wm-push-ui-background);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: 0.8rem;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 0.9rem;
}

.wm-wp-push-pwa-install__steps li > span {
  align-items: center;
  background: var(--wm-push-ui-primary);
  border-radius: 999px;
  color: var(--wm-push-ui-primary-contrast);
  display: inline-flex;
  flex: 0 0 1.8rem;
  font-size: 0.78rem;
  font-weight: 750;
  height: 1.8rem;
  justify-content: center;
  width: 1.8rem;
}

.wm-wp-push-pwa-install__steps strong {
  color: var(--wm-push-ui-text);
  display: block;
  font-size: 0.92rem;
  line-height: 1.4;
}

.wm-wp-push-pwa-install__steps p {
  color: var(--wm-push-ui-muted);
  font-size: 0.86rem;
  line-height: 1.55;
  margin: 0.25rem 0 0;
}

.wm-wp-push-pwa-share-arrow {
  align-items: center;
  background: var(--wm-push-ui-surface);
  border: 1px solid var(--wm-push-ui-border);
  border-radius: 999px;
  box-shadow: 0 0.75rem 2rem
    color-mix(in srgb, var(--wm-push-ui-text) 22%, transparent);
  color: var(--wm-push-ui-muted);
  display: flex;
  font-size: 0.78rem;
  font-weight: 750;
  gap: 0.35rem;
  inset-inline-end: max(0.75rem, env(safe-area-inset-right));
  padding: 0.45rem 0.7rem;
  pointer-events: none;
  position: fixed;
  z-index: 2147483000;
}

.wm-wp-push-pwa-share-arrow__icon {
  fill: none;
  height: 1.25rem;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 1.25rem;
}

.wm-wp-push-pwa-share-arrow b {
  color: var(--wm-push-ui-primary);
  font-size: 1.25rem;
  line-height: 1;
}

.wm-wp-push-pwa-share-arrow.is-pulsing {
  animation: wm-wp-push-pwa-share-pulse 0.85s ease-out 1;
}

@keyframes wm-wp-push-pwa-share-pulse {
  0%,
  100% {
    box-shadow: 0 0.75rem 2rem
      color-mix(in srgb, var(--wm-push-ui-text) 22%, transparent);
    transform: scale(1);
  }

  45% {
    box-shadow:
      0 0 0 0.55rem
        color-mix(in srgb, var(--wm-push-ui-primary) 22%, transparent),
      0 0.75rem 2rem
        color-mix(in srgb, var(--wm-push-ui-text) 22%, transparent);
    transform: scale(1.08);
  }
}

.wm-wp-push-pwa-share-arrow--top {
  top: max(0.75rem, env(safe-area-inset-top));
}

.wm-wp-push-pwa-share-arrow--bottom {
  bottom: max(0.75rem, env(safe-area-inset-bottom));
}

.wm-wp-push-pwa-control__actions {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-block-start: 1rem;
}

.wm-wp-push-pwa-button {
  align-items: center;
  appearance: none;
  border: 1px solid var(--wm-push-ui-primary);
  border-radius: 0.7rem;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 700;
  gap: 0.6rem;
  justify-content: center;
  line-height: 1.2;
  min-height: 3rem;
  padding: 0.7rem 1.1rem;
  text-align: center;
  text-decoration: none;
}

.wm-wp-push-pwa-button--primary {
  background: var(--wm-push-ui-primary);
  color: var(--wm-push-ui-primary-contrast);
}

.wm-wp-push-pwa-button--secondary {
  background: var(--wm-push-ui-surface);
  border-color: var(--wm-push-ui-border);
  color: var(--wm-push-ui-text);
}

.wm-wp-push-pwa-button:hover {
  box-shadow: inset 0 0 0 999px
    color-mix(in srgb, var(--wm-push-ui-text) 10%, transparent);
}

.wm-wp-push-pwa-button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.wm-wp-push-pwa-button__spinner {
  animation: wm-wp-push-pwa-spin 0.8s linear infinite;
  border: 0.15rem solid
    color-mix(in srgb, currentColor 35%, transparent);
  border-radius: 999px;
  border-top-color: currentColor;
  height: 1rem;
  width: 1rem;
}

@keyframes wm-wp-push-pwa-spin {
  to {
    transform: rotate(1turn);
  }
}

.wm-wp-push-pwa-button:focus-visible {
  outline: 0.2rem solid var(--wm-push-ui-primary);
  outline-offset: 0.2rem;
}

.wm-wp-push-pwa-control__privacy {
  color: var(--wm-push-ui-muted) !important;
  font-size: 0.78rem;
  line-height: 1.55;
  margin: 1rem 0 0;
}

.wm-wp-push-pwa-control__privacy > span {
  color: var(--wm-push-ui-success);
  font-weight: 800;
  margin-inline-end: 0.25rem;
}

.wm-wp-push-pwa-app-bell {
  align-items: center;
  animation: wm-wp-push-pwa-bell-pulse 1.8s ease-in-out infinite;
  background: var(--wm-push-bell-primary);
  border: 0;
  border-radius: 999px;
  bottom: max(1rem, env(safe-area-inset-bottom));
  box-sizing: border-box;
  box-shadow: 0 0.75rem 2rem
    color-mix(in srgb, var(--wm-push-bell-primary) 34%, transparent);
  color: var(--wm-push-bell-icon) !important;
  display: inline-flex;
  height: 4.25rem;
  justify-content: center;
  left: max(1rem, env(safe-area-inset-left));
  line-height: 1;
  margin: 0;
  opacity: 1;
  overflow: hidden;
  padding: 0;
  position: fixed;
  text-decoration: none;
  transition:
    background-color 180ms ease,
    height 180ms ease,
    opacity 180ms ease,
    transform 180ms ease,
    width 180ms ease;
  width: 4.25rem;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  z-index: 2147482990;
}

.wm-wp-push-pwa-app-bell[hidden] {
  display: none !important;
}

.wm-wp-push-pwa-app-bell svg {
  fill: currentColor;
  height: 52%;
  width: 52%;
}

.wm-wp-push-pwa-app-bell[data-wm-push-active="true"] {
  animation: none;
  background: var(--wm-push-bell-active);
  box-shadow: 0 0.45rem 1.25rem
    color-mix(in srgb, var(--wm-push-bell-active) 24%, transparent);
  height: 3rem;
  opacity: 0.58;
  width: 3rem;
}

@media (display-mode: standalone) {
  [data-wm-pwa-install-action] {
    display: none !important;
  }
}

.wm-wp-push-pwa-app-bell:hover,
.wm-wp-push-pwa-app-bell:focus-visible {
  opacity: 1;
  transform: scale(1.06);
}

.wm-wp-push-pwa-app-bell:focus-visible {
  outline: 0.2rem solid var(--wm-push-bell-primary);
  outline-offset: 0.2rem;
}

@keyframes wm-wp-push-pwa-bell-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0
      color-mix(in srgb, var(--wm-push-bell-primary) 36%, transparent);
    transform: scale(1);
  }

  50% {
    box-shadow: 0 0 0 0.65rem
      color-mix(in srgb, var(--wm-push-bell-primary) 0%, transparent);
    transform: scale(1.07);
  }
}

@container (max-width: 34rem) {
  .wm-wp-push-pwa-control__hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .wm-wp-push-pwa-control__hero-icon {
    height: 3rem;
    width: 3rem;
  }

  .wm-wp-push-pwa-progress {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  .wm-wp-push-pwa-progress li {
    align-items: flex-start;
    flex-direction: row;
    font-size: 0.82rem;
    gap: 0.4rem;
  }

  .wm-wp-push-pwa-progress li:not(:last-child)::after {
    inset-inline: 1rem auto;
    top: 2rem;
    width: 1px;
    height: 1rem;
  }

  .wm-wp-push-pwa-control__actions,
  .wm-wp-push-pwa-button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wm-wp-push-pwa-control *,
  .wm-wp-push-pwa-control *::before,
  .wm-wp-push-pwa-control *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  .wm-wp-push-pwa-share-arrow.is-pulsing,
  .wm-wp-push-pwa-button__spinner,
  .wm-wp-push-pwa-app-bell {
    animation: none !important;
  }
}
.wm-wp-push-pwa-channels{border:1px solid var(--wm-push-ui-border);border-radius:.75rem;display:grid;gap:.65rem;margin:1rem 0;padding:1rem}.wm-wp-push-pwa-channels[hidden]{display:none}.wm-wp-push-pwa-channels label{align-items:center;display:flex;gap:.55rem}.wm-wp-push-pwa-channels legend{font-weight:700;padding:0 .35rem}

.wm-wp-push-pwa-channels { min-inline-size: 0; max-inline-size: 100%; }
.wm-wp-push-pwa-channels legend { max-inline-size: 100%; overflow-wrap: anywhere; }
.wm-wp-push-pwa-channels label { min-inline-size: 0; }
.wm-wp-push-pwa-button { min-inline-size: 0; max-inline-size: 100%; white-space: normal; }

.wm-wp-push-pwa-control[data-wm-push-activation-context="calendar"][data-wm-push-mode="granted"] .wm-wp-push-pwa-control__status,
.wm-wp-push-pwa-control[data-wm-push-activation-context="calendar"][data-wm-push-mode="granted"] .wm-wp-push-pwa-progress {
  display: none;
}

.wm-wp-push-pwa-control [data-wm-push-state="worker-update"] p + p {
  margin-block-start: 0.5rem;
}

/* Status copy is plain text; retain operator-authored paragraphs safely. */
.wm-wp-push-pwa-status { overflow-wrap: anywhere; }
.wm-wp-push-pwa-status [data-wm-push-status-text],
.wm-wp-push-pwa-status-copy { white-space: pre-line; overflow-wrap: anywhere; }
.wm-wp-push-pwa-status [hidden],
.wm-wp-push-pwa-status[hidden] { display: none !important; }
