/* Springbreakology v10 MICRO (2026-10-22): the tactile, iOS-style layer on top of sbo-motion. Pairs with sbo-micro.js.
   Transform/opacity/filter only (the sheet, thumb and toast are fixed/absolute, so nothing reflows the page).
   html.sbm-rm (reduced motion) keeps every state change but drops the movement. Undo = remove the enqueue. */
html.sbm{--mi-e:cubic-bezier(.2,.8,.2,1);--mi-s:cubic-bezier(.34,1.56,.64,1);--mi-sheet:cubic-bezier(.32,1.18,.5,1);--mi-glass:rgba(16,15,43,.62)}

/* 1. tap: no grey flash, no double-tap zoom wait; press feedback is the spring scale from JS */
html.sbm :is(a,button,summary,label,input,select,[role=button],.wk,.party,.bc,.vn,.b){-webkit-tap-highlight-color:transparent;touch-action:manipulation}
html.sbm :is(.mobile-menu-toggle,.wpex-mobile-menu__close,#site-scroll-top,.hv-toggle,.sbm-pt,summary){-webkit-user-select:none;user-select:none}

/* 2. iOS nav bar glass */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  body.sbo #site-header{background:rgba(10,9,25,.72)!important;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
  body.sbo #site-header-sticky-wrapper.wpex-can-sticky:not(.not-sticky) #site-header{background:rgba(10,9,25,.78)!important}
  html.sbm body.sbo #site-scroll-top{background:var(--mi-glass)!important;-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px)}
}

/* 3. focus ring grows in (keyboard only) */
html.sbm:not(.sbm-rm) body.sbo :is(a,button,summary,input,[tabindex]):not(li.sbo-cta-item>a):focus-visible{animation:miFocus .28s var(--mi-e)}
@keyframes miFocus{from{outline-offset:9px;outline-color:transparent}}
html.sbm body.sbo .axs__i{transition:box-shadow .25s var(--mi-e),border-color .25s var(--mi-e)}
html.sbm body.sbo .axs__i:focus{box-shadow:0 0 0 5px rgba(37,232,224,.22);border-color:var(--teal,#25e8e0)}

/* 4. links: soft underline thickens */
html.sbm body.sbo :is(.art,.sec,.faq) :is(p,li) a:not(.btn){transition:color var(--t-fast,.16s),text-decoration-color .25s,text-decoration-thickness .25s var(--mi-e),text-underline-offset .25s var(--mi-e)}
@media(hover:hover) and (pointer:fine){html.sbm body.sbo :is(.art,.sec,.faq) :is(p,li) a:not(.btn):hover{text-decoration-thickness:2px;text-underline-offset:4px}}

/* 5. accordions: chevron springs; body slides (height is animated by JS, only on tap) */
html.sbm:not(.sbm-rm) .faq summary::after{transition:transform .5s var(--mi-s)}
html.sbm body.sbo details.mi-anim{overflow:hidden;box-sizing:border-box}
@media(hover:hover) and (pointer:fine){html.sbm:not(.sbm-rm) .faq summary{transition:color var(--t-fast,.16s),transform .3s var(--mi-e)}html.sbm:not(.sbm-rm) .faq summary:hover{transform:translateX(3px)}}

/* 6. segmented control (venue filter): a sliding pill thumb under the buttons */
.mi-seg{position:relative;isolation:isolate}
.mi-seg>button{position:relative;z-index:1}
.mi-seg>button.on,.mi-seg>button.on:hover{background:transparent!important}
.mi-thumb{position:absolute;left:0;top:0;z-index:0;border-radius:99px;background:var(--pink-d,#d81b84);box-shadow:0 10px 24px -10px rgba(216,27,132,.9);pointer-events:none;opacity:0}
.mi-thumb.on{opacity:1}
html.sbm:not(.sbm-rm) .mi-thumb.go{transition:transform .46s var(--mi-s),width .46s var(--mi-s),height .3s var(--mi-e)}

/* 7. carousels: contained overscroll, active dot stretches into a pill */
html.sbm :is(.pscroll,.strip,.catnav){overscroll-behavior-x:contain}
html.sbm:not(.sbm-rm) .sbm-dots i{border-radius:3px;transition:transform .42s var(--mi-s),background .25s ease}
html.sbm:not(.sbm-rm) .sbm-dots i.on{transform:scale(2.3,1.15)}

/* 8. mobile menu as an iOS bottom sheet (phone); Total still owns open/close, Esc and the overlay */
@media(max-width:767px){
  html.sbm body.sbo #sidr-main.sidr{top:auto!important;bottom:0!important;left:0!important;right:0!important;width:auto!important;height:auto!important;max-height:86vh;max-height:86dvh;overflow-y:auto;overscroll-behavior:contain;border-radius:22px 22px 0 0;padding-bottom:calc(14px + env(safe-area-inset-bottom));box-shadow:0 -24px 60px -12px rgba(0,0,0,.65),0 140px 0 0 var(--bg2,#100f2b);transform:translate3d(0,110%,0);visibility:hidden;transition:transform .32s var(--mi-e),visibility 0s .32s}
  html.sbm body.sbo.mobile-menu-is-open #sidr-main.sidr{transform:none;visibility:visible;transition:transform .5s var(--mi-sheet),visibility 0s}
  html.sbm:not(.sbm-rm) body.sbo.mobile-menu-is-open #sidr-main.sidr:not(.mi-drag){animation:miSheet .52s var(--mi-sheet) both}
  html.sbm body.sbo #sidr-main.mi-drag{transition:none!important;animation:none!important}
  html.sbm body.sbo #sidr-main::before{content:"";display:block;position:sticky;top:0;z-index:2;width:38px;height:5px;margin:8px auto -4px;border-radius:3px;background:rgba(255,255,255,.38)}
  html.sbm body.sbo #sidr-main .wpex-mobile-menu__top{padding-top:6px!important;padding-bottom:6px!important}
  html.sbm body.sbo .wpex-sidr-overlay{background:rgba(5,4,14,.42)!important;-webkit-backdrop-filter:blur(6px) saturate(140%);backdrop-filter:blur(6px) saturate(140%)}
}
html.sbm:not(.sbm-rm) body.sbo .wpex-sidr-overlay:not(.wpex-hidden){animation:miFade .3s var(--mi-e) both}
@keyframes miSheet{from{transform:translate3d(0,100%,0)}}
@keyframes miFade{from{opacity:0}}

/* 8b. card chooser (#ax-card): bottom sheet on phones, soft scale-in elsewhere; backdrop frosted */
html.sbm .axcs-bg{-webkit-backdrop-filter:blur(6px) saturate(140%);backdrop-filter:blur(6px) saturate(140%)}
html.sbm .axcs-x{width:44px;height:44px;top:8px;right:8px}
html.sbm:not(.sbm-rm) .axcs.is-open .axcs-bg{animation:miFade .3s var(--mi-e) both}
html.sbm:not(.sbm-rm) .axcs.is-open .axcs-p:not(.mi-drag){animation:miPop .42s var(--mi-s) both}
html.sbm .axcs-p.mi-drag{transition:none!important;animation:none!important}
html.sbm:not(.sbm-rm) .axcs-p{transition:transform .45s var(--mi-sheet)}
@media(max-width:767px){
  html.sbm .axcs.is-open{align-items:flex-end;padding:0}
  html.sbm .axcs-p{max-width:none;max-height:88vh;max-height:88dvh;border-radius:22px 22px 0 0;padding-top:24px;padding-bottom:calc(18px + env(safe-area-inset-bottom));overscroll-behavior:contain;box-shadow:0 -20px 60px -12px rgba(0,0,0,.5),0 140px 0 0 #fff}
  html.sbm .axcs-p::before{content:"";position:absolute;top:8px;left:50%;width:38px;height:5px;margin-left:-19px;border-radius:3px;background:rgba(0,0,0,.2)}
  html.sbm:not(.sbm-rm) .axcs.is-open .axcs-p:not(.mi-drag){animation:miSheet .5s var(--mi-sheet) both}
}
@keyframes miPop{from{opacity:0;transform:scale(.94) translate3d(0,10px,0)}}

/* 9. toast: pill from the top, frosted */
.mi-toast{position:fixed;left:50%;top:calc(10px + env(safe-area-inset-top));z-index:2147483000;max-width:calc(100vw - 32px);padding:11px 18px 11px 14px;border-radius:99px;display:flex;align-items:center;gap:9px;font:700 .92rem/1.25 var(--font-body,system-ui);color:#fff;background:var(--mi-glass);border:1px solid rgba(255,255,255,.16);box-shadow:0 18px 40px -14px rgba(0,0,0,.7);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);transform:translate3d(-50%,-160%,0) scale(.9);opacity:0;pointer-events:none;transition:transform .5s var(--mi-s),opacity .25s var(--mi-e)}
.mi-toast::before{content:"";flex:0 0 18px;height:18px;border-radius:50%;background:var(--teal,#25e8e0) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%230a0919' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.mi-toast.on{transform:translate3d(-50%,0,0);opacity:1}
html.sbm-rm .mi-toast{transition:opacity .01s}

/* 10. long-press peek on photo tiles */
.mi-peek{position:relative;z-index:3;box-shadow:0 28px 60px -20px rgba(0,0,0,.85)}

@media(prefers-reduced-motion:reduce){.mi-thumb,.mi-toast,.axcs-p{transition:none!important;animation:none!important}}
/* reduced motion: the sheet still needs a (1 ms) transition, sidr completes open/close on transitionend */
html.sbm-rm body.sbo #sidr-main.sidr{transition-duration:1ms!important;transition-delay:0s!important;animation:none!important}
@media print{.mi-toast,.mi-thumb{display:none!important}}
