/* PCB Party Pass micro-interaction layer (2026-10-22, MICRO_PCBPARTYPASS.md). Loaded after pp-motion.css. The tactile, iOS-style
   layer only: tap feel, sliding segmented thumb, bottom-sheet menu, toasts, focus rings, nav-bar glass. Press/release springs are
   WAAPI (pp-micro.js) so they never fight the theme's transform rules or pp-motion's :active scale. Nothing here changes layout
   at rest; under prefers-reduced-motion pp.css zeroes every transition and the JS skips its animations. Undo: rename to .off. */
:root{--mi-ease:cubic-bezier(.2,.8,.2,1);--mi-spring:cubic-bezier(.34,1.56,.64,1);--mi-sheet:cubic-bezier(.32,.72,0,1)}
a,button,summary,label,input,select,textarea,[role=button],[tabindex]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
/* replacement highlight: plain text links dim while pressed (iOS), pressables get a hair of shade (JS adds .mi-down instantly on pointerdown) */
.mi-down{filter:brightness(.94)}
.btn,.wk,.reps a,.pcard a,a.panel,.chip,.dl,.nl{-webkit-user-select:none;user-select:none}

/* nav bar glass (iOS): more translucent, stronger blur + saturation, a touch clearer once compact */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .site-h{background:rgba(255,247,236,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);transition:translate .35s var(--out,ease),background .3s}
  html.pm-scrolled .site-h{background:rgba(255,247,236,.7)}
  .pm-top{background:rgba(198,244,50,.84);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px)}
}

/* FAQ / any details: chevron (+) turns with a spring; content height is animated by JS */
.faq summary::after{transition:transform .45s var(--mi-spring),background .2s,scale .2s var(--mi-spring)}
details>.mi-acc{overflow:hidden}

/* segmented chips: a pill thumb slides to the new choice (JS FLIP); the chip under it lets the thumb show through */
.seg,[role=group]{position:relative}
.mi-thumb{position:absolute;z-index:0;border-radius:999px;background:var(--blue);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);pointer-events:none;transform-origin:0 0}
.mi-under{position:relative;z-index:1;background:transparent!important;box-shadow:none!important}

/* phone carousel dots: the active dot stretches into a pill (fixed 22px cells; clip-path only, so nothing moves) */
@media(max-width:640px){
  html .pm-dots{gap:0}
  html .pm-dots i,html .pm-dots i.on{width:22px;height:8px;background:var(--ink);opacity:.22;scale:none;box-shadow:none;border-radius:4px;clip-path:inset(0 7px round 4px);transition:clip-path .4s var(--mi-spring),opacity .25s,background .25s}
  html .pm-dots i.on{opacity:1;background:var(--pink);clip-path:inset(0 0 round 4px)}
}

/* bottom sheet menu (phones): JS moves #drawer next to the header (out of its blur containing block) and adds .mi-sh */
@media(max-width:640px){
  .drawer.mi-sh{position:fixed;left:0;right:0;bottom:0;z-index:62;max-height:min(86vh,calc(100dvh - 48px));overflow:auto;overscroll-behavior:contain;border:var(--bw) solid var(--ink);border-bottom:0;border-radius:26px 26px 0 0;background:var(--court);box-shadow:0 -12px 40px rgba(23,18,31,.28);padding-bottom:env(safe-area-inset-bottom)}
  .drawer.mi-sh::before{content:"";display:block;position:sticky;top:0;width:40px;height:5px;border-radius:3px;background:rgba(23,18,31,.32);margin:10px auto 0;z-index:1}
  .drawer.mi-sh .dnav{padding-top:12px}
}
.mi-scrim{position:fixed;inset:0;z-index:61;background:rgba(23,18,31,.36);-webkit-backdrop-filter:blur(6px) saturate(120%);backdrop-filter:blur(6px) saturate(120%);opacity:0;transition:opacity .32s var(--mi-ease)}
.mi-scrim.on{opacity:1}
html.mi-lock,html.mi-lock body{overflow:hidden}

/* toasts: frosted pill slides down from the top */
.mi-toast{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:80;display:flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);padding:10px 18px 10px 12px;border-radius:999px;background:rgba(23,18,31,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);color:#fff;font:700 .92rem/1.2 var(--fb);box-shadow:0 10px 30px rgba(23,18,31,.25);pointer-events:none;opacity:0;translate:-50% -140%;scale:.9;transition:translate .45s var(--mi-spring),opacity .25s,scale .45s var(--mi-spring)}
.mi-toast::before{content:"";flex:0 0 22px;height:22px;border-radius:50%;background:var(--lime) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5l2.6 2.6L10 3.4' fill='none' stroke='%2317121F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.mi-toast.on{opacity:1;translate:-50% 0;scale:1}

/* inputs: the focus ring grows in instead of snapping */
input[type=text],input[type=number],input[type=email],input[type=search],input[type=tel],textarea,select{outline:3px solid transparent;outline-offset:9px;transition:outline-offset .3s var(--mi-spring),outline-color .2s,box-shadow .2s}

/* links: soft underline (desktop hover) */
@media(hover:hover) and (pointer:fine){
  .f-col a,.crumbs a,.f-legal a{background:linear-gradient(currentColor,currentColor) 0 calc(100% - 8px)/0 2px no-repeat;transition:background-size .35s var(--mi-ease),color .2s}
  .f-col a:hover,.crumbs a:hover,.f-legal a:hover{background-size:100% 2px}
  .f-legal a{background-position:0 100%}
  main p a:not([class]),main li a:not([class]),main td a:not([class]){text-decoration-color:color-mix(in srgb,currentColor 40%,transparent);transition:text-decoration-color .25s,text-underline-offset .3s var(--mi-spring)}
  main p a:not([class]):hover,main li a:not([class]):hover,main td a:not([class]):hover{text-decoration-color:currentColor;text-underline-offset:.28em}
  .chip:not([aria-pressed=true]):hover{translate:0 -1px}
  .chip{transition:transform .12s var(--bounce,ease),background .15s,scale .15s var(--spring,ease),translate .2s var(--mi-ease)}
}

@media(prefers-reduced-motion:reduce){.mi-thumb{display:none}.mi-toast{translate:-50% 0;scale:1}}
@media print{.mi-toast,.mi-scrim,.mi-thumb{display:none!important}}