.bb-keychain{--bb-red: #d6404a;--bb-red-deep: #b22a37;--bb-pine: #1f5a45;--bb-pine-soft: #e3f1e9;--bb-cream: #fffaf3;--bb-blush: #fff0ef;--bb-gold: #f4bf4f;--bb-ink: #1d3b30}.product-form__buttons .bb-keychain{width:100%;margin:0 0 1rem}.product-form__buttons .bb-keychain>.bb-keychain__sparkle-wrap{display:block}.bb-keychain__badge{position:relative;display:inline-flex;align-items:center;justify-content:center;max-width:100%;margin:0;padding:1.1rem 1.5rem .8rem;border:2px solid rgba(255,255,255,.55);border-radius:var(--buttons-radius-outset, 999px);background:linear-gradient(135deg,var(--bb-red) 0%,var(--bb-red-deep) 100%);color:#fff;font:inherit;font-size:1.4rem;font-weight:700;line-height:1.3;text-align:left;cursor:pointer;box-shadow:0 0 0 1px var(--bb-red-deep),0 8px 18px #b22a3747;overflow:hidden;isolation:isolate;transition:transform .16s ease,box-shadow .16s ease}.product-form__buttons .bb-keychain__badge{width:100%;min-height:calc(4.5rem + var(--buttons-border-width, 1px) * 2);font-size:1.5rem;text-align:center}.bb-keychain__badge:before,.bb-keychain__confirm.button:not(:disabled):after{content:"";position:absolute;top:0;right:0;bottom:auto;left:0;z-index:1;height:1rem;border-radius:0;box-shadow:none;pointer-events:none;background:linear-gradient(#fff,#fff) top / 100% 3px no-repeat,radial-gradient(circle at 50% 0,#fff 0 6px,transparent 6.5px) 0 0 / 14px 9px repeat-x;filter:drop-shadow(0 1px 1px rgba(120,20,30,.25))}.bb-keychain__badge:after,.bb-keychain__confirm.button:not(:disabled):before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;border-radius:inherit;box-shadow:none;pointer-events:none;background-image:radial-gradient(circle at 20% 30%,rgba(255,255,255,.9) 0 1.3px,transparent 2px),radial-gradient(circle at 70% 60%,rgba(255,255,255,.7) 0 1px,transparent 1.7px),radial-gradient(circle at 45% 80%,rgba(255,255,255,.8) 0 1.6px,transparent 2.3px);background-size:40px 40px,56px 56px,70px 70px;animation:bb-keychain-flurry 7s linear infinite}.bb-keychain__sparkle-wrap{position:relative;display:inline-block;max-width:100%}.bb-keychain__sparkle-wrap--cta{display:block;flex-shrink:0}.bb-keychain__sparkles{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none}.bb-keychain__sparkles i{position:absolute;color:var(--bb-gold);font-size:var(--s, 1.3rem);font-style:normal;line-height:1;text-shadow:0 0 6px rgba(244,191,79,.8);opacity:0;animation:bb-keychain-sparkle 2.6s ease-in-out var(--w, 0s) infinite}.bb-keychain__sparkles i:nth-child(1){top:-.7rem;left:8%;--s: 1.4rem;--w: 0s}.bb-keychain__sparkles i:nth-child(2){top:-.9rem;right:16%;--s: 1.1rem;--w: .5s;color:#fff;text-shadow:0 0 6px rgba(214,64,74,.9)}.bb-keychain__sparkles i:nth-child(3){bottom:-.8rem;right:6%;--s: 1.5rem;--w: 1.1s}.bb-keychain__sparkles i:nth-child(4){bottom:-.9rem;left:28%;--s: 1rem;--w: 1.6s;color:var(--bb-red);text-shadow:0 0 6px rgba(255,255,255,.9)}.bb-keychain__sparkles i:nth-child(5){top:30%;right:-1rem;--s: 1.2rem;--w: 2.1s}.bb-keychain__confirm.button:disabled~.bb-keychain__sparkles{display:none}.bb-keychain__sparkle-wrap--cta.is-celebrating .bb-keychain__confirm.button~.bb-keychain__sparkles{display:block}.bb-keychain__sparkle-wrap--cta.is-celebrating .bb-keychain__sparkles i{animation:bb-keychain-burst .65s ease-out forwards}.bb-keychain__badge:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--bb-red-deep),0 12px 22px #b22a3757}.bb-keychain__badge:focus-visible{outline:2px solid var(--bb-pine);outline-offset:3px}.bb-keychain__dialog[open]{display:flex;flex-direction:column}.bb-keychain__dialog{width:min(34rem,calc(100vw - 2rem));max-width:calc(100vw - 2rem);max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem);padding:0;border:0;border-radius:2.4rem;background:var(--bb-cream);color:var(--bb-ink);overflow:hidden;box-shadow:0 24px 60px #1d3b3047}.bb-keychain__dialog::backdrop{background:#1d3b3080;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.bb-keychain__panel{display:flex;flex-direction:column;min-height:0;position:relative;isolation:isolate;padding:3rem 1.6rem 1.6rem;overflow:hidden;max-height:calc(100dvh - 2rem);background:radial-gradient(120% 60% at 50% 0%,var(--bb-blush) 0%,rgba(255,240,239,0) 70%)}.bb-keychain__snow{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.bb-keychain__snow i{position:absolute;top:-2rem;left:var(--x);color:var(--c, rgba(214, 64, 74, .45));font-size:var(--s, 1.4rem);font-style:normal;line-height:1;animation:bb-keychain-fall var(--d, 9s) linear var(--w, 0s) infinite}.bb-keychain__snow i:nth-child(1){--x: 4%;--s: 1.2rem;--d: 9s;--w: -1s}.bb-keychain__snow i:nth-child(2){--x: 14%;--s: 1.8rem;--d: 12s;--w: -6s;--c: rgba(31, 90, 69, .38)}.bb-keychain__snow i:nth-child(3){--x: 24%;--s: 1rem;--d: 8s;--w: -3s}.bb-keychain__snow i:nth-child(4){--x: 33%;--s: 1.5rem;--d: 11s;--w: -8s;--c: rgba(232, 168, 40, .65)}.bb-keychain__snow i:nth-child(5){--x: 42%;--s: 1.1rem;--d: 10s;--w: -2s;--c: rgba(31, 90, 69, .38)}.bb-keychain__snow i:nth-child(6){--x: 51%;--s: 2rem;--d: 13s;--w: -10s}.bb-keychain__snow i:nth-child(7){--x: 60%;--s: 1.2rem;--d: 9s;--w: -5s;--c: rgba(232, 168, 40, .65)}.bb-keychain__snow i:nth-child(8){--x: 69%;--s: 1.6rem;--d: 12s;--w: -4s;--c: rgba(31, 90, 69, .38)}.bb-keychain__snow i:nth-child(9){--x: 77%;--s: 1rem;--d: 8s;--w: -7s}.bb-keychain__snow i:nth-child(10){--x: 85%;--s: 1.4rem;--d: 11s;--w: -1.5s;--c: rgba(232, 168, 40, .65)}.bb-keychain__snow i:nth-child(11){--x: 92%;--s: 1.1rem;--d: 10s;--w: -9s;--c: rgba(31, 90, 69, .38)}.bb-keychain__snow i:nth-child(12){--x: 97%;--s: 1.7rem;--d: 14s;--w: -3.5s}.bb-keychain__lights{position:absolute;top:0;right:0;left:0;height:1.8rem;pointer-events:none;background:linear-gradient(#1d3b3040,#1d3b3040) 0 4px / 100% 1px no-repeat}.bb-keychain__bulbs{position:absolute;top:0;right:0;bottom:0;left:0;background-repeat:repeat-x;background-size:66px 18px;animation:bb-keychain-twinkle 1.8s ease-in-out infinite}.bb-keychain__bulbs--red{background-image:radial-gradient(circle at 50% 60%,var(--bb-red) 0 4px,transparent 5px);background-position:11px 0}.bb-keychain__bulbs--gold{background-image:radial-gradient(circle at 50% 60%,var(--bb-gold) 0 4px,transparent 5px);background-position:33px 0;animation-delay:.6s}.bb-keychain__bulbs--pine{background-image:radial-gradient(circle at 50% 60%,var(--bb-pine) 0 4px,transparent 5px);background-position:55px 0;animation-delay:1.2s}.bb-keychain__tree{display:inline-block;transform-origin:bottom center;animation:bb-keychain-bob 2.4s ease-in-out infinite}.bb-keychain__heart{display:inline-block;margin-left:.25em;font-style:normal;animation:bb-keychain-beat 1.6s ease-in-out infinite}.bb-keychain__close{position:absolute;top:2rem;right:1.2rem;z-index:2;display:grid;place-items:center;width:3.4rem;height:3.4rem;padding:0;border:0;border-radius:50%;background:#fff;color:var(--bb-red);font-size:2.2rem;line-height:1;cursor:pointer;box-shadow:0 2px 8px #1d3b301f;transition:transform .16s ease}.bb-keychain__close:hover{transform:rotate(90deg)}.bb-keychain__eyebrow{align-self:flex-start;margin:0 0 .8rem;padding:.3rem 1rem;border-radius:999px;background:var(--bb-pine-soft);color:var(--bb-pine);font-size:1.2rem;font-weight:700;letter-spacing:.04em;line-height:1.5}.bb-keychain__title{margin:0 3.6rem .4rem 0;color:var(--bb-pine);font-size:2.2rem;line-height:1.15}.bb-keychain__note{margin:0 0 1.4rem;font-size:1.4rem;line-height:1.45}.bb-keychain__note[data-bb-keychain-note=waiting]{flex-shrink:0;margin:0 0 1rem;color:#c62828;font-weight:700}.bb-keychain__options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1.4rem;min-height:0;overflow:auto}.bb-keychain__dialog--pair{width:min(48rem,calc(100vw - 2rem))}.bb-keychain__options--pair{gap:1.2rem;padding-top:.6rem;overflow:visible}.bb-keychain__options--pair .bb-keychain__option{padding:1rem .8rem 1.2rem}.bb-keychain__options--pair .bb-keychain__photo{width:min(100%,22rem);margin-inline:auto}.bb-keychain__options--pair .bb-keychain__photo img{width:100%;max-height:min(22rem,30dvh);height:auto}.bb-keychain__options--pair .bb-keychain__name{font-size:1.5rem}.bb-keychain__option{position:relative;display:flex;flex-direction:column;align-items:center;gap:.7rem;min-width:0;padding:.8rem .6rem 1rem;border:2px solid #f1e4d6;border-radius:2rem;background:#fff;color:inherit;font:inherit;cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.bb-keychain__option:hover{transform:translateY(-2px);box-shadow:0 8px 18px #1d3b3014}.bb-keychain__option[aria-pressed=true]{border-color:var(--bb-red);background:#fff;box-shadow:0 0 0 4px #d6404a24,0 10px 22px #b22a371f}.bb-keychain__option[aria-pressed=true]:after{content:"\1f380  My pick";position:absolute;top:-1rem;right:1rem;padding:.2rem .9rem;border-radius:999px;background:var(--bb-red);color:#fff;font-size:1.1rem;font-weight:700;line-height:1.6;box-shadow:0 4px 10px #b22a3740}.bb-keychain__option:focus-visible{outline:2px solid var(--bb-pine);outline-offset:3px}.bb-keychain__photo{display:block;width:100%;transform-origin:top center}.bb-keychain__photo img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:1.4rem;background:#fff}.bb-keychain__name{color:var(--bb-ink);font-size:1.3rem;font-weight:700;line-height:1.3;text-align:center}.bb-keychain__confirm.button{--color-button: 214, 64, 74;--color-button-text: 255, 255, 255;--alpha-button-background: 1;--buttons-radius: 999px;--buttons-radius-outset: 999px;--border-opacity: 0;flex-shrink:0;width:100%;min-height:4.8rem;border-radius:999px;padding-top:.4rem;background-image:linear-gradient(135deg,var(--bb-red) 0%,var(--bb-red-deep) 100%);font-weight:700;letter-spacing:.02em;box-shadow:0 10px 22px #b22a3747;overflow:hidden;isolation:isolate;animation:bb-keychain-glow 2.4s ease-in-out infinite,bb-keychain-jingle 4s ease-in-out 1s infinite}.bb-keychain__confirm.button:disabled{--color-button: 238, 226, 216;--color-button-text: 125, 98, 86;cursor:default;opacity:1;padding-top:0;background-image:none;box-shadow:none;animation:none}.bb-keychain__confirm.button:disabled:before,.bb-keychain__confirm.button:disabled:after{content:none}.bb-keychain__signoff{margin:1rem 0 0;color:var(--bb-red-deep);font-size:1.3rem;font-style:italic;text-align:center}.bb-keychain__error{margin:.8rem 0 0;color:#8f1d1d;font-size:1.3rem;text-align:center}.bb-keychain__dialog.is-shown{animation:bb-keychain-rise .32s cubic-bezier(.2,.9,.3,1.2)}.bb-keychain__dialog.is-shown::backdrop{animation:bb-keychain-fade .2s ease}.bb-keychain__dialog.is-intro .bb-keychain__photo{animation:bb-keychain-swing .7s ease}.bb-keychain__dialog.is-intro .bb-keychain__option:nth-child(2) .bb-keychain__photo{animation-delay:90ms}.bb-keychain__option[aria-pressed=true] .bb-keychain__photo{animation:bb-keychain-hang 3.2s ease-in-out infinite}.bb-keychain__option.is-claimed .bb-keychain__photo{animation:bb-keychain-pop .42s ease}@keyframes bb-keychain-rise{0%{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}@keyframes bb-keychain-fade{0%{opacity:0}to{opacity:1}}@keyframes bb-keychain-fall{0%{transform:translateZ(0) rotate(0);opacity:0}10%{opacity:1}50%{transform:translate3d(1.2rem,32rem,0) rotate(180deg)}90%{opacity:1}to{transform:translate3d(-.8rem,64rem,0) rotate(360deg);opacity:0}}@keyframes bb-keychain-twinkle{0%,to{opacity:1;filter:brightness(1.15)}50%{opacity:.35;filter:brightness(.9)}}@keyframes bb-keychain-flurry{0%{background-position:0 0,0 0,0 0}to{background-position:40px 280px,-56px 280px,70px 280px}}@keyframes bb-keychain-sparkle{0%,to{opacity:0;transform:scale(.3) rotate(0)}40%{opacity:1;transform:scale(1.15) rotate(45deg)}70%{opacity:.6;transform:scale(.8) rotate(90deg)}}@keyframes bb-keychain-burst{0%{opacity:1;transform:scale(.6) rotate(0)}60%{opacity:1;transform:scale(2.2) rotate(120deg)}to{opacity:0;transform:scale(2.6) rotate(180deg)}}@keyframes bb-keychain-jingle{0%,80%,to{transform:rotate(0)}84%{transform:rotate(-1.5deg)}88%{transform:rotate(1.5deg)}92%{transform:rotate(-1deg)}96%{transform:rotate(.5deg)}}@keyframes bb-keychain-glow{0%,to{box-shadow:0 10px 22px #b22a3742}50%{box-shadow:0 10px 30px #d6404a80,0 0 0 4px #f4bf4f40}}@keyframes bb-keychain-bob{0%,to{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(8deg) translateY(-2px)}}@keyframes bb-keychain-beat{0%,60%,to{transform:scale(1)}20%{transform:scale(1.3)}40%{transform:scale(.95)}}@keyframes bb-keychain-swing{0%{transform:rotate(-7deg)}45%{transform:rotate(5deg)}75%{transform:rotate(-2deg)}to{transform:rotate(0)}}@keyframes bb-keychain-hang{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes bb-keychain-pop{0%{transform:scale(1)}45%{transform:scale(1.12)}to{transform:scale(1)}}@media screen and (min-width:750px){.bb-keychain__panel{padding:3.2rem 2.4rem 2rem}.bb-keychain__title{font-size:2.6rem}}@media screen and (max-width:749px){.bb-keychain__dialog--pair .bb-keychain__panel{padding-right:1.2rem;padding-left:1.2rem}.bb-keychain__options--pair{gap:.8rem}.bb-keychain__options--pair .bb-keychain__option{padding:.7rem .5rem .9rem}.bb-keychain__options--pair .bb-keychain__photo img{max-height:min(18rem,26dvh)}}@media screen and (max-width:389px){.bb-keychain__badge{font-size:1.3rem}.bb-keychain__name,.bb-keychain__options--pair .bb-keychain__name{font-size:1.2rem}}@media(prefers-reduced-motion:reduce){.bb-keychain__badge:hover,.bb-keychain__option:hover,.bb-keychain__close:hover,.bb-keychain__confirm.button:not(:disabled):hover{transform:none}.bb-keychain__snow i,.bb-keychain__bulbs,.bb-keychain__tree,.bb-keychain__heart,.bb-keychain__badge:after,.bb-keychain__sparkles i,.bb-keychain__sparkle-wrap--cta.is-celebrating .bb-keychain__sparkles i,.bb-keychain__confirm.button,.bb-keychain__confirm.button:not(:disabled):before,.bb-keychain__dialog.is-shown,.bb-keychain__dialog.is-shown::backdrop,.bb-keychain__dialog.is-intro .bb-keychain__photo,.bb-keychain__option[aria-pressed=true] .bb-keychain__photo,.bb-keychain__option.is-claimed .bb-keychain__photo{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/17/assets/baristabrew-keychain-gift.css.map */
