/* FineME v330 — mobile main-feed reaction picker is a true viewport overlay. */
@media (max-width:760px), (hover:none) and (pointer:coarse){
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open{
    position:relative!important;
    z-index:7300!important;
    overflow:visible!important;
    isolation:auto!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-social-post-stats,
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-social-post-actions,
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-action{
    overflow:visible!important;
    isolation:auto!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-action.is-picker-open{
    position:relative!important;
    z-index:7340!important;
    isolation:auto!important;
  }

  /* Fixed to the viewport so the next feed card cannot paint over the emoji choices. */
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-action.is-picker-open .fm-reaction-picker{
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:calc(84px + env(safe-area-inset-bottom))!important;
    width:min(304px,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    align-items:center!important;
    gap:6px!important;
    margin:0!important;
    padding:8px!important;
    border:1px solid rgba(220,225,237,.98)!important;
    border-radius:20px!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 24px 70px rgba(15,23,45,.30)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateX(-50%)!important;
    transform-origin:center bottom!important;
    z-index:7380!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker::before,
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker::after{
    display:none!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker button{
    width:100%!important;
    min-width:0!important;
    height:54px!important;
    min-height:54px!important;
    padding:5px 2px!important;
    border-radius:14px!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker button>span{
    font-size:25px!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker button>small{
    display:block!important;
    font-size:8px!important;
    line-height:1.1!important;
  }

  /* Feed cards sometimes create their own stacking context through transform/contain. */
  .fm-v330 .fm-social-shell,
  .fm-v330 .fm-social-feed,
  .fm-v330 .fm-feed-list{
    overflow:visible!important;
  }
}

@media (max-width:390px){
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-action.is-picker-open .fm-reaction-picker{
    bottom:calc(78px + env(safe-area-inset-bottom))!important;
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    gap:4px!important;
    padding:7px!important;
    border-radius:18px!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker button{
    height:50px!important;
    min-height:50px!important;
  }
  .fm-v330 [data-fm-post-id].fm-reaction-picker-overlay-open .fm-reaction-picker button>span{font-size:23px!important}
}