/* Gallery-to-scene continuity. Native view transitions are a progressive enhancement. */
::view-transition-group(celebration-art){animation-duration:760ms;animation-timing-function:cubic-bezier(.22,.7,.22,1)}
::view-transition-group(celebration-title){animation-duration:760ms;animation-timing-function:cubic-bezier(.22,.7,.22,1);z-index:2}
::view-transition-old(celebration-art),::view-transition-new(celebration-art){height:100%;object-fit:cover;mix-blend-mode:normal;animation-duration:600ms}
::view-transition-old(celebration-title),::view-transition-new(celebration-title){height:100%;mix-blend-mode:normal;animation-duration:430ms}
::view-transition-image-pair(celebration-art){overflow:hidden;border-radius:2px}
/* The seven quiet chapter controls remain within the sticky artwork. */
.moment-chapters{position:absolute;right:6vw;top:28px;display:flex;align-items:center;gap:20px;pointer-events:auto;color:var(--moment-ink)}
.chapter-caption{font-size:7px;letter-spacing:.18em;opacity:.65}
.chapter-links{display:flex;align-items:center;gap:4px}
.chapter-link{display:grid;place-content:center;position:relative;width:44px;height:44px;border-radius:50%;background:color-mix(in srgb,var(--moment-bg) 24%,transparent);backdrop-filter:blur(10px);font-size:10px;line-height:1;color:var(--moment-ink);transition:background .25s,transform .25s}
.chapter-link:before{content:'';position:absolute;inset:4px;border:1px solid color-mix(in srgb,var(--moment-ink) 22%,transparent);border-radius:50%;transition:border-color .25s}
.chapter-link:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--moment-bg) 60%,transparent)}
.chapter-link:hover:before,.chapter-link:focus-visible:before{border-color:var(--moment-accent)}
.chapter-link.current{color:var(--moment-accent);font-weight:600;background:color-mix(in srgb,var(--moment-bg) 65%,transparent)}
.chapter-link.current:before{border-color:color-mix(in srgb,var(--moment-accent) 40%,transparent)}
.chapter-link svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--moment-accent);stroke-width:1;transform:rotate(-90deg);pointer-events:none;opacity:0}
.chapter-link.current svg{opacity:1}
.chapter-link circle{stroke-dasharray:119.381;stroke-dashoffset:calc(119.381px * (1 - var(--p)));stroke-linecap:round}
.is-still .chapter-link.current circle{stroke-dashoffset:0}
.chapter-name{position:absolute;top:calc(100% + 9px);right:0;white-space:nowrap;font-size:9px;line-height:1.4;background:var(--moment-bg);color:var(--moment-ink);border:1px solid color-mix(in srgb,var(--moment-ink) 17%,transparent);padding:9px 12px;border-radius:2px;opacity:0;transform:translateY(-3px);transition:opacity .2s,transform .2s;pointer-events:none;z-index:2}
.chapter-link:hover .chapter-name,.chapter-link:focus-visible .chapter-name{opacity:1;transform:none}
/* A small, playable piece of original linework. The quiz is always directly available. */
.weave-card{width:100%;max-width:430px;margin:0 auto;position:relative;color:#e6ead9;padding:0 5px}
.weave-surface{--weave-x:0px;--weave-y:0px;aspect-ratio:1;position:relative;isolation:isolate;border-radius:50%;background:radial-gradient(ellipse at 50% 45%,#6273512b,transparent 68%);overflow:hidden}
.weave-surface:before{content:'';position:absolute;inset:6%;border:1px solid #a7b59625;border-radius:50%;transform:translate(calc(var(--weave-x)*-.3),calc(var(--weave-y)*-.3))}
.weave-surface:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 30% 15%,#cbd2b20a,transparent 55%)}
.weave-drawing{width:100%;height:100%;position:relative;transform:translate(var(--weave-x),var(--weave-y));transition:transform .5s cubic-bezier(.2,.7,.3,1);overflow:visible}
.weave-dots{fill:#d1d8b5;opacity:.42}
.weave-thread{fill:none;stroke-linecap:round;stroke-linejoin:round}
.weave-thread path{stroke-dashoffset:0}
.weave-under{stroke:#20382d;stroke-width:5}
.weave-line{stroke:#c7d0ab;stroke-width:1.85}
.weave-thread.second .weave-under{stroke:#20382d;stroke-width:4.5}
.weave-thread.second .weave-line{stroke:#c5a99c;stroke-width:1.6}
.weave-edge{position:absolute;left:calc(50% - 2px);top:7%;width:4px;height:4px;border-radius:50%;background:#b3c095;opacity:.6}
.weave-edge.edge-two{top:auto;bottom:7%}
.weave-card figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #bac6a52e;padding:20px 10px 0;margin:0 25px}
.weave-card .eyebrow{display:block;font-size:7px;letter-spacing:.18em;color:#aebd9e}
.weave-title{font-family:Georgia,serif;font-size:40px;font-style:italic;letter-spacing:-.06em;display:block;margin-top:8px;line-height:1}
.weave-again{background:transparent;color:#d1dbc3;display:flex;align-items:center;gap:16px;padding:12px 0;font-size:10px;min-height:44px;white-space:nowrap}
.weave-again span{width:29px;height:29px;border:1px solid #a9b89765;border-radius:50%;display:grid;place-content:center;font-size:17px;transition:transform .6s,background .3s}
.weave-again:hover span{transform:rotate(90deg);background:#aeb99622}
.weave-again:focus-visible{outline-color:#d6c6a8}
@media(max-width:1000px){.moment-chapters{right:6vw}.chapter-caption{display:none}.weave-card{max-width:360px}.weave-card figcaption{margin:0 10px}.weave-title{font-size:35px}}
@media(max-width:760px){
  .moment-chapters{top:22px;left:calc(7vw - 4px);right:auto;gap:0}.chapter-links{gap:5px}.chapter-link{width:44px;height:44px;font-size:9px}.chapter-name{font-size:9px;right:auto;left:0}.chapter-link:nth-last-child(-n+2) .chapter-name{left:auto;right:0}
  .weave-card{max-width:350px;margin:8px auto 0}.weave-card figcaption{margin:0 18px;padding-top:18px}.weave-title{font-size:36px}.weave-card .eyebrow{font-size:7px}.weave-again{font-size:10px;gap:10px}.dark-inner:has(.weave-card){gap:20px}
}
@media(max-height:600px) and (min-width:761px){.moment-chapters{top:14px;right:5vw}.chapter-link{width:40px;height:40px}.chapter-caption{display:none}}
@media(prefers-reduced-motion:reduce){
  ::view-transition-group(celebration-art),::view-transition-group(celebration-title),::view-transition-old(celebration-art),::view-transition-new(celebration-art),::view-transition-old(celebration-title),::view-transition-new(celebration-title){animation:none!important}
  .weave-drawing,.weave-again span,.chapter-link,.chapter-name{transition:none}.weave-drawing{transform:none}.chapter-link:hover{transform:none}.weave-again:hover span{transform:none}
}