@charset "UTF-8";

/* A very light, page-wide petal veil. It sits above the atmosphere and behind
   the reading surface, so it never crosses text or photographs. */
#ambient-veil { position: fixed; z-index: 0; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .76; }
main, .site-footer { position: relative; z-index: 1; }

/* A soft finale: the closing section gets its own quiet fireworks sky. */
.closing { position: relative; isolation: isolate; overflow: hidden; }
#fireworks-canvas { position: absolute; z-index: 0; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
.closing > .icon, .closing > p, .closing > .closing-kicker, .firework-trigger { position: relative; z-index: 1; }
.closing > .back-top { z-index: 2; }
.firework-trigger { display: flex; width: fit-content; align-items: center; justify-content: center; gap: 9px; min-height: 39px; margin: 19px auto 0; padding: 8px 17px; border: 1px solid #ffffffe0; border-radius: 99px; background: #ffffff5e; color: #8f6da3; font-size: 12px; font-weight: 500; letter-spacing: .35px; box-shadow: 0 6px 20px #8b6c9a12, inset 0 1px 0 #fff; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); transition: color .4s, background .4s, box-shadow .5s, transform .6s var(--ease); }
.firework-trigger span { color: #c18cb4; font-family: var(--serif); font-size: 15px; line-height: 1; }
.firework-trigger:hover { color: #6e4e86; background: #ffffffb0; box-shadow: 0 10px 26px #8b6c9a1c, inset 0 1px 0 #fff; transform: translateY(-2px); }

@media (max-width: 700px) {
  #ambient-veil { opacity: .58; }
  .firework-trigger { min-height: 37px; margin-top: 16px; padding-inline: 14px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  #ambient-veil { display: none; }
  .firework-trigger { transition: none; }
}