/* FineME v278 — clear block F brand, compact video product tag, non-overlapping reactions. */

/* Brand: a clear square app-style F, consistent with favicon. */
.fm-v279 .fm-brand{min-width:166px!important;gap:9px!important}
.fm-v279 .fm-brand-logo{display:inline-flex!important;align-items:center!important;gap:9px!important;white-space:nowrap!important}
.fm-v279 .fm-brand-tile{width:42px!important;height:42px!important;display:block!important;overflow:visible!important;flex:0 0 auto!important;filter:drop-shadow(0 8px 15px rgba(96,105,220,.16))!important}
.fm-v279 .fm-brand-word{display:inline-flex!important;align-items:baseline!important;font-size:24px!important;line-height:1!important;letter-spacing:-.055em!important;font-weight:900!important;color:#30365f!important}
.fm-v279 .fm-brand-word>b{font-weight:900!important}
.fm-v279 .fm-brand-me{background:linear-gradient(105deg,#609ff9 0%,#8579f4 52%,#ed77b5 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}
.fm-v279 .fm-brand-logo.is-compact{gap:6px!important}
.fm-v279 .fm-brand-logo.is-compact .fm-brand-tile{width:30px!important;height:30px!important}
.fm-v279 .fm-brand-logo.is-compact .fm-brand-word{font-size:17px!important}

/* Video product tag: keep the commerce system, reduce visual weight. */
.fm-v279 .fm-video-card-v277 .shadow-video-product,
.fm-v279 .fm-video-card-v278 .shadow-video-product{
  width:min(270px,calc(100% - 4px))!important;
  min-height:46px!important;
  grid-template-columns:36px minmax(0,1fr) auto!important;
  gap:6px!important;
  padding:5px!important;
  border-radius:13px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(10,13,20,.58)!important;
  backdrop-filter:blur(14px)!important;
  box-shadow:0 9px 24px rgba(0,0,0,.20)!important;
}
.fm-v279 .fm-video-card-v277 .shadow-video-product>img,
.fm-v279 .fm-video-card-v278 .shadow-video-product>img{width:36px!important;height:36px!important;border-radius:9px!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product-copy,
.fm-v279 .fm-video-card-v278 .shadow-video-product-copy{min-width:0!important;gap:1px!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product-copy small,
.fm-v279 .fm-video-card-v278 .shadow-video-product-copy small{font-size:7.5px!important;line-height:1.1!important;color:#b8c1cf!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product-copy strong,
.fm-v279 .fm-video-card-v278 .shadow-video-product-copy strong{font-size:9.4px!important;line-height:1.25!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product>b,
.fm-v279 .fm-video-card-v278 .shadow-video-product>b{min-width:55px!important;min-height:34px!important;padding:4px 7px!important;border-radius:9px!important;background:#fff!important;color:#1f2c43!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product>b span,
.fm-v279 .fm-video-card-v278 .shadow-video-product>b span{font-size:9px!important;line-height:1.1!important}
.fm-v279 .fm-video-card-v277 .shadow-video-product>b em,
.fm-v279 .fm-video-card-v278 .shadow-video-product>b em{font-size:6.8px!important;line-height:1.1!important}

/* Reaction rail: chooser and summary never occupy the same layer at the same time. */
.fm-v279 .fm-video-card-v277 .shadow-video-actions,
.fm-v279 .fm-video-card-v278 .shadow-video-actions{width:68px!important;padding:7px 5px 8px!important;gap:7px!important;border-radius:26px!important}
.fm-v279 .fm-video-card-v277 .shadow-video-action,
.fm-v279 .fm-video-card-v278 .shadow-video-action{width:52px!important;min-height:52px!important;border-radius:17px!important}
.fm-v279 .fm-video-reaction-action{position:relative!important;display:grid!important;justify-items:center!important;gap:4px!important}

/* Kill the old wrapper-hover behavior first. */
.fm-v279 .fm-video-reaction-action:hover .fm-reaction-picker,
.fm-v279 .fm-video-reaction-action:focus-within .fm-reaction-picker{
  opacity:0!important;
  pointer-events:none!important;
  transform:translateX(7px) scale(.94)!important;
}

/* Only the main Reaction button opens the chooser on desktop; long-press uses is-picker-open. */
.fm-v279 .fm-video-reaction-action .fm-reaction-picker{
  right:64px!important;
  bottom:58px!important;
  gap:2px!important;
  padding:6px 7px!important;
  border-radius:999px!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateX(7px) scale(.94)!important;
  transform-origin:right bottom!important;
  z-index:32!important;
}
.fm-v279 .fm-video-reaction-action.is-picker-open .fm-reaction-picker,
.fm-v279 .fm-video-reaction-action .fm-reaction-picker:hover,
.fm-v279 .fm-video-reaction-action .fm-reaction-picker:focus-within{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
}
.fm-v279 .fm-video-reaction-action.is-picker-open .fm-js-reaction{
  background:rgba(255,255,255,.94)!important;
  color:#31405b!important;
  box-shadow:0 10px 24px rgba(41,56,94,.18)!important;
}
.fm-v279 .fm-video-reaction-action.is-picker-open .fm-js-reaction b,
.fm-v279 .fm-video-reaction-action.is-picker-open .fm-js-reaction small,
.fm-v279 .fm-video-reaction-action.is-picker-open .fm-js-reaction .fm-reaction-main-emoji{
  color:#31405b!important;
}
.fm-v279 .fm-video-reaction-action.is-summary-open .fm-reaction-picker{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateX(7px) scale(.94)!important;
}
.fm-v279 .fm-video-reaction-action .fm-reaction-picker button{width:43px!important;height:46px!important;border-radius:14px!important}
.fm-v279 .fm-video-reaction-action .fm-reaction-picker button>span{font-size:23px!important}
.fm-v279 .fm-video-reaction-action .fm-reaction-picker button>small{font-size:6.7px!important}

/* Compact summary button and popup, separate from picker. */
.fm-v279 .fm-video-reaction-summary-toggle{width:52px!important;min-height:25px!important;padding:3px 4px!important;border-radius:11px!important}
.fm-v279 .fm-video-reaction-stack i{width:14px!important;height:14px!important;font-size:8px!important}
.fm-v279 .fm-video-reaction-summary-toggle em{font-size:6.6px!important}
.fm-v279 .fm-video-reaction-popover{
  right:64px!important;
  bottom:-2px!important;
  width:170px!important;
  padding:8px!important;
  border-radius:15px!important;
  z-index:31!important;
}
.fm-v279 .fm-video-reaction-popover header{padding:1px 2px 6px!important;margin-bottom:3px!important}
.fm-v279 .fm-video-reaction-row{min-height:28px!important;padding:3px 6px!important}
.fm-v279 .fm-video-reaction-row>span{gap:6px!important;font-size:9px!important}
.fm-v279 .fm-video-reaction-row i{font-size:16px!important}
.fm-v279 .fm-video-reaction-row>b{font-size:9.5px!important}

@media(max-width:700px){
  .fm-v279 .fm-brand{min-width:0!important}
  .fm-v279 .fm-brand-tile{width:38px!important;height:38px!important}
  .fm-v279 .fm-brand-word{font-size:21px!important}
  .fm-v279 .fm-video-card-v277 .shadow-video-product,
  .fm-v279 .fm-video-card-v278 .shadow-video-product{width:min(238px,calc(100% - 4px))!important;grid-template-columns:33px minmax(0,1fr) auto!important;min-height:42px!important;padding:4px!important}
  .fm-v279 .fm-video-card-v277 .shadow-video-product>img,
  .fm-v279 .fm-video-card-v278 .shadow-video-product>img{width:33px!important;height:33px!important}
  .fm-v279 .fm-video-card-v277 .shadow-video-product>b,
  .fm-v279 .fm-video-card-v278 .shadow-video-product>b{min-width:50px!important;min-height:31px!important;padding:3px 6px!important}
  .fm-v279 .fm-video-reaction-action .fm-reaction-picker{right:57px!important;bottom:54px!important;padding:5px 6px!important}
  .fm-v279 .fm-video-reaction-action .fm-reaction-picker button{width:40px!important;height:43px!important}
  .fm-v279 .fm-video-reaction-popover{right:57px!important;width:164px!important}
}

@media(max-width:420px){
  .fm-v279 .fm-brand-tile{width:36px!important;height:36px!important}
  .fm-v279 .fm-brand-word{display:inline-flex!important;font-size:19px!important}
  .fm-v279 .fm-video-card-v277 .shadow-video-product,
  .fm-v279 .fm-video-card-v278 .shadow-video-product{width:min(222px,calc(100% - 4px))!important}
}
