*{ box-sizing:border-box; }
 .op-wrap{
 padding:14px 14px 90px;
 background:#fff;
 max-width:100%;
 overflow-x:hidden;
 }

/* force OP actions layout on PROFILE feed only */.profile-feed-scope .of-actions{
 display:flex !important;
 align-items:center !important;
 justify-content:space-between !important;
 padding:10px 12px !important;
 background:#fff !important;
}
.profile-feed-scope .of-left{
 display:flex !important;
 align-items:center !important;
 gap:18px !important;
 flex-wrap:nowrap !important;
}
.profile-feed-scope .of-action{
 display:inline-flex !important;
 align-items:center !important;
 gap:6px !important;
 white-space:nowrap !important;
}
.profile-feed-scope .of-action svg{
 width:22px !important;
 height:22px !important;
 stroke:currentColor !important;
}

 /* ===== Sell Fields (Betshar clean) ===== */ .bs-sell-fields{
 margin-top:12px;
 background:#fff;
 border:1px solid rgba(230,234,242,.95);
 border-radius:18px;
 box-shadow:0 10px 22px rgba(15,23,42,.06);
 padding:12px;
 }
 .bs-sell-head{
 padding:6px 6px 10px;
 border-bottom:1px solid rgba(230,234,242,.9);
 margin-bottom:12px;
 }
 .bs-sell-title{
 font-size:16px;
 font-weight:1000;
 color:#101828;
 letter-spacing:.01em;
 }
 .bs-sell-sub{
 margin-top:4px;
 font-size:12px;
 font-weight:800;
 color:#98a2b3;
 }
 .bs-sell-grid{
 display:grid;
 grid-template-columns: 1fr 1fr;
 gap:12px;
 }
 .bs-sell-field{ min-width:0; }
 .bs-sell-field label{
 display:block;
 font-weight:900;
 font-size:12px;
 color:#667085;
 letter-spacing:.03em;
 margin:2px 2px 6px;
 }

 .bs-sell-field input, .bs-sell-field select{
 width:100%;
 height:46px;
 border-radius:16px;
 border:1px solid var(--bs-line);
 background:#fff;
 padding:0 12px;
 font-size:14px;
 font-weight:800;
 color:#101828;
 outline:none;
 box-shadow:0 8px 18px rgba(15,23,42,.05);
 }

 .bs-sell-field input:focus, .bs-sell-field select:focus{
 border-color:rgba(0,77,130,.35);
 box-shadow:0 0 0 4px rgba(0,77,130,.12), 0 8px 18px rgba(15,23,42,.05);
 }
 @media (max-width: 420px){
 .bs-sell-grid{ grid-template-columns: 1fr; }
 }

 .mini-fab{
 width:42px;height:42px;border-radius:14px;
 background:#fff;
 border:1px solid var(--bs-line);
 box-shadow:0 10px 22px rgba(15,23,42,.06);
 display:flex;align-items:center;justify-content:center;
 font-weight:900;
 color:#1e6aa1;
 }

 /* =========================
 Comment bar
 ========================= */
 .bs-post-avatar{
 width:36px !important;
 height:36px !important;
 flex:0 0 36px !important;
 border-radius:14px !important;
 overflow:hidden !important;
 border:1px solid #e6eaf2 !important;
 background:#fff !important;
 display:flex !important;
 align-items:center !important;
 justify-content:center !important;
 }

 .bs-post-avatar img{
 width:100% !important;
 height:100% !important;
 display:block !important;
 object-fit:cover !important;
 object-position:center !important;
 }

 .bs-comment-wrap{
 max-height:0;
 overflow:hidden;
 transition:max-height .25s ease;
 }
 .bs-comment-wrap.open{ max-height:220px; }

 .bs-comment-bar{
 display:flex;
 align-items:center;
 gap:10px;
 padding:12px 12px;
 border-top:1px solid var(--bs-line);
 background:linear-gradient(180deg, #fff, #fbfcff);
 }

 .bs-comment-avatar{
 width:36px !important;
 height:36px !important;
 flex:0 0 36px !important;
 border-radius:14px !important;
 overflow:hidden !important;
 border:1px solid #e6eaf2 !important;
 background:#fff !important;
 display:flex !important;
 align-items:center !important;
 justify-content:center !important;
 }

 .bs-comment-avatar img{
 width:100% !important;
 height:100% !important;
 display:block !important;
 object-fit:cover !important;
 object-position:center !important;
 }

 .bs-comment-input{
 flex:1 1 auto;
 height:42px;
 border-radius:999px;
 border:1px solid var(--bs-line);
 background:#fff;
 padding:0 14px;
 outline:none;
 font-size:15px;
 color:#101828;
 min-width:0;
 }
 .bs-comment-input:focus{
 border-color:rgba(0,77,130,.35);
 box-shadow:0 0 0 4px rgba(0,77,130,.12);
 }

 .bs-comment-tools{
 display:flex;
 align-items:center;
 gap:8px;
 flex:0 0 auto;
 margin-left:0;
 }

 .bs-tool-btn{
 border:0;
 background:transparent;
 padding:6px;
 border-radius:10px;
 cursor:pointer;
 }
 .bs-tool-btn:active{ transform:scale(.98); }

 .bs-gif-pill{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 height:28px;
 padding:0 10px;
 border-radius:999px;
 background:rgba(0,77,130,.10);
 color:var(--bs-blue);
 font-weight:800;
 letter-spacing:.4px;
 font-size:12px;
 border:1px solid rgba(0,77,130,.18);
 white-space:nowrap;
 }

 .bs-icon{
 width:20px;
 height:20px;
 display:block;
 fill:currentColor;
 }
 .bs-tool-btn .bs-icon{ color:var(--bs-blue2); }
 .bs-send-btn .bs-icon{ color:#fff; }

 .bs-send-btn{
 width:42px;
 height:42px;
 border-radius:999px;
 border:0;
 background:var(--bs-blue);
 box-shadow:0 10px 18px rgba(0,77,130,.22);
 display:inline-flex;
 align-items:center;
 justify-content:center;
 cursor:pointer;
 }

 .bs-hidden-file{ display:none; }

 .bs-attach-preview{
 display:flex;
 align-items:center;
 gap:10px;
 padding:10px 12px 14px;
 border-top:1px dashed rgba(0,77,130,.22);
 background:#fff;
 }
 .bs-attach-preview img{
 width:64px;
 height:64px;
 object-fit:cover;
 border-radius:14px;
 border:1px solid var(--bs-line);
 }

 .bs-remove-attach{
 border:1px solid rgba(0,77,130,.22);
 background:#fff;
 color:var(--bs-blue);
 font-weight:900;
 border-radius:999px;
 padding:8px 12px;
 cursor:pointer;
 }

 .section-title{
 margin-top:10px;
 padding:12px 0 10px;
 border-bottom:1px solid rgba(230,234,242,.9);
 }
 .section-title h1{
 margin:0;
 font-size:20px;
 font-weight:900;
 letter-spacing:.01em;
 margin-top:10px;
 margin-bottom:20px;
 }

 #btnGallery svg{ color:#0b5e90; }
 #btnTag svg{ color:#56bfe0; }

 .composer-icons-left{
 display:flex;
 justify-content:flex-start;
 gap:10px;
 padding:10px 0 4px;
 }
 .composer-icons-left .icon-btn{
 width:36px;height:36px;border-radius:14px;
 background:#fff;
 border:1px solid #e6eaf2;
 box-shadow:0 8px 18px rgba(15,23,42,.05);
 display:flex;align-items:center;justify-content:center;
 padding:0;
 cursor:pointer;
 }
 .composer-icons-left .icon-btn svg{
 width:22px;height:22px;color:#0b5e90;
 }

 .composer{
 margin-top:12px;
 border:1px solid rgba(220,225,235,.95);
 border-radius:18px;
 padding:12px;
 background:#fff;
 max-width:100%;
 overflow:hidden;
 }
 .composer-row{
 display:flex;
 gap:12px;
 align-items:flex-start;
 max-width:100%;
 }
 .avatar{
 width:32px;height:32px;border-radius:999px;
 background:#e9edf3;
 flex:0 0 auto;
 }
 .textarea{
 flex:1;
 border:1px solid rgba(220,225,235,.95);
 border-radius:14px;
 padding:12px 12px;
 min-height:60px;
 height:auto;
 resize:none;
 overflow:hidden;
 color:#111;
 font-style:italic;
 font-weight:700;
 font-size:14px;
 line-height:1.35;
 display:block;
 background:#fff;
 max-width:100%;
 }

 .post-btn{
 margin:10px auto 12px;
 width:78%;
 height:52px;
 border:none;
 border-radius:999px;
 background:var(--bs-pill);
 color:#fff;
 font-weight:900;
 letter-spacing:.16em;
 font-size:15px;
 display:flex;
 align-items:center;
 justify-content:center;
 box-shadow:0 8px 18px rgba(86,191,224,.28);
 max-width:100%;
 }

 .dd-row{ display:flex; gap:12px; margin-top:2px; max-width:100%; }
 .dd-wrap{ flex:1; min-width:0; position:relative; }
 .dd{
 width:100%;
 height:40px;
 border-radius:16px;
 border:1px solid var(--bs-line);
 background:#fff;
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:0 12px;
 box-shadow:0 10px 22px rgba(15,23,42,.05);
 font-weight:500;
 font-size:14px;
 min-width:0;
 cursor:pointer;
 user-select:none;
 }
 .dd:active{ transform:translateY(1px); }
 .dd .left{ display:flex; align-items:center; gap:10px; min-width:0; }
 .dd .left span:last-child{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
 .dd .caret{
 color:#7c879a;
 font-size:12px;
 font-weight:900;
 margin-left:10px;
 flex:0 0 auto;
 transition:transform .18s ease;
 }
 .dd.open .caret{ transform:rotate(180deg); }

 .dd-menu{
 position:absolute;
 top:46px;
 left:0;
 width:100%;
 background:#fff;
 border:1px solid rgba(230,234,242,.95);
 border-radius:14px;
 box-shadow:0 16px 28px rgba(15,23,42,.12);
 overflow:hidden;
 display:none;
 z-index:9999;
 }
 .dd-wrap.open .dd-menu{ display:block; }
 .dd-menu .dd-head{
 padding:10px 12px;
 font-weight:900;
 color:#667085;
 background:#f6f7fb;
 border-bottom:1px solid rgba(230,234,242,.95);
 }
 .dd-item{
 padding:12px 12px;
 font-weight:800;
 color:#101828;
 background:#fff;
 border-bottom:1px solid rgba(230,234,242,.75);
 cursor:pointer;
 }
 .dd-item:last-child{ border-bottom:none; }
 .dd-item:hover{ background:#f6f8fc; }
 .dd-item.muted{ color:#98a2b3; font-weight:800; }

 .chips-wrap{
 margin-top:12px;
 background:#edf1f7;
 border-radius:18px;
 padding:10px;
 max-width:100%;
 overflow:hidden;
 margin-bottom:0px;
 }

 .tail-icon{
  width:18px;
  height:18px;
  display:block;
  flex:0 0 18px;
  color:currentColor;
}

 .chips{
 display:flex;
 gap:12px;
 overflow-x:auto;
 -webkit-overflow-scrolling:touch;
 scrollbar-width:none;
 } .chips::-webkit-scrollbar{ display:none; }
 .chip{
 flex:0 0 auto;
 background:#fff;
 border:1px solid var(--bs-line);
 box-shadow:0 10px 22px rgba(15,23,42,.05);
 border-radius:16px;
 padding:10px 12px;
 font-weight:900;
 font-size:14px;
 display:flex;
 align-items:center;
 gap:10px;
 min-width:0;
 justify-content:center;
 white-space:nowrap;
 } .chip .chip-ico{
 width:18px;height:18px;
 object-fit:contain;
 display:inline-block;
 flex:0 0 auto;
 }
 .feed-list{ margin-top:0; }
 .post-gap{
  display:none !important;
}

 /* SELL MODE overlay + blur only media */ .post-media{ position: relative; }

 .post-media.is-sell > img,
 .post-media.is-sell > video,
 .post-media.is-sell .bs-carousel-slide > img, .post-media.is-sell .bs-carousel-slide > video{
 filter: blur(7px);
 transform: scale(1.05);
 }

 .post-media > img, .post-media > video{
 width: 100%;
 height: auto;
 display: block;
 object-fit: cover;
 }
 .bs-sell-overlay{
 position: absolute;
 inset: 0;
 display: flex;
 align-items: center;
 justify-content: center;
 z-index: 6;
 pointer-events: none;
 }
 .bs-sell-card{
 background: #ffffff;
 border-radius: 16px;
 padding: 16px;
 width: 88%;
 max-width: 360px;
 box-shadow: 0 14px 32px rgba(0,0,0,.18);
 font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 pointer-events: none;
 }
 .bs-sell-top{
 display: flex;
 align-items: center;
 margin-bottom: 10px;
 }
 .bs-sell-pill{
 background: #0b5e90;
 color: #fff;
 padding: 6px 14px;
 border-radius: 999px;
 font-size: 12px;
 font-weight: 700;
 letter-spacing: .4px;
 }
 .bs-sell-lock{
 margin-left: auto;
 width: 36px;
 height: 36px;
 border-radius: 10px;
 background: #f1f4f8;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #0b5e90;
 }
 .bs-sell-lines{
 margin-top: 8px;
 font-size: 15px;
 color: #1f2937;
 font-weight:600;
 } .bs-sell-lines b{
 font-weight:700;
 color:#111827;
 } .bs-sell-lines div{ margin-bottom:4px; }
 .bs-sell-bottom{
 display: flex;
 align-items: center;
 margin-top: 14px;
 }
 .bs-sell-chips{
 display: flex;
 gap: 8px;
 flex-wrap: wrap;
 }
 .bs-chip{
 background: #eef2f7;
 padding: 6px 12px;
 border-radius: 999px;
 font-size: 12px;
 font-weight: 600;
 color: #0f172a;
 }
 .bs-sell-price{
 margin-left: auto;
 background: #0f172a;
 color: #ffffff;
 padding: 10px 14px;
 border-radius: 999px;
 font-size: 14px;
 font-weight: 800;
 }
 .feed-card{
  background:var(--card);
  border:1px solid var(--bs-line);
  border-radius:20px;
  box-shadow:0 10px 22px rgba(15,23,42,.06);
  overflow:hidden;
  width:100vw;
  max-width:100vw;
  position:relative;
  left:50%;
  transform:translateX(-50%);
  margin-bottom:12px;
}
 .card-top{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:12px 12px 8px;
 margin-bottom:13px;
 }
 .tail-btn{
 appearance:none;
 -webkit-appearance:none;
 border:1px solid var(--line,#e6eaf2);
 background:#fff;
 border-radius:999px;
 padding:6px 10px;
 display:inline-flex;
 align-items:center;
 gap:6px;
 font-weight:800;
 font-size:14px;
 line-height:1;
 color:var(--blue,#0b5e90);
 box-shadow:0 6px 14px rgba(15,23,42,.06);
 cursor:pointer;
 } .tail-btn:active{ transform:scale(.98); }
 .tail-count{
 min-width:30px;
 height:30px;
 padding:0 9px;
 border-radius:999px;
 background:rgba(11,94,144,.10);
 color:var(--blue,#0b5e90);
 font-weight:900;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 font-size:13px;
 line-height:1;
 border:1px solid rgba(11,94,144,.12);
 }
 .tail-wrap{
 display:inline-flex;
 align-items:center;
 gap:8px;
 }
 .tail-wrap[data-tailed="1"] .tail-btn{
 background:rgba(86,191,224,.22);
 border-color:rgba(86,191,224,.45);
 }
 .kebab{
 width:34px;height:34px;border-radius:12px;
 display:flex;align-items:center;justify-content:center;
 color:#98a2b3;
 flex:0 0 auto;
 } .kebab svg{ width:18px;height:18px; }
 .post-body.is-short{
 font-size: 24px;
 font-weight: 800;
 line-height: 1.05;
 letter-spacing: 0;
 transform: scaleY(1.08);
 transform-origin: center;
 padding: 14px 12px 16px;
 }

 .feed-card.is-sell .post-media img, .feed-card.is-sell .post-media video{
 filter: blur(7px) !important;
 }
 .user-row{
 display:flex;
 align-items:flex-start;
 gap:10px;
 padding:4px 12px 8px;
 } .user-avatar{
 width:36px;height:36px;border-radius:50%;
 background:#e9edf3;
 overflow:hidden;
 flex:0 0 auto;
 } .user-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
 .user-meta{ flex:1; min-width:0; } .user-name{
 font-weight:1000;
 font-size:15px;
 color:#111;
 line-height:1.1;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
 } .user-time{
 margin-top:6px;
 margin-bottom:10px;
 display:inline-flex;
 align-items:center;
 font-weight:900;
 font-size:10px;
 color:#111;
 background:#eef2f7;
 border:1px solid var(--bs-line);
 padding:6px 10px;
 border-radius:999px;
 }
 .post-body{
 padding:0 12px 12px;
 font-size:18px;
 line-height:1.25;
 color:#111;
 } .post-body .tag{ color:#0b5e90; font-weight:900; text-decoration:none; } .post-body a.tag{ color:#0b5e90; font-weight:900; text-decoration:none; } .post-body a.tag:visited{ color:#0b5e90; } .post-body a.tag:hover, .post-body a.tag:active{ color:#0b5e90; opacity:.9; text-decoration:none; }
 :root{ --bsMediaMaxH: 420px; }
 .post-media{
 max-height: var(--bsMediaMaxH);
 overflow: hidden;
 position:relative;
 }
 .bs-carousel{
 position: relative;
 width: 100%;
 max-height: var(--bsMediaMaxH);
 overflow: hidden;
 }
 .bs-carousel-track{
 display: flex;
 width: 100%;
 height: 100%;
 will-change: transform;
 }
 .bs-carousel-slide{
 flex: 0 0 100%;
 width: 100%;
 max-height: var(--bsMediaMaxH);
 overflow: hidden;
 }

 .post-media > img, .bs-carousel-slide img{
 width: 100% !important;
 display: block;
 margin: 0 auto;
 object-position: center center;
 }
 .bs-carousel-counter{
  position:absolute;
  top:12px;
  right:12px;

  min-width:54px;
  height:40px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:0 14px;

  border-radius:999px;

  background:rgba(74, 86, 128, .88);

  border:1px solid rgba(255,255,255,.34);

  color:#fff;

  font-size:15px;
  font-weight:1000;
  line-height:1;

  letter-spacing:.02em;

  text-shadow:0 1px 2px rgba(0,0,0,.24);

  box-shadow:
    0 6px 18px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.12);

  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);

  z-index:20;
}
 .bs-dots{
 display:flex;
 justify-content:center;
 gap:8px;
 padding:10px 0 12px;
 background:#fff;
 } .bs-dot{
 width:8px;height:8px;border-radius:999px;
 border:1px solid rgba(0,77,130,.22);
 background:rgba(0,77,130,.10);
 } .bs-dot.is-active{
 background:rgba(0,77,130,.95);
 border-color:rgba(0,77,130,.95);
 }
 .feed-actions{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:10px 12px;
 background:#fff;
 } .of-left{ display:flex; align-items:center; gap:18px; } .of-action{
 display:flex;
 align-items:center;
 gap:6px;
 font-size:15px;
 font-weight:700;
 color:#667085;
 cursor:pointer;
 } .of-action svg{ width:22px; height:22px; stroke:currentColor; } .of-like{ color:#1d9bf0; }

 .bs-thread{ padding:6px 0 2px; background:#fff; } .bs-comment-item{ display:flex; gap:12px; padding:14px 12px; } .bs-comment-item + .bs-comment-item{ border-top:1px solid rgba(230,234,242,.65); } .bs-c-avatar{
 width:42px;height:42px;border-radius:999px;
 background:#eef2f7;
 border:1px solid rgba(230,234,242,.95);
 display:flex;align-items:center;justify-content:center;
 flex:0 0 auto;
 overflow:hidden;
 } .bs-c-avatar .init{ font-weight:1000; color:#0b5e90; font-size:14px; } .bs-c-main{ flex:1; min-width:0; } .bs-c-name{ font-weight:1000; color:#111; font-size:15px; line-height:1.1; } .bs-c-text{ margin-top:6px; font-weight:700; color:#111; font-size:14px; line-height:1.35; word-wrap:break-word; } .bs-c-meta{
 margin-top:8px;
 display:flex;
 gap:14px;
 align-items:center;
 color:#98a2b3;
 font-weight:900;
 font-size:12px;
 } .bs-c-reply{ color:#98a2b3; cursor:pointer; } .bs-c-reply:active{ transform:translateY(1px); }
 .bs-c-like{
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#98a2b3;
  cursor:pointer;
}
.bs-c-like .bs-like-ico{
  width:20px !important;
  height:20px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-right:0 !important;
}
.bs-c-like .bs-like-ico .bs-heart{
  width:20px !important;
  height:20px !important;
  display:none !important;
}
.bs-c-like .bs-like-ico .bs-heart-o{
  display:block !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2.2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.bs-c-like.is-liked{
  color:#ff3b6b;
}
.bs-c-like.is-liked .bs-heart-o{
  display:none !important;
}
.bs-c-like.is-liked .bs-heart-f{
  display:block !important;
  fill:currentColor !important;
  stroke:none !important;
}

 /* ✅ Multi-image composer preview grid */ .bs-media-grid{
 display:grid;
 grid-template-columns: repeat(3, 1fr);
 gap:10px;
 margin-top:10px;
 } .bs-media-thumb{
 position:relative;
 width:100%;
 aspect-ratio: 1 / 1;
 border:1px solid rgba(230,234,242,.95);
 border-radius:14px;
 overflow:hidden;
 background:#f4f6fb;
 box-shadow:0 10px 22px rgba(15,23,42,.06);
 } .bs-media-thumb img{
 width:100%; height:100%;
 object-fit:cover;
 display:block;
 } .bs-media-x{
 position:absolute;
 top:6px; right:6px;
 width:28px; height:28px;
 border:none;
 border-radius:999px;
 background:rgba(17,24,39,.72);
 color:#fff;
 font-weight:1000;
 display:flex;
 align-items:center;
 justify-content:center;
 cursor:pointer;
 line-height:28px;
 }

 /* STORIES rail nudge (kept) */ .bs-stories-rail{
 display:flex;
 gap:14px;
 overflow-x:auto;
 -webkit-overflow-scrolling:touch;
 scrollbar-width:none;
 padding:10px 14px 6px;
 background:#fff;
 } .bs-stories-rail::-webkit-scrollbar{ display:none; } .bs-story-item{
 flex:0 0 auto;
 width:72px;
 text-align:center;
 user-select:none;
 } .bs-stories-rail .bs-story-ring{
 width:64px;height:64px;
 border-radius:999px;
 padding:3px;
 background:#cfd6e4;
 box-shadow:0 8px 18px rgba(15,23,42,.08);
 display:flex;
 align-items:center;
 justify-content:center;
 margin:0 auto 6px;
 position:relative;
 } .bs-stories-rail { margin-top:-25px; margin-left:-15px; } .bs-stories-rail .bs-story-ring.unseen{
 background:linear-gradient(135deg, #56bfe0, var(--bs-blue2));
 } .bs-story-thumb{
 width:58px;height:58px;
 border-radius:999px;
 background:#f1f4fa;
 border:2px solid #fff;
 background-size:cover;
 background-position:center;
 } .bs-story-label{
 font-size:12px;
 color:#2b3445;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
 } .bs-story-plus{ position:relative; } .bs-plus-badge{
 position:absolute;
 right:2px; bottom:4px;
 width:18px;height:18px;
 border-radius:999px;
 background:var(--bs-blue2);
 color:#fff;
 font-weight:700;
 font-size:14px;
 display:flex;
 align-items:center;
 justify-content:center;
 border:2px solid #fff;
 }
 .bs-story-modal{ position:fixed; inset:0; display:none; z-index:99999; } .bs-story-modal.open{ display:block; } .bs-story-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.65); } .bs-story-card{
 position:absolute;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:min(92vw, 420px);
 height:min(80vh, 740px);
 background:#0b0f19;
 border-radius:18px;
 box-shadow:var(--bs-shadow);
 overflow:hidden;
 display:flex;
 flex-direction:column;
 } .bs-story-top{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:12px 12px 8px;
 color:#fff;
 } .bs-story-user{ display:flex; align-items:center; gap:10px; } .bs-story-avatar{
 width:34px;height:34px;border-radius:999px;
 background:#22304a;
 background-size:cover;
 background-position:center;
 } .bs-story-name{ font-size:14px; font-weight:600; } .bs-story-close{ background:transparent; border:0; color:#fff; font-size:18px; cursor:pointer; } .bs-story-media{ flex:1; display:flex; align-items:center; justify-content:center; background:#000; } .bs-story-media img, .bs-story-media video{ width:100%; height:100%; object-fit:contain; } .bs-story-caption{
 color:#fff;
 font-size:14px;
 padding:10px 12px 14px;
 min-height:46px;
 background:linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0));
 } .bs-story-nav{ position:absolute; inset:0; display:flex; justify-content:space-between; pointer-events:none; } .bs-story-btn{
 width:20%;
 pointer-events:auto;
 background:transparent;
 border:0;
 color:#fff;
 font-size:40px;
 opacity:.35;
 cursor:pointer;
 } .bs-story-btn:active{ opacity:.6; } .bs-story-progress{
 position:absolute;
 top:0; left:0; right:0;
 height:3px;
 display:flex;
 gap:4px;
 padding:8px 10px 0;
 } .bs-story-bar{
 flex:1;
 height:3px;
 background:rgba(255,255,255,.25);
 border-radius:99px;
 overflow:hidden;
 } .bs-story-bar > i{
 display:block;
 height:100%;
 width:0%;
 background:#fff;
 }

/* ✅ PROFILE HEADER buttons only (Edit/Share) */.of-strip .of-actions{
 display:flex;
 justify-content:flex-end;
 align-items:center;
 gap:12px;
 padding-left:118px;
}

/* ✅ POST action bar (Like/Comment/Tip) should NOT inherit profile header spacing */.feed-card .of-actions{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:10px 12px;
 background:#fff;
}

/* keep the left group tight like OP */.feed-card .of-left{
 display:flex;
 align-items:center;
 gap:18px;
 justify-content:flex-start;
 width:100%;
}

/* PROFILE DETAILS SECTION */.bs-details{
  background:#ffffff;
  border-top:1px solid #e9edf5;
  border-bottom:1px solid #e9edf5;
  border-radius:0;
  overflow:hidden;
  box-shadow:none;
}

/* Header */.bs-details-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  font-weight:900;
  font-size:16px;
  color:#0f172a;
}

/* Rows */.bs-detail-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-top:1px solid #f1f4f9;
}
.bs-detail-row:first-of-type{
  border-top:none;
}

/* Icon circle */.bs-pd-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  background:linear-gradient(180deg,#0b5e90,#004D82);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#ffffff;
  flex:0 0 auto;
  box-shadow:0 6px 12px rgba(0,77,130,.18);
}

/* Text */.bs-text{
  font-weight:900;
  color:#0f172a;
  font-size:15px;
}

/* W/L coloring */.wl-win{ color:#16a34a; font-weight:1000; }.wl-loss{ color:#ef4444; font-weight:1000; }

/* Edit button */.bs-edit-btn{
  border:0;
  background:transparent;
  font-size:16px;
  cursor:pointer;
  color:#0b5e90;
}

/* ===== FORCE PROFILE ACTION ICONS (SVG + IMG) SAME SIZE ===== */
.of-actions
.of-actions .of-action img,
.of-actions img{
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  min-height:22px !important;
  display:block !important;
}

/* stop flex from squeezing */
.of-actions .of-action svg,.of-actions .of-action img{
  flex:0 0 22px !important;
}

/* if the svg viewBox makes it look tiny, this helps */.of-actions .of-action svg{
  overflow: visible !important;
}

/* ✅ Profile info: smaller + more left */.bs-details{
  padding: 6px 10px 2px !important; /* was 10px 16px 4px */
}
.bs-details-header{
  margin-bottom: 4px !important;
}
.bs-details-header span{
  font-size: 14px !important; /* smaller title */
  font-weight: 800 !important;
}

/* rows tighter + smaller text */.bs-detail-row{
  gap: 8px !important;
  padding: 4px 0 !important; /* was 6px 0 */
  font-size: 13px !important; /* was 14px */
  font-weight: 600 !important;
}

/* icons smaller */.bs-pd-icon{
  width: 16px !important;
  flex: 0 0 16px !important;
  font-size: 14px !important;
}

/* text tighter */.bs-text{
  line-height: 1.2 !important;
}

/* Profile info icons — white circle, blue icon */.bs-pd-icon{
  width:36px !important;
  height:36px !important;
  flex:0 0 36px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:999px !important;
  background:#ffffff !important; /* white circle */
  border:1px solid rgba(0,77,130,.18) !important;

  color:#004D82 !important; /* icon color */
  font-size:18px !important;
  line-height:1 !important;
  box-shadow:0 4px 10px rgba(15,23,42,.06); /* optional soft depth */
}

/* ensure svg icons inherit color */.bs-pd-icon svg{
  fill:#004D82 !important;
  stroke:#004D82 !important;
}

/* keep row alignment */.bs-detail-row{
  align-items:center !important;
}

.poll-compose-card{
  background:#fff;
  border:1px solid #e6eaf2;
  border-radius:18px;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
  padding:12px;
  margin:10px 12px;
}.poll-compose-title{
  font-weight:1000;
  font-size:16px;
  margin-bottom:10px;
  color:#101828;
}.poll-inp{
  width:100%;
  height:46px;
  border-radius:14px;
  border:1px solid #e6eaf2;
  padding:0 12px;
  font-weight:800;
  margin-bottom:10px;
  outline:none;
}.poll-addopt{
  border:0;
  background:#eef6ff;
  color:#0b5e90;
  font-weight:900;
  border-radius:999px;
  height:40px;
  padding:0 14px;
  cursor:pointer;
}.poll-post{
  width:100%;
  margin-top:10px;
  height:46px;
  border:0;
  border-radius:999px;
  background:#56bfe0;
  color:#fff;
  font-weight:1000;
  letter-spacing:.12em;
}

.bs-poll-opt{
  width:100%;
  text-align:left;
  border:1px solid rgba(230,234,242,.95);
  background:#fff;
  border-radius:16px;
  padding:12px;
  margin-top:10px;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
  cursor:pointer;
}.bs-poll-opt-top{ display:flex; justify-content:space-between; gap:10px; }.bs-poll-label{ font-weight:1000; color:#101828; }.bs-poll-meta{ font-weight:900; color:#98a2b3; font-size:12px; white-space:nowrap; }.bs-poll-bar{ margin-top:10px; height:8px; background:#eef2f7; border-radius:999px; overflow:hidden; }.bs-poll-bar i{ display:block; height:100%; background:rgba(11,94,144,.75); width:0%; border-radius:999px; }

/* ===== LIKE HEART: show ONLY one icon (fix double hearts) ===== */.bs-like-ico{
  width:22px !important;
  height:22px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-right:6px;
}
.bs-like-ico .bs-heart{
  width:22px !important;
  height:22px !important;
  display:none !important; /* hide ALL hearts by default */
}

/* default state: show outline only */.bs-like-ico .bs-heart-o{
  display:block !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2.2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* liked state: show filled only */.of-action.of-like.is-liked .bs-heart-o{
  display:none !important;
}.of-action.of-like.is-liked .bs-heart-f{
  display:block !important;
  fill:currentColor !important;
  stroke:none !important;
}

/* ===== Rating Stars (Betshar) ===== */.bs-rating {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}
.bs-stars {
  display: inline-flex;
  gap: 4px;
}
.bs-star {
  width: 18px;
  height: 18px;
  display: inline-block;
  cursor: pointer;
  color: rgba(0,77,130,.25);
  transform: translateY(1px);
}.bs-star svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
}

.bs-star.is-on { color: #56bfe0; } /* Betshar pill */.bs-star.is-half { color: rgba(86,191,224,.55); }
.bs-rating-meta {
  font-weight: 900;
  font-size: 12px;
  color: #667085;
}
.bs-rating.readonly .bs-star { cursor: default; }

.like-num[data-showlikes="1"]{
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}

/* ===== Lazy image loading (OnlyFans feel) ===== */.bsh-lazy-wrap{
  position:relative;
  background:#f4f6fb;
  overflow:hidden;
}
.bsh-lazy{
  filter: blur(14px);
  transform: scale(1.04);
  transition: filter .25s ease, transform .25s ease, opacity .25s ease;
  opacity:.92;
}
.bsh-lazy.is-loaded{
  filter: blur(0);
  transform: scale(1);
  opacity:1;
}

/* Infinite scroll loader polish (OP + PROFILE) */
#bshInfiniteStatus,#profileInfiniteStatus{
  border:1px solid rgba(230,224,242,.95);
  background:#fff;
  border-radius:13px;
  box-shadow:0 10px 22px rgba(15,23,42,.06);

  text-align:center;
  font-weight:600;
  color:#667085;
  padding:14px 0;
  margin:12px 14px;
}

/* =========================
   TAG MODAL
========================= */.bs-tag-modal{
 position:fixed; inset:0; z-index:2147483000;
}.bs-tag-backdrop{
 position:absolute; inset:0;
 background:rgba(0,0,0,.45);
 backdrop-filter: blur(2px);
}.bs-tag-sheet{
 position:absolute; left:10px; right:10px; bottom:10px;
 background:#fff;
 border-radius:22px;
 box-shadow:0 22px 60px rgba(15,23,42,.25);
 overflow:hidden;
 border:1px solid rgba(0,0,0,.06);
}.bs-tag-head{
 display:flex; align-items:center; justify-content:space-between;
 padding:14px 14px 10px;
 border-bottom:1px solid var(--bs-line);
}.bs-tag-title{
 font-weight:1000; font-size:16px; color:#101828;
}.bs-tag-x{
 width:40px; height:40px;
 border-radius:14px;
 border:1px solid var(--bs-line);
 background:#fff;
 font-size:24px; font-weight:900;
 line-height:36px;
 display:flex; align-items:center; justify-content:center;
}.bs-tag-search{ padding:10px 14px 12px; }.bs-tag-search input{
 width:100%;
 height:44px;
 border-radius:14px;
 border:1px solid var(--bs-line);
 padding:0 12px;
 font-weight:900;
 outline:none;
}.bs-tag-results{
 max-height:320px;
 overflow:auto;
 padding:4px 6px 10px;
}.bs-tag-row{
 display:flex; align-items:center; gap:10px;
 padding:10px 10px;
 border-radius:16px;
 cursor:pointer;
}.bs-tag-row:hover{ background:#f3f6fb; }.bs-tag-ava{
 width:38px; height:38px; border-radius:999px;
 object-fit:cover;
 background:#e9eef6;
 flex:0 0 auto;
}.bs-tag-name{
 font-weight:1000; color:#101828; font-size:14px; line-height:1.1;
}.bs-tag-username{
 margin-top:2px;
 font-weight:900; color:#667085; font-size:12px;
}.bs-tag-foot{
 padding:10px 14px 14px;
 border-top:1px solid var(--bs-line);
}.bs-tag-hint{ font-weight:900; color:#667085; font-size:12px; }

/* @mention styling in post body */.post-body .bs-mention{
  color: var(--bs-blue2);
  font-weight: 1000;
  text-decoration: none;
}

.bs-post-link{
  color:#0b5e90;
  font-weight:900;
  text-decoration:none;
  word-break:break-word;
}
.bs-post-link:hover{
  text-decoration:underline;
}

.bs-replying-to{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
  padding:8px 12px;
  border-radius:14px;
  background:#f4f7fb;
  border:1px solid rgba(230,234,242,.95);
  font-size:12px;
  font-weight:900;
  color:#667085;
}
.bs-replying-to .who{
  color:#0b5e90;
  font-weight:1000;
}
.bs-reply-cancel{
  border:0;
  background:transparent;
  color:#98a2b3;
  font-size:18px;
  font-weight:1000;
  cursor:pointer;
  line-height:1;
}
.bs-replies-wrap{
  margin-left:54px;
  margin-top:6px;
}
.bs-reply-item{
  display:flex;
  gap:10px;
  padding:10px 0 0;
}
.bs-reply-avatar{
  width:30px;
  height:30px;
  border-radius:999px;
  overflow:hidden;
  background:#eef2f7;
  flex:0 0 30px;
}
.bs-reply-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.bs-reply-main{
  flex:1;
  min-width:0;
}
.bs-reply-name{
  font-weight:1000;
  color:#111;
  font-size:13px;
}
.bs-reply-text{
  margin-top:4px;
  font-weight:700;
  color:#111;
  font-size:13px;
  line-height:1.35;
  word-wrap:break-word;
}
.bs-reply-meta{
  margin-top:6px;
  display:flex;
  gap:12px;
  align-items:center;
  color:#98a2b3;
  font-weight:900;
  font-size:11px;
}
.bs-view-replies{
  margin-left:54px;
  margin-top:8px;
  color:#667085;
  font-weight:1000;
  font-size:13px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.bs-view-replies:before{
  content:"";
  width:28px;
  height:1px;
  background:rgba(152,162,179,.6);
  display:inline-block;
}

.tail-wrap[data-tailed="1"] .tail-btn{
  color:#004D82;
  border-color:#56bfe0;
  background:rgba(0,77,130,.10);
  box-shadow:0 4px 12px rgba(0,77,130,.15);
}

.bs-unfriend-sheet{
  border-top-left-radius:22px;
  border-top-right-radius:22px;
  overflow:hidden;
}
.bs-unfriend-handle{
  width:44px;
  height:5px;
  border-radius:999px;
  background:#d7deea;
  margin:10px auto 2px;
}
.bs-unfriend-head{
  border-bottom:none;
  padding-bottom:8px;
}
.bs-unfriend-copy{
  color:#667085;
  font-size:14px;
  font-weight:700;
  line-height:1.45;
  padding-bottom:8px;
}
.bs-unfriend-actions{
  display:flex;
  gap:10px;
  margin-top:10px;
}
.bs-btn-danger{
  flex:1;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid transparent;
  background:linear-gradient(180deg, #ff6b6b, #e11d48);
  color:#fff;
  font-weight:900;
  box-shadow:0 10px 20px rgba(225,29,72,.20);
}

.bs-block-btn{
  border-color:rgba(239,68,68,.18) !important;
}
.bs-block-modal{
  position:fixed;
  inset:0;
  z-index:2147483646;
}
.bs-block-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.52);
  opacity:0;
  transition:opacity .22s ease;
}
.bs-block-sheet{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(230,234,242,.95);
  box-shadow:0 24px 60px rgba(15,23,42,.28);
  overflow:hidden;
  transform:translateY(24px);
  opacity:0;
  transition:transform .22s ease, opacity .22s ease;
}
.bs-block-modal.show .bs-block-backdrop{
  opacity:1;
}
.bs-block-modal.show .bs-block-sheet{
  transform:translateY(0);
  opacity:1;
}
.bs-block-handle{
  width:44px;
  height:5px;
  border-radius:999px;
  background:#d7deea;
  margin:10px auto 2px;
}
.bs-block-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px 8px;
}
.bs-block-title{
  font-size:16px;
  font-weight:1000;
  color:#101828;
}
.bs-block-close{
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid #e6eaf2;
  background:#fff;
  color:#667085;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.bs-block-body{
  padding:8px 14px 16px;
}
.bs-block-copy{
  text-align:center;
  font-size:18px;
  line-height:1.35;
  font-weight:1000;
  color:#101828;
}
.bs-block-sub{
  margin-top:8px;
  text-align:center;
  font-size:14px;
  line-height:1.45;
  font-weight:700;
  color:#667085;
}
.bs-block-actions{
  display:flex;
  gap:10px;
  margin-top:18px;
}
.bs-block-cancel{
  flex:1;
  height:48px;
  border-radius:14px;
  border:1px solid #e6eaf2;
  background:#fff;
  color:#111827;
  font-weight:900;
  cursor:pointer;
}
.bs-block-confirm{
  width:100%;
  height:48px;
  border:none;
  border-radius:14px;
  background:linear-gradient(180deg,#fb7185,#e11d48);
  color:#fff;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(225,29,72,.22);
}

.bs-block-close:active,
.bs-block-cancel:active,.bs-block-confirm:active{
  transform:scale(.98);
}

.bs-toast{
  position:fixed;
  left:50%;
  bottom:90px;
  transform:translateX(-50%) translateY(20px);
  background:#101828;
  color:#fff;
  padding:14px 18px;
  border-radius:16px;
  font-weight:900;
  font-size:14px;
  box-shadow:0 16px 32px rgba(0,0,0,.22);
  z-index:2147483647;
  opacity:0;
  pointer-events:none;
  transition:opacity .22s ease, transform .22s ease;
}
.bs-toast.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

.bs-friend-requests-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.bs-friend-request-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(230,234,242,.7);
}
.bs-friend-request-row:last-child{
  border-bottom:none;
}
.bs-friend-request-user{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  flex:1;
}
.bs-friend-request-avatar{
  width:44px;
  height:44px;
  border-radius:999px;
  object-fit:cover;
  background:#eef2f7;
  border:1px solid #e6eaf2;
  flex:0 0 44px;
}
.bs-friend-request-meta{
  min-width:0;
}
.bs-friend-request-name{
  font-weight:1000;
  font-size:14px;
  color:#101828;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bs-friend-request-username{
  margin-top:3px;
  font-size:12px;
  font-weight:900;
  color:#667085;
}
.bs-friend-request-actions{
  display:flex;
  gap:8px;
  flex:0 0 auto;
}
.bs-friend-accept-btn{
  height:38px;
  padding:0 14px;
  border:none;
  border-radius:999px;
  background:linear-gradient(180deg,#56bfe0,#0b5e90);
  color:#fff;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(11,94,144,.18);
}
.bs-friend-deny-btn{
  height:38px;
  padding:0 14px;
  border:1px solid #e6eaf2;
  border-radius:999px;
  background:#fff;
  color:#ef4444;
  font-weight:1000;
  cursor:pointer;
}

/* =========================================================
   PROFILE HEADER ACTION ROW - FIXED STABLE LAYOUT
========================================================= */.of-strip .of-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  width:100%;
  padding-left:0;
  margin-top:14px;
  align-items:center;
}
.of-strip .of-actions form{
  margin:0;
  min-width:0;
}

.of-strip .of-edit,.of-strip .of-friend-btn{
  width:100%;
  min-width:0;
  height:46px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid var(--line);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:900;
  font-size:13px;
  letter-spacing:0;
  white-space:nowrap;
  text-decoration:none;
  box-shadow:0 10px 20px rgba(15,23,42,.06);
}

.of-strip .of-edit svg,.of-strip .of-friend-btn svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:block;
}

/* message */.of-strip .of-message-btn{
  width:100%;
  min-width:0;
  height:46px;
  background:#fff !important;
  border:1px solid var(--line) !important;
  color:#0b5e90 !important;
}
.of-strip .of-message-btn > span{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-width:0;
}

.of-strip .of-message-btn,
.of-strip .of-message-btn span,.of-strip .of-message-btn svg{
  color:#0b5e90 !important;
  fill:#0b5e90 !important;
}

/* friend states */.of-strip .of-friend-btn{
  font-weight:1000;
  letter-spacing:.02em;
}
.of-strip .of-friend-add{
  background:linear-gradient(180deg,var(--bs-pill),var(--bs-blue2)) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 10px 22px rgba(11,94,144,.35) !important;
}
.of-strip .of-friend-pending{
  background:#f2f4f7 !important;
  color:#667085 !important;
  border-color:#e6eaf2 !important;
}
.of-strip .of-friend-accept{
  background:#e9fbe7 !important;
  border-color:#b7f0b1 !important;
  color:#166534 !important;
}
.of-strip .of-friend-deny{
  background:#fff !important;
  border-color:#ffd3d3 !important;
  color:#b42318 !important;
}

/* small round buttons */
.of-strip .profile-share,.of-strip .profile-friends-btn{
  width:46px;
  height:46px;
  min-width:46px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 20px rgba(15,23,42,.06);
  padding:0;
  margin:0;
}
.of-strip .profile-share{
  color:var(--bs-blue2);
}
.of-strip .profile-friends-btn{
  position:relative;
  color:#0b5e90;
}

.of-strip .profile-share svg,.of-strip .profile-friends-btn svg{
  width:20px;
  height:20px;
  display:block;
}

.of-strip .profile-friends-btn:active,.of-strip .profile-share:active{
  transform:scale(.98);
}
.of-strip .bs-friend-badge{
  position:absolute;
  top:-5px;
  right:-2px;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  background:#f2b300;
  color:#111;
  font-size:11px;
  font-weight:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid #fff;
  box-shadow:0 6px 12px rgba(0,0,0,.12);
  line-height:1;
}

/* =========================================================
   EXACT PLACEMENT BY STATE
========================================================= */

/* OWN PROFILE: message left, friend requests top-right, share bottom-right */.of-strip .of-actions:has(#openFriendRequests){
  grid-template-columns:minmax(0,1fr) 46px;
}
.of-strip .of-actions:has(#openFriendRequests) .of-message-btn{
  grid-column:1;
  grid-row:1 / span 2;
}
.of-strip .of-actions:has(#openFriendRequests) #openFriendRequests{
  grid-column:2;
  grid-row:1;
}
.of-strip .of-actions:has(#openFriendRequests) .profile-share{
  grid-column:2;
  grid-row:2;
}

/* ADD FRIEND / PENDING SENT / FRIENDS:
   friend button left, message right, block below right */
.of-strip .of-actions:has(.of-friend-add),.of-strip .of-actions:has(.of-friend-pending){
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}

.of-strip .of-actions:has(.of-friend-add) form:has(.of-friend-btn),.of-strip .of-actions:has(.of-friend-pending) form:has(.of-friend-btn){
  grid-column:1;
  grid-row:1;
}

.of-strip .of-actions:has(.of-friend-add) .of-message-btn,.of-strip .of-actions:has(.of-friend-pending) .of-message-btn{
  grid-column:2;
  grid-row:1;
}

.of-strip .of-actions:has(.of-friend-add) .profile-share,.of-strip .of-actions:has(.of-friend-pending) .profile-share{
  grid-column:2;
  grid-row:2;
  justify-self:center;
}

/* PENDING RECEIVED:
   accept + deny on top, message + block on bottom */.of-strip .of-actions:has(.of-friend-accept):has(.of-friend-deny){
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.of-strip .of-actions:has(.of-friend-accept):has(.of-friend-deny) form:has(.of-friend-accept){
  grid-column:1;
  grid-row:1;
}
.of-strip .of-actions:has(.of-friend-accept):has(.of-friend-deny) form:has(.of-friend-deny){
  grid-column:2;
  grid-row:1;
}
.of-strip .of-actions:has(.of-friend-accept):has(.of-friend-deny) .of-message-btn{
  grid-column:1;
  grid-row:2;
}
.of-strip .of-actions:has(.of-friend-accept):has(.of-friend-deny) .profile-share{
  grid-column:2;
  grid-row:2;
  justify-self:center;
}

/* =========================
   REACTION PICKER
========================= */.bs-reaction-emoji{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
}

.bs-reaction-icon{
  display:inline-flex;
  width:22px;
  height:22px;
  vertical-align:middle;
}

.bs-reaction-icon svg{
  width:100%;
  height:100%;
  display:block;
}
.bs-heart-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.bs-reaction-pop{
  position:fixed;
  z-index:2147483647;
  display:none;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(230,234,242,.95);
  box-shadow:0 14px 34px rgba(15,23,42,.18);
  user-select:none;
  -webkit-user-select:none;
}
.bs-reaction-pop.show{
  display:flex;
}
.bs-reaction-opt{
  width:42px;
  height:42px;
  border-radius:999px;
  border:none;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  padding:0;
}
.bs-reaction-opt:active{
  transform:scale(.92);
}
.bs-reaction-backdrop{
  position:fixed;
  inset:0;
  z-index:2147483646;
  display:none;
  background:transparent;
}
.bs-reaction-backdrop.show{
  display:block;
}

.bs-tip-modal{
  position: fixed;
  inset: 0;
  z-index: 2147483647;
}
.bs-tip-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(15,23,42,.45);
  opacity: 0;
  transition: opacity .22s ease;
}
.bs-tip-sheet{
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  background: #fff;
  border-radius: 28px 28px 20px 20px;
  border: 1px solid rgba(230,234,242,.96);
  box-shadow: 0 24px 60px rgba(15,23,42,.22);
  transform: translateY(24px);
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
  overflow: hidden;
}
.bs-tip-modal.show .bs-tip-backdrop{
  opacity: 1;
}
.bs-tip-modal.show .bs-tip-sheet{
  transform: translateY(0);
  opacity: 1;
}
.bs-tip-handle{
  width: 52px;
  height: 6px;
  border-radius: 999px;
  background: #dbe3ef;
  margin: 10px auto 4px;
}
.bs-tip-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px 4px;
}
.bs-tip-title{
  font-size: 22px;
  font-weight: 1000;
  color: #101828;
  letter-spacing: -.02em;
}
.bs-tip-close{
  width: 42px;
  height: 42px;
  border: 1px solid rgba(230,234,242,.96);
  background: #fff;
  border-radius: 14px;
  color: #0b5e90;
  font-size: 26px;
  font-weight: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bs-tip-body{
  padding: 10px 16px 18px;
}
.bs-tip-icon-wrap{
  display: flex;
  justify-content: center;
  margin-top: 2px;
}
.bs-tip-icon{
  width: 66px;
  height: 66px;
  border-radius: 999px;
  background: linear-gradient(180deg, #7dd3fc, #38bdf8);
  color: #fff;
  font-size: 34px;
  font-weight: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 28px rgba(56,189,248,.28);
}
.bs-tip-copy{
  margin-top: 12px;
  text-align: center;
  color: #667085;
  font-weight: 900;
  font-size: 14px;
}
.bs-tip-pills{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 18px;
}
.bs-tip-pill{
  height: 48px;
  border-radius: 16px;
  border: 1px solid rgba(230,234,242,.96);
  background: #fff;
  color: #111827;
  font-size: 18px;
  font-weight: 1000;
}
.bs-tip-pill.is-active{
  background: #e0f2fe;
  border-color: #38bdf8;
  color: #0b5e90;
  box-shadow: 0 0 0 4px rgba(56,189,248,.12);
}
.bs-tip-input-wrap{
  margin-top: 16px;
}
.bs-tip-label{
  display: block;
  margin-bottom: 8px;
  color: #344054;
  font-size: 13px;
  font-weight: 900;
}
.bs-tip-input-shell{
  position: relative;
}
.bs-tip-dollar{
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #667085;
  font-size: 20px;
  font-weight: 1000;
}
.bs-tip-input{
  width: 100%;
  height: 56px;
  border-radius: 18px;
  border: 1px solid rgba(230,234,242,.96);
  background: #f8fafc;
  padding: 0 16px 0 38px;
  font-size: 20px;
  font-weight: 1000;
  color: #111827;
  outline: none;
}
.bs-tip-input:focus{
  border-color: #38bdf8;
  box-shadow: 0 0 0 4px rgba(56,189,248,.12);
  background: #fff;
}
.bs-tip-error{
  min-height: 20px;
  margin-top: 10px;
  color: #e11d48;
  font-size: 13px;
  font-weight: 900;
}
.bs-tip-actions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 14px;
}

.bs-tip-cancel,.bs-tip-submit{
  height: 54px;
  border-radius: 18px;
  font-size: 17px;
  font-weight: 1000;
}
.bs-tip-cancel{
  border: 1px solid rgba(230,234,242,.96);
  background: #fff;
  color: #344054;
}
.bs-tip-submit{
  border: 0;
  background: linear-gradient(180deg, #67c8ea, #4cb5d4);
  color: #fff;
  box-shadow: 0 16px 34px rgba(76,181,212,.30);
}
.bs-tip-submit:disabled{
  opacity: .7;
}

.bs-tip-pills{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:12px;
  margin-top:18px;
}
.bs-tip-pill{
  position:relative;
  z-index:2;
  height:74px;
  border:1px solid #d9dee7;
  background:#fff;
  border-radius:22px;
  font-size:22px;
  font-weight:1000;
  color:#0f172a;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.bs-tip-pill.is-active{
  border:2px solid #56bfe0;
  background:#eaf8fd;
  color:#0b5e90;
  box-shadow:0 0 0 4px rgba(86,191,224,.12);
}
.bs-tip-label{
  margin-top:14px;
  margin-bottom:10px;
  font-size:15px;
  font-weight:900;
  color:#344054;
}
.bs-tip-input-wrap{
  position:relative;
  margin-top:0;
}
.bs-tip-dollar{
  position:absolute;
  left:24px;
  top:50%;
  transform:translateY(-50%);
  font-size:28px;
  font-weight:1000;
  color:#667085;
  pointer-events:none;
  z-index:2;
}
.bs-tip-input{
  width:100%;
  height:92px;
  border-radius:24px;
  border:1px solid #d9dee7;
  background:#f8fafc;
  font-size:40px;
  font-weight:1000;
  color:#111827;
  padding:0 22px 0 54px;
  outline:none;
}
.bs-tip-input:focus{
  border-color:#56bfe0;
  box-shadow:0 0 0 4px rgba(86,191,224,.14);
}






.bs-mini-toast{
  position:fixed;
  left:12px;
  right:12px;
  bottom:92px;
  z-index:999999;
  display:flex;
  justify-content:center;
  pointer-events:none;
  opacity:0;
  transform:translateY(14px);
  transition:opacity .18s ease, transform .18s ease;
}

.bs-mini-toast.show{
  opacity:1;
  transform:translateY(0);
}

.bs-mini-toast-card{
  min-height:56px;
  max-width:420px;
  width:100%;
  border-radius:18px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  gap:10px;
  background:linear-gradient(180deg,#101828,#0f172a);
  color:#fff;
  box-shadow:0 20px 40px rgba(15,23,42,.28);
  border:1px solid rgba(255,255,255,.08);
}

.bs-mini-toast-ico{
  width:30px;
  height:30px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#56bfe0,#0b5e90);
  color:#fff;
  font-size:16px;
  font-weight:1000;
  flex:0 0 30px;
}

.bs-mini-toast-copy{
  font-size:14px;
  line-height:1.4;
  font-weight:900;
  color:#fff;
}
