.birthday-opening{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#080808;color:#f8eee2;transition:opacity .9s ease,visibility .9s;isolation:isolate}.birthday-opening.is-leaving{opacity:0;visibility:hidden;pointer-events:none}.opening-centre{z-index:2;text-align:center;width:min(92%,800px);padding:45px 12px;background:radial-gradient(ellipse,#080808 43%,#080808f5 62%,#08080800 74%)}.opening-date{font:9px Arial;letter-spacing:.35em;color:#bda998;margin:0 0 23px}.opening-title{font:400 clamp(38px,6vw,78px)/1.13 Georgia;letter-spacing:-.04em;margin:0;color:#fff3e6;text-wrap:balance}.opening-title em{display:block;font-weight:400;font-size:1.5em;color:#e7b9b1}.opening-start{margin:32px 0 0;padding:14px 27px;border:1px solid #b18b7c7a;border-radius:30px;color:#f3d7c7;background:#201613;font:italic 15px Georgia;transition:opacity .3s,background .3s}.opening-start:hover{background:#34221d}.opening-start:focus-visible,.opening-skip:focus-visible{outline:2px solid #f5d3b9;outline-offset:5px}.opening-help{font:10px/1.6 Arial;color:#a39388;margin:13px 0 0}.opening-skip{position:absolute;bottom:28px;right:30px;z-index:5;background:transparent;border:0;color:#baa89a;font:11px Arial;padding:12px}.opening-heart{width:65px;height:60px;display:block;margin:25px auto 0;fill:none;stroke:#c98f92;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.opening-heart path{stroke-dasharray:100;stroke-dashoffset:100}.opening-words{position:absolute;inset:4% 3%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(8,1fr);align-items:center;gap:6px 18px;pointer-events:none;z-index:0}.opening-word{display:block;text-align:center;font:italic clamp(12px,1.6vw,25px)/1.2 Georgia;color:#b29486;opacity:0;transform:translateY(12px) rotate(var(--word-angle));white-space:nowrap}.opening-word:nth-child(3n){color:#b77d85}.opening-word:nth-child(4n){font-style:normal;color:#e8cdb8}.opening-word.is-space{visibility:hidden}.birthday-opening.is-running .opening-word{animation:word-appear .85s var(--word-delay) ease both}.birthday-opening.is-running .opening-heart path{animation:ink-draw 1.5s 2.8s ease forwards}.birthday-opening.is-running .opening-start,.birthday-opening.is-running .opening-help{visibility:hidden;opacity:0}.birthday-opening.is-running .opening-centre{animation:opening-breathe 5.1s ease both}.birthday-opening.is-running .opening-title{animation:opening-title-in 1s ease both}.opening-active{overflow:hidden}.opening-complete .bookshop-intro{animation:site-uncover 1s ease both}.opening-complete .memory-book{animation:book-uncover 1.15s calc(var(--book-index)*65ms) cubic-bezier(.2,.7,.2,1) both}
.opening-cue{position:absolute;z-index:3;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 8%;margin:0;background:#080808;font:italic clamp(25px,3.7vw,54px)/1.5 Georgia;color:#f1cfc5;opacity:0;visibility:hidden;transition:opacity .65s ease,visibility .65s;pointer-events:none;text-wrap:balance}.show-cue .opening-cue{opacity:1;visibility:visible}.show-cue .opening-words{opacity:0;transition:opacity .5s}.show-cue .opening-centre{visibility:hidden}
@keyframes word-appear{to{opacity:.7;transform:translateY(0) rotate(var(--word-angle))}}@keyframes ink-draw{to{stroke-dashoffset:0}}@keyframes opening-breathe{0%{scale:.97}100%{scale:1.025}}@keyframes opening-title-in{from{opacity:.3;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes site-uncover{from{opacity:0;filter:blur(4px)}to{opacity:1;filter:blur(0)}}@keyframes book-uncover{from{opacity:0;translate:0 32px}to{opacity:1;translate:0 0}}

.opening-seen .birthday-opening:not(.replaying){display:none}.birthday-opening[hidden]{display:none!important}.opening-active main,.opening-active header,.opening-active footer,.opening-active .music-player{visibility:hidden}.birthday-opening.is-running .opening-centre{animation:none}.opening-replay{border:0;background:none;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:4px;padding:0}@media(max-width:600px){.opening-words{inset:3% -8%}.opening-word{font-size:11px}.opening-title{font-size:35px}.opening-centre{width:100%;padding:60px 20px}.opening-date{font-size:8px}.opening-skip{right:12px;bottom:18px}}@media(prefers-reduced-motion:reduce){.birthday-opening,.opening-word,.opening-centre,.opening-title,.opening-heart path{animation:none!important;transition:none!important}.birthday-opening.is-running .opening-word{opacity:.5;transform:none}.opening-heart path{stroke-dashoffset:0}}