/* The portrait looks unchanged until someone knows the little secret. */
.portrait-surprise {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 22px;
  background: none;
  color: inherit;
  line-height: 0;
  cursor: default;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  -webkit-user-select: none;
}
.portrait-surprise:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
.portrait-surprise img { display: block; -webkit-user-drag: none; }
.cake-shower {
  position: fixed;
  inset: 0;
  z-index: 1000;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}
.cake-shower .falling-cake {
  position: absolute;
  top: 0;
  left: 0;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  will-change: transform;
}
.cake-shower--still { animation: cake-still 1.5s ease both; }
.cake-shower--still .falling-cake { will-change: auto; }
.cake-announcement {
  position: fixed;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@keyframes cake-still {
  0%, 100% { opacity: 0; }
  20%, 75% { opacity: 1; }
}