:root{
  --sp-blue:#0866ff;
  --sp-bg:#f0f2f5;
  --sp-card:#fff;
  --sp-text:#050505;
  --sp-muted:#65676b;
  --sp-line:#e4e6eb;
  --sp-hover:#f2f2f2;
  --sp-radius:12px;
  --sp-shadow:0 1px 2px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html{background:var(--sp-bg)}
body{margin:0;background:var(--sp-bg);color:var(--sp-text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
img{max-width:100%}
.sp-topbar{height:56px;background:#fff;box-shadow:0 1px 8px rgba(0,0,0,.12);position:sticky;top:0;z-index:999}
.admin-bar .sp-topbar{top:32px}
.sp-topbar-inner{height:56px;max-width:1540px;margin:auto;display:grid;grid-template-columns:330px minmax(320px,680px) 330px;gap:20px;align-items:center;padding:0 18px}
.sp-brand{display:flex;align-items:center;gap:10px;font-weight:800}
.sp-brand-mark{display:grid;place-items:center;width:40px;height:40px;color:var(--sp-blue)}
.sp-brand-text{font-size:18px}
.sp-search{height:40px;background:var(--sp-bg);border-radius:22px;display:flex;align-items:center;padding:0 14px;gap:8px}
.sp-search input{border:0;outline:0;background:transparent;width:100%;font-size:15px}
.sp-nav-icons{display:flex;justify-content:flex-end;gap:8px}
.sp-nav-icons>a{min-width:40px;height:40px;border-radius:50%;background:var(--sp-bg);display:grid;place-items:center;font-size:21px;font-weight:700}
.sp-nav-icons>a.active{color:var(--sp-blue)}
.sp-nav-icons .sp-login-pill{border-radius:20px;padding:0 18px;background:var(--sp-blue);color:#fff;font-size:14px}
.sp-shell{max-width:1540px;margin:0 auto;display:grid;grid-template-columns:330px minmax(0,680px) 330px;justify-content:space-between;gap:20px;padding:16px 18px 90px}
.sp-sticky{position:sticky;top:72px}
.admin-bar .sp-sticky{top:104px}
.sp-left,.sp-right{min-width:0}
.sp-side-user,.sp-side-link{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:8px;font-size:15px;font-weight:600}
.sp-side-user:hover,.sp-side-link:hover{background:#e4e6e9}
.sp-side-link .sp-side-icon{width:32px;text-align:center}
.sp-side-link.active{color:var(--sp-blue)}
.sp-avatar{border-radius:50%;object-fit:cover;background:#ddd}
.sp-side-card{margin-top:24px;border-top:1px solid #d6d9dd;padding:18px 10px;color:var(--sp-muted);font-size:13px;line-height:1.45}
.sp-side-card p{margin:6px 0}
.sp-feed{width:100%;min-width:0}
.sp-composer,.sp-post-card,.sp-comments-card,.sp-empty{background:var(--sp-card);border-radius:var(--sp-radius);box-shadow:var(--sp-shadow);margin-bottom:16px}
.sp-composer{padding:12px 16px}
.sp-composer-top{display:flex;gap:10px;align-items:center}
.sp-composer-trigger{flex:1;height:42px;border:0;border-radius:24px;background:var(--sp-bg);text-align:left;padding:0 16px;color:var(--sp-muted);cursor:pointer}
.sp-composer-trigger:hover{background:#e4e6e9}
.sp-composer-actions{border-top:1px solid var(--sp-line);margin-top:12px;padding-top:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.sp-composer-actions button{border:0;background:transparent;padding:9px;border-radius:8px;font-weight:650;color:var(--sp-muted);cursor:pointer}
.sp-composer-actions button:hover{background:var(--sp-hover)}
.sp-post-card{overflow:hidden}
.sp-post-head{display:flex;align-items:center;gap:10px;padding:12px 16px 8px}
.sp-post-meta{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.sp-author{font-weight:700}
.sp-author:hover{text-decoration:underline}
.sp-post-meta span{font-size:12px;color:var(--sp-muted)}
.sp-more{margin-left:auto;border:0;background:transparent;font-weight:700;color:var(--sp-muted);font-size:16px;padding:8px;border-radius:50%}
.sp-post-text{padding:5px 16px 12px;font-size:15px;line-height:1.42;overflow-wrap:anywhere}
.sp-post-text p{margin:0 0 8px}
.sp-post-text p:last-child{margin-bottom:0}
.sp-media-grid{display:grid;gap:2px;background:#ddd;max-height:680px;overflow:hidden}
.sp-media-grid.sp-count-1{grid-template-columns:1fr}
.sp-media-grid.sp-count-2{grid-template-columns:1fr 1fr}
.sp-media-grid.sp-count-3,.sp-media-grid.sp-count-4{grid-template-columns:1fr 1fr}
.sp-media-item{background:#111;min-height:240px;position:relative;display:grid;place-items:center;overflow:hidden}
.sp-count-1 .sp-media-item{min-height:360px}
.sp-social-stats{display:flex;justify-content:space-between;align-items:center;padding:9px 16px;color:var(--sp-muted);font-size:13px;border-bottom:1px solid var(--sp-line)}
.sp-actions{display:grid;grid-template-columns:repeat(3,1fr);padding:4px 10px}
.sp-actions button,.sp-actions a{border:0;background:transparent;color:var(--sp-muted);font-weight:650;text-align:center;padding:9px;border-radius:6px;cursor:pointer}
.sp-actions button:hover,.sp-actions a:hover{background:var(--sp-hover)}
.sp-actions .is-liked{color:var(--sp-blue)}
.sp-widget{border-top:1px solid #ced0d4;padding-top:12px}
.sp-widget-title{display:flex;justify-content:space-between;color:var(--sp-muted);font-size:16px;padding:0 8px 8px}
.sp-contact{display:flex;gap:10px;align-items:center;padding:7px 8px;border-radius:8px;font-size:14px;font-weight:600}
.sp-contact:hover{background:#e4e6e9}
.sp-online-wrap{position:relative;line-height:0}
.sp-online-wrap i{position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;background:#31a24c;border:2px solid var(--sp-bg)}
.sp-modal{position:fixed;inset:0;background:rgba(0,0,0,.56);z-index:9999;display:none;align-items:center;justify-content:center;padding:18px}
.sp-modal.is-open{display:flex}
.sp-modal-card{width:min(520px,100%);background:#fff;border-radius:12px;box-shadow:0 12px 45px rgba(0,0,0,.28);overflow:hidden}
.sp-modal-head{height:60px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--sp-line);position:relative}
.sp-modal-head h3{margin:0;font-size:20px}
.sp-modal-close{position:absolute;right:14px;border:0;background:var(--sp-bg);border-radius:50%;width:36px;height:36px;font-size:20px;cursor:pointer}
.sp-modal-body{padding:14px 16px}
.sp-modal-user{display:flex;align-items:center;gap:10px;font-weight:700;margin-bottom:12px}
.sp-modal textarea{width:100%;min-height:130px;resize:vertical;border:0;outline:0;font-size:22px;line-height:1.35}
.sp-upload-box{border:1px solid var(--sp-line);border-radius:10px;padding:10px;margin:10px 0}
.sp-upload-box input{width:100%}
.sp-upload-preview{font-size:12px;color:var(--sp-muted);margin-top:8px;display:flex;gap:6px;flex-wrap:wrap}
.sp-upload-preview span{background:var(--sp-bg);padding:5px 8px;border-radius:12px}
.sp-submit{width:100%;height:38px;border:0;border-radius:7px;background:var(--sp-blue);color:#fff;font-weight:700;cursor:pointer}
.sp-submit:disabled{opacity:.55;cursor:not-allowed}
.sp-status{font-size:13px;margin:8px 0;color:var(--sp-muted)}
.sp-status.error{color:#b42318}
.sp-status.success{color:#15803d}
.sp-empty{padding:45px;text-align:center}
.sp-empty h2{margin:0 0 6px}
.sp-empty p{margin:0;color:var(--sp-muted)}
.sp-pagination{padding:10px;text-align:center}
.sp-comments-card{padding:16px}
.comment-list{padding-left:22px}
.comment-form textarea{width:100%;border:1px solid var(--sp-line);border-radius:8px;padding:10px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url]{width:100%;border:1px solid var(--sp-line);border-radius:8px;padding:10px}
.form-submit input{border:0;border-radius:7px;background:var(--sp-blue);color:#fff;padding:10px 18px;font-weight:700}
.sp-mobile-nav{display:none}

@media (max-width:1100px){
  .sp-topbar-inner,.sp-shell{grid-template-columns:240px minmax(0,680px)}
  .sp-right{display:none}
}
@media (max-width:800px){
  .admin-bar .sp-topbar{top:46px}
  .sp-topbar-inner{grid-template-columns:auto 1fr auto;padding:0 10px;gap:8px}
  .sp-brand-text{display:none}
  .sp-search{min-width:0}
  .sp-nav-icons>a:not(.sp-login-pill){display:none}
  .sp-shell{display:block;padding:10px 0 74px}
  .sp-left,.sp-right{display:none}
  .sp-feed{max-width:680px;margin:0 auto}
  .sp-composer,.sp-post-card,.sp-comments-card,.sp-empty{border-radius:0}
  .sp-mobile-nav{position:fixed;left:0;right:0;bottom:0;height:58px;background:#fff;border-top:1px solid var(--sp-line);display:grid;grid-template-columns:repeat(3,1fr);z-index:1000}
  .sp-mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px;color:var(--sp-muted)}
  .sp-mobile-nav small{font-size:10px;margin-top:2px}
  .sp-media-item{min-height:190px}
  .sp-count-1 .sp-media-item{min-height:280px}
  }
@media (max-width:480px){
  .sp-search input{font-size:14px}
  .sp-composer-actions button{font-size:12px}
  .sp-post-text{font-size:15px}
  .sp-modal{padding:0;align-items:flex-end}
  .sp-modal-card{border-radius:14px 14px 0 0;max-height:92vh;overflow:auto}
  .sp-modal textarea{font-size:19px}
}


.sp-icon{width:22px;height:22px;display:block;flex:0 0 auto}
.sp-brand-mark .sp-icon{width:40px;height:40px}
.sp-search .sp-icon{width:19px;height:19px;color:var(--sp-muted)}
.sp-nav-icons>a>.sp-icon{width:22px;height:22px}
.sp-side-icon{width:32px;height:32px;display:grid;place-items:center}
.sp-side-icon .sp-icon{width:23px;height:23px}
.sp-side-link.active .sp-side-icon{color:var(--sp-blue)}
.sp-meta-icon{display:inline-block;width:12px;height:12px;vertical-align:-2px}
.sp-meta-dot{font-style:normal;margin:0 2px}
.sp-more .sp-icon{width:21px;height:21px}
.sp-widget-title .sp-icon{width:20px;height:20px}
.sp-actions button,.sp-actions a{display:flex;align-items:center;justify-content:center;gap:7px}
.sp-actions .sp-icon{width:20px;height:20px}
.sp-like-stat{display:inline-flex;align-items:center;gap:5px}
.sp-reaction-dot{display:inline-grid;place-items:center;width:20px;height:20px;background:var(--sp-blue);color:#fff;border-radius:50%}
.sp-reaction-dot .sp-icon{width:11px;height:11px;stroke-width:2.4}
.sp-composer-actions button{display:flex;align-items:center;justify-content:center;gap:7px}
.sp-composer-actions .sp-icon{width:21px;height:21px}
.sp-composer-actions button:nth-child(1) .sp-icon{color:#f02849}
.sp-composer-actions button:nth-child(2) .sp-icon{color:#45bd62}
.sp-composer-actions button:nth-child(3) .sp-icon{color:#0866ff}
.sp-modal-close{display:grid;place-items:center}
.sp-modal-close .sp-icon{width:20px;height:20px}
.sp-privacy-label{display:inline-flex;align-items:center;gap:4px;color:var(--sp-muted);font-weight:500}
.sp-mobile-nav .sp-icon{width:22px;height:22px}
.sp-mobile-nav a.active{color:var(--sp-blue)}


/* Media loading skeleton */
.sp-media-item{position:relative}
.sp-media-item .sp-media-el{
  position:relative;
  z-index:2;
  opacity:0;
  transition:opacity .28s ease;
}
.sp-media-item.sp-loaded .sp-media-el{
  opacity:1;
}
.sp-media-item .sp-media-skeleton{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  background:
    linear-gradient(100deg,
      #f0f2f5 8%,
      #e6e9ee 18%,
      #f6f7f9 33%,
      #e6e9ee 48%,
      #f0f2f5 62%);
  background-size:200% 100%;
  animation:spShimmer 4.6s ease-in-out infinite;
}
.sp-media-item.sp-loaded .sp-media-skeleton,
.sp-media-item.sp-load-error .sp-media-skeleton{
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease, visibility .2s ease;
}
.sp-media-error{
  position:absolute;
  inset:0;
  z-index:3;
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:8px;
  color:#65676b;
  background:#f0f2f5;
  text-align:center;
}
.sp-media-item.sp-load-error .sp-media-error{
  display:flex;
}
.sp-media-error-icon .sp-icon{
  width:28px;
  height:28px;
}
.sp-media-item img.sp-media-el{
  width:100%;
  height:100%;
  max-height:680px;
  object-fit:cover;
  display:block;
}
.sp-media-item video.sp-media-el{
  width:100%;
  height:100%;
  min-height:360px;
  max-height:680px;
  background:#000;
  object-fit:contain;
  display:block;
}
@keyframes spShimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}
@media (max-width:800px){
  .sp-media-item video.sp-media-el{
    min-height:280px;
  }
}



/* V1.3 interaction and animation layer */
button,a,.sp-post-card,.sp-composer,.sp-person-card{
  transition:background-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease,opacity .18s ease;
}
button:active,.sp-actions a:active,.sp-side-link:active,.sp-contact:active,.sp-person-card:active{
  transform:scale(.975);
}
.sp-post-card:hover{
  box-shadow:0 2px 7px rgba(0,0,0,.12);
}
.sp-composer-trigger:hover,.sp-actions button:hover,.sp-actions a:hover{
  transform:translateY(-1px);
}
.sp-modal.is-open .sp-modal-card{
  animation:spModalPop .24s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes spModalPop{
  from{opacity:0;transform:translateY(12px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.sp-reveal-ready{
  opacity:0;
  transform:translateY(12px);
}
.sp-reveal-ready.sp-revealed{
  opacity:1;
  transform:translateY(0);
  transition:opacity .42s ease var(--sp-delay,0ms),transform .42s cubic-bezier(.2,.7,.2,1) var(--sp-delay,0ms);
}
.sp-removing{
  opacity:0!important;
  transform:scale(.985)!important;
  pointer-events:none;
}

/* Upload progress */
.sp-upload-progress{
  margin:12px 0;
  padding:12px;
  border:1px solid var(--sp-line);
  border-radius:10px;
  background:#f7f8fa;
}
.sp-progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:9px;
  font-size:13px;
}
.sp-progress-head strong{font-size:12px;color:var(--sp-blue)}
.sp-progress-track{
  width:100%;
  height:8px;
  border-radius:999px;
  overflow:hidden;
  background:#dfe3e8;
}
.sp-progress-bar{
  width:0;
  height:100%;
  border-radius:inherit;
  background:var(--sp-blue);
  transition:width .25s ease;
  position:relative;
  overflow:hidden;
}
.sp-progress-bar:after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);
  animation:spProgressSweep 1.7s ease-in-out infinite;
}
@keyframes spProgressSweep{
  to{transform:translateX(100%)}
}
.sp-upload-progress small{
  display:block;
  margin-top:8px;
  color:var(--sp-muted);
  font-size:12px;
}
.sp-submit.is-busy{
  position:relative;
  opacity:.78;
}
.sp-preview-file{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:7px 9px;
  border-radius:8px;
  background:var(--sp-bg);
}
.sp-preview-file span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sp-preview-file small{flex:0 0 auto}

/* Post options menu */
.sp-post-menu-wrap{margin-left:auto;position:relative}
.sp-post-menu-wrap .sp-more{margin-left:0}
.sp-post-menu{
  position:absolute;
  z-index:30;
  top:42px;
  right:0;
  min-width:180px;
  padding:6px;
  background:#fff;
  border:1px solid var(--sp-line);
  border-radius:10px;
  box-shadow:0 8px 28px rgba(0,0,0,.16);
  animation:spMenuIn .16s ease both;
}
@keyframes spMenuIn{
  from{opacity:0;transform:translateY(-4px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.sp-post-menu a,.sp-post-menu button{
  width:100%;
  min-height:38px;
  border:0;
  border-radius:7px;
  background:transparent;
  display:flex;
  align-items:center;
  text-align:left;
  padding:8px 10px;
  cursor:pointer;
  font-size:14px;
  color:var(--sp-text);
}
.sp-post-menu a:hover,.sp-post-menu button:hover{background:var(--sp-hover)}
.sp-post-menu .sp-delete-post{color:#b42318}

/* Feed views */
.sp-view-head{
  background:#fff;
  border-radius:var(--sp-radius);
  box-shadow:var(--sp-shadow);
  padding:17px 18px;
  margin-bottom:16px;
}
.sp-view-head h2{margin:0;font-size:21px}
.sp-view-head p{margin:4px 0 0;color:var(--sp-muted);font-size:14px}
.sp-people-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.sp-person-card{
  min-width:0;
  background:#fff;
  border-radius:var(--sp-radius);
  box-shadow:var(--sp-shadow);
  padding:18px 14px;
  display:flex;
  align-items:center;
  gap:12px;
}
.sp-person-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.sp-person-card strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sp-person-card span{
  margin-left:auto;
  color:var(--sp-blue);
  font-size:12px;
  font-weight:700;
}
.sp-widget-title a{color:var(--sp-muted);padding:2px}
.sp-widget-title a .sp-icon{width:18px;height:18px}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}
@media (max-width:800px){
  .sp-view-head{border-radius:0}
}
@media (max-width:560px){
  .sp-people-grid{grid-template-columns:1fr}
  .sp-person-card span{display:none}
}



/* twittsocial.com V1.4 */
:root{--sp-blue-hover:#075ee5}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,.sp-dropzone:focus-visible{outline:3px solid rgba(8,102,255,.22);outline-offset:2px}
.sp-post-card,.sp-composer,.sp-comments-card,.sp-view-head,.sp-person-card{border:1px solid rgba(5,5,5,.045)}
.sp-search{border:1px solid transparent;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}
.sp-search:focus-within{background:#fff;border-color:#d8e5ff;box-shadow:0 0 0 3px rgba(8,102,255,.08)}

/* Custom video player: no native bar */
.sp-video-shell{background:#000;isolation:isolate}
.sp-video-shell .sp-custom-video{cursor:pointer;user-select:none;-webkit-user-select:none}
.sp-video-center{position:absolute;z-index:6;inset:0;margin:auto;width:78px;height:78px;border:0;padding:0;background:transparent;display:grid;place-items:center;cursor:pointer;opacity:0;transform:scale(.92);pointer-events:none;transition:opacity .2s ease,transform .22s ease}
.sp-video-shell.sp-loaded .sp-video-center{opacity:1;transform:scale(1);pointer-events:auto}
.sp-video-shell.is-playing .sp-video-center{opacity:0;transform:scale(.84);pointer-events:none}
.sp-video-center-disc{width:64px;height:64px;display:grid;place-items:center;border-radius:50%;color:#fff;background:rgba(72,72,76,.72);border:2px solid rgba(255,255,255,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 7px 24px rgba(0,0,0,.28);transition:transform .18s ease,background .18s ease}
.sp-video-center:hover .sp-video-center-disc{transform:scale(1.06);background:rgba(47,47,52,.86)}
.sp-video-center-disc .sp-icon{width:31px;height:31px;margin-left:3px}
.sp-video-shell.is-paused.sp-player-started .sp-video-center-disc .sp-icon{margin-left:0}
.sp-video-controls{position:absolute;z-index:7;left:10px;right:10px;bottom:10px;min-height:48px;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:12px;color:#fff;background:linear-gradient(180deg,rgba(21,22,26,.78),rgba(9,10,13,.9));border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 24px rgba(0,0,0,.25);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transform:translateY(8px);visibility:hidden;pointer-events:none;transition:opacity .2s ease,transform .22s ease,visibility .2s ease}
.sp-video-shell.sp-player-started .sp-video-controls{opacity:1;transform:translateY(0);visibility:visible;pointer-events:auto}
.sp-vbtn{width:32px;height:32px;flex:0 0 32px;padding:0;border:0;border-radius:8px;color:#fff;background:transparent;display:grid;place-items:center;cursor:pointer}
.sp-vbtn:hover{background:rgba(255,255,255,.12)}
.sp-vbtn .sp-icon{width:20px;height:20px}
.sp-vtime{flex:0 0 auto;font-size:12px;font-weight:700;color:rgba(255,255,255,.92);font-variant-numeric:tabular-nums}
.sp-vseek,.sp-vvolume{appearance:none;-webkit-appearance:none;height:4px;border-radius:999px;outline:0;background:linear-gradient(to right,#fff 0 var(--sp-range-progress,0%),rgba(255,255,255,.28) var(--sp-range-progress,0%) 100%);cursor:pointer}
.sp-vseek{flex:1;min-width:72px}
.sp-vvolume{width:70px;flex:0 0 70px}
.sp-vseek::-webkit-slider-thumb,.sp-vvolume::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border:0;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.35)}
.sp-vseek::-moz-range-thumb,.sp-vvolume::-moz-range-thumb{width:13px;height:13px;border:0;border-radius:50%;background:#fff}
.sp-video-shell:fullscreen{display:flex;align-items:center;justify-content:center;background:#000}
.sp-video-shell:fullscreen .sp-custom-video{max-height:100vh;width:100%;height:100%}

/* Upload popup */
.sp-modal-card{border:1px solid rgba(5,5,5,.08);box-shadow:0 24px 70px rgba(0,0,0,.28)}
.sp-modal-head{padding:0 58px}
.sp-modal-body{padding:16px}
.sp-upload-box{border:0;padding:0;margin:12px 0}
.sp-upload-input{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
.sp-dropzone{min-height:156px;padding:24px 18px;border:1.5px dashed #ccd0d5;border-radius:14px;background:#f7f8fa;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease}
.sp-dropzone:hover,.sp-dropzone.is-dragging{border-color:#86adff;background:#f4f8ff;box-shadow:0 0 0 4px rgba(8,102,255,.06)}
.sp-dropzone-icon{width:48px;height:48px;margin-bottom:9px;border-radius:50%;background:#e7efff;color:var(--sp-blue);display:grid;place-items:center}
.sp-dropzone-icon .sp-icon{width:24px;height:24px}
.sp-dropzone strong{font-size:15px}
.sp-dropzone-copy{margin-top:5px;color:var(--sp-muted);font-size:13px}
.sp-dropzone-copy b{color:var(--sp-blue)}
.sp-dropzone small{margin-top:8px;color:#8a8d91;font-size:11px}
.sp-dropzone.has-files{min-height:88px;padding:14px}
.sp-upload-preview{margin-top:10px;display:grid;grid-template-columns:1fr;gap:8px}
.sp-preview-card{position:relative;min-width:0;min-height:64px;display:grid;grid-template-columns:58px minmax(0,1fr) 30px;gap:10px;align-items:center;padding:7px 8px;border:1px solid var(--sp-line);border-radius:11px;background:#fff}
.sp-preview-visual{width:58px;height:48px;position:relative;border-radius:8px;overflow:hidden;background:#111}
.sp-preview-visual img,.sp-preview-visual video{width:100%;height:100%;object-fit:cover;display:block}
.sp-preview-badge{position:absolute;left:4px;bottom:4px;padding:2px 4px;border-radius:4px;color:#fff;background:rgba(0,0,0,.7);font-size:8px;font-weight:800;letter-spacing:.05em}
.sp-preview-meta{min-width:0;display:flex;flex-direction:column;gap:3px}
.sp-preview-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.sp-preview-meta small{color:var(--sp-muted);font-size:11px}
.sp-preview-remove{width:28px;height:28px;border:0;border-radius:50%;background:var(--sp-bg);color:#65676b;cursor:pointer;font-size:18px;line-height:1}
.sp-preview-remove:hover{background:#e4e6eb;color:#050505}
.sp-upload-progress{border:1px solid #dce5f6;background:#f8faff;border-radius:13px;padding:13px}
.sp-progress-top{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;margin-bottom:11px}
.sp-progress-state-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--sp-blue);background:#e7efff}
.sp-progress-state-icon .sp-icon{width:19px;height:19px}
.sp-progress-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.sp-progress-copy strong{font-size:13px}
.sp-progress-copy small{margin:0;color:var(--sp-muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sp-progress-percent{color:var(--sp-blue);font-size:12px}
.sp-progress-track{height:9px}
.sp-progress-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:10px}
.sp-progress-steps span{position:relative;padding-top:10px;color:#8a8d91;text-align:center;font-size:10px;font-weight:700}
.sp-progress-steps span:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:99px;background:#d8dce2}
.sp-progress-steps span.is-active{color:var(--sp-blue)}
.sp-progress-steps span.is-active:before{background:var(--sp-blue)}
.sp-progress-steps span.is-done{color:#31a24c}
.sp-progress-steps span.is-done:before{background:#31a24c}
.sp-submit{min-height:42px;border-radius:9px}
.sp-submit:hover:not(:disabled){background:var(--sp-blue-hover);transform:translateY(-1px)}

.sp-count-1 .sp-media-item{min-height:390px}
.sp-actions{gap:3px}
.sp-actions button,.sp-actions a{min-height:38px}

@media (max-width:800px){
  .sp-video-controls{left:7px;right:7px;bottom:7px;gap:6px;padding:7px 8px}
  .sp-vvolume{display:none}
  .sp-vtime{font-size:11px}
  .sp-vbtn{width:30px;height:30px;flex-basis:30px}
  .sp-video-center{width:68px;height:68px}
  .sp-video-center-disc{width:58px;height:58px}
  .sp-count-1 .sp-media-item{min-height:300px}
  .sp-modal-body{padding:14px}
}
@media (max-width:480px){
  .sp-vduration{display:none}
  .sp-dropzone{min-height:136px;padding:20px 14px}
  .sp-preview-card{grid-template-columns:52px minmax(0,1fr) 30px}
  .sp-preview-visual{width:52px;height:46px}
}



/* V1.6 loading system */
.sp-page-loader{position:fixed;left:0;right:0;top:0;height:3px;z-index:10050;pointer-events:none;overflow:hidden}
.sp-page-loader span{display:block;width:35%;height:100%;background:var(--sp-blue);transform:translateX(-120%);opacity:0}
.sp-page-loader.is-loading span{opacity:1;animation:spPageLoad 1s ease-in-out infinite}
@keyframes spPageLoad{0%{transform:translateX(-120%)}60%{transform:translateX(180%)}100%{transform:translateX(320%)}}
.sp-post-card{content-visibility:auto;contain-intrinsic-size:700px}
.sp-nav-friends{position:relative}.sp-nav-badge{position:absolute;right:-2px;top:-3px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#e41e3f;color:#fff;border:2px solid #fff;font-size:10px;line-height:13px;text-align:center;font-weight:800}
.sp-toast{position:fixed;left:50%;bottom:82px;z-index:11000;transform:translate(-50%,18px);padding:10px 16px;border-radius:999px;background:#1d1f23;color:#fff;font-size:13px;font-weight:600;box-shadow:0 10px 32px rgba(0,0,0,.26);opacity:0;visibility:hidden;transition:.2s ease}
.sp-toast.is-showing{opacity:1;visibility:visible;transform:translate(-50%,0)}

/* Stories */
.sp-stories{background:#fff;border-radius:var(--sp-radius);box-shadow:var(--sp-shadow);padding:12px;margin-bottom:16px;overflow:hidden}
.sp-stories-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:112px;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.sp-stories-scroll::-webkit-scrollbar{display:none}
.sp-story-card{position:relative;height:190px;border:0;border-radius:12px;overflow:hidden;background:#d8dce2;color:#fff;cursor:pointer;padding:0;text-align:left;box-shadow:inset 0 -70px 70px rgba(0,0,0,.42);flex:none}
.sp-story-card:hover{transform:translateY(-2px)}
.sp-story-preview{position:absolute;inset:0;background-size:cover;background-position:center;display:grid;place-items:center;background-color:#242526}.sp-story-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.55))}.sp-story-preview.is-video .sp-icon{position:relative;z-index:2;width:34px;height:34px;color:#fff}
.sp-story-user-avatar{position:absolute;z-index:3;left:9px;top:9px;line-height:0}.sp-story-user-avatar .sp-avatar{border:3px solid var(--sp-blue)}
.sp-story-card>strong{position:absolute;z-index:3;left:9px;right:7px;bottom:9px;font-size:13px;line-height:1.15;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.65)}
.sp-story-create{background:#fff;color:var(--sp-text);box-shadow:inset 0 0 0 1px var(--sp-line);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center}.sp-story-create-photo{position:absolute;inset:0 0 52px;display:grid;place-items:center;background:#eef0f3}.sp-story-create-photo .sp-avatar{width:68px;height:68px}.sp-story-create>strong{color:var(--sp-text);text-shadow:none;left:0;right:0;bottom:12px}.sp-story-plus{position:absolute;z-index:4;left:50%;bottom:38px;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--sp-blue);color:#fff;border:4px solid #fff;font-size:24px;line-height:1}
.sp-story-viewer{position:fixed;inset:0;z-index:12000;background:rgba(10,11,13,.94);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.2s ease}.sp-story-viewer.is-open{opacity:1;visibility:visible}.sp-story-stage{position:relative;width:min(440px,84vw);height:min(760px,88vh);background:#000;border-radius:14px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.55)}.sp-story-media{position:absolute;inset:0;display:grid;place-items:center}.sp-story-media img,.sp-story-media video{width:100%;height:100%;object-fit:contain;background:#000}.sp-story-progress{position:absolute;z-index:5;top:10px;left:12px;right:12px;height:3px;background:rgba(255,255,255,.35);border-radius:99px;overflow:hidden}.sp-story-progress span{display:block;width:0;height:100%;background:#fff}.sp-story-head{position:absolute;z-index:5;top:20px;left:14px;display:flex;align-items:center;gap:9px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}.sp-story-head img{width:36px;height:36px;border-radius:50%;object-fit:cover}.sp-story-head div{display:flex;flex-direction:column}.sp-story-head strong{font-size:13px}.sp-story-head small{font-size:11px;opacity:.78}.sp-story-caption{position:absolute;z-index:5;left:18px;right:18px;bottom:26px;padding:10px 12px;border-radius:10px;background:rgba(0,0,0,.4);color:#fff;text-align:center;font-size:14px;backdrop-filter:blur(7px)}.sp-story-viewer-close,.sp-story-nav,.sp-story-sound{position:absolute;z-index:6;border:0;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(8px)}.sp-story-viewer-close{top:18px;right:18px;width:40px;height:40px;border-radius:50%}.sp-story-nav{top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;font-size:34px}.sp-story-prev{left:max(18px,calc(50% - 285px))}.sp-story-next{right:max(18px,calc(50% - 285px))}.sp-story-sound{right:14px;bottom:18px;width:38px;height:38px;border-radius:50%}.sp-story-sound .sp-icon,.sp-story-viewer-close .sp-icon{width:20px;height:20px}
.sp-story-upload-card{width:min(500px,100%)}.sp-story-upload-drop{min-height:150px;border:1.5px dashed #cfd3d8;border-radius:13px;background:#f7f8fa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--sp-muted);cursor:pointer}.sp-story-upload-drop>span{width:46px;height:46px;border-radius:50%;background:#e7efff;color:var(--sp-blue);display:grid;place-items:center}.sp-story-upload-drop .sp-icon{width:23px;height:23px}.sp-story-upload-drop strong{color:var(--sp-text)}.sp-story-file-preview{margin-top:10px;display:flex;align-items:center;gap:10px}.sp-story-file-preview img,.sp-story-file-preview video{width:92px;height:92px;border-radius:10px;object-fit:cover;background:#000}.sp-story-file-preview small{color:var(--sp-muted);overflow:hidden;text-overflow:ellipsis}.sp-story-upload-card textarea{min-height:80px;margin-top:12px;font-size:15px;background:var(--sp-bg);border-radius:10px;padding:10px}.sp-story-upload-progress{margin:10px 0}.sp-story-upload-progress>div{height:8px;border-radius:99px;background:#dfe3e8;overflow:hidden}.sp-story-upload-progress span{display:block;width:0;height:100%;background:var(--sp-blue);transition:width .2s ease}.sp-story-upload-progress small{display:block;text-align:right;margin-top:4px;color:var(--sp-muted);font-size:11px}

/* Friends + contacts */
.sp-friend-requests-widget{padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid #d6d9dd}.sp-widget-title>a{font-size:12px;color:var(--sp-blue)}.sp-request-row{display:grid;grid-template-columns:46px 1fr;gap:10px;padding:8px;border-radius:9px}.sp-request-row:hover{background:#e4e6e9}.sp-request-main{min-width:0}.sp-request-name{display:block;font-weight:700;font-size:14px;margin-bottom:6px}.sp-friend-controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.sp-friend-btn{border:0;border-radius:7px;padding:8px 11px;font-weight:700;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:5px}.sp-friend-btn .sp-icon{width:16px;height:16px}.sp-friend-btn.is-add,.sp-friend-btn.is-accept{background:var(--sp-blue);color:#fff}.sp-friend-btn.is-sent,.sp-friend-btn.is-friends,.sp-friend-btn.is-reject{background:#e4e6eb;color:#1c1e21}.sp-friend-btn:disabled{opacity:.55;cursor:wait}.sp-friend-compact .sp-friend-btn{padding:6px 9px;font-size:11px}.sp-person-card{display:flex;flex-direction:column;align-items:stretch;gap:12px;text-align:left}.sp-person-main{display:flex;align-items:center;gap:12px;min-width:0}.sp-person-avatar-wrap{position:relative;line-height:0}.sp-person-avatar-wrap i{position:absolute;right:1px;bottom:1px;width:12px;height:12px;border-radius:50%;background:#31a24c;border:2px solid #fff}.sp-person-copy{display:flex;min-width:0;flex-direction:column;gap:3px}.sp-person-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-person-copy small{color:var(--sp-muted);font-size:12px}.sp-person-card .sp-friend-controls{margin-top:auto}.sp-person-card .sp-friend-btn{width:100%}.sp-contact>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:800px){.sp-stories{border-radius:0;margin-bottom:10px}.sp-stories-scroll{grid-auto-columns:104px}.sp-story-card{height:176px}.sp-story-stage{width:100vw;height:100vh;border-radius:0}.sp-story-prev{left:8px}.sp-story-next{right:8px}.sp-friend-requests-widget{display:none}.sp-toast{bottom:72px}.sp-nav-badge{border-color:#fff}}


/* V1.7 Front-end authentication */
.sp-auth-body{margin:0;background:#f0f2f5;color:#1c1e21;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.sp-auth-page{min-height:calc(100vh - 140px);max-width:980px;margin:0 auto;padding:80px 24px;display:grid;grid-template-columns:1fr 396px;gap:70px;align-items:center}.sp-auth-intro{align-self:center;padding-bottom:62px}.sp-auth-logo{display:inline-block;color:#1877f2;font-size:56px;line-height:1;font-weight:800;letter-spacing:-2.5px}.sp-auth-intro p{max-width:500px;margin:18px 0 0;font-size:27px;line-height:1.16}.sp-auth-panel{background:#fff;padding:14px 16px 22px;border-radius:10px;box-shadow:0 2px 12px rgba(0,0,0,.13);text-align:center}.sp-auth-form{display:grid;gap:10px}.sp-auth-form input{width:100%;height:52px;padding:0 14px;border:1px solid #dddfe2;border-radius:7px;background:#fff;font-size:16px;outline:0}.sp-auth-form input:focus{border-color:#1877f2;box-shadow:0 0 0 2px #e7f3ff}.sp-auth-remember{display:flex;align-items:center;gap:7px;text-align:left;color:#65676b;font-size:12px}.sp-auth-remember input{width:16px;height:16px}.sp-auth-login-btn{height:48px;border:0;border-radius:7px;background:#1877f2;color:#fff;font-size:19px;font-weight:700;cursor:pointer}.sp-auth-forgot,.sp-auth-secondary-link{display:block;margin:13px 0;color:#1877f2;font-size:13px}.sp-auth-divider{position:relative;height:30px;margin:2px 0 10px;border-top:1px solid #dadde1}.sp-auth-divider span{position:relative;top:-11px;background:#fff;padding:0 10px;color:#65676b}.sp-auth-create-btn{display:inline-flex;min-height:45px;padding:0 18px;border:0;border-radius:6px;background:#42b72a;color:#fff;align-items:center;justify-content:center;font-size:15px;font-weight:700;cursor:pointer}.sp-auth-create-btn.is-submit{margin:5px auto 0}.sp-auth-title{text-align:left;padding:4px 2px 12px;border-bottom:1px solid #dadde1;margin-bottom:12px}.sp-auth-title h1{font-size:24px;margin:0}.sp-auth-title p{margin:4px 0 0;color:#606770}.sp-auth-name-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sp-auth-alert{margin:0 0 10px;padding:10px 12px;border-radius:7px;text-align:left;font-size:13px}.sp-auth-alert.is-error{background:#fff0f0;color:#a12622;border:1px solid #ffd1d1}.sp-auth-alert.is-success{background:#effaf2;color:#147a31;border:1px solid #c9efd3}.sp-auth-footer{max-width:980px;margin:0 auto;padding:15px 24px 34px;text-align:center;color:#737373;font-size:13px}.sp-auth-footer nav{display:flex;gap:24px;justify-content:center;margin-bottom:18px}.sp-auth-footer a,.sp-auth-footer nav span{color:#1c1e21}

/* Application pages */
.sp-app-page{grid-column:1/-1;width:min(1040px,100%);margin:0 auto;padding:8px 0 80px}.sp-app-page-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:6px 0 18px}.sp-app-page-head h1{margin:0;font-size:28px}.sp-app-page-head p{margin:5px 0 0;color:var(--sp-muted)}.sp-app-primary,.sp-app-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 16px;border:0;border-radius:8px;font-weight:700;cursor:pointer}.sp-app-primary{background:var(--sp-blue);color:#fff}.sp-app-secondary{background:#e4e6eb;color:#1c1e21}.sp-app-alert{padding:11px 13px;border-radius:8px;margin-bottom:12px}.sp-app-alert.is-error{background:#fff0f0;color:#a12622}.sp-app-alert.is-success{background:#effaf2;color:#147a31}
.sp-settings-grid{display:grid;grid-template-columns:230px 1fr;gap:16px}.sp-settings-nav,.sp-settings-card{background:#fff;border-radius:12px;box-shadow:var(--sp-shadow)}.sp-settings-nav{height:max-content;padding:8px;position:sticky;top:72px}.sp-settings-nav a{display:flex;align-items:center;gap:10px;padding:11px;border-radius:8px;font-weight:650}.sp-settings-nav a:hover,.sp-settings-nav a.active{background:var(--sp-bg);color:var(--sp-blue)}.sp-settings-nav .sp-icon{width:19px;height:19px}.sp-settings-nav .is-danger{color:#b42318}.sp-settings-content{display:grid;gap:16px}.sp-settings-card{padding:20px}.sp-settings-card h2{margin:0 0 16px;font-size:19px}.sp-settings-user{display:flex;align-items:center;gap:12px;margin-bottom:18px}.sp-settings-user div{display:flex;flex-direction:column}.sp-settings-user small{color:var(--sp-muted)}.sp-settings-form{display:grid;gap:13px}.sp-settings-form label{display:grid;gap:6px;font-size:13px;font-weight:650}.sp-settings-form input,.sp-settings-form textarea,.sp-settings-form select{width:100%;border:1px solid var(--sp-line);border-radius:8px;background:#fff;padding:10px 11px;outline:0}.sp-settings-form textarea{min-height:100px;resize:vertical}.sp-settings-form input:focus,.sp-settings-form textarea:focus,.sp-settings-form select:focus{border-color:#86adff;box-shadow:0 0 0 3px rgba(8,102,255,.08)}.sp-form-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sp-settings-form .sp-app-primary{justify-self:start}

/* Friend search */
.sp-friend-search{display:grid;grid-template-columns:1fr auto;gap:8px;background:#fff;padding:12px;border-radius:12px;box-shadow:var(--sp-shadow)}.sp-friend-search input{height:44px;border:0;border-radius:22px;background:var(--sp-bg);padding:0 16px;outline:0}.sp-friend-search button{border:0;border-radius:9px;background:var(--sp-blue);color:#fff;padding:0 18px;display:flex;align-items:center;gap:7px;font-weight:700;cursor:pointer}.sp-friend-search .sp-icon{width:18px;height:18px}.sp-friend-tabs{display:flex;gap:5px;margin:12px 0;background:#fff;padding:6px;border-radius:11px;box-shadow:var(--sp-shadow)}.sp-friend-tabs a{position:relative;padding:10px 14px;border-radius:7px;font-weight:650;color:var(--sp-muted)}.sp-friend-tabs a.active,.sp-friend-tabs a:hover{background:var(--sp-bg);color:var(--sp-blue)}.sp-friend-tabs b{display:inline-grid;place-items:center;margin-left:6px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#e41e3f;color:#fff;font-size:11px}.sp-search-summary{color:var(--sp-muted);font-size:13px}.sp-friends-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sp-friend-result{background:#fff;border-radius:12px;box-shadow:var(--sp-shadow);padding:14px;display:flex;align-items:center;gap:12px;min-width:0}.sp-friend-result-user{display:flex;align-items:center;gap:11px;min-width:0;flex:1}.sp-friend-result-user>span:last-child{display:flex;flex-direction:column;min-width:0}.sp-friend-result-user strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-friend-result-user small{color:var(--sp-muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-friend-result .sp-friend-controls{flex:0 0 auto}.sp-friend-result .sp-friend-btn{white-space:nowrap}

/* Improved grouped Stories */
.sp-stories-title{display:flex;align-items:baseline;justify-content:space-between;padding:12px 14px 0}.sp-stories-title strong{font-size:16px}.sp-stories-title span{color:var(--sp-muted);font-size:11px}.sp-story-card.has-unseen .sp-story-user-avatar .sp-avatar{border-color:#0866ff}.sp-story-card.is-seen .sp-story-user-avatar .sp-avatar{border-color:#c4c8cc}.sp-story-progress-bars{position:absolute;z-index:7;top:9px;left:10px;right:10px;display:flex;gap:3px}.sp-story-progress-bars>span{height:3px;flex:1;border-radius:99px;background:rgba(255,255,255,.35);overflow:hidden}.sp-story-progress-bars i{display:block;width:0;height:100%;background:#fff}.sp-story-delete{position:absolute;z-index:7;right:58px;bottom:18px;border:0;border-radius:18px;padding:8px 12px;background:rgba(0,0,0,.48);color:#fff;font-size:11px;cursor:pointer}.sp-story-privacy{display:grid;gap:5px;margin-top:10px;color:var(--sp-muted);font-size:12px}.sp-story-privacy select{height:38px;border:1px solid var(--sp-line);border-radius:8px;background:#fff;padding:0 10px;color:var(--sp-text)}

@media(max-width:800px){.sp-auth-page{min-height:auto;padding:55px 34px 100px;display:block}.sp-auth-intro{text-align:center;padding:0 0 46px}.sp-auth-logo{font-size:41px;letter-spacing:-1.5px}.sp-auth-intro p{display:none}.sp-auth-panel{box-shadow:none;padding:0;background:transparent}.sp-auth-form input{height:50px;background:#fff7f7;border:0}.sp-auth-login-btn{height:50px;background:#164df5}.sp-auth-divider{border-top-color:#1c1e21;margin-top:22px}.sp-auth-divider span{background:#f0f2f5;color:#1c1e21}.sp-auth-create-btn{border-radius:0;background:#0bb313}.sp-auth-footer{padding-bottom:70px}.sp-settings-grid{grid-template-columns:1fr}.sp-settings-nav{position:static;display:flex;overflow:auto}.sp-settings-nav a{white-space:nowrap}.sp-friends-results{grid-template-columns:1fr}.sp-app-page{padding:0 10px 75px}.sp-app-page-head{padding:8px 4px}.sp-friend-result{align-items:flex-start;flex-direction:column}.sp-friend-result .sp-friend-controls{width:100%}.sp-friend-result .sp-friend-btn{flex:1}.sp-stories-title span{display:none}}
@media(max-width:480px){.sp-auth-page{padding:48px 33px 90px}.sp-auth-name-grid,.sp-form-two{grid-template-columns:1fr}.sp-auth-logo{font-size:39px}.sp-friend-search button span{display:none}.sp-friend-tabs{overflow:auto}.sp-friend-tabs a{white-space:nowrap}}



/* --- Comments popup modal --- */
.sp-social-stats .sp-comment-stat{
  border:0;
  background:transparent;
  color:var(--sp-muted);
  padding:0;
  cursor:pointer;
  font:inherit;
}
.sp-social-stats .sp-comment-stat:hover{color:#111827;text-decoration:underline}
.sp-comments-modal{
  position:fixed;
  inset:0;
  z-index:10040;
  display:none;
}
.sp-comments-modal.is-open{display:block}
.sp-comments-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(2px);
}
.sp-comments-dialog{
  position:relative;
  z-index:2;
  width:min(1160px, calc(100vw - 32px));
  height:min(92vh, 880px);
  margin:24px auto;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 20px 70px rgba(0,0,0,.38);
  display:flex;
  flex-direction:column;
}
.sp-comments-dialog-head{
  height:60px;
  flex:0 0 auto;
  display:grid;
  grid-template-columns:48px 1fr 48px;
  align-items:center;
  padding:0 16px;
  border-bottom:1px solid var(--sp-line);
  background:#fff;
}
.sp-comments-dialog-head h3{
  margin:0;
  text-align:center;
  font-size:20px;
  font-weight:800;
}
.sp-comments-dialog-close{
  width:40px;
  height:40px;
  border-radius:50%;
  border:0;
  background:#e4e6eb;
  color:#1c1e21;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.sp-comments-dialog-close:hover{background:#d7dade}
.sp-comments-dialog-close-left{justify-self:start}
.sp-comments-dialog-body{
  min-height:0;
  flex:1 1 auto;
  background:#fff;
}
.sp-comments-loading{
  height:100%;
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:center;
  color:#65676b;
  flex-direction:column;
}
.sp-comments-loading-spinner{
  width:34px;
  height:34px;
  border-radius:50%;
  border:3px solid #dfe3e8;
  border-top-color:var(--sp-blue);
  animation:spCommentSpin .9s linear infinite;
}
@keyframes spCommentSpin{to{transform:rotate(360deg)}}
.sp-dialog-layout{
  height:100%;
  display:grid;
  grid-template-columns:minmax(0, 1.3fr) minmax(360px, .82fr);
}
.sp-dialog-layout.no-media{grid-template-columns:1fr}
.sp-dialog-media-pane{
  background:#0f0f10;
  position:relative;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:auto;
}
.sp-dialog-media-inner{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sp-dialog-media-pane .sp-media-grid{
  width:100%;
  height:100%;
  margin:0;
  border-radius:0;
  background:transparent;
}
.sp-dialog-media-pane .sp-count-1{grid-template-columns:1fr}
.sp-dialog-media-pane .sp-media-item{
  min-height:100%;
  background:#0f0f10;
}
.sp-dialog-media-pane .sp-media-item img.sp-media-el,
.sp-dialog-media-pane .sp-media-item video.sp-media-el{
  max-height:none;
  min-height:100%;
  height:100%;
  object-fit:contain;
  background:#0f0f10;
}
.sp-dialog-no-media{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#f3f4f6,#e5e7eb);
}
.sp-dialog-no-media-copy{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  color:#374151;
  font-weight:700;
}
.sp-dialog-no-media-copy .sp-icon{
  width:52px;
  height:52px;
  color:var(--sp-blue);
}
.sp-dialog-no-media-copy span{
  color:#6b7280;
  font-size:14px;
  font-weight:600;
}
.sp-dialog-side-pane{
  min-width:0;
  display:flex;
  flex-direction:column;
  background:#fff;
}
.sp-dialog-post-head{
  display:flex;
  gap:10px;
  align-items:center;
  padding:14px 16px 10px;
  border-bottom:1px solid var(--sp-line);
}
.sp-dialog-post-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.sp-dialog-post-meta .sp-author{font-weight:800}
.sp-dialog-post-meta span{font-size:13px;color:var(--sp-muted)}
.sp-dialog-post-text{
  padding:14px 16px 2px;
  color:#111827;
  font-size:15px;
  line-height:1.48;
  overflow-wrap:anywhere;
}
.sp-dialog-statline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 16px;
  color:var(--sp-muted);
  border-bottom:1px solid var(--sp-line);
}
.sp-dialog-statline .sp-dialog-stat-comments{
  border:0;
  background:transparent;
  color:var(--sp-muted);
  padding:0;
  font:inherit;
  cursor:pointer;
}
.sp-dialog-statline .sp-dialog-stat-comments:hover{text-decoration:underline}
.sp-dialog-actions{
  padding:6px 10px;
  border-bottom:1px solid var(--sp-line);
}
.sp-dialog-comments-head{
  display:flex;
  align-items:center;
  gap:6px;
  padding:12px 16px 8px;
  font-size:14px;
  font-weight:700;
  color:#111827;
}
.sp-dialog-comments-head .sp-icon{width:16px;height:16px;color:var(--sp-muted)}
.sp-dialog-comments-scroll{
  min-height:0;
  flex:1 1 auto;
  overflow:auto;
  padding:0 16px 14px;
}
.sp-dialog-comments-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.sp-dialog-comments-empty{
  padding:18px 10px;
  text-align:center;
  color:var(--sp-muted);
  font-size:14px;
}
.sp-dialog-comment{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.sp-dialog-comment-avatar{flex:0 0 auto}
.sp-dialog-comment-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.sp-dialog-comment-bubble{
  background:#f0f2f5;
  border-radius:18px;
  padding:10px 12px;
}
.sp-dialog-comment-bubble strong{
  display:block;
  font-size:13px;
  margin-bottom:3px;
  color:#111827;
}
.sp-dialog-comment-text{
  font-size:14px;
  line-height:1.42;
  color:#111827;
}
.sp-dialog-comment-text p{margin:.2em 0}
.sp-dialog-comment-meta{
  display:flex;
  gap:10px;
  padding-left:10px;
  font-size:12px;
  color:var(--sp-muted);
}
.sp-dialog-form-shell{
  border-top:1px solid var(--sp-line);
  padding:12px 16px 14px;
  background:#fff;
}
.sp-dialog-comment-form{display:block}
.sp-dialog-comment-input-row{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.sp-dialog-comment-input-wrap{
  min-width:0;
  flex:1;
  background:#f0f2f5;
  border-radius:16px;
  padding:10px 12px;
}
.sp-dialog-comment-input-wrap textarea{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  resize:none;
  min-height:46px;
  max-height:140px;
  font:inherit;
  color:#111827;
}
.sp-dialog-comment-input-wrap textarea::placeholder{color:#6b7280}
.sp-dialog-comment-actions{
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.sp-dialog-comment-actions small{color:var(--sp-muted);font-size:12px}
.sp-dialog-comment-submit{
  border:0;
  height:34px;
  padding:0 16px;
  border-radius:999px;
  background:var(--sp-blue);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}
.sp-dialog-comment-submit:disabled{opacity:.65;cursor:not-allowed}
.sp-dialog-comment-focus{
  border:0;
  background:transparent;
}
.sp-dialog-comment-login{
  text-align:center;
  color:var(--sp-muted);
}
.sp-dialog-login-btn{
  display:inline-flex;
  width:auto;
  margin-top:8px;
  padding:0 16px;
  align-items:center;
  justify-content:center;
}
.sp-comments-modal .sp-video-controls{
  opacity:1;
  transform:none;
}
.sp-comments-modal .sp-video-shell .sp-video-center{
  opacity:1;
}
@media (max-width:980px){
  .sp-comments-dialog{
    width:min(100vw, 100vw);
    height:min(100vh, 100vh);
    margin:0;
    border-radius:0;
  }
  .sp-dialog-layout{
    grid-template-columns:1fr;
    height:100%;
  }
  .sp-dialog-media-pane{
    min-height:260px;
    max-height:46vh;
  }
}
@media (max-width:640px){
  .sp-comments-dialog-head{
    grid-template-columns:40px 1fr 40px;
    padding:0 10px;
    height:56px;
  }
  .sp-comments-dialog-head h3{font-size:18px}
  .sp-comments-dialog-close{
    width:36px;
    height:36px;
  }
  .sp-dialog-post-head,
  .sp-dialog-post-text,
  .sp-dialog-statline,
  .sp-dialog-comments-head,
  .sp-dialog-comments-scroll,
  .sp-dialog-form-shell{padding-left:12px;padding-right:12px}
  .sp-dialog-comment-actions{
    flex-direction:column;
    align-items:flex-end;
  }
  .sp-dialog-comment-actions small{align-self:flex-start}
}



/* ===== V1.8.1 reliability + UI polish ===== */

/* Non-admin members never need toolbar spacing even if another plugin adds it. */
body:not(.logged-in.admin-bar){margin-top:0}
body.sp-member-no-adminbar{margin-top:0}

/* Feed cards */
.sp-post-card{
  border:1px solid rgba(15,23,42,.055);
  box-shadow:0 1px 2px rgba(15,23,42,.055),0 5px 18px rgba(15,23,42,.035);
  transition:transform .24s cubic-bezier(.2,.75,.2,1),box-shadow .24s ease,border-color .24s ease;
}
.sp-post-card:hover{
  transform:translateY(-1px);
  border-color:rgba(8,102,255,.08);
  box-shadow:0 3px 8px rgba(15,23,42,.075),0 10px 26px rgba(15,23,42,.055);
}

/* Media entrance */
.sp-media-item .sp-media-el{
  transform:scale(1.008);
  filter:saturate(.96);
  transition:opacity .38s ease,transform .55s cubic-bezier(.2,.75,.2,1),filter .5s ease;
}
.sp-media-item.sp-loaded .sp-media-el{
  transform:scale(1);
  filter:saturate(1);
}
.sp-media-item.sp-loaded .sp-media-skeleton{
  animation:spSkeletonOut .28s ease both;
}
@keyframes spSkeletonOut{
  from{opacity:1}
  to{opacity:0}
}

/* Cleaner unavailable state */
.sp-media-error{
  background:
    radial-gradient(circle at 50% 35%,rgba(255,255,255,.92),rgba(240,242,245,.96) 55%),
    #f0f2f5;
}
.sp-media-error .sp-media-error-icon{
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  background:#fff;
  box-shadow:0 4px 16px rgba(15,23,42,.08);
}
.sp-media-error small{font-weight:700;color:#69707a}

/* Buttons */
.sp-actions button,.sp-actions a{
  border-radius:8px;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.sp-actions button:hover,.sp-actions a:hover{
  background:#eef1f5;
  transform:translateY(-1px);
}
.sp-actions .is-liked{
  background:rgba(8,102,255,.07);
}
.sp-action-pop{animation:spActionPop .38s cubic-bezier(.2,.9,.3,1)}
.sp-action-tap{animation:spActionTap .26s ease}
@keyframes spActionPop{
  0%{transform:scale(1)}
  42%{transform:scale(1.10)}
  72%{transform:scale(.98)}
  100%{transform:scale(1)}
}
@keyframes spActionTap{
  0%{transform:scale(1)}
  50%{transform:scale(.96)}
  100%{transform:scale(1)}
}

/* Composer */
.sp-composer{
  border:1px solid rgba(15,23,42,.055);
  box-shadow:0 1px 2px rgba(15,23,42,.05),0 5px 18px rgba(15,23,42,.03);
}
.sp-composer-trigger{
  transition:background .2s ease,box-shadow .2s ease,transform .2s ease;
}
.sp-composer-trigger:hover{
  background:#e9edf2;
  box-shadow:inset 0 0 0 1px rgba(8,102,255,.05);
}

/* Side nav and contacts */
.sp-side-link,.sp-contact{
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.sp-side-link:hover,.sp-contact:hover{transform:translateX(2px)}
.sp-online-wrap i{
  box-shadow:0 0 0 2px #fff;
}

/* Modal transitions */
.sp-comments-modal.is-open .sp-comments-backdrop{animation:spBackdropIn .2s ease both}
.sp-comments-modal.is-open .sp-comments-dialog{
  animation:spDialogIn .28s cubic-bezier(.2,.82,.2,1) both;
}
@keyframes spBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes spDialogIn{
  from{opacity:0;transform:translateY(10px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.sp-comments-dialog-close{
  transition:background .15s ease,transform .18s ease;
}
.sp-comments-dialog-close:hover{transform:rotate(6deg) scale(1.04)}

/* Story cards */
.sp-story-card{
  transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease;
}
.sp-story-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 22px rgba(15,23,42,.12);
}

/* Toast */
.sp-toast{
  transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.2,1);
}
.sp-toast.is-showing{
  transform:translate(-50%,0) scale(1);
}

/* Page reveal */
.sp-reveal-ready{
  will-change:opacity,transform;
}
.sp-reveal-ready.sp-revealed{
  animation:spCardReveal .42s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes spCardReveal{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

@media (prefers-reduced-motion:reduce){
  .sp-post-card:hover,.sp-side-link:hover,.sp-contact:hover,.sp-actions button:hover,.sp-actions a:hover{
    transform:none!important;
  }
}



/* ===== twittsocial.com Groups V1.9 ===== */
.sp-groups-nav{position:relative}
.sp-side-count{
  margin-left:auto;
  min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#f02849;color:#fff;font-size:11px;
}
.sp-group-page{
  width:min(1280px,100%);
  margin:0 auto;
  padding:18px 18px 90px;
}
.sp-groups-directory{max-width:1180px;margin:0 auto}
.sp-groups-hero{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
  margin-bottom:18px;padding:4px 2px;
}
.sp-groups-eyebrow{color:var(--sp-blue);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.sp-groups-hero h1{margin:3px 0 5px;font-size:30px;letter-spacing:-.03em}
.sp-groups-hero p{margin:0;color:var(--sp-muted);max-width:650px}
.sp-group-primary,.sp-group-open-btn,.sp-group-action-btn{
  min-height:40px;padding:0 16px;border:0;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--sp-blue);color:#fff;font-weight:800;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.sp-group-primary:hover,.sp-group-open-btn:hover,.sp-group-action-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(8,102,255,.2)}
.sp-group-primary .sp-icon{width:20px;height:20px}
.sp-group-action-btn.secondary{background:#e4e6eb;color:#111827}
.sp-group-toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;margin-bottom:16px;
  box-shadow:0 2px 12px rgba(15,23,42,.04)
}
.sp-group-search{display:flex;align-items:center;gap:8px;min-width:260px;flex:1;max-width:420px;background:#f0f2f5;border-radius:999px;padding:0 13px;height:40px}
.sp-group-search .sp-icon{width:18px;height:18px;color:var(--sp-muted)}
.sp-group-search input{border:0;outline:0;background:transparent;width:100%}
.sp-group-tabs{display:flex;align-items:center;gap:6px}
.sp-group-tabs a{position:relative;padding:10px 12px;border-radius:8px;color:var(--sp-muted);font-weight:700;font-size:14px}
.sp-group-tabs a:hover{background:#f0f2f5}
.sp-group-tabs a.active{color:var(--sp-blue);background:#eef4ff}
.sp-group-tabs a span{display:inline-grid;place-items:center;margin-left:4px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#f02849;color:#fff;font-size:10px}
.sp-group-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sp-group-card{overflow:hidden;background:#fff;border:1px solid #e5e7eb;border-radius:13px;box-shadow:0 2px 14px rgba(15,23,42,.045);transition:transform .2s ease,box-shadow .2s ease}
.sp-group-card:hover{transform:translateY(-2px);box-shadow:0 9px 26px rgba(15,23,42,.08)}
.sp-group-card-cover{height:155px;background:linear-gradient(135deg,#dbeafe,#e9d5ff);background-size:cover;background-position:center;display:grid;place-items:center;color:#667085}
.sp-group-card-cover .sp-icon{width:52px;height:52px}
.sp-group-card-body{padding:14px}
.sp-group-card-title{display:block;font-size:17px;font-weight:850;color:#111827;margin-bottom:4px}
.sp-group-card-meta{display:block;color:var(--sp-muted);font-size:12px}
.sp-group-card-body p{margin:9px 0 14px;color:#667085;font-size:13px;line-height:1.45;min-height:38px}
.sp-group-card-actions{display:flex;gap:8px}
.sp-group-card-actions .sp-group-open-btn,.sp-group-card-actions .sp-group-action-btn{flex:1;min-height:37px;font-size:13px}
.sp-group-open-btn{background:#e7efff;color:var(--sp-blue)}
.sp-group-empty,.sp-group-join-wall{padding:56px 20px;text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:13px;color:var(--sp-muted)}
.sp-group-empty>span,.sp-group-join-wall>.sp-icon{display:grid;place-items:center;margin:0 auto 12px;width:58px;height:58px;border-radius:50%;background:#edf3ff;color:var(--sp-blue)}
.sp-group-empty .sp-icon,.sp-group-join-wall>.sp-icon{width:28px;height:28px}
.sp-group-empty h2,.sp-group-join-wall h2{margin:0 0 5px;color:#111827}
.sp-group-empty p,.sp-group-join-wall p{margin:0 auto 16px;max-width:500px}

/* Create group */
.sp-group-create-shell{display:grid;grid-template-columns:390px minmax(0,1fr);gap:22px;max-width:1450px;margin:0 auto}
.sp-group-create-form,.sp-group-create-preview-wrap{background:#fff;border:1px solid #e4e7ec;border-radius:13px;box-shadow:0 3px 18px rgba(15,23,42,.05)}
.sp-group-create-form{padding:18px;display:flex;flex-direction:column;gap:14px}
.sp-group-create-head{display:flex;align-items:center;gap:7px;color:var(--sp-muted);font-size:13px}
.sp-group-create-head strong{font-size:23px;color:#111827;margin-left:0}
.sp-group-owner-mini{display:flex;align-items:center;gap:10px;padding:5px 0 3px}
.sp-group-owner-mini div{display:flex;flex-direction:column}.sp-group-owner-mini small{color:var(--sp-muted)}
.sp-group-field{display:flex;flex-direction:column;gap:6px}
.sp-group-field>span{font-size:12px;color:#667085;font-weight:700}
.sp-group-field input,.sp-group-field select,.sp-group-field textarea{
  width:100%;border:1px solid #d0d5dd;border-radius:9px;padding:11px 12px;background:#fff;outline:0
}
.sp-group-field input:focus,.sp-group-field select:focus,.sp-group-field textarea:focus{border-color:#86adff;box-shadow:0 0 0 3px rgba(8,102,255,.08)}
.sp-group-create-submit{margin-top:auto;min-height:44px;border:0;border-radius:9px;background:var(--sp-blue);color:#fff;font-weight:850;cursor:pointer}
.sp-group-create-preview-wrap{padding:18px;background:#f8fafc}
.sp-group-preview-label{font-size:22px;font-weight:850;margin:0 0 14px;color:#111827}
.sp-group-preview{background:#fff;border:1px solid #dfe3e8;border-radius:12px;overflow:hidden}
.sp-group-preview-cover{height:300px;background:#e4e6eb;display:grid;place-items:center;overflow:hidden}
.sp-group-preview-art{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,#eef0f2,#d7dadd);color:#9aa0a6}
.sp-group-preview-art .sp-icon{width:100px;height:100px;opacity:.45}
.sp-group-preview-info{padding:22px 28px 0}
.sp-group-preview-info h2{margin:0;font-size:27px}.sp-group-preview-info p{color:var(--sp-muted);margin:6px 0 18px}
.sp-group-preview-info nav{display:flex;gap:28px;border-top:1px solid #e5e7eb;padding:18px 4px;color:#667085;font-weight:700}
.sp-group-preview-body{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;background:#f0f2f5;padding:18px 28px}
.sp-group-preview-composer,.sp-group-preview-about{background:#fff;border-radius:10px;padding:14px;border:1px solid #e5e7eb}
.sp-group-preview-composer>div{display:flex;align-items:center;gap:10px}.sp-group-preview-composer>div span{flex:1;background:#f0f2f5;border-radius:999px;padding:10px;color:#8b9096}
.sp-group-preview-composer small{display:block;margin-top:12px;text-align:center;color:#8b9096}
.sp-group-preview-about h3{margin:0}.sp-group-preview-about p{font-size:13px;line-height:1.35}.sp-group-preview-about span{color:#667085}

/* Group profile */
.sp-group-profile{max-width:1020px;margin:0 auto 16px;background:#fff;border:1px solid #e5e7eb;border-radius:13px;overflow:hidden;box-shadow:0 3px 18px rgba(15,23,42,.04)}
.sp-group-cover{height:310px;background:linear-gradient(135deg,#dbeafe,#e9d5ff);background-size:cover;background-position:center;display:grid;place-items:center;color:#8b93a1}
.sp-group-cover>.sp-icon{width:90px;height:90px;opacity:.55}
.sp-group-profile-info{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:18px 24px 13px}
.sp-group-profile-info h1{margin:0;font-size:29px;letter-spacing:-.025em}.sp-group-profile-info p{margin:5px 0 0;color:var(--sp-muted)}
.sp-group-profile-tabs{display:flex;gap:8px;border-top:1px solid #e5e7eb;padding:7px 20px}
.sp-group-profile-tabs a{padding:11px 15px;border-radius:8px;font-weight:750;color:#667085}.sp-group-profile-tabs a.active{color:var(--sp-blue);background:#eef4ff}
.sp-group-content-grid{max-width:1020px;margin:0 auto;display:grid;grid-template-columns:minmax(0,650px) minmax(270px,350px);gap:16px;align-items:start}
.sp-group-main{min-width:0}
.sp-group-sidebar{display:flex;flex-direction:column;gap:14px;position:sticky;top:72px}
.sp-group-about-card,.sp-group-members-card,.sp-group-settings-card,.sp-group-owner-notifications,.sp-group-composer,.sp-group-locked-note{
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 12px rgba(15,23,42,.035)
}
.sp-group-about-card,.sp-group-members-card,.sp-group-settings-card{padding:15px}
.sp-group-about-card h3,.sp-group-members-card h3,.sp-group-settings-card h3{margin:0 0 12px}
.sp-group-about-card>p{color:#667085;font-size:13px;line-height:1.5}
.sp-group-about-line{display:flex;gap:10px;margin:13px 0}.sp-group-about-line>.sp-icon{width:21px;height:21px}.sp-group-about-line div{display:flex;flex-direction:column}.sp-group-about-line span{font-size:12px;color:#667085;margin-top:2px}
.sp-group-member-list{display:flex;flex-direction:column;gap:8px}
.sp-group-member-list a{display:flex;align-items:center;gap:10px;padding:6px;border-radius:8px}.sp-group-member-list a:hover{background:#f5f6f7}
.sp-group-member-list a span{display:flex;flex-direction:column;font-size:13px;font-weight:750}.sp-group-member-list small{font-size:10px;color:var(--sp-blue)}
.sp-group-settings-card form{display:flex;flex-direction:column;gap:10px}.sp-group-settings-card label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#667085;font-weight:700}
.sp-group-settings-card select,.sp-group-settings-card textarea{border:1px solid #d0d5dd;border-radius:8px;padding:9px}.sp-group-settings-card button{height:38px;border:0;border-radius:8px;background:var(--sp-blue);color:#fff;font-weight:800}
.sp-group-owner-notifications{max-width:1020px;margin:0 auto 16px;padding:14px}
.sp-group-section-title{display:flex;gap:10px;align-items:center;border-bottom:1px solid #e5e7eb;padding-bottom:11px;margin-bottom:6px}.sp-group-section-title>.sp-icon{color:var(--sp-blue)}.sp-group-section-title div{display:flex;flex-direction:column}.sp-group-section-title span{font-size:12px;color:var(--sp-muted)}
.sp-group-request-row{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;padding:11px 3px;border-bottom:1px solid #f0f1f2}
.sp-group-request-row:last-child{border-bottom:0}.sp-group-request-copy{display:flex;flex-direction:column}.sp-group-request-copy span,.sp-group-request-copy small{font-size:12px;color:#667085}.sp-group-request-copy small{margin-top:5px}
.sp-group-request-actions{display:flex;gap:7px}.sp-group-request-actions button{height:34px;border:0;border-radius:8px;background:var(--sp-blue);color:#fff;font-weight:800;padding:0 13px;cursor:pointer}.sp-group-request-actions button.secondary{background:#e4e6eb;color:#111827}
.sp-group-composer{margin-bottom:16px;padding:12px 14px}
.sp-group-composer-top{display:flex;gap:10px;align-items:flex-start}.sp-group-composer-top textarea{flex:1;border:0;background:#f0f2f5;border-radius:16px;padding:12px 14px;resize:vertical;min-height:60px;outline:0}
.sp-group-composer-bottom{display:flex;align-items:center;gap:10px;border-top:1px solid #e5e7eb;margin-top:10px;padding-top:9px}
.sp-group-composer-bottom label{position:relative;display:flex;align-items:center;gap:7px;color:#667085;font-weight:750;cursor:pointer}.sp-group-composer-bottom label input{position:absolute;width:1px;height:1px;opacity:0}
.sp-group-composer-bottom label .sp-icon{color:#45bd62}.sp-group-composer-bottom>button{margin-left:auto;height:36px;border:0;border-radius:8px;background:var(--sp-blue);color:#fff;font-weight:800;padding:0 17px}
.sp-group-composer-note{display:block;margin-top:7px;color:#8a9099}
.sp-group-upload-progress{width:130px;height:7px;border-radius:999px;background:#e5e7eb;position:relative;overflow:visible}.sp-group-upload-progress span{display:block;width:0;height:100%;border-radius:inherit;background:var(--sp-blue)}.sp-group-upload-progress small{position:absolute;right:-32px;top:-5px;font-size:10px;color:#667085}
.sp-group-locked-note{padding:15px;margin-bottom:16px;display:flex;align-items:center;gap:10px;color:#667085}.sp-group-locked-note .sp-icon{width:22px;height:22px;color:#667085}
.sp-group-message{max-width:1020px;margin:0 auto 12px;padding:11px 14px;border-radius:9px}.sp-group-message.success{background:#ecfdf3;color:#067647}.sp-group-message.error{background:#fef3f2;color:#b42318}
.sp-group-post-card{margin-bottom:16px}

@media(max-width:1050px){
  .sp-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sp-group-create-shell{grid-template-columns:340px minmax(0,1fr)}
  .sp-group-preview-cover{height:250px}
}
@media(max-width:850px){
  .sp-group-page{padding:10px 0 78px}
  .sp-groups-directory{padding:0 10px}
  .sp-groups-hero{align-items:flex-start;padding:6px;flex-direction:column}
  .sp-group-toolbar{border-radius:0;border-left:0;border-right:0;flex-direction:column;align-items:stretch}
  .sp-group-search{max-width:none}
  .sp-group-tabs{overflow:auto}
  .sp-group-create-shell{display:block}
  .sp-group-create-form,.sp-group-create-preview-wrap{border-radius:0;border-left:0;border-right:0}
  .sp-group-create-preview-wrap{margin-top:10px}
  .sp-group-content-grid{display:block}
  .sp-group-sidebar{position:static;margin:0 10px}
  .sp-group-main{margin:0 10px}
  .sp-group-profile,.sp-group-owner-notifications{border-radius:0;border-left:0;border-right:0}
}
@media(max-width:600px){
  .sp-group-grid{grid-template-columns:1fr}
  .sp-group-preview-body{grid-template-columns:1fr;padding:12px}
  .sp-group-preview-cover{height:200px}
  .sp-group-preview-info{padding:16px 18px 0}.sp-group-preview-info h2{font-size:22px}
  .sp-group-profile-info{align-items:flex-start;flex-direction:column;padding:15px}
  .sp-group-cover{height:220px}
  .sp-group-profile-info h1{font-size:24px}
  .sp-group-request-row{grid-template-columns:40px 1fr}.sp-group-request-actions{grid-column:2}
  .sp-group-card-actions{flex-direction:column}
}

/* Comment submission UX */
.sp-dialog-comment-submit.is-posting{position:relative;padding-right:34px}
.sp-dialog-comment-submit.is-posting:after{
  content:"";position:absolute;right:12px;top:50%;width:12px;height:12px;margin-top:-6px;
  border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spCommentSpin .7s linear infinite;
}



/* ===== Groups layout/UI fixes V1.9.1 ===== */

/* Groups are application pages, not a homepage sidebar column. */
body.sp-group-route .sp-shell{
  display:block;
  width:100%;
  max-width:1480px;
  margin:0 auto;
  padding:18px 24px 90px;
}
body.sp-group-route .sp-group-page{
  display:block;
  width:100%;
  max-width:1320px;
  min-width:0;
  margin:0 auto;
  padding:0;
  grid-column:1 / -1;
}
body.sp-group-route .sp-left,
body.sp-group-route .sp-right{
  display:none!important;
}

/* Directory */
.sp-groups-directory{
  width:100%;
  max-width:1220px;
  margin:0 auto;
}
.sp-groups-hero{
  min-height:154px;
  padding:24px 28px;
  margin-bottom:16px;
  align-items:center;
  border:1px solid #e2e6ea;
  border-radius:16px;
  background:
    radial-gradient(circle at 88% 22%,rgba(8,102,255,.12),transparent 26%),
    linear-gradient(135deg,#ffffff 0%,#f6f9ff 100%);
  box-shadow:0 5px 24px rgba(15,23,42,.045);
}
.sp-groups-hero>div{min-width:0}
.sp-groups-eyebrow{
  display:inline-flex;
  margin-bottom:4px;
  font-size:11px;
}
.sp-groups-hero h1{
  font-size:32px;
  line-height:1.05;
  margin:0 0 7px;
}
.sp-groups-hero p{
  max-width:660px;
  font-size:14px;
  line-height:1.5;
}
.sp-groups-hero .sp-group-primary{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:142px;
}
.sp-groups-hero .sp-group-primary span{display:inline}

.sp-group-toolbar{
  display:grid;
  grid-template-columns:minmax(260px,420px) minmax(0,1fr);
  align-items:center;
  gap:18px;
  padding:10px 12px;
  min-height:64px;
}
.sp-group-search{
  width:100%;
  min-width:0;
  max-width:none;
}
.sp-group-tabs{
  justify-content:flex-end;
  min-width:0;
}
.sp-group-tabs a{
  white-space:nowrap;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.sp-group-grid{
  width:100%;
  grid-template-columns:repeat(3,minmax(250px,1fr));
}
.sp-group-card{
  min-width:0;
}
.sp-group-card-cover{
  height:168px;
}
.sp-group-card-body{
  min-height:192px;
  display:flex;
  flex-direction:column;
}
.sp-group-card-body p{
  min-height:0;
  flex:1 1 auto;
}
.sp-group-card-actions{
  margin-top:auto;
}
.sp-group-empty{
  width:100%;
  min-height:340px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:48px 24px;
}
.sp-group-empty-cta{
  margin-top:18px;
}
.sp-group-empty-cta .sp-icon{
  width:19px!important;
  height:19px!important;
  margin:0!important;
  background:transparent!important;
}

/* Create group */
.sp-group-create-shell{
  width:100%;
  max-width:1320px;
  grid-template-columns:minmax(340px,410px) minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.sp-group-create-form{
  position:sticky;
  top:74px;
  min-width:0;
  max-height:calc(100vh - 92px);
  overflow:auto;
  padding:20px;
}
.sp-group-create-head{
  display:block;
  padding-bottom:4px;
}
.sp-group-create-breadcrumb{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--sp-muted);
  font-size:12px;
  margin-bottom:6px;
}
.sp-group-create-head>strong{
  display:block;
  color:#111827;
  font-size:25px;
  line-height:1.1;
}
.sp-group-create-head>p{
  margin:6px 0 0;
  color:#667085;
  font-size:13px;
  line-height:1.4;
}
.sp-group-create-preview-wrap{
  min-width:0;
  padding:20px;
}
.sp-group-preview{
  width:100%;
}
.sp-group-preview-cover{
  height:320px;
  background-size:cover;
  background-position:center;
}
.sp-group-preview-cover.has-cover-preview .sp-group-preview-art{
  opacity:0;
}
.sp-group-preview-art{
  transition:opacity .2s ease;
}
.sp-group-preview-info{
  min-width:0;
}
.sp-group-preview-info h2{
  overflow-wrap:anywhere;
}
.sp-group-preview-info nav{
  overflow:auto;
  scrollbar-width:none;
}
.sp-group-preview-info nav::-webkit-scrollbar{display:none}

/* Individual group */
.sp-group-profile,
.sp-group-owner-notifications,
.sp-group-content-grid{
  width:100%;
  max-width:1120px;
}
.sp-group-profile{
  margin-left:auto;
  margin-right:auto;
}
.sp-group-cover{
  height:340px;
}
.sp-group-profile-info{
  min-width:0;
}
.sp-group-profile-info>div:first-child{
  min-width:0;
}
.sp-group-profile-info h1{
  overflow-wrap:anywhere;
}
.sp-group-content-grid{
  grid-template-columns:minmax(0,720px) minmax(280px,360px);
}
.sp-group-main{width:100%}
.sp-group-sidebar{min-width:0}
.sp-group-composer textarea{min-width:0}
.sp-group-post-card{width:100%}

/* Better request panel */
.sp-group-owner-notifications{
  padding:16px 18px;
}
.sp-group-request-row{
  min-width:0;
}
.sp-group-request-copy{
  min-width:0;
}
.sp-group-request-copy strong,
.sp-group-request-copy span,
.sp-group-request-copy small{
  overflow-wrap:anywhere;
}

/* Tablet */
@media(max-width:1100px){
  body.sp-group-route .sp-shell{
    max-width:1100px;
    padding-left:18px;
    padding-right:18px;
  }
  .sp-group-grid{
    grid-template-columns:repeat(2,minmax(250px,1fr));
  }
  .sp-group-create-shell{
    grid-template-columns:360px minmax(0,1fr);
  }
  .sp-group-preview-cover{
    height:260px;
  }
  .sp-group-preview-body{
    grid-template-columns:1fr;
  }
  .sp-group-content-grid{
    grid-template-columns:minmax(0,1fr) 320px;
  }
}

/* Mobile/tablet */
@media(max-width:850px){
  body.sp-group-route .sp-shell{
    padding:10px 0 78px;
    max-width:none;
  }
  body.sp-group-route .sp-group-page{
    max-width:none;
  }
  .sp-groups-directory{
    padding:0 10px;
  }
  .sp-groups-hero{
    min-height:0;
    margin:0 0 10px;
    padding:18px;
    border-radius:12px;
    align-items:flex-start;
  }
  .sp-groups-hero h1{font-size:28px}
  .sp-groups-hero .sp-group-primary{
    width:100%;
    min-height:42px;
  }
  .sp-group-toolbar{
    display:block;
    padding:10px;
    border-radius:12px;
    border-left:1px solid #e5e7eb;
    border-right:1px solid #e5e7eb;
  }
  .sp-group-search{
    height:42px;
    margin-bottom:8px;
  }
  .sp-group-tabs{
    width:100%;
    justify-content:flex-start;
    overflow:auto;
    scrollbar-width:none;
    padding-bottom:1px;
  }
  .sp-group-tabs::-webkit-scrollbar{display:none}
  .sp-group-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .sp-group-create-shell{
    display:block;
  }
  .sp-group-create-form{
    position:static;
    max-height:none;
    overflow:visible;
    border-radius:12px;
    border-left:1px solid #e4e7ec;
    border-right:1px solid #e4e7ec;
    margin:0 10px;
  }
  .sp-group-create-preview-wrap{
    margin:10px;
    border-radius:12px;
    border-left:1px solid #e4e7ec;
    border-right:1px solid #e4e7ec;
  }
  .sp-group-content-grid{
    display:block;
  }
  .sp-group-sidebar{
    margin:0 10px;
  }
  .sp-group-main{
    margin:0 10px;
  }
  .sp-group-profile,
  .sp-group-owner-notifications{
    width:auto;
    margin-left:10px;
    margin-right:10px;
    border-radius:12px;
    border-left:1px solid #e5e7eb;
    border-right:1px solid #e5e7eb;
  }
}

/* Small mobile */
@media(max-width:580px){
  .sp-group-grid{
    grid-template-columns:1fr;
  }
  .sp-groups-hero{
    padding:16px;
  }
  .sp-groups-hero p{
    font-size:13px;
  }
  .sp-group-create-form,
  .sp-group-create-preview-wrap{
    margin-left:8px;
    margin-right:8px;
  }
  .sp-group-preview-cover{
    height:190px;
  }
  .sp-group-preview-info{
    padding:15px 16px 0;
  }
  .sp-group-preview-info h2{
    font-size:21px;
  }
  .sp-group-preview-info nav{
    gap:18px;
  }
  .sp-group-preview-body{
    padding:10px;
    gap:10px;
  }
  .sp-group-cover{
    height:210px;
  }
  .sp-group-profile,
  .sp-group-owner-notifications,
  .sp-group-main,
  .sp-group-sidebar{
    margin-left:8px;
    margin-right:8px;
  }
  .sp-group-profile-info{
    padding:14px;
  }
  .sp-group-profile-info h1{
    font-size:23px;
  }
  .sp-group-profile-tabs{
    overflow:auto;
    scrollbar-width:none;
    padding-left:8px;
    padding-right:8px;
  }
  .sp-group-profile-tabs::-webkit-scrollbar{display:none}
  .sp-group-request-row{
    grid-template-columns:40px minmax(0,1fr);
  }
  .sp-group-request-actions{
    grid-column:2;
    flex-wrap:wrap;
  }
}



/* ===== V1.9.2 Groups tabs + cloud profile photo ===== */

/* Groups icon consistency */
.sp-groups-nav .sp-icon,
.sp-side-link .sp-icon,
.sp-group-primary .sp-icon,
.sp-group-card-cover .sp-icon,
.sp-group-tab-label + .sp-icon{
  stroke-width:2;
}
.sp-groups-nav{
  position:relative;
}
.sp-groups-nav>.sp-icon{
  width:22px;
  height:22px;
}

/* Redesigned group filter tabs */
.sp-group-toolbar{
  grid-template-columns:minmax(260px,410px) minmax(0,1fr);
  gap:14px;
}
.sp-group-tabs{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  padding:4px;
  min-width:0;
  border-radius:11px;
  background:#f4f6f8;
}
.sp-group-tabs a{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:0 14px;
  border-radius:8px;
  color:#5d6673;
  background:transparent;
  font-size:13px;
  font-weight:780;
  line-height:1;
  white-space:nowrap;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.sp-group-tabs a .sp-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.sp-group-tabs a:hover{
  color:#1f2937;
  background:rgba(255,255,255,.72);
  transform:translateY(-1px);
}
.sp-group-tabs a.active{
  color:var(--sp-blue);
  background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.045);
}
.sp-group-tab-label{
  display:inline-block;
}
.sp-group-tab-badge{
  min-width:19px;
  height:19px;
  padding:0 5px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f02849;
  color:#fff;
  font-size:10px;
  line-height:1;
  font-weight:850;
}

/* Profile photo editor */
.sp-profile-settings-form{
  gap:14px;
}
.sp-profile-photo-editor{
  display:grid;
  grid-template-columns:104px minmax(0,1fr);
  gap:16px;
  align-items:center;
  padding:14px;
  margin-bottom:4px;
  border:1px solid #e4e7ec;
  border-radius:12px;
  background:linear-gradient(135deg,#fbfcfe,#f6f9ff);
}
.sp-profile-photo-preview{
  position:relative;
  width:96px;
  height:96px;
  border-radius:50%;
  overflow:visible;
}
.sp-profile-photo-preview>.sp-avatar,
.sp-profile-photo-preview>img{
  width:96px!important;
  height:96px!important;
  border-radius:50%;
  object-fit:cover;
  display:block;
  background:#eef1f5;
  box-shadow:0 0 0 3px #fff,0 5px 18px rgba(15,23,42,.12);
}
.sp-profile-photo-camera{
  position:absolute;
  right:-2px;
  bottom:2px;
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--sp-blue);
  color:#fff;
  border:3px solid #fff;
  cursor:pointer;
  box-shadow:0 3px 10px rgba(8,102,255,.28);
  transition:transform .18s ease,background .18s ease;
}
.sp-profile-photo-camera:hover{
  transform:scale(1.07);
  background:#075ee5;
}
.sp-profile-photo-camera .sp-icon{
  width:16px;
  height:16px;
}
.sp-profile-photo-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.sp-profile-photo-copy>strong{
  font-size:16px;
}
.sp-profile-photo-copy>small{
  margin-top:2px;
  color:var(--sp-muted);
}
.sp-profile-photo-copy>span{
  margin-top:8px;
  color:#7a828e;
  font-size:11px;
  line-height:1.4;
}
.sp-profile-photo-buttons{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.sp-profile-photo-change{
  display:inline-flex!important;
  width:auto!important;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 13px;
  border-radius:8px;
  background:#e7efff;
  color:var(--sp-blue);
  font-size:12px!important;
  font-weight:800!important;
  cursor:pointer;
}
.sp-profile-photo-remove{
  display:inline-flex!important;
  width:auto!important;
  grid-template-columns:none!important;
  align-items:center;
  gap:6px!important;
  min-height:34px;
  padding:0 10px;
  border-radius:8px;
  background:#f4f4f5;
  color:#6b7280;
  font-size:12px!important;
  cursor:pointer;
}
.sp-profile-photo-remove input{
  width:auto!important;
  margin:0;
  padding:0!important;
  box-shadow:none!important;
}
.sp-profile-photo-input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  overflow:hidden!important;
  pointer-events:none;
}

/* Mobile group tabs */
@media(max-width:850px){
  .sp-group-toolbar{
    display:block;
  }
  .sp-group-tabs{
    width:100%;
    justify-content:stretch;
    overflow:visible;
    margin-top:8px;
  }
  .sp-group-tabs a{
    flex:1 1 0;
    min-width:0;
    padding:0 10px;
  }
}
@media(max-width:560px){
  .sp-group-tabs{
    gap:3px;
    padding:3px;
  }
  .sp-group-tabs a{
    min-height:44px;
    gap:5px;
    padding:0 7px;
    font-size:11px;
  }
  .sp-group-tabs a .sp-icon{
    width:16px;
    height:16px;
  }
  .sp-profile-photo-editor{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }
  .sp-profile-photo-copy{
    align-items:center;
  }
  .sp-profile-photo-buttons{
    justify-content:center;
  }
}



/* ===== V1.9.3 UI refinement: Groups tabs + Stories ===== */

/* Fix legacy CSS that incorrectly turns tab labels into red badges. */
.sp-group-tabs a span.sp-group-tab-label{
  display:inline!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:inherit!important;
  font-size:inherit!important;
  line-height:inherit!important;
  font-weight:inherit!important;
}
.sp-group-tabs a b.sp-group-tab-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-left:2px!important;
  min-width:19px!important;
  height:19px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  background:#e41e3f!important;
  color:#fff!important;
  font-size:10px!important;
  line-height:19px!important;
  font-weight:850!important;
}

.sp-group-toolbar{
  min-height:68px;
  padding:10px;
  border-radius:14px;
  border:1px solid #e4e7ec;
  background:#fff;
  box-shadow:0 2px 10px rgba(15,23,42,.035);
}
.sp-group-search{
  height:44px;
  padding:0 14px;
  border:1px solid transparent;
  background:#f0f2f5;
}
.sp-group-search:focus-within{
  background:#fff;
  border-color:#b8d0ff;
  box-shadow:0 0 0 3px rgba(8,102,255,.08);
}
.sp-group-search input{
  display:block!important;
  min-width:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#111827!important;
  font-size:14px!important;
}
.sp-group-search input::placeholder{
  color:#747b86!important;
  opacity:1!important;
}
.sp-group-tabs{
  min-height:48px;
  padding:4px;
  border:1px solid #eaecf0;
  background:#f7f8fa;
}
.sp-group-tabs a{
  min-width:112px;
  min-height:40px;
  padding:0 13px;
}
.sp-group-tabs a.active{
  background:#fff;
  color:var(--sp-blue);
  box-shadow:0 2px 8px rgba(15,23,42,.08);
}

/* Stories */
.sp-stories{
  position:relative;
  margin-bottom:14px;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.055);
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.05),0 5px 18px rgba(15,23,42,.03);
}
.sp-stories-title{
  min-height:58px;
  padding:11px 14px 9px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid #edf0f2;
}
.sp-stories-heading{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.sp-stories-heading strong{
  color:#111827;
  font-size:17px;
  line-height:1.2;
  font-weight:850;
}
.sp-stories-heading span{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#8a9099;
  font-size:11px;
}
.sp-stories-controls{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}
.sp-stories-scroll-btn{
  width:32px;
  height:32px;
  padding:0;
  border:1px solid #e2e6ea;
  border-radius:50%;
  background:#fff;
  color:#5f6670;
  display:grid;
  place-items:center;
  cursor:pointer;
  box-shadow:0 1px 3px rgba(15,23,42,.05);
  transition:background .16s ease,color .16s ease,transform .16s ease,opacity .16s ease;
}
.sp-stories-scroll-btn:hover:not(:disabled){
  background:#f0f2f5;
  color:#111827;
  transform:scale(1.04);
}
.sp-stories-scroll-btn:disabled{opacity:.28;cursor:default}
.sp-stories-scroll-btn.is-hidden{display:none}
.sp-stories-scroll-btn .sp-icon{width:17px;height:17px}
.sp-stories-scroll-btn.is-prev .sp-icon{transform:rotate(180deg)}

.sp-stories-scroll{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:122px;
  gap:10px;
  overflow-x:auto;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  padding:12px 14px 14px;
  overscroll-behavior-inline:contain;
}
.sp-stories-scroll::-webkit-scrollbar{display:none}

.sp-story-card{
  position:relative;
  width:122px;
  height:202px;
  flex:none;
  scroll-snap-align:start;
  overflow:hidden;
  padding:0;
  border:1px solid #e1e4e8;
  border-radius:12px;
  background:#d8dce2;
  color:#fff;
  text-align:left;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(15,23,42,.07);
  isolation:isolate;
  transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease;
}
.sp-story-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(15,23,42,.13);
}
.sp-story-card.is-opening{transform:scale(.975)}

.sp-story-preview{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background-color:#242526;
  background-size:cover;
  background-position:center;
  transition:transform .34s ease;
}
.sp-story-card:hover .sp-story-preview{transform:scale(1.035)}
.sp-story-preview:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.03) 42%,rgba(0,0,0,.68));
}
.sp-story-video-badge{
  position:relative;
  z-index:3;
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(0,0,0,.48);
  border:1px solid rgba(255,255,255,.38);
  backdrop-filter:blur(4px);
}
.sp-story-video-badge .sp-icon{width:18px;height:18px;margin-left:2px}

.sp-story-user-avatar{
  position:absolute;
  z-index:4;
  left:9px;
  top:9px;
  width:42px;
  height:42px;
  padding:2px;
  border-radius:50%;
  background:#c8ccd1;
  line-height:0;
}
.sp-story-user-avatar .sp-avatar{
  width:38px!important;
  height:38px!important;
  border:2px solid #fff!important;
  object-fit:cover;
}
.sp-story-card.has-unseen .sp-story-user-avatar{background:linear-gradient(135deg,#0866ff,#5f5df0)}
.sp-story-card.is-seen .sp-story-user-avatar{background:#bcc1c7}
.sp-story-name{
  position:absolute;
  z-index:4;
  left:9px;
  right:8px;
  bottom:10px;
  color:#fff;
  font-size:12px;
  line-height:1.18;
  font-weight:800;
  text-shadow:0 1px 4px rgba(0,0,0,.72);
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.sp-story-new-dot{
  position:absolute;
  z-index:5;
  top:8px;
  right:8px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#0866ff;
  box-shadow:0 0 0 2px #fff;
}

/* Create Story card */
.sp-story-create{
  display:block;
  background:#fff;
  color:#111827;
  box-shadow:none;
}
.sp-story-create-photo{
  position:absolute;
  inset:0 0 58px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at 50% 35%,#f8fafc,#e7eaee 72%);
}
.sp-story-create-photo .sp-avatar{
  width:82px!important;
  height:82px!important;
  object-fit:cover;
  box-shadow:0 0 0 4px rgba(255,255,255,.75);
  transition:transform .25s ease;
}
.sp-story-create:hover .sp-story-create-photo .sp-avatar{transform:scale(1.035)}
.sp-story-create-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.08));
  pointer-events:none;
}
.sp-story-plus{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:42px;
  transform:translateX(-50%);
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--sp-blue);
  color:#fff;
  border:4px solid #fff;
  box-shadow:0 3px 10px rgba(8,102,255,.27);
}
.sp-story-plus .sp-icon{width:18px;height:18px}
.sp-story-create-copy{
  position:absolute;
  z-index:4;
  left:5px;
  right:5px;
  bottom:9px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  color:#111827;
  text-align:center;
}
.sp-story-create-copy strong{
  position:static!important;
  color:#111827!important;
  font-size:12px!important;
  line-height:1.15!important;
  text-shadow:none!important;
}
.sp-story-create-copy small{
  color:#8a9099;
  font-size:9px;
}
.sp-story-create>strong{display:none!important}

/* Viewer */
.sp-story-viewer{
  background:rgba(6,7,9,.96);
  backdrop-filter:blur(6px);
}
.sp-story-stage{
  width:min(430px,88vw);
  height:min(760px,90vh);
  border-radius:16px;
  box-shadow:0 28px 90px rgba(0,0,0,.65);
}
.sp-story-head img{
  width:38px;
  height:38px;
  border:2px solid rgba(255,255,255,.75);
}
.sp-story-caption{
  border-radius:12px;
  background:rgba(0,0,0,.45);
}

/* Story upload */
.sp-story-upload-card{width:min(520px,calc(100vw - 24px))}
.sp-story-upload-card .sp-modal-body{padding:16px}
.sp-story-upload-drop{
  min-height:176px;
  border:1.5px dashed #bcc6d2;
  background:linear-gradient(135deg,#fafbfc,#f3f7ff);
  border-radius:14px;
  gap:6px;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.sp-story-upload-drop:hover{
  border-color:#77a4ff;
  background:#f5f8ff;
  box-shadow:0 0 0 4px rgba(8,102,255,.055);
}
.sp-story-upload-drop>b{
  margin-top:5px;
  color:var(--sp-blue);
  font-size:12px;
}
.sp-story-file-preview{
  padding:9px;
  border-radius:11px;
  background:#f5f6f8;
}
.sp-story-upload-card textarea{
  width:100%;
  border:1px solid #e1e4e8;
  outline:0;
}
.sp-story-upload-card textarea:focus,
.sp-story-privacy select:focus{
  border-color:#8fb4ff;
  box-shadow:0 0 0 3px rgba(8,102,255,.075);
}
.sp-story-privacy select{width:100%}

@media(max-width:850px){
  .sp-group-tabs a{min-width:0}
}
@media(max-width:800px){
  .sp-stories{
    border-radius:0;
    border-left:0;
    border-right:0;
    margin-bottom:10px;
  }
  .sp-stories-title{
    min-height:54px;
    padding:10px 12px 8px;
  }
  .sp-stories-heading strong{font-size:16px}
  .sp-stories-heading span{
    display:block!important;
    max-width:245px;
    font-size:10px;
  }
  .sp-stories-scroll{
    grid-auto-columns:112px;
    gap:8px;
    padding:10px 10px 12px;
  }
  .sp-story-card{
    width:112px;
    height:190px;
  }
  .sp-stories-controls{display:none}
}
@media(max-width:560px){
  .sp-group-tabs{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
  }
  .sp-group-tabs a{
    min-height:42px;
    padding:0 5px;
    gap:4px;
    font-size:10.5px;
  }
  .sp-group-tabs a .sp-icon{
    width:15px;
    height:15px;
    flex-basis:15px;
  }
  .sp-group-tab-badge{
    position:absolute;
    top:2px;
    right:2px;
    min-width:16px!important;
    height:16px!important;
    line-height:16px!important;
    padding:0 4px!important;
    font-size:9px!important;
  }
  .sp-stories-heading span{max-width:190px}
  .sp-stories-scroll{grid-auto-columns:104px}
  .sp-story-card{
    width:104px;
    height:178px;
    border-radius:11px;
  }
  .sp-story-user-avatar{width:38px;height:38px}
  .sp-story-user-avatar .sp-avatar{width:34px!important;height:34px!important}
  .sp-story-name{font-size:11px}
  .sp-story-create-photo{inset:0 0 54px}
  .sp-story-create-photo .sp-avatar{width:70px!important;height:70px!important}
  .sp-story-plus{bottom:38px;width:34px;height:34px}
  .sp-story-create-copy{bottom:8px}
  .sp-story-create-copy small{display:none}
}



/* ===== V1.9.4 Site-wide skeleton/loading system ===== */
:root{
  --sp-skel-base:#edf0f3;
  --sp-skel-hi:#f8f9fb;
  --sp-skel-edge:#e5e8ec;
  --sp-skel-speed:3.8s;
}
@keyframes spUniversalShimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}
@keyframes spSkeletonFade{
  from{opacity:1}
  to{opacity:0}
}
@keyframes spUiReadyIn{
  from{opacity:.72;transform:translateY(2px)}
  to{opacity:1;transform:none}
}

/* Reusable shimmer paint */
.sp-ui-booting .sp-topbar-inner>*,
.sp-ui-booting .sp-side-user,
.sp-ui-booting .sp-side-link,
.sp-ui-booting .sp-stories,
.sp-ui-booting .sp-composer,
.sp-ui-booting .sp-post-card,
.sp-ui-booting .sp-widget,
.sp-ui-booting .sp-view-head,
.sp-ui-booting .sp-person-card,
.sp-ui-booting .sp-settings-card,
.sp-ui-booting .sp-settings-nav,
.sp-ui-booting .sp-friend-result,
.sp-ui-booting .sp-friends-tabs,
.sp-ui-booting .sp-group-toolbar,
.sp-ui-booting .sp-groups-hero,
.sp-ui-booting .sp-group-card,
.sp-ui-booting .sp-group-create-form,
.sp-ui-booting .sp-group-create-preview-wrap,
.sp-ui-booting .sp-group-profile,
.sp-ui-booting .sp-group-owner-notifications,
.sp-ui-booting .sp-group-composer,
.sp-ui-booting .sp-group-about-card,
.sp-ui-booting .sp-group-members-card,
.sp-ui-booting .sp-group-settings-card,
.sp-ui-booting .sp-comments-dialog,
.sp-route-loading .sp-feed>.sp-post-card,
.sp-route-loading .sp-feed>.sp-composer,
.sp-route-loading .sp-feed>.sp-stories{
  position:relative!important;
  overflow:hidden!important;
}

.sp-ui-booting .sp-topbar-inner>*::after,
.sp-ui-booting .sp-side-user::after,
.sp-ui-booting .sp-side-link::after,
.sp-ui-booting .sp-stories::after,
.sp-ui-booting .sp-composer::after,
.sp-ui-booting .sp-post-card::after,
.sp-ui-booting .sp-widget::after,
.sp-ui-booting .sp-view-head::after,
.sp-ui-booting .sp-person-card::after,
.sp-ui-booting .sp-settings-card::after,
.sp-ui-booting .sp-settings-nav::after,
.sp-ui-booting .sp-friend-result::after,
.sp-ui-booting .sp-friends-tabs::after,
.sp-ui-booting .sp-group-toolbar::after,
.sp-ui-booting .sp-groups-hero::after,
.sp-ui-booting .sp-group-card::after,
.sp-ui-booting .sp-group-create-form::after,
.sp-ui-booting .sp-group-create-preview-wrap::after,
.sp-ui-booting .sp-group-profile::after,
.sp-ui-booting .sp-group-owner-notifications::after,
.sp-ui-booting .sp-group-composer::after,
.sp-ui-booting .sp-group-about-card::after,
.sp-ui-booting .sp-group-members-card::after,
.sp-ui-booting .sp-group-settings-card::after,
.sp-ui-booting .sp-comments-dialog::after,
.sp-route-loading .sp-feed>.sp-post-card::after,
.sp-route-loading .sp-feed>.sp-composer::after,
.sp-route-loading .sp-feed>.sp-stories::after{
  content:"";
  position:absolute;
  z-index:999;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(
      105deg,
      var(--sp-skel-base) 8%,
      var(--sp-skel-hi) 18%,
      var(--sp-skel-base) 31%,
      var(--sp-skel-edge) 44%,
      var(--sp-skel-hi) 58%,
      var(--sp-skel-base) 72%
    );
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}

/* Make top-level skeletons look less like one blank rectangle by adding
   faint internal loading bars. */
.sp-ui-booting .sp-post-card::before,
.sp-ui-booting .sp-composer::before,
.sp-ui-booting .sp-stories::before,
.sp-ui-booting .sp-group-card::before,
.sp-ui-booting .sp-settings-card::before,
.sp-ui-booting .sp-friend-result::before{
  content:"";
  position:absolute;
  z-index:1000;
  left:18px;
  right:22%;
  top:18px;
  height:12px;
  border-radius:999px;
  pointer-events:none;
  background:rgba(255,255,255,.62);
  box-shadow:
    0 23px 0 rgba(255,255,255,.48),
    0 46px 0 rgba(255,255,255,.34);
}

/* Actual assets: avatar/image placeholders remain until each file loads. */
img.sp-ui-asset-loading{
  color:transparent!important;
  background:
    linear-gradient(
      105deg,
      var(--sp-skel-base) 8%,
      var(--sp-skel-hi) 18%,
      var(--sp-skel-base) 32%,
      var(--sp-skel-hi) 48%,
      var(--sp-skel-base) 64%
    )!important;
  background-size:240% 100%!important;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite!important;
  opacity:.72;
}
img.sp-ui-asset-loaded{
  animation:spAssetReveal .7s ease both;
}
@keyframes spAssetReveal{
  from{opacity:.35;filter:blur(2px)}
  to{opacity:1;filter:none}
}
img.sp-ui-asset-error{
  background:#eef0f3;
}

/* CSS background-image assets, including Story cards and Group covers. */
.sp-ui-bg-loading{
  position:relative!important;
  overflow:hidden!important;
}
.sp-ui-bg-loading::before{
  content:""!important;
  position:absolute!important;
  z-index:8!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      105deg,
      var(--sp-skel-base) 8%,
      var(--sp-skel-hi) 18%,
      var(--sp-skel-base) 34%,
      var(--sp-skel-hi) 52%,
      var(--sp-skel-base) 68%
    )!important;
  background-size:240% 100%!important;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite!important;
}
.sp-ui-bg-loaded::before{
  opacity:0!important;
  visibility:hidden!important;
  transition:opacity .2s ease,visibility .2s ease;
}

/* Frames/embeds */
iframe.sp-ui-frame-loading{
  min-height:180px;
  opacity:.08;
  background:
    linear-gradient(105deg,var(--sp-skel-base),var(--sp-skel-hi),var(--sp-skel-base));
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}

/* Keep existing media skeleton, but use the faster universal shimmer. */
.sp-media-item .sp-media-skeleton{
  background:
    linear-gradient(
      105deg,
      var(--sp-skel-base) 8%,
      var(--sp-skel-hi) 18%,
      var(--sp-skel-base) 33%,
      var(--sp-skel-edge) 47%,
      var(--sp-skel-hi) 60%,
      var(--sp-skel-base) 74%
    );
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}

/* Structured comment popup skeleton */
.sp-comments-skeleton{
  width:100%;
  height:100%;
  min-height:420px;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(330px,.78fr);
  overflow:hidden;
  background:#fff;
}
.sp-comments-skel-media{
  min-height:420px;
  background:
    linear-gradient(105deg,#e8ebef 8%,#f8f9fb 20%,#e7eaee 37%,#f5f6f8 54%,#e8ebef 72%);
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}
.sp-comments-skel-side{
  padding:18px 16px;
  border-left:1px solid #eceff2;
}
.sp-comments-skel-user,
.sp-comments-skel-comment{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:10px;
  align-items:center;
  margin-bottom:16px;
}
.sp-comments-skel-user i,
.sp-comments-skel-comment i{
  width:42px;
  height:42px;
  border-radius:50%;
  background:var(--sp-skel-base);
}
.sp-comments-skel-user span,
.sp-comments-skel-comment span,
.sp-comments-skel-line,
.sp-comments-skel-actions,
.sp-comments-skel-input{
  display:block;
  border-radius:999px;
  background:
    linear-gradient(105deg,var(--sp-skel-base),var(--sp-skel-hi),var(--sp-skel-base));
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}
.sp-comments-skel-user span{height:16px;width:58%}
.sp-comments-skel-line{height:12px;margin:10px 0}
.sp-comments-skel-line.wide{width:88%}
.sp-comments-skel-line.mid{width:61%}
.sp-comments-skel-actions{height:40px;width:100%;border-radius:8px;margin:18px 0}
.sp-comments-skel-comment span{height:54px;border-radius:16px}
.sp-comments-skel-input{height:70px;border-radius:16px;margin-top:24px}

/* Ready transition */
.sp-ui-ready .sp-shell,
.sp-ui-ready .sp-topbar,
.sp-ui-ready .sp-mobile-nav{
  animation:spUiReadyIn .85s ease both;
}

/* Progress indicator remains visible during boot/route changes. */
.sp-ui-booting .sp-page-loader span,
.sp-route-loading .sp-page-loader span{
  opacity:1;
  animation:spPageLoad 1.8s ease-in-out infinite;
}

/* Don't animate hidden/offscreen skeletons forever for users who prefer less motion. */
@media(prefers-reduced-motion:reduce){
  .sp-ui-booting *::after,
  .sp-ui-booting *::before,
  .sp-route-loading *::after,
  .sp-ui-asset-loading,
  .sp-ui-bg-loading::before,
  .sp-media-skeleton,
  .sp-comments-skel-media,
  .sp-comments-skel-user span,
  .sp-comments-skel-comment span,
  .sp-comments-skel-line,
  .sp-comments-skel-actions,
  .sp-comments-skel-input{
    animation-duration:3.2s!important;
  }
}

@media(max-width:800px){
  .sp-comments-skeleton{
    grid-template-columns:1fr;
  }
  .sp-comments-skel-media{
    min-height:280px;
    max-height:40vh;
  }
  .sp-comments-skel-side{
    border-left:0;
    border-top:1px solid #eceff2;
  }

  /* Avoid covering the entire mobile viewport with too many simultaneous
     independent skeleton layers. */
  .sp-ui-booting .sp-side-user::after,
  .sp-ui-booting .sp-side-link::after,
  .sp-ui-booting .sp-widget::after{
    display:none;
  }
}



/* ===== V1.9.5 Slower loading presentation ===== */
.sp-ui-booting .sp-topbar-inner>*::after,
.sp-ui-booting .sp-side-user::after,
.sp-ui-booting .sp-side-link::after,
.sp-ui-booting .sp-stories::after,
.sp-ui-booting .sp-composer::after,
.sp-ui-booting .sp-post-card::after,
.sp-ui-booting .sp-widget::after,
.sp-ui-booting .sp-view-head::after,
.sp-ui-booting .sp-person-card::after,
.sp-ui-booting .sp-settings-card::after,
.sp-ui-booting .sp-settings-nav::after,
.sp-ui-booting .sp-friend-result::after,
.sp-ui-booting .sp-friends-tabs::after,
.sp-ui-booting .sp-group-toolbar::after,
.sp-ui-booting .sp-groups-hero::after,
.sp-ui-booting .sp-group-card::after,
.sp-ui-booting .sp-group-create-form::after,
.sp-ui-booting .sp-group-create-preview-wrap::after,
.sp-ui-booting .sp-group-profile::after,
.sp-ui-booting .sp-group-owner-notifications::after,
.sp-ui-booting .sp-group-composer::after,
.sp-ui-booting .sp-group-about-card::after,
.sp-ui-booting .sp-group-members-card::after,
.sp-ui-booting .sp-group-settings-card::after,
.sp-route-loading .sp-feed>.sp-post-card::after,
.sp-route-loading .sp-feed>.sp-composer::after,
.sp-route-loading .sp-feed>.sp-stories::after{
  animation-duration:3.8s!important;
}

.sp-ui-ready .sp-shell,
.sp-ui-ready .sp-topbar,
.sp-ui-ready .sp-mobile-nav{
  animation-duration:.85s!important;
}

.sp-media-item .sp-media-el{
  transition:
    opacity .9s ease,
    transform 1.05s cubic-bezier(.2,.75,.2,1),
    filter .9s ease!important;
}

.sp-media-item.sp-loaded .sp-media-skeleton{
  animation:spSkeletonOut .72s ease both!important;
}

.sp-stories-scroll-btn,
.sp-story-card,
.sp-group-card,
.sp-post-card{
  transition-duration:.32s!important;
}

.sp-comments-modal.is-open .sp-comments-dialog{
  animation-duration:.48s!important;
}



/* ==========================================================
   twittsocial.com 2.0 — final premium UI + profile experience
   ========================================================== */
:root{
  --sp-blue:#0866ff;
  --sp-blue-deep:#0758db;
  --sp-bg:#f1f4f8;
  --sp-card:#ffffff;
  --sp-text:#111827;
  --sp-muted:#667085;
  --sp-line:#e6e9ee;
  --sp-hover:#f3f5f8;
  --sp-radius:14px;
  --sp-shadow:0 1px 2px rgba(15,23,42,.05),0 8px 28px rgba(15,23,42,.045);
  --sp-shadow-hover:0 3px 8px rgba(15,23,42,.07),0 14px 34px rgba(15,23,42,.07);
}
html,body{background:var(--sp-bg)}
body{font-feature-settings:"kern" 1,"liga" 1;text-rendering:optimizeLegibility}

/* Top bar */
.sp-topbar{
  height:60px;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid rgba(15,23,42,.06);
  box-shadow:0 1px 10px rgba(15,23,42,.055);
  backdrop-filter:saturate(1.35) blur(12px);
}
.sp-topbar-inner{height:60px}
.sp-brand-mark{
  border-radius:13px;
  background:linear-gradient(145deg,#f3f7ff,#fff);
  box-shadow:inset 0 0 0 1px #e7efff;
}
.sp-search{
  height:42px;
  border:1px solid #e8ebef;
  background:#f4f6f8;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.sp-search:focus-within{background:#fff;border-color:#bad1ff;box-shadow:0 0 0 4px rgba(8,102,255,.07)}
.sp-nav-icons>a{
  background:#f2f4f7;
  border:1px solid transparent;
  transition:background .18s ease,color .18s ease,transform .18s ease,border-color .18s ease;
}
.sp-nav-icons>a:hover{background:#e9edf2;border-color:#e1e5ea;transform:translateY(-1px)}
.sp-nav-icons>a.active{background:#eef4ff;color:var(--sp-blue)}

/* Global cards */
.sp-composer,.sp-post-card,.sp-comments-card,.sp-empty,.sp-widget,
.sp-settings-card,.sp-settings-nav,.sp-friends-tabs,.sp-friend-result,
.sp-group-card,.sp-group-toolbar,.sp-profile-card,.sp-profile-wide-card{
  border-color:rgba(15,23,42,.06)!important;
}
.sp-composer,.sp-post-card,.sp-comments-card,.sp-empty{
  box-shadow:var(--sp-shadow);
}
.sp-post-card{
  border-radius:14px;
}
.sp-post-card:hover{
  transform:translateY(-1px);
  box-shadow:var(--sp-shadow-hover);
}
.sp-post-head{padding-top:14px}
.sp-post-text{font-size:15.5px;line-height:1.5}
.sp-social-stats{padding-top:10px;padding-bottom:10px}
.sp-actions{padding:5px 10px 7px}
.sp-actions button,.sp-actions a{min-height:39px;border-radius:9px}
.sp-actions button:hover,.sp-actions a:hover{background:#f0f3f6}
.sp-composer-trigger{height:44px}
.sp-composer-actions button{min-height:40px}

/* Sidebars */
.sp-side-user,.sp-side-link,.sp-contact{
  min-height:45px;
  border-radius:10px;
}
.sp-side-user:hover,.sp-side-link:hover,.sp-contact:hover{background:#e8edf3}
.sp-widget-title{font-weight:750}

/* Forms and app pages */
.sp-app-page-head,.sp-settings-card,.sp-friends-tabs,.sp-friend-result{
  box-shadow:var(--sp-shadow);
}
.sp-settings-form input,.sp-settings-form textarea,.sp-settings-form select,
.sp-friends-search input,.sp-group-field input,.sp-group-field select,.sp-group-field textarea{
  border-radius:10px!important;
  border-color:#dce1e7!important;
  min-height:44px;
}
.sp-app-primary,.sp-app-secondary,.sp-submit{
  border-radius:9px!important;
  min-height:42px;
  transition:transform .16s ease,box-shadow .18s ease,background .18s ease;
}
.sp-app-primary:hover,.sp-submit:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 7px 18px rgba(8,102,255,.2);
}
.sp-ui-pressed{transform:scale(.975)!important}

/* Cover editor in Settings */
.sp-profile-cover-editor{
  padding:12px;
  border:1px solid #e3e7ec;
  border-radius:14px;
  background:#fafbfc;
}
.sp-profile-cover-preview{
  position:relative;
  height:220px;
  overflow:hidden;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 15% 15%,rgba(8,102,255,.18),transparent 31%),
    radial-gradient(circle at 86% 25%,rgba(121,80,242,.15),transparent 32%),
    linear-gradient(135deg,#eaf1ff,#f2f4f8);
  background-size:cover;
  background-position:center;
}
.sp-profile-cover-placeholder{color:#8da0bd}
.sp-profile-cover-placeholder .sp-icon{width:46px;height:46px}
.sp-profile-cover-preview[style*="background-image"] .sp-profile-cover-placeholder,
.sp-profile-cover-preview.has-cover .sp-profile-cover-placeholder{opacity:0}
.sp-profile-cover-change{
  position:absolute;
  right:12px;
  bottom:12px;
  min-height:38px;
  padding:0 13px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  border-radius:9px;
  background:rgba(255,255,255,.94);
  color:#111827;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 3px 14px rgba(15,23,42,.16);
}
.sp-profile-cover-change .sp-icon{width:17px;height:17px}
.sp-profile-cover-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 3px 0;
}
.sp-profile-cover-actions>div{display:flex;flex-direction:column}
.sp-profile-cover-actions small{color:var(--sp-muted);margin-top:2px}
.sp-profile-cover-remove{font-size:12px;color:#b42318;display:flex;gap:6px;align-items:center}

/* Full-width author/profile route */
body.sp-profile-route .sp-shell{
  display:block;
  max-width:none;
  padding:0 0 90px;
}
body.sp-profile-route .sp-mobile-nav{z-index:1200}
.sp-profile-page{
  width:100%;
  min-height:calc(100vh - 60px);
}
.sp-profile-hero{
  width:100%;
  background:#fff;
  border-bottom:1px solid #e4e7ec;
  box-shadow:0 2px 12px rgba(15,23,42,.035);
}
.sp-profile-cover{
  position:relative;
  width:min(1240px,calc(100% - 32px));
  height:455px;
  margin:0 auto;
  overflow:hidden;
  border-radius:0 0 15px 15px;
  background:#dce3ed;
  background-size:cover;
  background-position:center;
}
.sp-profile-cover:after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:80px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.08));
  pointer-events:none;
}
.sp-profile-cover-fallback{
  position:absolute;
  inset:0;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 18% 25%,rgba(8,102,255,.22),transparent 25%),
    radial-gradient(circle at 82% 28%,rgba(118,76,242,.17),transparent 27%),
    linear-gradient(135deg,#dcecff,#eef3ff 52%,#e7e8f4);
}
.sp-profile-cover-fallback>span{position:absolute;border-radius:50%;background:rgba(255,255,255,.3)}
.sp-profile-cover-fallback>span:nth-child(1){width:340px;height:340px;left:8%;bottom:-180px}
.sp-profile-cover-fallback>span:nth-child(2){width:260px;height:260px;right:13%;top:-120px}
.sp-profile-cover-fallback>span:nth-child(3){width:180px;height:180px;right:34%;bottom:-90px}
.sp-profile-cover-fallback>.sp-icon{width:68px;height:68px;color:rgba(93,112,143,.45)}
.sp-profile-cover-edit{
  position:absolute;
  z-index:3;
  right:16px;
  bottom:16px;
  height:40px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:9px;
  background:rgba(255,255,255,.96);
  color:#1d2939;
  font-size:13px;
  font-weight:800;
  box-shadow:0 4px 18px rgba(15,23,42,.17);
}
.sp-profile-cover-edit .sp-icon{width:17px;height:17px}

.sp-profile-identity{
  width:min(1160px,calc(100% - 40px));
  min-height:182px;
  margin:0 auto;
  display:grid;
  grid-template-columns:180px minmax(0,1fr) auto;
  gap:20px;
  align-items:end;
  padding:0 10px 22px;
}
.sp-profile-avatar-wrap{
  position:relative;
  width:172px;
  height:172px;
  margin-top:-62px;
  align-self:start;
  z-index:5;
}
.sp-profile-avatar-wrap>.sp-avatar{
  width:172px!important;
  height:172px!important;
  border:5px solid #fff!important;
  box-shadow:0 0 0 2px #0866ff,0 8px 25px rgba(15,23,42,.16);
  object-fit:cover;
}
.sp-profile-online{
  position:absolute;
  right:9px;
  bottom:18px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#31a24c;
  border:4px solid #fff;
  box-shadow:0 1px 4px rgba(0,0,0,.16);
}
.sp-profile-avatar-edit{
  position:absolute;
  right:2px;
  bottom:2px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e9edf2;
  color:#1f2937;
  border:3px solid #fff;
}
.sp-profile-avatar-edit .sp-icon{width:18px;height:18px}
.sp-profile-name-block{min-width:0;padding-bottom:2px}
.sp-profile-name-block h1{
  margin:0;
  color:#101828;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.035em;
  overflow-wrap:anywhere;
}
.sp-profile-stats{
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:7px;
  color:#667085;
  font-size:14px;
}
.sp-profile-stats a:hover{text-decoration:underline}
.sp-profile-name-block>p{
  margin:8px 0 0;
  max-width:620px;
  color:#667085;
  font-size:14px;
  line-height:1.45;
}
.sp-profile-friend-stack{
  display:flex;
  align-items:center;
  margin-top:10px;
  padding-left:5px;
}
.sp-profile-friend-stack a{margin-left:-5px;line-height:0}
.sp-profile-friend-stack .sp-avatar{
  width:32px!important;
  height:32px!important;
  border:2px solid #fff;
}
.sp-profile-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  padding-bottom:5px;
}
.sp-profile-actions .sp-friend-controls{display:flex;gap:8px}
.sp-profile-actions .sp-friend-btn,
.sp-profile-primary,.sp-profile-secondary{
  min-height:40px;
  padding:0 14px;
  border:0;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  cursor:pointer;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  transition:background .16s ease,transform .16s ease,box-shadow .16s ease;
}
.sp-profile-primary,.sp-profile-actions .is-add,.sp-profile-actions .is-accept{
  background:var(--sp-blue)!important;
  color:#fff!important;
}
.sp-profile-primary:hover,.sp-profile-actions .is-add:hover,.sp-profile-actions .is-accept:hover{
  background:var(--sp-blue-deep)!important;
  box-shadow:0 7px 18px rgba(8,102,255,.18);
}
.sp-profile-secondary,.sp-profile-actions .is-friends,.sp-profile-actions .is-sent,.sp-profile-actions .is-reject{
  background:#e9edf2!important;
  color:#1f2937!important;
}
.sp-profile-primary .sp-icon,.sp-profile-secondary .sp-icon,.sp-profile-actions .sp-icon{width:18px;height:18px}

.sp-profile-tabs{
  width:min(1160px,calc(100% - 40px));
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:4px;
  min-height:58px;
  border-top:1px solid #e6e9ee;
}
.sp-profile-tabs a{
  position:relative;
  min-height:57px;
  padding:0 17px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#667085;
  border-radius:8px;
  font-size:14px;
  font-weight:750;
}
.sp-profile-tabs a:hover{background:#f2f4f7;color:#344054}
.sp-profile-tabs a.active{color:var(--sp-blue)}
.sp-profile-tabs a.active:after{
  content:"";
  position:absolute;
  left:10px;right:10px;bottom:-1px;
  height:3px;
  border-radius:3px 3px 0 0;
  background:var(--sp-blue);
}

/* Profile content */
.sp-profile-main-grid,
.sp-profile-wide-card,
.sp-profile-suggestions{
  width:min(1120px,calc(100% - 40px));
  margin-left:auto;
  margin-right:auto;
}
.sp-profile-suggestions{
  margin-top:18px;
  padding:15px;
  border:1px solid #e5e8ed;
  border-radius:14px;
  background:#fff;
  box-shadow:var(--sp-shadow);
}
.sp-profile-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:13px;
}
.sp-profile-section-head>div{display:flex;flex-direction:column;gap:2px}
.sp-profile-section-head strong{font-size:19px;color:#101828}
.sp-profile-section-head span{font-size:12px;color:#98a2b3}
.sp-profile-section-head>a{color:var(--sp-blue);font-size:13px;font-weight:750}
.sp-profile-suggestion-row{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:174px;
  gap:10px;
  overflow-x:auto;
  scrollbar-width:none;
}
.sp-profile-suggestion-row::-webkit-scrollbar{display:none}
.sp-profile-suggestion-card{
  overflow:hidden;
  border:1px solid #e4e7ec;
  border-radius:12px;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.04);
}
.sp-profile-suggestion-photo{
  height:152px;
  display:block;
  background:#eef1f5;
  overflow:hidden;
}
.sp-profile-suggestion-photo .sp-avatar{
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
  object-fit:cover;
}
.sp-profile-suggestion-name{display:block;padding:10px 10px 0;font-size:13px;font-weight:800}
.sp-profile-suggestion-card>small{display:block;padding:2px 10px 8px;color:#98a2b3;font-size:10px}
.sp-profile-suggestion-card .sp-friend-controls{padding:0 9px 10px}
.sp-profile-suggestion-card .sp-friend-btn{width:100%;min-height:34px;border-radius:8px}

.sp-profile-main-grid{
  display:grid;
  grid-template-columns:minmax(300px,400px) minmax(0,680px);
  gap:18px;
  align-items:start;
  margin-top:18px;
}
.sp-profile-left-column{
  position:sticky;
  top:78px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.sp-profile-feed-column{min-width:0}
.sp-profile-card,.sp-profile-wide-card{
  border:1px solid #e5e8ed;
  border-radius:14px;
  background:#fff;
  box-shadow:var(--sp-shadow);
}
.sp-profile-card{padding:16px}
.sp-profile-card h2{margin:0;font-size:19px}
.sp-profile-bio{margin:10px 0 14px;text-align:center;color:#344054;line-height:1.45}
.sp-profile-detail{
  display:flex;
  align-items:center;
  gap:10px;
  margin:11px 0;
  color:#667085;
  font-size:13px;
}
.sp-profile-detail .sp-icon{width:20px;height:20px;color:#7b8492}
.sp-profile-full-button{
  min-height:37px;
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:#edf0f4;
  font-size:13px;
  font-weight:800;
}
.sp-profile-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:11px;
}
.sp-profile-card-head>div{display:flex;flex-direction:column}
.sp-profile-card-head h2{font-size:19px}
.sp-profile-card-head span{margin-top:2px;color:#98a2b3;font-size:11px}
.sp-profile-card-head>a{color:var(--sp-blue);font-size:12px;font-weight:750}
.sp-profile-friends-preview{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.sp-profile-friends-preview a{min-width:0}
.sp-profile-friends-preview a>span{
  aspect-ratio:1;
  display:block;
  overflow:hidden;
  border-radius:9px;
  background:#eef1f5;
}
.sp-profile-friends-preview .sp-avatar{
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
  object-fit:cover;
}
.sp-profile-friends-preview strong{
  display:block;
  margin-top:5px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#344054;
  font-size:11px;
}
.sp-profile-photo-preview-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:3px;
  overflow:hidden;
  border-radius:10px;
}
.sp-profile-photo-preview-grid a{
  aspect-ratio:1;
  background:#edf0f4 center/cover no-repeat;
}
.sp-profile-mini-empty{padding:18px 0;color:#98a2b3;text-align:center;font-size:12px}

/* All alternate tabs */
.sp-profile-wide-card{
  margin-top:18px;
  padding:18px;
}
.sp-profile-about-page{
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  padding:0;
  overflow:hidden;
}
.sp-profile-about-page>aside{
  padding:20px;
  border-right:1px solid #e5e8ed;
}
.sp-profile-about-page>aside h2{margin:0 0 14px;font-size:21px}
.sp-profile-about-page>aside span{
  display:block;
  padding:10px 12px;
  border-radius:8px;
  color:#667085;
  font-size:13px;
  font-weight:750;
}
.sp-profile-about-page>aside span.active{background:#edf4ff;color:var(--sp-blue)}
.sp-profile-about-content{padding:22px 24px}
.sp-profile-about-content h3{margin:0 0 18px;font-size:18px}
.sp-profile-about-row{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:10px;
  margin:18px 0;
}
.sp-profile-about-row>.sp-icon{width:22px;height:22px;color:#667085}
.sp-profile-about-row>div{display:flex;flex-direction:column;gap:3px}
.sp-profile-about-row strong{font-size:13px}
.sp-profile-about-row span{color:#667085;font-size:13px;line-height:1.45}

.sp-profile-friends-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.sp-profile-friend-card{
  display:grid;
  grid-template-columns:94px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-width:0;
  padding:10px;
  border:1px solid #e7eaee;
  border-radius:11px;
}
.sp-profile-friend-card>a>.sp-avatar{
  width:94px!important;height:94px!important;border-radius:9px!important;object-fit:cover;
}
.sp-profile-friend-card>div:nth-child(2){min-width:0;display:flex;flex-direction:column}
.sp-profile-friend-card>div:nth-child(2) strong{font-size:14px}
.sp-profile-friend-card>div:nth-child(2) small{margin-top:3px;color:#98a2b3;font-size:11px}
.sp-profile-friend-card .sp-friend-controls{display:flex}
.sp-profile-friend-card .sp-friend-btn{min-height:34px;border-radius:8px}

.sp-profile-photos-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:5px;
}
.sp-profile-photos-grid a{
  position:relative;
  aspect-ratio:1;
  overflow:hidden;
  border-radius:8px;
  background:#edf0f4 center/cover no-repeat;
  transition:transform .2s ease,filter .2s ease;
}
.sp-profile-photos-grid a:hover{transform:scale(1.015);filter:brightness(.96)}
.sp-profile-photos-grid a>span{
  position:absolute;right:7px;bottom:7px;
  width:25px;height:25px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;background:rgba(0,0,0,.42);opacity:0;transition:opacity .15s ease;
}
.sp-profile-photos-grid a:hover>span{opacity:1}
.sp-profile-photos-grid .sp-icon{width:14px;height:14px}

.sp-profile-videos-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.sp-profile-video-card{
  overflow:hidden;
  border:1px solid #e5e8ed;
  border-radius:11px;
  background:#fff;
}
.sp-profile-video-card .sp-media-item{min-height:270px}
.sp-profile-video-card>a{
  min-height:40px;
  display:flex;align-items:center;justify-content:center;
  color:var(--sp-blue);font-size:12px;font-weight:800;
}
.sp-profile-tab-empty{
  min-height:290px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:#98a2b3;
}
.sp-profile-tab-empty>.sp-icon{
  width:54px;height:54px;padding:13px;border-radius:50%;background:#f1f4f8;color:#8090a3;
}
.sp-profile-tab-empty h2{margin:0;color:#344054;font-size:18px}

/* Profile loading skeleton integration */
.sp-ui-booting .sp-profile-hero,
.sp-ui-booting .sp-profile-suggestions,
.sp-ui-booting .sp-profile-card,
.sp-ui-booting .sp-profile-wide-card,
.sp-ui-booting .sp-profile-post-card{
  position:relative!important;
  overflow:hidden!important;
}
.sp-ui-booting .sp-profile-hero::after,
.sp-ui-booting .sp-profile-suggestions::after,
.sp-ui-booting .sp-profile-card::after,
.sp-ui-booting .sp-profile-wide-card::after,
.sp-ui-booting .sp-profile-post-card::after{
  content:"";
  position:absolute;z-index:999;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,var(--sp-skel-base) 8%,var(--sp-skel-hi) 18%,var(--sp-skel-base) 33%,var(--sp-skel-edge) 47%,var(--sp-skel-hi) 60%,var(--sp-skel-base) 74%);
  background-size:240% 100%;
  animation:spUniversalShimmer var(--sp-skel-speed) linear infinite;
}

/* Final modal polish */
.sp-modal-card,.sp-comments-dialog{
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 26px 80px rgba(15,23,42,.25);
}
.sp-modal-head{background:linear-gradient(180deg,#fff,#fbfcfd)}
.sp-post-menu{border-radius:11px!important}

/* Tablet */
@media(max-width:1050px){
  .sp-profile-cover{height:390px}
  .sp-profile-main-grid{grid-template-columns:330px minmax(0,1fr)}
  .sp-profile-identity{grid-template-columns:165px minmax(0,1fr);align-items:end}
  .sp-profile-avatar-wrap{width:158px;height:158px}
  .sp-profile-avatar-wrap>.sp-avatar{width:158px!important;height:158px!important}
  .sp-profile-actions{grid-column:2;justify-content:flex-start;padding-top:10px}
  .sp-profile-photos-grid{grid-template-columns:repeat(4,1fr)}
}

/* Mobile */
@media(max-width:800px){
  .sp-topbar{height:56px}
  .sp-profile-cover{
    width:100%;
    height:260px;
    border-radius:0;
  }
  .sp-profile-cover-edit span{display:none}
  .sp-profile-cover-edit{width:38px;padding:0;justify-content:center}
  .sp-profile-identity{
    width:100%;
    grid-template-columns:1fr;
    justify-items:center;
    gap:8px;
    padding:0 14px 16px;
    text-align:center;
  }
  .sp-profile-avatar-wrap{
    width:136px;height:136px;margin-top:-55px;
  }
  .sp-profile-avatar-wrap>.sp-avatar{width:136px!important;height:136px!important}
  .sp-profile-online{right:6px;bottom:15px;width:21px;height:21px}
  .sp-profile-name-block{display:flex;flex-direction:column;align-items:center}
  .sp-profile-name-block h1{font-size:27px}
  .sp-profile-name-block>p{max-width:520px}
  .sp-profile-actions{
    grid-column:auto;
    justify-content:center;
    flex-wrap:wrap;
    width:100%;
  }
  .sp-profile-actions .sp-friend-controls{justify-content:center}
  .sp-profile-tabs{
    width:100%;
    min-height:52px;
    padding:0 8px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .sp-profile-tabs::-webkit-scrollbar{display:none}
  .sp-profile-tabs a{min-height:51px;padding:0 14px;white-space:nowrap}
  .sp-profile-main-grid,.sp-profile-wide-card,.sp-profile-suggestions{
    width:100%;
  }
  .sp-profile-suggestions{border-radius:0;border-left:0;border-right:0;margin-top:10px}
  .sp-profile-main-grid{display:flex;flex-direction:column;gap:10px;margin-top:10px}
  .sp-profile-left-column{position:static;width:100%;gap:10px}
  .sp-profile-card,.sp-profile-wide-card{border-radius:0;border-left:0;border-right:0}
  .sp-profile-feed-column{width:100%}
  .sp-profile-feed-column .sp-post-card,.sp-profile-feed-column .sp-composer{border-radius:0}
  .sp-profile-about-page{grid-template-columns:1fr}
  .sp-profile-about-page>aside{border-right:0;border-bottom:1px solid #e5e8ed}
  .sp-profile-about-page>aside span{display:inline-flex}
  .sp-profile-friends-grid{grid-template-columns:1fr;padding:0}
  .sp-profile-photos-grid{grid-template-columns:repeat(3,1fr)}
  .sp-profile-videos-grid{grid-template-columns:1fr}
  .sp-profile-photo-editor{grid-template-columns:90px minmax(0,1fr)}
  .sp-profile-cover-preview{height:180px}
}
@media(max-width:520px){
  .sp-profile-cover{height:210px}
  .sp-profile-avatar-wrap{width:116px;height:116px;margin-top:-45px}
  .sp-profile-avatar-wrap>.sp-avatar{width:116px!important;height:116px!important;border-width:4px!important}
  .sp-profile-name-block h1{font-size:24px}
  .sp-profile-actions>.sp-profile-primary,
  .sp-profile-actions>.sp-profile-secondary,
  .sp-profile-actions>.sp-friend-controls{
    flex:1 1 auto;
  }
  .sp-profile-actions .sp-friend-btn{min-width:0}
  .sp-profile-suggestion-row{grid-auto-columns:154px}
  .sp-profile-friend-card{grid-template-columns:72px minmax(0,1fr)}
  .sp-profile-friend-card>a>.sp-avatar{width:72px!important;height:72px!important}
  .sp-profile-friend-card>.sp-friend-controls{grid-column:2}
  .sp-profile-photos-grid{grid-template-columns:repeat(2,1fr)}
  .sp-profile-photo-editor{grid-template-columns:1fr}
  .sp-profile-cover-actions{align-items:flex-start;flex-direction:column}
}


/* ===== 2.0.1 profile banner/avatar direct upload + real-page polish ===== */
.sp-profile-flash{
  width:min(1120px,calc(100% - 40px));
  margin:14px auto 0;
  min-height:46px;
  padding:0 14px;
  display:flex;
  align-items:center;
  border-radius:12px;
  border:1px solid #d9e6ff;
  background:#eef5ff;
  color:#0b4bb3;
  font-size:14px;
  font-weight:700;
  box-shadow:var(--sp-shadow);
}
.sp-profile-flash.is-success{border-color:#c9ecd3;background:#ecfbef;color:#157d33}
.sp-profile-flash.is-error{border-color:#f6d2d0;background:#fff1f1;color:#b42318}

.sp-profile-cover-upload-form,
.sp-profile-avatar-upload-form{display:contents}
.sp-profile-cover-edit{
  right:18px;
  bottom:18px;
  min-height:44px;
  padding:0 16px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.98);
  color:#101828;
  font-size:13px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(15,23,42,.17);
}
.sp-profile-cover-edit:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
  pointer-events:none;
}
.sp-profile-cover-edit .sp-icon{width:18px;height:18px}
.sp-profile-cover-edit:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,23,42,.2)}
.sp-profile-cover-edit.is-uploading{opacity:.85;pointer-events:none}

.sp-profile-avatar-edit{
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#fff;
  color:#111827;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 24px rgba(15,23,42,.15);
}
.sp-profile-avatar-edit:hover{transform:translateY(-1px)}
.sp-profile-avatar-edit.is-uploading{opacity:.82;pointer-events:none}
.sp-profile-avatar-edit .sp-icon{width:18px;height:18px}

.sp-side-icon{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#f2f4f7;
  color:#1d2939;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.sp-side-link:hover .sp-side-icon,
.sp-side-link.active .sp-side-icon{
  background:#eaf1ff;
  color:var(--sp-blue);
}
.sp-side-link:hover .sp-side-icon{transform:scale(1.03)}
.sp-side-icon .sp-icon{width:18px;height:18px}

@media(max-width:800px){
  .sp-profile-flash{
    width:calc(100% - 20px);
    margin-top:10px;
    border-radius:10px;
  }
  .sp-profile-cover-edit{
    right:12px;
    bottom:12px;
    min-height:40px;
    padding:0 13px;
    border-radius:11px;
  }
  .sp-profile-cover-edit span{display:inline}
  .sp-side-icon{
    width:30px;
    height:30px;
    border-radius:9px;
  }
}
@media(max-width:520px){
  .sp-profile-cover-edit span{
    max-width:114px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}



/* ===== V2.1 Follow system + improved loading ===== */

/* Follow button */
.sp-follow-btn{
  min-height:40px;
  padding:0 14px;
  border:0;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  cursor:pointer;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  transition:transform .16s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.sp-follow-btn .sp-icon{width:18px;height:18px}
.sp-follow-btn.is-follow{
  background:#edf4ff;
  color:var(--sp-blue);
}
.sp-follow-btn.is-follow:hover{
  background:#dfeaff;
  transform:translateY(-1px);
}
.sp-follow-btn.is-following{
  background:#e9edf2;
  color:#1f2937;
}
.sp-follow-btn.is-following:hover{
  background:#fbe9ec;
  color:#b42318;
}
.sp-follow-btn.is-working{opacity:.7;pointer-events:none}
.sp-follow-btn.is-compact{
  min-height:34px;
  padding:0 11px;
  font-size:12px;
  border-radius:8px;
}
.sp-profile-actions .sp-follow-btn{min-height:40px}
.sp-profile-follow-card-actions{display:flex;align-items:center;justify-content:flex-end}
.sp-profile-follow-grid .sp-profile-friend-card{grid-template-columns:94px minmax(0,1fr) auto}

/* Improved layered skeleton */
:root{
  --sp-skel-base:#e9edf2;
  --sp-skel-hi:#fbfcfd;
  --sp-skel-mid:#f2f5f8;
  --sp-skel-edge:#dde3e9;
  --sp-skel-speed:3.35s;
}
@keyframes spUniversalShimmer{
  0%{background-position:220% 0}
  100%{background-position:-220% 0}
}
@keyframes spLoadGlow{
  0%,100%{opacity:.55}
  50%{opacity:.9}
}
@keyframes spLoadRevealCard{
  0%{opacity:0;transform:translateY(10px) scale(.992);filter:blur(3px)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes spLoadPulseDot{
  0%,80%,100%{transform:scale(.75);opacity:.35}
  40%{transform:scale(1);opacity:1}
}

.sp-ui-booting .sp-post-card::after,
.sp-ui-booting .sp-composer::after,
.sp-ui-booting .sp-stories::after,
.sp-ui-booting .sp-widget::after,
.sp-ui-booting .sp-group-card::after,
.sp-ui-booting .sp-friend-result::after,
.sp-ui-booting .sp-settings-card::after,
.sp-ui-booting .sp-profile-card::after,
.sp-ui-booting .sp-profile-wide-card::after,
.sp-ui-booting .sp-profile-suggestions::after{
  background:
    linear-gradient(
      108deg,
      var(--sp-skel-base) 8%,
      var(--sp-skel-mid) 20%,
      var(--sp-skel-hi) 31%,
      var(--sp-skel-mid) 42%,
      var(--sp-skel-edge) 54%,
      var(--sp-skel-hi) 66%,
      var(--sp-skel-base) 79%
    )!important;
  background-size:260% 100%!important;
  animation:
    spUniversalShimmer var(--sp-skel-speed) cubic-bezier(.4,0,.2,1) infinite,
    spLoadGlow 2.4s ease-in-out infinite!important;
}

/* Richer skeleton structure */
.sp-ui-booting .sp-post-card::before,
.sp-ui-booting .sp-composer::before,
.sp-ui-booting .sp-stories::before,
.sp-ui-booting .sp-group-card::before,
.sp-ui-booting .sp-settings-card::before,
.sp-ui-booting .sp-profile-card::before{
  left:18px!important;
  right:18px!important;
  top:18px!important;
  height:13px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  box-shadow:
    0 24px 0 rgba(255,255,255,.55),
    0 48px 0 rgba(255,255,255,.38),
    0 78px 0 rgba(255,255,255,.24)!important;
}

/* Staggered reveal after loading */
.sp-ui-ready .sp-post-card,
.sp-ui-ready .sp-composer,
.sp-ui-ready .sp-stories,
.sp-ui-ready .sp-widget,
.sp-ui-ready .sp-group-card,
.sp-ui-ready .sp-friend-result,
.sp-ui-ready .sp-settings-card,
.sp-ui-ready .sp-profile-card,
.sp-ui-ready .sp-profile-wide-card,
.sp-ui-ready .sp-profile-suggestion-card{
  animation:spLoadRevealCard .6s cubic-bezier(.2,.8,.2,1) both!important;
  animation-delay:calc(var(--sp-load-index,0) * 42ms)!important;
}

/* Asset loading: softer blur-up and border glow */
img.sp-ui-asset-loading{
  opacity:.48!important;
  filter:blur(3px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
}
img.sp-ui-asset-loaded{
  animation:spAssetReveal .82s cubic-bezier(.2,.8,.2,1) both!important;
}
@keyframes spAssetReveal{
  from{opacity:.2;filter:blur(7px);transform:scale(1.015)}
  to{opacity:1;filter:none;transform:none}
}
.sp-ui-bg-loading::before{
  background:
    linear-gradient(110deg,var(--sp-skel-base),var(--sp-skel-mid),var(--sp-skel-hi),var(--sp-skel-mid),var(--sp-skel-base))!important;
  background-size:260% 100%!important;
  animation:spUniversalShimmer var(--sp-skel-speed) cubic-bezier(.4,0,.2,1) infinite!important;
}

/* Better top progress bar */
.sp-page-loader{
  height:3px!important;
}
.sp-page-loader span{
  border-radius:0 999px 999px 0;
  box-shadow:0 0 10px rgba(8,102,255,.38);
}
.sp-ui-booting .sp-page-loader span,
.sp-route-loading .sp-page-loader span{
  animation:spPageLoad 1.65s cubic-bezier(.22,.61,.36,1) infinite!important;
}

/* Tiny animated loading dots for buttons */
.sp-follow-btn.is-working:after,
.sp-profile-cover-edit.is-uploading:after{
  content:"";
  width:6px;
  height:6px;
  margin-left:2px;
  border-radius:50%;
  background:currentColor;
  box-shadow:10px 0 currentColor,20px 0 currentColor;
  animation:spLoadPulseDot 1.2s ease-in-out infinite;
}

@media(max-width:800px){
  .sp-profile-follow-grid .sp-profile-friend-card{
    grid-template-columns:72px minmax(0,1fr);
  }
  .sp-profile-follow-card-actions{
    grid-column:2;
    justify-content:flex-start;
  }
}



/* ===== V2.1.1 OPAQUE loading animation fix ===== */

@keyframes spLoadGlowOpaque{
  0%,100%{filter:brightness(.985)}
  50%{filter:brightness(1.025)}
}
@keyframes spLoadRevealCardOpaque{
  0%{opacity:1;transform:translateY(8px) scale(.994);filter:blur(3px)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes spUiReadyOpaque{
  from{opacity:1;transform:translateY(2px);filter:blur(1.5px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes spAssetRevealOpaque{
  from{opacity:1;filter:blur(6px);transform:scale(1.01)}
  to{opacity:1;filter:none;transform:none}
}

/* Fully opaque card/section skeletons */
.sp-ui-booting .sp-topbar-inner>*::after,
.sp-ui-booting .sp-side-user::after,
.sp-ui-booting .sp-side-link::after,
.sp-ui-booting .sp-stories::after,
.sp-ui-booting .sp-composer::after,
.sp-ui-booting .sp-post-card::after,
.sp-ui-booting .sp-widget::after,
.sp-ui-booting .sp-view-head::after,
.sp-ui-booting .sp-person-card::after,
.sp-ui-booting .sp-settings-card::after,
.sp-ui-booting .sp-settings-nav::after,
.sp-ui-booting .sp-friend-result::after,
.sp-ui-booting .sp-friends-tabs::after,
.sp-ui-booting .sp-group-toolbar::after,
.sp-ui-booting .sp-groups-hero::after,
.sp-ui-booting .sp-group-card::after,
.sp-ui-booting .sp-group-create-form::after,
.sp-ui-booting .sp-group-create-preview-wrap::after,
.sp-ui-booting .sp-group-profile::after,
.sp-ui-booting .sp-group-owner-notifications::after,
.sp-ui-booting .sp-group-composer::after,
.sp-ui-booting .sp-group-about-card::after,
.sp-ui-booting .sp-group-members-card::after,
.sp-ui-booting .sp-group-settings-card::after,
.sp-ui-booting .sp-comments-dialog::after,
.sp-ui-booting .sp-profile-hero::after,
.sp-ui-booting .sp-profile-suggestions::after,
.sp-ui-booting .sp-profile-card::after,
.sp-ui-booting .sp-profile-wide-card::after,
.sp-ui-booting .sp-profile-post-card::after,
.sp-route-loading .sp-feed>.sp-post-card::after,
.sp-route-loading .sp-feed>.sp-composer::after,
.sp-route-loading .sp-feed>.sp-stories::after{
  opacity:1!important;
  background:
    linear-gradient(
      108deg,
      #e7ebf0 7%,
      #f0f3f6 20%,
      #ffffff 31%,
      #f1f4f7 42%,
      #dfe5eb 54%,
      #fafbfd 66%,
      #e7ebf0 80%
    )!important;
  background-size:260% 100%!important;
  animation:
    spUniversalShimmer var(--sp-skel-speed) cubic-bezier(.4,0,.2,1) infinite,
    spLoadGlowOpaque 2.4s ease-in-out infinite!important;
}

/* Opaque placeholder lines */
.sp-ui-booting .sp-post-card::before,
.sp-ui-booting .sp-composer::before,
.sp-ui-booting .sp-stories::before,
.sp-ui-booting .sp-group-card::before,
.sp-ui-booting .sp-settings-card::before,
.sp-ui-booting .sp-friend-result::before,
.sp-ui-booting .sp-profile-card::before{
  background:#ffffff!important;
  box-shadow:
    0 24px 0 #f8fafc,
    0 48px 0 #f3f6f9,
    0 78px 0 #edf1f5!important;
}

/* Hide actual image bytes until fully loaded; parent carries shimmer */
.sp-ui-image-parent-loading{
  background:
    linear-gradient(
      108deg,
      #e7ebf0 8%,
      #f3f6f9 23%,
      #ffffff 36%,
      #eef2f6 51%,
      #dfe5eb 66%,
      #f8fafc 79%
    )!important;
  background-size:260% 100%!important;
  animation:spUniversalShimmer var(--sp-skel-speed) cubic-bezier(.4,0,.2,1) infinite!important;
}
img.sp-ui-asset-loading{
  visibility:hidden!important;
  opacity:1!important;
  filter:none!important;
  animation:none!important;
}
img.sp-ui-asset-loaded{
  visibility:visible!important;
  opacity:1!important;
  animation:spAssetRevealOpaque .72s cubic-bezier(.2,.8,.2,1) both!important;
}
img.sp-ui-asset-error{
  visibility:visible!important;
  opacity:1!important;
}

/* Opaque CSS-background skeleton */
.sp-ui-bg-loading::before{
  opacity:1!important;
  background:
    linear-gradient(
      110deg,
      #e7ebf0,
      #f0f3f6,
      #ffffff,
      #eef2f6,
      #e1e6ec
    )!important;
  background-size:260% 100%!important;
  animation:spUniversalShimmer var(--sp-skel-speed) cubic-bezier(.4,0,.2,1) infinite!important;
}
.sp-ui-bg-loaded::before{
  opacity:0!important;
  transition:opacity .32s ease,visibility .32s ease!important;
}

/* Opaque video/media skeleton */
.sp-media-item .sp-media-skeleton{
  opacity:1!important;
  background:
    linear-gradient(
      108deg,
      #e5e9ee 8%,
      #f1f4f7 21%,
      #ffffff 34%,
      #edf1f5 48%,
      #dfe5eb 62%,
      #f8fafc 76%
    )!important;
  background-size:260% 100%!important;
}
.sp-media-item.sp-loaded .sp-media-skeleton{
  animation:spSkeletonOut .55s ease both!important;
}

/* Comment popup loading stays solid */
.sp-comments-skeleton,
.sp-comments-skel-side{
  background:#fff!important;
}
.sp-comments-skel-media,
.sp-comments-skel-user i,
.sp-comments-skel-comment i,
.sp-comments-skel-user span,
.sp-comments-skel-comment span,
.sp-comments-skel-line,
.sp-comments-skel-actions,
.sp-comments-skel-input{
  opacity:1!important;
}

/* Reveal without transparency */
.sp-ui-ready .sp-shell,
.sp-ui-ready .sp-topbar,
.sp-ui-ready .sp-mobile-nav{
  opacity:1!important;
  animation:spUiReadyOpaque .72s ease both!important;
}
.sp-ui-ready .sp-post-card,
.sp-ui-ready .sp-composer,
.sp-ui-ready .sp-stories,
.sp-ui-ready .sp-widget,
.sp-ui-ready .sp-group-card,
.sp-ui-ready .sp-friend-result,
.sp-ui-ready .sp-settings-card,
.sp-ui-ready .sp-profile-card,
.sp-ui-ready .sp-profile-wide-card,
.sp-ui-ready .sp-profile-suggestion-card{
  opacity:1!important;
  animation:spLoadRevealCardOpaque .6s cubic-bezier(.2,.8,.2,1) both!important;
  animation-delay:calc(var(--sp-load-index,0) * 42ms)!important;
}

/* Working buttons no longer fade */
.sp-follow-btn.is-working,
.sp-profile-cover-edit.is-uploading,
.sp-profile-avatar-edit.is-uploading{
  opacity:1!important;
  filter:saturate(.72) brightness(.97);
}

/* Remove the old transparent iframe loading state */
iframe.sp-ui-frame-loading{
  opacity:1!important;
  background:#e8edf2!important;
}



/* ===== V2.1.2 Follow/Following animation fix ===== */

@keyframes spFollowSpin{
  to{transform:rotate(360deg)}
}
@keyframes spFollowSuccessPop{
  0%{transform:scale(1)}
  45%{transform:scale(1.045)}
  100%{transform:scale(1)}
}
@keyframes spFollowErrorShake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-3px)}
  75%{transform:translateX(3px)}
}

/* Stable size prevents the button from jumping Follow <-> Following */
.sp-follow-btn{
  min-width:104px;
  width:max-content;
  max-width:180px;
  overflow:hidden;
  position:relative;
  vertical-align:middle;
  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease!important;
}
.sp-follow-btn.is-working{
  width:var(--sp-follow-lock-width,auto)!important;
  min-width:var(--sp-follow-lock-width,104px)!important;
  max-width:var(--sp-follow-lock-width,180px)!important;
  cursor:wait;
  pointer-events:none;
  opacity:1!important;
}
.sp-follow-btn.is-working>span{
  opacity:.72;
}
.sp-follow-spinner{
  width:16px;
  height:16px;
  flex:0 0 16px;
  border-radius:50%;
  border:2px solid currentColor;
  border-right-color:transparent;
  display:inline-block;
  animation:spFollowSpin .7s linear infinite;
}

/* Smooth state morph instead of sudden replacement */
.sp-follow-btn.is-switching{
  transform:scale(.975);
}
.sp-follow-btn.is-switching>*{
  opacity:0;
  transform:translateY(3px);
  transition:opacity .12s ease,transform .12s ease;
}
.sp-follow-btn:not(.is-switching)>*{
  opacity:1;
  transform:translateY(0);
  transition:opacity .18s ease,transform .18s ease;
}
.sp-follow-btn.is-success-pop{
  animation:spFollowSuccessPop .34s cubic-bezier(.2,.85,.25,1);
}
.sp-follow-btn.is-error-shake{
  animation:spFollowErrorShake .3s ease;
}

/* Remove the old 3-dot pseudo animation completely */
.sp-follow-btn.is-working:after{
  content:none!important;
  display:none!important;
  animation:none!important;
  box-shadow:none!important;
}

/* Refined final states */
.sp-follow-btn.is-follow{
  background:#e8f1ff;
  color:#0866ff;
  box-shadow:inset 0 0 0 1px rgba(8,102,255,.08);
}
.sp-follow-btn.is-follow:hover:not(.is-working){
  background:#dceaff;
  transform:translateY(-1px);
  box-shadow:0 5px 14px rgba(8,102,255,.10);
}
.sp-follow-btn.is-following{
  background:#e9edf2;
  color:#1f2937;
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.035);
}
.sp-follow-btn.is-following:hover:not(.is-working){
  background:#f7e8eb;
  color:#b42318;
  transform:translateY(-1px);
}
.sp-follow-btn.is-compact{
  min-width:92px;
}

@media(max-width:520px){
  .sp-profile-actions .sp-follow-btn{
    min-width:104px;
  }
}



/* ===== V2.1.3 Unified rounded SVG icon system ===== */
.sp-icon-rounded{
  display:block;
  flex:0 0 auto;
  overflow:visible;
  shape-rendering:geometricPrecision;
  vector-effect:non-scaling-stroke;
}
button .sp-icon-rounded,
a .sp-icon-rounded,
label .sp-icon-rounded{
  pointer-events:none;
}

/* Main navigation */
.sp-side-icon .sp-icon-rounded{
  width:19px;
  height:19px;
  stroke-width:1.95;
}
.sp-nav-icons .sp-icon-rounded,
.sp-friends-nav .sp-icon-rounded,
.sp-groups-nav .sp-icon-rounded{
  width:21px;
  height:21px;
}
.sp-nav-icons>a,
.sp-side-icon{
  border-radius:12px!important;
}

/* Actions */
.sp-actions .sp-icon-rounded{
  width:20px;
  height:20px;
}
.sp-like-btn .sp-icon-rounded,
.sp-comment-btn .sp-icon-rounded,
.sp-share-btn .sp-icon-rounded{
  stroke-width:1.85;
}

/* Profile controls */
.sp-profile-actions .sp-icon-rounded,
.sp-follow-btn .sp-icon-rounded,
.sp-profile-cover-edit .sp-icon-rounded,
.sp-profile-avatar-edit .sp-icon-rounded{
  width:18px;
  height:18px;
}

/* Groups and Stories */
.sp-group-tabs .sp-icon-rounded,
.sp-group-primary .sp-icon-rounded,
.sp-group-action-btn .sp-icon-rounded{
  width:18px;
  height:18px;
}
.sp-story-plus .sp-icon-rounded{
  width:18px;
  height:18px;
}
.sp-story-video-badge .sp-icon-rounded{
  width:18px;
  height:18px;
}

/* Media controls */
.sp-video-controls .sp-icon-rounded,
.sp-video-center-play .sp-icon-rounded{
  stroke-width:1.8;
}

/* Keep dotted more icon crisp */
.sp-icon-more circle{
  fill:currentColor;
}

/* Refined rounded icon buttons */
.sp-more,
.sp-modal-close,
.sp-stories-scroll-btn,
.sp-profile-avatar-edit{
  border-radius:12px!important;
}
.sp-more:hover,
.sp-modal-close:hover,
.sp-stories-scroll-btn:hover:not(:disabled){
  background:#edf1f5!important;
}

/* Consistent active-state icon color */
.sp-side-link.active .sp-icon-rounded,
.sp-nav-icons>a.active .sp-icon-rounded,
.sp-group-tabs a.active .sp-icon-rounded{
  color:var(--sp-blue);
}

/* Slightly softer appearance on secondary icons */
.sp-meta-icon,
.sp-profile-detail .sp-icon-rounded,
.sp-group-about-line>.sp-icon-rounded{
  stroke-width:1.75;
}

/* Mobile: maintain comfortable rounded icon scale */
@media(max-width:800px){
  .sp-side-icon .sp-icon-rounded{
    width:18px;
    height:18px;
  }
  .sp-mobile-nav .sp-icon-rounded{
    width:21px;
    height:21px;
  }
}



/* ==========================================================
   V2.2 — Settings fix + premium UI refinement
   ========================================================== */

/* CRITICAL FIX:
   Never apply full-width text-input dimensions to native checkboxes/radios. */
.sp-settings-form input[type="checkbox"],
.sp-settings-form input[type="radio"]{
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  appearance:auto!important;
}
.sp-settings-form input[type="file"],
.sp-settings-form input[type="hidden"]{
  min-height:0!important;
  padding:0!important;
}

/* More deliberate page shell */
.sp-settings-page{
  max-width:1140px;
  margin:0 auto;
  padding-top:18px;
}
.sp-settings-page-head{
  min-height:116px;
  margin-bottom:16px;
  padding:22px 24px;
  border:1px solid rgba(15,23,42,.06);
  border-radius:16px;
  background:
    radial-gradient(circle at 88% 12%,rgba(8,102,255,.10),transparent 28%),
    linear-gradient(135deg,#fff 0%,#f8faff 100%);
  box-shadow:var(--sp-shadow);
}
.sp-settings-page-head h1{
  margin:2px 0 5px;
  font-size:30px;
  letter-spacing:-.025em;
}
.sp-settings-page-head p{
  max-width:650px;
  margin:0;
  color:#667085;
  line-height:1.45;
}
.sp-settings-eyebrow{
  display:block;
  color:var(--sp-blue);
  font-size:10px;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.sp-settings-page-head .sp-app-secondary{
  min-height:40px;
  padding:0 13px;
  gap:7px;
  background:#fff;
  border:1px solid #e2e6ec;
  box-shadow:0 2px 8px rgba(15,23,42,.04);
}
.sp-settings-page-head .sp-app-secondary .sp-icon{width:17px;height:17px}

/* Settings layout/sidebar */
.sp-settings-grid{
  grid-template-columns:245px minmax(0,1fr)!important;
  gap:18px!important;
}
.sp-settings-nav{
  padding:9px!important;
  border:1px solid #e5e9ee;
  border-radius:15px!important;
  box-shadow:var(--sp-shadow)!important;
}
.sp-settings-nav-title{
  padding:8px 10px 9px;
  color:#98a2b3;
  font-size:10px;
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.sp-settings-nav a{
  position:relative;
  min-height:46px;
  padding:6px 9px!important;
  gap:9px!important;
  border-radius:10px!important;
  color:#475467;
  font-size:13px;
  font-weight:720!important;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.sp-settings-nav a:hover{
  background:#f4f6f8!important;
  color:#1d2939!important;
  transform:translateX(1px);
}
.sp-settings-nav a.active{
  background:#edf4ff!important;
  color:var(--sp-blue)!important;
}
.sp-settings-nav a.active:before{
  content:"";
  position:absolute;
  left:-5px;
  width:3px;
  height:22px;
  border-radius:0 4px 4px 0;
  background:var(--sp-blue);
}
.sp-settings-nav-icon{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:#f2f4f7;
  color:#667085;
}
.sp-settings-nav-icon .sp-icon{width:17px!important;height:17px!important}
.sp-settings-nav a.active .sp-settings-nav-icon{
  background:#dce9ff;
  color:var(--sp-blue);
}
.sp-settings-nav .is-danger{color:#b42318!important}
.sp-settings-nav .is-danger .sp-settings-nav-icon{background:#fff1f1;color:#d92d20}
.sp-settings-nav-divider{height:1px;margin:6px 7px;background:#edf0f3}

/* Main cards */
.sp-settings-content{gap:18px!important}
.sp-settings-card{
  padding:22px!important;
  border:1px solid #e5e9ee!important;
  border-radius:16px!important;
  background:#fff;
  box-shadow:var(--sp-shadow)!important;
}
.sp-settings-card:hover{
  box-shadow:0 2px 5px rgba(15,23,42,.04),0 12px 32px rgba(15,23,42,.055)!important;
}
.sp-settings-section-head{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:12px;
  align-items:center;
  margin-bottom:19px;
  padding-bottom:17px;
  border-bottom:1px solid #edf0f3;
}
.sp-settings-section-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#edf4ff;
  color:var(--sp-blue);
}
.sp-settings-section-icon .sp-icon{width:20px;height:20px}
.sp-settings-section-head h2{
  margin:0!important;
  font-size:19px!important;
  letter-spacing:-.015em;
}
.sp-settings-section-head p{
  margin:3px 0 0;
  color:#98a2b3;
  font-size:12px;
  line-height:1.4;
}
.sp-settings-subsection-title{
  position:relative;
  margin:4px 0 1px;
  display:flex;
  align-items:center;
  gap:10px;
  color:#667085;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.sp-settings-subsection-title:after{
  content:"";
  height:1px;
  flex:1;
  background:#edf0f3;
}

/* Cover editor */
.sp-profile-cover-editor{
  padding:0!important;
  overflow:hidden;
  border:1px solid #e2e7ed!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 3px 12px rgba(15,23,42,.04);
}
.sp-profile-cover-preview{
  height:260px!important;
  border-radius:0!important;
  background-color:#e9eef5!important;
}
.sp-profile-cover-preview:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.sp-profile-cover-scrim{
  position:absolute;
  inset:auto 0 0;
  height:90px;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.18));
}
.sp-profile-cover-placeholder{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  color:#8091a7!important;
  text-align:center;
}
.sp-profile-cover-placeholder .sp-icon{width:42px!important;height:42px!important;margin-bottom:3px}
.sp-profile-cover-placeholder strong{color:#526276;font-size:14px}
.sp-profile-cover-placeholder small{color:#8d9bad;font-size:11px}
.sp-profile-cover-change{
  z-index:4;
  right:14px!important;
  bottom:14px!important;
  min-height:40px!important;
  padding:0 14px!important;
  border:1px solid rgba(255,255,255,.52);
  border-radius:11px!important;
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:blur(9px);
  box-shadow:0 6px 18px rgba(15,23,42,.17)!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
.sp-profile-cover-change:hover{
  transform:translateY(-1px);
  box-shadow:0 9px 24px rgba(15,23,42,.20)!important;
}
.sp-profile-cover-actions{
  min-height:78px;
  padding:13px 14px!important;
  align-items:center!important;
  background:#fff;
  border-top:1px solid #edf0f3;
}
.sp-profile-cover-copy{min-width:0;display:flex;flex-direction:column}
.sp-profile-cover-copy>strong{color:#1d2939;font-size:13px}
.sp-profile-cover-copy>small{max-width:510px;color:#98a2b3!important;font-size:11px;line-height:1.4}

/* Custom remove control — replaces broken giant checkbox UI */
.sp-media-remove-control{
  position:relative;
  flex:0 0 auto;
  display:grid!important;
  grid-template-columns:32px auto!important;
  gap:9px!important;
  align-items:center;
  width:auto!important;
  min-height:44px;
  padding:5px 10px 5px 7px;
  border:1px solid #f0d5d3;
  border-radius:11px;
  background:#fff8f7;
  cursor:pointer;
  user-select:none;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.sp-media-remove-control:hover{
  background:#fff2f1;
  border-color:#edc4c1;
  transform:translateY(-1px);
}
.sp-media-remove-control>input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-width:1px!important;
  min-height:1px!important;
  margin:-1px!important;
  padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
  border:0!important;
  opacity:0!important;
}
.sp-media-remove-icon{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:#fee4e2;
  color:#d92d20;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.sp-media-remove-icon .sp-icon{width:15px;height:15px}
.sp-media-remove-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:1px;
}
.sp-media-remove-copy strong{color:#b42318;font-size:11.5px;line-height:1.2}
.sp-media-remove-copy small{color:#c66a63!important;font-size:9.5px!important;line-height:1.2}
.sp-media-remove-control.is-selected{
  border-color:#f04438;
  background:#fff0ee;
  box-shadow:0 0 0 3px rgba(240,68,56,.08);
}
.sp-media-remove-control.is-selected .sp-media-remove-icon{
  background:#d92d20;
  color:#fff;
  transform:scale(.96);
}
.sp-media-remove-control.is-selected .sp-media-remove-copy strong:after{
  content:" selected";
  font-weight:650;
}

/* Profile photo editor */
.sp-profile-photo-editor{
  grid-template-columns:104px minmax(0,1fr) auto!important;
  gap:17px!important;
  padding:16px!important;
  margin-top:2px;
  border:1px solid #e3e8ee!important;
  border-radius:15px!important;
  background:#fbfcfd!important;
}
.sp-profile-photo-preview{
  width:94px!important;
  height:94px!important;
}
.sp-profile-photo-preview>.sp-avatar,
.sp-profile-photo-preview>img{
  width:94px!important;
  height:94px!important;
  box-shadow:0 0 0 3px #fff,0 5px 18px rgba(15,23,42,.12)!important;
}
.sp-profile-photo-camera{
  right:-1px!important;
  bottom:0!important;
  width:34px!important;
  height:34px!important;
  border-radius:11px!important;
  border:3px solid #fff!important;
}
.sp-profile-photo-copy>strong{font-size:15px!important}
.sp-profile-photo-copy>span{
  max-width:450px;
  margin-top:7px!important;
  color:#98a2b3!important;
  font-size:11px!important;
}
.sp-profile-photo-actions{
  align-self:center;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:7px;
}
.sp-profile-photo-change{
  min-height:38px!important;
  padding:0 12px!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:10px!important;
  background:#e8f1ff!important;
  color:var(--sp-blue)!important;
  font-size:11.5px!important;
  font-weight:800!important;
  cursor:pointer;
}
.sp-profile-photo-change .sp-icon{width:15px;height:15px}
.sp-media-remove-control.is-photo{
  min-height:38px;
  grid-template-columns:26px auto!important;
  padding:4px 8px 4px 5px;
}
.sp-media-remove-control.is-photo .sp-media-remove-icon{width:26px;height:26px;border-radius:8px}
.sp-media-remove-control.is-photo .sp-media-remove-copy small{display:none}

/* Form fields */
.sp-settings-form{gap:14px!important}
.sp-settings-form>label,
.sp-form-two>label{
  gap:7px!important;
  color:#344054;
  font-size:12px!important;
  font-weight:720!important;
}
.sp-settings-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
.sp-settings-form textarea,
.sp-settings-form select{
  min-height:45px!important;
  padding:10px 12px!important;
  border:1px solid #dfe4ea!important;
  border-radius:10px!important;
  background:#fbfcfd!important;
  color:#1d2939;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease!important;
}
.sp-settings-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):hover,
.sp-settings-form textarea:hover,
.sp-settings-form select:hover{
  border-color:#cbd3dc!important;
  background:#fff!important;
}
.sp-settings-form input:focus,
.sp-settings-form textarea:focus,
.sp-settings-form select:focus{
  background:#fff!important;
  border-color:#8db5ff!important;
  box-shadow:0 0 0 4px rgba(8,102,255,.075)!important;
}
.sp-settings-form textarea{min-height:112px!important;line-height:1.45}
.sp-settings-form .sp-app-primary{
  min-width:126px;
  min-height:42px;
  padding:0 16px;
  border-radius:10px!important;
  box-shadow:0 4px 12px rgba(8,102,255,.16);
}

/* General final UI refinement */
.sp-app-primary,
.sp-profile-primary,
.sp-follow-btn,
.sp-friend-btn,
.sp-group-primary{
  letter-spacing:-.005em;
}
.sp-post-card,
.sp-composer,
.sp-stories,
.sp-widget,
.sp-group-card,
.sp-profile-card,
.sp-profile-wide-card{
  border-color:rgba(15,23,42,.065)!important;
}
.sp-post-card,
.sp-composer,
.sp-stories{
  box-shadow:0 1px 2px rgba(15,23,42,.04),0 7px 22px rgba(15,23,42,.04)!important;
}
.sp-post-card:hover{
  box-shadow:0 3px 8px rgba(15,23,42,.055),0 14px 34px rgba(15,23,42,.065)!important;
}
.sp-actions button{
  border-radius:10px!important;
}
.sp-modal-card,
.sp-comments-dialog{
  border-radius:16px!important;
}

/* Responsive */
@media(max-width:900px){
  .sp-settings-grid{grid-template-columns:210px minmax(0,1fr)!important}
  .sp-profile-photo-editor{grid-template-columns:94px minmax(0,1fr)!important}
  .sp-profile-photo-actions{
    grid-column:2;
    flex-direction:row;
    justify-content:flex-start;
  }
}
@media(max-width:800px){
  .sp-settings-page{padding-top:8px!important}
  .sp-settings-page-head{
    margin:0 0 10px;
    border-radius:12px;
    padding:17px;
  }
  .sp-settings-page-head h1{font-size:26px}
  .sp-settings-page-head .sp-app-secondary span{display:none}
  .sp-settings-grid{grid-template-columns:1fr!important}
  .sp-settings-nav{
    position:sticky!important;
    top:58px!important;
    z-index:25;
    display:flex!important;
    align-items:center;
    gap:4px;
    overflow-x:auto;
    border-radius:12px!important;
    scrollbar-width:none;
  }
  .sp-settings-nav::-webkit-scrollbar{display:none}
  .sp-settings-nav-title,.sp-settings-nav-divider{display:none}
  .sp-settings-nav a{
    flex:0 0 auto;
    min-height:40px;
    padding:4px 8px!important;
  }
  .sp-settings-nav a.active:before{display:none}
  .sp-settings-nav-icon{width:29px;height:29px;flex-basis:29px}
  .sp-settings-card{padding:17px!important;border-radius:12px!important}
  .sp-profile-cover-preview{height:210px!important}
  .sp-profile-cover-actions{
    align-items:flex-start!important;
    flex-direction:column;
  }
  .sp-media-remove-control{align-self:flex-start}
}
@media(max-width:560px){
  .sp-settings-page-head p{font-size:12px}
  .sp-settings-section-head{
    grid-template-columns:38px minmax(0,1fr);
  }
  .sp-settings-section-icon{width:38px;height:38px;border-radius:11px}
  .sp-profile-cover-preview{height:178px!important}
  .sp-profile-cover-change{
    min-height:37px!important;
    right:9px!important;
    bottom:9px!important;
  }
  .sp-profile-photo-editor{
    grid-template-columns:1fr!important;
    justify-items:center;
    text-align:center;
  }
  .sp-profile-photo-copy{align-items:center!important}
  .sp-profile-photo-actions{
    grid-column:auto;
    width:100%;
    flex-direction:row;
    justify-content:center;
  }
  .sp-form-two{grid-template-columns:1fr!important}
  .sp-settings-form .sp-app-primary{width:100%;justify-self:stretch!important}
}



/* ==========================================================
   V2.6 — Responsive feed ads + unified AJAX comments
   ========================================================== */
.sp-feed-banner-ad{
  position:relative;
  width:100%;
  max-width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#fff;
  border-top:1px solid #e5e8eb;
  border-bottom:1px solid #e5e8eb;
  box-sizing:border-box;
  container-type:inline-size;
}
.sp-feed-banner-ad-label{
  position:absolute;
  top:6px;
  left:8px;
  z-index:4;
  padding:2px 6px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  color:#8b95a3;
  font-size:8px;
  font-weight:700;
  letter-spacing:.025em;
  box-shadow:0 1px 4px rgba(15,23,42,.06);
  backdrop-filter:blur(6px);
}
.sp-feed-banner-ad-inner{
  width:100%;
  max-width:100%;
  min-height:64px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#fafbfc;
}
.sp-feed-banner-ad-inner>a{
  display:block;
  width:100%;
  max-width:100%;
  line-height:0;
}
.sp-feed-banner-ad-image{
  display:block;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  max-height:180px;
  object-fit:contain;
  margin:0 auto;
}
.sp-feed-banner-ad-html,
.sp-feed-banner-ad-html>*{
  max-width:100%!important;
  box-sizing:border-box;
}
.sp-feed-banner-ad-html{
  width:100%;
  overflow:hidden;
  text-align:center;
}
.sp-feed-banner-ad-html iframe,
.sp-feed-banner-ad-html embed,
.sp-feed-banner-ad-html object,
.sp-feed-banner-ad-html video,
.sp-feed-banner-ad-html img{
  max-width:100%!important;
}
.sp-feed-banner-ad-html iframe{
  width:100%!important;
  border:0!important;
}
.sp-feed-banner-ad-html img,
.sp-feed-banner-ad-html video{
  width:auto;
  height:auto;
}
.sp-feed-banner-ad ins{
  max-width:100%!important;
}
.sp-feed-banner-ad:hover .sp-feed-banner-ad-image{
  filter:brightness(.985);
}

/* Keep the banner aligned with a post like the supplied reference. */
.sp-post-card>.sp-feed-banner-ad{
  margin-left:0;
  margin-right:0;
}

/* Single post now uses twittsocial.com's AJAX comment UI instead of WP's
   duplicate-error-prone comment-post.php form. */
.sp-inline-comments{
  overflow:hidden;
  border:1px solid #e1e5ea;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.035);
}
.sp-inline-comments-head{
  min-height:48px;
  padding:0 14px;
  display:flex;
  align-items:center;
  border-bottom:1px solid #edf0f3;
}
.sp-inline-comments-head strong{
  color:#344054;
  font-size:13px;
}
.sp-inline-comments>.sp-dialog-comments-scroll{
  max-height:520px;
  min-height:80px;
  padding:10px 12px;
}
.sp-inline-comments>.sp-dialog-form-shell{
  position:static!important;
  border-top:1px solid #edf0f3;
  background:#fff;
}
.sp-dialog-comment-submit.is-posting{
  cursor:wait;
  opacity:1!important;
}
.sp-dialog-comment-form[data-submitting="1"] textarea{
  opacity:.78;
}

/* Ad admin preview can reuse front-end responsive styles in wp-admin. */
.sp-ads-admin-preview-shell .sp-feed-banner-ad{
  border-radius:8px;
}

@media(max-width:800px){
  .sp-feed-banner-ad-inner{min-height:54px}
  .sp-feed-banner-ad-image{max-height:150px}
  .sp-feed-banner-ad-label{top:5px;left:6px}
}
@media(max-width:520px){
  .sp-feed-banner-ad-inner{min-height:46px}
  .sp-feed-banner-ad-image{max-height:120px}
  .sp-feed-banner-ad-label{font-size:7px}
  .sp-inline-comments{border-radius:10px}
}



/* ==========================================================
   V2.6.1 — Exact 728×90 banner + stronger mobile UI
   ========================================================== */

/* Desktop feed can now physically accommodate a 728px leaderboard. */
@media(min-width:1201px){
  .sp-topbar-inner{
    grid-template-columns:300px minmax(0,728px) 300px!important;
  }
  .sp-shell{
    grid-template-columns:300px minmax(0,728px) 300px!important;
  }
}

/* Exact leaderboard geometry at full size; scales proportionally below 728px. */
.sp-feed-banner-ad{
  display:flex!important;
  flex-direction:column;
  align-items:center;
  width:100%!important;
  background:#fff!important;
}
.sp-feed-banner-ad-inner{
  width:min(728px,100%)!important;
  aspect-ratio:728 / 90!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  overflow:hidden!important;
  background:#f8fafc!important;
}
.sp-feed-banner-ad-inner>a{
  width:100%!important;
  height:100%!important;
}
.sp-feed-banner-ad-image{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
}
.sp-feed-banner-ad-html{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  display:grid!important;
  place-items:center!important;
}
.sp-feed-banner-ad-label{
  left:max(6px,calc((100% - min(728px,100%))/2 + 6px))!important;
}

/* Mobile feed: edge-to-edge cards but comfortable text/control spacing. */
@media(max-width:800px){
  .sp-topbar-inner{
    height:54px!important;
    padding:0 8px!important;
  }
  .sp-brand-text{display:none!important}
  .sp-brand{gap:0!important}
  .sp-brand-mark{width:36px!important;height:36px!important}
  .sp-search{
    height:38px!important;
    margin:0 5px!important;
  }
  .sp-nav-icons{gap:5px!important}
  .sp-nav-icons>a{
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
  }
  .sp-nav-icons>a:nth-of-type(n+4){display:none!important}

  .sp-shell{
    padding:7px 0 72px!important;
  }
  .sp-center{
    width:100%!important;
    max-width:100%!important;
  }
  .sp-post-card,
  .sp-composer,
  .sp-stories{
    border-left:0!important;
    border-right:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .sp-post-card{
    margin-bottom:8px!important;
  }
  .sp-post-head{
    padding:10px 12px!important;
  }
  .sp-post-author strong{font-size:13px!important}
  .sp-post-author small{font-size:10.5px!important}
  .sp-post-text{
    padding:1px 12px 10px!important;
    font-size:14px!important;
    line-height:1.43!important;
  }
  .sp-social-stats{
    min-height:40px!important;
    padding:6px 12px!important;
    font-size:11px!important;
  }
  .sp-actions{
    min-height:47px!important;
    padding:4px 7px!important;
    gap:3px!important;
  }
  .sp-actions button{
    min-height:38px!important;
    border-radius:9px!important;
    font-size:12px!important;
    gap:6px!important;
  }
  .sp-actions .sp-icon{width:18px!important;height:18px!important}

  .sp-media-item,
  .sp-media-grid{
    max-width:100vw!important;
  }
  .sp-media-grid.sp-count-2,
  .sp-media-grid.sp-count-3,
  .sp-media-grid.sp-count-4{
    gap:2px!important;
  }

  .sp-feed-banner-ad{
    border-radius:0!important;
  }
  .sp-feed-banner-ad-inner{
    width:100%!important;
    aspect-ratio:728/90!important;
  }

  /* Stories: horizontal cards sized for thumbs, not tiny desktop leftovers. */
  .sp-stories{
    padding:10px!important;
  }
  .sp-stories-title{
    padding:0 2px 8px!important;
  }
  .sp-story-card{
    width:98px!important;
    min-width:98px!important;
    height:164px!important;
    border-radius:12px!important;
  }

  /* Comment popup becomes a bottom-sheet style mobile surface. */
  .sp-comments-modal{
    align-items:flex-end!important;
    padding:0!important;
  }
  .sp-comments-dialog{
    width:100%!important;
    max-width:none!important;
    height:min(90vh,760px)!important;
    max-height:90vh!important;
    border-radius:18px 18px 0 0!important;
  }
  .sp-dialog-head{
    min-height:52px!important;
    padding:0 10px 0 14px!important;
  }
  .sp-dialog-layout{
    display:block!important;
    height:calc(100% - 52px)!important;
  }
  .sp-dialog-media-pane{
    display:none!important;
  }
  .sp-dialog-side-pane{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    border-left:0!important;
  }
  .sp-dialog-comments-scroll{
    padding:10px 10px 96px!important;
  }
  .sp-dialog-form-shell{
    padding:8px 10px max(8px,env(safe-area-inset-bottom))!important;
  }
  .sp-dialog-comment-form textarea{
    min-height:42px!important;
    font-size:14px!important;
  }

  /* Settings / Friends / Groups controls remain touch-friendly. */
  .sp-app-page{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .sp-app-page-head h1{font-size:22px!important}
  .sp-friend-search{
    padding:8px!important;
    border-radius:11px!important;
  }
  .sp-friend-search input{height:42px!important}
  .sp-friend-search button{min-width:44px!important;height:42px!important;padding:0 12px!important}
  .sp-friend-tabs{margin:8px 0!important}
  .sp-friend-tabs a{min-height:38px!important;padding:8px 10px!important}

  /* Mobile profile: retain actions without overflow. */
  .sp-profile-actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .sp-profile-actions>*{
    width:100%!important;
    min-width:0!important;
  }
  .sp-profile-actions .sp-profile-secondary,
  .sp-profile-actions .sp-profile-primary,
  .sp-profile-actions .sp-follow-btn,
  .sp-profile-actions .sp-friend-btn{
    justify-content:center!important;
  }
}

@media(max-width:520px){
  .sp-topbar-inner{
    grid-template-columns:40px minmax(0,1fr) auto!important;
  }
  .sp-search input{
    font-size:12px!important;
  }
  .sp-nav-icons>a{
    width:36px!important;
    height:36px!important;
  }
  .sp-nav-icons>a:nth-of-type(n+3){display:none!important}

  .sp-post-head{padding:9px 10px!important}
  .sp-post-text{padding-left:10px!important;padding-right:10px!important}
  .sp-social-stats{padding-left:10px!important;padding-right:10px!important}
  .sp-actions button span{
    font-size:11.5px!important;
  }

  .sp-feed-banner-ad-label{
    top:3px!important;
    left:4px!important;
    padding:1px 5px!important;
    font-size:6.5px!important;
  }

  .sp-story-card{
    width:91px!important;
    min-width:91px!important;
    height:154px!important;
  }

  /* Dashboard tabs/nav remain scrollable instead of wrapping awkwardly. */
  .sp-dv-sidebar{
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  .sp-dv-sidebar::-webkit-scrollbar{display:none!important}
  .sp-dv-nav{
    min-width:max-content!important;
  }
  .sp-dv-workspace{
    padding-left:7px!important;
    padding-right:7px!important;
  }
  .sp-dv-card{
    border-radius:10px!important;
  }
  .sp-dv-library-tools{
    grid-template-columns:1fr!important;
  }
  .sp-dv-search,
  .sp-dv-select-btn,
  .sp-dv-columns>button,
  .sp-dv-export,
  .sp-dv-blue-btn{
    width:100%!important;
  }
}



/* ==========================================================
   V2.8 — Media stability: Reels + Stories
   ========================================================== */
html.sp-overlay-lock,body.sp-overlay-lock{overflow:hidden!important;overscroll-behavior:none}
.sp-story-viewer,.sp-story-upload-modal{pointer-events:none!important}
.sp-story-viewer.is-open,.sp-story-upload-modal.is-open{pointer-events:auto!important}
.sp-story-viewer:not(.is-open),.sp-story-upload-modal:not(.is-open){visibility:hidden!important;opacity:0!important}
.sp-story-media-loading{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;font-size:11px;animation:spStoryPulse 1.2s ease-in-out infinite}
@keyframes spStoryPulse{0%,100%{opacity:.55}50%{opacity:1}}
.sp-story-media-retry{padding:11px 14px;border:1px solid rgba(255,255,255,.22);border-radius:10px;background:rgba(0,0,0,.4);color:#fff;font:700 11px/1.2 inherit;cursor:pointer}
.sp-story-upload-modal .sp-modal-card{pointer-events:auto}
.sp-story-file-preview video{max-height:280px;display:block;width:100%;border-radius:9px;background:#000}

.sp-reel-loader{gap:10px;align-content:center}
.sp-reel-loader span{color:rgba(255,255,255,.82);font-size:10px;font-weight:700}
.sp-reel-error{position:absolute;inset:0;z-index:14;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:#090a0b;color:#fff;text-align:center}
.sp-reel-error[hidden]{display:none!important}
.sp-reel-error strong{font-size:15px}.sp-reel-error span{margin-top:4px;color:rgba(255,255,255,.68);font-size:10px}.sp-reel-error button{margin-top:12px;min-height:36px;padding:0 13px;border:0;border-radius:9px;background:#fff;color:#111827;font:800 10px/1 inherit;cursor:pointer}
.sp-reel-video:not([src]){visibility:hidden}
.sp-reel-slide.is-ready .sp-reel-video{visibility:visible}
@media(max-width:800px){.sp-story-upload-modal{align-items:flex-end!important}.sp-story-upload-card{width:100%!important;max-height:88dvh!important;border-radius:18px 18px 0 0!important}.sp-story-stage{width:min(430px,96vw)!important;height:min(760px,82dvh)!important}.sp-story-viewer-close{top:10px!important;right:10px!important}.sp-story-nav{width:40px!important;height:40px!important}.sp-story-prev{left:7px!important}.sp-story-next{right:7px!important}}

.sp-story-viewer{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.sp-story-stage{contain:layout paint;}






/* ==========================================================
   V2.9 — Performance mode
   ========================================================== */
:root{
  --sp-skel-speed:1.45s!important;
}

/* Keep motion polished but short. */
.sp-ui-ready .sp-post-card,
.sp-ui-ready .sp-composer,
.sp-ui-ready .sp-stories,
.sp-ui-ready .sp-widget,
.sp-ui-ready .sp-group-card,
.sp-ui-ready .sp-friend-result,
.sp-ui-ready .sp-settings-card,
.sp-ui-ready .sp-profile-card,
.sp-ui-ready .sp-profile-wide-card,
.sp-ui-ready .sp-profile-suggestion-card{
  animation-duration:.18s!important;
  animation-delay:0s!important;
}

/* Avoid expensive blur during standard page reveal. */
.sp-ui-ready .sp-shell,
.sp-ui-ready .sp-topbar,
.sp-ui-ready .sp-mobile-nav{
  animation-duration:.16s!important;
}

/* Feed videos should not consume bandwidth until the user plays them. */
.sp-video-shell video[preload="none"]{
  background:#000;
}

/* GPU-friendly Story overlays. */
.sp-story-viewer,
.sp-story-upload-modal{
  will-change:auto!important;
}
.sp-story-viewer .sp-modal-card,
.sp-story-upload-modal .sp-modal-card{
  transform:translateZ(0);
}

/* Lower-cost hover effects on touch devices. */
@media(hover:none){
  .sp-post-card:hover,
  .sp-dash-panel:hover,
  .sp-settings-card:hover{
    transform:none!important;
    box-shadow:inherit!important;
  }
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
  }
}



/* ==========================================================
   V2.9.1 — Reliable optional post/reel/photo titles
   ========================================================== */
.sp-post-title-input{
  width:100%;
  min-height:44px;
  padding:0 12px;
  margin:0 0 8px;
  border:1px solid #dfe4ea;
  border-radius:10px;
  background:#f8fafc;
  color:#172033;
  outline:0;
  font:700 14px/1.2 inherit;
  box-sizing:border-box;
}
.sp-post-title-input::placeholder{
  color:#98a2b3;
  font-weight:600;
}
.sp-post-title-input:focus{
  border-color:#8db5ff;
  background:#fff;
  box-shadow:0 0 0 4px rgba(8,102,255,.07);
}
.sp-post-public-title{
  margin:0;
  padding:3px 14px 7px;
  color:#172033;
  font-size:18px;
  font-weight:800;
  line-height:1.3;
  letter-spacing:-.012em;
  overflow-wrap:anywhere;
}
.single .sp-post-public-title{
  padding-top:5px;
  font-size:21px;
}
@media(max-width:800px){
  .sp-post-title-input{
    min-height:42px;
    font-size:13px;
  }
  .sp-post-public-title{
    padding-left:12px;
    padding-right:12px;
    font-size:16px;
  }
}
@media(max-width:520px){
  .sp-post-public-title{
    padding-left:10px;
    padding-right:10px;
    font-size:15.5px;
  }
}


/* ==========================================================
   V2.9.2 — Reliable lazy video playback
   ========================================================== */
.sp-video-shell.sp-video-idle .sp-media-el{
  opacity:1!important;
}
.sp-video-shell.sp-video-idle .sp-media-skeleton{
  opacity:0!important;
  visibility:hidden!important;
}
.sp-video-shell.sp-video-idle .sp-video-center,
.sp-video-shell.sp-video-starting .sp-video-center{
  opacity:1!important;
  transform:scale(1)!important;
  pointer-events:auto!important;
}
.sp-video-shell.sp-video-starting .sp-video-center-disc{
  color:transparent!important;
}
.sp-video-shell.sp-video-starting .sp-video-center-disc:after{
  content:"";
  position:absolute;
  width:22px;
  height:22px;
  border:2.5px solid rgba(255,255,255,.38);
  border-right-color:#fff;
  border-radius:50%;
  animation:spFollowSpin .75s linear infinite;
}



/* ==========================================================
   V3.2 — FULL UI POSITION / SIZE / RESPONSIVE REFINEMENT
   Media, Drive, post and Reels publishing logic unchanged.
   ========================================================== */
:root{
  --sp-blue:#0866ff;
  --sp-blue-deep:#0759df;
  --sp-bg:#f3f5f8;
  --sp-card:#fff;
  --sp-text:#172033;
  --sp-muted:#667085;
  --sp-line:#e4e8ee;
  --sp-hover:#f2f4f7;
  --sp-radius:14px;
  --sp-shadow:0 1px 2px rgba(16,24,40,.035),0 6px 20px rgba(16,24,40,.045);
  --sp-shadow-hover:0 3px 8px rgba(16,24,40,.05),0 14px 34px rgba(16,24,40,.07);
  --sp-topbar-h:60px;
  --sp-feed-w:728px;
}
html{background:var(--sp-bg);scrollbar-gutter:stable}
body{
  min-width:320px;
  background:var(--sp-bg);
  color:var(--sp-text);
  font-size:14px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
button,input,textarea,select{min-width:0}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid rgba(8,102,255,.22);
  outline-offset:2px;
}

/* Header */
.sp-topbar{
  height:60px!important;
  background:rgba(255,255,255,.98)!important;
  border-bottom:1px solid rgba(15,23,42,.06);
  box-shadow:0 1px 7px rgba(15,23,42,.07)!important;
}
.sp-topbar-inner{
  height:60px!important;
  max-width:1480px!important;
  grid-template-columns:250px minmax(320px,728px) minmax(280px,1fr)!important;
  gap:18px!important;
  padding:0 20px!important;
}
.sp-brand{gap:9px!important;min-width:0}
.sp-brand-text{
  max-width:185px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:17px!important;
}
.sp-search{
  height:42px!important;
  padding:0 14px!important;
  border:1px solid transparent;
  border-radius:22px!important;
  background:#f1f3f6!important;
}
.sp-search:focus-within{
  background:#fff!important;
  border-color:#b8d1ff;
  box-shadow:0 0 0 3px rgba(8,102,255,.07);
}
.sp-search input{font-size:14px!important}
.sp-nav-icons{gap:6px!important;align-items:center}
.sp-nav-icons>a{
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  border-radius:12px!important;
  background:#f0f2f5!important;
}
.sp-nav-icons>a:hover{background:#e8ebef!important}
.sp-nav-icons>a.active{color:var(--sp-blue)!important;background:#eaf2ff!important}
.sp-nav-icons .sp-login-pill{
  width:auto!important;
  min-width:82px!important;
  padding:0 16px!important;
  border-radius:10px!important;
  background:var(--sp-blue)!important;
  color:#fff!important;
}

/* Main desktop grid */
.sp-shell{
  width:100%;
  max-width:1480px!important;
  grid-template-columns:250px minmax(0,728px) 280px!important;
  justify-content:center!important;
  gap:24px!important;
  padding:18px 20px 92px!important;
}
.sp-sticky{top:78px!important}
.admin-bar .sp-sticky{top:110px!important}
.sp-side-user,.sp-side-link{
  min-height:44px;
  gap:10px!important;
  padding:5px 8px!important;
  border-radius:10px!important;
  color:#344054;
  font-size:14px!important;
  font-weight:700!important;
}
.sp-side-user .sp-avatar{width:38px!important;height:38px!important}
.sp-side-link:hover,.sp-side-user:hover,.sp-contact:hover{
  background:#e9edf2!important;
  transform:none!important;
}
.sp-side-link.active{color:var(--sp-blue)!important;background:#eaf2ff}
.sp-side-icon{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px;
  border-radius:10px!important;
}
.sp-side-icon .sp-icon{width:19px!important;height:19px!important}
.sp-side-card{
  margin-top:18px!important;
  padding:15px 9px!important;
  color:#7a8492!important;
  font-size:12px!important;
}
.sp-side-card strong{color:#475467;font-size:13px}
.sp-widget{padding-top:12px!important}
.sp-widget-title{font-size:14px!important;font-weight:800!important}
.sp-contact{min-height:42px;padding:5px 7px!important;font-size:13px!important}

/* Feed / composer / posts */
.sp-feed{width:100%;max-width:728px;margin:0 auto}
.sp-composer,.sp-post-card,.sp-comments-card,.sp-empty,.sp-stories{
  border:1px solid rgba(15,23,42,.07)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:var(--sp-shadow)!important;
}
.sp-composer,.sp-post-card,.sp-stories{margin-bottom:12px!important}
.sp-composer{padding:12px 14px!important}
.sp-composer-top .sp-avatar{width:40px!important;height:40px!important}
.sp-composer-trigger{
  height:44px!important;
  border-radius:22px!important;
  background:#f1f3f6!important;
  font-size:14px!important;
}
.sp-composer-actions{margin-top:11px!important;padding-top:7px!important}
.sp-composer-actions button{
  min-height:40px;
  padding:7px!important;
  border-radius:9px!important;
  font-size:13px!important;
}
.sp-composer-actions .sp-icon{width:19px!important;height:19px!important}
.sp-post-card:hover{box-shadow:var(--sp-shadow-hover)!important}
.sp-post-head{min-height:60px;gap:10px!important;padding:11px 14px 7px!important}
.sp-post-head>.sp-avatar,.sp-post-head>a>.sp-avatar{width:40px!important;height:40px!important}
.sp-author{font-size:14px!important;font-weight:800!important}
.sp-post-meta span{font-size:11.5px!important}
.sp-more{width:38px;height:38px;padding:0!important;display:grid;place-items:center}
.sp-post-public-title{padding:4px 14px 5px!important;font-size:17px!important}
.sp-post-text{padding:4px 14px 12px!important;font-size:14.5px!important;line-height:1.48!important}
.sp-media-grid{max-height:760px!important;gap:2px!important;background:#111!important}
.sp-media-item{min-height:230px!important}
.sp-count-1 .sp-media-item{min-height:360px!important}
.sp-social-stats{
  min-height:40px;
  padding:7px 14px!important;
  border-bottom-color:#edf0f3!important;
  font-size:12px!important;
}
.sp-actions{min-height:48px;padding:4px 7px!important;gap:3px}
.sp-actions button,.sp-actions a{
  min-height:40px;
  padding:6px!important;
  border-radius:9px!important;
  font-size:13px!important;
}
.sp-actions .sp-icon{width:19px!important;height:19px!important}

/* Stories */
.sp-stories-title{min-height:54px!important;padding:10px 13px 8px!important}
.sp-stories-heading strong{font-size:16px!important}
.sp-stories-heading span{font-size:11px!important}
.sp-stories-scroll{grid-auto-columns:116px!important;gap:9px!important;padding:0 12px 12px!important}
.sp-story-card{width:116px!important;min-width:116px!important;height:194px!important;border-radius:13px!important}
.sp-story-user-avatar .sp-avatar{width:36px!important;height:36px!important}
.sp-story-name{font-size:11.5px!important}
.sp-story-create-copy strong{font-size:11.5px!important}
.sp-story-create-copy small{font-size:10px!important}
.sp-stories-scroll-btn{width:34px!important;height:34px!important}

/* Composer modal */
.sp-modal{padding:18px!important}
.sp-modal-card{
  width:min(560px,100%)!important;
  max-height:min(90dvh,780px);
  overflow:auto!important;
  border-radius:16px!important;
}
.sp-modal-head{height:58px!important;min-height:58px!important;padding:0 58px}
.sp-modal-head h3{font-size:18px!important}
.sp-modal-close{right:12px!important;width:38px!important;height:38px!important}
.sp-modal-body{padding:14px 16px 16px!important}
.sp-modal textarea{min-height:116px!important;font-size:18px!important}
.sp-post-title-input{min-height:44px!important;font-size:13px!important}
.sp-submit{height:42px!important;min-height:42px!important;border-radius:9px!important}

/* Comments modal */
.sp-comments-modal{padding:16px!important}
.sp-comments-dialog{
  width:min(1120px,calc(100vw - 32px))!important;
  height:min(840px,calc(100dvh - 32px))!important;
  margin:auto!important;
  border-radius:16px!important;
}
.sp-comments-dialog-head{height:58px!important;grid-template-columns:44px 1fr 44px!important;padding:0 12px!important}
.sp-comments-dialog-head h3{font-size:18px!important}
.sp-comments-dialog-close{width:38px!important;height:38px!important}
.sp-dialog-layout{grid-template-columns:minmax(0,1.22fr) minmax(360px,.78fr)!important}
.sp-dialog-post-head{padding:12px 14px 9px!important}
.sp-dialog-post-text{padding:12px 14px 3px!important;font-size:14px!important}
.sp-dialog-statline{padding:9px 14px!important;font-size:12px}
.sp-dialog-comments-scroll{padding:0 14px 12px!important}
.sp-dialog-comment-text{font-size:13px!important}
.sp-dialog-comment-meta{font-size:11px!important}
.sp-dialog-form-shell{padding:10px 14px 12px!important}
.sp-dialog-comment-input-wrap textarea{min-height:42px!important;font-size:13px!important}

/* Generic app pages */
.sp-app-page{width:min(1120px,calc(100% - 32px))!important;padding:10px 0 88px!important}
.sp-app-page-head{min-height:66px;margin:2px 0 14px!important;padding:0 2px}
.sp-app-page-head h1{font-size:26px!important;letter-spacing:-.025em}
.sp-app-page-head p{font-size:13px!important}
.sp-app-primary,.sp-app-secondary{min-height:40px!important;padding:0 14px!important;border-radius:9px!important;font-size:13px!important}

/* Friends */
.sp-friend-search{padding:10px!important;border-radius:13px!important;box-shadow:var(--sp-shadow)!important}
.sp-friend-search input{height:42px!important;font-size:13px}
.sp-friend-search button{min-height:42px!important;font-size:13px}
.sp-friend-tabs{margin:10px 0!important;padding:5px!important;border-radius:12px!important}
.sp-friend-tabs a{min-height:38px;padding:8px 12px!important;display:flex;align-items:center;font-size:13px!important}
.sp-friend-result{min-height:82px;padding:12px!important;border-radius:13px!important;box-shadow:var(--sp-shadow)!important}
.sp-friend-result-user>.sp-avatar,.sp-friend-result-user>a>.sp-avatar{width:52px!important;height:52px!important}

/* Auth */
.sp-auth-page{
  min-height:calc(100dvh - 110px)!important;
  max-width:1020px!important;
  padding:54px 24px 70px!important;
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:64px!important;
}
.sp-auth-intro{padding-bottom:28px!important}
.sp-auth-logo{font-size:48px!important}
.sp-auth-intro p{font-size:24px!important;line-height:1.2!important}
.sp-auth-panel{padding:18px!important;border-radius:14px!important;box-shadow:0 8px 30px rgba(15,23,42,.10)!important}
.sp-auth-form input{height:50px!important;border-radius:9px!important;background:#fff!important;font-size:15px!important}
.sp-auth-login-btn{height:46px!important;border-radius:9px!important;font-size:17px!important}
.sp-auth-create-btn{min-height:43px!important;border-radius:9px!important;font-size:14px!important}

/* Settings */
.sp-settings-grid{grid-template-columns:240px minmax(0,1fr)!important;gap:14px!important}
.sp-settings-nav{top:78px!important;padding:7px!important;border-radius:13px!important;box-shadow:var(--sp-shadow)!important}
.sp-settings-nav a{min-height:42px;padding:7px 9px!important;border-radius:9px!important;font-size:13px!important}
.sp-settings-card{padding:18px!important;border-radius:14px!important;box-shadow:var(--sp-shadow)!important}
.sp-settings-card h2{font-size:18px!important}
.sp-settings-form>label,.sp-form-two>label{font-size:12.5px!important}

/* Groups */
body.sp-group-route .sp-shell{max-width:none!important;padding:0!important}
.sp-group-page{width:min(1240px,calc(100% - 32px))!important;padding:18px 0 92px!important}
.sp-groups-directory{max-width:1160px!important}
.sp-groups-hero{min-height:82px;margin-bottom:14px!important;align-items:center!important}
.sp-groups-hero h1{font-size:28px!important}
.sp-groups-hero p{font-size:13px!important}
.sp-group-toolbar{min-height:58px;padding:8px 10px!important;border-radius:13px!important}
.sp-group-tabs a{min-height:38px;padding:8px 10px!important;font-size:13px!important}
.sp-group-grid{gap:14px!important}
.sp-group-card{border-radius:14px!important;box-shadow:var(--sp-shadow)!important}
.sp-group-card-cover{height:148px!important}
.sp-group-card-title{font-size:16px!important}
.sp-group-create-shell{grid-template-columns:380px minmax(0,1fr)!important;gap:18px!important}
.sp-group-profile{max-width:1040px!important;border-radius:14px!important}
.sp-group-cover{height:300px!important}
.sp-group-profile-info{padding:16px 20px 12px!important}
.sp-group-profile-info h1{font-size:27px!important}
.sp-group-profile-tabs a{min-height:40px;padding:9px 12px!important;font-size:13px}
.sp-group-content-grid{max-width:1040px!important;grid-template-columns:minmax(0,680px) minmax(280px,344px)!important;gap:16px!important}
.sp-group-sidebar{top:78px!important}

/* Profile */
body.sp-profile-route .sp-shell{padding:0 0 92px!important}
.sp-profile-cover{width:min(1180px,calc(100% - 32px))!important;height:390px!important;border-radius:0 0 16px 16px!important}
.sp-profile-identity{
  width:min(1120px,calc(100% - 40px))!important;
  min-height:166px!important;
  grid-template-columns:164px minmax(0,1fr) auto!important;
  gap:18px!important;
  padding:0 8px 18px!important;
}
.sp-profile-avatar-wrap{width:156px!important;height:156px!important;margin-top:-56px!important}
.sp-profile-avatar-wrap>.sp-avatar{width:156px!important;height:156px!important}
.sp-profile-name-block h1{font-size:31px!important}
.sp-profile-name-block>p,.sp-profile-stats{font-size:13px!important}
.sp-profile-actions .sp-friend-btn,.sp-profile-primary,.sp-profile-secondary{min-height:38px!important;padding:0 12px!important;font-size:12.5px!important}
.sp-profile-tabs{width:min(1120px,calc(100% - 40px))!important;min-height:54px!important}
.sp-profile-tabs a{min-height:53px!important;padding:0 14px!important;font-size:13px!important}
.sp-profile-main-grid,.sp-profile-wide-card,.sp-profile-suggestions{width:min(1080px,calc(100% - 40px))!important}
.sp-profile-main-grid{grid-template-columns:minmax(300px,372px) minmax(0,680px)!important;gap:16px!important;margin-top:14px!important}
.sp-profile-left-column{top:78px!important;gap:12px!important}
.sp-profile-card,.sp-profile-wide-card,.sp-profile-suggestions{border-radius:14px!important;box-shadow:var(--sp-shadow)!important}
.sp-profile-card{padding:15px!important}
.sp-profile-card h2,.sp-profile-card-head h2{font-size:18px!important}
.sp-profile-suggestion-card>small{font-size:11px!important}

/* Stories modal / ads */
.sp-story-stage{width:min(430px,calc(100vw - 110px))!important;height:min(760px,calc(100dvh - 36px))!important;border-radius:16px!important}
.sp-story-upload-card{width:min(540px,calc(100vw - 32px))!important}
.sp-feed-banner-ad{width:100%!important;max-width:728px!important;margin-left:auto!important;margin-right:auto!important}
.sp-feed-banner-ad-label{top:5px!important;left:6px!important;font-size:9px!important}
.sp-feed-banner-ad-inner{width:min(728px,100%)!important;aspect-ratio:728/90!important}

/* Tablet header fix: always keep all 3 header children in one row */
@media(max-width:1280px) and (min-width:981px){
  .sp-topbar-inner{grid-template-columns:200px minmax(300px,1fr) auto!important;max-width:1180px!important}
  .sp-brand-text{max-width:140px;font-size:16px!important}
  .sp-shell{max-width:1020px!important;grid-template-columns:240px minmax(0,728px)!important;gap:20px!important}
  .sp-right{display:none!important}
  .sp-profile-cover{height:350px!important}
}
@media(max-width:980px) and (min-width:801px){
  .sp-topbar-inner{grid-template-columns:48px minmax(220px,1fr) auto!important;gap:10px!important;padding:0 14px!important}
  .sp-brand-text{display:none!important}
  .sp-nav-icons{gap:4px!important}
  .sp-nav-icons>a{width:38px!important;min-width:38px!important;height:38px!important}
  .sp-nav-icons>a:nth-last-child(-n+2){display:none!important}
  .sp-shell{display:block!important;max-width:760px!important;padding:14px 16px 84px!important}
  .sp-left,.sp-right{display:none!important}
  .sp-feed{max-width:728px!important}
  .sp-group-create-shell{grid-template-columns:330px minmax(0,1fr)!important}
  .sp-group-content-grid{grid-template-columns:minmax(0,1fr) 300px!important}
  .sp-profile-main-grid{grid-template-columns:300px minmax(0,1fr)!important}
}

/* Mobile */
@media(max-width:800px){
  .sp-topbar{height:56px!important}
  .sp-topbar-inner{height:56px!important;grid-template-columns:40px minmax(0,1fr) auto!important;gap:7px!important;padding:0 9px!important}
  .sp-brand-mark{width:36px!important;height:36px!important}
  .sp-brand-mark .sp-icon{width:36px!important;height:36px!important}
  .sp-brand-text{display:none!important}
  .sp-search{height:38px!important;padding:0 11px!important}
  .sp-search input{font-size:13px!important}
  body.logged-in .sp-nav-icons{display:none!important}
  body:not(.logged-in) .sp-nav-icons{display:flex!important}
  .sp-nav-icons .sp-login-pill{min-width:70px!important;height:36px!important;padding:0 12px!important;font-size:12px!important}

  .sp-shell{display:block!important;max-width:100%!important;padding:10px 8px calc(76px + env(safe-area-inset-bottom))!important}
  .sp-left,.sp-right{display:none!important}
  .sp-feed{max-width:728px!important;margin:0 auto!important}

  /* 4 logged-in nav items require 4 real columns. */
  .sp-mobile-nav{
    height:calc(60px + env(safe-area-inset-bottom))!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 -4px 18px rgba(15,23,42,.06);
  }
  body.logged-in .sp-mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .sp-mobile-nav a{gap:2px;font-size:18px!important}
  .sp-mobile-nav .sp-icon{width:21px!important;height:21px!important}
  .sp-mobile-nav small{font-size:10px!important;font-weight:650}

  .sp-composer,.sp-post-card,.sp-stories,.sp-comments-card,.sp-empty{border-radius:12px!important}
  .sp-composer{padding:11px!important}
  .sp-post-head{padding:10px 11px 6px!important}
  .sp-post-public-title{padding:4px 11px 5px!important;font-size:16px!important}
  .sp-post-text{padding:3px 11px 10px!important;font-size:14px!important}
  .sp-social-stats{padding:6px 11px!important}
  .sp-actions{min-height:46px!important}
  .sp-actions button,.sp-actions a{min-height:38px!important;font-size:12px!important}
  .sp-media-item{min-height:190px!important}
  .sp-count-1 .sp-media-item{min-height:280px!important}

  .sp-stories-scroll{grid-auto-columns:104px!important;gap:8px!important;padding:0 10px 10px!important}
  .sp-story-card{width:104px!important;min-width:104px!important;height:174px!important}
  .sp-stories-scroll-btn{display:none!important}

  .sp-modal{padding:0!important;align-items:flex-end!important}
  .sp-modal-card{width:100%!important;max-height:90dvh!important;border-radius:18px 18px 0 0!important}
  .sp-modal textarea{font-size:16px!important}

  .sp-comments-modal{padding:0!important;align-items:flex-end!important}
  .sp-comments-dialog{width:100%!important;height:min(91dvh,820px)!important;max-height:91dvh!important;margin:0!important;border-radius:18px 18px 0 0!important}
  .sp-dialog-layout{display:block!important;height:calc(100% - 54px)!important}
  .sp-dialog-media-pane{display:none!important}
  .sp-dialog-side-pane{width:100%!important;height:100%!important}
  .sp-dialog-comments-scroll{padding-bottom:92px!important}

  .sp-app-page{width:100%!important;padding:4px 4px calc(76px + env(safe-area-inset-bottom))!important}
  .sp-app-page-head{min-height:auto;margin:4px 4px 10px!important;padding:10px 5px!important}
  .sp-app-page-head h1{font-size:22px!important}
  .sp-friends-results{grid-template-columns:1fr!important}
  .sp-friend-tabs{overflow-x:auto;scrollbar-width:none}
  .sp-friend-tabs a{white-space:nowrap}

  .sp-settings-grid{grid-template-columns:1fr!important}
  .sp-settings-nav{position:sticky!important;top:60px!important;z-index:30;display:flex!important;overflow-x:auto!important;scrollbar-width:none}
  .sp-settings-nav a{flex:0 0 auto;white-space:nowrap}
  .sp-settings-card{padding:15px!important;border-radius:12px!important}

  body.sp-group-route .sp-shell{padding:0!important}
  .sp-group-page{width:100%!important;padding:10px 8px calc(76px + env(safe-area-inset-bottom))!important}
  .sp-groups-hero{min-height:auto;align-items:flex-start!important;flex-direction:column;gap:11px!important}
  .sp-groups-hero h1{font-size:24px!important}
  .sp-group-toolbar{align-items:stretch!important;flex-direction:column;gap:8px!important}
  .sp-group-search{min-width:0!important;max-width:none!important;width:100%!important}
  .sp-group-tabs{overflow-x:auto;scrollbar-width:none}
  .sp-group-tabs a{white-space:nowrap}
  .sp-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .sp-group-card-cover{height:124px!important}
  .sp-group-create-shell{grid-template-columns:1fr!important}
  .sp-group-create-preview-wrap{display:none!important}
  .sp-group-cover{height:220px!important}
  .sp-group-profile-info{align-items:flex-start!important;flex-direction:column;padding:13px!important}
  .sp-group-profile-tabs{overflow-x:auto;white-space:nowrap;scrollbar-width:none}
  .sp-group-content-grid{display:block!important}
  .sp-group-sidebar{position:static!important;margin-top:10px}

  body.sp-profile-route .sp-shell{padding:0 0 calc(76px + env(safe-area-inset-bottom))!important}
  .sp-profile-cover{width:100%!important;height:230px!important;border-radius:0!important}
  .sp-profile-identity{width:100%!important;min-height:auto!important;grid-template-columns:1fr!important;justify-items:center;gap:7px!important;padding:0 12px 14px!important;text-align:center}
  .sp-profile-avatar-wrap{width:126px!important;height:126px!important;margin-top:-48px!important}
  .sp-profile-avatar-wrap>.sp-avatar{width:126px!important;height:126px!important}
  .sp-profile-name-block h1{font-size:25px!important}
  .sp-profile-actions{grid-column:auto!important;width:100%!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  .sp-profile-actions>*{width:100%!important;min-width:0!important}
  .sp-profile-actions .sp-friend-controls{display:contents!important}
  .sp-profile-tabs{width:100%!important;min-height:50px!important;padding:0 5px!important;overflow-x:auto}
  .sp-profile-tabs a{min-height:49px!important;padding:0 12px!important;font-size:12px!important;white-space:nowrap}
  .sp-profile-main-grid,.sp-profile-wide-card,.sp-profile-suggestions{width:100%!important}
  .sp-profile-main-grid{display:flex!important;flex-direction:column;gap:9px!important;margin-top:9px!important}
  .sp-profile-left-column{position:static!important;width:100%!important}
  .sp-profile-card,.sp-profile-wide-card,.sp-profile-suggestions{border-left:0!important;border-right:0!important;border-radius:0!important}

  .sp-story-stage{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;border-radius:0!important}
  .sp-story-upload-card{width:100%!important;max-height:90dvh!important;border-radius:18px 18px 0 0!important}

  .sp-auth-page{min-height:auto!important;display:block!important;padding:30px 14px 82px!important}
  .sp-auth-intro{padding:0 0 20px!important;text-align:center}
  .sp-auth-logo{font-size:38px!important}
  .sp-auth-intro p{display:none!important}
  .sp-auth-panel{max-width:430px;margin:0 auto;padding:16px!important;border-radius:13px!important;background:#fff!important;box-shadow:var(--sp-shadow)!important}
  .sp-auth-form input{height:48px!important;background:#fff!important}
  .sp-auth-create-btn{border-radius:9px!important}
}
@media(max-width:560px){
  .sp-shell{padding-left:0!important;padding-right:0!important}
  .sp-composer,.sp-post-card,.sp-stories,.sp-comments-card,.sp-empty{border-left:0!important;border-right:0!important;border-radius:0!important}
  .sp-story-card{width:96px!important;min-width:96px!important;height:162px!important}
  .sp-friend-result{align-items:flex-start!important;flex-direction:column!important}
  .sp-friend-result .sp-friend-controls{width:100%!important}
  .sp-group-grid{grid-template-columns:1fr!important}
  .sp-group-card-cover{height:150px!important}
  .sp-profile-friends-grid{grid-template-columns:1fr!important}
  .sp-profile-photos-grid{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:380px){
  .sp-profile-actions{grid-template-columns:1fr!important}
}
@media(pointer:coarse){
  .sp-side-link,.sp-settings-nav a,.sp-group-tabs a,.sp-profile-tabs a,.sp-friend-tabs a{min-height:42px}
}



/* ==========================================================
   V3.3 — Video Thumbnail + viewport autoplay UI
   ========================================================== */
.sp-thumbnail-tools{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
}
.sp-thumbnail-button{
  min-height:40px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid #dbe2ea;
  border-radius:9px;
  background:#fff;
  color:#344054;
  font-weight:750;
  cursor:pointer;
}
.sp-thumbnail-button:hover{background:#f6f8fb;border-color:#cdd6e0}
.sp-thumbnail-button .sp-icon{width:18px;height:18px;color:#0866ff}
.sp-thumbnail-current{
  min-width:0;
  flex:1;
  display:grid;
  grid-template-columns:54px minmax(0,1fr) 34px;
  align-items:center;
  gap:9px;
  padding:5px 6px;
  border:1px solid #dfe5ec;
  border-radius:10px;
  background:#f8fafc;
}
.sp-thumbnail-current[hidden]{display:none!important}
.sp-thumbnail-current img{
  width:54px;
  height:40px;
  display:block;
  object-fit:cover;
  border-radius:7px;
  background:#111;
}
.sp-thumbnail-current strong,
.sp-thumbnail-current small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sp-thumbnail-current strong{font-size:12px;color:#253044}
.sp-thumbnail-current small{margin-top:2px;font-size:10.5px;color:#7a8492}
.sp-thumbnail-current>button,
.sp-thumbnail-panel-head>button{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:#e9edf2;
  color:#4b5563;
  cursor:pointer;
}
.sp-thumbnail-current>button .sp-icon,
.sp-thumbnail-panel-head>button .sp-icon{width:16px;height:16px}
.sp-thumbnail-panel{
  margin-top:10px;
  padding:12px;
  border:1px solid #dce3ea;
  border-radius:12px;
  background:#f8fafc;
}
.sp-thumbnail-panel[hidden]{display:none!important}
.sp-thumbnail-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.sp-thumbnail-panel-head strong{display:block;font-size:13px;color:#1f2937}
.sp-thumbnail-panel-head small{display:block;margin-top:2px;font-size:10.5px;color:#778190}
.sp-thumbnail-actions{
  margin-bottom:10px;
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
}
.sp-thumbnail-actions>button,
.sp-thumbnail-scene-button{
  min-height:38px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  border-radius:8px;
  background:#0866ff;
  color:#fff;
  font-size:11.5px;
  font-weight:750;
  cursor:pointer;
}
.sp-thumbnail-actions>button .sp-icon,
.sp-thumbnail-scene-button .sp-icon{width:17px;height:17px}
.sp-thumbnail-actions>span{font-size:10.5px;color:#7a8492}
.sp-thumbnail-scene{
  padding:9px;
  border:1px solid #e0e5eb;
  border-radius:10px;
  background:#fff;
}
.sp-thumbnail-scene video{
  width:100%;
  max-height:280px;
  display:block;
  object-fit:contain;
  border-radius:8px;
  background:#0b0d11;
}
.sp-thumbnail-scrub{
  margin:9px 0;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:8px;
  align-items:center;
}
.sp-thumbnail-scrub>span{
  font-size:10.5px;
  color:#5e6877;
  font-variant-numeric:tabular-nums;
}
.sp-thumbnail-scrub input{width:100%;accent-color:#0866ff}
.sp-thumbnail-scene-button{width:100%}
.sp-video-shell.sp-autoplaying .sp-video-center{opacity:0!important;pointer-events:none}
.sp-video-shell.sp-autoplaying .sp-video-controls{opacity:1}

@media(max-width:800px){
  .sp-thumbnail-tools{align-items:stretch;flex-direction:column}
  .sp-thumbnail-button{width:100%}
  .sp-thumbnail-current{width:100%}
  .sp-thumbnail-panel{padding:10px}
  .sp-thumbnail-scene video{max-height:240px}
}


/* ===== V3.4.0 UI refresh: profile tabs + auth + mobile responsiveness ===== */
.sp-profile-tabs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.06);border:1px solid rgba(15,23,42,.06)}
.sp-profile-tabs a{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 16px;border-radius:14px;font-weight:700;color:#475467;background:transparent;transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}
.sp-profile-tabs a span{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#eef4ff;color:#175cd3;font-size:11px;font-weight:800;line-height:1}
.sp-profile-tabs a:hover{background:#f5f7fb;color:#101828;transform:translateY(-1px)}
.sp-profile-tabs a.active{background:linear-gradient(180deg,#eef4ff 0%,#dbeafe 100%);color:#175cd3;box-shadow:inset 0 0 0 1px rgba(23,92,211,.12)}
.sp-profile-tabs a.active:after{display:none}
.sp-profile-person-card{gap:14px;align-items:center}
.sp-profile-person-card>div{min-width:0;display:flex;flex-direction:column;gap:4px}
.sp-profile-person-card small{display:block;color:#667085;line-height:1.4}
.sp-profile-person-card .sp-friend-controls,.sp-profile-person-card .sp-follow-wrap{width:100%}
.sp-profile-people-grid .sp-follow-wrap{margin-top:10px}
.sp-profile-tab-empty p{margin:4px 0 0;color:#667085}
.sp-profile-wide-card .sp-profile-section-head strong{font-size:20px}
.sp-profile-friends-grid.sp-profile-people-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sp-profile-friend-card{padding:16px;border:1px solid #eef2f6;border-radius:16px;background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);box-shadow:0 8px 24px rgba(16,24,40,.05)}
.sp-profile-friend-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(16,24,40,.08)}
.sp-profile-friend-card a strong{color:#101828}
.sp-auth-page{max-width:1180px!important;grid-template-columns:minmax(0,1.1fr) minmax(350px,430px)!important;gap:68px!important;padding:70px 26px 54px!important}
.sp-auth-intro{padding-bottom:0!important}
.sp-auth-logo{font-size:58px!important;font-weight:900!important;letter-spacing:-2px!important}
.sp-auth-intro p{max-width:560px!important;font-size:28px!important;line-height:1.16!important;color:#101828}
.sp-auth-feature-list{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.sp-auth-feature-list span{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;border-radius:999px;background:#fff;border:1px solid #e7eef9;box-shadow:0 8px 24px rgba(15,23,42,.05);font-size:14px;font-weight:700;color:#344054}
.sp-auth-feature-list svg{width:18px;height:18px;color:#1877f2}
.sp-auth-panel-wrap{display:flex;justify-content:center}
.sp-auth-panel{width:100%;padding:18px 18px 22px!important;border-radius:20px!important;box-shadow:0 20px 60px rgba(16,24,40,.12)!important;border:1px solid rgba(16,24,40,.06)}
.sp-auth-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 16px}
.sp-auth-switch a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 12px;border-radius:12px;background:#f5f7fb;border:1px solid #e6ebf2;color:#475467;font-weight:700;transition:all .18s ease}
.sp-auth-switch a:hover{background:#edf3ff;color:#175cd3}
.sp-auth-switch a.active{background:linear-gradient(180deg,#eef4ff 0%,#dbeafe 100%);border-color:#c8ddff;color:#175cd3;box-shadow:0 10px 20px rgba(24,119,242,.12)}
.sp-auth-form{gap:12px!important}
.sp-auth-form input{height:54px!important;border-radius:12px!important;padding:0 16px!important;font-size:15px!important;border:1px solid #d7deea!important;background:#fff!important;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.sp-auth-form input:hover{border-color:#c4d0e1}
.sp-auth-form input:focus{transform:translateY(-1px);box-shadow:0 0 0 4px rgba(24,119,242,.12)!important}
.sp-auth-login-btn,.sp-auth-create-btn.is-submit{width:100%;min-height:50px!important;border-radius:12px!important;box-shadow:0 14px 28px rgba(24,119,242,.18)}
.sp-auth-create-btn{border-radius:12px!important}
.sp-auth-hint{margin:2px 2px 0;color:#667085;font-size:12px;line-height:1.45;text-align:left}
.sp-auth-title{border-bottom:0!important;padding:4px 2px 4px!important;margin-bottom:10px!important}
.sp-auth-title h1{font-size:28px!important;letter-spacing:-.02em}
.sp-auth-title p{font-size:14px!important;color:#667085!important}
.sp-auth-forgot,.sp-auth-secondary-link{font-weight:600}
.sp-auth-divider{margin:8px 0 12px!important}
.sp-auth-footer{padding-top:10px!important}
.sp-auth-footer nav{flex-wrap:wrap;gap:18px!important}

@media (max-width:1100px){
  .sp-topbar-inner{grid-template-columns:240px minmax(220px,1fr) auto!important;gap:12px!important;padding:0 12px!important}
  .sp-shell{grid-template-columns:250px minmax(0,1fr) 280px!important;gap:14px!important;padding:14px 12px 90px!important}
  .sp-profile-main-grid,.sp-profile-wide-card,.sp-profile-suggestions{width:min(1080px,calc(100% - 24px))!important}
  .sp-profile-tabs{width:min(1120px,calc(100% - 24px))!important}
  .sp-profile-friends-grid.sp-profile-people-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:860px){
  .sp-auth-page{display:block!important;padding:40px 18px 28px!important}
  .sp-auth-intro{text-align:center!important;margin:0 auto 28px!important;max-width:640px!important}
  .sp-auth-logo{font-size:46px!important}
  .sp-auth-intro p{font-size:22px!important;margin-top:14px!important}
  .sp-auth-feature-list{justify-content:center}
  .sp-auth-panel{max-width:460px;margin:0 auto}
  .sp-topbar{height:auto!important}
  .sp-topbar-inner{height:auto!important;grid-template-columns:1fr auto!important;grid-template-areas:"brand icons" "search search"!important;padding:10px 12px!important}
  .sp-brand{grid-area:brand}
  .sp-search{grid-area:search;height:42px!important}
  .sp-nav-icons{grid-area:icons;gap:6px!important}
  .sp-nav-icons>a{min-width:38px!important;height:38px!important}
  .sp-shell{grid-template-columns:1fr!important;padding:12px 10px 92px!important}
  .sp-left,.sp-right{display:none!important}
  .sp-feed{max-width:720px;margin:0 auto}
  .sp-profile-hero{border-radius:22px 22px 18px 18px!important;overflow:hidden}
  .sp-profile-cover{height:240px!important}
  .sp-profile-identity{grid-template-columns:1fr!important;gap:14px!important;padding:0 18px 18px!important}
  .sp-profile-avatar-wrap{margin-top:-56px!important}
  .sp-profile-name-block,.sp-profile-actions{width:100%}
  .sp-profile-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important}
  .sp-profile-actions>*{width:100%!important;justify-content:center!important}
  .sp-profile-main-grid,.sp-profile-wide-card,.sp-profile-suggestions,.sp-profile-tabs{width:100%!important}
  .sp-profile-tabs{margin-top:10px!important;padding:8px!important;gap:8px!important;overflow-x:auto!important;flex-wrap:nowrap!important}
  .sp-profile-tabs a{flex:0 0 auto;min-height:46px!important;padding:0 14px!important;font-size:13px!important}
  .sp-profile-friends-grid.sp-profile-people-grid{grid-template-columns:1fr!important}
  .sp-profile-videos-grid{grid-template-columns:1fr!important}
}

@media (max-width:560px){
  .sp-auth-page{padding:26px 14px 22px!important}
  .sp-auth-logo{font-size:40px!important;letter-spacing:-1.3px!important}
  .sp-auth-intro p{font-size:18px!important;line-height:1.3!important}
  .sp-auth-feature-list{gap:8px!important}
  .sp-auth-feature-list span{font-size:12px;padding:9px 11px}
  .sp-auth-panel{padding:14px 14px 18px!important;border-radius:18px!important}
  .sp-auth-switch{gap:6px!important}
  .sp-auth-switch a{min-height:41px!important;font-size:13px!important;padding:0 8px!important}
  .sp-auth-form input{height:50px!important;font-size:14px!important}
  .sp-auth-login-btn,.sp-auth-create-btn.is-submit{min-height:48px!important;font-size:16px!important}
  .sp-auth-footer{padding:12px 18px 54px!important}
  .sp-auth-footer nav{gap:12px!important;font-size:12px!important}
  .sp-profile-cover{height:190px!important}
  .sp-profile-name-block h1{font-size:28px!important}
  .sp-profile-stats{display:flex;flex-wrap:wrap;gap:8px 10px!important}
  .sp-profile-stats span{display:none}
  .sp-profile-card,.sp-profile-wide-card,.sp-profile-suggestions{border-radius:16px!important;border:1px solid #ebeff5!important}
  .sp-post-card,.sp-composer,.sp-comments-card,.sp-empty{border-radius:16px!important}
  .sp-profile-actions{grid-template-columns:1fr!important}
  .sp-profile-tabs a{min-height:44px!important;padding:0 12px!important}
  .sp-profile-tabs a span{min-width:22px;height:22px;font-size:10px}
  .sp-topbar-inner{padding:10px 10px 12px!important}
  .sp-brand-mark{width:36px!important;height:36px!important}
  .sp-brand-text{font-size:17px!important}
  .sp-nav-icons{gap:5px!important}
  .sp-nav-icons>a{min-width:36px!important;height:36px!important}
  .sp-shell{padding:10px 8px 92px!important}
}


/* ===== V3.5 reference-style authentication ===== */
.sp-auth-body{min-height:100dvh;background:#f1f3f6!important;color:#172033}
.sp-auth-reference-page{min-height:calc(100dvh - 110px)!important;max-width:1180px!important;margin:0 auto!important;padding:72px 28px 36px!important;display:grid!important;grid-template-columns:minmax(0,620px) minmax(360px,430px)!important;gap:78px!important;align-items:center!important}
.sp-auth-reference-visual{position:relative!important;min-height:620px;padding:0!important;display:block!important}
.sp-auth-photo-card{position:absolute;width:410px;height:248px;background-size:cover;background-repeat:no-repeat;border-radius:0 44px 0 0;box-shadow:0 20px 48px rgba(15,23,42,.10);overflow:hidden}
.sp-auth-photo-top{left:92px;top:15px;transform:rotate(1.6deg);background-position:50% 38%}
.sp-auth-photo-bottom{left:55px;top:330px;width:420px;height:300px;transform:rotate(-1.5deg);border-radius:0 0 0 44px;background-position:54% 52%}
.sp-auth-reference-visual h1{position:absolute;z-index:3;left:0;right:0;top:255px;margin:0;text-align:center;color:#1877f2;font-size:48px!important;line-height:1.04!important;font-weight:900;letter-spacing:-1.8px;text-shadow:0 0 0 #fff;background:linear-gradient(90deg,transparent 0%,rgba(241,243,246,.97) 12%,rgba(241,243,246,.97) 88%,transparent 100%);padding:15px 4px}
.sp-auth-site-name{position:absolute;left:50%;bottom:-28px;transform:translateX(-50%);font-size:13px;font-weight:800;color:#667085;letter-spacing:.04em;text-transform:uppercase}
.sp-auth-panel-wrap{display:flex!important;align-items:center;justify-content:center}
.sp-auth-panel{width:100%!important;padding:18px 18px 22px!important;border-radius:20px!important;background:#fff!important;border:1px solid rgba(15,23,42,.06)!important;box-shadow:0 24px 70px rgba(15,23,42,.13)!important}
.sp-auth-switch{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important;margin:0 0 16px!important}
.sp-auth-switch a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 10px;border-radius:12px;background:#f5f7fb;border:1px solid #e2e8f0;color:#344054;font-size:13px;font-weight:800;transition:.18s ease}
.sp-auth-switch a.active{background:#e4efff;border-color:#b8d4ff;color:#0866ff;box-shadow:0 9px 18px rgba(8,102,255,.10)}
.sp-auth-form{gap:12px!important}.sp-auth-form input{height:54px!important;border:1px solid #d3dce9!important;border-radius:12px!important;background:#fff!important;padding:0 16px!important;font-size:14px!important}.sp-auth-form input:focus{border-color:#86b7ff!important;box-shadow:0 0 0 4px rgba(8,102,255,.10)!important}.sp-auth-remember{display:flex!important;align-items:center!important;gap:9px!important;margin:7px 2px 10px!important;color:#475467!important;font-size:11.5px!important}.sp-auth-remember input{width:16px!important;height:16px!important;accent-color:#1877f2}.sp-auth-login-btn{height:51px!important;border-radius:12px!important;background:#1877f2!important;font-size:16px!important;box-shadow:none!important}.sp-auth-hint{margin:3px 2px 0!important;text-align:left!important;font-size:11px!important;color:#667085!important;line-height:1.45}.sp-auth-forgot{margin:15px 0 12px!important;text-align:center;font-size:12px!important;font-weight:700}.sp-auth-divider{height:28px!important;margin:2px 0 12px!important}.sp-auth-create-btn{min-height:44px!important;padding:0 18px!important;border-radius:12px!important;background:#34bd25!important;font-size:13px!important;font-weight:800!important}.sp-auth-create-btn.is-submit{width:100%;background:#1877f2!important;color:#fff!important}.sp-auth-title{text-align:left!important;border:0!important;padding:2px 2px 8px!important;margin:0!important}.sp-auth-title h1{font-size:24px!important}.sp-auth-title p{font-size:13px!important}.sp-auth-name-grid{gap:10px!important}.sp-auth-footer{max-width:1180px!important;padding:10px 24px 32px!important;color:#667085!important}.sp-auth-footer nav{margin-bottom:13px!important;gap:20px!important;font-size:12px!important}
.sp-profile-count-summary{margin:0 0 14px;padding:10px 12px;border-radius:10px;background:#f8fafc;color:#667085;font-size:12px}

@media(max-width:900px){.sp-auth-reference-page{grid-template-columns:1fr!important;max-width:520px!important;gap:26px!important;padding:30px 18px 76px!important}.sp-auth-reference-visual{min-height:220px!important}.sp-auth-photo-card{display:none!important}.sp-auth-reference-visual h1{position:relative!important;top:auto!important;left:auto!important;right:auto!important;margin:36px 0 8px!important;background:none!important;font-size:36px!important;padding:0!important}.sp-auth-site-name{position:relative!important;left:auto!important;bottom:auto!important;transform:none!important;display:block;text-align:center;margin-top:10px}.sp-auth-panel{max-width:480px!important;margin:0 auto}.sp-auth-footer{padding-bottom:70px!important}}
@media(max-width:520px){.sp-auth-reference-page{padding:18px 12px 68px!important}.sp-auth-reference-visual{min-height:140px!important}.sp-auth-reference-visual h1{margin-top:22px!important;font-size:29px!important;letter-spacing:-1px!important}.sp-auth-panel{padding:14px!important;border-radius:16px!important}.sp-auth-switch{gap:6px!important}.sp-auth-switch a{min-height:40px!important;font-size:12px!important;padding:0 7px!important}.sp-auth-form input{height:50px!important}.sp-auth-name-grid{grid-template-columns:1fr!important}.sp-auth-footer nav{flex-wrap:wrap!important;gap:12px!important}}


/* ==========================================================
   V3.5.1 — Notification badge positioning fixes
   ========================================================== */
.sp-nav-icons>a,
.sp-mobile-nav a,
.sp-friends-nav,
.sp-groups-nav{position:relative;overflow:visible}
.sp-nav-badge{
  top:-5px!important;
  right:-5px!important;
  left:auto!important;
  min-width:18px!important;
  height:18px!important;
  padding:0 4px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  font-size:10px!important;
  line-height:1!important;
  transform:none!important;
  box-shadow:0 2px 6px rgba(16,24,40,.18);
}
.sp-nav-icons>a .sp-nav-badge.sp-group-badge{right:-5px!important;top:-5px!important}
@media(max-width:800px){
  .sp-nav-badge{top:-4px!important;right:-4px!important;min-width:17px!important;height:17px!important;font-size:9.5px!important}
}

/* Optional generic admin/utility notification bubble fix */
[class*="notif"],[class*="notify"],[class*="badge"]{overflow:visible}


/* V3.5.3 reliable Like interaction state */
.sp-like-btn.is-working{opacity:.68!important;cursor:wait!important;pointer-events:none!important}
.sp-like-btn.is-liked{color:#0866ff!important}
.sp-like-btn.is-liked .sp-reel-action-icon{background:#0866ff!important;color:#fff!important}


/* ==========================================================
   V3.5.4 — Auth reliability / browser autofill polish
   ========================================================== */
.sp-auth-form input:-webkit-autofill,
.sp-auth-form input:-webkit-autofill:hover,
.sp-auth-form input:-webkit-autofill:focus{
  -webkit-text-fill-color:#172033!important;
  -webkit-box-shadow:0 0 0 1000px #fff inset!important;
  transition:background-color 9999s ease-out 0s;
}
.sp-auth-login-btn:disabled,.sp-auth-create-btn.is-submit:disabled{opacity:.62;cursor:wait}


/* V3.5.6 auth simplification */
.sp-auth-reference-page .sp-auth-switch{display:none!important}
.sp-auth-reference-page .sp-auth-panel{padding-top:22px!important}


/* ==========================================================
   V3.6.0 — clean transparent SVG icon rendering
   ========================================================== */
svg.sp-icon,
svg.sp-icon-rounded{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none;
  overflow:visible;
}
svg.sp-icon path,
svg.sp-icon circle,
svg.sp-icon rect,
svg.sp-icon line,
svg.sp-icon polyline,
svg.sp-icon polygon{
  vector-effect:non-scaling-stroke;
}


/* ==========================================================
   V3.6.2 — expanded registration fields
   ========================================================== */
.sp-register-form{
  gap:12px!important;
}
.sp-auth-form-section{
  display:grid;
  gap:9px;
}
.sp-auth-form-section+.sp-auth-form-section{
  padding-top:2px;
}
.sp-auth-form-section-title{
  display:block;
  padding-left:2px;
  color:#475467;
  font-size:11px;
  font-weight:800;
  letter-spacing:.015em;
}
.sp-auth-register-two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.sp-auth-field{
  display:grid;
  gap:6px;
}
.sp-auth-field>span{
  padding-left:2px;
  color:#667085;
  font-size:10.5px;
  font-weight:700;
}
.sp-register-form select,
.sp-register-form textarea{
  width:100%;
  border:1px solid #d7deea;
  border-radius:12px;
  background:#fff;
  color:#172033;
  font:inherit;
  outline:0;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.sp-register-form select{
  height:54px;
  padding:0 14px;
}
.sp-register-form textarea{
  min-height:86px;
  padding:12px 14px;
  resize:vertical;
  line-height:1.45;
}
.sp-register-form select:focus,
.sp-register-form textarea:focus{
  border-color:#8bb7ff;
  box-shadow:0 0 0 4px rgba(24,119,242,.10);
}
.sp-register-form input[type="date"]{
  color:#344054;
}
.sp-register-form input[type="date"]:invalid{
  color:#667085;
}
.sp-auth-reference-page:has(.sp-register-form) .sp-auth-panel{
  max-width:500px;
}
.sp-auth-reference-page:has(.sp-register-form) .sp-auth-page,
.sp-auth-reference-page:has(.sp-register-form){
  align-items:flex-start;
}

@media(max-width:560px){
  .sp-auth-register-two{
    grid-template-columns:1fr;
    gap:9px;
  }
  .sp-register-form select{
    height:50px;
  }
  .sp-register-form textarea{
    min-height:80px;
  }
}


/* ==========================================================
   V3.6.5 — Boost + Sponsored placements + feed layout repair
   ========================================================== */
.sp-boost-modal-card{width:min(520px,calc(100vw - 24px))!important}
.sp-boost-intro{display:grid;grid-template-columns:46px minmax(0,1fr);gap:11px;align-items:center;margin-bottom:16px;padding:12px;border:1px solid #e4eaf2;border-radius:13px;background:#f8fbff}
.sp-boost-intro>span{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:#e8f1ff;color:#0866ff}.sp-boost-intro>span .sp-icon{width:23px;height:23px}.sp-boost-intro strong,.sp-boost-intro small{display:block}.sp-boost-intro strong{color:#101828;font-size:13px}.sp-boost-intro small{margin-top:4px;color:#667085;font-size:10.5px;line-height:1.4}
.sp-boost-fields{display:grid;gap:11px}.sp-boost-fields label{display:grid;gap:6px;color:#344054;font-size:11.5px;font-weight:750}.sp-boost-fields input,.sp-boost-fields select{width:100%;height:43px;border:1px solid #d7dfeb;border-radius:10px;background:#fff;padding:0 11px;outline:0}.sp-boost-fields input:focus,.sp-boost-fields select:focus{border-color:#82b2ff;box-shadow:0 0 0 3px rgba(8,102,255,.08)}.sp-boost-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.sp-boost-two label{position:relative}.sp-boost-two label small{position:absolute;right:10px;bottom:14px;color:#98a2b3;font-size:9px}.sp-boost-note{margin-top:12px;padding:9px 10px;border-radius:9px;background:#f8fafc;color:#667085;font-size:10px;line-height:1.45}.sp-boost-submit{margin-top:10px;display:flex!important;align-items:center;justify-content:center;gap:7px}.sp-boost-submit .sp-icon{width:18px;height:18px}
.sp-dialog-actions.has-boost{grid-template-columns:repeat(4,minmax(0,1fr))!important}.sp-boost-btn{color:#0866ff!important}.sp-boost-btn.is-boosting,[data-sp-boost-post].is-boosting{color:#0866ff!important}.sp-post-menu [data-sp-boost-post]{display:flex!important;align-items:center;gap:8px!important}.sp-post-menu [data-sp-boost-post] .sp-icon{width:16px;height:16px}

.sp-sponsored-widget{padding-top:0!important;border-top:0!important;margin:0 0 14px}.sp-sponsored-title{padding:0 4px 10px!important;color:#667085!important;font-size:15px!important}.sp-sponsored-list{display:grid;gap:12px}.sp-sponsored-row{display:grid;grid-template-columns:108px minmax(0,1fr);gap:10px;align-items:center;border-radius:11px;padding:4px;color:#101828}.sp-sponsored-row:hover{background:#e9edf2}.sp-sponsored-media{width:108px;height:108px;border-radius:10px;overflow:hidden;display:grid;place-items:center;background:#e4e7ec}.sp-sponsored-media img{width:100%;height:100%;object-fit:cover;display:block}.sp-sponsored-media .sp-icon{width:30px;height:30px;color:#667085}.sp-sponsored-copy{min-width:0}.sp-sponsored-copy strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:13px;line-height:1.3;font-weight:750}.sp-sponsored-copy small{display:block;margin-top:5px;color:#667085;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-sponsored-feed-slot{display:none;margin:0 0 12px;padding:12px;border:1px solid rgba(15,23,42,.07);border-radius:14px;background:#fff;box-shadow:var(--sp-shadow)}.sp-sponsored-feed-label{margin-bottom:8px;color:#667085;font-size:11px;font-weight:750}.sp-sponsored-feed-slot>a{display:grid;grid-template-columns:96px minmax(0,1fr) 18px;gap:11px;align-items:center}.sp-sponsored-feed-media{width:96px;height:88px;border-radius:10px;overflow:hidden;background:#e8ebef}.sp-sponsored-feed-media img{width:100%;height:100%;object-fit:cover}.sp-sponsored-feed-slot strong,.sp-sponsored-feed-slot small{display:block}.sp-sponsored-feed-slot strong{font-size:13px;line-height:1.35}.sp-sponsored-feed-slot small{margin-top:5px;color:#667085;font-size:10.5px}

/* The earlier <=1100 rule kept a hidden third grid column, squeezing the feed. */
@media (min-width:861px) and (max-width:1100px){.sp-shell{max-width:1020px!important;grid-template-columns:230px minmax(0,728px)!important;gap:18px!important;justify-content:center!important}.sp-right{display:none!important}.sp-sponsored-feed-slot{display:block}}
@media (max-width:860px){.sp-sponsored-feed-slot{display:block}.sp-boost-two{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.sp-boost-two{grid-template-columns:1fr}.sp-sponsored-feed-slot{margin-left:0;margin-right:0}.sp-sponsored-feed-slot>a{grid-template-columns:84px minmax(0,1fr) 16px}.sp-sponsored-feed-media{width:84px;height:78px}.sp-dialog-actions.has-boost{grid-template-columns:repeat(4,minmax(0,1fr))!important}.sp-dialog-actions.has-boost button{font-size:11px!important;padding-left:3px!important;padding-right:3px!important}}


/* ==========================================================
   V3.6.6 — reactions + compact social counters
   ========================================================== */
.sp-reaction-picker{
  position:fixed;
  z-index:2147482500;
  display:flex;
  align-items:flex-end;
  gap:3px;
  padding:7px 8px 6px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:999px;
  background:rgba(255,255,255,.98);
  box-shadow:0 9px 30px rgba(15,23,42,.22),0 2px 8px rgba(15,23,42,.10);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  animation:spReactionPickerIn .14s ease-out;
}
.sp-reaction-picker[hidden]{display:none!important}
@keyframes spReactionPickerIn{
  from{opacity:0;transform:translateY(5px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.sp-reaction-picker button{
  width:43px;height:48px;padding:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:0;border-radius:13px;background:transparent;cursor:pointer;
  transition:transform .14s ease,background .14s ease;
}
.sp-reaction-picker button>span{
  display:block;font-size:29px;line-height:1;
  filter:drop-shadow(0 1px 1px rgba(15,23,42,.12));
  transition:transform .14s cubic-bezier(.2,.8,.2,1);
}
.sp-reaction-picker button>small{
  max-height:0;opacity:0;margin-top:0;
  color:#344054;font-size:8px;font-weight:800;line-height:1;
  transition:.14s ease;
}
.sp-reaction-picker button:hover,
.sp-reaction-picker button:focus-visible,
.sp-reaction-picker button.is-current{background:#f2f4f7}
.sp-reaction-picker button:hover>span,
.sp-reaction-picker button:focus-visible>span{transform:translateY(-6px) scale(1.38)}
.sp-reaction-picker button:hover>small,
.sp-reaction-picker button:focus-visible>small{max-height:12px;opacity:1;margin-top:3px}

.sp-like-btn.is-reacted{color:var(--reaction-color,#0866ff)!important}
.sp-like-btn.is-reacted>svg.sp-icon,
.sp-like-btn.is-reacted>svg.sp-icon-rounded{color:var(--reaction-color,#0866ff)!important}
.sp-current-reaction-emoji{
  display:inline-flex;align-items:center;justify-content:center;
  width:21px;height:21px;font-size:18px;line-height:1;
}
.sp-reel-reaction-emoji{
  display:grid;place-items:center;
  width:100%;height:100%;font-size:25px;line-height:1;
}
.sp-like-btn.is-reacted .sp-reel-action-icon{
  color:#fff!important;
  background:rgba(0,0,0,.38)!important;
}

.sp-reaction-dot.is-multi{
  width:auto!important;height:22px!important;
  display:inline-flex!important;align-items:center!important;
  padding:0!important;background:transparent!important;
  border-radius:0!important;color:inherit!important;
}
.sp-reaction-summary-emoji{
  width:20px;height:20px;margin-left:-4px;
  display:grid;place-items:center;
  border:2px solid #fff;border-radius:50%;
  background:#fff;font-size:15px;line-height:1;
  box-shadow:0 1px 2px rgba(15,23,42,.12);
}
.sp-reaction-summary-emoji:first-child{margin-left:0}
.sp-like-stat{gap:6px!important}

.sp-social-stats,.sp-dialog-statline{gap:10px}
.sp-social-stats .sp-comment-stat,
.sp-social-stats .sp-share-stat,
.sp-dialog-statline .sp-dialog-stat-comments,
.sp-dialog-statline .sp-share-stat{white-space:nowrap}
.sp-share-stat{
  margin-left:auto;
  color:var(--sp-muted,#667085);
  font-size:12px;
}
.sp-social-stats .sp-comment-stat+.sp-share-stat,
.sp-dialog-statline .sp-dialog-stat-comments+.sp-share-stat{margin-left:0}
.sp-social-stats:has(.sp-share-stat) .sp-comment-stat{margin-left:auto}

@media(max-width:520px){
  .sp-reaction-picker{gap:1px;padding:6px 5px 5px;max-width:calc(100vw - 12px)}
  .sp-reaction-picker button{width:39px;height:44px}
  .sp-reaction-picker button>span{font-size:26px}
  .sp-share-stat{font-size:10.5px}
  .sp-social-stats{font-size:11.5px!important}
}


/* ==========================================================
   V3.6.7 — owner Boost card
   ========================================================== */
.sp-owner-boost-panel{
  --sp-boost-owner-bg:#242526;
  --sp-boost-owner-card:#353535;
  --sp-boost-owner-line:#55585c;
  --sp-boost-owner-text:#e4e6eb;
  --sp-boost-owner-muted:#d2d5d9;
  --sp-boost-owner-blue:#0866ff;
  width:100%;overflow:hidden;background:var(--sp-boost-owner-bg);color:var(--sp-boost-owner-text);
}
.sp-owner-boost-message{
  position:relative;margin:12px 9px 7px;min-height:70px;padding:13px 42px 13px 47px;
  display:flex;align-items:center;border-radius:12px;background:var(--sp-boost-owner-card);
}
.sp-owner-boost-megaphone{position:absolute;left:14px;top:17px;width:26px;height:26px;display:grid;place-items:center;color:#1685ff}
.sp-owner-boost-megaphone .sp-icon{width:23px;height:23px}
.sp-owner-boost-message strong,.sp-owner-boost-message small{display:block}
.sp-owner-boost-message strong{color:var(--sp-boost-owner-text);font-size:14px;line-height:1.25;font-weight:750}
.sp-owner-boost-message small{margin-top:5px;color:var(--sp-boost-owner-muted);font-size:11.5px;line-height:1.35}
.sp-owner-boost-dismiss{position:absolute;right:10px;top:11px;width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#b0b3b8;cursor:pointer}
.sp-owner-boost-dismiss:hover{background:#4a4b4d;color:#fff}.sp-owner-boost-dismiss .sp-icon{width:17px;height:17px}
.sp-owner-boost-actions{min-height:52px;padding:7px 9px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--sp-boost-owner-line)}
.sp-owner-boost-actions>a{min-width:0;color:#45a0ff!important;font-size:13px;font-weight:650}.sp-owner-boost-actions>a:hover{text-decoration:underline}
.sp-owner-boost-primary{min-height:38px;padding:0 16px;border:0;border-radius:8px;background:var(--sp-boost-owner-blue);color:#fff;font-size:13px;font-weight:750;cursor:pointer;white-space:nowrap}
.sp-owner-boost-primary:hover{background:#1b74e4}
.sp-owner-boost-primary.is-boosting,.sp-owner-boost-panel.is-boosting .sp-owner-boost-primary{background:#1877f2}
.sp-dialog-side-pane>.sp-owner-boost-panel{margin-top:0;border-top:1px solid #4c4f52;border-bottom:1px solid #4c4f52}

.sp-boost-modal-card{width:min(520px,calc(100vw - 24px))!important;background:#242526!important;color:#e4e6eb!important}
.sp-boost-modal-card .sp-modal-head{background:#242526!important;border-color:#3e4042!important}
.sp-boost-modal-card .sp-modal-head h3{color:#e4e6eb!important}
.sp-boost-modal-card .sp-modal-close{background:#3a3b3c!important;color:#e4e6eb!important}
.sp-boost-modal-card .sp-modal-body{background:#242526!important}
.sp-boost-intro{position:relative!important;grid-template-columns:36px minmax(0,1fr) 30px!important;gap:9px!important;margin-bottom:16px!important;padding:13px!important;border:0!important;border-radius:12px!important;background:#353535!important}
.sp-boost-intro[hidden]{display:none!important}
.sp-boost-intro>span{width:34px!important;height:34px!important;border-radius:0!important;background:transparent!important;color:#1685ff!important}
.sp-boost-intro>span .sp-icon{width:24px!important;height:24px!important}
.sp-boost-intro strong{color:#e4e6eb!important;font-size:14px!important}
.sp-boost-intro small{color:#d2d5d9!important;font-size:11.5px!important}
.sp-boost-guide-dismiss{width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#b0b3b8;cursor:pointer}
.sp-boost-guide-dismiss:hover{background:#4a4b4d;color:#fff}.sp-boost-guide-dismiss .sp-icon{width:17px;height:17px}
.sp-boost-modal-card .sp-boost-fields label{color:#d8dadf!important}
.sp-boost-modal-card .sp-boost-fields input,.sp-boost-modal-card .sp-boost-fields select{border-color:#4a4d51!important;background:#3a3b3c!important;color:#fff!important}
.sp-boost-modal-card .sp-boost-fields input:focus,.sp-boost-modal-card .sp-boost-fields select:focus{border-color:#2d88ff!important;box-shadow:0 0 0 3px rgba(45,136,255,.13)!important}
.sp-boost-modal-card .sp-boost-two label small{color:#b0b3b8!important}
.sp-boost-modal-card .sp-boost-note{background:#303132!important;color:#b0b3b8!important}
.sp-boost-modal-card .sp-status{color:#b0b3b8}.sp-boost-modal-card .sp-status.success{color:#68d391}.sp-boost-modal-card .sp-status.error{color:#ff8181}
.sp-boost-modal-actions{min-height:51px;margin:12px -16px -14px;padding:7px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #55585c}
.sp-boost-modal-actions>a{color:#45a0ff!important;font-size:13px;font-weight:650}
.sp-boost-submit{min-height:38px;padding:0 15px;display:inline-flex!important;align-items:center;justify-content:center;gap:7px;border:0;border-radius:8px;background:#0866ff;color:#fff;font-weight:750;cursor:pointer}
.sp-boost-submit:hover{background:#1b74e4}.sp-boost-submit:disabled{opacity:.6;cursor:wait}.sp-boost-submit .sp-icon{width:16px;height:16px}
.sp-dialog-actions.has-boost{grid-template-columns:repeat(3,minmax(0,1fr))!important}

@media(max-width:520px){
  .sp-owner-boost-message{margin:8px 7px 6px;padding-left:45px}
  .sp-owner-boost-actions{padding:7px}
  .sp-owner-boost-actions>a{font-size:12px}
  .sp-owner-boost-primary{padding:0 13px;font-size:12px}
  .sp-boost-modal-actions{margin-left:-16px;margin-right:-16px}
}


/* ==========================================================
   V3.6.9 — Boost payment gateway connection
   ========================================================== */
.sp-boost-payment{
  margin-top:14px;
  padding:14px;
  border:1px solid #4a4d51;
  border-radius:13px;
  background:#2d2f31;
}
.sp-boost-payment-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:12px;
}
.sp-boost-payment-head strong,.sp-boost-payment-head small{display:block}
.sp-boost-payment-head strong{color:#f0f2f5;font-size:13px}
.sp-boost-payment-head small{margin-top:3px;color:#b0b3b8;font-size:10.5px}
.sp-boost-payment-head>b{
  padding:6px 9px;border-radius:8px;background:#3a3b3c;color:#fff;
  font-size:13px;white-space:nowrap;
}

.sp-boost-gateway-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.sp-boost-gateway-card{
  min-width:0;padding:8px 6px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:2px solid transparent;border-radius:11px;
  background:#3a3b3c;color:#e4e6eb;cursor:pointer;
  transition:border-color .16s ease,transform .16s ease,background .16s ease;
}
.sp-boost-gateway-card:hover{transform:translateY(-1px);background:#424345}
.sp-boost-gateway-card.is-selected{border-color:#2d88ff;background:#333a46}
.sp-boost-gateway-card>span{
  width:58px;height:42px;padding:5px;
  display:grid;place-items:center;border-radius:9px;
  background:var(--boost-gateway-bg,#fff);color:var(--boost-gateway-fg,#172033);
  overflow:hidden;
}
.sp-boost-gateway-card>span img{
  display:block;max-width:94%;max-height:90%;width:auto;height:auto;object-fit:contain;
  background:transparent!important;border:0!important;
}
.sp-boost-gateway-card>span .sp-mon-gateway-fallback{
  display:inline-flex!important;width:34px;height:34px;border-radius:8px;font-size:13px;
}
.sp-boost-gateway-card>strong{
  margin-top:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#f0f2f5;font-size:10.5px;
}
.sp-boost-gateway-card>small{
  margin-top:2px;color:#b0b3b8;font-size:8.5px;text-align:center;
}

.sp-boost-payment-modes{
  display:flex;gap:7px;margin-top:11px;
}
.sp-boost-payment-modes button{
  min-height:34px;padding:0 11px;
  border:1px solid #4a4d51;border-radius:8px;
  background:#3a3b3c;color:#d8dadf;
  font-size:10.5px;font-weight:700;cursor:pointer;
}
.sp-boost-payment-modes button.is-selected{
  border-color:#2d88ff;background:#173d6e;color:#fff;
}
.sp-boost-payment-modes button[hidden]{display:none!important}

.sp-boost-manual-payment{
  margin-top:10px;padding:10px;border-radius:9px;background:#242526;
}
.sp-boost-manual-payment[hidden]{display:none!important}
.sp-boost-manual-payment label{
  display:grid;gap:6px;color:#d8dadf;font-size:10.5px;font-weight:700;
}
.sp-boost-manual-payment input{
  min-height:39px;padding:0 10px;border:1px solid #4a4d51;border-radius:8px;
  background:#3a3b3c;color:#fff;outline:0;
}
.sp-boost-manual-payment p{
  margin:7px 0 0;color:#b0b3b8;font-size:9.5px;line-height:1.4;
}
.sp-boost-no-gateway{
  padding:11px;border-radius:9px;background:#432d2d;color:#ffb4b4;
  font-size:10.5px;line-height:1.45;
}

@media(max-width:620px){
  .sp-boost-gateway-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sp-boost-payment-head{align-items:flex-start}
}


/* ==========================================================
   V3.7.0 — Sponsored cards represent content, never profiles
   ========================================================== */
.sp-sponsored-media,
.sp-sponsored-feed-media{
  position:relative;
  background:#15171a;
}
.sp-sponsored-media img,
.sp-sponsored-feed-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:inherit;
}
.sp-sponsored-reel-placeholder,
.sp-sponsored-post-placeholder{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 25% 18%,rgba(8,102,255,.28),transparent 38%),
    linear-gradient(145deg,#20242a,#0f1114);
  color:#fff;
}
.sp-sponsored-reel-icon{
  opacity:.34;
}
.sp-sponsored-reel-icon .sp-icon{
  width:42px!important;
  height:42px!important;
  color:#fff!important;
}
.sp-sponsored-play-icon{
  position:absolute;
  left:50%;
  top:50%;
  width:38px;
  height:38px;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  border:2px solid rgba(255,255,255,.92);
  border-radius:50%;
  background:rgba(0,0,0,.36);
  color:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.sp-sponsored-play-icon .sp-icon{
  width:20px!important;
  height:20px!important;
  margin-left:2px;
}
.sp-sponsored-post-placeholder .sp-icon{
  width:34px!important;
  height:34px!important;
  color:#d0d5dd!important;
}
.sp-sponsored-row.is-sponsored-reel .sp-sponsored-copy small,
.sp-sponsored-feed-slot.is-sponsored-reel small{
  color:#667085;
}
.sp-sponsored-row.is-sponsored-reel .sp-sponsored-media::after,
.sp-sponsored-feed-slot.is-sponsored-reel .sp-sponsored-feed-media::after{
  content:"REEL";
  position:absolute;
  left:7px;
  bottom:7px;
  z-index:3;
  padding:3px 6px;
  border-radius:5px;
  background:rgba(0,0,0,.68);
  color:#fff;
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
}


/* ==========================================================
   V3.7.1 — complete post management menu
   ========================================================== */
.sp-post-manage-menu{
  width:328px!important;
  max-width:calc(100vw - 24px);
  max-height:min(610px,calc(100vh - 90px));
  overflow:auto;
  padding:8px!important;
  border-radius:12px!important;
}
.sp-post-manage-menu>a,
.sp-post-manage-menu>button{
  position:relative;
  min-height:46px!important;
  padding:8px 10px!important;
  display:grid!important;
  grid-template-columns:26px minmax(0,1fr)!important;
  column-gap:9px!important;
  align-items:center!important;
  border-radius:8px!important;
  font-weight:650;
}
.sp-post-manage-menu>a>.sp-icon,
.sp-post-manage-menu>button>.sp-icon{
  grid-row:1 / span 2;
  width:21px!important;
  height:21px!important;
  color:#4b5565;
}
.sp-post-manage-menu>a>span,
.sp-post-manage-menu>button>span{
  min-width:0;
  display:block;
  line-height:1.25;
}
.sp-post-manage-menu>a>small,
.sp-post-manage-menu>button>small{
  grid-column:2;
  display:block;
  margin-top:2px;
  color:#8a94a3;
  font-size:10px;
  line-height:1.25;
  font-weight:500;
}
.sp-post-menu-separator{
  height:1px;
  margin:5px 7px;
  background:var(--sp-line);
}
.sp-post-manage-menu .is-danger{color:#b42318!important}
.sp-post-manage-menu .is-danger>.sp-icon{color:#b42318!important}

/* Reels get the same post menu in the top-right corner. */
.sp-reel-menu-wrap{
  position:absolute!important;
  z-index:30;
  right:12px;
  top:12px;
  margin-left:0!important;
}
.sp-reel-menu-wrap>.sp-more{
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:50%;
  background:rgba(36,37,38,.72)!important;
  color:#fff!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.sp-reel-menu-wrap>.sp-more:hover{background:rgba(58,59,60,.94)!important}
.sp-reel-menu-wrap .sp-post-menu{
  top:44px!important;
  right:0!important;
}

/* Dialog header can now hold the options menu. */
.sp-dialog-post-head>.sp-post-menu-wrap{
  margin-left:auto;
}
.sp-dialog-post-head>.sp-post-menu-wrap .sp-post-menu{
  z-index:80;
}

/* Edit modal */
.sp-post-manage-card{
  width:min(560px,100%)!important;
}
.sp-post-manage-card .sp-modal-body{
  padding:16px;
}
.sp-post-manage-card [data-post-manage-section]{
  display:grid;
  gap:12px;
}
.sp-post-manage-card [data-post-manage-section][hidden]{display:none!important}
.sp-manage-field{
  display:grid;
  gap:7px;
  color:#344054;
  font-size:12px;
  font-weight:750;
}
.sp-manage-field input,
.sp-manage-field textarea{
  width:100%;
  border:1px solid #d7dee8;
  border-radius:10px;
  background:#fff;
  color:#172033;
  padding:11px 12px;
  outline:0;
  font:inherit;
}
.sp-manage-field input{min-height:43px}
.sp-manage-field textarea{
  resize:vertical;
  line-height:1.45;
}
.sp-manage-field input:focus,
.sp-manage-field textarea:focus{
  border-color:#78aaff;
  box-shadow:0 0 0 3px rgba(8,102,255,.09);
}
.sp-manage-note{
  margin:0!important;
  padding:10px 11px;
  border-radius:9px;
  background:#f5f7fa;
  color:#667085!important;
  font-size:10.5px!important;
  line-height:1.4!important;
}
.sp-manage-choice-list{
  display:grid;
  gap:8px;
}
.sp-manage-choice-list label{
  cursor:pointer;
}
.sp-manage-choice-list input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.sp-manage-choice-list label>span{
  min-height:68px;
  padding:10px 12px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  column-gap:10px;
  align-items:center;
  border:2px solid #e3e8ef;
  border-radius:11px;
  background:#fff;
}
.sp-manage-choice-list label>span>.sp-icon{
  grid-row:1 / span 2;
  width:25px;height:25px;
  color:#4f5d70;
}
.sp-manage-choice-list b,
.sp-manage-choice-list small{display:block}
.sp-manage-choice-list b{font-size:12px;color:#172033}
.sp-manage-choice-list small{
  grid-column:2;
  margin-top:2px;
  color:#667085;
  font-size:10px;
  font-weight:500;
}
.sp-manage-choice-list input:checked+span{
  border-color:#0866ff;
  background:#f3f7ff;
}
.sp-manage-choice-list input:checked+span>.sp-icon{color:#0866ff}
.sp-manage-secondary{
  min-height:38px;
  padding:0 13px;
  border:1px solid #d7dee8;
  border-radius:8px;
  background:#fff;
  color:#344054;
  font-weight:700;
  cursor:pointer;
}
.sp-comment-restricted{
  padding:12px!important;
  text-align:center;
  color:#667085;
}

/* Pinned post marker */
.sp-profile-post-card:has(.sp-post-menu [data-sp-post-action="pin"] span:first-of-type){
  position:relative;
}

/* Smooth archive/trash removal */
.sp-removing{
  opacity:0!important;
  transform:scale(.985)!important;
  transition:opacity .24s ease,transform .24s ease!important;
}

@media(max-width:600px){
  .sp-post-manage-menu{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    top:auto!important;
    bottom:70px!important;
    width:auto!important;
    max-height:72vh!important;
    border-radius:16px!important;
  }
  .sp-reels-route .sp-post-manage-menu{
    bottom:76px!important;
  }
  .sp-post-manage-card{
    max-height:92vh;
    overflow:auto;
  }
}


/* ==========================================================
   V3.7.3 — under-media advertisement system
   ========================================================== */
.sp-post-card>.sp-feed-banner-ad,
.sp-profile-post-card>.sp-feed-banner-ad,
.sp-group-post-card>.sp-feed-banner-ad{
  width:100%!important;
  max-width:none!important;
  margin:6px 0 0!important;
  padding:0!important;
  border:1px solid #d8dde5!important;
  border-radius:0!important;
  background:#fff!important;
  overflow:hidden!important;
}
.sp-feed-banner-ad{
  position:relative!important;
  width:min(728px,100%)!important;
  max-width:728px!important;
  margin:7px auto 0!important;
  padding:0!important;
  border:1px solid #d8dde5!important;
  border-radius:2px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.sp-feed-banner-ad-inner{
  width:100%!important;
  aspect-ratio:728/90!important;
  min-height:0!important;
  display:flex!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  background:#f4f5f7!important;
  overflow:hidden!important;
}
.sp-feed-banner-ad-inner>a{
  width:100%!important;
  height:100%!important;
  display:block!important;
}
.sp-feed-banner-ad-image{
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  border:0!important;
  border-radius:0!important;
}
.sp-feed-banner-ad-label{
  position:absolute!important;
  z-index:6!important;
  top:5px!important;
  left:5px!important;
  padding:2px 5px!important;
  border:1px solid rgba(92,101,112,.25)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.93)!important;
  color:#68717d!important;
  font-size:8px!important;
  font-weight:650!important;
  line-height:1.15!important;
  pointer-events:none!important;
}
.sp-dialog-media-inner>.sp-feed-banner-ad{
  width:100%!important;
  max-width:728px!important;
  margin:6px auto 0!important;
  flex:0 0 auto!important;
}
.sp-feed-banner-ad-html{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  display:block!important;
  overflow:hidden!important;
}
.sp-feed-banner-ad-html iframe,
.sp-feed-banner-ad-html ins,
.sp-feed-banner-ad-html img{
  max-width:100%!important;
}

@media(max-width:760px){
  .sp-feed-banner-ad,
  .sp-post-card>.sp-feed-banner-ad,
  .sp-profile-post-card>.sp-feed-banner-ad,
  .sp-group-post-card>.sp-feed-banner-ad{
    margin-top:4px!important;
  }
  .sp-feed-banner-ad-label{
    top:4px!important;
    left:4px!important;
    padding:2px 4px!important;
    font-size:7px!important;
  }
}


/* V3.7.4 — 10-item ad rotation */
.sp-feed-banner-ad[data-sp-ad-id]{
  contain:layout paint;
}
.sp-feed-banner-ad[data-sp-ad-id] .sp-feed-banner-ad-inner{
  transition:opacity .15s ease;
}


/* ==========================================================
   V3.7.5 — Facebook-style Messenger / user-to-user chat
   ========================================================== */
.sp-messages-nav,.sp-mobile-message-link{position:relative}
.sp-message-badge,.sp-mobile-message-badge{position:absolute!important;right:-5px!important;top:-5px!important;min-width:18px!important;height:18px!important;padding:0 4px!important;display:flex!important;align-items:center!important;justify-content:center!important;border:2px solid #fff!important;border-radius:999px!important;background:#e41e3f!important;color:#fff!important;font-size:9px!important;font-weight:800!important;line-height:1!important}
.sp-message-badge[hidden],.sp-mobile-message-badge[hidden]{display:none!important}
.sp-mobile-message-badge{right:calc(50% - 21px)!important;top:4px!important}
.sp-contact-message-icon{margin-left:auto;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;color:#0866ff;opacity:0;transition:.14s ease}.sp-contact:hover .sp-contact-message-icon{opacity:1}.sp-contact-message-icon .sp-icon{width:17px;height:17px}

body.sp-messages-route .sp-shell{display:block!important;max-width:1320px!important;padding:14px 16px 80px!important}
.sp-messages-page{width:100%;min-height:calc(100vh - 104px)}
.sp-messenger-shell{height:min(780px,calc(100vh - 104px));min-height:560px;display:grid;grid-template-columns:340px minmax(0,1fr);overflow:hidden;border:1px solid #dfe3e8;border-radius:14px;background:#fff;box-shadow:0 5px 24px rgba(15,23,42,.07)}
.sp-messenger-sidebar{min-width:0;display:flex;flex-direction:column;border-right:1px solid #e4e6eb;background:#fff}
.sp-messenger-sidebar-head{padding:17px 16px 10px;display:flex;align-items:center;justify-content:space-between}.sp-messenger-sidebar-head span{display:block;color:#65676b;font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.06em}.sp-messenger-sidebar-head h1{margin:1px 0 0;font-size:24px;line-height:1.15;color:#050505}.sp-messenger-new{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:#e4e6eb;color:#050505;cursor:pointer}.sp-messenger-new:hover{background:#d8dadf}.sp-messenger-new .sp-icon{width:19px;height:19px}
.sp-messenger-search{height:38px;margin:0 12px 8px;padding:0 11px;display:flex;align-items:center;gap:7px;border-radius:20px;background:#f0f2f5;color:#65676b}.sp-messenger-search .sp-icon{width:17px;height:17px}.sp-messenger-search input{width:100%;border:0;outline:0;background:transparent;color:#050505;font-size:13px}
.sp-messenger-conversations{flex:1;min-height:0;overflow-y:auto;padding:3px 7px 10px}.sp-chat-list-loading,.sp-chat-list-empty{padding:28px 15px;text-align:center;color:#65676b;font-size:12px;line-height:1.5}
.sp-conversation-row{width:100%;min-height:68px;padding:8px;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:9px;align-items:center;border:0;border-radius:9px;background:transparent;text-align:left;cursor:pointer}.sp-conversation-row:hover{background:#f2f2f2}.sp-conversation-row:disabled{opacity:.48;cursor:not-allowed}.sp-conversation-row.has-unread{background:#f3f8ff}.sp-conversation-avatar{position:relative;width:48px;height:48px}.sp-conversation-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover}.sp-conversation-avatar i{position:absolute;right:1px;bottom:1px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#31a24c}.sp-conversation-copy{min-width:0}.sp-conversation-copy strong,.sp-conversation-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-conversation-copy strong{color:#050505;font-size:13px;font-weight:700}.sp-conversation-copy small{margin-top:4px;color:#65676b;font-size:11px}.sp-conversation-row.has-unread .sp-conversation-copy strong,.sp-conversation-row.has-unread .sp-conversation-copy small{color:#050505;font-weight:700}.sp-conversation-row>b{min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:#0866ff;color:#fff;font-size:9px}

.sp-messenger-thread{min-width:0;position:relative;background:#fff}.sp-messenger-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center}.sp-messenger-empty-icon{width:70px;height:70px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#9e55ff,#0866ff);color:#fff}.sp-messenger-empty-icon .sp-icon{width:36px;height:36px}.sp-messenger-empty h2{margin:14px 0 6px;color:#050505;font-size:21px}.sp-messenger-empty p{max-width:370px;margin:0;color:#65676b;font-size:12px}.sp-messenger-empty button{margin-top:15px;min-height:38px;padding:0 16px;border:0;border-radius:8px;background:#0866ff;color:#fff;font-weight:750;cursor:pointer}
.sp-chat-active{height:100%;display:grid;grid-template-rows:62px minmax(0,1fr) auto}.sp-chat-active[hidden]{display:none!important}.sp-chat-head{padding:8px 12px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e4e6eb;box-shadow:0 1px 2px rgba(0,0,0,.04);z-index:2}.sp-chat-back{display:none;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:#0866ff;cursor:pointer}.sp-chat-person{min-width:0;display:flex;align-items:center;gap:9px;color:inherit;text-decoration:none}.sp-chat-head-avatar{position:relative;width:40px;height:40px;flex:0 0 40px}.sp-chat-head-avatar img{width:40px;height:40px;border-radius:50%;object-fit:cover}.sp-chat-head-avatar i{position:absolute;right:0;bottom:0;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#31a24c}.sp-chat-person strong,.sp-chat-person small{display:block}.sp-chat-person strong{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#050505;font-size:13px}.sp-chat-person small{margin-top:2px;color:#65676b;font-size:10px}.sp-chat-head-actions{margin-left:auto}.sp-chat-head-actions button{width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#0866ff;cursor:pointer}.sp-chat-head-actions button:hover{background:#f0f2f5}
.sp-chat-scroll{min-height:0;overflow-y:auto;padding:10px 16px 14px;scroll-behavior:smooth}.sp-chat-profile-intro{padding:18px 10px 22px;display:flex;flex-direction:column;align-items:center;text-align:center}.sp-chat-profile-intro img{width:72px;height:72px;border-radius:50%;object-fit:cover}.sp-chat-profile-intro strong{margin-top:9px;color:#050505;font-size:14px}.sp-chat-profile-intro span{margin-top:2px;color:#65676b;font-size:11px}.sp-chat-profile-intro a{margin-top:7px;color:#0866ff;font-size:10px;font-weight:700}.sp-chat-messages{display:flex;flex-direction:column;gap:3px}.sp-chat-loading,.sp-chat-error{padding:28px;text-align:center;color:#65676b;font-size:12px}.sp-chat-error{color:#b42318}
.sp-chat-message{position:relative;max-width:min(74%,520px);display:flex;flex-direction:column}.sp-chat-message.is-mine{align-self:flex-end;align-items:flex-end}.sp-chat-message.is-theirs{align-self:flex-start;align-items:flex-start}.sp-chat-message-content{max-width:100%}.sp-chat-bubble{padding:8px 11px;border-radius:18px;background:#e4e6eb;color:#050505;font-size:13px;line-height:1.35;overflow-wrap:anywhere}.sp-chat-message.is-mine .sp-chat-bubble{background:#0084ff;color:#fff}.sp-chat-unsent{background:#f0f2f5!important;color:#8a8d91!important;font-style:italic}.sp-chat-image{display:block;max-width:320px;margin-bottom:3px;overflow:hidden;border-radius:16px}.sp-chat-image img{display:block;width:auto;max-width:100%;max-height:380px;object-fit:contain;background:#f0f2f5}.sp-chat-message-meta{min-height:18px;display:flex;align-items:center;gap:5px;color:#8a8d91;font-size:8.5px;opacity:0;transition:.12s}.sp-chat-message:hover .sp-chat-message-meta{opacity:1}.sp-chat-message-meta button{border:0;background:transparent;color:#65676b;font-size:10px;cursor:pointer}.sp-chat-message-actions{position:absolute;z-index:6;top:100%;right:0;min-width:150px;padding:5px;border:1px solid #e4e6eb;border-radius:9px;background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.12)}.sp-chat-message.is-theirs .sp-chat-message-actions{left:0;right:auto}.sp-chat-message-actions button{width:100%;padding:8px;border:0;border-radius:6px;background:transparent;text-align:left;color:#050505;font-size:10px;cursor:pointer}.sp-chat-message-actions button:hover{background:#f0f2f5}.sp-chat-seen-label{align-self:flex-end;margin:1px 3px 6px;color:#8a8d91;font-size:8.5px}
.sp-chat-typing{align-self:flex-start;width:50px;height:30px;margin:5px 0;display:flex;align-items:center;justify-content:center;gap:3px;border-radius:16px;background:#e4e6eb}.sp-chat-typing[hidden]{display:none!important}.sp-chat-typing span{width:5px;height:5px;border-radius:50%;background:#8a8d91;animation:spChatDot 1s infinite ease-in-out}.sp-chat-typing span:nth-child(2){animation-delay:.15s}.sp-chat-typing span:nth-child(3){animation-delay:.3s}@keyframes spChatDot{0%,70%,100%{transform:translateY(0)}35%{transform:translateY(-4px)}}
.sp-chat-composer{padding:8px 10px 10px;display:flex;align-items:flex-end;gap:6px;border-top:1px solid #f0f2f5;background:#fff}.sp-chat-photo,.sp-chat-send{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#0866ff;cursor:pointer}.sp-chat-photo:hover,.sp-chat-send:hover{background:#edf4ff}.sp-chat-photo .sp-icon,.sp-chat-send .sp-icon{width:20px;height:20px}.sp-chat-send:disabled{opacity:.45}.sp-chat-input-wrap{min-width:0;flex:1;padding:7px 11px;border-radius:18px;background:#f0f2f5}.sp-chat-input-wrap textarea{width:100%;max-height:120px;padding:0;border:0;outline:0;resize:none;background:transparent;color:#050505;font:13px/1.35 inherit}.sp-chat-file-preview{display:block;margin-top:5px;color:#0866ff;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sp-chat-file-preview[hidden]{display:none!important}

/* Desktop floating Messenger window */


@media(max-width:760px){
  body.logged-in .sp-mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  body.sp-messages-route .sp-shell{padding:0 0 calc(64px + env(safe-area-inset-bottom))!important;max-width:none!important}
  .sp-messages-page{min-height:calc(100dvh - 60px)}
  .sp-messenger-shell{height:calc(100dvh - 60px - 64px);min-height:0;display:block;border:0;border-radius:0;box-shadow:none}
  .sp-messenger-sidebar,.sp-messenger-thread{height:100%}.sp-messenger-thread{display:none}.sp-messages-page.has-active-chat .sp-messenger-sidebar{display:none}.sp-messages-page.has-active-chat .sp-messenger-thread{display:block}
  .sp-chat-back{display:grid}.sp-chat-active{height:100%}.sp-chat-head{height:58px}.sp-chat-scroll{padding-left:9px;padding-right:9px}.sp-chat-message{max-width:84%}.sp-chat-bubble{font-size:13px}.sp-chat-message-meta{opacity:1}
  .sp-contact-message-icon{opacity:1}
}


/* ==========================================================
   V3.7.8 — native Messenger audio/video calls
   ========================================================== */
.sp-chat-head-actions{display:flex;align-items:center;gap:3px}.sp-chat-head-actions button[data-chat-call]{color:#0866ff}.sp-chat-head-actions button[data-chat-call] .sp-icon{width:19px;height:19px}
.sp-call-layer{position:fixed;z-index:2147483000;inset:0;display:grid;place-items:center;padding:18px;background:rgba(9,12,18,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.sp-call-layer[hidden]{display:none!important}
.sp-call-window{position:relative;width:min(880px,calc(100vw - 36px));height:min(660px,calc(100dvh - 36px));overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:#11151c;color:#fff;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.sp-call-remote-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#080b10}.sp-call-layer[data-call-type="audio"] .sp-call-remote-video{opacity:0;pointer-events:none}
.sp-call-audio-stage{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px 130px;text-align:center;background:radial-gradient(circle at 50% 34%,#25395d 0,#172033 34%,#0c1119 72%)}.sp-call-layer[data-call-type="video"] .sp-call-audio-stage{background:linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.4));justify-content:flex-start;padding-top:52px;pointer-events:none}.sp-call-layer[data-call-type="video"] .sp-call-audio-stage img,.sp-call-layer[data-call-type="video"] .sp-call-audio-stage strong{display:none}
.sp-call-audio-stage img{width:126px;height:126px;border:4px solid rgba(255,255,255,.18);border-radius:50%;object-fit:cover;box-shadow:0 10px 40px rgba(0,0,0,.28)}.sp-call-audio-stage strong{margin-top:18px;font-size:24px}.sp-call-audio-stage span{margin-top:7px;color:#d9e0ea;font-size:13px}
.sp-call-local-video{position:absolute;z-index:5;right:18px;top:58px;width:180px;height:128px;object-fit:cover;border:2px solid rgba(255,255,255,.75);border-radius:14px;background:#111;box-shadow:0 8px 25px rgba(0,0,0,.35);transform:scaleX(-1)}.sp-call-local-video[hidden]{display:none!important}
.sp-call-top{position:absolute;z-index:8;top:0;left:0;right:0;height:52px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to bottom,rgba(0,0,0,.52),transparent)}.sp-call-top span{font-size:13px;font-weight:700}.sp-call-top button{width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:19px;cursor:pointer}
.sp-call-controls,.sp-call-incoming-actions{position:absolute;z-index:10;left:50%;bottom:28px;transform:translateX(-50%);display:flex;align-items:center;gap:14px}.sp-call-controls[hidden],.sp-call-incoming-actions[hidden]{display:none!important}.sp-call-controls button,.sp-call-incoming-actions button{width:58px;height:58px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.22)}.sp-call-controls button:hover{background:rgba(255,255,255,.27)}.sp-call-controls button.is-off{background:#fff;color:#161b22}.sp-call-controls .hangup,.sp-call-incoming-actions .decline{background:#e41e3f}.sp-call-incoming-actions .accept{background:#31a24c}.sp-call-controls .sp-icon,.sp-call-incoming-actions .sp-icon{width:24px;height:24px}.sp-call-incoming-actions button{position:relative;margin:0 18px}.sp-call-incoming-actions button span{position:absolute;top:66px;left:50%;transform:translateX(-50%);white-space:nowrap;color:#fff;font-size:11px;font-weight:700}
.sp-call-layer.is-minimized{pointer-events:none;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}.sp-call-layer.is-minimized .sp-call-window{pointer-events:auto;position:fixed;right:18px;bottom:18px;width:310px;height:210px;border-radius:16px}.sp-call-layer.is-minimized .sp-call-local-video{width:78px;height:58px;right:8px;top:42px}.sp-call-layer.is-minimized .sp-call-controls{bottom:10px;gap:7px}.sp-call-layer.is-minimized .sp-call-controls button{width:38px;height:38px}.sp-call-layer.is-minimized .sp-call-audio-stage img{width:62px;height:62px}.sp-call-layer.is-minimized .sp-call-audio-stage strong{font-size:15px}.sp-call-layer.is-minimized .sp-call-audio-stage{padding:42px 12px 60px}
html.sp-call-active{overflow:hidden}
@media(max-width:700px){.sp-call-layer{padding:0}.sp-call-window{width:100vw;height:100dvh;border:0;border-radius:0}.sp-call-local-video{right:12px;top:58px;width:112px;height:150px}.sp-call-controls,.sp-call-incoming-actions{bottom:calc(30px + env(safe-area-inset-bottom))}.sp-call-controls button,.sp-call-incoming-actions button{width:54px;height:54px}.sp-call-audio-stage img{width:112px;height:112px}.sp-call-audio-stage strong{font-size:21px}.sp-call-layer.is-minimized .sp-call-window{right:10px;bottom:calc(74px + env(safe-area-inset-bottom));width:250px;height:170px}}


/* ==========================================================
   V3.7.9 — Facebook-style Share system
   ========================================================== */
.sp-share-modal{position:fixed;inset:0;z-index:2147482900;display:none;align-items:center;justify-content:center;padding:18px}
.sp-share-modal.is-open{display:flex}
.sp-share-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.sp-share-dialog{position:relative;z-index:2;width:min(546px,100%);max-height:min(90dvh,720px);display:grid;grid-template-rows:61px minmax(0,1fr);overflow:hidden;border:1px solid #3e4042;border-radius:10px;background:#242526;color:#e4e6eb;box-shadow:0 16px 50px rgba(0,0,0,.38)}
.sp-share-head{position:relative;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #3e4042}
.sp-share-head h3{margin:0;color:#e4e6eb;font-size:20px;font-weight:800}
.sp-share-head>button{position:absolute;right:12px;top:11px;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;background:#3a3b3c;color:#b0b3b8;cursor:pointer}
.sp-share-head>button:hover{background:#4e4f50;color:#fff}.sp-share-head>button .sp-icon{width:21px;height:21px}
.sp-share-body{min-height:0;overflow:auto}
.sp-share-compose{padding:15px 12px 16px;border-bottom:1px solid #3e4042}
.sp-share-person{display:flex;align-items:flex-start;gap:10px}.sp-share-person>.sp-avatar{width:42px!important;height:42px!important;flex:0 0 42px;border-radius:50%}.sp-share-person>div>strong{display:block;margin-top:1px;color:#e4e6eb;font-size:13px}
.sp-share-context-row{position:relative;margin-top:5px;display:flex;align-items:center;gap:5px}
.sp-share-feed-pill,.sp-share-audience-button{height:28px;display:inline-flex;align-items:center;gap:5px;padding:0 9px;border:0;border-radius:6px;background:#3a3b3c;color:#e4e6eb;font-size:11px;font-weight:750}
.sp-share-audience-button{cursor:pointer}.sp-share-audience-button:hover{background:#4b4c4d}.sp-share-audience-button .sp-icon{width:13px;height:13px}.sp-share-audience-button>b{font-size:9px}
.sp-share-audience-menu{position:absolute;z-index:15;left:46px;top:34px;width:245px;padding:6px;border:1px solid #4c4d4f;border-radius:10px;background:#2d2e30;box-shadow:0 8px 30px rgba(0,0,0,.35)}
.sp-share-audience-menu[hidden]{display:none!important}.sp-share-audience-menu button{width:100%;min-height:54px;display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;align-items:center;padding:7px 9px;border:0;border-radius:8px;background:transparent;color:#e4e6eb;text-align:left;cursor:pointer}.sp-share-audience-menu button:hover,.sp-share-audience-menu button.is-selected{background:#3a3b3c}.sp-share-audience-menu .sp-icon{width:21px;height:21px}.sp-share-audience-menu strong,.sp-share-audience-menu small{display:block}.sp-share-audience-menu strong{font-size:12px}.sp-share-audience-menu small{margin-top:2px;color:#b0b3b8;font-size:9px}
.sp-share-caption-wrap{position:relative;margin-top:13px}.sp-share-caption-wrap textarea{width:100%;min-height:70px;max-height:150px;padding:2px 42px 6px 0;resize:vertical;border:0;outline:0;background:transparent;color:#e4e6eb;font:14px/1.45 inherit}.sp-share-caption-wrap textarea::placeholder{color:#b0b3b8}
.sp-share-emoji-toggle{position:absolute;right:1px;top:4px;width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:#b0b3b8;font-size:23px;cursor:pointer}.sp-share-emoji-toggle:hover{background:#3a3b3c}
.sp-share-emoji-picker{position:absolute;z-index:12;right:0;top:38px;display:flex;gap:2px;padding:6px;border:1px solid #4c4d4f;border-radius:10px;background:#2d2e30;box-shadow:0 8px 25px rgba(0,0,0,.3)}.sp-share-emoji-picker[hidden]{display:none!important}.sp-share-emoji-picker button{width:31px;height:31px;border:0;border-radius:7px;background:transparent;font-size:20px;cursor:pointer}.sp-share-emoji-picker button:hover{background:#3a3b3c}
.sp-share-public-note{margin:5px 0 10px;padding:8px 10px;border-radius:8px;background:#3b3122;color:#f8d29a;font-size:10px;line-height:1.4}.sp-share-public-note[hidden]{display:none!important}
.sp-share-now{width:152px;min-height:37px;margin-left:auto;display:block;border:0;border-radius:7px;background:#0866ff;color:#fff;font-size:13px;font-weight:800;cursor:pointer}.sp-share-now:hover{background:#1877f2}.sp-share-now:disabled{opacity:.48;cursor:not-allowed}
.sp-share-messenger,.sp-share-destinations,.sp-share-friend-profile{padding:15px 12px;border-bottom:1px solid #3e4042}
.sp-share-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.sp-share-section-title h4,.sp-share-destinations>h4{margin:0;color:#e4e6eb;font-size:15px}.sp-share-section-title>span{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#3a3b3c;color:#d9dde3}.sp-share-section-title>span .sp-icon{width:16px;height:16px}.sp-share-section-title>div>small{display:block;margin-top:2px;color:#b0b3b8;font-size:9px}.sp-share-section-title>button{width:28px;height:28px;border:0;border-radius:50%;background:#3a3b3c;color:#b0b3b8;cursor:pointer}
.sp-share-contact-shell{position:relative;margin-top:12px;padding:0 18px}.sp-share-contacts{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}.sp-share-contacts::-webkit-scrollbar{display:none}
.sp-share-contact{width:72px;flex:0 0 72px;padding:0;border:0;background:transparent;color:#e4e6eb;text-align:center;cursor:pointer;scroll-snap-align:start}.sp-share-contact>span{position:relative;width:54px;height:54px;margin:0 auto 5px;display:block}.sp-share-contact img{width:54px;height:54px;display:block;border-radius:50%;object-fit:cover}.sp-share-contact>span>i{position:absolute;right:1px;bottom:2px;width:10px;height:10px;border:2px solid #242526;border-radius:50%;background:#31a24c}.sp-share-contact>span>b{position:absolute;right:-1px;top:-1px;width:19px;height:19px;display:none;place-items:center;border:2px solid #242526;border-radius:50%;background:#31a24c;color:#fff;font-size:10px}.sp-share-contact.is-sent>span>b{display:grid}.sp-share-contact.is-sending{opacity:.52}.sp-share-contact:disabled{opacity:.35;cursor:not-allowed}.sp-share-contact.is-sent{opacity:1}.sp-share-contact>small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#e4e6eb;font-size:10px;line-height:1.15}
.sp-share-contact-arrow{position:absolute;z-index:5;top:11px;width:37px;height:37px;border:0;border-radius:50%;background:#4b4c4e;color:#e4e6eb;font-size:28px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.28)}.sp-share-contact-arrow.is-prev{left:-6px}.sp-share-contact-arrow.is-next{right:-6px}
.sp-share-contact-loading{min-width:100%;padding:18px;color:#b0b3b8;font-size:11px;text-align:center}
.sp-share-destination-row{margin-top:14px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.sp-share-destination-row>button{min-width:0;padding:0;display:flex;flex-direction:column;align-items:center;gap:7px;border:0;background:transparent;color:#e4e6eb;cursor:pointer}.sp-share-destination-row>button:disabled{opacity:.35;cursor:not-allowed}.sp-share-destination-row>button>span{width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:#3a3b3c;color:#e4e6eb}.sp-share-destination-row>button>span.is-messenger{background:#0084ff;color:#fff}.sp-share-destination-row>button>span.is-whatsapp{background:#25d366;color:#fff}.sp-share-destination-row .sp-icon{width:27px;height:27px}.sp-share-destination-row small{min-height:24px;color:#e4e6eb;font-size:9.5px;line-height:1.15;text-align:center}
.sp-share-friend-profile[hidden]{display:none!important}.sp-share-friend-list{margin-top:10px;display:grid;gap:4px;max-height:220px;overflow:auto}.sp-share-friend-list>button{min-height:50px;padding:5px 7px;display:flex;align-items:center;gap:9px;border:0;border-radius:8px;background:transparent;color:#e4e6eb;text-align:left;cursor:pointer}.sp-share-friend-list>button:hover{background:#3a3b3c}.sp-share-friend-list>button:disabled{opacity:.45}.sp-share-friend-list img{width:38px;height:38px;border-radius:50%;object-fit:cover}.sp-share-friend-list strong,.sp-share-friend-list small{display:block}.sp-share-friend-list strong{font-size:11px}.sp-share-friend-list small{margin-top:2px;color:#b0b3b8;font-size:9px}
.sp-share-status{min-height:0;padding:0 12px;color:#b0b3b8;font-size:10px;text-align:center}.sp-share-status:not(:empty){padding-top:9px;padding-bottom:9px}.sp-share-status.is-success{color:#62cf85}.sp-share-status.is-error{color:#ff8a8a}

/* Reshared original card. */
.sp-shared-post-card{margin:10px 12px 12px;display:block;overflow:hidden;border:1px solid #d8dde5;border-radius:11px;background:#fff;color:#172033}.sp-post-card>.sp-shared-post-card{margin-left:0;margin-right:0}.sp-dialog-side-pane>.sp-shared-post-card{margin-left:0;margin-right:0;border-left:0;border-right:0;border-radius:0}
.sp-shared-post-author{padding:10px 11px 5px;display:flex;align-items:center;gap:8px}.sp-shared-post-author img{width:31px;height:31px;border-radius:50%;object-fit:cover}.sp-shared-post-author strong,.sp-shared-post-author small{display:block}.sp-shared-post-author strong{color:#172033;font-size:11px}.sp-shared-post-author small{margin-top:1px;color:#667085;font-size:8.5px}
.sp-shared-post-title{padding:4px 11px 0;color:#172033;font-size:12px;font-weight:750}.sp-shared-post-text{padding:4px 11px 10px;color:#475467;font-size:10px;line-height:1.35}
.sp-shared-post-preview{position:relative;width:100%;min-height:190px;max-height:360px;display:grid;place-items:center;overflow:hidden;background:#111820}.sp-shared-post-preview img{width:100%;height:100%;max-height:360px;display:block;object-fit:cover}.sp-shared-post-preview>span{position:absolute;left:50%;top:50%;width:48px;height:48px;transform:translate(-50%,-50%);display:grid;place-items:center;border:2px solid #fff;border-radius:50%;background:rgba(0,0,0,.4);color:#fff}.sp-shared-post-preview>span .sp-icon{width:25px;height:25px}.sp-shared-post-preview.is-placeholder{min-height:150px}.sp-shared-post-preview.is-placeholder small{margin-top:58px;color:#d0d5dd;font-size:10px}
.sp-shared-post-card.is-unavailable{padding:16px;display:flex;flex-direction:column;gap:3px;background:#f5f6f7}.sp-shared-post-card.is-unavailable strong{font-size:11px}.sp-shared-post-card.is-unavailable span{color:#667085;font-size:9px}

/* Messenger rich post share. */
.sp-chat-shared-post{width:min(280px,100%);margin-bottom:4px;display:block;overflow:hidden;border:1px solid #d8dde5;border-radius:13px;background:#fff;color:#172033;text-align:left}.sp-chat-shared-author{padding:8px 9px 5px;display:flex;align-items:center;gap:6px}.sp-chat-shared-author img{width:25px;height:25px;border-radius:50%;object-fit:cover}.sp-chat-shared-author b{font-size:9.5px;color:#172033}.sp-chat-shared-media{position:relative;width:100%;height:130px;display:grid;place-items:center;overflow:hidden;background:#14191f}.sp-chat-shared-media img{width:100%;height:100%;object-fit:cover}.sp-chat-shared-media>i{position:absolute;width:38px;height:38px;display:grid;place-items:center;border:2px solid #fff;border-radius:50%;background:rgba(0,0,0,.38);color:#fff;font-style:normal}.sp-chat-shared-media>i .sp-icon{width:20px;height:20px}.sp-chat-shared-post>strong{display:block;padding:7px 9px 2px;color:#172033;font-size:10.5px}.sp-chat-shared-post>small{display:block;padding:0 9px 8px;color:#667085;font-size:8.5px;line-height:1.3}

/* Shared text post in Story. */
.sp-story-preview.is-shared{display:grid;place-items:center;background:linear-gradient(145deg,#5d2cde,#1677ff)!important}.sp-story-share-badge{display:flex;flex-direction:column;align-items:center;gap:4px;color:#fff}.sp-story-share-badge .sp-icon{width:27px;height:27px}.sp-story-share-badge small{font-size:8px;font-weight:800}
.sp-story-shared-post-card{width:min(390px,86vw);max-height:66vh;padding:18px;display:flex;flex-direction:column;justify-content:center;overflow:auto;border:1px solid rgba(255,255,255,.25);border-radius:18px;background:#fff;color:#172033;box-shadow:0 18px 50px rgba(0,0,0,.35)}.sp-story-shared-author{display:flex;align-items:center;gap:9px;margin-bottom:16px}.sp-story-shared-author img{width:39px;height:39px;border-radius:50%;object-fit:cover}.sp-story-shared-author strong,.sp-story-shared-author small{display:block}.sp-story-shared-author strong{font-size:12px}.sp-story-shared-author small{margin-top:2px;color:#667085;font-size:9px}.sp-story-shared-title{font-size:20px;font-weight:800;line-height:1.2}.sp-story-shared-text{margin-top:8px;color:#475467;font-size:12px;line-height:1.45}.sp-story-shared-open{margin-top:18px;align-self:flex-start;padding:8px 13px;border-radius:8px;background:#0866ff;color:#fff;font-size:10px;font-weight:800}

@media(max-width:600px){
  .sp-share-modal{align-items:flex-end;padding:0}
  .sp-share-dialog{width:100%;max-height:94dvh;border-left:0;border-right:0;border-bottom:0;border-radius:15px 15px 0 0}
  .sp-share-head{height:56px}
  .sp-share-destination-row{grid-template-columns:repeat(5,70px);overflow-x:auto;justify-content:start}
  .sp-share-destination-row>button>span{width:52px;height:52px}
  .sp-share-contact-shell{padding:0 12px}
  .sp-share-contact-arrow{display:none}
  .sp-share-contacts{gap:8px}
  .sp-shared-post-preview{min-height:170px}
}


/* ==========================================================
   V3.8.6 — shared playable video + creator profile
   ========================================================== */
.sp-shared-post-card{
  text-decoration:none;
}
.sp-shared-post-card.has-playable-video{
  overflow:visible;
}
.sp-shared-post-author{
  position:relative;
}
.sp-shared-post-author-avatar{
  flex:0 0 31px;
  display:block;
}
.sp-shared-post-creator{
  display:block;
  color:#172033;
  font-size:11px;
  font-weight:800;
  line-height:1.2;
  text-decoration:none;
}
.sp-shared-post-creator:hover,
.sp-shared-post-profile-link:hover,
.sp-shared-post-footer a:hover{
  text-decoration:underline;
}
.sp-shared-post-profile-link{
  margin-left:auto;
  padding:6px 9px;
  border-radius:7px;
  background:#eef4ff;
  color:#0866ff;
  font-size:9px;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
}
.sp-shared-post-copy{
  display:block;
  color:inherit;
  text-decoration:none;
}
.sp-shared-post-media{
  width:100%;
  overflow:hidden;
  background:#000;
}
.sp-shared-post-video .sp-media-item{
  width:100%;
  min-height:320px;
  aspect-ratio:16/9;
  border-radius:0;
  overflow:hidden;
}
.sp-shared-post-video .sp-media-el{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}
.sp-shared-post-video .sp-video-controls{
  left:10px;
  right:10px;
}
.sp-shared-post-footer{
  padding:9px 11px 10px;
  border-top:1px solid #eaecf0;
  background:#fff;
}
.sp-shared-post-footer a{
  color:#0866ff;
  font-size:9.5px;
  font-weight:800;
  text-decoration:none;
}

/* Messenger icon is a rounded chat bubble with a lightning mark. */
.sp-icon-message{
  stroke-width:1.85!important;
}
.sp-messages-nav .sp-icon-message,
.sp-mobile-message-link .sp-icon-message{
  width:23px!important;
  height:23px!important;
}
.sp-messages-nav.active .sp-icon-message,
.sp-mobile-message-link.active .sp-icon-message{
  color:#0866ff;
}

/* ==========================================================
   V3.8.6 — Messenger page stability and visual repair
   ========================================================== */
body.sp-messages-route{
  background:#f0f2f5!important;
}
body.sp-messages-route .sp-shell{
  width:min(1380px,100%)!important;
  margin:0 auto!important;
}
.sp-messages-page{
  display:block;
}
.sp-messenger-shell{
  height:calc(100dvh - 92px);
  max-height:850px;
  min-height:580px;
  border-radius:16px;
  border:1px solid #d8dde5;
  box-shadow:0 8px 30px rgba(15,23,42,.09);
}
.sp-messenger-sidebar-head{
  min-height:72px;
  padding:14px 14px 9px;
}
.sp-messenger-brand-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}
.sp-messenger-brand-icon{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,#8a5cff,#0866ff);
  color:#fff;
  box-shadow:0 5px 14px rgba(8,102,255,.22);
}
.sp-messenger-brand-icon .sp-icon{
  width:23px;
  height:23px;
}
.sp-messenger-brand-title>div>span{
  font-size:9px;
}
.sp-messenger-brand-title h1{
  margin-top:0;
  font-size:22px;
}
.sp-chat-head-actions button .sp-icon,
.sp-chat-back .sp-icon,
.sp-chat-send .sp-icon{
  width:19px;
  height:19px;
}
.sp-chat-send{
  display:grid!important;
  place-items:center!important;
}
.sp-chat-back{
  place-items:center;
}
.sp-chat-error{
  margin:auto;
  max-width:420px;
  padding:13px 15px;
  border-radius:10px;
  background:#fff0f0;
  color:#b42318;
  font-size:11px;
  text-align:center;
}
.sp-chat-shared-post{
  text-decoration:none;
}
.sp-chat-shared-author{
  color:#172033;
  text-decoration:none;
}
.sp-chat-shared-author>span{
  min-width:0;
}
.sp-chat-shared-author b,
.sp-chat-shared-author em{
  display:block;
}
.sp-chat-shared-author em{
  margin-top:1px;
  color:#0866ff;
  font-size:7.8px;
  font-style:normal;
  font-weight:700;
}
.sp-chat-shared-copy{
  display:block;
  color:inherit;
  text-decoration:none;
}
.sp-chat-shared-copy>strong{
  display:block;
  padding:7px 9px 2px;
  color:#172033;
  font-size:10.5px;
}
.sp-chat-shared-copy>small{
  display:block;
  padding:0 9px 8px;
  color:#667085;
  font-size:8.5px;
  line-height:1.3;
}
@media(max-width:760px){
  body.sp-messages-route .sp-shell{
    width:100%!important;
  }
  .sp-messenger-shell{
    height:calc(100dvh - 60px - 64px);
    min-height:0;
    max-height:none;
    border-radius:0;
    border:0;
    box-shadow:none;
  }
  .sp-messenger-sidebar-head{
    min-height:66px;
    padding:11px 12px 8px;
  }
  .sp-messenger-brand-icon{
    width:36px;
    height:36px;
    flex-basis:36px;
  }
  .sp-shared-post-video .sp-media-item{
    min-height:220px;
    aspect-ratio:16/9;
  }
  .sp-shared-post-profile-link{
    padding:5px 7px;
    font-size:8px;
  }
}


/* Mobile slide menu */
.sp-mobile-menu-toggle,.sp-mobile-drawer,.sp-mobile-drawer-backdrop{display:none}
@media (max-width: 820px){
  .sp-mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #e4e9f1;border-radius:50%;background:#fff;color:#556273;box-shadow:0 8px 24px rgba(15,23,42,.06);transition:.18s ease}
  .sp-mobile-menu-toggle:active,.sp-mobile-menu-toggle:hover{background:#f4f7fb;color:#1f2937}
  .sp-mobile-menu-toggle .sp-icon{width:20px;height:20px}
  .sp-topbar-inner{gap:10px}
  .sp-mobile-drawer-backdrop{position:fixed;inset:0;z-index:140;background:rgba(10,18,30,.48);backdrop-filter:blur(3px)}
  .sp-mobile-drawer{display:flex;position:fixed;z-index:150;top:0;left:0;bottom:0;width:min(86vw,340px);max-width:340px;flex-direction:column;background:#fff;border-right:1px solid #e6ebf2;box-shadow:0 25px 65px rgba(15,23,42,.22);transform:translateX(-105%);transition:transform .24s ease;overflow:hidden}
  body.sp-mobile-drawer-open .sp-mobile-drawer{transform:translateX(0)}
  body.sp-mobile-drawer-open .sp-mobile-drawer-backdrop{display:block}
  body.sp-mobile-drawer-open{overflow:hidden}
  .sp-mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 16px 14px;border-bottom:1px solid #edf1f6}
  .sp-mobile-drawer-brand{display:flex;align-items:center;gap:12px;min-width:0}
  .sp-mobile-drawer-brand .sp-brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;box-shadow:0 10px 24px rgba(8,102,255,.18)}
  .sp-mobile-drawer-brand strong{display:block;font-size:16px;color:#152033;line-height:1.15}
  .sp-mobile-drawer-brand small{display:block;margin-top:3px;font-size:12px;color:#7a8798}
  .sp-mobile-drawer-close{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e4e9f1;border-radius:50%;background:#f7f9fc;color:#516074}
  .sp-mobile-drawer-close .sp-icon{width:18px;height:18px}
  .sp-mobile-drawer-profile{padding:14px 16px;border-bottom:1px solid #edf1f6}
  .sp-mobile-drawer-profile a{display:flex;align-items:center;gap:12px;padding:10px;border-radius:16px;background:#f8fbff;color:#162132;border:1px solid #e8eef8}
  .sp-mobile-drawer-profile .sp-avatar{width:52px!important;height:52px!important;flex:0 0 52px}
  .sp-mobile-drawer-profile strong{display:block;font-size:15px;line-height:1.2}
  .sp-mobile-drawer-profile small{display:block;margin-top:4px;font-size:12px;color:#768296}
  .sp-mobile-drawer-profile i{margin-left:auto;color:#9ba6b4;display:inline-flex}
  .sp-mobile-drawer-profile i .sp-icon{width:17px;height:17px}
  .sp-mobile-drawer-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px;overflow:auto}
  .sp-mobile-drawer-nav a{display:flex;align-items:center;gap:10px;min-height:54px;padding:0 12px;border-radius:16px;background:#fff;border:1px solid #e7ecf3;color:#1c2737;box-shadow:0 6px 18px rgba(15,23,42,.04)}
  .sp-mobile-drawer-nav a .sp-icon{width:20px;height:20px;color:#0866ff;flex:0 0 20px}
  .sp-mobile-drawer-nav a span{font-size:13px;font-weight:700;line-height:1.2}
  .sp-mobile-drawer-actions{margin-top:auto;padding:16px;border-top:1px solid #edf1f6;display:grid;gap:10px;background:#fff}
  .sp-mobile-drawer-primary,.sp-mobile-drawer-secondary{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;border-radius:14px;font-size:14px;font-weight:800}
  .sp-mobile-drawer-primary{background:#0866ff;color:#fff}
  .sp-mobile-drawer-secondary{background:#f5f7fb;color:#1f2d40;border:1px solid #e4e9f1}
}
@media (min-width: 821px){
  .sp-mobile-drawer-backdrop,.sp-mobile-drawer,.sp-mobile-menu-toggle{display:none!important}
}


/* ==========================================================
   V3.8.8 — Messenger icon/profile navigation + mobile drawer UX
   ========================================================== */
/* Messenger: crisp white icon on the Messenger brand/active circle. */
.sp-messenger-brand-icon .sp-icon-messenger{
  width:24px!important;
  height:24px!important;
  color:#fff!important;
  stroke:#fff!important;
  stroke-width:2.15!important;
}
.sp-messages-nav .sp-icon-messenger,
.sp-mobile-message-link .sp-icon-messenger{
  width:23px!important;
  height:23px!important;
  stroke-width:2.05!important;
}
.sp-messages-nav.active{
  background:#0866ff!important;
  color:#fff!important;
}
.sp-messages-nav.active .sp-icon-messenger{
  color:#fff!important;
  stroke:#fff!important;
}
.sp-mobile-message-link.active .sp-icon-messenger{color:#0866ff!important}
.sp-profile-message-btn .sp-icon-messenger{width:18px;height:18px;color:#0866ff;stroke-width:2.05}

/* Messenger profile identity is explicitly clickable. */
.sp-chat-person,[data-chat-person-link],.sp-chat-profile-intro-main,.sp-chat-profile-view{position:relative;z-index:4;pointer-events:auto!important;cursor:pointer}
.sp-chat-person:hover strong{text-decoration:underline}
.sp-chat-profile-intro-main{display:flex;flex-direction:column;align-items:center;color:inherit;text-decoration:none}
.sp-chat-profile-intro-main img{transition:transform .18s ease,box-shadow .18s ease}
.sp-chat-profile-intro-main:hover img{transform:scale(1.035);box-shadow:0 0 0 4px rgba(8,102,255,.10)}
.sp-chat-profile-view{margin-top:7px;color:#0866ff;font-size:10px;font-weight:800;text-decoration:none}
.sp-chat-profile-view:hover{text-decoration:underline}

@media(max-width:820px){
  /* Header menu trigger */
  .sp-mobile-menu-toggle{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    flex:0 0 42px;
    border:1px solid #e4e9f1;
    border-radius:50%;
    background:#f7f9fc;
    color:#526173;
    box-shadow:0 6px 18px rgba(15,23,42,.06);
    transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
  }
  .sp-mobile-menu-toggle:hover{background:#edf3fb;color:#0866ff;box-shadow:0 9px 24px rgba(15,23,42,.09)}
  .sp-mobile-menu-toggle:active{transform:scale(.94)}

  /* Smoother backdrop + drawer motion. */
  .sp-mobile-drawer-backdrop,
  .sp-mobile-drawer-backdrop[hidden]{
    display:block!important;
    position:fixed;
    inset:0;
    z-index:140;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    background:rgba(10,18,30,.52);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    transition:opacity .28s ease,visibility .28s ease;
  }
  body.sp-mobile-drawer-open .sp-mobile-drawer-backdrop{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  .sp-mobile-drawer{
    display:flex!important;
    position:fixed;
    z-index:150;
    top:0;
    left:0;
    bottom:0;
    width:min(88vw,360px);
    max-width:360px;
    flex-direction:column;
    overflow:hidden;
    border-right:1px solid #e5eaf1;
    background:#fff;
    color:#172033;
    box-shadow:0 28px 80px rgba(15,23,42,.28);
    transform:translate3d(-104%,0,0) scale(.985);
    opacity:.98;
    will-change:transform;
    transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .24s ease;
  }
  body.sp-mobile-drawer-open .sp-mobile-drawer{transform:translate3d(0,0,0) scale(1);opacity:1}
  body.sp-mobile-drawer-open{overflow:hidden;touch-action:none}

  .sp-mobile-drawer-head{min-height:74px;padding:15px 15px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf1f6;background:inherit}
  .sp-mobile-drawer-head-actions{display:flex;align-items:center;gap:7px}
  .sp-mobile-theme-toggle,.sp-mobile-drawer-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid #e4e9f1;border-radius:50%;background:#f6f8fb;color:#536173;cursor:pointer;transition:transform .16s ease,background .16s ease,color .16s ease}
  .sp-mobile-theme-toggle:hover,.sp-mobile-drawer-close:hover{background:#edf3fb;color:#0866ff}
  .sp-mobile-theme-toggle:active,.sp-mobile-drawer-close:active{transform:scale(.92)}
  .sp-mobile-theme-toggle .sp-icon,.sp-mobile-drawer-close .sp-icon{width:18px;height:18px}
  .sp-mobile-theme-toggle .is-dark-icon{display:none}

  .sp-mobile-drawer-profile{padding:12px 14px 8px;border:0}
  .sp-mobile-drawer-profile a{position:relative;display:flex;align-items:center;gap:12px;padding:11px;border:1px solid #e6edf7;border-radius:17px;background:linear-gradient(135deg,#f8fbff,#f2f7ff);color:#172033;box-shadow:0 7px 20px rgba(15,23,42,.045);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
  .sp-mobile-drawer-profile a:hover{transform:translateY(-1px);border-color:#c8ddff;box-shadow:0 10px 24px rgba(8,102,255,.09)}
  .sp-mobile-drawer-profile.is-active a{border-color:#9dc3ff;background:#eaf3ff;box-shadow:inset 3px 0 0 #0866ff,0 8px 22px rgba(8,102,255,.08)}

  .sp-mobile-drawer-nav{display:block!important;min-height:0;flex:1;overflow-y:auto;padding:8px 12px 16px;scrollbar-width:none}
  .sp-mobile-drawer-nav::-webkit-scrollbar{display:none}
  .sp-mobile-menu-section{margin:4px 0 8px;border:1px solid #e8edf4;border-radius:16px;background:#fbfcfe;overflow:hidden;transition:border-color .18s ease,background .18s ease}
  .sp-mobile-menu-section-toggle{width:100%;height:44px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;color:#5c697b;font-size:11px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;cursor:pointer}
  .sp-mobile-menu-section-toggle i{display:grid;place-items:center;transition:transform .3s cubic-bezier(.22,1,.36,1)}
  .sp-mobile-menu-section-toggle i .sp-icon{width:16px;height:16px}
  .sp-mobile-menu-section.is-open .sp-mobile-menu-section-toggle i{transform:rotate(90deg)}
  .sp-mobile-menu-collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1)}
  .sp-mobile-menu-section.is-open .sp-mobile-menu-collapse{grid-template-rows:1fr}
  .sp-mobile-menu-grid{min-height:0;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 9px;transition:padding .28s ease}
  .sp-mobile-menu-section.is-open .sp-mobile-menu-grid{padding-bottom:10px}
  .sp-mobile-menu-grid a{position:relative;min-height:56px;padding:0 11px;display:flex;align-items:center;gap:9px;border:1px solid #e7edf5;border-radius:14px;background:#fff;color:#263446;box-shadow:0 4px 12px rgba(15,23,42,.025);transform:translateY(-3px);opacity:.72;transition:transform .22s ease,opacity .22s ease,background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
  .sp-mobile-menu-section.is-open .sp-mobile-menu-grid a{transform:translateY(0);opacity:1}
  .sp-mobile-menu-grid a:hover{transform:translateY(-1px);border-color:#cbd9eb;background:#f7faff}
  .sp-mobile-menu-grid a>.sp-icon{width:21px;height:21px;flex:0 0 21px;color:#617085;transition:color .18s ease,transform .18s ease}
  .sp-mobile-menu-grid a>span{min-width:0;font-size:12.5px;font-weight:780;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sp-mobile-menu-grid a.is-active{border-color:#a9caff;background:#eaf3ff;color:#0759df;box-shadow:inset 3px 0 0 #0866ff,0 7px 18px rgba(8,102,255,.07)}
  .sp-mobile-menu-grid a.is-active>.sp-icon{color:#0866ff;transform:scale(1.05)}

  /* Better numeric badges. */
  .sp-drawer-badge{position:absolute;top:7px;right:7px;min-width:20px;height:20px;padding:0 5px;display:flex;align-items:center;justify-content:center;border:2px solid #fff;border-radius:999px;background:#e41e3f;color:#fff;font-size:9px;font-style:normal;font-weight:900;line-height:1;box-shadow:0 4px 10px rgba(228,30,63,.25)}
  .sp-drawer-badge[hidden]{display:none!important}
  .sp-mobile-menu-grid a.is-active .sp-drawer-badge{border-color:#eaf3ff}

  .sp-mobile-drawer-actions{margin-top:auto;padding:12px 14px calc(14px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1.4fr 1fr;gap:9px;border-top:1px solid #edf1f6;background:inherit}
  .sp-mobile-drawer-actions .sp-mobile-drawer-primary,.sp-mobile-drawer-actions .sp-mobile-drawer-secondary{min-height:46px;padding:0 11px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12.5px;font-weight:850;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}
  .sp-mobile-drawer-actions .sp-mobile-drawer-primary{border:0;background:#0866ff;color:#fff;box-shadow:0 8px 18px rgba(8,102,255,.18)}
  .sp-mobile-drawer-actions .sp-mobile-drawer-secondary{border:1px solid #e2e8f0;background:#f5f7fb;color:#263446}
  .sp-mobile-drawer-actions .sp-mobile-drawer-primary:active,.sp-mobile-drawer-actions .sp-mobile-drawer-secondary:active{transform:scale(.97)}

  /* Drawer-only dark mode. Keeps the main site unchanged. */
  .sp-mobile-drawer.is-dark{background:#18191a;color:#e4e6eb;border-right-color:#343536}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-head{border-color:#343536}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-brand strong{color:#f2f3f5}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-brand small{color:#aeb3ba}
  .sp-mobile-drawer.is-dark .sp-mobile-theme-toggle,.sp-mobile-drawer.is-dark .sp-mobile-drawer-close{border-color:#3e4042;background:#2d2e30;color:#d9dce1}
  .sp-mobile-drawer.is-dark .sp-mobile-theme-toggle .is-light-icon{display:none}
  .sp-mobile-drawer.is-dark .sp-mobile-theme-toggle .is-dark-icon{display:inline-grid}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-profile a{border-color:#36383b;background:#242526;color:#f0f2f5;box-shadow:none}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-profile.is-active a{border-color:#2d88ff;background:#26384f;box-shadow:inset 3px 0 0 #2d88ff}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-profile small{color:#b0b3b8}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-section{border-color:#353638;background:#202122}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-section-toggle{color:#aeb2b8}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a{border-color:#393b3d;background:#292a2c;color:#e4e6eb;box-shadow:none}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a:hover{border-color:#4a4c4f;background:#333436}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a>.sp-icon{color:#c1c5cb}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a.is-active{border-color:#2d88ff;background:#26384f;color:#8db9ff;box-shadow:inset 3px 0 0 #2d88ff}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a.is-active>.sp-icon{color:#5da0ff}
  .sp-mobile-drawer.is-dark .sp-drawer-badge{border-color:#292a2c}
  .sp-mobile-drawer.is-dark .sp-mobile-menu-grid a.is-active .sp-drawer-badge{border-color:#26384f}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-actions{border-color:#343536}
  .sp-mobile-drawer.is-dark .sp-mobile-drawer-secondary{border-color:#3e4042;background:#2d2e30;color:#e4e6eb}
}


/* V3.8.9 Messenger: profile tap is separate from opening a thread. */
.sp-messenger-conversations .sp-conversation-row{
  position:relative;
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
}
.sp-messenger-conversations .sp-conversation-row>.sp-conversation-avatar{
  position:relative;
  z-index:3;
  flex:0 0 auto;
  cursor:pointer;
  border-radius:50%;
}
.sp-messenger-conversations .sp-conversation-row>.sp-conversation-avatar:hover img{
  box-shadow:0 0 0 3px rgba(8,102,255,.16);
}
.sp-messenger-conversations .sp-conversation-open{
  min-width:0;
  flex:1 1 auto;
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.sp-messenger-conversations .sp-conversation-open:disabled{
  cursor:not-allowed;
  opacity:.55;
}
.sp-messenger-conversations .sp-conversation-row.is-disabled{
  opacity:.72;
}


/* ==========================================================
   V3.9.0 — Messenger icon contrast + reliable conversation hit targets
   ========================================================== */
.sp-nav-icons>a.sp-messages-nav{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  border:1px solid #e2e7ee!important;
  border-radius:50%!important;
  background:#f0f2f5!important;
  color:#4d5b6d!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
.sp-nav-icons>a.sp-messages-nav .sp-icon-messenger{
  width:23px!important;
  height:23px!important;
  color:#4d5b6d!important;
  stroke:#4d5b6d!important;
  stroke-width:2.25!important;
  opacity:1!important;
}
.sp-nav-icons>a.sp-messages-nav:hover{
  background:#e7edf6!important;
  border-color:#d7dfeb!important;
  color:#0866ff!important;
  transform:translateY(-1px)!important;
}
.sp-nav-icons>a.sp-messages-nav:hover .sp-icon-messenger{
  color:#0866ff!important;
  stroke:#0866ff!important;
}
.sp-nav-icons>a.sp-messages-nav.active{
  background:linear-gradient(145deg,#6d5cff,#0866ff)!important;
  border-color:transparent!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(8,102,255,.25)!important;
}
.sp-nav-icons>a.sp-messages-nav.active .sp-icon-messenger{
  color:#fff!important;
  stroke:#fff!important;
  opacity:1!important;
}
.sp-messenger-brand-icon .sp-icon-messenger,
.sp-messenger-empty-icon .sp-icon-messenger{
  color:#fff!important;
  stroke:#fff!important;
  stroke-width:2.2!important;
}

.sp-messenger-conversations .sp-conversation-row{
  min-height:66px;
  padding:7px 8px!important;
  border-radius:10px;
  cursor:default!important;
  transition:background .14s ease,box-shadow .14s ease!important;
}
.sp-messenger-conversations .sp-conversation-row:hover,
.sp-messenger-conversations .sp-conversation-row.is-selected{
  background:#edf4ff!important;
}
.sp-messenger-conversations .sp-conversation-row.is-selected{
  box-shadow:inset 3px 0 0 #0866ff!important;
}
.sp-messenger-conversations .sp-conversation-open{
  min-height:52px;
  text-decoration:none!important;
  border-radius:8px;
  cursor:pointer!important;
  -webkit-tap-highlight-color:transparent;
}
.sp-messenger-conversations .sp-conversation-open:hover{
  text-decoration:none!important;
}
.sp-messenger-conversations .sp-conversation-open.is-disabled{
  cursor:not-allowed!important;
  opacity:.55;
}
.sp-messenger-conversations .sp-conversation-avatar{
  -webkit-tap-highlight-color:transparent;
}
.sp-messenger-conversations .sp-conversation-avatar:focus-visible,
.sp-messenger-conversations .sp-conversation-open:focus-visible{
  outline:2px solid #0866ff;
  outline-offset:2px;
}

@media(max-width:800px){
  .sp-nav-icons>a.sp-messages-nav{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
  }
  .sp-mobile-message-link .sp-icon-messenger{
    color:#5d6878!important;
    stroke:#5d6878!important;
    stroke-width:2.2!important;
  }
  .sp-mobile-message-link.active .sp-icon-messenger{
    color:#0866ff!important;
    stroke:#0866ff!important;
  }
}


/* V3.9.1 Messenger reliable thread bootstrap */
.sp-messenger-empty[hidden]{display:none!important}
.sp-messenger-bootstrap-error{position:absolute;left:50%;top:16px;z-index:5;transform:translateX(-50%);max-width:min(90%,520px);padding:9px 12px;border:1px solid #ffd0d5;border-radius:9px;background:#fff1f3;color:#b42335;font-size:11px;box-shadow:0 5px 18px rgba(16,24,40,.08)}
.sp-conversation-row.is-selected{background:#e7f3ff!important}
.sp-conversation-row.is-selected .sp-conversation-copy strong{color:#0866ff}


/* ==========================================================
   V3.9.3 — mobile header matched to supplied reference
   Logo | circular menu | rounded Search twittsocial.com pill
   ========================================================== */
@media (max-width: 800px) {
  body.logged-in .sp-topbar {
    height: 58px !important;
    min-height: 58px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #edf0f4 !important;
    box-shadow: 0 1px 7px rgba(15,23,42,.08) !important;
  }

  body.logged-in .sp-topbar-inner {
    height: 58px !important;
    min-height: 58px !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: 38px 38px minmax(0,1fr) !important;
    grid-template-areas: "brand menu search" !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 0 9px !important;
  }

  body.logged-in .sp-brand {
    grid-area: brand !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: grid !important;
    place-items: center !important;
    overflow: visible !important;
  }

  body.logged-in .sp-brand-mark {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 12px !important;
    background: #0866ff !important;
    color: #ffffff !important;
    box-shadow: 0 3px 9px rgba(8,102,255,.22) !important;
  }

  body.logged-in .sp-brand-mark .sp-icon {
    width: 34px !important;
    height: 34px !important;
  }

  body.logged-in .sp-brand-text { display: none !important; }

  body.logged-in .sp-mobile-menu-toggle {
    grid-area: menu !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #f0f2f5 !important;
    color: #65676b !important;
    box-shadow: none !important;
    transition: background .16s ease, color .16s ease, transform .12s ease !important;
  }

  body.logged-in .sp-mobile-menu-toggle .sp-icon {
    width: 18px !important;
    height: 18px !important;
    stroke-width: 2.15 !important;
  }

  body.logged-in .sp-mobile-menu-toggle:hover,
  body.logged-in .sp-mobile-menu-toggle:focus-visible {
    background: #e4e6eb !important;
    color: #3a3b3c !important;
    outline: none !important;
  }

  body.logged-in .sp-mobile-menu-toggle:active {
    transform: scale(.93) !important;
  }

  body.logged-in .sp-search {
    grid-area: search !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f0f2f5 !important;
    box-shadow: none !important;
  }

  body.logged-in .sp-search:focus-within {
    background: #eef1f5 !important;
    border: 0 !important;
    box-shadow: inset 0 0 0 1.5px rgba(8,102,255,.22) !important;
  }

  body.logged-in .sp-search .sp-icon,
  body.logged-in .sp-search .sp-search-svg {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px !important;
    color: #65676b !important;
    stroke-width: 2 !important;
  }

  body.logged-in .sp-search input {
    min-width: 0 !important;
    height: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #1c1e21 !important;
    font-size: 12.5px !important;
    line-height: 36px !important;
  }

  body.logged-in .sp-search input::placeholder {
    color: #737b87 !important;
    opacity: 1 !important;
  }

  /* Reference header shows only logo/menu/search on mobile. Bottom navigation
     remains the main app navigation. */
  body.logged-in .sp-topbar .sp-nav-icons {
    display: none !important;
  }
}

@media (max-width: 380px) {
  body.logged-in .sp-topbar-inner {
    grid-template-columns: 36px 36px minmax(0,1fr) !important;
    gap: 7px !important;
    padding: 0 7px !important;
  }
  body.logged-in .sp-brand { width: 36px !important; min-width: 36px !important; }
  body.logged-in .sp-brand-mark,
  body.logged-in .sp-brand-mark .sp-icon { width: 32px !important; height: 32px !important; }
  body.logged-in .sp-mobile-menu-toggle { width: 34px !important; height: 34px !important; min-width: 34px !important; }
  body.logged-in .sp-search { height: 35px !important; padding: 0 10px !important; }
  body.logged-in .sp-search input { font-size: 12px !important; }
}

/* V4.0.0 — native twittsocial.com profile call actions */
.sp-profile-call-btn{gap:7px}
.sp-profile-call-btn .sp-icon{width:17px;height:17px}
.sp-profile-call-btn[data-sp-call-type="video"]{color:#0866ff}
.sp-profile-call-btn:hover{background:#edf4ff;color:#0866ff}
@media(max-width:700px){.sp-profile-call-btn span{display:none}.sp-profile-call-btn{width:42px;min-width:42px;padding:0;justify-content:center}}


/* V4.0.1 — resilient call device fallback */
.sp-call-audio-stage small[data-call-media-note]{margin-top:10px;max-width:420px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.1);color:#f3f6fb;font-size:11px;line-height:1.35;backdrop-filter:blur(8px)}
.sp-call-audio-stage small[data-call-media-note][hidden]{display:none!important}
.sp-call-controls button.is-unavailable,.sp-call-controls button:disabled{opacity:.42;cursor:not-allowed;filter:saturate(.35)}
.sp-call-layer[data-call-type="audio"] .sp-call-local-video{display:none!important}

/* V4.0.4 call audio clarity */
.sp-call-remote-audio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}


/* V4.1.3 — verification method chooser + live face liveness */
.sp-unlock-method-choice{display:grid;gap:22px}.sp-unlock-choice-head{text-align:center;max-width:680px;margin:0 auto}.sp-unlock-choice-head>span,.sp-unlock-panel-head>span{display:inline-flex;padding:7px 12px;border-radius:999px;background:#eef3ff;color:#315cf5;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.sp-unlock-choice-head h2,.sp-unlock-panel-head h2{margin:10px 0 7px;color:#111935;font-size:28px}.sp-unlock-choice-head p,.sp-unlock-panel-head p{margin:0;color:#697693;line-height:1.6}
.sp-unlock-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.sp-unlock-choice{appearance:none;text-align:left;border:1px solid #e0e7f7;border-radius:24px;background:linear-gradient(180deg,#fff,#f8faff);padding:22px;display:grid;gap:11px;cursor:pointer;color:#1a2548;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.sp-unlock-choice:hover{transform:translateY(-3px);border-color:#a9bcff;box-shadow:0 16px 34px rgba(38,62,134,.11)}.sp-unlock-choice.is-featured{background:linear-gradient(145deg,#f6f8ff,#eef0ff);border-color:#cfd7ff}.sp-unlock-choice-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#5272ff,#8a62f5);color:#fff;font-size:24px;font-weight:900}.sp-unlock-choice strong{font-size:19px}.sp-unlock-choice small{font-size:13px;line-height:1.55;color:#6c7895;min-height:42px}.sp-unlock-choice b{font-size:13px;color:#315cf5}
.sp-unlock-method-panel{display:grid;gap:18px}.sp-unlock-back{width:max-content;border:0;background:transparent;padding:5px 0;color:#315cf5;font-weight:800;cursor:pointer}.sp-unlock-panel-head{text-align:left;max-width:760px}.sp-unlock-panel-card{max-width:660px;border:1px solid #e5eaf8;border-radius:22px;padding:22px;background:#fbfcff;display:grid;gap:16px}
.sp-live-face-shell{display:grid;grid-template-columns:minmax(320px,560px) minmax(260px,1fr);gap:24px;align-items:center}.sp-live-face-camera{position:relative;aspect-ratio:1/1;border-radius:28px;overflow:hidden;background:radial-gradient(circle at 50% 35%,#273658,#0d1529 68%);box-shadow:0 20px 50px rgba(15,27,61,.2)}.sp-live-face-camera video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.sp-live-face-guide{position:absolute;inset:9%;display:grid;place-items:center;pointer-events:none}.sp-live-face-guide i{display:block;width:58%;height:76%;border:3px solid rgba(255,255,255,.88);border-radius:48% 48% 45% 45%/42% 42% 55% 55%;box-shadow:0 0 0 999px rgba(7,14,30,.24),0 0 30px rgba(82,114,255,.35)}.sp-live-face-idle{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#fff;gap:8px;background:radial-gradient(circle at 50% 40%,#2b3d69,#10182d 70%)}.sp-live-face-idle span{width:72px;height:72px;margin:0 auto 6px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);font-size:34px}.sp-live-face-idle strong{font-size:20px}.sp-live-face-idle small{opacity:.75}.sp-live-face-chip{position:absolute;left:16px;top:16px;z-index:4;max-width:70%;padding:8px 12px;border-radius:999px;background:rgba(7,14,30,.68);backdrop-filter:blur(12px);color:#fff;font-size:12px;font-weight:800}.sp-live-face-chip[data-state="good"]{background:rgba(15,130,86,.82)}.sp-live-face-chip[data-state="error"]{background:rgba(190,45,65,.84)}
.sp-live-face-side{display:grid;gap:14px}.sp-live-face-progress{border:1px solid #e5eaf7;border-radius:20px;padding:17px;background:#fbfcff}.sp-live-face-progress-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.sp-live-face-progress-head strong{color:#162144}.sp-live-face-progress-head span{color:#315cf5;font-weight:800}.sp-live-face-steps{display:grid;gap:9px}.sp-live-face-placeholder{padding:14px;border-radius:14px;background:#f2f5fb;color:#7a849d;font-size:13px}.sp-live-face-step{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:14px;background:#f4f6fb;color:#75809a}.sp-live-face-step span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e6ebf5;color:#6d7892;font-size:12px;font-weight:900}.sp-live-face-step strong{font-size:13px}.sp-live-face-step.is-current{background:#eef3ff;color:#2448d8;box-shadow:inset 0 0 0 1px #cbd8ff}.sp-live-face-step.is-current span{background:#315cf5;color:#fff}.sp-live-face-step.is-done{background:#eefbf5;color:#13724c}.sp-live-face-step.is-done span{background:#1e9d68;color:#fff}.sp-live-face-status{min-height:48px;padding:13px 14px;border-radius:15px;background:#f3f5f9;color:#5f6b86;font-size:13px;line-height:1.55}.sp-live-face-status[data-state="good"]{background:#edf9f3;color:#16744e}.sp-live-face-status[data-state="error"]{background:#fff1f2;color:#b42b42}.sp-live-face-start{width:100%;margin:0!important}.sp-live-face-stop{width:100%}.sp-live-face-note{margin:0;color:#7a849d;font-size:11px;line-height:1.55}
@media(max-width:900px){.sp-unlock-choice-grid{grid-template-columns:1fr}.sp-unlock-choice small{min-height:0}.sp-live-face-shell{grid-template-columns:1fr}.sp-live-face-camera{max-width:520px;width:100%;margin:0 auto}}
@media(max-width:540px){.sp-unlock-choice{padding:18px;border-radius:20px}.sp-unlock-choice-head h2,.sp-unlock-panel-head h2{font-size:24px}.sp-live-face-camera{border-radius:22px}.sp-live-face-guide{inset:7%}.sp-live-face-guide i{width:62%;height:78%}}

/* ==========================================================
   V4.1.4 — focused Facebook-inspired account recovery flow
   Original twittsocial.com UI: intro -> method chooser -> one method
   ========================================================== */
.sp-unlock-v414{background:#f0f2f5!important;color:#1c1e21;min-height:100vh;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.sp-unlock-v414 [hidden]{display:none!important}
.sp-unlock-topbar{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1180px)/2));background:#fff;border-bottom:1px solid #dddfe2;position:sticky;top:0;z-index:30}
.sp-unlock-brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:#0866ff;font-size:20px;font-weight:800}
.sp-unlock-brand-mark{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#0866ff;color:#fff;font-weight:900;font-size:19px;box-shadow:0 4px 10px rgba(8,102,255,.18)}
.sp-unlock-top-label{font-size:13px;color:#65676b;font-weight:650}
.sp-unlock-v414-page{width:min(100%,820px);margin:0 auto;padding:42px 18px 36px;box-sizing:border-box;transition:width .2s ease}
.sp-unlock-v414-page.is-method-view{width:min(100%,900px)}
.sp-unlock-v414-card{width:100%;max-width:590px;margin:0 auto;background:#fff;border:1px solid #dddfe2;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.08);overflow:hidden;transition:max-width .2s ease}
.sp-unlock-v414-page.is-method-view .sp-unlock-v414-card{max-width:760px}
.sp-unlock-view{padding:28px 30px 30px;box-sizing:border-box}
.sp-unlock-global-alert{margin:18px 24px 0!important;border-radius:8px!important}

/* Intro */
.sp-unlock-intro{padding-top:22px;text-align:center}
.sp-unlock-intro-visual{max-width:330px;margin:0 auto 4px;display:flex;justify-content:center}
.sp-unlock-intro-visual img{display:block;width:100%;height:auto;max-height:260px;object-fit:contain;border-radius:0!important}
.sp-unlock-v414-copy{max-width:500px;margin:0 auto}
.sp-unlock-security-icon{display:none}
.sp-unlock-v414-copy h1,.sp-unlock-choice-head h1,.sp-unlock-panel-head h1{margin:0;color:#1c1e21;font-size:26px;line-height:1.2;font-weight:750;letter-spacing:-.015em}
.sp-unlock-v414-copy>p,.sp-unlock-choice-head>p,.sp-unlock-panel-head>p{margin:10px 0 0;color:#65676b;font-size:15px;line-height:1.55}
.sp-unlock-info-box{margin:20px 0 18px;padding:14px 16px;text-align:left;border-radius:8px;background:#f0f2f5;color:#1c1e21;display:grid;gap:4px}
.sp-unlock-info-box strong{font-size:14px}.sp-unlock-info-box span{font-size:13px;line-height:1.45;color:#65676b}
.sp-unlock-primary,.sp-unlock-secondary{appearance:none;width:100%;min-height:44px;border:0;border-radius:6px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 15px/1 inherit;cursor:pointer;transition:background .16s ease,transform .12s ease,box-shadow .16s ease}
.sp-unlock-primary{background:#0866ff;color:#fff;box-shadow:none}
.sp-unlock-primary:hover{background:#075ce5}.sp-unlock-primary:active,.sp-unlock-secondary:active{transform:scale(.992)}
.sp-unlock-secondary{background:#e4e6eb;color:#050505}.sp-unlock-secondary:hover{background:#d8dadf}.sp-unlock-secondary:disabled{opacity:.45;cursor:not-allowed}
.sp-unlock-text-link{display:inline-block;margin-top:17px;color:#0866ff;text-decoration:none;font-size:14px;font-weight:650}.sp-unlock-text-link:hover{text-decoration:underline}

/* Progress + navigation */
.sp-unlock-stepbar{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.sp-unlock-stepbar>span{position:relative;display:block;flex:1;height:4px;border-radius:99px;background:#e4e6eb;overflow:hidden}
.sp-unlock-stepbar>span i{display:block;height:100%;background:#0866ff;border-radius:inherit}
.sp-unlock-stepbar>b{white-space:nowrap;color:#65676b;font-size:12px;font-weight:700}
.sp-unlock-nav-back{appearance:none;border:0;background:transparent;color:#0866ff;padding:4px 0;margin:0 0 19px;font-size:14px;font-weight:700;cursor:pointer}
.sp-unlock-nav-back:hover{text-decoration:underline}

/* Method chooser */
.sp-unlock-v414 .sp-unlock-method-choice{display:block}
.sp-unlock-v414 .sp-unlock-choice-head{text-align:left;max-width:none;margin:0 0 22px}
.sp-unlock-choice-list{display:grid;gap:10px}
.sp-unlock-v414 .sp-unlock-choice{width:100%;appearance:none;border:1px solid #ced0d4;border-radius:10px;background:#fff;padding:16px;display:grid;grid-template-columns:48px minmax(0,1fr) 24px;gap:14px;align-items:center;text-align:left;color:#1c1e21;cursor:pointer;box-shadow:none;transition:background .15s ease,border-color .15s ease,transform .15s ease}
.sp-unlock-v414 .sp-unlock-choice:hover{background:#f7f8fa;border-color:#b8bcc2;transform:none;box-shadow:none}
.sp-unlock-v414 .sp-unlock-choice.is-recommended{border-color:#aac7ff;background:#f7faff}
.sp-unlock-v414 .sp-unlock-choice-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-weight:850;font-size:22px;color:#0866ff;background:#e7f3ff;box-shadow:none}
.sp-unlock-v414 .sp-unlock-choice-icon.is-phone{color:#2b6d46;background:#e8f5ed}.sp-unlock-v414 .sp-unlock-choice-icon.is-id{color:#795548;background:#f4ece9}
.sp-unlock-choice-copy{display:grid;gap:4px;min-width:0}
.sp-unlock-v414 .sp-unlock-choice-copy strong{font-size:16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sp-unlock-choice-copy strong em{font-style:normal;font-size:10px;letter-spacing:.02em;text-transform:uppercase;padding:4px 6px;border-radius:4px;background:#e7f3ff;color:#0866ff}
.sp-unlock-v414 .sp-unlock-choice-copy small{font-size:13px;line-height:1.4;color:#65676b;min-height:0}
.sp-unlock-choice-arrow{color:#8a8d91;font-size:29px;line-height:1;font-weight:300;text-align:right}
.sp-unlock-privacy-note{margin:18px 0 0;color:#8a8d91;font-size:12px;line-height:1.45;text-align:center}

/* Method screens */
.sp-unlock-v414 .sp-unlock-method-panel{display:block}
.sp-unlock-method-icon{width:64px;height:64px;margin:0 auto 15px;border-radius:50%;display:grid;place-items:center;background:#e7f3ff;color:#0866ff;font-size:28px;font-weight:850}
.sp-unlock-method-icon.is-phone{background:#e8f5ed;color:#2b6d46}.sp-unlock-method-icon.is-id{background:#f4ece9;color:#795548}
.sp-unlock-v414 .sp-unlock-panel-head{text-align:center;max-width:570px;margin:0 auto 21px}
.sp-unlock-saved-detail{margin:0 auto 14px;max-width:520px;padding:14px 16px;border:1px solid #dddfe2;border-radius:8px;background:#f7f8fa;display:flex;align-items:center;justify-content:space-between;gap:12px}
.sp-unlock-saved-detail span{color:#65676b;font-size:13px}.sp-unlock-saved-detail strong{font-size:14px;color:#1c1e21}
.sp-unlock-form{display:grid;gap:13px;max-width:520px;margin-left:auto;margin-right:auto}
.sp-unlock-form label{display:grid;gap:7px;text-align:left}.sp-unlock-form label>span{font-size:13px;font-weight:650;color:#1c1e21}
.sp-unlock-form input[type=text],.sp-unlock-form input[type=tel]{width:100%;min-height:46px;border:1px solid #ccd0d5!important;border-radius:6px!important;background:#fff!important;padding:10px 12px!important;color:#1c1e21;font-size:15px;box-sizing:border-box;outline:0}
.sp-unlock-form input[type=text]:focus,.sp-unlock-form input[type=tel]:focus{border-color:#0866ff!important;box-shadow:0 0 0 2px rgba(8,102,255,.12)!important}
.sp-unlock-code-input{letter-spacing:.22em;font-weight:750;font-size:18px!important;text-align:center}
.sp-unlock-divider{max-width:520px;margin:18px auto;display:flex;align-items:center;gap:10px;color:#8a8d91;font-size:12px}.sp-unlock-divider:before,.sp-unlock-divider:after{content:"";height:1px;background:#dddfe2;flex:1}

/* Live face */
.sp-unlock-face-panel{padding-left:34px;padding-right:34px}
.sp-unlock-v414 .sp-live-face-shell{max-width:620px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:14px;align-items:stretch}
.sp-unlock-v414 .sp-live-face-camera{position:relative;width:min(100%,500px);margin:0 auto;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#0d1117;box-shadow:none;border:1px solid #ccd0d5}
.sp-unlock-v414 .sp-live-face-camera video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.sp-unlock-v414 .sp-live-face-guide{position:absolute;inset:8%;display:grid;place-items:center;pointer-events:none}
.sp-unlock-v414 .sp-live-face-guide i{display:block;width:47%;height:78%;border:3px solid rgba(255,255,255,.92);border-radius:48% 48% 45% 45%/42% 42% 55% 55%;box-shadow:0 0 0 999px rgba(0,0,0,.24)}
.sp-unlock-v414 .sp-live-face-idle{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#fff;gap:7px;background:#18191a;padding:22px}
.sp-unlock-v414 .sp-live-face-idle span{width:68px;height:68px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:#2c2d2e;font-size:31px}
.sp-unlock-v414 .sp-live-face-idle strong{font-size:18px}.sp-unlock-v414 .sp-live-face-idle small{max-width:330px;color:#b0b3b8;font-size:13px;line-height:1.45}
.sp-unlock-v414 .sp-live-face-chip{position:absolute;top:12px;left:12px;z-index:4;padding:7px 10px;border-radius:6px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;font-weight:700;backdrop-filter:blur(7px)}
.sp-unlock-v414 .sp-live-face-chip[data-state=good]{background:#18864b}.sp-unlock-v414 .sp-live-face-chip[data-state=error]{background:#c7374f}
.sp-unlock-v414 .sp-live-face-progress{padding:14px;border:1px solid #dddfe2;border-radius:8px;background:#f7f8fa}
.sp-unlock-v414 .sp-live-face-progress-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.sp-unlock-v414 .sp-live-face-progress-head strong{font-size:13px}.sp-unlock-v414 .sp-live-face-progress-head span{font-size:12px;color:#0866ff;font-weight:700}
.sp-unlock-v414 .sp-live-face-steps{display:flex;flex-wrap:wrap;gap:8px}.sp-unlock-v414 .sp-live-face-placeholder{width:100%;padding:10px;background:#fff;border-radius:6px;color:#65676b;font-size:12px}
.sp-unlock-v414 .sp-live-face-step{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:6px;background:#fff;color:#65676b}.sp-unlock-v414 .sp-live-face-step span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#e4e6eb;font-size:11px;font-weight:800}.sp-unlock-v414 .sp-live-face-step strong{font-size:12px}.sp-unlock-v414 .sp-live-face-step.is-current{background:#e7f3ff;color:#0866ff}.sp-unlock-v414 .sp-live-face-step.is-current span{background:#0866ff;color:#fff}.sp-unlock-v414 .sp-live-face-step.is-done{background:#e8f5ed;color:#28734a}.sp-unlock-v414 .sp-live-face-step.is-done span{background:#31a463;color:#fff}
.sp-unlock-v414 .sp-live-face-status{min-height:46px;padding:12px;border-radius:8px;background:#f0f2f5;color:#65676b;font-size:13px;line-height:1.45}.sp-unlock-v414 .sp-live-face-status[data-state=good]{background:#e8f5ed;color:#28734a}.sp-unlock-v414 .sp-live-face-status[data-state=error]{background:#fff0f1;color:#b92f44}

/* ID upload */
.sp-unlock-id-form{max-width:560px}
.sp-unlock-id-drop{display:block!important;position:relative;border:2px dashed #ccd0d5;border-radius:10px;background:#f7f8fa;overflow:hidden;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.sp-unlock-id-drop:hover{border-color:#0866ff;background:#f4f8ff}.sp-unlock-id-drop input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.sp-unlock-id-preview{min-height:210px;padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;color:#1c1e21}
.sp-unlock-id-preview>b{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#e7f3ff;color:#0866ff;font-size:29px;font-weight:400}.sp-unlock-id-preview>strong{font-size:15px}.sp-unlock-id-preview>small{font-size:12px;color:#8a8d91}
.sp-unlock-id-preview img{width:100%;max-height:250px;object-fit:contain;border-radius:6px;margin-bottom:7px}.sp-unlock-id-drop.has-file{border-style:solid;background:#fff}
.sp-unlock-id-tips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.sp-unlock-id-tips span{padding:9px;border-radius:6px;background:#f0f2f5;color:#65676b;font-size:11px;text-align:center}

.sp-unlock-v414-footer{text-align:center;color:#8a8d91;font-size:12px;padding:20px 10px 0}

@media(max-width:700px){
  .sp-unlock-topbar{height:52px;padding:0 14px}.sp-unlock-top-label{display:none}.sp-unlock-brand{font-size:18px}.sp-unlock-brand-mark{width:31px;height:31px;font-size:17px}
  .sp-unlock-v414-page,.sp-unlock-v414-page.is-method-view{padding:18px 10px 28px;width:100%}
  .sp-unlock-v414-card,.sp-unlock-v414-page.is-method-view .sp-unlock-v414-card{max-width:none;border-radius:10px}
  .sp-unlock-view{padding:22px 18px 24px}.sp-unlock-intro{padding-top:18px}.sp-unlock-intro-visual{max-width:280px}.sp-unlock-intro-visual img{max-height:220px}
  .sp-unlock-v414-copy h1,.sp-unlock-choice-head h1,.sp-unlock-panel-head h1{font-size:23px}
  .sp-unlock-v414 .sp-unlock-choice{grid-template-columns:44px minmax(0,1fr) 18px;padding:14px;gap:11px}.sp-unlock-v414 .sp-unlock-choice-icon{width:44px;height:44px}
  .sp-unlock-choice-copy strong em{display:none}.sp-unlock-saved-detail{align-items:flex-start;flex-direction:column}
  .sp-unlock-face-panel{padding-left:14px;padding-right:14px}.sp-unlock-v414 .sp-live-face-camera{aspect-ratio:1/1;border-radius:8px}.sp-unlock-v414 .sp-live-face-guide i{width:57%;height:77%}
  .sp-unlock-id-tips{grid-template-columns:1fr}.sp-unlock-id-preview{min-height:180px}
}
@media(max-width:380px){
  .sp-unlock-v414-page{padding-left:6px;padding-right:6px}.sp-unlock-view{padding-left:14px;padding-right:14px}.sp-unlock-stepbar b{font-size:11px}.sp-unlock-v414 .sp-unlock-choice-copy small{font-size:12px}
}

/* ==========================================================
   V4.1.5 — manual verification review + SVG icon system
   ========================================================== */
.sp-unlock-v415 .sp-unlock-inline-lock{width:46px;height:46px;margin:0 auto 13px;border-radius:50%;display:grid;place-items:center;background:#e7f3ff;color:#0866ff}
.sp-unlock-v415 .sp-unlock-inline-lock svg{width:24px;height:24px}
.sp-unlock-v415 .sp-unlock-choice-icon svg{width:25px;height:25px;display:block}
.sp-unlock-v415 .sp-unlock-choice-arrow{width:24px;height:24px;display:grid;place-items:center}
.sp-unlock-v415 .sp-unlock-choice-arrow svg{width:21px;height:21px}
.sp-unlock-v415 .sp-unlock-method-icon svg{width:30px;height:30px}
.sp-unlock-v415 .sp-unlock-nav-back{display:inline-flex;align-items:center;gap:5px}
.sp-unlock-v415 .sp-unlock-nav-back svg{width:17px;height:17px}
.sp-unlock-v415 .sp-live-face-idle>svg{width:42px;height:42px;color:#0866ff;margin-bottom:8px}
.sp-unlock-v415 .sp-live-face-step span svg{width:15px;height:15px;display:block}
.sp-unlock-v415 .sp-unlock-id-preview>svg{width:34px;height:34px;color:#0866ff;margin-bottom:5px}
.sp-unlock-v415 .sp-unlock-id-tips span{display:inline-flex;align-items:center;gap:5px}
.sp-unlock-v415 .sp-unlock-id-tips svg{width:16px;height:16px;color:#31a24c;flex:0 0 16px}

.sp-unlock-pending-view{text-align:center;padding:42px 34px 38px;max-width:650px;margin:0 auto}
.sp-unlock-pending-icon{width:76px;height:76px;margin:0 auto 15px;border-radius:50%;display:grid;place-items:center;background:#e7f3ff;color:#0866ff}
.sp-unlock-pending-icon svg{width:38px;height:38px}
.sp-unlock-review-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:7px 11px;background:#fff4d6;color:#8a5a00;font-size:12px;font-weight:800;letter-spacing:.015em;text-transform:uppercase}
.sp-unlock-pending-view h1{margin:15px 0 8px;color:#1c1e21;font-size:29px;line-height:1.2;letter-spacing:-.02em}
.sp-unlock-pending-view>p{max-width:560px;margin:0 auto;color:#65676b;font-size:15px;line-height:1.6}
.sp-unlock-review-summary{max-width:520px;margin:24px auto 16px;border:1px solid #dddfe2;border-radius:10px;background:#f7f8fa;padding:4px 16px;display:grid;grid-template-columns:1fr auto;text-align:left}
.sp-unlock-review-summary span,.sp-unlock-review-summary strong{padding:11px 0;border-bottom:1px solid #e4e6eb;font-size:13px}
.sp-unlock-review-summary span{color:#65676b}.sp-unlock-review-summary strong{text-align:right;color:#1c1e21}
.sp-unlock-review-summary :nth-last-child(-n+2){border-bottom:0}
.sp-unlock-review-note{max-width:520px;margin:0 auto 18px;padding:14px 15px;border-radius:10px;background:#f0f2f5;display:flex;gap:12px;text-align:left;color:#1c1e21}
.sp-unlock-review-note>svg{width:25px;height:25px;color:#0866ff;flex:0 0 25px;margin-top:1px}
.sp-unlock-review-note span{display:grid;gap:3px}.sp-unlock-review-note strong{font-size:13px}.sp-unlock-review-note small{color:#65676b;line-height:1.45}
.sp-unlock-logout-button{max-width:520px;margin:0 auto;text-decoration:none;box-sizing:border-box}

.sp-id-upload-progress{border:1px solid #ccd9f6;background:#f7faff;border-radius:10px;padding:14px;display:grid;gap:10px}
.sp-id-upload-progress[hidden]{display:none!important}
.sp-id-upload-progress-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;color:#1c1e21}
.sp-id-upload-progress-head strong{font-size:13px}.sp-id-upload-progress-head b{font-size:12px;color:#0866ff}
.sp-id-progress-spinner{width:22px;height:22px;display:grid;place-items:center;color:#0866ff}
.sp-id-progress-spinner svg{width:20px;height:20px;animation:spIdSpin .9s linear infinite}
.sp-id-upload-track{height:7px;border-radius:999px;background:#dfe7f8;overflow:hidden}
.sp-id-upload-track i{display:block;height:100%;border-radius:inherit;background:#0866ff;transition:width .18s ease}
.sp-id-upload-progress small{color:#65676b;font-size:12px;line-height:1.45}
.sp-unlock-v415 [data-id-submit].is-loading{cursor:wait;opacity:.82}
@keyframes spIdSpin{to{transform:rotate(360deg)}}

@media(max-width:540px){
  .sp-unlock-pending-view{padding:32px 20px 28px}.sp-unlock-pending-view h1{font-size:25px}
  .sp-unlock-review-summary{grid-template-columns:1fr}.sp-unlock-review-summary span{border-bottom:0;padding-bottom:3px}.sp-unlock-review-summary strong{padding-top:0;text-align:left}
  .sp-unlock-review-summary :nth-last-child(-n+2){border-bottom:0}
  .sp-id-upload-progress-head{grid-template-columns:auto 1fr}.sp-id-upload-progress-head b{grid-column:2}
}

/* V4.1.6 accepted-friends-only contacts */
.sp-contacts-empty{padding:12px 8px 6px;color:#65676b;font-size:14px}.sp-contacts-empty p{margin:0 0 8px}.sp-contacts-empty a{font-weight:700;color:#0866ff;text-decoration:none}.sp-contacts-empty a:hover{text-decoration:underline}


/* V4.1.7 verification-approved success popup */
html.sp-has-verification-approved-modal,html.sp-has-verification-approved-modal body{overflow:hidden}
.sp-verification-approved-modal{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:20px;opacity:1;transition:opacity .18s ease}
.sp-verification-approved-modal.is-closing{opacity:0;pointer-events:none}
.sp-verification-approved-backdrop{position:absolute;inset:0;background:rgba(10,18,39,.58);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.sp-verification-approved-card{position:relative;width:min(430px,100%);background:#fff;border-radius:22px;padding:30px 28px 26px;text-align:center;box-shadow:0 24px 70px rgba(12,23,54,.28);animation:spVerificationApprovedIn .24s ease both}
.sp-verification-approved-icon{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:#eaf8ef;color:#168a46}
.sp-verification-approved-icon svg{width:42px;height:42px;display:block}
.sp-verification-approved-card h2{margin:0 0 10px;color:#17213b;font-size:25px;line-height:1.2;font-weight:800}
.sp-verification-approved-card p{margin:0 auto 22px;max-width:350px;color:#5e6880;font-size:15px;line-height:1.65}
.sp-verification-approved-card p strong{color:#253251}
.sp-verification-approved-done{position:relative;width:100%;min-height:48px;border:0;border-radius:12px;background:#1877f2;color:#fff;font:inherit;font-weight:800;cursor:pointer;transition:filter .15s ease,transform .15s ease}
.sp-verification-approved-done:hover{filter:brightness(.96)}
.sp-verification-approved-done:active{transform:translateY(1px)}
.sp-verification-approved-done:disabled{opacity:.78;cursor:wait}
.sp-verification-approved-done.is-loading{color:transparent}
.sp-verification-approved-done.is-loading:after{content:"";position:absolute;left:50%;top:50%;width:19px;height:19px;margin:-10px 0 0 -10px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:spVerificationApprovedSpin .7s linear infinite}
.sp-verification-approved-status{min-height:18px;margin-top:10px;color:#c62828;font-size:12px;font-weight:650}
@keyframes spVerificationApprovedIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes spVerificationApprovedSpin{to{transform:rotate(360deg)}}
@media(max-width:520px){.sp-verification-approved-modal{padding:14px}.sp-verification-approved-card{border-radius:18px;padding:26px 20px 22px}.sp-verification-approved-card h2{font-size:22px}.sp-verification-approved-icon{width:64px;height:64px}.sp-verification-approved-icon svg{width:38px;height:38px}}

/* twittsocial.com V4.2.0 — unified notifications center */
.sp-notifications-nav-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center}
.sp-notifications-nav{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer;padding:0;font:inherit}
.sp-notifications-nav:hover,.sp-notifications-nav.active{background:rgba(24,119,242,.09);color:#1877f2}
.sp-notifications-nav .sp-icon{width:24px;height:24px}
.sp-notifications-popover{position:absolute;z-index:10050;top:calc(100% + 12px);right:-74px;width:min(390px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 92px));overflow:hidden;background:#fff;border:1px solid #e5e8ef;border-radius:18px;box-shadow:0 16px 48px rgba(18,35,74,.18);color:#17203a}
.sp-notifications-popover[hidden]{display:none!important}
.sp-notifications-popover-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 18px 10px}
.sp-notifications-popover-head strong{font-size:24px;line-height:1.1}
.sp-notifications-popover-head button{border:0;background:transparent;color:#1877f2;font-weight:700;cursor:pointer;padding:7px 6px;border-radius:8px}
.sp-notifications-popover-head button:hover{background:#eef5ff}
.sp-notifications-popover-list{overflow:auto;max-height:480px;padding:0 8px 8px}
.sp-notification-item{position:relative;display:flex;align-items:center;gap:12px;text-decoration:none;color:#17203a;padding:12px 14px;border-radius:14px;transition:background .15s ease}
.sp-notification-item:hover{background:#f3f5f8;color:#17203a}
.sp-notification-item.is-unread{background:#edf5ff}
.sp-notification-item.is-unread:hover{background:#e4f0ff}
.sp-notification-avatar-wrap{position:relative;flex:0 0 auto;width:52px;height:52px}
.sp-notification-item.is-compact .sp-notification-avatar-wrap{width:46px;height:46px}
.sp-notification-avatar-wrap .sp-avatar{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.sp-notification-system-avatar{width:100%;height:100%;border-radius:50%;background:#e9f2ff;color:#1877f2;display:flex;align-items:center;justify-content:center}
.sp-notification-type-icon{position:absolute;right:-3px;bottom:-2px;width:23px;height:23px;border-radius:50%;background:#1877f2;color:#fff;border:2px solid #fff;display:flex;align-items:center;justify-content:center}
.sp-notification-type-icon .sp-icon{width:13px;height:13px;stroke-width:2.2}
.sp-notification-copy{min-width:0;display:flex;flex:1;flex-direction:column;gap:4px}
.sp-notification-copy strong{font-size:14px;line-height:1.35;font-weight:600;color:#1c2744}
.sp-notification-item.is-unread .sp-notification-copy strong{font-weight:750}
.sp-notification-copy small{font-size:12px;color:#60708f}
.sp-notification-item.is-unread .sp-notification-copy small{color:#1877f2;font-weight:700}
.sp-notification-unread-dot{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:#1877f2;margin-left:3px}
.sp-notifications-see-all{display:flex;align-items:center;justify-content:center;margin:8px 10px 12px;min-height:42px;border-radius:10px;background:#e7f3ff;color:#1877f2;text-decoration:none;font-weight:800}
.sp-notifications-see-all:hover{background:#dcecff;color:#1267d6}
.sp-notifications-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;padding:34px 20px;color:#68748f}
.sp-notifications-empty>.sp-icon{width:38px;height:38px;color:#9aa7bd;margin-bottom:5px}
.sp-notifications-empty strong{color:#26314d;font-size:16px}.sp-notifications-empty span{font-size:13px;line-height:1.45}
.sp-notifications-page{max-width:900px;margin:0 auto;width:100%}
.sp-notifications-page-head{align-items:center}
.sp-notifications-filter-tabs{display:flex;gap:4px;margin:4px 0 14px;background:#fff;border:1px solid #e7eaf0;border-radius:14px;padding:5px;width:max-content}
.sp-notifications-filter-tabs a{padding:9px 18px;border-radius:10px;text-decoration:none;color:#5b6782;font-weight:700;font-size:14px}
.sp-notifications-filter-tabs a.is-active{background:#e7f3ff;color:#1877f2}
.sp-notifications-page-card{background:#fff;border:1px solid #e7eaf0;border-radius:20px;padding:8px;box-shadow:0 10px 28px rgba(23,36,67,.05)}
.sp-notifications-page-card .sp-notification-item{padding:14px 16px;border-radius:14px}
.sp-notifications-page-card .sp-notification-item+.sp-notification-item{border-top:1px solid #eef0f4;border-top-left-radius:0;border-top-right-radius:0}
.sp-notifications-empty.is-page{min-height:300px}
.sp-notification-settings-form{gap:0!important}
.sp-notification-setting-row{display:flex!important;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid #edf0f5}
.sp-notification-setting-row>span{display:flex;flex-direction:column;gap:4px}
.sp-notification-setting-row strong{font-size:15px;color:#1b2744}.sp-notification-setting-row small{font-size:13px;color:#6c7891;font-weight:400}
.sp-notification-setting-row input[type=checkbox]{appearance:none;-webkit-appearance:none;width:44px;height:24px;border:0!important;border-radius:999px!important;background:#c8cfdb!important;position:relative;cursor:pointer;flex:0 0 44px;padding:0!important;transition:background .18s ease}
.sp-notification-setting-row input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .18s ease}
.sp-notification-setting-row input[type=checkbox]:checked{background:#1877f2!important}.sp-notification-setting-row input[type=checkbox]:checked::after{transform:translateX(20px)}
.sp-notification-settings-form .sp-app-primary{margin-top:18px}
@media(max-width:820px){.sp-notifications-nav-wrap{display:none}.sp-notifications-page{padding-left:0;padding-right:0}.sp-notifications-page-card{border-radius:16px}.sp-notifications-filter-tabs{margin-left:2px}.sp-notifications-page-head .sp-app-secondary{width:auto}.sp-notification-item{padding-left:10px;padding-right:10px}}
@media(max-width:520px){.sp-notification-avatar-wrap{width:46px;height:46px}.sp-notification-copy strong{font-size:13.5px}.sp-notifications-page-head{align-items:flex-start}.sp-notifications-page-head .sp-app-secondary{margin-top:8px}}

/* V4.3.1 — Grow your audience dismissal layout fix */
.sp-owner-boost-panel[hidden]{display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important}
.sp-reel-slide:not(.has-owner-boost)>.sp-reel-card>.sp-owner-boost-panel--reel[hidden]{display:none!important}

/* V4.3.3 — mobile drawer owns the screen: hide the bottom navigation while open. */
@media (max-width:820px){
  body.sp-mobile-drawer-open .sp-mobile-nav{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(calc(100% + env(safe-area-inset-bottom)))!important;
    transition:opacity .16s ease,transform .22s cubic-bezier(.22,1,.36,1),visibility 0s linear .22s!important;
  }
}


/* V4.3.6 — Facebook-style inline post See more */
.sp-post-text-expandable .sp-post-text-collapsed{display:block;margin:0;white-space:normal}
.sp-post-text-expandable .sp-post-see-more,
.sp-post-text-expandable .sp-post-see-less{display:inline;padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:#65676b!important;font:inherit!important;font-weight:700!important;line-height:inherit!important;cursor:pointer;text-decoration:none!important;vertical-align:baseline}
.sp-post-text-expandable .sp-post-see-more:hover,
.sp-post-text-expandable .sp-post-see-less:hover{text-decoration:underline!important}
.sp-post-text-expandable .sp-post-see-more:focus-visible,
.sp-post-text-expandable .sp-post-see-less:focus-visible{outline:2px solid #0866ff!important;outline-offset:2px;border-radius:2px}
.sp-post-text-expandable .sp-post-text-full>p:last-of-type{display:inline}
.sp-post-text-expandable .sp-post-see-less{margin-left:5px!important}
body.sp-dark .sp-post-text-expandable .sp-post-see-more,
body.sp-dark .sp-post-text-expandable .sp-post-see-less{color:#b0b3b8!important}

/* V4.3.7 — 150-character post preview with Facebook-style See more line */
.sp-post-text-expandable .sp-post-preview-text{display:block;white-space:normal}
.sp-post-text-expandable .sp-post-see-more{display:block!important;width:max-content;max-width:100%;margin-top:1px!important;color:#65676b!important;font-weight:700!important;text-align:left!important}
body.sp-dark .sp-post-text-expandable .sp-post-see-more{color:#b0b3b8!important}

/* ==========================================================
   V4.4.4 — resilient authentication + modern login/register UI
   ========================================================== */
.sp-auth-v444-body{min-height:100dvh!important;background:#eef2f7!important;color:#162033!important;overflow-x:hidden}
.sp-auth-v444-page{min-height:100dvh;display:grid;grid-template-columns:minmax(420px,1.08fr) minmax(420px,.92fr);background:#eef2f7}
.sp-auth-v444-hero{position:relative;min-height:100dvh;overflow:hidden;padding:46px clamp(34px,6vw,88px);box-sizing:border-box;background:linear-gradient(145deg,#0866ff 0%,#1453dc 48%,#102d86 100%);color:#fff;display:flex;flex-direction:column}
.sp-auth-v444-hero:before,.sp-auth-v444-hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.sp-auth-v444-hero:before{width:520px;height:520px;right:-220px;top:-210px;background:rgba(255,255,255,.10)}.sp-auth-v444-hero:after{width:460px;height:460px;left:-260px;bottom:-250px;background:rgba(255,255,255,.07)}
.sp-auth-v444-brand{position:relative;z-index:2;display:inline-flex;align-items:center;gap:11px;width:max-content;color:#fff!important;text-decoration:none!important;font-size:20px}.sp-auth-v444-brand-mark{width:42px;height:42px;border-radius:13px;background:#fff;color:#0866ff;display:grid;place-items:center;font-size:23px;font-weight:950;box-shadow:0 9px 24px rgba(0,0,0,.14)}
.sp-auth-v444-hero-copy{position:relative;z-index:2;margin:auto 0 24px;max-width:610px}.sp-auth-v444-kicker{display:inline-flex;padding:7px 11px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(255,255,255,.11);font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;backdrop-filter:blur(8px)}
.sp-auth-v444-hero-copy h1{margin:18px 0 14px;max-width:570px;color:#fff!important;font-size:clamp(39px,4.4vw,62px)!important;line-height:1.02!important;letter-spacing:-2.2px;font-weight:900}.sp-auth-v444-hero-copy>p{max-width:560px;margin:0;color:rgba(255,255,255,.82);font-size:16px;line-height:1.65}
.sp-auth-v444-features{margin-top:30px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.sp-auth-v444-features>div{min-width:0;padding:14px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(255,255,255,.09);backdrop-filter:blur(8px)}.sp-auth-v444-features>div>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.14);margin-bottom:9px}.sp-auth-v444-features .sp-icon{width:18px;height:18px;color:#fff}.sp-auth-v444-features strong,.sp-auth-v444-features small{display:block}.sp-auth-v444-features strong{font-size:13px}.sp-auth-v444-features small{margin-top:4px;color:rgba(255,255,255,.72);font-size:10.5px;line-height:1.4}
.sp-auth-v444-preview{position:relative;z-index:2;width:min(520px,92%);height:205px;margin-top:14px}.sp-auth-v444-preview-card{position:absolute;inset:15px 25px 0 0;border-radius:20px;background:rgba(255,255,255,.96);box-shadow:0 24px 60px rgba(0,0,0,.20);padding:17px;color:#172033;transform:rotate(-1.7deg)}.sp-auth-v444-preview-head{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center}.sp-auth-v444-preview-head>i{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#c7d7f9,#7ba8ff)}.sp-auth-v444-preview-head span{display:grid}.sp-auth-v444-preview-head b{font-size:11px}.sp-auth-v444-preview-head em{margin-top:2px;color:#8b95a7;font-style:normal;font-size:8.5px}.sp-auth-v444-preview-head small{color:#8d98aa;letter-spacing:1px}.sp-auth-v444-preview-lines{display:grid;gap:7px;margin:15px 0 13px}.sp-auth-v444-preview-lines i{height:7px;border-radius:99px;background:#e9eef6}.sp-auth-v444-preview-lines i:nth-child(2){width:82%}.sp-auth-v444-preview-lines i:nth-child(3){width:64%}.sp-auth-v444-preview-media{height:72px;border-radius:12px;background:linear-gradient(125deg,#e9f1ff,#f7f9fd);display:flex;align-items:center;justify-content:center;gap:22px;color:#0866ff;font-size:21px}.sp-auth-v444-float{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;border-radius:999px;background:#fff;color:#1c2a43;padding:9px 12px;box-shadow:0 12px 28px rgba(0,0,0,.18);font-size:10.5px;font-weight:800}.sp-auth-v444-float.is-one{right:-5px;top:2px;color:#147a42}.sp-auth-v444-float.is-two{left:-8px;bottom:18px;color:#0866ff}
.sp-auth-v444-panel-wrap{min-height:100dvh;padding:38px clamp(24px,5vw,70px);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;background:#f7f9fc}.sp-auth-v444-panel{width:min(100%,470px);margin:auto;background:#fff;border:1px solid #e1e7ef;border-radius:22px;box-shadow:0 22px 70px rgba(20,37,63,.12);padding:30px;box-sizing:border-box}.sp-auth-v444-mobile-brand{display:none}
.sp-auth-v444-title{display:flex;align-items:center;gap:12px;margin:0 0 24px;text-align:left}.sp-auth-v444-title-icon{width:44px;height:44px;flex:0 0 auto;border-radius:13px;background:#eaf2ff;color:#0866ff;display:grid;place-items:center}.sp-auth-v444-title-icon .sp-icon{width:21px;height:21px}.sp-auth-v444-title h2{margin:0;color:#101828;font-size:25px;line-height:1.15;letter-spacing:-.5px}.sp-auth-v444-title p{margin:5px 0 0;color:#667085;font-size:12.5px;line-height:1.45}.sp-auth-v444-title.is-register{margin-bottom:20px}
.sp-auth-v444-form{gap:15px!important}.sp-auth-v444-field{display:grid;gap:7px;text-align:left;color:#344054;font-size:11.5px;font-weight:800}.sp-auth-v444-input-wrap{height:52px;display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:8px;padding:0 13px;border:1px solid #d7deea;border-radius:12px;background:#fff;transition:border-color .18s ease,box-shadow .18s ease}.sp-auth-v444-input-wrap:focus-within{border-color:#70a8ff;box-shadow:0 0 0 4px rgba(8,102,255,.09)}.sp-auth-v444-input-wrap>.sp-icon{width:18px;height:18px;color:#7b8799}.sp-auth-v444-input-wrap input{height:48px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;font-size:14px!important}.sp-auth-v444-input-wrap.is-password{grid-template-columns:22px minmax(0,1fr) 34px}
.sp-auth-v444-password-toggle{width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;color:#7b8799;cursor:pointer}.sp-auth-v444-password-toggle:hover,.sp-auth-v444-password-toggle.is-visible{background:#eef4ff;color:#0866ff}.sp-auth-v444-password-toggle .sp-icon{width:18px;height:18px}.sp-auth-v444-password-register{position:relative;display:block}.sp-auth-v444-password-register>input{padding-right:50px!important}.sp-auth-v444-password-register>.sp-auth-v444-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
.sp-auth-v444-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-2px}.sp-auth-v444-options>a{color:#0866ff;text-decoration:none;font-size:11.5px;font-weight:800}.sp-auth-v444-options>a:hover{text-decoration:underline}.sp-auth-v444-remember{display:flex;align-items:center;gap:8px;color:#667085;font-size:11.5px}.sp-auth-v444-remember input{width:16px!important;height:16px!important;accent-color:#0866ff}
.sp-auth-v444-primary{position:relative;width:100%;min-height:50px;border:0;border-radius:12px;background:#0866ff;color:#fff;font-size:15px;font-weight:850;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 10px 22px rgba(8,102,255,.19);transition:transform .15s ease,background .15s ease}.sp-auth-v444-primary:hover{background:#075ce2;transform:translateY(-1px)}.sp-auth-v444-primary:disabled{opacity:.72;cursor:wait;transform:none}.sp-auth-v444-primary i{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.42);border-top-color:#fff;border-radius:50%;animation:spAuthSpin .7s linear infinite}.sp-auth-v444-primary.is-loading i{display:block}.sp-auth-v444-primary.is-loading span{opacity:.82}@keyframes spAuthSpin{to{transform:rotate(360deg)}}
.sp-auth-v444-divider{display:flex;align-items:center;gap:12px;margin:20px 0 14px;color:#8b95a7;font-size:10.5px;font-weight:700}.sp-auth-v444-divider:before,.sp-auth-v444-divider:after{content:"";height:1px;flex:1;background:#e4e9f0}.sp-auth-v444-create{min-height:46px;border:1px solid #ccd8ea;border-radius:12px;display:grid;place-items:center;color:#0866ff!important;background:#f7faff;text-decoration:none!important;font-size:13px;font-weight:850}.sp-auth-v444-create:hover{background:#edf4ff;border-color:#a9c4ef}.sp-auth-v444-security-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:17px 0 0;color:#7a8698;font-size:10.5px}.sp-auth-v444-security-note .sp-icon{width:14px;height:14px;color:#4f8adb}
.sp-auth-v444-back{display:block;margin:18px 0 0;text-align:center;color:#667085!important;text-decoration:none!important;font-size:12px}.sp-auth-v444-back strong{color:#0866ff}.sp-auth-v444-form-note{margin:0!important;text-align:left!important;color:#7b8798!important;font-size:10.5px!important;line-height:1.5!important}.sp-auth-v444-footer{width:min(100%,470px);margin:18px auto 0;display:flex;justify-content:space-between;gap:14px;color:#98a2b3;font-size:10px}
.sp-auth-v444-panel .sp-auth-alert{margin:0 0 17px!important;padding:11px 13px!important;border-radius:11px!important;line-height:1.45!important}.sp-auth-v444-panel .sp-auth-alert.is-error{background:#fff1f1!important;border-color:#ffd1d4!important;color:#a72b31!important}.sp-auth-v444-panel .sp-auth-alert.is-success{background:#eefaf2!important;border-color:#c9ecd5!important;color:#187844!important}
.sp-auth-v444-panel .sp-register-form input,.sp-auth-v444-panel .sp-register-form select,.sp-auth-v444-panel .sp-register-form textarea{border-color:#d7deea!important;background:#fff!important}.sp-auth-v444-panel .sp-register-form input{height:50px!important;border-radius:11px!important;padding:0 13px!important;font-size:13px!important}.sp-auth-v444-panel .sp-register-form select{height:50px!important;border-radius:11px!important;font-size:13px!important}.sp-auth-v444-panel .sp-register-form textarea{border-radius:11px!important;font-size:13px!important}.sp-auth-v444-panel .sp-auth-form-section-title{font-size:10.5px!important;color:#667085!important;text-transform:uppercase;letter-spacing:.045em}.sp-auth-v444-panel .sp-auth-field>span{font-size:10px!important}.sp-auth-v444-panel .sp-auth-name-grid,.sp-auth-v444-panel .sp-auth-register-two{gap:9px!important}
.sp-auth-v444-page:has(.sp-register-form) .sp-auth-v444-panel-wrap{justify-content:flex-start}.sp-auth-v444-page:has(.sp-register-form) .sp-auth-v444-panel{margin-top:0;margin-bottom:0}.sp-auth-v444-page:has(.sp-register-form) .sp-auth-v444-hero{position:sticky;top:0}
@media(max-width:980px){.sp-auth-v444-page{grid-template-columns:1fr}.sp-auth-v444-hero{display:none}.sp-auth-v444-panel-wrap{min-height:100dvh;padding:28px 18px;background:linear-gradient(180deg,#eef4ff 0,#f7f9fc 220px)}.sp-auth-v444-panel{margin:auto}.sp-auth-v444-mobile-brand{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 26px;color:#172033!important;text-decoration:none!important;font-size:18px}.sp-auth-v444-mobile-brand>span{width:36px;height:36px;border-radius:11px;background:#0866ff;color:#fff;display:grid;place-items:center;font-size:19px;font-weight:950}.sp-auth-v444-page:has(.sp-register-form) .sp-auth-v444-panel-wrap{justify-content:flex-start}.sp-auth-v444-page:has(.sp-register-form) .sp-auth-v444-panel{margin:auto}}
@media(max-width:540px){.sp-auth-v444-panel-wrap{padding:18px 12px 72px;justify-content:flex-start}.sp-auth-v444-panel{width:100%;padding:22px 16px;border-radius:18px;box-shadow:0 10px 36px rgba(20,37,63,.10)}.sp-auth-v444-mobile-brand{margin-bottom:21px}.sp-auth-v444-title{margin-bottom:20px}.sp-auth-v444-title-icon{width:40px;height:40px;border-radius:12px}.sp-auth-v444-title h2{font-size:22px}.sp-auth-v444-options{align-items:flex-start;flex-direction:column;gap:8px}.sp-auth-v444-footer{padding:0 4px}.sp-auth-v444-panel .sp-auth-name-grid,.sp-auth-v444-panel .sp-auth-register-two{grid-template-columns:1fr!important}}

/* V4.7.0 — definitive desktop Messenger viewport + auto-scroll repair */
@media(min-width:761px){
  body.sp-messages-route .sp-messenger-shell{
    min-height:0!important;
    overflow:hidden!important;
  }
  body.sp-messages-route .sp-messenger-sidebar,
  body.sp-messages-route .sp-messenger-thread{
    min-height:0!important;
    height:100%!important;
    overflow:hidden!important;
  }
  body.sp-messages-route .sp-messenger-thread{
    display:block!important;
  }
  body.sp-messages-route .sp-chat-active{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    display:grid!important;
    grid-template-rows:66px minmax(0,1fr) auto!important;
    overflow:hidden!important;
  }
  body.sp-messages-route .sp-chat-active[hidden]{
    display:none!important;
  }
  body.sp-messages-route .sp-chat-scroll{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable;
  }
  body.sp-messages-route .sp-chat-composer{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    min-height:58px!important;
    margin:0!important;
    visibility:visible!important;
    opacity:1!important;
    z-index:4!important;
  }
}


/* V4.7.1 Messenger emoji reactions */
.sp-chat-message-reaction-tools{position:absolute;z-index:22;top:50%;transform:translateY(-50%);opacity:0;pointer-events:none;transition:opacity .14s ease}
.sp-chat-message.is-mine .sp-chat-message-reaction-tools{right:calc(100% + 6px)}
.sp-chat-message.is-theirs .sp-chat-message-reaction-tools{left:calc(100% + 6px)}
.sp-chat-message:hover .sp-chat-message-reaction-tools,.sp-chat-message:focus-within .sp-chat-message-reaction-tools{opacity:1;pointer-events:auto}
.sp-chat-react-trigger{width:28px;height:28px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:#fff;color:#65676b;font-size:17px;line-height:1;cursor:pointer;box-shadow:0 1px 5px rgba(15,23,42,.16)}
.sp-chat-react-trigger:hover,.sp-chat-react-trigger[aria-expanded="true"]{background:#f0f2f5;color:#0866ff}
.sp-chat-reaction-picker{position:absolute;z-index:30;bottom:34px;display:flex;align-items:center;gap:2px;padding:5px 7px;border:1px solid #e4e6eb;border-radius:24px;background:#fff;box-shadow:0 8px 28px rgba(15,23,42,.18);white-space:nowrap}
.sp-chat-message.is-mine .sp-chat-reaction-picker{right:0}
.sp-chat-message.is-theirs .sp-chat-reaction-picker{left:0}
.sp-chat-reaction-picker[hidden]{display:none!important}
.sp-chat-reaction-picker button{width:34px;height:34px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;font-size:22px;line-height:1;cursor:pointer;transition:transform .12s ease,background .12s ease}
.sp-chat-reaction-picker button:hover{transform:translateY(-3px) scale(1.14);background:#f5f6f7}
.sp-chat-reaction-picker button.is-selected{background:#e7f3ff;box-shadow:inset 0 0 0 2px #1877f2}
.sp-chat-reaction-picker button:disabled{opacity:.5;cursor:wait;transform:none}
.sp-chat-reaction-summary{min-height:22px;display:inline-flex;align-items:center;gap:0;margin-top:-5px;padding:2px 6px;border:1px solid #fff;border-radius:12px;background:#fff;color:#65676b;font-size:13px;line-height:1;cursor:pointer;box-shadow:0 1px 4px rgba(15,23,42,.17)}
.sp-chat-reaction-summary[hidden]{display:none!important}
.sp-chat-reaction-summary span+span{margin-left:-2px}
.sp-chat-reaction-summary b{margin-left:3px;color:#65676b;font-size:10px;font-weight:700}
.sp-chat-reaction-summary:hover{background:#f7f8fa}
.sp-chat-message[data-my-reaction]:not([data-my-reaction=""]) .sp-chat-reaction-summary{box-shadow:0 1px 4px rgba(24,119,242,.24)}



@media(max-width:760px){.sp-chat-message-reaction-tools{opacity:.78;pointer-events:auto}.sp-chat-react-trigger{width:26px;height:26px;font-size:16px}.sp-chat-message.is-mine .sp-chat-message-reaction-tools{right:calc(100% + 4px)}.sp-chat-message.is-theirs .sp-chat-message-reaction-tools{left:calc(100% + 4px)}.sp-chat-reaction-picker{bottom:32px}.sp-chat-reaction-picker button{width:33px;height:33px;font-size:21px}}

/* V4.7.2 Messenger chat sound toggle */
.sp-chat-head-actions button[data-chat-sound-toggle].is-muted,

.sp-chat-head-actions button[data-chat-sound-toggle] .sp-icon,



/* V4.7.3 Messenger reaction visibility/accessibility fix */
.sp-chat-message-reaction-tools{opacity:.62!important;pointer-events:auto!important}
.sp-chat-message:hover .sp-chat-message-reaction-tools,.sp-chat-message:focus-within .sp-chat-message-reaction-tools,.sp-chat-message-reaction-tools:focus-within{opacity:1!important}
.sp-chat-message.is-mine .sp-chat-message-reaction-tools{right:100%!important;margin-right:2px!important}
.sp-chat-message.is-theirs .sp-chat-message-reaction-tools{left:100%!important;margin-left:2px!important}
.sp-chat-react-trigger{visibility:visible!important;opacity:1!important;display:grid!important;flex:0 0 auto!important}
.sp-chat-reaction-picker:not([hidden]){display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.sp-chat-reaction-picker{max-width:min(290px,calc(100vw - 24px));overflow:visible!important}
.sp-chat-reaction-summary:not([hidden]){display:inline-flex!important;visibility:visible!important;opacity:1!important}
@media(max-width:760px){.sp-chat-message-reaction-tools{opacity:.82!important}.sp-chat-message.is-mine .sp-chat-message-reaction-tools{right:100%!important;margin-right:1px!important}.sp-chat-message.is-theirs .sp-chat-message-reaction-tools{left:100%!important;margin-left:1px!important}}

/* V4.7.5 — Facebook Messenger-style chat reactions */
.sp-chat-message.has-chat-reactions{margin-bottom:9px}
.sp-chat-message.is-long-press-react .sp-chat-message-content{transform:scale(.985);transition:transform .12s ease}
.sp-chat-react-trigger{width:30px!important;height:30px!important;border:0!important;border-radius:50%!important;background:#fff!important;color:#65676b!important;box-shadow:0 1px 4px rgba(0,0,0,.16)!important;transition:background .12s ease,color .12s ease,transform .12s ease!important}
.sp-chat-react-trigger svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sp-chat-react-trigger .sp-chat-react-plus{stroke-width:2}
.sp-chat-react-trigger:hover,.sp-chat-react-trigger:focus-visible,.sp-chat-react-trigger[aria-expanded="true"]{background:#f0f2f5!important;color:#0866ff!important;transform:scale(1.04)}
.sp-chat-reaction-picker{bottom:36px!important;gap:1px!important;padding:5px 6px!important;border:1px solid rgba(0,0,0,.08)!important;border-radius:24px!important;background:#fff!important;box-shadow:0 3px 14px rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.08)!important;transform-origin:bottom center}
.sp-chat-reaction-picker:not([hidden]){animation:spChatFbReactionPickerIn .16s cubic-bezier(.2,.8,.2,1)}
@keyframes spChatFbReactionPickerIn{from{opacity:0;transform:translateY(5px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}
.sp-chat-reaction-picker button{width:38px!important;height:38px!important;border-radius:50%!important;font-size:25px!important;transition:transform .12s cubic-bezier(.2,.8,.2,1),background .12s ease!important}
.sp-chat-reaction-picker button span{display:block;transform-origin:50% 80%;transition:transform .12s cubic-bezier(.2,.8,.2,1)}
.sp-chat-reaction-picker button:hover,.sp-chat-reaction-picker button:focus-visible{background:#f0f2f5!important;transform:translateY(-4px) scale(1.12)!important;outline:none}
.sp-chat-reaction-picker button:hover span,.sp-chat-reaction-picker button:focus-visible span{transform:scale(1.08)}
.sp-chat-reaction-picker button.is-selected{background:#e7f3ff!important;box-shadow:inset 0 0 0 2px #0866ff!important}
.sp-chat-reaction-summary{position:absolute!important;z-index:18!important;bottom:-7px!important;min-height:20px!important;height:20px;padding:1px 5px!important;margin:0!important;display:inline-flex;align-items:center;gap:2px!important;border:1.5px solid #fff!important;border-radius:12px!important;background:#fff!important;box-shadow:0 1px 3px rgba(0,0,0,.18)!important;color:#65676b!important;line-height:1!important}
.sp-chat-message.is-mine .sp-chat-reaction-summary{right:5px!important;left:auto!important}
.sp-chat-message.is-theirs .sp-chat-reaction-summary{left:5px!important;right:auto!important}
.sp-chat-reaction-stack{display:inline-flex;align-items:center;height:17px}
.sp-chat-reaction-stack>span{display:grid;place-items:center;width:16px;height:16px;font-size:14px;line-height:16px;margin:0!important}
.sp-chat-reaction-stack>span+span{margin-left:-3px!important}
.sp-chat-reaction-summary b{margin-left:1px!important;color:#65676b!important;font-size:10px!important;font-weight:600!important}
.sp-chat-reaction-summary:hover,.sp-chat-reaction-summary:focus-visible{background:#f7f8fa!important;outline:none}
.sp-chat-message[data-my-reaction]:not([data-my-reaction=""]) .sp-chat-reaction-summary{box-shadow:0 1px 4px rgba(8,102,255,.24)!important}

/* Facebook behavior: reaction control appears on message hover on desktop. */
@media (hover:hover) and (pointer:fine){
  .sp-chat-message .sp-chat-message-reaction-tools{opacity:0!important;pointer-events:none!important}
  .sp-chat-message:hover .sp-chat-message-reaction-tools,
  .sp-chat-message:focus-within .sp-chat-message-reaction-tools,
  .sp-chat-message.has-reaction-picker-open .sp-chat-message-reaction-tools,
  .sp-chat-message-reaction-tools:focus-within{opacity:1!important;pointer-events:auto!important}
}

/* Touch keeps the small control discoverable and also supports long-pressing a bubble. */
@media (hover:none),(pointer:coarse){
  .sp-chat-message-reaction-tools{opacity:.72!important;pointer-events:auto!important}
  .sp-chat-message.has-reaction-picker-open .sp-chat-message-reaction-tools{opacity:1!important}
  .sp-chat-react-trigger{width:28px!important;height:28px!important;box-shadow:0 1px 3px rgba(0,0,0,.14)!important}
  .sp-chat-react-trigger svg{width:18px;height:18px}
  .sp-chat-reaction-picker{bottom:34px!important;max-width:calc(100vw - 20px)!important;padding:5px!important}
  .sp-chat-reaction-picker button{width:36px!important;height:36px!important;font-size:24px!important}
}

/* Reaction details — Facebook-like desktop dialog / mobile bottom sheet. */
.sp-chat-reaction-details-layer[hidden]{display:none!important}
.sp-chat-reaction-details-layer{position:fixed;z-index:4500;inset:0;display:grid;place-items:center;padding:16px}
.sp-chat-reaction-details-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.32)}
.sp-chat-reaction-details-card{position:relative;width:min(420px,calc(100vw - 30px));max-height:min(560px,calc(100vh - 50px));display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;border-radius:12px;background:#fff;box-shadow:0 12px 38px rgba(0,0,0,.28)}
.sp-chat-reaction-details-card>header{height:56px;padding:0 12px 0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e6eb}
.sp-chat-reaction-details-card>header strong{color:#050505;font-size:17px;font-weight:700}
.sp-chat-reaction-details-card>header button{width:36px;height:36px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:#e4e6eb;color:#050505;font-size:24px;line-height:1;cursor:pointer}
.sp-chat-reaction-details-card>header button:hover{background:#d8dadf}
.sp-chat-reaction-details-card>nav{min-height:49px;display:flex;align-items:stretch;gap:2px;padding:0 8px;border-bottom:1px solid #e4e6eb;overflow-x:auto;scrollbar-width:none}
.sp-chat-reaction-details-card>nav::-webkit-scrollbar{display:none}
.sp-chat-reaction-details-card>nav button{min-width:54px;padding:0 10px;border:0;border-bottom:3px solid transparent;background:transparent;color:#65676b;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.sp-chat-reaction-details-card>nav button span{font-size:18px;vertical-align:-2px}
.sp-chat-reaction-details-card>nav button b{margin-left:3px;font-size:11px}
.sp-chat-reaction-details-card>nav button.is-active{border-bottom-color:#0866ff;color:#0866ff}
.sp-chat-reaction-details-list{min-height:100px;overflow-y:auto;padding:8px}
.sp-chat-reaction-user{min-height:58px;padding:6px 8px;display:flex;align-items:center;gap:11px;border-radius:8px}
.sp-chat-reaction-user:hover{background:#f0f2f5}
.sp-chat-reaction-user>img{width:42px;height:42px;flex:0 0 42px;border-radius:50%;object-fit:cover;background:#e4e6eb}
.sp-chat-reaction-user>div{min-width:0;flex:1}
.sp-chat-reaction-user>div strong,.sp-chat-reaction-user>div small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-chat-reaction-user>div strong{color:#050505;font-size:13px;font-weight:600}
.sp-chat-reaction-user>div small{margin-top:2px;color:#65676b;font-size:10px}
.sp-chat-reaction-user-emoji{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#f0f2f5;font-size:22px}
.sp-chat-reaction-details-loading,.sp-chat-reaction-details-empty{padding:30px 14px;text-align:center;color:#65676b;font-size:13px}

@media(max-width:600px){
  .sp-chat-reaction-details-layer{place-items:end center;padding:0}
  .sp-chat-reaction-details-card{width:100%;max-height:70vh;border-radius:16px 16px 0 0;box-shadow:0 -8px 28px rgba(0,0,0,.18)}
  .sp-chat-reaction-details-card>header{height:54px}
}

/* V4.7.6 — closer Facebook Messenger reaction interaction */
.sp-chat-message-content{position:relative}
.sp-chat-message.has-chat-reactions{margin-bottom:10px}

/* Small smile+ action beside a message on desktop. */
.sp-chat-message-reaction-tools{top:calc(50% - 7px)!important;margin:0!important}
.sp-chat-message.is-mine .sp-chat-message-reaction-tools{right:calc(100% + 6px)!important;left:auto!important}
.sp-chat-message.is-theirs .sp-chat-message-reaction-tools{left:calc(100% + 6px)!important;right:auto!important}
.sp-chat-react-trigger{width:28px!important;height:28px!important;background:transparent!important;box-shadow:none!important;color:#65676b!important}
.sp-chat-react-trigger:hover,.sp-chat-react-trigger:focus-visible,.sp-chat-react-trigger[aria-expanded="true"]{background:#f0f2f5!important;color:#0866ff!important;transform:none!important}
.sp-chat-react-trigger svg{width:18px!important;height:18px!important}

/* The quick reaction pill is anchored to the message itself, not to the side button. */
.sp-chat-reaction-picker{position:absolute!important;z-index:80!important;top:-50px!important;bottom:auto!important;left:auto!important;right:auto!important;display:flex;align-items:center;gap:0!important;height:46px!important;min-width:282px!important;padding:4px 5px!important;border:0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 2px 12px rgba(0,0,0,.20),0 0 0 1px rgba(0,0,0,.05)!important;overflow:visible!important;white-space:nowrap!important}
.sp-chat-message.is-mine .sp-chat-reaction-picker{right:-4px!important;left:auto!important}
.sp-chat-message.is-theirs .sp-chat-reaction-picker{left:-4px!important;right:auto!important}
.sp-chat-reaction-picker[hidden]{display:none!important}
.sp-chat-reaction-picker:not([hidden]){display:flex!important;animation:spChat476PickerIn .14s cubic-bezier(.18,.89,.32,1.18)!important}
@keyframes spChat476PickerIn{from{opacity:0;transform:translateY(4px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
.sp-chat-reaction-picker button{position:relative;width:38px!important;height:38px!important;display:grid!important;place-items:center!important;flex:0 0 38px!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;cursor:pointer!important}
.sp-chat-reaction-picker button span{font-size:25px!important;line-height:1!important;filter:none!important;transform:translateZ(0);transition:transform .12s cubic-bezier(.2,.8,.2,1)!important}
.sp-chat-reaction-picker button:hover,.sp-chat-reaction-picker button:focus-visible{background:transparent!important;transform:none!important;outline:none!important}
.sp-chat-reaction-picker button:hover span,.sp-chat-reaction-picker button:focus-visible span{transform:translateY(-5px) scale(1.22)!important}
.sp-chat-reaction-picker button.is-selected{background:transparent!important;box-shadow:none!important}
.sp-chat-reaction-picker button.is-selected span{filter:drop-shadow(0 0 0 #0866ff) drop-shadow(0 2px 2px rgba(0,0,0,.13));transform:scale(1.08)}
.sp-chat-reaction-picker button:disabled{opacity:.45!important;cursor:wait!important}

/* Messenger-like + button at the end of the quick reactions. */
.sp-chat-reaction-picker .sp-chat-reaction-more{width:34px!important;height:34px!important;flex-basis:34px!important;margin-left:2px!important;background:#f0f2f5!important;color:#050505!important}
.sp-chat-reaction-picker .sp-chat-reaction-more:hover,.sp-chat-reaction-picker .sp-chat-reaction-more:focus-visible,.sp-chat-reaction-picker .sp-chat-reaction-more[aria-expanded="true"]{background:#e4e6eb!important}
.sp-chat-reaction-more svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* Expanded + tray. */
.sp-chat-reaction-more-panel[hidden]{display:none!important}
.sp-chat-reaction-more-panel{position:absolute;z-index:82;top:-238px;width:286px;padding:8px;border:1px solid rgba(0,0,0,.08);border-radius:16px;background:#fff;box-shadow:0 8px 28px rgba(0,0,0,.22)}
.sp-chat-message.is-mine .sp-chat-reaction-more-panel{right:-4px;left:auto}
.sp-chat-message.is-theirs .sp-chat-reaction-more-panel{left:-4px;right:auto}
.sp-chat-reaction-more-title{height:34px;padding:0 2px 5px 6px;display:flex;align-items:center;justify-content:space-between}
.sp-chat-reaction-more-title strong{color:#050505;font-size:12px;font-weight:700}
.sp-chat-reaction-more-title button{width:28px;height:28px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:#f0f2f5;color:#65676b;font-size:20px;line-height:1;cursor:pointer}
.sp-chat-reaction-more-title button:hover{background:#e4e6eb}
.sp-chat-reaction-more-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:2px}
.sp-chat-reaction-more-grid button{width:40px;height:40px;display:grid;place-items:center;padding:0;border:0;border-radius:10px;background:transparent;cursor:pointer}
.sp-chat-reaction-more-grid button:hover,.sp-chat-reaction-more-grid button:focus-visible{background:#f0f2f5;outline:none}
.sp-chat-reaction-more-grid button span{font-size:25px;line-height:1;transition:transform .12s ease}
.sp-chat-reaction-more-grid button:hover span,.sp-chat-reaction-more-grid button:focus-visible span{transform:scale(1.16)}
.sp-chat-reaction-more-grid button.is-selected{background:#e7f3ff;box-shadow:inset 0 0 0 2px rgba(8,102,255,.22)}

/* Reaction badge overlaps the lower message edge like Messenger. */
.sp-chat-reaction-summary{position:absolute!important;z-index:19!important;bottom:-9px!important;top:auto!important;min-width:20px!important;min-height:20px!important;height:20px!important;margin:0!important;padding:1px 5px!important;border:1.5px solid #fff!important;border-radius:11px!important;background:#fff!important;box-shadow:0 1px 3px rgba(0,0,0,.20)!important;color:#65676b!important}
.sp-chat-message.is-mine .sp-chat-message-content>.sp-chat-reaction-summary{right:5px!important;left:auto!important}
.sp-chat-message.is-theirs .sp-chat-message-content>.sp-chat-reaction-summary{left:5px!important;right:auto!important}
.sp-chat-reaction-stack{display:inline-flex!important;align-items:center!important;height:17px!important}
.sp-chat-reaction-stack>span{width:16px!important;height:16px!important;display:grid!important;place-items:center!important;font-size:14px!important;line-height:16px!important}
.sp-chat-reaction-stack>span+span{margin-left:-3px!important}
.sp-chat-reaction-summary b{margin-left:2px!important;font-size:10px!important;font-weight:600!important;color:#65676b!important}
.sp-chat-reaction-summary.is-reaction-pop{animation:spChat476BadgePop .34s cubic-bezier(.2,.85,.25,1.3)}
@keyframes spChat476BadgePop{0%{transform:scale(.68)}55%{transform:scale(1.16)}100%{transform:scale(1)}}

/* Desktop = hover to reveal smile+; picker remains visible while open. */
@media (hover:hover) and (pointer:fine){
  .sp-chat-message .sp-chat-message-reaction-tools{opacity:0!important;pointer-events:none!important}
  .sp-chat-message:hover .sp-chat-message-reaction-tools,
  .sp-chat-message:focus-within .sp-chat-message-reaction-tools,
  .sp-chat-message.has-reaction-picker-open .sp-chat-message-reaction-tools{opacity:1!important;pointer-events:auto!important}
}

/* Mobile/touch = Facebook-like long press. Do not keep a permanent reaction icon beside every bubble. */
@media (hover:none),(pointer:coarse){
  .sp-chat-message-reaction-tools{display:none!important}
  .sp-chat-reaction-picker{top:-49px!important;min-width:276px!important;height:45px!important;padding:4px!important;transform-origin:center bottom!important}
  .sp-chat-reaction-picker button{width:37px!important;height:37px!important;flex-basis:37px!important}
  .sp-chat-reaction-picker button span{font-size:24px!important}
  .sp-chat-reaction-picker .sp-chat-reaction-more{width:33px!important;height:33px!important;flex-basis:33px!important}
  .sp-chat-reaction-more-panel{top:-235px!important;width:min(286px,calc(100vw - 24px))!important}
  .sp-chat-message.is-long-press-react .sp-chat-message-content{transform:scale(.985)!important;transition:transform .12s ease!important}
}

/* Keep the quick-chat picker inside its narrow window. */






/* V4.7.8 — mobile Messenger composer visibility + viewport-safe layout */
@media(max-width:760px){
  body.sp-messages-route .sp-messages-page{
    min-height:calc(var(--sp-mobile-chat-vh, 100dvh) - 60px)!important;
  }
  body.sp-messages-route .sp-messenger-shell{
    height:calc(var(--sp-mobile-chat-vh, 100dvh) - 60px - 64px)!important;
    min-height:0!important;
    overflow:hidden!important;
    display:block!important;
  }
  body.sp-messages-route .sp-messenger-sidebar,
  body.sp-messages-route .sp-messenger-thread{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  body.sp-messages-route .sp-chat-active{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    display:grid!important;
    grid-template-rows:58px minmax(0,1fr) auto!important;
    overflow:hidden!important;
  }
  body.sp-messages-route .sp-chat-active[hidden]{
    display:none!important;
  }
  body.sp-messages-route .sp-chat-head{
    flex:0 0 58px!important;
    min-height:58px!important;
  }
  body.sp-messages-route .sp-chat-scroll{
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    padding-bottom:12px!important;
    -webkit-overflow-scrolling:touch;
  }
  body.sp-messages-route .sp-chat-composer{
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:6px!important;
    flex:0 0 auto!important;
    min-height:60px!important;
    margin:0!important;
    padding:8px 10px calc(10px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid #e9edf2!important;
    visibility:visible!important;
    opacity:1!important;
    z-index:6!important;
  }
  body.sp-messages-route .sp-chat-input-wrap{
    min-height:38px!important;
    display:flex!important;
    align-items:center!important;
    padding:8px 12px!important;
  }
  body.sp-messages-route .sp-chat-input-wrap textarea{
    min-height:22px!important;
    height:22px;
    max-height:120px!important;
    line-height:22px!important;
    font-size:16px!important;
    padding:0!important;
  }
  body.sp-messages-route .sp-chat-photo,
  body.sp-messages-route .sp-chat-send{
    align-self:flex-end!important;
  }
}


/* V4.9.2 — contacts/message action icon alignment + color repair */
.sp-contact{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}
.sp-contact>.sp-online-wrap{
  flex:0 0 36px!important;
  width:36px!important;
  height:36px!important;
}
.sp-contact>span:nth-child(2){
  min-width:0!important;
  flex:1 1 auto!important;
}
.sp-contact-message-icon{
  position:relative!important;
  inset:auto!important;
  margin:0 0 0 auto!important;
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  flex:0 0 28px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  border-radius:50%!important;
  box-sizing:border-box!important;
  background:#0866ff!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  border:2px solid #fff!important;
  box-shadow:0 1px 3px rgba(0,0,0,.18)!important;
  line-height:1!important;
  transform:none!important;
  overflow:hidden!important;
  vertical-align:middle!important;
}
.sp-contact-message-icon .sp-icon,
.sp-contact-message-icon svg{
  display:block!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  stroke:currentColor!important;
  fill:none!important;
  transform:none!important;
}
.sp-contact-message-icon svg path,
.sp-contact-message-icon svg circle,
.sp-contact-message-icon svg polyline,
.sp-contact-message-icon svg line{
  stroke:currentColor!important;
}
.sp-contact:hover .sp-contact-message-icon{
  background:#075bd8!important;
  color:#fff!important;
}
html.sp-theme-dark-root body.sp-theme-dark .sp-contact-message-icon,
body.sp-theme-dark .sp-contact-message-icon{
  background:#2d88ff!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  border-color:#242526!important;
  box-shadow:0 1px 4px rgba(0,0,0,.45)!important;
}
html.sp-theme-dark-root body.sp-theme-dark .sp-contact:hover .sp-contact-message-icon,
body.sp-theme-dark .sp-contact:hover .sp-contact-message-icon{
  background:#4599ff!important;
}
@media(max-width:760px){
  .sp-contact-message-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    flex-basis:30px!important;
    opacity:1!important;
  }
  .sp-contact-message-icon .sp-icon,
  .sp-contact-message-icon svg{width:17px!important;height:17px!important}
}


/* V4.9.2 — notification avatar icon position + color fix */
.sp-notification-avatar-wrap{overflow:visible!important;isolation:isolate}
.sp-notification-type-icon{
  position:absolute!important;
  right:-1px!important;
  bottom:-1px!important;
  width:22px!important;
  height:22px!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  border:2px solid var(--sp-notification-badge-ring,#fff)!important;
  background:#1877f2!important;
  color:#fff!important;
  box-shadow:0 3px 10px rgba(8,17,33,.22)!important;
  z-index:3!important;
  transform:none!important;
}
.sp-notification-item.is-compact .sp-notification-type-icon{width:20px!important;height:20px!important;right:-1px!important;bottom:-1px!important}
.sp-notification-type-icon .sp-icon{width:11px!important;height:11px!important;stroke-width:2.25!important}
.sp-notification-item.is-compact .sp-notification-type-icon .sp-icon{width:10px!important;height:10px!important}
.sp-notification-type-icon.is-reaction{background:#1877f2!important;color:#fff!important}
.sp-notification-type-icon.is-comment,.sp-notification-type-icon.is-reply{background:#1b74e4!important;color:#fff!important}
.sp-notification-type-icon.is-share{background:#0a66ff!important;color:#fff!important}
.sp-notification-type-icon.is-friend_request,.sp-notification-type-icon.is-friend_accept{background:#31a24c!important;color:#fff!important}
.sp-notification-type-icon.is-default{background:#5b6476!important;color:#fff!important}
html.sp-theme-dark .sp-notification-type-icon,body.sp-theme-dark .sp-notification-type-icon{--sp-notification-badge-ring:#202327!important;box-shadow:0 3px 12px rgba(0,0,0,.45)!important}
html.sp-theme-dark .sp-notification-type-icon.is-reaction,body.sp-theme-dark .sp-notification-type-icon.is-reaction{background:#2d88ff!important}
html.sp-theme-dark .sp-notification-type-icon.is-comment,html.sp-theme-dark .sp-notification-type-icon.is-reply,body.sp-theme-dark .sp-notification-type-icon.is-comment,body.sp-theme-dark .sp-notification-type-icon.is-reply{background:#3aa0ff!important}
html.sp-theme-dark .sp-notification-type-icon.is-share,body.sp-theme-dark .sp-notification-type-icon.is-share{background:#1f8bff!important}
html.sp-theme-dark .sp-notification-type-icon.is-friend_request,html.sp-theme-dark .sp-notification-type-icon.is-friend_accept,body.sp-theme-dark .sp-notification-type-icon.is-friend_request,body.sp-theme-dark .sp-notification-type-icon.is-friend_accept{background:#3bb95e!important}

/* V4.9.4 — infinite feed, admin sponsored rail, information pages */
.sp-infinite-feed-sentinel{min-height:56px;display:flex;align-items:center;justify-content:center;padding:12px 0 26px}.sp-infinite-feed-sentinel[data-state="done"]{min-height:18px;padding:0}.sp-infinite-feed-loader{display:flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:8px 14px;border:1px solid #e2e6eb;border-radius:999px;background:#fff;color:#667085;font-size:11px;font-weight:700;box-shadow:0 4px 14px rgba(15,23,42,.05)}.sp-infinite-feed-loader[hidden]{display:none!important}.sp-infinite-feed-loader i{width:18px;height:18px;border:2px solid #cbd5e1;border-right-color:#0866ff;border-radius:50%;animation:spFollowSpin .75s linear infinite}.sp-admin-sponsored-widget{overflow:hidden}.sp-admin-sponsored-list{display:flex;flex-direction:column;gap:10px}.sp-admin-sponsored-row{display:grid;grid-template-columns:108px minmax(0,1fr);gap:10px;align-items:center;color:#172033;text-decoration:none;border-radius:10px;padding:5px;transition:background .15s ease}.sp-admin-sponsored-row:hover{background:#f5f7fa}.sp-admin-sponsored-media{height:82px;border-radius:9px;overflow:hidden;background:#eef2f6;display:grid;place-items:center;color:#0866ff}.sp-admin-sponsored-media img{width:100%;height:100%;object-fit:cover;display:block}.sp-admin-sponsored-media .sp-icon{width:25px;height:25px}.sp-admin-sponsored-copy{min-width:0}.sp-admin-sponsored-copy strong,.sp-admin-sponsored-copy small{display:block}.sp-admin-sponsored-copy strong{color:#172033;font-size:12px;line-height:1.3;overflow-wrap:anywhere}.sp-admin-sponsored-copy small{margin-top:5px;color:#7a8597;font-size:9.5px;line-height:1.35}.sp-side-legal-links{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:12px}.sp-side-legal-links a{font-size:9px;color:#7a8597;text-decoration:none}.sp-side-legal-links a:hover{color:#0866ff;text-decoration:underline}.sp-info-page{grid-column:1/-1;width:min(980px,calc(100% - 32px));margin:18px auto 42px;display:flex;flex-direction:column;gap:16px}.sp-info-hero,.sp-info-content{background:#fff;border:1px solid #e2e6eb;border-radius:18px;box-shadow:0 8px 28px rgba(15,23,42,.05)}.sp-info-hero{padding:32px}.sp-info-hero>span{display:block;color:#0866ff;font-size:10px;font-weight:900;letter-spacing:.12em}.sp-info-hero h1{margin:8px 0 8px;color:#172033;font-size:34px;letter-spacing:-.035em}.sp-info-hero p{max-width:720px;margin:0;color:#667085;font-size:14px;line-height:1.6}.sp-info-hero small{display:block;margin-top:13px;color:#98a2b3;font-size:10px}.sp-info-nav{display:flex;gap:6px;flex-wrap:wrap;padding:6px;border:1px solid #e2e6eb;border-radius:14px;background:#fff}.sp-info-nav a{padding:9px 13px;border-radius:10px;color:#526075;text-decoration:none;font-size:11px;font-weight:800}.sp-info-nav a:hover{background:#f4f7fb}.sp-info-nav a.active{background:#e7f3ff;color:#0866ff}.sp-info-content{padding:8px 28px}.sp-info-content article{padding:22px 0;border-bottom:1px solid #edf0f4}.sp-info-content article:last-of-type{border-bottom:0}.sp-info-content h2{margin:0 0 7px;color:#172033;font-size:17px}.sp-info-content p{margin:0;color:#667085;font-size:13px;line-height:1.7}.sp-info-note{margin:8px 0 22px!important;padding:12px 14px;border-radius:10px;background:#fff8e7;color:#7a5b17!important;font-size:11px!important}@media(max-width:760px){.sp-info-page{width:100%;margin:0;padding:12px 10px 80px}.sp-info-hero{padding:24px 18px}.sp-info-hero h1{font-size:27px}.sp-info-content{padding:4px 18px}.sp-info-nav{overflow:auto;flex-wrap:nowrap}.sp-info-nav a{white-space:nowrap}.sp-admin-sponsored-row{grid-template-columns:92px minmax(0,1fr)}}


/* V4.9.5 — universal 1:1 profile photo crop */
img.sp-avatar,
img.avatar,
.sp-profile-avatar-wrap img,
.sp-profile-photo-preview img,
.sp-person-avatar-wrap img,
.sp-notification-avatar-wrap img,
.sp-conversation-avatar img,
.sp-conversation-row img,
.sp-chat-head-avatar img,
.sp-chat-profile-intro img,
.sp-contact-row img,
.sp-friend-result img,
.sp-friend-result-user img,
.sp-profile-friend-card img,
.sp-profile-friends-preview img,
.sp-profile-suggestion-photo img,
.sp-share-person img,
.sp-mobile-drawer-profile img,
[class*="avatar-wrap"] > img,
[class*="avatar"] > img.sp-avatar {
  aspect-ratio:1 / 1!important;
  object-fit:cover!important;
  object-position:center!important;
  flex-shrink:0!important;
}
.sp-profile-avatar-wrap,
.sp-person-avatar-wrap,
.sp-notification-avatar-wrap,
.sp-conversation-avatar,
.sp-chat-head-avatar {
  aspect-ratio:1 / 1;
}


/* V4.9.8 — clean end-of-feed state */
.sp-infinite-feed-sentinel[data-state="done"]{min-height:70px!important;padding:12px 0 28px!important}
.sp-infinite-feed-end{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 16px;
  border:1px solid #dfe4ea;
  border-radius:999px;
  background:#f4f6f8;
  color:#526075;
  font:700 11px/1 inherit;
  cursor:pointer;
  box-shadow:none;
}
.sp-infinite-feed-end[hidden]{display:none!important}
.sp-infinite-feed-end:hover{background:#e9edf2;color:#172033}
.sp-infinite-feed-end:disabled{opacity:.65;cursor:default}
html.sp-theme-dark-root body.sp-theme-dark .sp-infinite-feed-end,
body.sp-theme-dark .sp-infinite-feed-end{
  background:#24272b!important;
  color:#d7dce3!important;
  border-color:#3e4248!important;
}
html.sp-theme-dark-root body.sp-theme-dark .sp-infinite-feed-end:hover,
body.sp-theme-dark .sp-infinite-feed-end:hover{
  background:#2e3237!important;
  color:#fff!important;
}


/* V4.10.2 — visible-video loading surface.
   Keep the shimmer until real video pixels are available; show a real poster
   immediately when one exists. This removes the long black 0:00/0:00 cards. */
.sp-video-shell.sp-video-idle:not(.sp-loaded) .sp-media-el{opacity:0!important}
.sp-video-shell.sp-video-idle:not(.sp-loaded) .sp-media-skeleton{opacity:1!important;visibility:visible!important}
.sp-video-shell.sp-video-idle.sp-has-poster .sp-media-el{opacity:1!important}
.sp-video-shell.sp-video-idle.sp-has-poster .sp-media-skeleton{opacity:0!important;visibility:hidden!important}
.sp-video-shell.sp-video-starting:not(.sp-loaded) .sp-media-skeleton{opacity:1!important;visibility:visible!important}
.sp-video-shell.sp-video-starting .sp-video-center{z-index:4!important}
.sp-video-shell.sp-loaded .sp-media-el{opacity:1!important}


/* V4.10.3 — post options dropdown attachment/overflow cleanup */
.sp-post-menu-wrap{isolation:isolate!important}
.sp-post-menu-wrap.is-open{z-index:120!important}
.sp-post-menu-wrap.is-open>.sp-post-menu{z-index:121!important;overscroll-behavior:contain}
.sp-post-card,.sp-profile-post-card{overflow:visible}
@media(max-width:560px){
  .sp-post-manage-menu{width:min(328px,calc(100vw - 20px))!important;max-width:calc(100vw - 20px)!important}
}
\n\n/* V4.10.5 — true top-layer post options menu. */
body>.sp-post-menu.sp-post-menu-portal{
  position:fixed!important;
  z-index:2147483000!important;
  isolation:isolate!important;
  visibility:visible!important;
  opacity:1!important;
  margin:0!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  box-shadow:0 14px 42px rgba(15,23,42,.24)!important;
}
.sp-post-menu-wrap.is-open{z-index:150!important}
.sp-post-menu-host-open{overflow:visible!important}
@media(max-width:600px){
  body>.sp-post-menu.sp-post-menu-portal{
    border-radius:16px!important;
    box-shadow:0 18px 54px rgba(15,23,42,.28)!important;
  }
}
html.sp-theme-dark-root body.sp-theme-dark>.sp-post-menu.sp-post-menu-portal,
body.sp-theme-dark>.sp-post-menu.sp-post-menu-portal{
  background:#242526!important;
  color:#e4e6eb!important;
  border-color:#3e4042!important;
  box-shadow:0 18px 54px rgba(0,0,0,.52)!important;
}

/* V4.10.6 — Messenger ringtone + compact incoming-call card + call history */
.sp-call-incoming-card{
  position:fixed;z-index:2147483600;top:76px;right:18px;width:min(330px,calc(100vw - 24px));
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 13px;
  border:1px solid rgba(255,255,255,.12);border-radius:16px;background:#242526;color:#f5f6f7;
  box-shadow:0 16px 42px rgba(0,0,0,.38);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
}
.sp-call-incoming-card[hidden]{display:none!important}
.sp-call-incoming-person{min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:10px}
.sp-call-incoming-person>img{width:44px;height:44px;aspect-ratio:1/1;border-radius:50%;object-fit:cover;background:#3a3b3c;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.sp-call-incoming-person>div{min-width:0;display:flex;flex-direction:column;gap:3px}
.sp-call-incoming-person strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f5f6f7;font-size:13px;line-height:1.2}
.sp-call-incoming-person span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#b0b3b8;font-size:10.5px;line-height:1.25}
.sp-call-incoming-card-actions{display:flex;align-items:center;gap:8px}
.sp-call-incoming-card-actions button{width:34px;height:34px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;color:#fff;cursor:pointer;box-shadow:0 3px 10px rgba(0,0,0,.25);transition:transform .14s ease,filter .14s ease}
.sp-call-incoming-card-actions button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.sp-call-incoming-card-actions button:active{transform:scale(.94)}
.sp-call-incoming-card-actions .accept{background:#31a24c}
.sp-call-incoming-card-actions .decline{background:#e41e3f}
.sp-call-incoming-card-actions .sp-icon,.sp-call-incoming-card-actions .sp-icon-rounded{width:16px;height:16px}
.sp-call-incoming-card[data-call-type="video"] .accept{background:#31a24c}

.sp-chat-message.is-call-event .sp-chat-message-content{max-width:min(270px,82vw)}
.sp-chat-call-event{width:min(258px,78vw);overflow:hidden;border:1px solid #35383d;border-radius:14px;background:#242526;color:#f5f6f7;box-shadow:0 3px 12px rgba(0,0,0,.13)}
.sp-chat-call-event-head{display:grid;grid-template-columns:38px minmax(0,1fr) 36px;align-items:center;gap:9px;padding:10px 10px 8px}
.sp-chat-call-event-type{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#323438;color:#e4e6eb}
.sp-chat-call-event-type .sp-icon,.sp-chat-call-event-type .sp-icon-rounded{width:18px;height:18px}
.sp-chat-call-event-head>div{min-width:0;display:flex;flex-direction:column;gap:3px}
.sp-chat-call-event-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f5f6f7;font-size:12px;line-height:1.25}
.sp-chat-call-event-head small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#b0b3b8;font-size:9.5px;line-height:1.25}
.sp-chat-call-event-head>img{width:36px;height:36px;aspect-ratio:1/1;border-radius:50%;object-fit:cover;background:#3a3b3c}
.sp-chat-call-event-actions{display:flex;justify-content:flex-end;padding:0 9px 9px}
.sp-chat-call-event-actions button{width:31px;height:31px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;cursor:pointer;color:#fff;background:#31a24c;box-shadow:0 2px 7px rgba(49,162,76,.24)}
.sp-chat-call-event-actions button .sp-icon,.sp-chat-call-event-actions button .sp-icon-rounded{width:14px;height:14px}
.sp-chat-call-event.is-missed,.sp-chat-call-event.is-failed{border-color:#553239}
.sp-chat-call-event.is-missed .sp-chat-call-event-type,.sp-chat-call-event.is-failed .sp-chat-call-event-type{background:#43282e;color:#ff9da7}
.sp-chat-call-event.is-declined,.sp-chat-call-event.is-canceled{border-color:#4c3c3f}
.sp-chat-message.is-mine .sp-chat-call-event{border-color:#31527b;background:#1f3046}
.sp-chat-message.is-mine .sp-chat-call-event-type{background:#294766;color:#8ec1ff}

@media(max-width:700px){
  .sp-call-incoming-card{top:calc(10px + env(safe-area-inset-top));left:10px;right:10px;width:auto;border-radius:14px}
  .sp-call-incoming-person{grid-template-columns:42px minmax(0,1fr)}
  .sp-call-incoming-person>img{width:42px;height:42px}
}
.sp-call-push-panel{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;margin:0 0 16px;padding:15px;border:1px solid #dfe4ec;border-radius:14px;background:#f8fbff}.sp-call-push-panel.is-active{border-color:#b9d8ff;background:#f1f7ff}.sp-call-push-panel.is-error{border-color:#f1c5c5;background:#fff7f7}.sp-call-push-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#e7f3ff;color:#0866ff}.sp-call-push-icon .sp-icon{width:23px;height:23px}.sp-call-push-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.sp-call-push-copy>strong{font-size:14px;color:#1f2937}.sp-call-push-copy>span{font-size:12px;color:#475467;font-weight:650}.sp-call-push-copy>small{font-size:11px;line-height:1.45;color:#667085}.sp-call-push-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.sp-call-push-actions .sp-app-primary,.sp-call-push-actions .sp-app-secondary{white-space:nowrap}@media(max-width:720px){.sp-call-push-panel{grid-template-columns:42px minmax(0,1fr)}.sp-call-push-icon{width:42px;height:42px}.sp-call-push-actions{grid-column:1/-1;justify-content:stretch}.sp-call-push-actions button{flex:1}}


/* V4.10.14 — friend action anti-blink / stable inline state */
.sp-friend-controls{min-height:34px}
.sp-friend-btn{transition:background-color .14s ease,color .14s ease,border-color .14s ease,transform .12s ease!important;contain:layout paint}
.sp-friend-btn.is-working,.sp-friend-btn:disabled.is-working{opacity:1!important;cursor:progress!important;pointer-events:none!important}
.sp-friend-btn.is-working .sp-icon{opacity:.72}
.sp-friend-btn.is-working span{min-width:max-content}
.sp-friend-result,.sp-profile-suggestion-card,.sp-profile-friend-card{transform:translateZ(0);backface-visibility:hidden}


/* V4.10.18 — normal post modal aligned to uploaded reference */
#sp-post-modal .sp-modal-card{width:min(500px,calc(100vw - 24px))!important;overflow:hidden!important;border-radius:18px!important}
#sp-post-modal .sp-modal-head{padding:0 58px!important;border-bottom:1px solid var(--sp-border)!important;background:var(--sp-card)!important}
#sp-post-modal .sp-modal-head h3{font-size:20px!important;font-weight:800!important;letter-spacing:-.02em}
#sp-post-modal .sp-modal-body{padding:12px 16px 14px!important}
#sp-post-modal .sp-modal-user{display:flex!important;align-items:flex-start!important;gap:12px!important;margin-bottom:10px!important}
#sp-post-modal .sp-modal-user .sp-avatar{width:48px!important;height:48px!important;flex:0 0 48px!important}
#sp-post-modal .sp-modal-user-main{display:flex;flex-direction:column;gap:6px;min-width:0}
#sp-post-modal .sp-modal-user-name{display:block;font-size:15px;font-weight:800;line-height:1.15;color:var(--sp-text)}
#sp-post-modal .sp-modal-user-pills{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#sp-post-modal .sp-privacy-label,#sp-post-modal .sp-post-topic-trigger{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border:0;border-radius:8px;background:var(--sp-soft);color:var(--sp-text);font-size:13px;font-weight:700}
#sp-post-modal .sp-privacy-label .sp-meta-icon{width:14px;height:14px}
#sp-post-modal .sp-post-topic-trigger{cursor:pointer}
#sp-post-modal .sp-post-topic-trigger .sp-chip-chevron{width:14px;height:14px;opacity:.7;transform:rotate(90deg)}
#sp-post-modal .sp-post-title-input{display:block;margin:0 0 8px!important}
#sp-post-modal textarea[name="text"]{min-height:168px!important;padding:8px 2px 6px!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;font-size:17px!important;line-height:1.45!important;resize:none;color:var(--sp-text)!important}
#sp-post-modal textarea[name="text"]::placeholder{color:var(--sp-text-soft)!important;opacity:1}
#sp-post-modal .sp-post-quick-row{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px}
#sp-post-modal .sp-post-bg-trigger,#sp-post-modal .sp-post-emoji-trigger{border:0;cursor:pointer}
#sp-post-modal .sp-post-bg-trigger{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#37b1ff,#60d36d 50%,#f7c24f,#ff77b7);display:grid;place-items:center;color:#fff;font-size:14px;font-weight:800;box-shadow:0 6px 16px rgba(33,150,243,.22)}
#sp-post-modal .sp-post-emoji-trigger{width:32px;height:32px;border-radius:999px;background:transparent;color:var(--sp-text-soft);display:grid;place-items:center}
#sp-post-modal .sp-post-emoji-trigger .sp-icon{width:18px;height:18px}
#sp-post-modal .sp-upload-box{margin:2px 0 10px!important;padding:12px!important;border:1px solid var(--sp-border)!important;border-radius:12px!important;background:var(--sp-softest)!important}
#sp-post-modal .sp-dropzone{min-height:108px!important;border-radius:12px!important}
#sp-post-modal .sp-upload-preview{margin-top:12px!important}
#sp-post-modal .sp-post-addons{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;margin-top:10px;border:1px solid var(--sp-border);border-radius:12px;background:var(--sp-card)}
#sp-post-modal .sp-post-addons strong{font-size:13px;font-weight:800;color:var(--sp-text)}
#sp-post-modal .sp-post-addon-actions{display:flex;align-items:center;gap:2px;flex-wrap:wrap;justify-content:flex-end}
#sp-post-modal .sp-post-addon-actions button{width:34px;height:34px;border:0;border-radius:999px;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--sp-text-soft);transition:background .18s ease,color .18s ease,transform .18s ease}
#sp-post-modal .sp-post-addon-actions button:hover{background:var(--sp-soft);transform:translateY(-1px)}
#sp-post-modal .sp-post-addon-actions button .sp-icon{width:18px;height:18px}
#sp-post-modal .sp-post-addon-actions .is-photo{color:#22a958}.sp-post-addon-actions .is-people{color:#2878ff}.sp-post-addon-actions .is-location{color:#ff5b39}.sp-post-addon-actions .is-feeling{color:#f2b31b}.sp-post-addon-actions .is-more{color:var(--sp-text-soft)}
#sp-post-modal .sp-status{margin:10px 0 8px!important}
#sp-post-modal .sp-submit{width:100%!important;height:40px!important;border-radius:10px!important;font-weight:800!important;font-size:16px!important;background:#dfe3e8!important;color:#8d949e!important;border:0!important;box-shadow:none!important}
#sp-post-modal .sp-submit.is-ready,#sp-post-modal .sp-submit:not(:disabled){background:var(--sp-primary)!important;color:#fff!important}
#sp-post-modal .sp-submit:disabled{cursor:not-allowed;opacity:1!important}
html.sp-theme-dark #sp-post-modal .sp-modal-card,body.sp-theme-dark #sp-post-modal .sp-modal-card{background:#1f2125!important;border:1px solid #2b3037!important}
html.sp-theme-dark #sp-post-modal .sp-modal-head,body.sp-theme-dark #sp-post-modal .sp-modal-head{background:#1f2125!important;border-bottom-color:#2e3238!important}
html.sp-theme-dark #sp-post-modal .sp-privacy-label,html.sp-theme-dark #sp-post-modal .sp-post-topic-trigger,body.sp-theme-dark #sp-post-modal .sp-privacy-label,body.sp-theme-dark #sp-post-modal .sp-post-topic-trigger{background:#2b2f36!important;color:#eef2f8!important}
html.sp-theme-dark #sp-post-modal .sp-upload-box,body.sp-theme-dark #sp-post-modal .sp-upload-box{background:#21252b!important;border-color:#323844!important}
html.sp-theme-dark #sp-post-modal .sp-post-addons,body.sp-theme-dark #sp-post-modal .sp-post-addons{background:#1f2125!important;border-color:#2f343d!important}
html.sp-theme-dark #sp-post-modal .sp-post-addon-actions button:hover,body.sp-theme-dark #sp-post-modal .sp-post-addon-actions button:hover{background:#2c3138!important}
html.sp-theme-dark #sp-post-modal .sp-submit,body.sp-theme-dark #sp-post-modal .sp-submit{background:#31353c!important;color:#8d95a3!important}
@media (max-width:640px){#sp-post-modal{padding:10px!important}#sp-post-modal .sp-modal-card{width:min(100vw - 16px,500px)!important}#sp-post-modal .sp-modal-head{padding:0 52px!important}#sp-post-modal .sp-post-addons{padding:11px 12px}#sp-post-modal textarea[name="text"]{min-height:150px!important;font-size:16px!important}}


/* V4.10.19 — contacts rail scrolling + uploaded icon styling */
.sp-right .sp-sticky{max-height:calc(100vh - 88px);overflow-y:auto;overflow-x:hidden;padding-right:4px;scrollbar-width:thin;scrollbar-color:rgba(8,102,255,.35) transparent}
.admin-bar .sp-right .sp-sticky{max-height:calc(100vh - 120px)}
.sp-right .sp-sticky::-webkit-scrollbar{width:8px}.sp-right .sp-sticky::-webkit-scrollbar-track{background:transparent}.sp-right .sp-sticky::-webkit-scrollbar-thumb{background:rgba(8,102,255,.28);border-radius:999px}.sp-right .sp-sticky:hover::-webkit-scrollbar-thumb{background:rgba(8,102,255,.48)}
.sp-contacts-widget{display:flex;flex-direction:column;min-height:0}.sp-contacts-widget .sp-contact{flex:0 0 auto}.sp-contacts-widget .sp-widget-title{position:sticky;top:0;z-index:2;background:inherit;padding-top:2px}
#sp-post-modal .sp-post-emoji-trigger{color:#f4bf1a!important}#sp-post-modal .sp-post-emoji-trigger .sp-icon,#sp-post-modal .sp-post-emoji-trigger svg{width:20px!important;height:20px!important;display:block!important}#sp-post-modal .sp-post-emoji-trigger svg{overflow:visible}#sp-post-modal .sp-post-emoji-trigger svg circle:first-child{color:#f4d91f!important}
#sp-post-modal .sp-post-addon-actions .is-location{color:#ff003d!important}#sp-post-modal .sp-post-addon-actions .is-feeling{color:#f4bf1a!important}#sp-post-modal .sp-post-addon-actions .is-feeling svg,#sp-post-modal .sp-post-emoji-trigger svg{filter:drop-shadow(0 1px 0 rgba(0,0,0,.08))}
html.sp-theme-dark #sp-post-modal .sp-post-emoji-trigger,body.sp-theme-dark #sp-post-modal .sp-post-emoji-trigger{color:#f4bf1a!important}
html.sp-theme-dark .sp-right .sp-sticky::-webkit-scrollbar-thumb,body.sp-theme-dark .sp-right .sp-sticky::-webkit-scrollbar-thumb{background:rgba(69,153,255,.42)}
html.sp-theme-dark .sp-right .sp-sticky,body.sp-theme-dark .sp-right .sp-sticky{scrollbar-color:rgba(69,153,255,.48) transparent}
@media (max-width:1100px){.sp-right .sp-sticky{max-height:none;overflow:visible;padding-right:0}}


/* V4.10.20 — picker-first Photo/Reel composer + reference media preview */
#sp-post-modal .sp-upload-box.has-selected-media{
  display:block!important;
  padding:0!important;
  margin:2px 0 12px!important;
  border:0!important;
  background:transparent!important;
}
#sp-post-modal .sp-upload-box.has-selected-media .sp-dropzone{display:none!important}
#sp-post-modal .sp-upload-box.has-selected-media .sp-upload-preview{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  margin:0!important;
}
#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-card{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  max-height:420px!important;
  margin:0 auto!important;
  border-radius:2px!important;
  object-fit:contain!important;
  background:#111!important;
}
#sp-post-modal .sp-upload-box.has-selected-media video.sp-preview-visual{
  width:min(100%,420px)!important;
  aspect-ratio:auto!important;
}
#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-meta{display:none!important}
#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-remove{
  position:absolute!important;
  top:8px!important;right:8px!important;z-index:3!important;
  width:32px!important;height:32px!important;
  color:#111!important;background:rgba(255,255,255,.94)!important;
  box-shadow:0 2px 10px rgba(0,0,0,.2)!important;
}
/* User-requested active state: disabled remains gray; content/media makes it pure white. */
#sp-post-modal .sp-submit.is-ready,#sp-post-modal .sp-submit:not(:disabled){
  background:#ffffff!important;
  color:#111827!important;
  border:1px solid #d7dce3!important;
  box-shadow:0 1px 2px rgba(15,23,42,.06)!important;
}
#sp-post-modal .sp-submit.is-ready:hover,#sp-post-modal .sp-submit:not(:disabled):hover{
  background:#ffffff!important;
  color:#05070a!important;
  border-color:#cbd2db!important;
}
html.sp-theme-dark #sp-post-modal .sp-submit.is-ready,html.sp-theme-dark #sp-post-modal .sp-submit:not(:disabled),body.sp-theme-dark #sp-post-modal .sp-submit.is-ready,body.sp-theme-dark #sp-post-modal .sp-submit:not(:disabled){
  background:#ffffff!important;color:#111827!important;border-color:#ffffff!important;
}
@media(max-width:640px){
  #sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{max-height:52dvh!important}
}
\n\n/* V4.10.21 — final reference polish for normal Photo/Reel composer */\n#sp-post-modal textarea[name="text"],\n#sp-post-modal textarea[name="text"]:hover,\n#sp-post-modal textarea[name="text"]:focus,\n#sp-post-modal textarea[name="text"]:focus-visible{\n  border:0!important;\n  outline:0!important;\n  box-shadow:none!important;\n  background:transparent!important;\n}\n#sp-post-modal .sp-upload-box.has-selected-media{\n  border:0!important;\n  background:transparent!important;\n  padding:0!important;\n  margin:4px 0 14px!important;\n}\n#sp-post-modal .sp-upload-box.has-selected-media .sp-dropzone{display:none!important}\n#sp-post-modal .sp-upload-box.has-selected-media .sp-upload-preview{\n  display:flex!important;\n  align-items:center!important;\n  justify-content:center!important;\n  width:100%!important;\n  margin:0!important;\n}\n#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-card{\n  width:100%!important;\n  display:flex!important;\n  align-items:center!important;\n  justify-content:center!important;\n  position:relative!important;\n  overflow:visible!important;\n  border:0!important;\n  background:transparent!important;\n  box-shadow:none!important;\n}\n#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{\n  display:block!important;\n  width:auto!important;\n  max-width:100%!important;\n  height:auto!important;\n  max-height:48dvh!important;\n  object-fit:contain!important;\n  border-radius:0!important;\n  background:#000!important;\n}\n#sp-post-modal .sp-upload-box.has-selected-media video.sp-preview-visual{\n  width:100%!important;\n}\n/* Reference state: media-only is publishable but stays neutral gray. */\n#sp-post-modal .sp-submit.is-ready:not(.has-text){\n  background:#dfe3e8!important;\n  color:#8d949e!important;\n  border:1px solid #dfe3e8!important;\n  box-shadow:none!important;\n  opacity:1!important;\n}\n/* As requested, typing any title/body text turns Post pure white. */\n#sp-post-modal .sp-submit.has-text{\n  background:#ffffff!important;\n  color:#111827!important;\n  border:1px solid #ffffff!important;\n  box-shadow:0 1px 2px rgba(15,23,42,.08)!important;\n  opacity:1!important;\n}\n#sp-post-modal .sp-submit.has-text:hover{\n  background:#ffffff!important;\n  color:#05070a!important;\n}\nhtml.sp-theme-dark #sp-post-modal .sp-submit.is-ready:not(.has-text),\nbody.sp-theme-dark #sp-post-modal .sp-submit.is-ready:not(.has-text){\n  background:#353a42!important;\n  color:#9aa2ae!important;\n  border-color:#353a42!important;\n}\nhtml.sp-theme-dark #sp-post-modal .sp-submit.has-text,\nbody.sp-theme-dark #sp-post-modal .sp-submit.has-text{\n  background:#ffffff!important;\n  color:#111827!important;\n  border-color:#ffffff!important;\n}\n@media(max-width:640px){\n  #sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{max-height:44dvh!important}\n}\n

/* twittsocial.com V4.10.22 — Create Post modal internal scrolling repair */
#sp-post-modal{
  overflow:hidden!important;
  overscroll-behavior:contain!important;
}
#sp-post-modal .sp-modal-card{
  display:flex!important;
  flex-direction:column!important;
  width:min(500px,calc(100vw - 24px))!important;
  max-height:calc(100dvh - 24px)!important;
  min-height:0!important;
  overflow:hidden!important;
}
#sp-post-modal .sp-modal-head{
  flex:0 0 58px!important;
  position:relative!important;
  z-index:3!important;
}
#sp-post-modal #sp-post-form{
  display:flex!important;
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
#sp-post-modal .sp-modal-body{
  display:block!important;
  flex:1 1 auto!important;
  min-height:0!important;
  width:100%!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(99,115,139,.45) transparent!important;
}
#sp-post-modal .sp-modal-body::-webkit-scrollbar{width:8px!important}
#sp-post-modal .sp-modal-body::-webkit-scrollbar-track{background:transparent!important}
#sp-post-modal .sp-modal-body::-webkit-scrollbar-thumb{background:rgba(99,115,139,.35)!important;border-radius:999px!important}
#sp-post-modal .sp-modal-body:hover::-webkit-scrollbar-thumb{background:rgba(99,115,139,.55)!important}
#sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{
  max-height:min(48dvh,520px)!important;
}
html.sp-theme-dark #sp-post-modal .sp-modal-body,
body.sp-theme-dark #sp-post-modal .sp-modal-body{
  scrollbar-color:rgba(174,181,191,.42) transparent!important;
}
html.sp-theme-dark #sp-post-modal .sp-modal-body::-webkit-scrollbar-thumb,
body.sp-theme-dark #sp-post-modal .sp-modal-body::-webkit-scrollbar-thumb{
  background:rgba(174,181,191,.35)!important;
}
@media(max-width:640px){
  #sp-post-modal{padding:8px!important}
  #sp-post-modal .sp-modal-card{
    width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 16px)!important;
  }
  #sp-post-modal .sp-upload-box.has-selected-media .sp-preview-visual{max-height:46dvh!important}
  #sp-post-modal .sp-modal-body{padding-bottom:max(14px,env(safe-area-inset-bottom))!important}
}


/* V4.10.30 — full Messenger split-screen, no popup/reload */
@media(min-width:761px){
  body.sp-messages-route .sp-messenger-shell{display:grid!important;grid-template-columns:340px minmax(0,1fr)!important}
  body.sp-messages-route .sp-messenger-sidebar{display:flex!important;flex-direction:column!important}
  body.sp-messages-route .sp-messenger-thread{display:block!important;min-width:0!important}
  body.sp-messages-route .sp-messages-page.has-active-chat .sp-messenger-sidebar{display:flex!important}
  body.sp-messages-route .sp-messages-page.has-active-chat .sp-messenger-thread{display:block!important}
}
.sp-conversation-row.is-selected{background:#e8f1ff!important}
.sp-conversation-row.is-selected .sp-conversation-copy strong{color:#172033!important}
.sp-theme-dark .sp-conversation-row.is-selected{background:#26384f!important}
.sp-theme-dark .sp-conversation-row.is-selected .sp-conversation-copy strong{color:#e4e6eb!important}
body.sp-messages-route .sp-messenger-thread{position:relative!important}
body.sp-messages-route .sp-chat-active{height:100%!important}
body.sp-messages-route .sp-chat-scroll{min-height:0!important}
.sp-quick-chat{display:none!important}


/* V4.10.53 — cleaner forced Face + ID verification + AI pre-match */
.sp-unlock-v416.sp-unlock-identity-flow{background:#f5f7fb;color:#172033}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-topbar{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid #e5e9f0}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-page{max-width:780px;padding-top:30px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-card{border:1px solid #e1e6ee;border-radius:18px;background:#fff;box-shadow:0 18px 50px rgba(23,32,51,.07);overflow:hidden}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-intro{display:block;max-width:670px;margin:0 auto;padding:46px 46px 42px;text-align:center}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-intro-visual{display:none!important}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-copy{max-width:620px;margin:0 auto}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-copy>p{max-width:550px;margin-left:auto;margin-right:auto}
.sp-identity-flow-steps{display:grid;grid-template-columns:1fr 52px 1fr;align-items:center;gap:10px;margin:24px auto 20px;max-width:500px;text-align:left}
.sp-identity-flow-steps>span{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:13px 14px;border:1px solid #e1e6ee;border-radius:12px;background:#fafbfc}
.sp-identity-flow-steps>span b{grid-row:1/3;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e9eef6;color:#5f6b7d;font-size:13px}
.sp-identity-flow-steps>span em{font-style:normal;font-size:13px;font-weight:800;color:#202938}.sp-identity-flow-steps>span small{font-size:11px;color:#7b8798;margin-top:2px}
.sp-identity-flow-steps>span.is-active{border-color:#bed6ff;background:#f3f8ff}.sp-identity-flow-steps>span.is-active b{background:#0866ff;color:#fff}.sp-identity-flow-steps>i{height:2px;background:#dfe5ed;border-radius:99px}
.sp-unlock-v416 .sp-identity-clean-note{margin-top:0;text-align:left;border:0;background:#f7f9fc;border-radius:12px;padding:14px 16px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-method-panel{padding:32px 38px 36px;gap:16px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-panel-head{max-width:620px;margin:0 auto;text-align:center}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-panel-head p{max-width:560px;margin:0 auto}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-method-icon.is-id{margin:0 auto;width:50px;height:50px;border-radius:14px;background:#edf4ff;color:#0866ff}
.sp-unlock-v416 .sp-identity-complete-chip{max-width:560px;margin:0 auto;display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid #cdebd9;border-radius:10px;background:#f2fbf5;color:#206a42}
.sp-unlock-v416 .sp-identity-complete-chip>svg{width:22px;height:22px;flex:0 0 22px}.sp-unlock-v416 .sp-identity-complete-chip span{display:grid}.sp-unlock-v416 .sp-identity-complete-chip strong{font-size:13px}.sp-unlock-v416 .sp-identity-complete-chip small{font-size:11px;color:#58806a;margin-top:2px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-form{width:100%;max-width:580px;margin:0 auto;display:grid;gap:12px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-drop{border-width:1.5px;border-color:#cfd7e3;border-radius:12px;background:#fafbfc}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-drop:hover{border-color:#0866ff;background:#f7faff}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-preview{min-height:190px;padding:24px 20px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-preview img{max-height:230px}
.sp-face-id-match{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;padding:13px 14px;border:1px solid #dfe5ed;border-radius:12px;background:#fafbfc;transition:.18s ease}
.sp-face-id-match-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eef2f7;color:#5f6b7d}.sp-face-id-match-icon svg{width:23px;height:23px}
.sp-face-id-match-copy{display:grid;min-width:0}.sp-face-id-match-copy strong{font-size:13px;color:#202938}.sp-face-id-match-copy small{margin-top:3px;font-size:11.5px;line-height:1.45;color:#6d7888}
.sp-face-id-match>b{padding:6px 9px;border-radius:999px;background:#eef2f7;color:#627084;font-size:10px;white-space:nowrap}
.sp-face-id-match[data-state=checking]{border-color:#bcd5ff;background:#f4f8ff}.sp-face-id-match[data-state=checking] .sp-face-id-match-icon{background:#e3efff;color:#0866ff}.sp-face-id-match[data-state=checking]>b{background:#e3efff;color:#0866ff}
.sp-face-id-match[data-state=good]{border-color:#bfe4cd;background:#f2fbf5}.sp-face-id-match[data-state=good] .sp-face-id-match-icon{background:#dcf3e5;color:#20824d}.sp-face-id-match[data-state=good]>b{background:#dcf3e5;color:#1e7044}
.sp-face-id-match[data-state=error]{border-color:#f2bcc4;background:#fff5f6}.sp-face-id-match[data-state=error] .sp-face-id-match-icon{background:#ffe4e7;color:#c4374f}.sp-face-id-match[data-state=error]>b{background:#ffe4e7;color:#ad2f43}.sp-face-id-match[data-state=error] .sp-face-id-match-copy strong{color:#a8293d}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-tips{gap:7px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-tips span{background:#f7f9fc;border:1px solid #edf0f4;border-radius:8px}
.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-primary:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}
@media(max-width:640px){.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-page{padding:14px 8px 26px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-v414-card{border-radius:14px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-intro{padding:30px 20px}.sp-identity-flow-steps{grid-template-columns:1fr;gap:8px}.sp-identity-flow-steps>i{width:2px;height:12px;margin:-2px 0 -2px 30px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-method-panel{padding:24px 16px 28px}.sp-face-id-match{grid-template-columns:38px minmax(0,1fr)}.sp-face-id-match-icon{width:38px;height:38px}.sp-face-id-match>b{grid-column:2;justify-self:start;margin-top:-3px}.sp-unlock-v416.sp-unlock-identity-flow .sp-unlock-id-preview{min-height:165px}}


/* ==========================================================================\n   V4.10.93 — compact auto-hiding twittsocial.com video controls\n   ========================================================================== */
.sp-video-shell .sp-video-controls{
  left:12px!important;
  right:12px!important;
  bottom:9px!important;
  min-height:38px!important;
  gap:7px!important;
  padding:5px 7px!important;
  border-radius:10px!important;
  background:rgba(12,15,20,.82)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:0 5px 16px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(9px)!important;
  -webkit-backdrop-filter:blur(9px)!important;
  opacity:0!important;
  transform:translateY(7px)!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
}
.sp-video-shell.sp-player-started .sp-video-controls{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(7px)!important}
.sp-video-shell.sp-controls-visible .sp-video-controls,
.sp-video-shell.is-paused.sp-player-started .sp-video-controls,
.sp-video-shell .sp-video-controls:focus-within{
  opacity:1!important;
  transform:translateY(0)!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
.sp-video-shell .sp-vbtn{
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  border-radius:7px!important;
}
.sp-video-shell .sp-vbtn .sp-icon{width:17px!important;height:17px!important}
.sp-video-shell .sp-vtime{font-size:10.5px!important;font-weight:750!important;line-height:1!important}
.sp-video-shell .sp-vseek,.sp-video-shell .sp-vvolume{height:3px!important}
.sp-video-shell .sp-vseek{min-width:64px!important}
.sp-video-shell .sp-vvolume{width:58px!important;flex-basis:58px!important}
.sp-video-shell .sp-vseek::-webkit-slider-thumb,.sp-video-shell .sp-vvolume::-webkit-slider-thumb{width:11px!important;height:11px!important}
.sp-video-shell .sp-vseek::-moz-range-thumb,.sp-video-shell .sp-vvolume::-moz-range-thumb{width:11px!important;height:11px!important}
@media (max-width:800px){
  .sp-video-shell .sp-video-controls{left:7px!important;right:7px!important;bottom:7px!important;min-height:34px!important;gap:5px!important;padding:4px 6px!important;border-radius:9px!important}
  .sp-video-shell .sp-vbtn{width:26px!important;height:26px!important;flex-basis:26px!important}
  .sp-video-shell .sp-vbtn .sp-icon{width:16px!important;height:16px!important}
  .sp-video-shell .sp-vtime{font-size:9.5px!important}
  .sp-video-shell .sp-vvolume{display:none!important}
  .sp-video-shell .sp-vseek{min-width:40px!important}
}
