#wyn-companion {
    bottom: 4rem;
    height: 104px;
    position: fixed;
    left: 1rem;
    width: 96px;
    z-index: 10;
}

#wyn-companion #pet {
  display: block;
  height: 104px;
  image-rendering: auto;
  width: 96px;
}

#wyn-companion[data-wyn-egg="true"]:not([data-wyn-hatched="true"]) #pet {
  cursor: pointer;
  touch-action: manipulation;
}

.wyn-pwa-splash {
  align-items: center;
  background: #f5ebff;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  inset: 0;
  justify-content: center;
  padding: 1.5rem;
  position: fixed;
  z-index: 10000;
}

.wyn-pwa-splash[hidden] {
  display: none;
}

.wyn-pwa-splash__logo {
  display: block;
  height: auto;
  margin: 0;
  max-width: min(12rem, 60vw);
  width: 100%;
}

.wyn-pwa-splash #wyn-companion {
  bottom: auto;
  height: 104px;
  left: auto;
  position: relative;
  width: 96px;
  z-index: auto;
}

.wyn-age-popover {
  background: Canvas;
  border: 1px solid currentColor;
  bottom: calc(100% + 0.5rem);
  box-shadow: 0 3px 12px color-mix(in srgb, CanvasText 18%, transparent);
  color: CanvasText;
  left: 0;
  max-width: min(15rem, calc(100vw - 2rem));
  padding: 0.45rem 0.6rem;
  pointer-events: auto;
  position: absolute;
  width: max-content;
}

.wyn-age-popover[hidden] {
  display: none;
}

.wyn-age-popover p {
  margin: 0;
}

.wyn-age-popover__friendly {
  font-weight: 700;
  white-space: pre-line;
}

.wyn-age-popover__precise {
  font-size: 0.85em;
  margin-top: 0.15rem;
}