/* Pair presentation only: native product, stock, grind, quote and cart controls remain untouched. */
.customer-store .spx-pair-enhanced .pair-capacity.spx-capacity-ready{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);align-items:end;gap:16px 24px;position:relative}
.spx-capacity-control{display:block;width:100%;min-width:0;margin:0;border:0;padding:0;color:#294c3b}
.spx-capacity-control>legend{display:block;width:100%;padding:0;margin:0 0 10px;font-size:16px;font-weight:700;line-height:1.5}
.spx-capacity-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.spx-capacity-buttons>.spx-capacity-button{display:flex;align-items:center;justify-content:center;min-width:0;min-height:58px;padding:12px 8px;border:2px solid #a6b79a;border-radius:10px;background:#fffef7;color:#31543d;font-family:inherit;font-size:21px;font-weight:700;line-height:1.3;white-space:nowrap;cursor:pointer}
.spx-capacity-buttons>.spx-capacity-button[aria-pressed=true]{background:#31543d;color:#fffdf3;border-color:#31543d;box-shadow:inset 0 0 0 2px #fffdf332}
.spx-capacity-buttons>.spx-capacity-button:focus-visible{outline:3px solid #9b6337;outline-offset:3px}
.spx-capacity-buttons>.spx-capacity-button:disabled{cursor:not-allowed;opacity:.45}
.spx-capacity-updated .spx-pair-bag-visual{animation:spx-capacity-bag-arrive .54s cubic-bezier(.18,.75,.25,1) both}
.spx-capacity-updated [data-spx-slot="1"] .spx-pair-bag-visual{animation-delay:.04s}
.spx-pair-motion-paused .spx-capacity-updated .spx-pair-bag-visual{animation-play-state:paused!important}
@keyframes spx-capacity-bag-arrive{0%{transform:translateY(12px) rotate(-8deg) scale(.88)}58%{transform:translateY(-7px) rotate(4deg) scale(1.04)}100%{transform:none}}
.pair-capacity.spx-capacity-ready>.spx-capacity-native-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.customer-store .spx-pair-enhanced .pair-capacity.spx-capacity-ready>span:not(.sx-pair-package){max-width:none;font-size:11px;line-height:1.7}
@media(max-width:760px){.customer-store .spx-pair-enhanced .pair-capacity.spx-capacity-ready{grid-template-columns:minmax(0,1fr);gap:10px}.spx-capacity-control>legend{font-size:15px}.spx-capacity-buttons{gap:8px}.spx-capacity-buttons>.spx-capacity-button{min-height:58px;font-size:20px}}
.spx-pair-live{position:sticky;top:var(--spx-header-height,100px);z-index:5;padding:12px 15px;margin:12px 0 23px;border:1px solid #cbd5c0;border-radius:15px;background:#f8f7efed;box-shadow:0 5px 18px #30462c08;backdrop-filter:blur(12px);isolation:isolate}
.spx-pair-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;color:#3b5940;font-size:12px;line-height:1.5}.spx-pair-heading>strong{font-weight:600}.spx-pair-heading>span{font-size:11px;white-space:nowrap}
.spx-pair-bags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.spx-pair-bag-card{position:relative;display:grid;grid-template-columns:103px minmax(0,1fr);align-items:center;min-height:142px;border-radius:10px;overflow:hidden;isolation:isolate;color:#314f39;min-width:0}
.spx-pair-ground{position:absolute;inset:0;background:var(--sx-ground,#e7ebdf);z-index:-1;border-radius:inherit}
.spx-pair-bag-visual{position:relative;height:142px;display:grid;place-items:center;min-width:0}
.spx-pair-live .spx-single-bag{height:118px;width:75.4px;margin:0;transform:rotate(-5deg);filter:drop-shadow(4px 6px 5px #4b3c2b19);z-index:1}
.spx-pair-live .spx-single-bag.sx-capacity-200{width:45.9px}.spx-pair-live .spx-single-bag.sx-capacity-300{width:78.7px}
.spx-pair-live .spx-original-bag{width:100%;height:126px;object-fit:contain;mix-blend-mode:multiply}
.spx-pair-bag-copy{display:grid;gap:3px;padding:13px 16px 13px 0;min-width:0;line-height:1.55}
.spx-pair-bag-number{font-size:10px;color:#6d7e61}.spx-pair-bag-name{font:500 15px/1.5 'Yu Mincho',serif;overflow-wrap:anywhere}.spx-pair-bag-roast{font-size:10px;color:#617355}.spx-pair-bag-grind{font-size:10px;color:#617355}
.spx-reading-name{word-break:normal;overflow-wrap:normal!important;text-wrap:wrap!important}.spx-reading-name>.spx-reading-unit{display:inline-block;max-width:100%;vertical-align:top;overflow-wrap:anywhere;word-break:normal}
.spx-picker-stage{display:grid;place-items:center;position:relative;isolation:isolate;width:100%;height:145px;margin-bottom:11px;border-radius:7px;background:var(--sx-ground,#e7ebdf);overflow:hidden;pointer-events:none}
.spx-picker-stage>.spx-picker-bag{height:118px;width:75.4px;margin:0;transform:rotate(-4deg);filter:drop-shadow(3px 6px 4px #4b3c2b17)}
.spx-picker-stage>.spx-picker-bag.sx-capacity-200{width:45.9px}.spx-picker-stage>.spx-picker-bag.sx-capacity-300{width:78.7px}
.pair-product-card.is-unavailable .spx-picker-stage{opacity:.65}
.spx-pair-enhanced .pair-capacity>.sx-pair-package{display:none}
.spx-pair-bag-card[data-spx-slot="0"] .spx-pair-bag-visual{view-transition-name:spx-pair-first-bag}.spx-pair-bag-card[data-spx-slot="1"] .spx-pair-bag-visual{view-transition-name:spx-pair-second-bag}
.spx-pair-bag-card[data-spx-slot="0"] .spx-pair-ground{view-transition-name:spx-pair-first-ground}.spx-pair-bag-card[data-spx-slot="1"] .spx-pair-ground{view-transition-name:spx-pair-second-ground}
html.spx-pair-transition::view-transition-group(spx-pair-first-bag),html.spx-pair-transition::view-transition-group(spx-pair-second-bag){animation-duration:.62s;animation-timing-function:cubic-bezier(.2,.65,.22,1)}
html.spx-pair-transition::view-transition-group(spx-pair-first-ground),html.spx-pair-transition::view-transition-group(spx-pair-second-ground){animation-duration:.62s}
html.spx-pair-transition::view-transition-old(root),html.spx-pair-transition::view-transition-new(root){animation:none}
/* The live capacity buttons stay tappable while their decorative snapshots move. */
html.spx-pair-transition::view-transition,html.spx-pair-transition::view-transition-group(*),html.spx-pair-transition::view-transition-image-pair(*),html.spx-pair-transition::view-transition-old(*),html.spx-pair-transition::view-transition-new(*){pointer-events:none}
@media(max-width:760px){
 .spx-pair-live{padding:9px 10px;margin:10px 0 18px;border-radius:12px;top:var(--spx-header-height,150px)}
 .spx-pair-heading{font-size:10px;margin-bottom:6px}.spx-pair-heading>span{font-size:10px}.spx-pair-bags{gap:7px}
 .spx-pair-bag-card{grid-template-columns:50px minmax(0,1fr);min-height:105px;border-radius:8px}
 .spx-pair-bag-visual{height:105px}.spx-pair-live .spx-single-bag{height:83px;width:53px;filter:drop-shadow(2px 4px 3px #4b3c2b14)}
 .spx-pair-live .spx-single-bag.sx-capacity-200{width:32.3px}.spx-pair-live .spx-single-bag.sx-capacity-300{width:55.3px}
 .spx-pair-live .spx-original-bag{height:94px}.spx-pair-bag-copy{padding:8px 7px 8px 3px;gap:2px}.spx-pair-bag-number{font-size:8px}.spx-pair-bag-name{font-size:11px;line-height:1.5}.spx-pair-bag-roast,.spx-pair-bag-grind{font-size:8px;line-height:1.5}
 .spx-picker-stage{height:115px}.spx-picker-stage>.spx-picker-bag{height:92px;width:58.8px}.spx-picker-stage>.spx-picker-bag.sx-capacity-200{width:35.8px}.spx-picker-stage>.spx-picker-bag.sx-capacity-300{width:61.3px}
 .pair-product-card.is-editing .spx-picker-stage{height:105px}
}
@media(max-width:370px){.spx-pair-bag-card{grid-template-columns:42px minmax(0,1fr)}.spx-pair-bag-visual{height:110px}.spx-pair-live .spx-single-bag{height:75px;width:47.9px}.spx-pair-live .spx-single-bag.sx-capacity-200{width:29.2px}.spx-pair-live .spx-single-bag.sx-capacity-300{width:50px}.spx-pair-bag-name{font-size:10px}}
@media(prefers-reduced-motion:reduce){.spx-pair-live *{animation:none!important;transition:none!important}html.spx-pair-transition::view-transition-group(*),html.spx-pair-transition::view-transition-old(*),html.spx-pair-transition::view-transition-new(*){animation:none!important}}

/* A stronger single selection gesture; no continuous bouncing and no change to native controls. */
.spx-pair-bag-card{overflow:visible}
.spx-pair-bag-visual{pointer-events:none}
.spx-pair-powder{position:absolute;z-index:2;left:0;bottom:1px;width:47px;height:30px;transform:rotate(-7deg);filter:drop-shadow(0 3px 2px #3728171a);pointer-events:none}
.spx-pair-powder>.sx-ground-svg{display:block;width:100%;height:100%;overflow:visible}
.spx-picker-stage{overflow:visible}
.spx-picker-stage>.spx-picker-bag{transition:transform .58s cubic-bezier(.18,.8,.28,1.3),filter .4s ease;transform-origin:50% 85%;will-change:auto}
.pair-product-card:not(.is-unavailable):focus-within .spx-picker-bag{transform:translateY(-21px) rotate(10deg) scale(1.09);filter:drop-shadow(7px 15px 7px #4b3c2b25)}
.pair-product-card:not(.is-unavailable) .pair-product-information:active .spx-picker-bag{transform:translateY(-24px) rotate(-11deg) scale(1.1)}
@media(hover:hover) and (pointer:fine){.pair-product-card:not(.is-unavailable) .pair-product-information:hover .spx-picker-bag{transform:translateY(-24px) rotate(11deg) scale(1.1);filter:drop-shadow(7px 17px 8px #4b3c2b29)}}
@media(hover:none),(pointer:coarse){.pair-product-card.is-editing .spx-picker-bag{animation:spx-picker-touch-lift .76s cubic-bezier(.18,.75,.25,1) both}}
@keyframes spx-picker-touch-lift{0%{transform:translateY(4px) rotate(-8deg) scale(.97)}54%{transform:translateY(-23px) rotate(13deg) scale(1.1)}78%{transform:translateY(-15px) rotate(5deg) scale(1.04)}100%{transform:translateY(-18px) rotate(8deg) scale(1.06)}}
html.spx-pair-transition::view-transition-group(spx-pair-first-bag),html.spx-pair-transition::view-transition-group(spx-pair-second-bag){animation-duration:.8s;animation-timing-function:cubic-bezier(.18,.8,.22,1.22)}
html.spx-pair-transition::view-transition-new(spx-pair-first-bag){animation:spx-pair-first-arrive .8s cubic-bezier(.18,.75,.25,1) both}
html.spx-pair-transition::view-transition-new(spx-pair-second-bag){animation:spx-pair-second-arrive .8s cubic-bezier(.18,.75,.25,1) both}
html.spx-pair-transition::view-transition-old(spx-pair-first-bag),html.spx-pair-transition::view-transition-old(spx-pair-second-bag){animation:spx-pair-depart .24s ease-out both}
@keyframes spx-pair-first-arrive{0%{transform:translateY(21px) rotate(-13deg) scale(.86);opacity:.3}56%{transform:translateY(-11px) rotate(8deg) scale(1.08);opacity:1}80%{transform:translateY(3px) rotate(-3deg) scale(.98)}100%{transform:none;opacity:1}}
@keyframes spx-pair-second-arrive{0%{transform:translateY(21px) rotate(13deg) scale(.86);opacity:.3}56%{transform:translateY(-11px) rotate(-8deg) scale(1.08);opacity:1}80%{transform:translateY(3px) rotate(3deg) scale(.98)}100%{transform:none;opacity:1}}
@keyframes spx-pair-depart{to{transform:translateY(-12px) scale(.93);opacity:0}}
@media(max-width:760px){.spx-pair-powder{left:-1px;bottom:1px;width:31px;height:20px}.pair-product-card:not(.is-unavailable):focus-within .spx-picker-bag{transform:translateY(-18px) rotate(9deg) scale(1.08)}}
@media(prefers-reduced-motion:reduce){
 .spx-pair-live *,.spx-picker-stage>.spx-picker-bag{animation:none!important;transition:none!important}
 .pair-product-card:not(.is-unavailable) .spx-picker-bag,.pair-product-card:not(.is-unavailable):focus-within .spx-picker-bag{transform:rotate(-4deg)!important}
 html.spx-pair-transition::view-transition-group(*),html.spx-pair-transition::view-transition-old(*),html.spx-pair-transition::view-transition-new(*){animation:none!important}
}

/* Phone-first arrival: the bag moves when it enters the screen, without a cursor. */
.spx-picker-stage.spx-picker-visible>.spx-picker-bag{animation:spx-picker-arrive .82s cubic-bezier(.18,.75,.25,1)}
@keyframes spx-picker-arrive{0%{transform:translateY(15px) rotate(-13deg) scale(.88);opacity:.6}55%{transform:translateY(-23px) rotate(11deg) scale(1.09);opacity:1}78%{transform:translateY(1px) rotate(-7deg) scale(.99)}100%{transform:translateY(0) rotate(-4deg) scale(1);opacity:1}}
.spx-pair-motion-paused .spx-picker-bag{animation-play-state:paused!important}
.spx-heading-unit{display:inline-block;max-width:100%;overflow-wrap:anywhere}
.spx-pair-enhanced .pair-page-heading h1,.spx-pair-enhanced #pair-selected-heading,.spx-pair-enhanced #pair-picker-heading,.spx-pair-enhanced .pair-checkout h2{text-wrap:wrap;word-break:normal;overflow-wrap:normal}
.spx-pair-enhanced .pair-heading-offer{display:grid;justify-items:center;gap:8px;padding:25px 24px;margin:22px 0;background:#31543d;color:#fffdf3;border:1px solid #31543d;border-radius:15px;text-align:center}
.spx-pair-enhanced .pair-heading-offer>span:first-child{font-size:15px;font-weight:600;letter-spacing:.07em}
.spx-pair-enhanced .pair-heading-offer>span{color:#fffdf3}
.spx-pair-enhanced .pair-heading-offer>strong{font-size:clamp(42px,6vw,68px);line-height:1.15;letter-spacing:-.035em;font-weight:700;white-space:nowrap}
.spx-pair-enhanced .pair-heading-offer>strong>small{font-size:12px;letter-spacing:0;margin-left:7px;font-weight:400}
.spx-pair-enhanced .pair-heading-offer>span:nth-of-type(2){font-size:16px;line-height:1.65;font-weight:600;color:#fff3ce}
.spx-pair-enhanced .pair-heading-offer>small{font-size:11px;color:#edf0df;line-height:1.7}
.spx-pair-enhanced .pair-capacity-heading{padding:19px 20px;border-radius:12px;background:#e8eddf;color:#38533d;line-height:1.7}
.spx-pair-enhanced .pair-capacity-heading>strong{font-size:22px;line-height:1.5}
.spx-pair-heading>strong{font-size:15px}.spx-pair-heading>span{font-size:13px;font-weight:600}
.spx-pair-enhanced .pair-price-offer{padding:20px 16px;text-align:center;border-radius:11px;background:#e9efdc}
.spx-pair-enhanced .pair-price-offer>strong{font-size:38px;line-height:1.25;white-space:nowrap}
.spx-pair-enhanced .pair-price-offer>strong>small{font-size:11px}
.spx-pair-enhanced .pair-money .pair-saving{padding:14px 12px;margin:10px 0;border-radius:9px;background:#e6edda;color:#375c38;gap:10px}
.spx-pair-enhanced .pair-money .pair-saving>span{font-weight:600;font-size:14px}
.spx-pair-enhanced .pair-money .pair-saving>strong{font-size:28px;line-height:1.25;white-space:nowrap}
.spx-pair-enhanced .pair-money .pair-total{padding-top:19px;align-items:baseline;gap:12px}
.spx-pair-enhanced .pair-money .pair-total>span{font-size:15px;font-weight:600}
.spx-pair-enhanced .pair-money .pair-total>strong{font-size:clamp(31px,4vw,42px);line-height:1.25;letter-spacing:-.035em;white-space:nowrap}
.spx-pair-enhanced .pair-discount-details>summary{font-weight:600;font-size:14px;line-height:1.7}
.spx-pair-enhanced .pair-discount-details .offer-saving-badge{font-size:20px;padding:10px 16px}
@media(max-width:760px){
 .spx-pair-enhanced .pair-page-heading h1{font-size:25px;line-height:1.55}
 .spx-pair-enhanced #pair-picker-heading,.spx-pair-enhanced #pair-selected-heading,.spx-pair-enhanced .pair-checkout h2{font-size:22px;line-height:1.6}
 .spx-pair-enhanced .pair-heading-offer{padding:22px 15px;margin:18px 0;gap:8px}.spx-pair-enhanced .pair-heading-offer>strong{font-size:51px}.spx-pair-enhanced .pair-heading-offer>span:first-child{font-size:14px}.spx-pair-enhanced .pair-heading-offer>span:nth-of-type(2){font-size:15px}.spx-pair-enhanced .pair-heading-offer>small{font-size:11px}
 .spx-pair-enhanced .pair-capacity-heading>strong{font-size:20px}
 .spx-pair-heading>strong{font-size:12px}.spx-pair-heading>span{font-size:11px}
 .spx-pair-enhanced .pair-money .pair-saving{padding:13px 11px}.spx-pair-enhanced .pair-money .pair-saving>span{font-size:13px}.spx-pair-enhanced .pair-money .pair-saving>strong{font-size:25px}.spx-pair-enhanced .pair-money .pair-total{flex-wrap:wrap;gap:4px 12px}.spx-pair-enhanced .pair-money .pair-total>strong{font-size:38px}
}
@media(max-width:370px){.spx-pair-enhanced .pair-heading-offer>strong{font-size:47px}.spx-pair-enhanced .pair-money .pair-total>strong{font-size:34px}.spx-pair-enhanced .pair-money .pair-saving>strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.spx-picker-stage.spx-picker-visible>.spx-picker-bag{animation:none!important;transform:rotate(-4deg)!important}}

/* The chosen pair shares one stage. Slot names, native controls and quoted amounts stay separate. */
.spx-pair-live{padding:12px 14px 10px;border-radius:17px;background:#fbfaf2f5}
.spx-pair-stage{position:relative;display:block;height:215px;isolation:isolate;--spx-first:#dfe7d0;--spx-second:#e9dccb}
.spx-first-deep{--spx-first:#dac7b2}.spx-first-balance{--spx-first:#dbe4ce}.spx-first-light{--spx-first:#ece5be}
.spx-second-deep{--spx-second:#dac7b2}.spx-second-balance{--spx-second:#dbe4ce}.spx-second-light{--spx-second:#ece5be}
.spx-pair-stage-floor{position:absolute;inset:0;border-radius:13px;background:linear-gradient(115deg,var(--spx-first),var(--spx-second));overflow:hidden;z-index:-1;view-transition-name:spx-pair-shared-ground;pointer-events:none}
.spx-pair-stage-floor:before{content:'';position:absolute;width:260px;height:260px;border:1px solid #fbfff480;border-radius:50%;left:50%;top:18%;transform:translate(-50%,-50%) rotate(-18deg) scaleX(1.8)}
.spx-pair-stage-floor:after{content:'';position:absolute;inset:58% 0 0;background:linear-gradient(transparent,#fbfaf0d9)}
.spx-pair-stage-word{position:absolute;top:22px;left:50%;transform:translateX(-50%);max-width:100%;font:800 clamp(45px,7vw,85px)/1 Arial,sans-serif;letter-spacing:-.065em;color:#486044;opacity:.12;white-space:nowrap;z-index:0;pointer-events:none}
.spx-pair-stage>.spx-pair-bag-card{position:absolute;top:0;bottom:0;width:50%;display:block;border:0;border-radius:0;overflow:visible;background:none;isolation:auto;min-height:0}
.spx-pair-stage>.spx-pair-bag-card[data-spx-slot="0"]{left:0}.spx-pair-stage>.spx-pair-bag-card[data-spx-slot="1"]{right:0}
.spx-pair-stage .spx-pair-ground{background:transparent;view-transition-name:none!important}
.spx-pair-stage .spx-pair-bag-visual{position:absolute;top:-5px;width:200px;height:165px;display:grid;place-items:center;z-index:2;overflow:visible}
.spx-pair-stage [data-spx-slot="0"] .spx-pair-bag-visual{right:-50px}.spx-pair-stage [data-spx-slot="1"] .spx-pair-bag-visual{left:-50px}
.spx-pair-live .spx-pair-stage .spx-single-bag{height:158px;width:101px;margin:0;animation:spx-pair-left-roam 6.4s ease-in-out infinite;filter:drop-shadow(6px 11px 7px #4b3c2b20)}
.spx-pair-live .spx-pair-stage .spx-single-bag.sx-capacity-200{width:61.4px}.spx-pair-live .spx-pair-stage .spx-single-bag.sx-capacity-300{width:105.3px}
.spx-pair-live .spx-pair-stage [data-spx-slot="1"] .spx-single-bag{animation-name:spx-pair-right-roam;animation-delay:-1.8s}
.spx-pair-stage .spx-pair-bag-copy{position:absolute;left:10px;right:10px;bottom:9px;display:grid;gap:1px;padding:0;text-align:center;z-index:3;line-height:1.5}
.spx-pair-stage .spx-pair-bag-name{font-family:inherit;font-size:13px;line-height:1.5;font-weight:600}
.spx-pair-stage .spx-pair-bag-number{font-size:9px;color:#486045}.spx-pair-stage .spx-pair-bag-roast,.spx-pair-stage .spx-pair-bag-grind{font-size:9px;color:#53654c}
.spx-pair-stage .spx-pair-powder{bottom:2px;left:26px;width:52px;height:31px;z-index:3}
.spx-pair-stage .spx-pair-beans{position:absolute;left:21px;bottom:1px;width:61px;height:40px;z-index:3;pointer-events:none}
.spx-pair-beans .sx-bean{animation:sx-sparse-bean-drift var(--sx-bean-duration) ease-in-out var(--sx-bean-delay) infinite}
.spx-pair-bean-a{left:0;top:12px;--sx-bean-size:24px;--sx-bean-angle:-24deg;--sx-bean-duration:6.8s;--sx-bean-delay:-1.1s;--sx-bean-dx:2px;--sx-bean-dy:-3px}
.spx-pair-bean-b{left:25px;top:1px;--sx-bean-size:21px;--sx-bean-angle:18deg;--sx-bean-duration:7.3s;--sx-bean-delay:-3.4s;--sx-bean-dx:-2px;--sx-bean-dy:3px}
.spx-pair-bean-e{left:38px;top:23px;--sx-bean-size:20px;--sx-bean-angle:-14deg;--sx-bean-duration:7.7s;--sx-bean-delay:-2.4s;--sx-bean-dx:2px;--sx-bean-dy:-2px}
.spx-pair-motion-paused .spx-pair-beans .sx-bean{animation-play-state:paused!important}
.spx-pair-motion-paused .spx-pair-stage .spx-single-bag{animation-play-state:paused!important}
@keyframes spx-pair-left-roam{0%,100%{transform:translate(-4px,1px) rotate(-12deg)}40%{transform:translate(-11px,-11px) rotate(-5deg)}73%{transform:translate(1px,4px) rotate(-16deg)}}
@keyframes spx-pair-right-roam{0%,100%{transform:translate(4px,-2px) rotate(10deg)}43%{transform:translate(12px,-10px) rotate(17deg)}76%{transform:translate(-1px,5px) rotate(5deg)}}
html.spx-pair-transition::view-transition-group(spx-pair-shared-ground){animation-duration:.84s;animation-timing-function:cubic-bezier(.18,.75,.23,1)}
html.spx-pair-transition::view-transition-new(spx-pair-first-bag){animation:spx-pair-first-stage-arrive .84s cubic-bezier(.18,.75,.25,1) both}
html.spx-pair-transition::view-transition-new(spx-pair-second-bag){animation:spx-pair-second-stage-arrive .84s cubic-bezier(.18,.75,.25,1) both}
@keyframes spx-pair-first-stage-arrive{0%{transform:translate(-28px,30px) rotate(-20deg) scale(.8);opacity:.2}58%{transform:translate(12px,-16px) rotate(10deg) scale(1.11);opacity:1}82%{transform:translate(-4px,3px) rotate(-4deg) scale(.98)}100%{transform:none;opacity:1}}
@keyframes spx-pair-second-stage-arrive{0%{transform:translate(28px,30px) rotate(20deg) scale(.8);opacity:.2}58%{transform:translate(-12px,-16px) rotate(-10deg) scale(1.11);opacity:1}82%{transform:translate(4px,3px) rotate(4deg) scale(.98)}100%{transform:none;opacity:1}}
@media(max-width:760px){
 .spx-pair-live{padding:9px 10px 8px}.spx-pair-stage{height:164px}.spx-pair-stage-word{top:17px;font-size:54px}
 .spx-pair-stage-floor:before{width:185px;height:185px;top:20%;transform:translate(-50%,-50%) rotate(-18deg) scaleX(1.5)}
 .spx-pair-stage .spx-pair-bag-visual{top:-7px;width:150px;height:120px}
 .spx-pair-stage [data-spx-slot="0"] .spx-pair-bag-visual{right:-40px}.spx-pair-stage [data-spx-slot="1"] .spx-pair-bag-visual{left:-40px}
 .spx-pair-live .spx-pair-stage .spx-single-bag{height:117px;width:74.7px}.spx-pair-live .spx-pair-stage .spx-single-bag.sx-capacity-200{width:45.5px}.spx-pair-live .spx-pair-stage .spx-single-bag.sx-capacity-300{width:78px}
 .spx-pair-stage .spx-pair-bag-copy{left:5px;right:5px;bottom:7px;gap:0}.spx-pair-stage .spx-pair-bag-name{font-size:10px;line-height:1.45}.spx-pair-stage .spx-pair-bag-number{font-size:8px}.spx-pair-stage .spx-pair-bag-roast,.spx-pair-stage .spx-pair-bag-grind{font-size:8px;line-height:1.45}
 .spx-pair-stage .spx-pair-powder{left:22px;bottom:-1px;width:36px;height:22px}
 .spx-pair-stage .spx-pair-beans{left:17px;bottom:-1px;width:43px;height:29px}
 .spx-pair-bean-a{top:8px;--sx-bean-size:17px}.spx-pair-bean-b{left:18px;--sx-bean-size:15px}.spx-pair-bean-e{left:27px;top:17px;--sx-bean-size:14px}
}
@media(max-width:370px){.spx-pair-stage{height:168px}.spx-pair-stage-word{font-size:48px}.spx-pair-stage .spx-pair-bag-name{font-size:10px}}
@media(prefers-reduced-motion:reduce){.spx-pair-live .spx-pair-stage .spx-single-bag{animation:none!important;transition:none!important;transform:rotate(-9deg)}.spx-pair-live .spx-pair-stage [data-spx-slot="1"] .spx-single-bag{transform:rotate(9deg)}html.spx-pair-transition::view-transition-group(*),html.spx-pair-transition::view-transition-old(*),html.spx-pair-transition::view-transition-new(*){animation:none!important}}
