.family-intro{display:none;position:fixed;inset:0;z-index:10;place-items:center;overflow:hidden;background:#f5e9dd;pointer-events:none}
.family-opening{position:relative;width:min(360px,82vw);aspect-ratio:9/7;isolation:isolate}
.family-arch{position:absolute;inset:0;width:100%;height:100%;z-index:2}.family-arch path{stroke:#b99d84;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.family-surface{position:absolute;inset:20px 50px 16px;border-radius:140px 140px 20px 20px;background:#fff8f3;opacity:0;transform:scale(.92)}
.family-name{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.22em;color:#493b43;font-size:clamp(29px,8vw,39px);font-weight:750;letter-spacing:-1.4px;opacity:0;transform:translateY(5px)}.family-name span{font-weight:400}
.family-light{position:absolute;width:min(760px,130vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff8f3b3 0%,#fff8f340 45%,transparent 70%);opacity:0}
.family-halo{position:absolute;width:min(480px,105vw);aspect-ratio:1;border:1px solid #d9bfa52b;border-radius:50%;opacity:0}
.family-intro-playing .family-intro{display:grid;animation:family-finish .55s ease 3.6s forwards}
.family-intro-playing .family-light{animation:family-light-in 3.8s ease both}.family-intro-playing .family-halo{animation:family-halo-in 3.4s ease both}
.family-intro-playing .family-arch path{animation:family-draw 1.4s ease .1s forwards,family-line-away .7s ease 2.8s forwards}
.family-intro-playing .family-surface{animation:family-surface-in 1s ease .7s forwards,family-open 1.2s cubic-bezier(.4,0,.2,1) 2.7s forwards}
.family-intro-playing .family-name{animation:family-name-in 1s ease 1.15s forwards,family-name-away .55s ease 3.1s forwards}
.signin:focus-within .family-intro{display:none}
@keyframes family-draw{to{stroke-dashoffset:0}}@keyframes family-line-away{to{opacity:0}}
@keyframes family-surface-in{to{opacity:1;transform:scale(1)}}@keyframes family-open{from{transform:scale(1)}to{transform:scale(18);border-radius:50%}}
@keyframes family-name-in{to{opacity:1;transform:translateY(0)}}@keyframes family-name-away{to{opacity:0}}
@keyframes family-light-in{0%{opacity:0;transform:scale(.92)}40%,80%{opacity:1}100%{opacity:0;transform:scale(1.05)}}
@keyframes family-halo-in{0%,100%{opacity:0}35%,75%{opacity:1}}
@keyframes family-finish{to{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){.family-intro-playing .family-intro{display:none}.family-intro *{animation:none!important;transition:none!important}}