/* Boczny skrót jest przeznaczony dla telefonów. */
.guestbook-shortcut { display: none; }

@media screen and (any-pointer: coarse) and (max-width: 960px) {
  .guestbook-shortcut {
    position: fixed;
    z-index: 25;
    top: calc(clamp(180px, 50vh, calc(100vh - 140px)) + var(--guestbook-shortcut-offset, 0px));
    right: 0;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid rgba(45, 108, 98, .23);
    border-right: 0;
    border-radius: 15px 0 0 15px;
    background: radial-gradient(circle at 20px 0, rgba(255, 207, 174, .48), transparent 42px), linear-gradient(115deg, #e2f2eb, #fffaf1 60%, #ffe9df);
    box-shadow: 0 6px 18px rgba(24, 40, 43, .18);
    color: #245c53;
    font-family: ui-rounded, "Avenir Next", Avenir, "Nunito Sans", system-ui, sans-serif;
  }

  .guestbook-shortcut__toggle {
    position: relative;
    display: grid;
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: inherit;
    cursor: pointer;
    transform: none;
    -webkit-tap-highlight-color: transparent;
  }
  .guestbook-shortcut__toggle:hover,
  .guestbook-shortcut__toggle:focus-visible { transform: none; box-shadow: none; }
  .guestbook-shortcut__toggle:focus-visible { outline: 2px solid #ed704d; outline-offset: -4px; }
  .guestbook-shortcut__toggle svg { display: block; width: 23px; height: 23px; }
  .guestbook-shortcut__toggle svg * { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .guestbook-shortcut__toggle svg .guestbook-shortcut__heart { fill: var(--orange, #ed704d); stroke: none; }
  .guestbook-shortcut__toggle svg {
    transform-origin: center;
    animation: guestbook-envelope-open 2.8s ease-in-out infinite alternate;
  }
  .guestbook-shortcut__toggle svg .guestbook-shortcut__heart {
    transform-box: fill-box;
    transform-origin: center;
    animation: guestbook-envelope-heart-open 1.4s ease-in-out infinite alternate;
  }
  .guestbook-shortcut__toggle::before,
  .guestbook-shortcut__toggle::after {
    position: absolute;
    z-index: 1;
    top: 13px;
    left: 26px;
    color: var(--orange, #ed704d);
    content: '♥';
    font-size: 7px;
    line-height: 1;
    opacity: 0;
    pointer-events: none;
    text-shadow: 0 1px 2px rgba(24, 40, 43, .18);
    animation: guestbook-envelope-hearts-open 3.4s ease-in-out infinite;
  }
  .guestbook-shortcut__toggle::after { left: 16px; animation-delay: .28s; }
  @keyframes guestbook-envelope-greeting {
    0%, 59%, 100% { transform: translateY(1px) rotate(0) scale(1); filter: drop-shadow(0 0 0 transparent); }
    66% { transform: translateY(-3px) rotate(-7deg) scale(1.09); filter: drop-shadow(0 4px 3px rgba(36, 92, 83, .24)); }
    73% { transform: translateY(-5px) rotate(6deg) scale(1.13); filter: drop-shadow(0 6px 5px rgba(36, 92, 83, .28)); }
    80% { transform: translateY(-2px) rotate(-4deg) scale(1.06); filter: drop-shadow(0 3px 3px rgba(36, 92, 83, .19)); }
    87% { transform: translateY(1px) rotate(0) scale(1); filter: drop-shadow(0 0 0 transparent); }
  }
  @keyframes guestbook-envelope-heart {
    0%, 64%, 100% { transform: scale(1); opacity: 1; }
    70% { transform: scale(1.28); opacity: .82; }
    77% { transform: scale(.94); opacity: 1; }
    83% { transform: scale(1.16); opacity: .9; }
    89% { transform: scale(1); opacity: 1; }
  }
  @keyframes guestbook-envelope-hearts {
    0%, 63%, 100% { opacity: 0; transform: translate(0, 3px) scale(.45); }
    68% { opacity: .95; transform: translate(2px, -2px) scale(1); }
    78% { opacity: .72; transform: translate(5px, -12px) scale(.78); }
    87% { opacity: 0; transform: translate(7px, -17px) scale(.55); }
  }

  .guestbook-shortcut__link {
    display: block;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    color: inherit;
    font-size: .82rem;
    font-weight: 850;
    line-height: 46px;
    text-decoration: none;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: max-width .3s ease, padding .3s ease, opacity .2s ease, visibility .3s;
  }
  .guestbook-shortcut.is-open .guestbook-shortcut__link {
    max-width: 180px;
    padding-right: 18px;
    opacity: 1;
    visibility: visible;
  }
  /* Ten sam spokojny ruch pozostaje aktywny także po rozwinięciu skrótu. */
  .guestbook-shortcut.is-open .guestbook-shortcut__toggle svg {
    animation: guestbook-envelope-expanded 1.55s ease-in-out infinite alternate;
  }
  .guestbook-shortcut.is-open .guestbook-shortcut__toggle svg .guestbook-shortcut__heart {
    animation: guestbook-envelope-heart-open .78s ease-in-out infinite alternate;
  }
  .guestbook-shortcut.is-open .guestbook-shortcut__toggle::before,
  .guestbook-shortcut.is-open .guestbook-shortcut__toggle::after {
    animation: guestbook-envelope-hearts-open 1.75s ease-in-out infinite;
  }
  .guestbook-shortcut.is-open .guestbook-shortcut__toggle::after { animation-delay: .28s; }
  @keyframes guestbook-envelope-open {
    from { transform: translateY(2px) rotate(-2.4deg) scale(.98); }
    to { transform: translateY(-4px) rotate(2.4deg) scale(1.07); }
  }
  @keyframes guestbook-envelope-expanded {
    from { transform: translateY(3px) rotate(-4deg) scale(.96); }
    to { transform: translateY(-6px) rotate(4deg) scale(1.13); }
  }
  @keyframes guestbook-envelope-heart-open {
    from { transform: scale(.94); opacity: .78; }
    to { transform: scale(1.12); opacity: 1; }
  }
  @keyframes guestbook-envelope-hearts-open {
    0%, 100% { opacity: 0; transform: translate(0, 4px) scale(.4); }
    28% { opacity: .8; transform: translate(2px, -2px) scale(.9); }
    72% { opacity: .45; transform: translate(5px, -15px) scale(.66); }
  }
  .guestbook-shortcut__link:focus-visible { outline: 2px solid #ed704d; outline-offset: -4px; }

  body.is-night .guestbook-shortcut {
    border-color: rgba(184, 229, 217, .27);
    background: radial-gradient(circle at 20px 0, rgba(153, 205, 195, .18), transparent 42px), linear-gradient(115deg, #34516a, #20324e 64%, #34415d);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
    color: #c4ebe0;
  }
  body.is-halloween .guestbook-shortcut,
  body.guestbook-shortcut-halloween .guestbook-shortcut {
    border-color: rgba(255, 190, 110, .4);
    background: radial-gradient(circle at 20px 0, rgba(255, 179, 97, .2), transparent 42px), linear-gradient(115deg, #59365b, #382044 64%, #4b284b);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
    color: #ffcf85;
  }
}

@media print { .guestbook-shortcut { display: none !important; } }
@media (prefers-reduced-motion: reduce) {
  .guestbook-shortcut__link { transition: none; }
  .guestbook-shortcut__toggle svg, .guestbook-shortcut__toggle svg .guestbook-shortcut__heart, .guestbook-shortcut__toggle::before, .guestbook-shortcut__toggle::after { animation: none; }
}