.crew{--crew-hill-0: color-mix(in oklab, hsl(var(--brand-forest)) 84%, hsl(var(--brand-on-forest)));--crew-hill-1: color-mix(in oklab, hsl(var(--brand-forest)) 74%, hsl(var(--brand-lime)));--crew-hill-2: color-mix(in oklab, hsl(var(--brand-forest)) 58%, hsl(var(--brand-lime)));position:relative;isolation:isolate;display:flex;flex-direction:column;overflow:hidden;background:hsl(var(--brand-forest));color:hsl(var(--brand-on-forest))}.crew-card{height:100%;min-height:560px;border-radius:2rem;padding:1.75rem 1.75rem 0;justify-content:space-between}.crew-band{height:9.5rem;border-radius:1.5rem}.crew-top{display:flex;align-items:center;justify-content:space-between;font-size:.75rem}.crew-count{opacity:.75}.crew-tagline{margin-top:2.25rem;font-family:var(--brand-font-display);font-weight:700;font-size:clamp(2.25rem,1.4rem + 1.8vw,3.25rem);line-height:1;letter-spacing:-.045em}.crew-scene{position:relative;z-index:1;pointer-events:none;margin-inline:-1.75rem;aspect-ratio:560 / 440;flex-shrink:0}.crew-sky{position:relative;flex:1;min-height:6rem}.crew-sky li{position:absolute;height:2.25rem;padding-inline:1rem;font-size:.875rem;font-weight:600;animation:crew-chip .56s cubic-bezier(.34,1.56,.64,1) both;animation-delay:calc(1.1s + var(--sky-i) * .12s)}.crew-sky li:nth-child(1){left:6%;top:30%;rotate:-5deg}.crew-sky li:nth-child(2){right:4%;top:6%;rotate:6deg}.crew-sky li:nth-child(3){left:42%;top:72%;rotate:-3deg}@keyframes crew-chip{0%{opacity:0;transform:translateY(14px) scale(.8)}to{opacity:1;transform:none}}.crew-band .crew-scene{margin:0;aspect-ratio:auto;height:100%}.crew-row{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.crew-hill{position:absolute;left:-2%;width:104%;bottom:0;height:auto;pointer-events:none}.crew-hill path{stroke:none}.crew-hill-0 path{fill:var(--crew-hill-0)}.crew-hill-1 path{fill:var(--crew-hill-1)}.crew-hill-2 path{fill:var(--crew-hill-2)}.crew-member{position:absolute;transform:translate(-50%);pointer-events:auto;cursor:pointer;transition:transform .42s var(--brand-ease);transform-origin:50% 100%}.crew-member>.crew-pop{margin-bottom:-6%}.crew-pop{animation:crew-pop .72s cubic-bezier(.34,1.56,.64,1) both;animation-delay:calc(.14s + var(--crew-i, 0) * 90ms)}@keyframes crew-pop{0%{transform:translateY(115%)}to{transform:translateY(0)}}.crew-member.is-leaning{transform:translate(-50%) rotate(-5deg)}.crew-member.is-ducking{transform:translate(-50%) translateY(26%) rotate(4deg)}.crew-member.is-peeking{transform:translate(-50%) translateY(10%) rotate(-12deg)}.crew-name{position:absolute;left:50%;bottom:calc(100% + .35rem);translate:-50% 6px;white-space:nowrap;padding:.2rem .6rem;border-radius:999px;background:hsl(var(--brand-canvas));color:hsl(var(--brand-ink));font-size:.6875rem;font-weight:700;opacity:0;transition:opacity .16s ease-out,translate .16s ease-out;pointer-events:none}.crew-member:hover .crew-name{opacity:1;translate:-50% 0}.crew-bubble{position:absolute;right:96%;bottom:74.5%;width:-moz-max-content;width:max-content;white-space:nowrap;padding:.5rem .85rem;border-radius:1.1rem 1.1rem .25rem;background:hsl(var(--brand-tone-lavender));color:hsl(var(--brand-tone-lavender-ink));font-family:var(--brand-font-display);font-size:.9375rem;font-weight:600;line-height:1.2;rotate:-3deg;pointer-events:none;animation:crew-bubble .42s cubic-bezier(.34,1.56,.64,1) both;animation-delay:.7s}.crew[data-mood]:not([data-mood=idle]) .crew-bubble{animation-delay:0ms}.crew[data-mood=password] .crew-bubble,.crew[data-mood=peek] .crew-bubble{background:hsl(var(--brand-tone-peach));color:hsl(var(--brand-tone-peach-ink))}.crew[data-mood=success] .crew-bubble{background:hsl(var(--brand-lime));color:hsl(var(--brand-tone-lime-ink))}@keyframes crew-bubble{0%{opacity:0;transform:scale(.6) translateY(8px);transform-origin:100% 100%}to{opacity:1;transform:none}}.crew-band .crew-bubble{left:96%;right:auto;bottom:62%;border-radius:1.1rem 1.1rem 1.1rem .25rem;rotate:3deg;font-size:.8125rem;padding:.45rem .7rem;max-width:9rem}@media (prefers-reduced-motion: reduce){.crew-pop,.crew-bubble,.crew-sky li{animation:none}.crew-member{transition:none}}.crew-card>.crew-top,.crew-card>.crew-tagline{position:relative;z-index:2}.crew-card .crew-sky{flex:1}.bubble-field{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.crew-card>.crew-scene{margin-top:auto}.bubble{position:absolute;left:0;top:0;cursor:pointer;pointer-events:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;opacity:0;will-change:transform}.bubble-face{display:inline-flex;height:2.4rem;padding-inline:1.05rem;font-size:.875rem;font-weight:700;white-space:nowrap;box-shadow:0 6px 14px #060e0c38,inset 0 -3px #0000000f;transition:scale .2s cubic-bezier(.34,1.56,.64,1),opacity .18s ease-out}.bubble.is-held .bubble-face{scale:1.08}.bubble:active .bubble-face{scale:.94}.bubble.is-popping{pointer-events:none}.bubble.is-popping .bubble-face{scale:1.4;opacity:0}.bubble-field[data-done=true] .bubble{cursor:default}.bubble-field[data-done=true] .bubble-face{scale:1;opacity:.75}.bubble-burst{position:absolute;width:0;height:0;pointer-events:none}.bubble-burst i{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:hsl(var(--brand-tone));animation:bubble-shard .56s cubic-bezier(.2,.7,.3,1) both}@keyframes bubble-shard{0%{transform:rotate(var(--a)) translate(6px) scale(1);opacity:1}to{transform:rotate(var(--a)) translate(46px) scale(.3);opacity:0}}.bubble-burst b{position:absolute;left:0;top:0;translate:-50% -50%;font-family:var(--brand-font-display);font-size:1.15rem;color:hsl(var(--brand-lime));animation:bubble-plus .7s ease-out both}@keyframes bubble-plus{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-34px)}}.bubble-score{position:absolute;top:1.75rem;right:1.75rem;z-index:3;display:inline-flex;align-items:center;height:1.75rem;padding:0 .75rem;border-radius:999px;background:hsl(var(--brand-on-forest) / .1);font-size:.75rem;font-weight:600;font-variant-numeric:tabular-nums;transition:background-color .3s,color .3s}.bubble-score[data-done=true]{background:hsl(var(--brand-lime));color:hsl(var(--brand-tone-lime-ink))}
